
*, ::before, ::after {
    box-sizing: border-box;
  }
  
  body {
    font-family: 'Gilroy';
    margin: 0;
    padding:0;
}

a{color: #121212; text-decoration: none;}

ul {margon:0;padding:0;}
ul li {list-style:none;}

.row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.justify-content-between {
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }

.container {width:100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 1700px) {
.container {
  max-width: 1440px;
}
}


.header {
    padding:20px 0;
}

.logo {
    width: 261px;
    height: 31px;
    margin-top: 8px;
}



.contact .contact__item {
    font-style: italic;
    font-weight: 600;
    font-size: 17px;
    margin-right: 50px;
    margin-top: 12px;}



.contact .contact__item a {color:#000; text-decoration: none;}
.contact .contact__item a span {padding-left: 8px;}

.contact .phone {font-size: 22px; margin-top: 0px;}
.contact .phone div {font-weight: 500; font-size: 14px;display: block;}

.background {
    height:725px;
}



.about .title {padding-top: 90px;}

.title h1 {
    font-weight: 800;
    font-size: 44px;
    line-height: 55px;
    margin:0;
}
.title span {
font-weight: 500;
font-size: 24px;
line-height: 29px
}

.buttons_block {margin-top: 50px;}

.callback_button a {
    padding: 20px 30px;;
    background-color: #FFC700;
    font-style: normal;
    font-weight: 700;
    font-size: 17px;
    text-align: center;
    color:#000;
    text-decoration: none;

}

.callback_link {
    font-weight: 700; 
    font-size: 17px; 
    padding-bottom:3px; 
    border-bottom: 2px solid #FFC700;
    margin-left: 50px;
    font-style: italic;
}

.benefits  {
    font-style: italic;
    font-weight: 700;
    font-size: 24px;
    margin-top: 80px;
    
}

.benefits ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 колонки */
  gap: 30px; /* отступы между элементами */
  list-style: none;
  margin: 0;
  padding: 0;
}

.benefits li {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.benefits li .benefits_images {
    width:54px;
    height:54px;
    background-color: #F5F5F5;
    border-radius: 100%;
    margin-right: 10px;
    text-align: center;
    line-height: 2.9;
}

.benefits li .benefits_description span {
    font-style: normal;
    font-weight: 500;
    font-size: 17px;
    display: block;

}


.available {background: #EEEEEE;padding:80px 0 100px 0;}

.title {font-weight: 800; font-size: 38px;margin-bottom:20px;}
 .title::after {
    content:"";
    display:inline-block;
    width:31px;
    height:36px;
    position: relative;
    top:7px;
    left:10px;;
    background-image: url(../images/slash.png);
}

.variant__item {width:386px;height:386px;border-radius: 100%;background: #FFC700; margin-top:50px;text-align: center;}
.variant__item span {
    background: #000;
    color:#fff;
    font-style: italic;
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    text-align: center;
    display: block;
    width:270px;
    height:75px;
    margin: -45px auto 0;
    padding-top: 8px;;
}


.quiz {background: #fff;padding:80px 0;}

.quiz .subtitle {
    font-weight: 500;
    font-size: 17px;
    line-height: 21px;

}

.footer {background: #121212;color:#fff;padding:50px 0;}

.footer a {color:#fff;  }

.copyright, .politicy {margin-top: 12px;}
.politicy a {text-decoration:underline;}
.footer .phone a {font-size: 22px;font-weight: 700;font-style: italic;}


.white-popup {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 500px;
    margin: 20px auto;
}

.quiz__form {margin-top:40px;}



@media (max-width: 992px) {
    .logo {margin: auto;}
    .row {flex-direction: column;}
    .background {background:none!important; height:auto;}
    .contact__item {margin: 0;width: 100%;        text-align: center;}
    .contact .phone {margin-top:20px;}
    .callback_button {margin:10px auto 0;}
    .callback_link {margin:40px auto 0;}
    .about .title {padding-top: 40px;}
    .available {padding: 30px 0; }
    .variant__item {margin-left: auto;margin-right: auto;}

    .quiz {padding: 30px 0;}
    .footer {text-align: center;}
    .footer .contact__item {margin-top: 40px;}
}

.jGrowl.top-right{top:40% !important;width:30% !important;left:35% !important}

#jGrowl{font-size:18px;margin:0 12px}
.jGrowl.top-right{left:35%!important;top:35%!important}

#jGrowl .jGrowl-notification {position:relative;width:520px;padding:35px;text-align:center;background:none; border: 5px solid rgba(255,255,255,0.49);border-radius: 0px;}
#jGrowl .jGrowl-notification .jGrowl-close{position:absolute;right:4px;top:4px;color:#8ab933!important}
#jGrowl .jGrowl-notification .jGrowl-message{color:#8ab933!important}

.af-message-error {border-color:brown !important; color:brown !important;}

.about-text {width:50%}
.about-text a {text-decoration:underline;}