@font-face {
    font-family: Median-Regular;
    font-style: normal;
    src: url("./font/Median-Regular.otf") format("opentype");
    font-display: swap;
}

:root {
    --var-light-color-text: #000;
    --var-dark-color-text: #fff;
    --var-active-color-text: #CF0000;
    --var-active-color-text-hover: #880303;
    --bs-navbar-toggler-icon-bg-light: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 029' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    --bs-navbar-toggler-icon-bg-dark: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 25529' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    --bs-offcanvas-width-custom: 150px;
}

* {
    font-family: Median-Regular;
}

.navbar-toggler {
    border: none;
}

.custom-theme {
    position: relative;
    bottom: 10px;
}

footer {
    background-image: url("../img/footer-img.png");
}

.img-social {
    width: 15px;
    margin-right: 10px;
}
.offcanvas.offcanvas-end {
    width: var(--bs-offcanvas-width-custom);
    border:unset;
}
.offcanvas{
    background-color: unset;
    text-align: end;
}

.navbar-toggler:focus {
    box-shadow: unset;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: var(--var-active-color-text);
}

.nav-link {
    color: var(--var-dark-color-text);
}
.nav-link:focus, .nav-link:hover {
    color: var(--var-active-color-text);
}
.custom-link:hover{
    color: var(--var-active-color-text);
}

.vh-40{
    height: 40vh!important;
}

.vh-80{
    height: 80vh!important;
}

.vh-85{
    height: 85vh!important;
}

.vh-90{
    height: 90vh!important;
}

.logo-img {
    width: 60px;
    background-image: url("../img/logo/logo_style_light.png");
    display: inline-block;
}
.logo-img:hover{
    background-image: url("../img/logo/logo_red.png");
}
.about-me{
    font-size: 1.1em;
}
.button-sent{
    border: var(--bs-btn-border-width) solid var(--var-active-color-text);
    background-color: var(--var-active-color-text);
}
.button-sent:hover {
    background-color: var(--var-active-color-text-hover);
    border-color: var(--var-active-color-text-hover);
}