:root {
    --link-color: #274760;
    --link-hover-color: #307bc4;

    --btn-color: #2490eb;
    --btn-hover-color: #60a6e1;

    --red: #eb493b;
}

body {
    font-family: var(--text-font);
}

h1,h2,h3,h4,h5,h6 {
    font-family: var(--title-font);
}

.input-wrap {
    position: relative;
}

.nm-label {
    /* margin-bottom: 10px; */
    width: 100%;
    position: absolute;
    top: 16px;
    left: 20px;
    cursor: text;
    transition: .3s;
    user-select: none;
}

.nm-label,
.form-notes {color: #8a9bc1;}

.nm-label .required,
.form-notes .required {color: #274760;}

.nm-label.focused {
    top: -22px;
    left: 10px;
    cursor: default;
    font-size: 14px;
    /* color: #274760; */
}

.nm-input {
    border: 1px solid #97bde1;
    padding: 16px 20px;
    border-radius: 15px;
    display: block;
    width: 100%;
    outline: none;
    background: transparent;
    color: #274760;
}

.nm-input.nm-field-invalid {
    border-color: var(--red);
}

.error-field {
    position: absolute;
    top: 100%;
    left: 10px;
    font-size: 13px;
    color: var(--red);
}

.nm-button {
    padding: 16px 20px;
    border-radius: 15px;
    font-weight: bold;
    background-color: var(--btn-color);
    color: #fff;
    transition: background-color .3s;
    border: none;
    text-decoration: none;
}

.nm-button.bordered {
    border: 1px solid var(--btn-color);
}

.nm-button:hover {
    background-color: var(--btn-hover-color);
}

.link {
    color: var(--link-color);
    position: relative;
    text-decoration: none;
    transition: color .3s;
}

.link:hover {color: var(--link-hover-color);}

.link.l-underline:before {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 0;
    height: 1px;
    background-color: var(--link-color);
    transition: width .3s ease-in-out;
}

.link.l-underline:hover {color: var(--link-color);}
.link.l-underline:hover:before {width: 100%;}

header {
    --header-fixed-height: 80px;
    --header-height: var(--header-fixed-height);

    position: fixed;
    width: 100%;
    height: var(--header-height);
    background-color: transparent;
    top: 0;
    left: 0;
    z-index: 999;
    transition: height .3s, background-color .3s;
}

header > .container,
header > .container > .position-relative {
    height: var(--header-fixed-height);
    transition: height .3s;
}

header .left-side,
header .right-side {
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

header .left-side {left: 0;}
header .right-side {right: 0;}

header .logo {
    display: block;
    height: var(--header-fixed-height);
    padding: 8px 0;
    transition: height .3s;
}

header .logo img {
    height: 100%;
    transition: height .3s;
}

header .nav {
    display: flex;
    justify-content: center;
    width: 100%;
}

header .nav a {
    display: block;
    padding: 0 20px;
    font-size: 18px;
    line-height: var(--header-fixed-height);
    text-decoration: none;
    color: var(--link-color);
    transition: color .3s, line-height .3s;
}

header .nav a:hover {color: var(--link-hover-color);}

header .right-side .dropdown button svg {
    width: 10px;
    margin-left: 5px;
}

header .nm-button {
    padding-top: 10px;
    padding-bottom: 10px;
}

header .mobile-nav-btn {
    display: none;
    width: 35px;
    height: 30px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    transition: .3s ease-in-out;
    cursor: pointer;
    z-index: 999;
}

header .mobile-nav-btn span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: var(--btn-color);
    opacity: 1;
    left: 0;
    transition: .35s ease-in-out;
}

header .mobile-nav-btn span:nth-child(1) {top: 0px;}

header .mobile-nav-btn span:nth-child(2),
header .mobile-nav-btn span:nth-child(3) {top: 12px;}

header .mobile-nav-btn span:nth-child(4) {top: 24px;}

header .mobile-nav-btn.open span:nth-child(1) {
    top: 12px;
    width: 0%;
    left: 50%;
}

header .mobile-nav-btn.open span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

header .mobile-nav-btn.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

header .mobile-nav-btn.open span:nth-child(4) {
    top: 18px;
    width: 0%;
    left: 50%;
}

header.sticky,
header.open {
    background-color: #fff;
}

header.sticky {
    border-bottom: 1px solid #e5e6e8;
    --header-fixed-height: 60px;
}

header.open {--header-height: 100vh; transition: none;}

header.open .nav {
    display: block;
    padding-top: calc(var(--header-fixed-height) + 20px);
    width: 100%;
}

header.open .nav a {
    line-height: normal;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
}

header.open .locale-menu {
    display: block;
}

header.open .right-side {
    position: static;
    display: flex;
    justify-content: center;
}

header.open .locale-menu > .btn {
    position: relative;
}

header.open .locale-menu > .btn:before {
    content: attr(data-mobile-text)':';
    margin-right: 5px;
    font-weight: bold;
    color: var(--link-color);
}

footer {
    color: #686c78;
}

.footer-main {
    padding: 50px 0;
}

.footer-main .logo {
    display: inline-block;
    height: 70px;
}

.footer-main .company-slogan {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    color: var(--title-color);
}

.footer-main .logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.footer-main h2 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 40px;
    text-transform: capitalize;
    color: var(--title-color);
    position: relative;
}

.footer-main h2:before {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 45px;
    height: 2px;
    background-color: #d2eaef;
}

.contacts,
.footer-main ul {
    margin: 0;
    padding: 0;
}

.contacts li,
.footer-main ul li {
    list-style: none;
    margin-bottom: 10px;
    font-size: 15px;
    line-height: 26px;
    display: flex;
    align-items: center;
    color: var(--link-color);
}

.contacts li .icon,
.footer-main ul li .icon {
    width: 46px;
    height: 46px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #cbcbcb;
    font-size: 18px;
    margin-right: 10px;
    color: var(--link-color);
}

.contacts li .label,
.footer-main ul li .label {
    font-size: 13px;
    line-height: 18px;
    color: #8D9097;
}

.footer-main .contacts .row-wrap {flex: 1;}

.footer-main .quick-links {
    display: flex;
}

.footer-main .quick-links ul {
    width: 50%;
}

.footer-main .quick-links ul li {
    padding-right: 15px;
}

.footer-main,
.footer-copy {
    border-top: 1px solid #e5e6e8;
}

.footer-copy {
    padding: 26px 0 34px;
    font-size: 14px;
}

.footer-copy .social-btn {
    color: #7b7e86;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 1px solid #cbcbcb;
    background-color: transparent;
    margin-left: 8px;
    transition: color .3s, border-color .3s, background-color .3s;
}

.footer-copy .social-btn:first-child {margin-left: 0;}

.footer-copy .social-btn:hover {
    color: #307BC4;
    background-color: #d2eaef;
    border-color: #d2eaef;
}

.contacts-page {
    padding-top: 150px !important;
}

.contacts-page h2 {
    font-size: 22px;
    color: var(--title-color);
    font-weight: bold;
    margin-bottom: 30px;
}

.contacts-page textarea {
    height: 100px;
    resize: vertical;
}

.contacts-page .success-message {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    color: var(--title-color);
    font-weight: bold;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visiblity .3s;
}

.contacts-page .success-message.error {
    color: var(--red);
}

.contacts-page .success-message.visible {
    opacity: 1;
    visibility: visible;
}

#contactForm {position: relative;}
#contactForm > .row {transition: filter .5s;}
#contactForm textarea {height: 130px;}
#contactForm.success > .row {filter: blur(3px);}

#gmap {
    height: 550px;
}

#contactForm .submit-btn .spinner-border {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem;
    --bs-spinner-border-width: 2px;
    margin-right: 5px;
    display: none;
}

#contactForm .submit-btn.loading .spinner-border {display: inline-block;}

#contactForm .submit-btn.loading {
    pointer-events: none;
    opacity: .5;
}




/* HELPERS */
.bold, b, strong {font-weight: bold !important;}
.italic, i:not([class^="fa-"]) {font-style: italic !important;}
.uppercase {text-transform: uppercase !important;}
.strikethrough {text-decoration: line-through !important;}
/* p {line-height: normal;} */

ul.s-none {list-style: none;}
ul.circle {list-style: circle;}

.v-align-center {vertical-align: middle;}
.ovf-hidden {overflow: hidden !important;}
.ovf-visible {overflow: visible !important;}
.flex-none {flex: none !important;}
.flex-wrap {flex-wrap: wrap !important;}
.flex-column {flex-direction: column !important;}

.p-fixed {position: fixed !important;}
.p-relative {position: relative !important;}

.t-center {text-align: center !important;}
.t-left {text-align: left !important;}
.t-right {text-align: right !important;}

.w-100 {width: 100% !important;}
.w-50 {width: 50% !important;}
.w-25 {width: 25% !important;}
.w-auto {width: auto !important;}
.h-100 {height: 100% !important;}

.f-11 {font-size: 11px !important;}
.f-12 {font-size: 12px !important;}
.f-13 {font-size: 13px !important;}
.f-14 {font-size: 14px !important;}
.f-15 {font-size: 15px !important;}
.f-16 {font-size: 16px !important;}
.f-18 {font-size: 18px !important;}
.f-20 {font-size: 20px !important;}
.f-24 {font-size: 24px !important;}
.f-30 {font-size: 30px !important;}
.f-40 {font-size: 40px !important;}
.f-50 {font-size: 50px !important;}

/* .m-0 {margin: 0px !important;}
.mt-0 {margin-top: 0px !important;}
.mb-0 {margin-bottom: 0px !important;}
.ml-0 {margin-left: 0px !important;}
.mr-0 {margin-right: 0px !important;}
.mh-0 {margin-left: 0px !important; margin-right: 0px !important;}
.mv-0 {margin-top: 0px !important; margin-bottom: 0px !important;}

.m-5 {margin: 5px !important;}
.mt-5 {margin-top: 5px !important;}
.mb-5 {margin-bottom: 5px !important;}
.ml-5 {margin-left: 5px !important;}
.mr-5 {margin-right: 5px !important;}
.mh-5 {margin-left: 5px !important; margin-right: 5px !important;}
.mv-5 {margin-top: 5px !important; margin-bottom: 5px !important;} */

.m-10 {margin: 10px !important;}
.mt-10 {margin-top: 10px !important;}
.mb-10 {margin-bottom: 10px !important;}
.ml-10 {margin-left: 10px !important;}
.mr-10 {margin-right: 10px !important;}
.mh-10 {margin-left: 10px !important; margin-right: 10px !important;}
.mv-10 {margin-top: 10px !important; margin-bottom: 10px !important;}

.m-20 {margin: 20px !important;}
.mt-20 {margin-top: 20px !important;}
.mb-20 {margin-bottom: 20px !important;}
.ml-20 {margin-left: 20px !important;}
.mr-20 {margin-right: 20px !important;}
.mh-20 {margin-left: 20px !important; margin-right: 20px !important;}
.mv-20 {margin-top: 20px !important; margin-bottom: 20px !important;}

.m-30 {margin: 30px !important;}
.mt-30 {margin-top: 30px !important;}
.mb-30 {margin-bottom: 30px !important;}
.ml-30 {margin-left: 30px !important;}
.mr-30 {margin-right: 30px !important;}
.mh-30 {margin-left: 30px !important; margin-right: 30px !important;}
.mv-30 {margin-top: 30px !important; margin-bottom: 30px !important;}

.m-40 {margin: 40px !important;}
.mt-40 {margin-top: 40px !important;}
.mb-40 {margin-bottom: 40px !important;}
.ml-40 {margin-left: 40px !important;}
.mr-40 {margin-right: 40px !important;}
.mh-40 {margin-left: 40px !important; margin-right: 40px !important;}
.mv-40 {margin-top: 40px !important; margin-bottom: 40px !important;}

.m-50 {margin: 50px !important;}
.mt-50 {margin-top: 50px !important;}
.mb-50 {margin-bottom: 50px !important;}
.ml-50 {margin-left: 50px !important;}
.mr-50 {margin-right: 50px !important;}
.mh-50 {margin-left: 50px !important; margin-right: 50px !important;}
.mv-50 {margin-top: 50px !important; margin-bottom: 50px !important;}

.p-0 {padding: 0px !important;}
.pt-0 {padding-top: 0px !important;}
.pb-0 {padding-bottom: 0px !important;}
.pl-0 {padding-left: 0px !important;}
.pr-0 {padding-right: 0px !important;}
.ph-0 {padding-left: 0px !important; padding-right: 0px !important;}
.pv-0 {padding-top: 0px !important; padding-bottom: 0px !important;}

.p-5 {padding: 5px !important;}
.pt-5 {padding-top: 5px !important;}
.pb-5 {padding-bottom: 5px !important;}
.pl-5 {padding-left: 5px !important;}
.pr-5 {padding-right: 5px !important;}
.ph-5 {padding-left: 5px !important; padding-right: 5px !important;}
.pv-5 {padding-top: 5px !important; padding-bottom: 5px !important;}

.p-10 {padding: 10px !important;}
.pt-10 {padding-top: 10px !important;}
.pb-10 {padding-bottom: 10px !important;}
.pl-10 {padding-left: 10px !important;}
.pr-10 {padding-right: 10px !important;}
.ph-10 {padding-left: 10px !important; padding-right: 10px !important;}
.pv-10 {padding-top: 10px !important; padding-bottom: 10px !important;}

.p-20 {padding: 20px !important;}
.pt-20 {padding-top: 20px !important;}
.pb-20 {padding-bottom: 20px !important;}
.pl-20 {padding-left: 20px !important;}
.pr-20 {padding-right: 20px !important;}
.ph-20 {padding-left: 20px !important; padding-right: 20px !important;}
.pv-20 {padding-top: 20px !important; padding-bottom: 20px !important;}

.p-30 {padding: 30px !important;}
.pt-30 {padding-top: 30px !important;}
.pb-30 {padding-bottom: 30px !important;}
.pl-30 {padding-left: 30px !important;}
.pr-30 {padding-right: 30px !important;}
.ph-30 {padding-left: 30px !important; padding-right: 30px !important;}
.pv-30 {padding-top: 30px !important; padding-bottom: 30px !important;}

.p-40 {padding: 40px !important;}
.pt-40 {padding-top: 40px !important;}
.pb-40 {padding-bottom: 40px !important;}
.pl-40 {padding-left: 40px !important;}
.pr-40 {padding-right: 40px !important;}
.ph-40 {padding-left: 40px !important; padding-right: 40px !important;}
.pv-40 {padding-top: 40px !important; padding-bottom: 40px !important;}

.p-50 {padding: 50px !important;}
.pt-50 {padding-top: 50px !important;}
.pb-50 {padding-bottom: 50px !important;}
.pl-50 {padding-left: 50px !important;}
.pr-50 {padding-right: 50px !important;}
.ph-50 {padding-left: 50px !important; padding-right: 50px !important;}
.pv-50 {padding-top: 50px !important; padding-bottom: 50px !important;}