body{
    margin:0;
    font-weight: normal;
    font-size:24px;
    font-family: 'PT Mono', monospace;
    background-color: #E0DCDF;
    -webkit-tap-highlight-color:  transparent;
    color:var(--black-blue-color);
    --black-blue-color: #131435;
    --grey-color: #BEBBBD;
    --black-color: #030303;
    --purple-color: #7700FF;
    --green-color: #79C371;
    --cont-sm-width: 1250px;
    --orange-color: #FF605A;
    --light-green-color: #3BFF85;
}

body.active{
    overflow: hidden;
}

a{
    outline: inherit!important;
}

.grid-box{
    display: grid;
    grid-gap:30px;
}

.bt{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: var(--light-green-color);
    font-size:20px;
    border:2px solid #131435;
    border-top-width:5px;
    line-height: 1;
    display: inline-flex;
    transition: all 300ms ease;
    text-decoration: inherit;
    position: relative;
}

.bt:hover{    
    text-decoration: inherit;
}

.bt span{
    position: relative;
    padding:15px 33px;
    z-index: 2;
}

.bt span::before{
    position: absolute;
    content: '';
    width: 0%; 
    height: 100%;
    background: #32e074;
    top: 0;  
    left: 0; 
    transition: all 300ms ease;
    z-index: -1;
}
  
.bt:hover span::before{
    width: 100%; 
}


.bt-small{
    border: none;
    color:var(--black-blue-color);
    border-radius: 0;
    font-size:24px;
}

.bt-small span{    
    padding: 10px 20px;
}


.bt-link{
    line-height: 1;
    font-size:40px;
    padding-top: 30px;
    padding-right: 90px;
    color:var(--black-blue-color);
    position: relative;
    display: inline-block;
    text-decoration: inherit;
}

.bt-link:hover{
    text-decoration: inherit;
}

.bt-link::before{
    content: '';
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: 3px;
    background-color: var(--black-blue-color);
}

.bt-link::after{
    content: '';
    width:10px;
    height:3px;
    position: absolute;
    right:calc(100% + 10px);
    top:0;
    background-color: #e0dcdf;
    transition: 0.4s ease;
}

.bt-link:hover::after{
    width:40px;
    right: -40px;
}


.bt-link span{
    background-repeat: no-repeat;
    background-size: 30px;
    background-image: url(img/arrow-angle.svg);
    right:0;
    bottom:5px;
    position: absolute;
    width:30px;
    height:30px;
}

.bt-link:hover span{
    -webkit-animation: shake-btn-form 2s 0s ease-out 1;
    -moz-animation: shake-btn-form 2s 0s ease-out 1;
    -ms-animation: shake-btn-form 2s 0s ease-out 1;
    animation: shake-btn-form 2s 0s ease-out 1;
        animation-iteration-count: infinite;
}


.bt-shake{
    -webkit-animation: shake-btn-form 2s 0s ease-out 1;
    -moz-animation: shake-btn-form 2s 0s ease-out 1;
    -ms-animation: shake-btn-form 2s 0s ease-out 1;
    animation: shake-btn-form 2s 0s ease-out 1;
        animation-iteration-count: infinite;
}

@keyframes shake-btn-form{
    0%, 20% {
        transform: translate3d(0, 0, 0);
    }
    2%, 6%, 10%, 14%, 18% {
        transform: translate3d(-3px, 0, 0);
    }

    4%, 8%, 14%{
        transform: translate3d(3px, 0, 0);
    }
}



.bt-2{
    transition: all 300ms ease;

}

.bt-2:hover{
    text-decoration: inherit;
    color:#fff!important;
}

.bt-2 span{
    position: relative;
    padding:0 6px;
}

.bt-2 span:before {
    content: "";
    position: absolute;
    bottom: auto;
    top: 0;
    left:0;
    height: 0%;
    width: 100%;
    background: var(--purple-color);
    z-index: -1;
    transition: all 300ms ease;
}

.bt-2:hover span:before {
    content: "";
    height: 100%;
    bottom: 0;
    top: auto;
}


.container{
    width:100%;
    padding:0 40px;
}

.container-sm{
    max-width:var(--cont-sm-width);
    width:100%;
    padding:0 15px;
    margin:0 auto;
}

.title-box .title{
    margin:0;
    font-size:80px;
    line-height: 1;
    font-weight: 400;
}

.owl-stage{
    display: flex;
}

.owl-carousel .disabled{
    display: none;
}

header{
    position: fixed;
    top:0;
    left:0;
    padding:20px 0;
    width:100%;
    z-index: 999;
    transition: background 0.2s, color 0.2s, padding 0.2s;
}

header.active .logo-box img.white{
    display: block;
}

header.active .logo-box img.black{
    display: none;
}


header .columns{
    align-items: center;
    grid-gap:50px;
    grid-template-columns: 150px 170px 1fr auto auto;
    transition: 0.2s;
}

header .logo-box img{
    max-width: 100%;
}

header .logo-box img.white{
    display: none;
}

header .descr .descr-title{
    font-size: 17px;
    margin:0;
    font-weight: 400;
    line-height: 1.6;
    max-width:170px;
}

header .nav ul{
    padding:0;
    margin:0;
    list-style: none;
    display: flex;
    justify-content: center;
}

header .nav ul li{
    margin-right:30px;
    font-size:20px;
}

header .nav ul li:last-child{
    margin-right:0;
}

header a{
    color:var(--black-blue-color);
}

header .nav .contacts,
header .nav .bt-box,
header .nav .burger{
    display: none;
}

header a:hover{
    text-decoration: inherit;
}

header .contacts{
    grid-gap:5px;
    font-size:20px;
}

header .contacts span{
    color:var(--grey-color);
    font-size:17px;
}

header .contacts a{
    font-weight: bold;
}


header.active{
    background-color: #000;
}

header.active .columns{
    grid-template-columns: 125px 195px 1fr auto auto; 

}

header.active .descr .descr-title,
header.active .nav a,
header.active .contacts a{
    color:#fff;    
}

header .descr .descr-title,
header.active .nav a,
header.active .contacts a{
    transition: color 0.2s;    
}

.main-wrap{
    padding-top:110px;
}

.head-block{
    min-height:calc(100vh - 110px);
    display: grid;
    grid-template-rows: 1fr auto;
}

.head-block>.container{
    display: flex;
    align-items:center;
}

.row.left-marg{
    --row-margin:calc((100vw - 50px - var(--cont-sm-width)) / 2);  
    margin-left:var(--row-margin);
}

.head-block .row{  
    position: relative;    
}

.head-block .row .dots{
    position: absolute;
    left:calc((var(--row-margin) - 50px) * -1);
    grid-gap:15px;
    height: 100%;
    align-content: center;
}

.head-block .row .dots button{
    border-radius: 50%;
    width:10px;
    height:10px;
    background-color: var(--grey-color);
    outline: inherit;
    padding:0;
}

.head-block .row .dots button.active{
    background-color: var(--black-blue-color);
}

.head-block .slide-image img{
    max-width: 100%;
}

.head-slider{
    overflow: hidden;
    padding: 20px 0;
}

.head-slider .owl-stage {
    align-items: center;
}

.head-slider .item{
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.head-slider .item>div{    
    grid-gap:80px;
}

.head-slider .item .item-cont{
    grid-gap:30px;
}

.head-slider .item p{
    font-size:32px;
}

.head-slider .item p:last-child{
    margin:0;
}


.help-bt{
    width:30px;
    height:30px;
    display: inline-block;
    cursor: pointer;
    background-image: url(img/help.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size:30px;
    position: relative;
    top:5px;
}


.help-bt .help-box{
    position: absolute;
    top:-5px;
    left: calc(100% + 20px);
    padding: 10px;
    background-color: #5222D0;
    color: #fff;
    font-size: 12px;
    width: 330px;
    transform: rotate(-5deg) translateY(-15px);
    transform-origin: left;
    opacity: 0;
    visibility: hidden;
    transition: 0.4s ease;    
    border-radius: 6px;
    z-index: 888;
}

.help-bt:hover .help-box{
    transform: rotate(0deg) translateY(0px);
    opacity: 1;
    visibility: visible;    
}

.help-bt .help-box .grid-box{
    grid-gap:10px;
}

.help-bt .help-box::before{
    content: '';
    border: 10px solid transparent; 
    border-right: 10px solid #5222D0;
    position: absolute;
    top:10px;
    left:-20px;
}









.moving-text{
    padding:20px 0;
    font-size: 32px;
    color:#fff;
    background-color:  var(--black-color);
    overflow: hidden;
}

.moving-text .container{
    display: flex;
    padding-right: 0;
}

.moving-text .cl-1{
    font-weight: 700;
}

.moving-text .cl-1{
    margin-left:50px;
}

.moving-text .text .marquee{
    display: flex;
    overflow: hidden;
    position: relative;
}

.moving-text .text .marquee::after{
    content: '';
    width:210px;
    height:100%;
    position: absolute;
    top: 0;
    left:-3px;
    background: rgb(3,3,3);
    background: -moz-linear-gradient(263deg, rgba(3,3,3,0) 0%, rgba(3,3,3,0.8267682072829132) 30%, rgba(3,3,3,1) 67%, rgba(3,3,3,1) 100%);
    background: -webkit-linear-gradient(263deg, rgba(3,3,3,0) 0%, rgba(3,3,3,0.8267682072829132) 30%, rgba(3,3,3,1) 67%, rgba(3,3,3,1) 100%);
    background: linear-gradient(263deg, rgba(3,3,3,0) 0%, rgba(3,3,3,0.8267682072829132) 30%, rgba(3,3,3,1) 67%, rgba(3,3,3,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#030303",endColorstr="#030303",GradientType=1);
}

.trig-boxes .columns{
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid var(--black-color);
    grid-gap:0;
}

.trig-boxes .columns .item{
    padding:50px 80px;
    color:var(--black-blue-color);
    border-right: 1px solid var(--black-color);
    transition: 0.2s;
    -moz-transition: 0.2s;
    -webkit-transition: 0.2s;
    background-position: right -30px bottom -30px;
    background-repeat: no-repeat;
    background-size: 30px;
    text-decoration: inherit;
}

.trig-boxes .columns .item:last-child{
    border-right:none;
}

.trig-boxes .columns .item:hover{
    background-color: var(--purple-color);
    color:#fff;
    background-image: url(img/arrow-angle-green.svg);
    background-position: right 30px bottom 30px;
}

.trig-boxes .columns .item>div{
    grid-gap:40px;
}


.trig-boxes .columns .item .title{
    font-size:40px;
    margin:0;
    font-weight: bold;
}

.green-bg{
    display: inline-block;
}

.green-bg,
.trig-boxes .columns .item:hover .subtitle{
    background-color:  var(--light-green-color);
    color:var(--black-blue-color);
    padding:10px 20px;
}

.trig-boxes .columns .item .subtitle{
    padding:10px 0;
    transition: 0.2s;
    -moz-transition: 0.2s;
    -webkit-transition: 0.2s;
    display: inline-block;
}

.sect-width-padding{
    padding:110px 0;
}

.cause{
    margin-bottom:70px;
}

.cause .container>.row{
    grid-gap:110px;
}

.couses-list{
    grid-gap:0;
}

.couses-list .item{
    padding:30px 0;
    border-bottom:1px solid var(--black-blue-color);
    display: grid;
    grid-gap:60px;
    grid-template-columns: auto 1fr;
    align-items: center;
}

.couses-list .item:first-child{
    padding-top:0;
}

.couses-list .item:last-child{
    border-bottom:0;
    padding-bottom:0;
}

.couses-list .item .number-box{
    font-size: 81px;
}

.couses-list .item .text-box{
    font-size:40px;
}

.couses-list .item .text-box p:last-child{
    margin:0;
}

.purple-block{
    background-color: var(--purple-color);
    border:1px solid #000;
    padding:45px;
    color:#fff;
    grid-gap:45px;
    text-align: center;
}

.purple-block>.row{
    grid-gap:30px;
}

.purple-block .text-box p:last-child{
    margin-bottom:0;
}

.education{
    grid-gap:100px;
}

.education>.row{
    grid-gap:65px;
}

.education .educ-format{
    grid-template-columns: 1fr 1fr;
    grid-template-rows: calc((100vw - 450px)/ 2);
}

.education .educ-format .item{
    border:1px solid #000;
    padding:70px 90px;
    align-content: space-between;
    background-repeat: no-repeat;
    background-position: bottom 45px right -50px;
    transition: 0.4s;
    height: 100%;
}

.education .educ-format .item:hover{
    background-color: #83FA91;
}

.education .educ-format .item .title{
    font-size:40px;
    margin:0;
    font-weight: bold;
}

.education .educ-format .item.online{
    background-image: url(img/online-education.svg);
    background-size: 69%;
}

.education .educ-format .item.offline{
    background-image: url(img/offline-education.svg);
    background-position: bottom 45px right -73px;
    background-size: 82%;
}

.bt-bord{
    color:var(--black-blue-color);
    text-decoration: inherit;
    position: relative;
}

.bt-bord::before{
    content: '';
    position: absolute;
    left:0;
    bottom:-2px;
    width:100%;
    height:1px;
    background-color: var(--black-blue-color);
    transition: 0.2s;
}

.bt-bord:hover::before{
    width:0;
}

.bt-bord:hover{
    text-decoration: inherit;
}

.education .row.info-box{
    max-width: 1450px;
    width:100%;
    margin: 0 auto;
    text-align: center;
    font-size:40px;
}

.education .row.info-box .show-text{
    font-weight: bold;
    text-decoration: inherit;
    cursor: pointer;
    margin-top:20px;
    display: inline-block;
} 

.education .row.info-box .show-text.bt-bord::before{
    height:2px;
}

.education .info-box .text-box{
    height: 137px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.education .info-box .text-box.open{
    overflow: initial;
    display: initial;
    -webkit-line-clamp: initial;
    -webkit-box-orient: initial;
}







.education .triggers-list{
    grid-template-columns: repeat(4, 1fr);
}

.education .triggers-list .item{
    padding:40px 90px;
    grid-gap:60px;    
    grid-auto-rows: min-content;
    border:1px solid #000;
    width: 99%;
    height: 100%;
}

.education .triggers-list .item p{
    margin:0;
}

.education .triggers-list .item .number{
    font-size: 40px;
    color:var(--purple-color);
}

.free-lesson ul{
    list-style: none;
    padding:0;
    margin:0;
    font-size:40px;
}

.free-lesson ul li{
    padding-left:70px;
    position: relative;
}

.free-lesson ul li::before{
    content: '';
    width:30px;
    height: 2px;
    background-color: var(--black-blue-color);
    position: absolute;
    left:0;
    top:20px;
}

.free-lesson .row.grid-box{
    grid-gap:100px;
}

.free-lesson .types-list{
    grid-template-columns: 1fr 1fr;
}

.free-lesson .types-list .item{
    border:1px solid #000;
    padding:30px 90px;
    grid-gap:60px;
    height: 100%;
}

.free-lesson .types-list .item:hover{
    background-color: var(--purple-color);
    color:#fff;
}

.free-lesson .types-list .item .green-bg{
    text-decoration: underline;
    line-height: 1.6;
}

.free-lesson .types-list .item .green-bg:hover{
    text-decoration: inherit;
}

.free-lesson .types-list .item .title{
    margin:0;
    font-size:40px;
}

.free-lesson .types-list .item p:last-child{
    margin-bottom:0;
}

.reviews{
    grid-gap:80px;
}

.reviews-slider{
    padding-bottom:70px;
    overflow: hidden;
}

.reviews-slider .item .rew-info{
    grid-gap:20px;
    grid-template-columns: 60px auto 1fr;
    align-items: center;
}

.reviews-slider .item .rew-info .img-box{
    overflow: hidden;
    border-radius:50%;
}

.reviews-slider .item .rew-info .img-box img{
    max-width:100%;
    height:auto;
}

.reviews-slider .item .rew-info .name p{
    margin:0;
    font-weight: bold;
}

.reviews-slider .item .rew-info .date span{
    color:var(--grey-color);
    font-size:20px;
}

.reviews-slider .item .text-box{ 
    line-height: 1.7;
}

.reviews-slider .item .text-box p:last-child{
    margin:0;
}

.reviews .container{
    position: relative;
}

.reviews .owl-dots{
    display: flex;
    justify-content: center;
    position: absolute;
    left:0;
    bottom:0;
    width:100%;
}

.reviews .owl-dots button{
    margin:0 20px;
    background-color:transparent;
    color:var(--grey-color);
    outline: inherit;
}

.reviews .owl-dots button.active{
    color:var(--black-blue-color);
    font-weight: bold;
}

.order-section{
    background-repeat: no-repeat;
    background-image: url(img/call-bg.svg);
    background-position: right -13px top 60%;
    padding: 220px 0;
    background-size: 35%;
}

.order-section .row-2{
    grid-template-columns: 2fr 1fr;
    padding-bottom:100px;
}

.order-section .col-1{
    grid-gap:50px;
}

.order-section .col-1 p{
    margin:0;
    line-height: 1.7;
    max-width:592px;
}

.order-section .order-bt,
.order-section .call-bt{
    display: inline-block;
    border:1px solid #000;
    text-decoration: inherit;
    padding: 16px 40px;
}

.order-section .order-bt{
    color:var(--black-blue-color);    
}

.order-section .call-bt{
    border-width:3px;
    border-radius:4px;
    background-color: var(--purple-color);
    color:#fff;
    font-style: italic;
    margin-top:40px;
    transition: 300ms ease;
}

.order-section .call-bt:hover{
    background-color:#5b10b1; 
}


.pre-footer{
    padding-bottom:0!important;
}

.pre-footer .columns{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.pre-footer .social{
    border:1px solid #000;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.pre-footer .social .item:nth-child(2n + 1){
    border-right:1px solid #000;
}

.pre-footer .social .item:nth-child(1),
.pre-footer .social .item:nth-child(2){
    border-bottom:1px solid #000;
}

.pre-footer .social .item a{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    font-size: 40px;
    color:var(--black-blue-color);
    padding:30px;
}

.pre-footer .banner-box{
    border:1px solid;
    border-left-width:0;
}

.pre-footer .banner-box img{
    width:100%;
    height:auto;
}

footer{
    padding:50px 0;
    text-transform: uppercase;
    font-size:20px;
    font-weight: bold;
}

footer .columns{
    grid-template-columns: auto auto;
    justify-content: space-between;
    align-items: center;
}

footer .developers a {
    padding-right: 57px;
    position: relative;
    align-items: center;
    display: flex;
    color:var(--black-blue-color);
}

footer .developers a:hover{
    text-decoration: inherit;
}

footer .developers a::after {
    content: '';
    position: absolute;
    right: 0;
    top: calc((100% - 37px) / 2);
    width: 37px;
    height: 37px;
    background-size: 37px;
    background-repeat: no-repeat;
    background-image: url(img/newpage-logo.svg);
}

.price-block .price-head{
    padding: 200px 0;
    align-content: center;
}

.price-block .price-head .text-box{
    max-width:1000px;
}

.price-block .price-head p{
    line-height: 1.7;
}

.price-block .price-head p:last-child{
    margin:0;
}

.price-block .price-head .title-box{
    display: flex;
}

.price-block .price-head .title-box .count{
    font-size: 40px;
    color: #FF615B;
    margin-left: 100px;
    font-weight: bold;
}

.price-block .bt-row{
    text-align: center;
    margin-top:80px;
}

.price-tabs .tabs{
    padding:0;
    margin:0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.price-tabs .tabs li span{
    display: flex;
    justify-content: center;
    align-items: center;
    height:140px;
    padding:10px 20px;
    border:1px solid #000;
    transition: 0.2s;
    -moz-transition: 0.2s;
    -webkit-transition: 0 .2s;
    cursor: pointer;
}

.price-tabs .tabs li:nth-child(2) span{
    border-left-width:0;
}

.price-tabs .tabs li#current span{
    background-color: var(--purple-color);
    font-size:40px;
    font-weight: bold;
    color:#3BFF85;
}

.price-tabs .content .tab-box{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.price-tabs .price-item{
    border:1px solid #000;
    border-left-width: 0;
    border-top-width: 0;
    display: grid;
    grid-template-rows: 1fr auto;
    transition: 300ms ease;
}

.price-tabs .price-item:nth-child(1),
.price-tabs .price-item:nth-child(4),
.price-tabs .price-item:nth-child(7){
    border-left-width: 1px;    
}

.price-tabs .price-item .row{
    padding:40px 70px;
}

.price-tabs .price-item:hover{
    color:#fff;
}

.price-tabs .price-item:hover .detail-price span{
    border-color: var(--light-green-color);
    color: #000;
    background-color: var(--light-green-color);
}

.price-tabs .price-item:hover .row{
    background-color: var(--purple-color);
}

.price-tabs .price-item:hover .full-price del {
    color: #A04CFF;
}

.price-tabs .price-item .price{
    grid-gap:25px;
}

.price-tabs .price-item .full-price{
    font-size:40px;
}

.price-tabs .price-item .full-price del{
    color:var(--grey-color);
    transition: 300ms ease;
}

.price-tabs .price-item .detail-price span{
    border:1px solid #000;
    font-size:20px;
    padding: 3px 14px;
    display: inline-block;
    transition: 300ms ease;
}

.price-tabs .price-item .info-box{
    line-height: 1.7;
}

.price-tabs .price-item .info-box p:last-child{
    margin-bottom:0;
}

.price-tabs .price-item .button-box a{
    display: block;
    border-top: 1px solid #000;
    text-align: center;
    padding: 28px 20px;
    font-weight: bold;
    font-size: 40px;
    color:var(--black-blue-color);
    text-decoration: inherit;
}

.contacts-sect{
    padding:150px 0;
}

.contacts-sect>.container>.row{
    grid-gap:180px;
}

.contacts-sect .title-box{
    max-width:625px;
}

.contacts-sect .cont-items>div{
    border-bottom:1px solid #000;
    padding-bottom: 15px;
}

.contacts-sect .cont-items a{
    font-size:80px;
    color:#5D1CD5;
    text-decoration: inherit;
}

.contacts-sect .cont-items .tel a{
    color:var(--orange-color);
}

.contacts-sect .cont-row{
    grid-gap:100px;
}

.contacts-sect .filials{
    grid-gap:90px;
}

.contacts-sect .fil-item{
    border-top:1px solid #000;
    padding-top:40px;
}

.contacts-sect .fil-item .fil-info,
.contacts-sect .fil-item .fil-location>div{
    grid-template-columns: 1fr 1fr 0.5fr;
}

.contacts-sect .fil-item .fil-title{
    margin:0;
    font-size:40px;
}

.contacts-sect .fil-item .fil-info{
    align-items: center;
}

.contacts-sect .fil-item .fil-info p{
    margin-bottom:0;
}

.contacts-sect .fil-item .map-bt{
    float:right;
    text-decoration: inherit;
    border-bottom: 1px solid;
    cursor: pointer;
}

.contacts-sect .fil-item .map-bt:hover{
    border-color:transparent;
}

.contacts-sect .fil-item .map-box{
    grid-column-start:span 2;
}

.contacts-sect .fil-item .map-box img{
    max-width:100%;
    height:auto;
}

.contacts-sect .fil-location{
    display: none;
    padding-top:80px;
}



.mes-widget{
    position: fixed;
    bottom:35px;
    right:35px;
    display: grid;
    grid-gap: 20px;
}

.mes-widget .mes-bt{
    display: block;
    border-radius:50%;
    width:70px;
    height:70px;
    background-color: #FF615B;
    background-repeat: no-repeat;
    background-size: 35px;
    background-position:center;
    background-image: url(img/chat.svg);
    cursor: pointer;
    -webkit-transition: transform 0.2s ease-out;
    -moz-transition: transform 0.2s ease-out;
    -o-transition: transform 0.2s ease-out;
    transition: transform 0.2s ease-out;
}

.mes-widget .mes-bt.active{
    background-image: url(img/icon_close.svg);
    background-size: 50px;
    -moz-animation-name: rotate-btn;
    -moz-animation-duration: 0.35s;
    -webkit-animation-name: rotate-btn;
    -webkit-animation-duration: 0.35s;
    animation-name: rotate-btn;
    animation-duration: 0.35s;
    -moz-animation-timing-function: ease;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0s;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-timing-function: ease;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0s;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-delay: 0s;
    animation-play-state: running;
    animation-fill-mode: forwards;    
}

@-webkit-keyframes rotate-btn {
    0% {
        -webkit-transform: rotate(0deg);
        -webkit-transform-origin: initial;
    }
    100% {
        -webkit-transform: rotate(270deg);
        -webkit-transform-origin: initial;
    }
}

@-moz-keyframes rotate-btn {
    0% {
        -moz-transform: rotate(0deg);
        -moz-transform-origin: initial;
    }
    100% {
        -moz-transform: rotate(270deg);
        -moz-transform-origin: initial;
    }
}

@keyframes rotate-btn {
    0% {
        transform: rotate(0deg);
        transform-origin: initial;
    }
    100% {
        transform: rotate(270deg);
        transform-origin: initial;
    }
}



.mes-widget .mes-bt.an-active{
    -webkit-animation-name: rotate-reverse-btn;
    -moz-animation-duration: 0.35s;
    -webkit-animation-name: rotate-reverse-btn;
    -webkit-animation-duration: 0.35s;
    animation-name: rotate-reverse-btn;
    animation-duration: 0.35s;
    -moz-animation-timing-function: ease;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0s;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-timing-function: ease;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0s;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease;
    animation-direction: normal;
    animation-delay: 0s;
    animation-play-state: running;
    animation-fill-mode: forwards;
}

@-webkit-keyframes rotate-reverse-btn {
    0% {
        -webkit-transform: rotate(0deg);
        -webkit-transform-origin: initial;
    }
    100% {
        -webkit-transform: rotate(-360deg);
        -webkit-transform-origin: initial;
    }
}

@-moz-keyframes rotate-reverse-btn {
    0% {
        -moz-transform: rotate(0deg);
        -moz-transform-origin: initial;
    }
    100% {
        -moz-transform: rotate(-360deg);
        -moz-transform-origin: initial;
    }
}

@keyframes rotate-reverse-btn {
    0% {
        transform: rotate(0deg);
        transform-origin: initial;
    }
    100% {
        transform: rotate(-360deg);
        transform-origin: initial;
    }
}


@keyframes trambling-animation {
    0%, 50%, 100% {
        transform: rotate(0deg);
    }
    10%, 30% {
        transform: rotate(-10deg);
    }
    20%, 40% {
        transform: rotate(10deg);
    }
}

.mes-widget .widget-links-wrapper {
    display: none;
}

.mes-widget .widget-links{
    display: grid;
    grid-gap: 10px;
    justify-content: center;
}

.mes-widget .widget-links a{
    display: block;
    width:45px;
    height: 45px;
    visibility: hidden;
    opacity: 0;
    transition: 0.2s;
    transform: translateY(-10px);
}

.mes-widget .widget-links a:hover{
    -webkit-animation: shake-btn-form 2s 0s ease-out 1;
    -moz-animation: shake-btn-form 2s 0s ease-out 1;
    -ms-animation: shake-btn-form 2s 0s ease-out 1;
    animation: shake-btn-form 2s 0s ease-out 1;
    animation-iteration-count: infinite;
}

.mes-widget .widget-links.active a{
    visibility: visible;
    opacity: 1;
    transform: translateY(0px);
    transition: .3s;
}

.mes-widget .widget-links.active a:nth-child(4){
    transition-delay: .2s;
}

.mes-widget .widget-links.active a:nth-child(3){
    transition-delay: .3s;
}

.mes-widget .widget-links.active a:nth-child(2){
    transition-delay: .4s;
}

.mes-widget .widget-links.active a:nth-child(1){
    transition-delay: .5s;
}




.mes-widget .widget-links a:nth-child(1){
    transition-delay: .2s;
}

.mes-widget .widget-links a:nth-child(2){
    transition-delay: .3s;
}

.mes-widget .widget-links a:nth-child(3){
    transition-delay: .4s;
}

.mes-widget .widget-links a:nth-child(4){
    transition-delay: .5s;
}

.mes-widget .widget-links a img{
    width:100%;
    max-width: 100%;
}



body.is-active{
    background-color: #000;
}

body .education,
body .free-lesson,
body .reviews{
    transition: color 0.6s ease;
}

body.is-active .education,
body.is-active .free-lesson,
body.is-active .reviews{
    color:#fff;    
}

body.is-active .free-lesson ul li::before{
    background-color: #fff;
}

body.is-active .free-lesson .types-list .item,
body.is-active .education .triggers-list .item{
    border-color:#fff;
}

body{
    transition: background-color 0.6s ease, color 0.6s ease;
}

.free-lesson ul li::before{
    transition: background-color 0.6s ease;
}


.free-lesson .types-list .item,
.education .triggers-list .item{
    transition: border-color 0.6s ease;

}

.fade-element{
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 1s ease, transform 1s ease;
}

.fade-element.visible{
    opacity: 1;
    transform: translateY(0);

}

.fade-element-2>div{
    opacity: 0;
    transform: translate3d(-10px, 0, 0);
    transition: opacity 1s ease, transform 1s ease;
}

.fade-element-2.visible>div{
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.fade-element-2.visible>div:nth-child(2){
    transition-delay: 0.2s; 
}

.fade-element-2.visible>div:nth-child(3){
    transition-delay: 0.4s; 
}

.fade-element-2.visible>div:nth-child(4){
    transition-delay: 0.6s; 
}

.hidden,
.fancybox-hidden{
    display: none;
}

.form-popup.fancybox-content{
    padding:60px;
    width: 100%;
    max-width: 650px;
}

.form-popup form{
    display: grid;
    grid-gap:30px;
    justify-items: center;
}

.form-popup form.hidden{
    display: none;
}

.form-popup .fields-box{
    grid-gap:20px;
    max-width:400px;
    width:100%;
}

.form-popup .title-box{
    max-width:500px;
    text-align: center;
}

.form-popup .title-box .title{
    font-size:39px;
}

.form-popup .title-box .title .dinamic{
    display: block;
    width:100%;
}

.form-popup .title-box .subtitle p{
    margin-bottom:0;
    margin-top:10px;
}

.form-popup input[type="text"],
.form-popup input[type="tel"],
.form-popup input[type="email"],
.form-popup textarea,
.form-popup input[type="number"]{
    padding:5px 0;
    border-bottom:1px solid var(--grey-color);
    width:100%;
    outline: inherit;
}

.form-popup .bt-box{
    width:100%;
    max-width:270px;
    text-align: center;
}

.form-popup .bt{
    background-color: var(--purple-color);
    font-weight: bold;
    color: #3BFF85;
    border-width: 1px;
    padding:0;
    margin:10px 0;
    width: 100%;
    max-width:100%;
}

.form-popup .bt span{
    padding: 20px 33px;
    width: 100%;
}

.form-popup .bt span::before{
    background-color:#5b10b1;
}

.form-popup .bt-box p{
    font-size:10px;
    margin:0;
}

.form-popup .bt-box p a{
    color:blue;
    text-decoration: underline;
    color:#45D4AB;
}

.form-popup .bt-box p a:hover{
    text-decoration: none;
}

.fancybox-slide--html .form-popup .fancybox-close-small{
    padding:0;
    top:10px;
    right:10px;
}

.form-popup .fancybox-button{
    z-index: 999;
}

.message{
    text-align: center;
    display: block;
    margin: 0;
}

.message span{
    padding-left:30px;
    position: relative;
}

.message span::before{
    content: '';
    position: absolute;
    top:calc((100% - 20px) / 2);
    left:0;
    width:20px;
    height: 20px;
    background-position: center;
    background-size:20px 20px;
    background-repeat: no-repeat;

}

.message span.success::before{
    background-image: url(img/check.svg);
}

.message span.error::before{
    background-image: url(img/error.svg);
}

.privacy-page{
    padding-bottom:50px;
}

.back-bt{
    position: absolute;
    top: 50px;
    left: 50px;
}

.back-bt a{
    color:#000;
    text-decoration: initial;
    padding-left:30px;
    background-position: left center;
    background-image: url(img/left-arrow.svg);
    background-repeat: no-repeat;
    background-size:20px;
}



ol {
    list-style: none;
    counter-reset: li;
    padding-left:0;
    margin: 0;
    display: grid;
    grid-gap: 30px;
}
ol li:before {
    counter-increment: li;
    content: counters(li,".") ". ";
    float:left;
}

ol ol{
    grid-gap:10px;
    margin-left:50px;
}