:root {
    --base-scale: calc(100vw / 75);

    --buttonMenu-width: max(1em, min(4em, calc(var(--base-scale) * 4)));
    --buttonMenu-width-icon: max(1em, min(5em, calc(var(--base-scale) * 5)));
    --h2-font-size: max(1.4em, min(4em, calc(var(--base-scale) * 4)));
    --small-font-size: max(0.5em, min(1em, calc(var(--base-scale) * 1)));
    --h2listings-font-size: max(1em, min(6em, calc(var(--base-scale) * 7)));
    --amenitiesBottomH2-font-size: max(1em, min(4em, calc(var(--base-scale) * 2.7)));
    --h3-header-font-size: max(1em, min(1.5em, calc(var(--base-scale) * 1)));
    --h1-font-size: max(1em, min(6em, calc(var(--base-scale) * 6)));
    --liMenu-font-size: max(1em, min(4em, calc(var(--base-scale) * 4)));
    --p-font-size: max(1.3em, min(1.7em, calc(var(--base-scale) * 1.3)));
    --li-dropdown-font-size: max(1.3em, min(1.5em, calc(var(--base-scale) * 1.1)));
    --dropdon-header-font-size: max(1.3em, min(1.9em, calc(var(--base-scale) * 1.5)));
    --pFooter-font-size: max(1em, min(1.4em, calc(var(--base-scale) * 1.4)));
    --h3-font-size: max(1em, min(3em, calc(var(--base-scale) * 3)));
    --h4-font-size: max(1.6em, min(2.5em, calc(var(--base-scale) * 2.3)));
    --button2-font-size: max(1.2em, min(1.7em, calc(var(--base-scale) * 1.7)));
    --buttonForm-font-size: max(1.2em, min(1.7em, calc(var(--base-scale) * 1.7)));
    --button-font-size: max(1.2em, min(1.7em, calc(var(--base-scale) * 1.7)));
    --footerImg-font-size: max(1em, min(25em, calc(var(--base-scale) * 25)));
    --HeaderImg-font-size: max(1em, min(20em, calc(var(--base-scale) * 20)));
    --HeaderIm2-font-size: max(1em, min(35em, calc(var(--base-scale) * 35)));
    --HeaderIm3-font-size: max(1em, min(35em, calc(var(--base-scale) * 35)));
    --pHeader-font-size: max(1em, min(2em, calc(var(--base-scale) * 1.5)));
    --widthArrow: max(1em, min(5em, calc(var(--base-scale) * 5)));
    --arrowMainTopImg: max(1em, min(5em, calc(var(--base-scale) * 5)));
    --marginMainTopText: max(1em, min(20em, calc(var(--base-scale) * 20)));


    --arrowBot-font-size: max(0.6em, min(1em, calc(var(--base-scale) * 1)));
    --lineHeightTop-font-size: max(1.1em, min(1em, calc(var(--base-scale) * 1)));
    --lineHeightTop2-font-size: max(1em, min(7em, calc(var(--base-scale) * 7)));
    --marginHeaderR-font-size: max(1em, min(3em, calc(var(--base-scale) * 3)));
    --marginHeaderL-font-size: max(1em, min(5em, calc(var(--base-scale) * 5)));
    --paddingButtonHeader: max(1em, min(6em, calc(var(--base-scale) * 6)));
    --paddingButtonHeaderMob: max(1em, min(3em, calc(var(--base-scale) * 3)));
    --paddingButtonHeader2: max(1em, min(16em, calc(var(--base-scale) * 8)));

    --h2popupRU: max(1em, min(3.5em, calc(var(--base-scale) * 3.5)));
    --input-fon-size: max(1em, min(1em, calc(var(--base-scale) * 1)));
}


.d--opacity {
    opacity: 0;
    z-index: -10;
    transition: all .8s ease;
}

.d--opacity2 {
    opacity: 10;
    transition: all .8s ease;
}


@font-face {
    font-family: "CL";
    src: url("/static/main/fonts/Cormorant-Light.ttf") format("truetype");
}

@font-face {
    font-family: "CM";
    src: url("/static/main/fonts/Cormorant-Medium.ttf") format("truetype");
}


@font-face {
    font-family: "CR";
    src: url("/static/main/fonts/Cormorant-SemiBold.ttf") format("truetype");
}


@font-face {
    font-family: "Mont";
    src: url("/static/main/fonts/Montserrat-Regular.ttf") format("truetype");
}

body {
    font-size: 12px;
    font-family: "CL", sans-serif;
    color: rgba(33, 37, 41, 1);
    transition: all .6s ease;
}

.body::-webkit-scrollbar, html::-webkit-scrollbar {
    width: 3px;
    background-color: #f9f9fd;
}

.body::-webkit-scrollbar-thumb, html::-webkit-scrollbar-thumb {
    background-color: rgba(40, 65, 62, 1);
}

.buttonMenu {
    width: var(--buttonMenu-width);
}

.buttonMenuIcon {
    width: var(--buttonMenu-width-icon);
}

.d--none {
    display: none;
}

small {
    color: #a1a1a1;
}

h1 {
    font-size: var(--h1-font-size);
}

h2 {
    font-size: var(--h2-font-size);
}

h3 {
    font-size: var(--h3-font-size);
}

h4 {
    font-size: var(--h4-font-size);
}

p {
    font-size: var(--p-font-size);
}

table {
    font-size: var(--p-font-size);
}

.dropdown-toggle {
    font-size: var(--dropdon-header-font-size)!important;
}

.dropdown-menu li a {
    font-size: var(--li-dropdown-font-size)!important;
}

.pHeader p {
    font-size: var(--pHeader-font-size);
}

a {
    transition: all 600ms ease;
}

input {
    font-size: var(--input-fon-size);
}

.form-select {
    font-size: var(--input-fon-size);
}

button {
    font-family: "CL", sans-serif!important;
    font-size: var(--button-font-size);
}


/*---------------button---------------*/
.btn--btn {
    border: 0;
    font-family: "CL", sans-serif;
    color: white;
    background: #28413E;
    padding: 13px 35px;
    text-decoration: none;
    transition: all 600ms ease;
}

.btn--btn:hover {
    background: #5C908A;
    transform: scale(1.05);
}

.btn--btn-popup {
    border: 0;
    font-family: "CL", sans-serif;
    color: white;
    background: #28413E;
    padding: 7px 38px;
    text-decoration: none;
    transition: all 600ms ease;
    font-size: var(--button2-font-size);
}

.btn--btn-popup:hover {
    background: #5C908A;
    transform: scale(1.05);
}

.btn--btn2 {
    font-size: var(--button2-font-size);
    border: 0;
    font-family: "CL", sans-serif;
    color: white;
    background: #28413E;
    padding: 13px 35px;
    text-decoration: none;
    transition: all 600ms ease;
    white-space: nowrap;
}

.btn--btn2:hover {
    background: #5C908A;
    transform: scale(1.05);
}


@keyframes sputnik {
    0% {
        background: #28413E;
    }
    100% {
        background: #5C908A;
    }
}

.btn--btnSputnik {
    border: 0;
    font-family: "CL", sans-serif;
    color: white;
    background: #28413E;
    padding: 13px 35px;
    text-decoration: none;
    animation: sputnik 1.5s ease-out infinite alternate;
}

@media (max-width: 992px) {
    .btn--btn {
        border: 0;
        font-family: "CL", sans-serif;
        color: white;
        background: #28413E;
        padding: 10px 30px;
        text-decoration: none;
        transition: all 600ms ease;
    }

    .btn--btn:hover {
        background: #5C908A;
        transform: scale(1.05);
    }

    .btn--btn2 {
        font-family: "CL", sans-serif;
        font-size: var(--button2-font-size);
        border: 0;
        color: white;
        background: #28413E;
        padding: 10px 30px;
        text-decoration: none;
        transition: all 600ms ease;
        white-space: nowrap !important;
    }

    .btn--btn2:hover {
        background: #5C908A;
        transform: scale(1.05);
    }

}

/*---------------button---------------*/
/*=============other===========*/
.sizeFooterImg {
    width: var(--footerImg-font-size);
}

.sizeHeaderImg {
    width: var(--HeaderImg-font-size);
}


.arrowBot {
    position: relative;
    bottom: 0.5em;
    width: var(--arrowBot-font-size);
}

.contacts h2 {
    font-size: var(--h2listings-font-size);
}

.amenitiesBottomH2 {
    font-size: var(--amenitiesBottomH2-font-size);
}

.amenitiesUnderline {
    border-bottom: 3px solid #28413E;
}

@media (max-width: 992px) {
    .amenitiesUnderline {
        border-bottom: 1px solid #28413E;
    }
}

@media (min-width: 992px) {
    .residencesH2 {
        font-size: var(--amenitiesBottomH2-font-size)
    }
}

.pFooter p {
    font-size: var(--pFooter-font-size);
}

.term {
    font-size: var(--p-font-size);
}

.fixed {
    position: fixed!important;
    top: 0;
    left: 0;
    right: 0;
    background: #EDEDED!important;
}

@media (min-width: 1410px) {
    .dNone1410 {
        display: none!important;
    }
}