.z-index-50 {z-index: 50}
.width-100vw {width: 100vw}
.height-100 {height: 98%}
.move-elements {display: flex; flex-direction: column}
@media only screen and (max-width:768px){
  .move-elements {flex-direction: column-reverse;}  
}
.bg-brand {background-color: #302930}
.bg-brand-2  {background-color: #C8A078}
.bg-brand-3 {background-color: #EBE9ED}
.bg-50-brand-3 {background: linear-gradient(to right, #EBE9ED 50%, #FFF 50%);}
@media only screen and (max-width:992px){
  .bg-50-brand-3 {background: #FFF;}  
}
.half-border-1 { 
    position: relative}

.half-border-1::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #302930;
    border-top-left-radius: 50% 100%;
    border-top-right-radius: 50% 100%;
}
.half-border-1::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0%;
    background: #302930;
}
@media only screen and (max-width:1536px){
    .half-border-1::before {
        height: 90%;
    }
    .half-border-1::after {
        top: 90%;
        height: 10%;
    }
}
@media only screen and (max-width:1366px){
    .half-border-1::before {
        height: 70%;
    }
    .half-border-1::after {
        top: 70%;
        height: 30%;
    }
}
@media only screen and (max-width:1199px){
    .half-border-1::before {
        height: 65%;
    }
    .half-border-1::after {
        top: 65%;
        height: 35%;
    }
}
@media only screen and (max-width:1024px){
    .half-border-1::before {
        height: 60%;
    }
    .half-border-1::after {
        top: 60%;
        height: 40%;
    }
}
@media only screen and (max-width:768px){
    .half-border-1::before {
        height: 55%;
    }
    .half-border-1::after {
        top: 55%;
        height: 45%;
    }
}
@media only screen and (max-width:576px){
    .half-border-1::before {
        height: 40%;
    }
    .half-border-1::after {
        top: 40%;
        height: 60%;
    }
}
@media only screen and (max-width:480px){
    .half-border-1::before {
        height: 33%;
    }
    .half-border-1::after {
        top: 33%;
        height: 67%;
    }
}
@media only screen and (max-width:410px){
    .half-border-1::before {
        height: 25%;
    }
    .half-border-1::after {
        top: 25%;
        height: 75%;
    }
}
.bg-brand-circle-image {
  position: absolute;
  inset: 0;
  z-index: -1;  
  background: url(../img/house/life.webp) center / cover no-repeat;
  border-bottom-left-radius: 50% 100%;
  border-bottom-right-radius: 50% 100%; 
  height: 100%}
@media only screen and (max-width:1180px){
   .bg-brand-circle-image {
        width: 120vw;
        margin-left: -10vw;
        margin-right: -10vw;} 
}
@media only screen and (max-width:1024px){
   .bg-brand-circle-image {
        width: 120vw;
        margin-left: -10vw;
        margin-right: -10vw;} 
}
@media only screen and (max-width:992px){
   .bg-brand-circle-image {
        width: 170vw;
        margin-left: -34vw;
        margin-right: -34vw;} 
}
@media only screen and (max-width:576px){
   .bg-brand-circle-image {
        height: 50%;
        width: 130vw;
        margin-left: -15vw;
        margin-right: -0vw;} 
}

.bg-brand-mask-1 {background: url('../img/page/location-mask.webp'), #302930; background-repeat: no-repeat; background-size: contain; background-position: top center}
@media only screen and (max-width:1199px){
  .bg-brand-mask-1 {background: url('../img/page/location-mask.webp'), #302930; background-size: 200%; background-position: center center }  
}

.bg-brand-mask-2 {background: url('../img/page/otdelka-mask.webp') no-repeat, #302930; background-size: contain; background-position: bottom center }
@media only screen and (max-width:768px){
  .bg-brand-mask-1 {background:  #302930;  }  
}

.bg-brand-circle-1 { position: absolute;
  inset: 0;
  z-index: -1;  
  background: #302930;
  border-top-left-radius: 50% 100%;
  border-top-right-radius: 50% 100%; 
  height: 81%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 80%, #302930 20%);
}
@media only screen and (max-width:1536px){
    .bg-brand-circle-1 {  
  height: 65%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 65%, #302930 35%);
}
}
@media only screen and (max-width:1280px){
    .bg-brand-circle-1 {  
  height: 60%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 60%, #302930 40%);
}
}
@media only screen and (max-width:1199px){
    .bg-brand-circle-1 {  
  height: 50%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 50%, #302930 50%);
}
}

@media only screen and (max-width:992px){
    .bg-brand-circle-1 {  
  height: 40%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 40%, #302930 40%);
}
}
@media only screen and (max-width:768px){
    .bg-brand-circle-1 {  
  height: 30%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 30%, #302930 30%);
}
}

@media only screen and (max-width:576px){
    .bg-brand-circle-1 {  
  height: 22%}
.half-background-brand {
  background: linear-gradient(to bottom, transparent 20%, #302930 20%);
}
}

.bg-brand-circle-2 {
  position: absolute;
  inset: 0;
  z-index: -1;  
  background: #302930;
  border-bottom-left-radius: 50% 100%;
  border-bottom-right-radius: 50% 100%; 
  height: 100%}
@media only screen and (max-width:1536px){
   .bg-brand-circle-2 { height: 65%; top: 35%} 
   .half-background-brand-2 {background: linear-gradient(to bottom, #302930 35%,transparent 36%);}
}

@media only screen and (max-width:1180px){
  
   .bg-brand-circle-2 { height: 65%; top: 35%} 
   .half-background-brand-2 {background: linear-gradient(to bottom, #302930 35%,transparent 36%);}
         
}
@media only screen and (max-width:1024px){
   .bg-brand-circle-2 { height: 50%; top: 50%} 
   .half-background-brand-2 {background: linear-gradient(to bottom, #302930 50%,transparent 51%);}
}
@media only screen and (max-width:992px){
   .bg-brand-circle-2 { height: 40%; top: 60%} 
   .half-background-brand-2 {background: linear-gradient(to bottom, #302930 60%,transparent 61%);}
}
@media only screen and (max-width:576px){
   .bg-brand-circle-2 { height: 28%; top: 72%} 
   .half-background-brand-2 {background: linear-gradient(to bottom, #302930 72%,transparent 73%);}
}



.text-brand {color: #302930}
.text-brand-2 {color: #C8A078}


.btn-brand-1 {color: #302930; background-color: #EBE9ED}
.btn-brand-1:hover {background-color: #C8A078; color:#FFF}

.btn-brand-2 {color: #302930; background-color: #FFF; padding: 20px 50px}
.btn-brand-2:hover {color: #FFF; background-color: #C8A078}

.btn-brand-3 {color: #302930; background-color: #C8A078; padding: 20px 50px;}
.btn-brand-3:hover {background-color: #302930; color:#C8A078}

.btn-brand-4 {color: #302930; background-color: #C8A078; padding: 20px 50px;}
.btn-brand-4:hover {background-color: #EBE9ED; color:#C8A078}

.btn-brand-5 {color: #EBE9ED; background-color: #302930; padding: 20px 50px;}
.btn-brand-5:hover {background-color: #C8A078; color:#302930}

.btn-brand-6 {color: #FFF; background-color: #302930; padding: 20px 50px;}
.btn-brand-6:hover {background-color: #FFF; color:#302930}
@media (max-width: 1730px) {
    .btn-brand-2 {color: #302930; background-color: #FFF; padding: 18px 30px}
    .btn-brand-3, .btn-brand-4 {padding: 18px 30px}
}
@media (max-width: 576px) {
    .life .btn-brand-4 {padding: 18px 18px; font-size: 16px}
}
.phone-link {font-size: 24px; color: #FFF; font-family: 'Onest';}
.phone-link:hover{color: #C8A078}
.menu-container .phone-link {font-size: 26px;}
@media (max-width: 1730px) {
    .phone-link {font-size: 20px;}
}
@media (max-width: 1520px) {
    .phone-link {font-size: 18px;}
}
@media (max-width: 1400px) {
    .phone-link {display: none !important}
}
.is-menu-open .phone-link {color: #444241}

.menu-phone-link {font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 34px; color: #302930}
@media only screen and (max-width:1199px){
    .menu-anchor {
        display: none;
    }
}
.menu-open {
    position: absolute;
    top: 20px;
    right: 20px;
}

.menu-wrap {background-color: #C8A078;     padding: 17px 13px; border-radius: 50%; width: 50px;height: 50px;}

@media (max-width: 768px) {
    .header-button {font-size: 12px; padding: 14px 12px}
}

.gamburger-menu { margin: 0 auto; border-radius: 48px; background-color: #30293066; backdrop-filter: blur(29px); margin-top: 50px; padding: 10px; width: 90vw; position: relative;
                  z-index: 500;}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .gamburger-menu { width: 65vw;}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .gamburger-menu { width: 80vw;}
}
.sns-block {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}


.sns-block 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: 45px;}

.sns-block .social-item {
    width: 44px;
    height: 44px;
    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 {
    color: white !important;
    -webkit-box-shadow: 0 0 0 26px #7B97DF inset !important;
    box-shadow: 0 0 0 0px #7B97DF inset !important;

}

.menu-footer {position: fixed; bottom:20px; width: 90vw;  margin:  0 auto;   left: 50%;transform: translate(-50%, -50%);}

.main-slide-container {
    display: flex;
    justify-content: center;
    align-items: center;}
.main-slide-text {position: absolute; /*top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);*/}
@media only screen and (max-width: 576px){
    .main-slide-image {
        width: 140vw;
        position: relative;
        /*left: 50%;
        right: 50%;*/
        margin-left: -50vw;
        margin-right: -50vw;
    }  
}
@media only screen and (max-width: 576px){
    .otdelka-image {
        width: 120vw;
        position: relative;
        /*left: 50%;
        right: 50%;*/
        margin-left: -14vw;
        margin-right: -14vw;
    }  
}

.enot {position: absolute; right:-2%; bottom: 15%; z-index: 200; background-size: 200px;}
.enot img {width:500px}

@media only screen and (max-width: 1920px){
    .enot img {width:400px}
    .enot {bottom: 5%;}
}
@media only screen and (max-width: 1536px){

    .enot {bottom: 5%;}
}
@media only screen and (max-width: 1440px){
    .enot img {width:360px}
    .enot {bottom: 0%;}
}
@media only screen and (max-width: 1280px){

    .enot img {width:340px}
    .enot {bottom: 5%;}
}
@media only screen and (max-width: 1180px){

    .enot img {width:300px}
    .enot {bottom: 7%;}
}
@media only screen and (max-width: 1024px){

    .enot img {width:300px}
    .enot {bottom: 0%;}
}
@media only screen and (max-width: 992px){
    .enot {bottom: -7%; right:-15px}
    .enot img {width:200px}
}

@media only screen and (max-width: 399px){

    .enot img {width:160px}
}

.rhythm-margin-minus {margin-top: -85px}
.rhythm-margin-plus {margin-top: 85px}

.rhythm h5 {font-size: 25px; font-family: 'Onest';}
.rhythm .rhythm-pagination {display: none}
.rhythm .nav-rhythm {display: none}

.rhythm-image-container img{border-radius: 300px}

@media only screen and (max-width: 1199px){
    .rhythm-circles-image {max-width:50%; width: 50%}
}

.render-pagination {
    background-color: transparent; 
    position: absolute;     
    bottom: 3%;
    left: 50%;
    transform: translateX(-50%);
}
.render-pagination .bullet {border-radius: 50%; background-color:#EBE9ED; margin-left: 10px; margin-right: 10px}
.render-pagination .bullet.bullet-active{background-color:#C8A078;}
/*.plans-pagination {
    background-color: transparent; 
    position: absolute;     
    bottom: 3%;
    left: 50%;
    transform: translateX(-50%);
}*/
.plans-pagination .bullet {border-radius: 50%; background-color:#302930; margin-left: 10px; margin-right: 10px}
.plans-pagination .bullet.bullet-active{background-color:#C8A078;}

.plan-text-item .plan-title {color: #302930; font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 48px }
.plan-text-item .plan-square {color: #C8A078; font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 72px }
.plan-text-item .plan-description {font-family: 'Onest'; font-size: 25px; color: #302930; }
@media (max-width: 1199px) {
 .plan-text-item .plan-title { font-size: 36px }
.plan-text-item .plan-square { font-size: 52px }   
}
@media (max-width: 768px) {
 .plan-text-item .plan-title { font-size: 30px }
.plan-text-item .plan-square { font-size: 46px } 
.plan-text-item .plan-description { font-size:18px; }
}
@media (max-width: 992px) {
 .plan-text-item  { padding: 30px }
}
.plans-button {position: absolute; bottom: 10%;left: 50%;transform: translateX(-50%); z-index: 50}

.white-circle {aspect-ratio: 1 / 1; border-radius: 50%; margin-top: 0px}
@media (max-width: 576px) {
 .white-circle {margin-top: 100px}
}

.accordion-title  {color:#EBE9ED; font-size: 42px;  font-family: 'Onest'; cursor: pointer}
@media (max-width: 768px) {
 .accordion-title  {font-size: 25px; line-height: 25px}   
}
.accordion-title:hover  {color:#C8A078;}
.accordion-item-header-title {position:relative; padding: 10px 0px; cursor: pointer}
.accordion-item-header-title::after {
    content: "";
    position: absolute;
    top:0%;
    right:0%;
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    margin-left: auto;
    
    background-image: url(../img/page/plus.webp);
    background-repeat: no-repeat;
    background-size: 50px;
    transition: transform .2s ease-in-out;
}
@media (max-width: 768px) {
 .accordion-item-header-title::after {width: 36px;height: 36px;background-size: 36px;} 
  .accordion-item-header-title.two-lines::after {width: 36px;height: 36px;background-size: 36px; top:25%} 
}
.accordion-item-header-title:not(.collapsed) .accordion-title {
   color:#C8A078;
}
.accordion-item-header-title:not(.collapsed)::after {
   content: "";
    position: absolute;
    top:0%;
    right:0%;
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    margin-left: auto;
    
    background-image: url(../img/page/close.webp);
    background-repeat: no-repeat;
    background-size: 50px;
    transition: transform .2s ease-in-out;
}
@media (max-width: 768px) {
 .accordion-item-header-title:not(.collapsed)::after  {width: 36px;height: 36px;background-size: 36px; }  
.accordion-item-header-title.two-lines:not(.collapsed)::after {width: 36px;height: 36px;background-size: 36px; top:25%}  
}
.infrastructure-image {position: absolute;     top: -10%;right: -5%;width: 34%;}
@media (max-width: 1920px) {
  .infrastructure-image {position: absolute;     top: -10%;right: -5%;width: 50%;}  
}
@media (max-width:1536px) {
  .infrastructure-image {position: absolute;     top: -5%;right: -5%;width: 55%;}  
}
.infr-map {display: none}
#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-image-mobile {
        width: 50vw;
        position: relative;
        margin-left: -3vw;
        /* margin-right: -20vw; */
        margin-top: -20%;
    }  
@media only screen and (max-width: 1920px){
    .infrastructure-image-mobile {
         width: 50vw;
        position: relative;
        margin-left: -3vw;
        /* margin-right: -20vw; */
        margin-top: -20%;
    }  
}
@media only screen and (max-width: 1536px){
    .infrastructure-image-mobile {
         width: 50vw;
        position: relative;
        margin-left: -3vw;
        /* margin-right: -20vw; */
        margin-top: -65%;
    }  
}
@media only screen and (max-width: 1199px){
    .infrastructure-image-mobile {
        width: 110vw;
        position: relative;
        margin-left: -14vw;
        margin-right: -14vw;
        margin-top: -80%;
    }  
}

@media only screen and (max-width: 992px){
    .infrastructure-image-mobile {
        width: 124vw;
        position: relative;
        margin-left: -14vw;
        margin-right: -14vw;
        margin-top: -60%;
    }  
}
@media only screen and (max-width: 576px){
    .infrastructure-image-mobile {
        width: 130vw;
        position: relative;
        margin-left: -18vw;
        margin-right: -14vw;
        margin-top: -40%;
    }  
}

.infrastructure-legend {display: flex; background: #C8A078; border-radius: 24px; padding: 8px 30px;justify-content: space-between;      flex-wrap: wrap;   position: relative;bottom: 60px;}
.infrastructure-legend-item {display: flex; align-items: center; flex:1}
@media only screen and (max-width: 1199px){
    .infrastructure-legend-item { flex:0 0 50%}
}
.infrastructure-legend-item-text .text-lead {font-size: 18px}
@media only screen and (max-width: 576px){
   .infrastructure-legend-item-text .text-lead {font-size: 14px} 
   .infrastructure-legend-item-image img {width:34px; height: 34px}
}
@media only screen and (max-width: 399px){
   .infrastructure-legend-item-text .text-lead {font-size: 12px} 
   .infrastructure-legend-item-image img {width:26px; height: 26px}
}

@media only screen and (max-width: 1919px){
    .infrastructure-legend {bottom: 40px;}
}
@media only screen and (max-width: 1199px){
    .infrastructure-legend {bottom: 0px;}
}

@media only screen and (max-width: 576px){
    .infrastructure-image-mobile {
        width: 130vw;
        position: relative;
        margin-left: -18vw;
        margin-right: -14vw;
        margin-top: -40%;
    }  
}
#hide_map {position: relative; bottom: 140px }

.location-item {display: flex; border-radius: 260px; background-color: #EBE9ED; height: 100%}
@media only screen and (max-width: 1920px){
  .location-item { border-radius: 200px; }  
}
.location-item-title {font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 92px; line-height: 58px }
.location-item-title.vertical-title {padding-top: 100px}
.location-item-title span{font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 54px; display: block }
@media only screen and (max-width: 1536px){
  .location-item-title {font-size: 70px; }
  .location-item-title span{font-size: 48px;}
}

@media only screen and (max-width: 1199px){
  .location-item-title {font-size: 48px; line-height: 36px;}
  .location-item-title span{font-size: 28px;}
}
.location-item-image  {}
.location-item-image img {border-radius: 50%}
@media only screen and (max-width: 992px){
  .location-item .text-lead {font-size: 14px}
}

.offer-desc h3 {font-family: 'Onest'; font-size: 33px}

@media only screen and (max-width: 992px) {
    .offer-desc h3  {
        font-size: 27px;
        font-weight: 500;
    }
}

@media only screen and (max-width: 1199px) {
    .offer .rhythm-circles-image {
        max-width: 30%;
        width: 30%;
    }
}
.contact-form .form-control, #callback .form-control {
    background-color: #FFF;
    border: 1px solid #FFF;
    border-radius: 36px;
    height:56px;
    color: #285762;
    max-width: 360px;
    text-align: center;
    margin: 0 auto

}

.contact-form  .form-control::placeholder, #callback .form-control::placeholder {
    color: #302930; text-align: center;
}
.callback-form .form-control, #callback .form-control {
    background-color: #EBE9ED;
    border: 1px solid #EBE9ED;
    border-radius: 45px;
    height:60px;
    color: #302930;
    max-width: 100%;
    text-align: center;
    margin: 0 auto

}

.callback-form  .form-control::placeholder, #callback .form-control::placeholder {
    color: #302930; text-align: center;
}
.bottom-phone-link {font-family: 'TikTok Sans 24pt ExtraExpanded'; color: #302930; font-size: 46px}
@media only screen and (max-width: 992px) {
    .bottom-phone-link  {
        font-size: 30px;
    }
}

.footer-menu {width: 100%}
.footer-menu .menu-anchor-list li a {font-size: 21px; color: #302930;}
.footer-menu .menu-anchor-list li a::before {color: #C8A078 !important}
.footer-menu .menu-anchor-list li a:hover {color: #C8A078 !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;
}
@media only screen and (max-width: 1199px) {
    .footer-menu .menu-anchor {
        display: flex;
    }
}
@media only screen and (max-width: 767px) {
    .footer-menu .menu-anchor-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
}
.footer-menu .menu-anchor ul li {opacity: 1; margin-right: 10px}
}
: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: #636730}

.hide-policy {display: none}
.show-policy {display: flex}
.agreement_popup {
  
     background: #C8A078;
     color: #302930;
    border-radius: 10px;
    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: #FFF}
.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: 150px;
    font-weight: 400
}

.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;}
  } 
  
  #callback .modal-header,#booklet .modal-header {display:none}


#callback .close,#booklet .close {
     cursor: pointer;
    position: relative;
    top: -6%;
    width: 35px; 
    height: 35px; 
    opacity: 1;
    z-index: 50;
}

#callback .close:focus,#booklet .close:focus {
    outline: none !important;
}


.policy-btns {display: flex; margin-top: 10px; justify-content: space-between}
.set-btns {display: flex; align-items: center;}
.btn-decline {border:1px solid #FFF; background-color: transparent; color:#302930}
@media only screen and (max-width: 576px){
    .policy-btns {    flex-direction: column-reverse;}
}

.agreement_popup .row.settings {display: none ; margin-top: 10px}
.agreement_popup a.set-href {display:inline-block;   }

.brand-color {color: #F11121}

  .checkbox-wrapper input[type="checkbox"] {
    visibility: hidden;
    display: none;
  }

  .checkbox-wrapper .toggle {
    position: relative;
    display: block;
    width: 40px;
    height: 20px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transform: translate3d(0, 0, 0);
  }
  .checkbox-wrapper .toggle:before {
    content: "";
    position: relative;
    top: 3px;
    left: 3px;
    width: 34px;
    height: 14px;
    display: block;
    background: transparent;
    border: 1px solid #302930;
    border-radius: 8px;
    transition: background 0.2s ease;
  }
  .checkbox-wrapper .toggle span {
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    display: block;
    background: #C8A078;
    border-radius: 10px;
    border: 1px solid #302930;
    box-shadow: 0 3px 8px rgba(154, 153, 153, 0.5);
    transition: all 0.2s ease;
  }
  .checkbox-wrapper .toggle span:before {
    content: "";
    position: absolute;
    display: block;
    margin: -18px;
    width: 56px;
    height: 56px;
    background: rgba(48, 41, 48, 0.5);
    border-radius: 50%;
    transform: scale(0);
    opacity: 1;
    pointer-events: none;
  }

  .checkbox-wrapper #neccessary-cookie:checked + .toggle:before {
    background: transparent;
    border: 1px solid #302930;
  }
  .checkbox-wrapper #other-cookie:checked + .toggle:before {
    background: transparent;
    border: 1px solid #302930;
  }
  .checkbox-wrapper #neccessary-cookie:checked + .toggle span {
    background: #302930;
    transform: translateX(20px);
    transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
    box-shadow: 0 3px 8px rgba(79, 46, 220, 0.2);
  }
  .checkbox-wrapper #other-cookie:checked + .toggle span {
    background: #302930;
    transform: translateX(20px);
    transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
    box-shadow: 0 3px 8px rgba(79, 46, 220, 0.2);
  }
  .checkbox-wrapper #neccessary-cookie:checked + .toggle span:before {
    transform: scale(1);
    opacity: 0;
    transition: all 0.4s ease;
  }
    .checkbox-wrapper #other-cookie:checked + .toggle span:before {
    transform: scale(1);
    opacity: 0;
    transition: all 0.4s ease;
  }


  
    .checkbox-wrapper-agree .control {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-size: 13px;
    font-weight: normal;
    text-align: left
  }
  .checkbox-wrapper-agree  .control input {
    position: absolute;
    z-index: -1;
    opacity: 0;
  }
  .checkbox-wrapper-agree  .control__indicator {
    position: absolute;
    top: 2px;
    left: 0;
    height: 20px;
    width: 20px;
    background: #e6e6e6;
  }
  .checkbox-wrapper-agree .control:hover input ~ .control__indicator,
  .checkbox-wrapper-agree .control input:focus ~ .control__indicator {
    background: #ccc;
  }
  .checkbox-wrapper-agree .control input:checked ~ .control__indicator {
    background: #C8A078;
  }
  .checkbox-wrapper-agree .control:hover input:not([disabled]):checked ~ .control__indicator,
  .checkbox-wrapper-agree .control input:checked:focus ~ .control__indicator {
    background: #C8A078;
  }
  .checkbox-wrapper-agree .control input:disabled ~ .control__indicator {
    background: #e6e6e6;
    opacity: 0.6;
    pointer-events: none;
  }
  .checkbox-wrapper-agree .control__indicator:after {
    content: '';
    position: absolute;
    display: none;
  }
  .checkbox-wrapper-agree .control input:checked ~ .control__indicator:after {
    display: block;
  }
  .checkbox-wrapper-agree .control--checkbox .control__indicator:after {
    left: 8px;
    top: 4px;
    width: 3px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  .checkbox-wrapper-agree .control--checkbox input:disabled ~ .control__indicator:after {
    border-color: #7b7b7b;
  }
  
  .privacy_policy a:hover {color: #FFF}
  
#callback  .modal-content {border-radius: 17px}
.callback-border {border-radius: 17px}

#callback .modal-lg, #callback .modal-xl {
        max-width: 1000px;
    }
 #callback h3 {font-family: 'TikTok Sans 24pt ExtraExpanded'; font-size: 28px; font-weight: bold }  
 #callback .text-lead {font-size: 21px; font-weight: bold }   
.callback-image {border-radius: 0px 17px 17px 0px}
 #callback a.underline {text-decoration: underline; }
 
  #callback a.underline:hover {text-decoration: none; color: #302930}
  .callback-image {height: 100%; width: auto}
  @media only screen and (max-width: 992px) {
    .callback-image {border-radius: 17px 17px 0px 0px; max-height: 50%}
    #callback .modal-lg, #callback .modal-xl {
        max-width: 600px;
    }
    .callback-image-container {max-height: 40vh; overflow: hidden}
}
  @media only screen and (max-width: 768px) {

    .callback-image-container {max-height: 30vh; overflow: hidden}
}