.width-100vw {width: 100vw}
.pb-250 {padding-bottom: 250px}
.pb-200 {padding-bottom: 200px}
.pt-100 {padding-top: 100px}
.pt-200 {padding-top: 200px}
.position-inherit {position: inherit}
.container-padding {padding-left: 15px; padding-right: 15px}
.container-fluid.w-90 {width:90%}
.border-radius-10 {border-radius: 10px}
.border-radius-10-half {
    border-radius: 10px 0px 0px 10px;
}
.opacity-half {opacity: 0.5}
@media (max-width: 768px) {
    .border-radius-10-half {
        border-radius: 0px;
    }
}


@media (max-width: 767px) {
    .text-right, .text-left {
        text-align: left !important;
    } 
    .pb-250 {padding-bottom: 75px}
    .pb-200 {padding-bottom: 75px}
    .container-fluid.w-90 {width:100%}
    .btn {padding: 10px 10px;}
}
@media (max-width: 576px) {
    .pt-100 {padding-top: 60px}
    .pt-200 {padding-top: 100px}
}
.slider-main-reveal {margin-top: 80px}
@media (max-width: 1541px) {
    .slider-main-reveal {margin-top: 0px} 
}
.slider-content {margin-top: 0px}
@media (max-width: 1540px) {
    .slider-content {margin-top: 100px} 
}

/*брендирование*/
.text-brand {color: #0D1D2C}
.text-brand-2 {color: #FF9DB4}
.bg-brand-1 {
    background: linear-gradient(to bottom, #FFF 0%, #FFF 50%, #FFF6DF 50%, #FFF6DF 100%);
}
.bg-masked-1 {background: url(../img/page/mask.webp) left bottom repeat #FFF;  background-size: 100%;}
.bg-masked-2 {background: url(../img/page/mask-1.webp) left bottom repeat #FFF;  background-size: 100%;}
.bg-masked-3 {background: url(../img/page/mask-2.webp) left bottom repeat #FFF;  background-size: 100%;}
.bg-masked-4 {    background: url(../img/page/mask-3.webp) left bottom repeat transparent;
    background-size: 100%;}
.bg-brand-2 {
    background: #FFECF4;
}
.bg-brand-3 {
    background: linear-gradient(to bottom, #FFF6DF 0%, #FFF6DF 70%, #FFF 70%, #FFF 100%);
}
@media (max-width: 992px) {
   .bg-brand-3 {
    background: linear-gradient(to bottom, #FFF6DF 0%, #FFF6DF 60%, #FFF 60%, #FFF 100%);
} 
}
@media (max-width: 767px) {
   .bg-brand-3 {
    background: linear-gradient(to bottom, #FFF6DF 0%, #FFF6DF 70%, #FFF 70%, #FFF 100%);
} 
}
.bg-brand-4 {
    background: #E8ECFF;
}
.brand-bordered {background: #FFECF4; border-radius: 24px; height:100%}
.brand-bordered .logo {max-width: 250px}
@media (max-width: 767px) {
    .brand-bordered .logo {max-width: 180px}
}
.house-main-img {position: relative}
.s-image {position: absolute; top:0px; height: 100%;width: 100%}
.s-image img {
    max-height: 75%;
    margin-left: auto;
    margin-right: auto;
    display: block; 
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%); }

/*заголовки*/
h2.text-brand-title {font-size: 60px;}

@media (max-width: 1480px) {
    h2.text-brand-title {font-size: 50px;}
    h3 {font-size: 30px;}
}
@media (max-width: 992px) {
    h2.text-brand-title {font-size: 32px;}
    h3 {font-size: 26px;}
}


/*кнопки */
@media (max-width: 767px) {
    .offer-button {background-color: #FFC068}  
}
.offer-button-secondary {background-color: #FF9DB4; font-size: 16px; padding: 15px 40px;}
.offer-button-secondary:hover {background-color: #A1A5FF}

.callback-button {background-color: #FFC068; font-size: 16px; padding: 15px 40px; max-width: 100%; width: 300px}
.callback-button:hover {background-color: #A1A5FF}

.esthetics-image  {position: relative; bottom:-40px; z-index: 200}
.moved-down-block {position: relative; bottom:-120px; z-index: 200}

.moved-down-block img {border-radius:  0 0 0 150px;  background:transparent }
@media (max-width: 767px) {
    .moved-down-block {
        position: initial;
        background: linear-gradient(to bottom, #FFECF4 0%, #FFECF4 30%, #FFF 30%, #FFF 100%);
    }
}

.fat-button {
    position: relative;
}
.fat-button {
    border: none;
    background: none;
    padding: 0;
    position: relative;
}
.fat-button {position: absolute; bottom:-92%; right: 24%; z-index: 200;}
@media (max-width: 1700px) {
    .fat-button {position: absolute; bottom:-28%; right: 25%; z-index: 200;}
}
@media (max-width: 1199px) {
    .fat-button {position: absolute; bottom:-28%; right: 44%; z-index: 200; width: 236px; height: auto}
}
@media (max-width: 992px) {
    .fat-button {position: absolute; bottom:-12%; right: -57%; z-index: 200; width: 217px; height: auto}
}
@media (max-width: 425px) {
    .fat-button {position: absolute; bottom:-183%; right: 3%; z-index: 200; width: 239px; height: auto;}
}
@media (max-width: 400px) {
    .fat-button {position: absolute; bottom:-136%; right: 3%; z-index: 200; width: 209px; height: auto;}
}
@media (max-width: 320px) {
    .fat-button {position: absolute; bottom:-112%; right: 15%; z-index: 200; width: 160px; height: auto;}
}

.lady-top {
    position: absolute;
    display: flex;
    right: 20%;
    top: -10%;
    z-index: 201;
}
.lady-top img {width: 360px}

@media (max-width: 1700px) {
    .lady-top {
        right: 5%;
        top: -10%;
    }
}
@media (max-width: 1450px) {
    .lady-top {
        right: 1%;
        top: -10%;
    }
}

@media (max-width: 1199px) {
    .lady-top {
        right: 1%;
        top: 1%;
    }
    .lady-top img {width: 240px}
}
@media (max-width: 992px) {
    .lady-top {
        right: 1%;
        top: 1%;
    }
    .lady-top img {width: 180px}
}

.plans-button {padding: 22px 27px 22px 27px; font-size: 20px}
@media (max-width: 767px) {
    .plans-button, .offer-button-orange {padding: 18px 25px 18px 25px; font-size: 16px}   
}
.infrastructure-button {background-color: #FFAF56; color:#444241; font-weight: 600}
.infrastructure-button:hover {background-color:#7B97DF}
.phone-link {font-size: 20px; color: #0D1D2C; font-family: 'Golos Text';}
.menu-container .phone-link {font-size: 26px;}
@media (max-width: 1479px) {
    .phone-link {font-size: 16px;}
}
@media (max-width: 1199px) {
    .phone-link {font-size: 20px;}
}
.is-menu-open .phone-link {color: #444241}

@media only screen and (max-width:1199px){
    .menu-anchor {
        display: none;
    }
}
.menu-open {
    position: absolute;
    top: 30px;
    right: 13px;
}

.sns-block {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: flex-start;
}
.sns-block-mobile {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;

}

.sns-block a,.sns-block-mobile  a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: 0 0 0 0px #FFF inset !important;
    box-shadow: 0 0 0 0px #FFF inset !important;
    border-radius: 7px;
    width: 100%;
    height: 100%;
    font-size: 17px;
    -webkit-transition: -webkit-box-shadow 650ms cubic-bezier(0.215, 0.61, 0.355, 1) !important;
    transition: -webkit-box-shadow 650ms cubic-bezier(0.215, 0.61, 0.355, 1) !important;
    transition: box-shadow 650ms cubic-bezier(0.215, 0.61, 0.355, 1) !important;
    transition: box-shadow 650ms cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-box-shadow 650ms cubic-bezier(0.215, 0.61, 0.355, 1) !important;
}
.sns-block a img {width: 34px;}
.sns-block-mobile a img {width: 28px; height: 28px}
.sns-block .social-item {
    width: 34px;
    height: 35px;
    border-radius: 50%;
    margin-right: 0px;
}
.sns-block-mobile .social-item {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    margin-right: 0px;
}
.sns-block .social-item:hover a,.sns-block-mobile .social-item:hover a {
    color: white !important;
    -webkit-box-shadow: 0 0 0 26px #7B97DF inset !important;
    box-shadow: 0 0 0 0px #7B97DF inset !important;

}
@media only screen and (max-width:1199px){
    .menu-anchor {
        display: none;
    }
}


.offer-item {display: flex;
                              flex-direction: column;
                              flex-wrap: nowrap;
                              align-items: flex-start;
                              justify-content: center;}

.offer-item h4,.offer-item-1 h4 {font-family: 'Golos Text'; font-size: 22px; font-weight: 700; color: #444241}
.offer-item-title {display: flex;
                                         flex-direction: column;
                                         flex-wrap: nowrap;
                                         align-items: flex-start;
                                         justify-content: center;}
.offer-image-big img {border-radius: 15px}
@media only screen and (max-width:767px){
    
    .offer-item {display: flex
                     ;
                 flex-direction: column;
                 flex-wrap: nowrap;
                 align-items: flex-start;
                 justify-content: flex-start;
    } 
    .offer-image {width:79px; height:79px}
    .offer-image-big img {border-radius: 15px}
    .offer-item h4,.offer-item-1 h4 {font-size: 18px}
}

.offer-item-1 {display: flex
;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;}
@media only screen and (max-width:767px){
  .offer-item-1 {display: flex
;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;  
}
.offer-item-1 .offer-image img {width: 62px; height:62px}
}
.porch-item {border: 1px solid #0D1D2C; border-radius: 15px}

.porch-item::before{
    content: '';
    position: absolute;
    top: 10%;
    right: 7%;
    background: url(../img/page/s-porch.webp) no-repeat;
    width: 44px;
    height: 44px;
}
.porch-item-invert {background: #A1A5FF; border-radius: 15px}
.porch-item-invert::before{
    content: '';
    position: absolute;
    top: 10%;
    right: 7%;
    background: url(../img/page/s-porch-invert.webp) no-repeat;
    width: 44px;
    height: 44px;
}
.porch-item-image {position: relative}

.porch-image {position: relative; z-index: 10; border-radius: 18px; top:150px}
.porch-image img {border-radius: 18px}
.porch-item-image .porch-item-invert {position: relative;
    bottom: 100px;
    left: 15px;
    z-index: 20;}

@media only screen and (max-width:1199px){
   .porch-item-image .text-lead,.porch-item .text-lead {font-size: 16px} 
   .porch-image {top:-30px}
   .porch-item-image .porch-item-invert {bottom:250px}
   .porch-item-image {
    position: relative;
    margin-bottom: -200px;
}
}
@media only screen and (max-width:992px){
   .porch-image {top:80px}
   .porch-item-image .porch-item-invert {width: 50%; right: 0px}
   .porch-item-image .porch-item-invert {
        width: 70%;
        left: 44%;
    }
    .porch-item-image {
    position: relative;
    margin-bottom: -50px;
}
}
@media only screen and (max-width: 768px) {
    .porch-item-image .porch-item-invert {
        width: 95%;
        left: 10%;
    }
}
@media only screen and (max-width: 576px) {
    .porch-item-image .porch-item-invert {
        width: 95%;
        left: 10%;
        top:-100px;
    }
}

.footer-menu {width: 100%}
.footer-menu .menu-anchor-list li a {font-size: 18px}
.footer-menu .menu-anchor-list li a::before {color: #444241 !important}
.footer-menu .menu-anchor ul {width: 100%}
.footer-menu .menu-anchor ul li {opacity: 1}
.footer-menu  .menu-anchor-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.footer p {opacity:0.5}
.footer .logo.edinstvo img{width: 180px}


.contact-form .form-control, #callback .form-control {
    background-color: #FFF;
    border: 1px solid #0D1D2C;
    border-radius: 10px;
    height:58px;
    color: #0D1D2C;
    width:300px;
    max-width: 100%

}
.contact-form .form-control::placeholder, #callback .form-control::placeholder {
    color: #444241
}
#callback .form-control {
    margin: 0 auto;
}
@media only screen and (max-width:767px){
    .contact-form .form-control, #callback .form-control {
        background-color: #FFF;
        border: 1px solid #0D1D2C;
        margin: 0 auto;
    }

}
.bottom-phone-link {font-size:35px}
@media only screen and (max-width: 767px) {
 .bottom-phone-link {font-size:26px}   
}
@media only screen and (max-width: 1399px) {
    .footer-menu .menu-anchor {
        display: flex;
    }
    .footer-menu .menu-anchor-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: wrap;
        align-content: center;
    }
    .footer-menu .menu-anchor-list li {margin-right: 15px}
}

#toast-container {    z-index: 4999 !important;}
.toast {max-width: 100% !important; }

.toast-info {background-color: #A1A5FF !important}

@media (max-width: 767px) and (min-width: 241px) {
    #toast-container .toast-message {
        line-height: 11px;
        font-size: 80%;
    }
}

#callback .modal-header,#booklet .modal-header {display:none}


#callback .close,#booklet .close {
    cursor: pointer;
    position: absolute;
    top: -42%;
    right: -23%;
    background-color: #A1A5FF;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    color: white;
    opacity: 1;
}
#callback .close:hover,#booklet .close:hover {
    background-color: #FFC068; 
}
#callback .close:focus,#booklet .close:focus {
    outline: none !important;
}
#callback .close span,#booklet .close span{font-size: 48px;
                                           line-height: 34px; font-family: "Golos Text"}

@media only screen and (max-width: 1480px) {
    #callback .close,#booklet .close { 
        top: -52%;
    right: -23%;
    } 
}
@media only screen and (max-width: 1199px) {
    #callback .close,#booklet .close { 
        top: -62%;
        right: -11%;
    } 
}
@media only screen and (max-width: 1024px) {
    #callback .close,#booklet .close { 
        top: -64%;
        right: -11%;
    } 
}
@media only screen and (max-width: 992px) {
    #callback .close,#booklet .close { 
        top: -47%;
        right: -19%;
    } 
}

@media only screen and (max-width: 768px) {
    
    #callback .close,#booklet .close { 
        top: -47%;
        right: -19%;
    } 
}
@media only screen and (max-width: 576px) {

    #callback .close,#booklet .close { 
        top: -23%;
        right: -7%;
    } 
}

#contact_map ymaps canvas, #object_map ymaps canvas{
    filter: grayscale(100%); /* Current draft standard */
    -webkit-filter: grayscale(100%); /* New WebKit */
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%); 
    -o-filter: grayscale(100%); /* Not yet supported in Gecko, Opera or IE */ 
    filter: url(resources.svg#desaturate); /* Gecko */
    filter: gray; /* IE */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

.map__holder.js-map-holder.small-height{
    height: 700px; }

.infrastructure-item {display: flex;
                      flex-direction: row;
                      flex-wrap: nowrap;
                      align-content: center;
                      align-items: center;
                      justify-content: flex-start;}
.infrastructure-title {font-size: 16px; font-weight: 500; font-family: "Golos Text"}

@media only screen and (max-width: 1024px) {
    .infrastructure-image img{max-width: 48px; height:auto}
}
@media only screen and (max-width: 576px) {

    .infrastructure-image img{max-width: 48px; height:auto} 
    .infrastructure-title {font-size: 14px; font-weight: 500; font-family: "Golos Text"}
}
.copyright a {cursor:pointer; color:  #7B97DF !important;}
:root {
  --altcha-border-width: 1px;
  --altcha-border-radius: 10px;
  --altcha-color-base: #ffffff;
  --altcha-color-border: #0D1D2C;
  --altcha-color-text: currentColor;
  --altcha-color-border-focus: currentColor;
  --altcha-color-error-text: #f23939;
  --altcha-color-footer-bg: #f4f4f4;
  --altcha-max-width: 300px;
}
.altcha-div {color:#0D1D2C; text-align: center; margin: 0 auto; margin-bottom: 10px }
.altcha-div label {color:#0D1D2C !important; margin-bottom: 0px !important}
.altcha {margin: 0 auto;}
.altcha-main.svelte-ddsc3z {
    padding: 0.9rem !important;
}



.cookie_page p {margin-bottom: 20px; font-size: 100%}
.cookie_page ul {margin-left:30px; margin-bottom: 20px}
.cookie_page ul li {list-style: disc}
.cookie_page a {color: #A1A5FF}

.hide-policy {display: none}
.show-policy {display: flex}
.agreement_popup {
  
     background: #FFECF4;
    border-radius: 24px;
    margin: 0 auto;     
    width:600px;
    max-width: 90%;
    position: fixed;
    bottom: 5%;
    z-index: 500;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 0 28px #0d1d2c26;
    transform: translate3d(-50%, 0, 0);
    transition: all .5s linear;}

.agreement_popup a  {color: #A1A5FF}
.agreement_popup .row {display: flex; align-items: center;
                       justify-content: center;
                       flex-wrap: wrap;}

.btn-cookies {
    font-size: 16px;
    padding: 10px 20px;
    max-width: 100%;
    width: 100px;
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
} 

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
  }
  @keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
  } 
  
   .enot {position: absolute;     left: 3%;
    bottom: 2%; z-index: 200; background-size: 200px;}
.enot img {width:400px}
@media only screen and (max-width: 1920px){
 .enot { left: 3%;bottom: 8%;}
.enot img {width:240px}
}
@media only screen and (max-width: 1440px){
 .enot { left: 3%; bottom: -5%;}
.enot img {width:200px}
}
@media only screen and (max-width: 1320px){
.enot { left: 25%; bottom: -5%;}
.enot img {width:200px}
}
@media only screen and (max-width: 1250px){
 .enot {  left: 20%;
        bottom: -2%;}
.enot img {width:200px}
}

@media only screen and (max-width: 1024px){
 .enot {         left: 20%;
        bottom: -7%;
.enot img {width:200px}
}
}
@media only screen and (max-width: 992px){
 .enot { left: 30%; bottom: -7%;}
.enot img {width:150px}
}
@media only screen and (max-width: 767px){
.enot {left:70%; top: 13%; z-index: 200;}
.enot img {width:200px}
}

@media only screen and (max-width: 576px){
.enot {left:70%; top: 13%; z-index: 200;}
.enot img {width:120px}
}