/*------------------ ------------------*/
/*                RESET                */
/*------------------ ------------------*/
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,dialog,div,dl,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,hr,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,meter,nav,object,ol,output,p,pre,progress,q,rp,rt,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video,xmp{border:0;margin:0;padding:0;font-size:100%}body,html{height:100%}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}b,strong{font-weight:700}img{color:transparent;font-size:0;vertical-align:middle;max-width:100%;max-height:100%;width:auto;height:auto;-ms-interpolation-mode:bicubic}ol,ul{list-style:none}li{display:list-item}table{border-collapse:collapse;border-spacing:0}caption,td,th{font-weight:400;vertical-align:top;text-align:left}q{quotes:none}q:after,q:before{content:'';content:none}small,sub,sup{font-size:75%}sub,sup{line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg{overflow:hidden}.clear,.clr{display:block;clear:both;overflow:hidden;line-height:0!important;height:0!important;font-size:0;margin:0;padding:0}.clearfix:after,.clearfix:before{content:"";display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both}.clearfix{zoom:1}html{overflow-x:hidden}hr{border:0 #ccc solid;border-top-width:1px;clear:both;height:0}ol{list-style:decimal}ul{list-style:disc}li{margin-left:30px}address,dl,fieldset,figure,hr,ol,p,pre,table,ul{margin-top:0}
.hr-shadow{position:relative;overflow:hidden;height:25px}.hr-shadow:after{position:absolute;content:'';z-index:1;height:20px;top:-20px;left:50%;width:100%;margin-left:-50%;-webkit-border-radius:200px/10px;-moz-border-radius:200px/10px;border-radius:200px/10px;box-shadow:0 0 30px rgba(0,0,0,.28)}

.swal2-popup {width: 40rem !important;}
.swal2-popup.swal2-toast {padding: 2rem !important;font-size: 2rem !important;}
h2#swal2-title {line-height: 2rem !important;}

/* Верстка ---------------------- */
.main {max-width: 1220px;clear: both;box-sizing: border-box;margin: 0 auto;padding: 0 10px;position: relative;z-index: 2;}
.fw:before,.fw:after {content: '';display: block;background: inherit;position: absolute;height: 100%;width: 10000px;top: 0;}
.fw:before{right: 100%;} .fw:after{left: 100%;}
.dark:after {content: ''; width: 100%; height: 100%; background: rgb(0 0 0 / 0.35); position: absolute; top: 0; left: 0;}


/* Modal ---------------------- */
    /*behavior*/
    .fon_modal {z-index: 10001;top: 0;left: 0;bottom: 0;right: 0;position: fixed;display: none;}
    .modalwrapper {-webkit-overflow-scrolling: touch;perspective: 1000px;overflow-y: scroll;z-index: 1000;top: 0;right: 0;width: 100%;height: 100%;display: none;position: fixed;}
    .modal {left: 50%;transform: translate(-50%, 0%) rotateX(50deg) scale(.6);bottom: auto;opacity: 0;z-index: 10002;box-sizing: border-box;transition: 1s;display: none;position: absolute;}
    .modal.poehali {transform: translate(-50%, -50%);opacity: 1;margin-top: 0;}
    .modal .close_modal {position: absolute;z-index: 999999;text-align: center;cursor: pointer;transition: .5s;}

    /*modal width & position*/
    .modal {width: 450px;top: 50%;}
    #modal_5 {width: 600px;}
    .modal.poehali {transform: translate(-50%, -50%);opacity: 1;margin-top: 0;}

    /*style*/
    .modalwrapper {background: rgba(0, 0, 0, 0.7);}
    .modal {background: #fff;color: #fff;box-shadow: 5px 5px 15px #000;padding: 40px;}
    .modal .close_modal {color: var(--textcolor);background: transparent;width: 35px;height: 35px;line-height: 35px;font-size: 30px;border-radius: 5px;right: 15px;top: 15px;}
    .modal .close_modal:hover {transform: rotate(90deg);}
    .modal h3 {color: var(--textcolor);font-weight: 700;font-size: 20px;line-height: 24px;padding: 20px 0 0;}
    .modal p.comment {color: var(--textcolor);}
    
    .modalwrapper_4 {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgb(255 255 255 / 68%);-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;z-index: 5555;overflow: auto;display: none;}
    .modalwrapper_4 .modal {background: #fff;width: 750px;color: #222;left: 50%;top: 50%;bottom: auto;right: auto;display: block;transform: translate(-50%,-50%);position: absolute;border-radius: 10px;box-shadow: 10px 10px 20px rgb(0 0 0 / 45%);}
    .modalwrapper_4 .close_modal {position: absolute;right: 20px;top: 20px;font-size:25px;cursor: pointer;}

    
    .modal-title {background: linear-gradient(90deg,#ffdb73,#d48f14);}
    .modal-text-full {margin-top: -250px;position: relative; z-index: 2;}
    .modal-text-block {border: 2px solid #222;max-width: 80%;margin: 0 auto;}
    .modal-blocks > div:first-child {border-right: 2px solid #222;}
    .modal-blocks {border-top: 2px solid #222;}
    .modal-text-block-new img {width: 28px;}


/* Список - галочки  ---------------------- */
    ul.check-list {margin-left: 0}
    ul.check-list li {list-style-type: none;padding-left: 40px;position: relative;margin-bottom: 5px;margin-left: 0;}
    ul.check-list li:before {color: var(--maincolor);position: absolute;font-family: 'FontAwesome';content: "\f00c";display: inline-block;left: 0px;}

/* circle-list¸  ---------------------- */
    .circle-list, .news #content .content-text ul {margin: 25px 0;}
    .circle-list li, .news #content .content-text li {list-style-type: none;margin-bottom: 8px;position: relative;}
    .circle-list li:before, .news #content .content-text li:before {right: calc(100% + 12px);top:50%;transform:translateY(-50%);border: 2px solid var(--maincolor2);width: 8px;height: 8px;border-radius: 100px;position: absolute;display: block;content:'';}


/* ol li customization ---------------------- */
    ol.numbered {margin: 25px 0;display: block;counter-reset: myCounter;}
    ol.numbered li {margin-bottom: 8px;margin-left: 0;list-style-type: none;padding-left: 26px;position: relative;}
    ol.numbered li:before {background:var(--maincolor2);counter-increment:myCounter;content:counter(myCounter);position:absolute;right: calc(100% + -15px);top:50%;transform:translateY(-50%);color:#fff;display:inline-block;text-align:center;width:17px;height:17px;line-height:17px;border-radius:100px;font-size:.7em}

/* Fancybox    ---------------------- */  
    a[data-fancybox] {position: relative;display: block;}
    a[data-fancybox] img {border-radius: 5px;}
    a[data-fancybox]:after {background: url(/assets/img/icons/zoom.svg) 50% 50%/20px no-repeat, rgb(41 128 185 / 18%);display: block;content:"";position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;border-radius: 5px;border: 1px solid #fff;transition:.5s;}
    a[data-fancybox]:hover:after {opacity: 1;}
    
/* Breadcrumbs    ------------------- */
    .breadcrumb {list-style-type: none;font-size: .9em;display: block; padding: 10px 0;}
    .breadcrumb li {display: inline-block;margin-left: 0;}
    .breadcrumb a {color: var(--maincolor);text-decoration: none;}
    .breadcrumb a:hover {text-decoration: underline;}
    .breadcrumb .divider {padding: 0 5px;display: inline-block;}
    
    #breadcrumbs_sub {position: absolute;z-index: 9;text-align: center;left: 0;bottom: -120px;width: 100%;}
    #breadcrumbs_sub .breadcrumb a {color: var(--maincolor2);}

/* TABLE */
.table{max-width:100%;overflow-x:auto;margin: 15px 0;width:100%;background: var(--grey);}
.table::-webkit-scrollbar {width: 8px;height: 8px;background: #000;}
.table::-webkit-scrollbar-track {background: transparent;}
.table::-webkit-scrollbar-thumb {background-color: var(--maincolor2);border-radius: 10px;}
.table td {padding: 10px 5px;color: #000;vertical-align: middle;width: auto !important;height: auto !important;}
.table tr {border-bottom: 1px solid #e7e7e7;}
.table td a {border-bottom: 1px dashed var(--maincolor2);}
.table tr:last-child {border-bottom: 0;}
.table tr th {background: var(--maincolor2);font-weight: 600;padding: 10px 5px;}

.maxwidth400 {max-width: 400px;margin: 0 auto;}
.maxwidth500 {max-width: 500px;margin: 0 auto;}
.maxwidth600 {max-width: 600px;margin: 0 auto;}
.maxwidth700 {max-width: 700px;margin: 0 auto;}
.maxwidth800 {max-width: 800px;margin: 0 auto;}
.maxwidth900 {max-width: 900px;margin: 0 auto;}
.maxwidth1000 {max-width: 1000px;margin: 0 auto;}
/* OWL Carousel    ------------------- */

    /* arrows 1 */
        .owl-arrows1 .owl-nav button {width: 40px;height: 40px;background: var(--grey) !important;color: #222 !important;border-radius: 5px;top: 50%;transform: translateY(-50%);outline: none;position: absolute;}
        .owl-arrows1 .owl-nav .owl-prev {left: 5px;}
        .owl-arrows1 .owl-nav .owl-next {right: 5px;}
        .owl-arrows1 .owl-nav button:hover {background: var(--maincolor2) !important;color: #fff !important}


    /* arrows 2 */
        .owl-arrows2 {padding: 0 40px;margin: 0;box-sizing: border-box;}
        .owl-arrows2 .owl-prev, 
        .owl-arrows2 .owl-next {background: var(--maincolor2) !important;color: #fff !important;height: 30px;width: 30px;border-radius: 5px;padding: 0;box-sizing: border-box;font-size: 0;position: absolute;transition: 0.3s;top: 50%;transform: translateY(-50%);outline: none;}
        .owl-arrows2 .owl-prev {left: 0px}
        .owl-arrows2 .owl-next {right: 0px;}
    
    
    /* arrows 3 */
        .owl-arrows3 .owl-nav {top: -50px;right: 0;position: absolute;}
        .owl-arrows3 .owl-nav button {width: 40px;height: 40px;line-height: 40px !important;background: var(--maincolor2) !important;color: #fff !important;border-radius: 5px;margin-left: 10px;outline: none;}
        .owl-arrows3 .owl-nav button.disabled {background: var(--dark) !important;cursor: initial;}
        
    /* dots 1 */
        .owl-dots1 .owl-dots {margin-top: 10px;text-align: center;}
        .owl-dots1 .owl-dots button {background: var(--dark) !important;width: 10px;height: 10px;margin: 0 5px;border-radius: 30px;transition: .2s;outline: none;display: inline-block;}
        .owl-dots1 .owl-dots button.active, 
        .owl-dots1 .owl-dots button:hover {background: var(--maincolor2) !important;}
    
    
    /* dots 2 */
        /*
            <div class="owl-dots2-wrapper">
                <div class="owl-dots2"></div>
            </div>
            dotsContainer: '.owl-dots2',
        */
        .owl-dots2-wrapper {text-align: center;line-height: 10px;}
        .owl-dots2 {background: var(--grey);padding: 20px;border-radius: 5px;margin: 20px 0;text-align: center;display: inline-block;line-height: 0px;}
        .owl-dots2 button {background: var(--dark) !important;width: 10px;height: 10px;margin: 0 5px;border-radius: 30px;transition: .2s;outline: none;display: inline-block;border: 0;padding: 0;}
        .owl-dots2 .owl-dots {margin-top: 35px;}
        .owl-dots2 button.active, 
        .owl-dots2 button:hover {background: var(--maincolor2) !important;}
        
        



/*------------------ -------------------*/
/*                COMMON                */
/*------------------ -------------------*/
:root {
    --maincolor: #6e3f8e;
    --maincolor2: #00bcfb;
    --textcolor: #222;
    --hcolor: #2b2b2b;
    --red: #e84118;
    --blue: #f2f7fe;
    --yellow: #f5f4e0;
    --grey:  #f8f8f6;
    --darkgrey: #efefef;
    --white: #fff;
    --dark: #373737;
    --boxshadow: 0 6px 10px rgba(68, 92, 130, 0.14), 0 1px 18px rgba(68, 92, 130, 0.12), 0 3px 5px rgba(68, 92, 130, 0.2);
}


.maincolor {color: var(--maincolor)}
.maincolor2 {color: var(--maincolor2)}
.textcolor {color: var(--textcolor)}
.hcolor {color: var(--hcolor)}
.red {color: var(--red)}
.blue {color: var(--blue)}
.yellow {color: var(--yellow)}
.grey {color: var(--grey)}
.darkgrey {color: var(--sky)}
.white {color: var(--white)}
.dark {color: var(--dark)}

.bg-maincolor {background: var(--maincolor);}
.bg-maincolor2 {background: var(--maincolor2);}
.bg-textcolor {background: var(--textcolor);}
.bg-hcolor {background: var(--hcolor);}
.bg-red {background: var(--red);}
.bg-blue {background: var(--blue);}
.bg-yellow {background: var(--yellow);}
.bg-grey {background: var(--grey);}
.bg-darkgrey {background: var(--darkgrey);}
.bg-white {background: var(--white);}
.bg-dark {background: var(--dark);}


body::-webkit-scrollbar {width: 10px;background: transparent;}
body::-webkit-scrollbar-track {background: transparent;}
body::-webkit-scrollbar-thumb {background-color: var(--maincolor);border-radius: 10px;}
::selection {background: var(--yellow);color: #222;}


html {font-size: 10px;}
body {font-size: 1.8rem;line-height: 2.8rem;font-family: 'Montserrat', sans-serif;font-weight: 400;color: var(--textcolor);}
a {font-weight:400;color: var(--blue);outline: none;text-decoration: none;}
p {margin-bottom: 20px;}
h1 {font-size: 5.0rem;line-height: 5.5rem;margin-bottom: 40px;font-weight: 900;color: var(--hcolor)}
h2 {font-size: 4.5rem;line-height: 5.0rem;margin-bottom: 40px;font-weight: 900;color: var(--hcolor)}
h3 {font-size: 3.5rem;line-height: 4.0rem;margin-bottom: 25px;font-weight: 900;color: var(--hcolor)}
h4 {font-size: 3.0rem;line-height: 3.5rem;margin-bottom: 25px;font-weight: 900;color: var(--hcolor)}
h5 {font-size: 2.8rem;line-height: 3.3rem;margin-bottom: 25px;font-weight: 900;color: var(--hcolor)}
h6 {font-size: 2.5rem;line-height: 3.0rem;margin-bottom: 25px;font-weight: 900;color: var(--hcolor)}

.anchor {
    transform: translateY(-100px);
}


.bshad {box-shadow: 0 6px 10px rgba(68, 92, 130, 0.14), 0 1px 18px rgba(68, 92, 130, 0.12), 0 3px 5px rgba(68, 92, 130, 0.2);;}
.before-line {position: relative;color: var(--hcolor);padding: 0 0 0 130px;}
.before-line:before {display: inline-block;height: 2px;width: 100px;background: var(--hcolor);content: "";position:  absolute;top: 50%;transform: translateY(-50%);left: 0;}
.before-line-main {color: var(--maincolor);}
.before-line-main:before {background: var(--maincolor);}

.bottom-line {position: relative;z-index: 2;display: inline-block;padding: 0 5px;}
.bottom-line:before{left:0;bottom: 0px;width: 100%;max-width: 500px;display: inline-block;height: 10px;background: var(--maincolor2);border-radius:2px;position:absolute;content:'';z-index:-1;}
.small {font-size: 1.45rem;line-height: 2rem;}
.iframe_usl {width:100%;height:315px;}

/* FORM  ---------------------- */
input[type="text"], textarea {line-height: 50px;min-height: 50px;padding: 0 20px;font-weight: 400;color: #222222;border-radius: 0;width: 100%;margin: 0 0 10px 0;background: var(--grey);border: 0;font: inherit;outline: none;box-sizing: border-box;display: block;transition:.5s;}
input[type="text"].error {background: #f7ebeb;}
textarea {padding: 20px;line-height: normal;resize: vertical;}
input:focus, textarea:focus {background: #e0e2e8;}
.bigbutton {font-size: 1.6rem;line-height: 50px;padding: 0 50px;background: var(--maincolor2);color: #fff;letter-spacing: .5;font-family: 'Proxima Nova Bold';white-space: nowrap;cursor: pointer;border: 0;outline: none;border-radius: 5px;display: inline-block;}
.button-arrow {color: #fff;font-weight: 500;/* font-family: Poppins,sans-serif; */background: #9c6abf;/* box-shadow: 0 0 10px #2a363b; */height: 50px;line-height: 50px;padding: 0 60px;border-radius: 30px;position: relative;display: inline-block;border: 0;outline: none;cursor: pointer;white-space: nowrap;}
.button-arrow:before {width: 28px;height: 28px;background: url(/assets/img/icons/next.png) 50% 50%/100% no-repeat;left: 20px;top: 50%;transform: translateY(-50%);position: absolute;content: '';display: block;}
    
.effect{position:relative;overflow:hidden}
.effect:before{content:'';width:100%;height:60px;display:block;position:absolute;z-index:3;border-left:100px solid rgba(255,255,255,.3);box-shadow:-20px 30px 30px rgba(255,255,255,.3);background:0 0;top:0;left:-100px;margin-left:-1px;transition:all 0s ease-in-out;transform:translate(0,0)}
.effect:hover:before{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out;-webkit-transform:translate(115%,0);-moz-transform:translate(115%,0);-ms-transform:translate(115%,0);-o-transform:translate(115%,0);transform:translate(115%,0)}

    /*blik*/
    .blik{position:relative;overflow:hidden}    
    .blik:before{content:'';width:100%;height:60px;display:block;position:absolute;z-index:3;border-left:100px solid rgba(255,255,255,.2);box-shadow:-20px 30px 30px rgba(255,255,255,.1);background:0 0;top:0;left:-100px;margin-left:-1px;transition:all 0s ease-in-out;transform:translate(0,0)}
    .blik:hover:before{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;transition:all .4s ease-in-out;-webkit-transform:translate(115%,0);-moz-transform:translate(115%,0);-ms-transform:translate(115%,0);-o-transform:translate(115%,0);transform:translate(115%,0)}
    
/* slide down from top */
.overlay {height: 0%;width: 100%;position: fixed;z-index: 99;top: 0;left: 0;background-color: rgb(0 0 0 / 85%);overflow-y: scroll;transition: .5s;}
body.over_lay {overflow-y: hidden !important;}
.overlay-content {position: relative;top: 5%;width: 500px;margin: 30px auto;z-index: 100;}
.overlay a {padding: 8px;text-decoration: none;font-size: 36px;color: #fff;display: block;transition: .5s;}
.overlay .closebtn {position: absolute;top: 20px;right: 45px;font-size: 80px;font-weight: 300;color: #fff;}
.overlay-content h2, .overlay-content p {color: #fff; margin-bottom: 10px;font-weight: 600;text-align: center;}
.overlay-content p {margin-bottom: 20px !important;}
.overlay-content .labelFile{background: #f3f4f8;padding: 5px 50px 5px 5px;border: 4px solid var(--maincolor);}


/* HEADER ----------------------------- */
    #header {border-bottom: 2px solid #dbe4ef;left: 0;top: 0;width: 100%;position: fixed;z-index: 3;}
    #header .main {height: 100px;transition: .5s;}
    
    #header .main > * {position: absolute;top: 50%;transform: translateY(-50%);}  
    #header .logo {height: 80px;left: 10px;transition:.5s;}
      
    .top_icon_block {width: 250px;font-weight: .8;}
    
    .top_icon_block {position: relative;padding-left: 30px;}
    .top_icon_block img {left: 0;top: 3px;position: absolute;}
    .top_icon_block p {margin-bottom: 0;color: #575757;font-weight: 500;font-size: 16px;transition:.5s;}
    .top_icon_block b {margin-bottom: 5px;font-weight: 500;display: inline-block;color: #000;}
    .top_icon_block a {text-decoration: none;color: #575757;font-weight: 500;}
    
    .top_icon_block1 {right: 410px ;}
    .top_icon_block2 {right: 210px;}
    .top_icon_block3 {right: 10px;}
   
    #header.scrolled {background: #fff;}
    #header.scrolled .main {height: 60px;}
    #header.scrolled .logo {height: 50px;}
    #header.scrolled .top_icon_block p {line-height: 18px;}
    
    #header .menu {
        left: 300px;
    }
    
    #header .menu a {
        display: inline-block;
        color: #000;
        font-weight: 700;
        margin-right: 20px;
    }
    
    #header .menu a:hover {text-decoration: underline;}
    
    #header .tg a {color: var(--maincolor);font-weight: 700;}
    #header .tg img {width: 30px;}
    #header .tg {right: 20px;}


/* BANNER -------------*/
    #banner {position: relative;padding-top: 100px;}
    
    .oh {min-height: 2000px;}

    #banner .krug {top: -350px;top: -350px;right: -350px;width: 1300px;height: 1000px;background: var(--blue);border-radius: 100%;position: absolute;transform: rotate(-30deg);}
    
    #banner .main {height: 600px;}
    
    .banner-text {width: 60%;top: 50%;transform: translateY(-50%);position: absolute;}

    #banner .img {position: absolute;border-radius: 100%;z-index: 3;transition:.2s linear;}
    #banner .img1 {top: 100px;right: 250px;width: 270px;}
    #banner .img2 {top: 430px;right: 260px;width: 160px;}
    #banner .img3 {top: 290px;right: 30px;width: 210px;}
    
    #banner .decor {position: absolute;border-radius: 100%;z-index: 2;transition:.2s linear;}
    #banner .decor1 {right: 10px;top: 100px;height: 100px;width: 100px;background: #a1e7fe;}
    #banner .decor2 {right: 160px;top: 220px;height: 50px;width: 50px;background: linear-gradient(to top, #9f73bb, #d39ef5);}
    #banner .decor3 {right: 480px;top: 410px;height: 80px;width: 80px;background: #d3aeeb;}




/* Why -------------*/
    #why .whyblock {background: #fff;padding: 25px 20px 19px;}

/* To Know ---------------*/
    #toknow .text_box1, #toknow .text_box3 {border-left: 6px solid #f37335;border-radius: 5px;padding-left: 50px;}
    #toknow .text_box2, #toknow .text_box4 {border-right: 6px solid #0056b3;border-radius: 5px;padding-right: 50px;}
    
/* About ----------------*/
    #about .aboutblock1 p {font-size: 16px;line-height: 23px;font-weight: 400;margin-top: 20px;padding-top: 20px;border-top: 1px solid #41434a;}
    #about .aboutblock2 {padding-left: 50px;}
    
/* Teacher -----------*/
    #teacher h2 {margin-bottom: 60px;}
    #teacher h4 {font-size: 19px;line-height: 25px;margin: 0 0 10px;font-weight: 600;}
    #teacher .who {font-size: .8em;line-height: 1.5em;font-weight: 300;margin-bottom: 5px;}
   
    
    #teacher .img {position: relative;margin-bottom: 30px;}
    #teacher .img img {border-radius: 20px;}
    #teacher .img .subject {font-size: .7em;line-height: 25px;background-color: #ffd31d;bottom: 0;left: 25px;margin: 0;white-space: nowrap;padding: 0 10px;border-radius: 100px;transform: translateY(50%);position: absolute;}
    #teacher .img .subject img {display: inline-block;vertical-align: middle;width: 15px;border-radius: 0;margin-right: 7px;}
    
    
        /* OWL Gallery */
        .owl-carousel .owl-stage-outer {overflow: visible !important}
        .owl-item.active {transform: none !important;opacity: 1;}
        .owl-item {transform: scale(.8) !important;transition: linear .5s;opacity:.5;}
        
          /* owl-dots */
            .owl-carousel .owl-dots {width: 100%;text-align:center;box-sizing: border-box;}
            .owl-carousel .owl-dots .owl-dot{display:inline-block;outline: none;height:5px;width:30px;background:#dcdde1;border-radius:2px;margin:0 10px}
            .owl-carousel .owl-dots .owl-dot.active{background: #f37335;}

           /* owl-nav */
              .owl-carousel .owl-nav {right: 0;position: absolute;top: -135px;transform: translateY(50%);}
              .owl-carousel .owl-nav button {width: 50px;height: 50px;line-height: 40px !important;background: rgb(243 115 53) !important;color: #fff !important;border-radius: 5px;font-size: 26px!important;outline: none;margin-left: 10px;}
              .owl-carousel .owl-nav button:hover {background:#245ea3!important;color:#fff!important}   
              .owl-carousel .owl-nav button.disabled {background: #ccc !important;cursor: initial;}
        
/* Offline school ----------*/
    .additional-block.padding {padding: 10px 0 100px;}
    .additional-block .main {background: linear-gradient(90deg,#f2f7fd,#4c92ce);background-repeat: no-repeat;padding: 57px 100px 55px;border-radius: 40px;position: relative;}
    .additional-block .main:before {content: "";position: absolute;bottom: 46px;left: 0;width: 59px;height: 115px;background-image: url(/assets/img/06.form/form-bg1.png);background-repeat: no-repeat;z-index: 2;}
    .additional-block .main:after {content: "";position: absolute;bottom: 15px;right: 0;width: 78px;height: 100px;background-image: url(/assets/img/06.form/form-bg2.png);background-repeat: no-repeat;z-index: 2;}
    .additional-block h3 {color: #2b2b2b;font-size: 28px;line-height: 36px;font-weight: 700;margin-bottom: 20px;}
    
    
    .additional-block2 .main {background: linear-gradient(90deg,#f2fdf5,#97e76d);}
    .additional-block3 .main {background: linear-gradient(90deg,#f7f7e9,#e7d371);}
    
 
/* program ---------------*/
.program-path {
    padding: 0 50px;
    border-left: 1px solid #dadada;
    border-right: 1px solid #dadada;
    position: relative;
}
.boy {transform: scale(-1,1);}
 
    
/* Price ---------------*/
    #price img {border-radius: 10px 10px 0 0;/* min-height: 100px; */border-bottom: 8px solid var(--maincolor2);}
    #price .info {padding: 40px 15px 27px;}
    #price .flex.price-wrapper > div {border-radius: 30px;}
    #price .flex.price-wrapper .block100 {border: 0}
    #price .info h2 {    position: relative;font-size: 16px;line-height: 24px;margin-bottom: 20px;font-weight: 500;}
    #price .info h2 span {font-size: 1.5em;font-weight: 700;}
    /*#price .info h2:before {content: "";position: absolute;top: -20px;left: -10px;width: 75px;height: 71px;background: url(/assets/img/icons/sec-bg.png) 50% 50%/100%;z-index: -1;}*/
    #price .price {color: #9c6abf;font-size: 26px;font-weight: 700;display: block;margin-bottom: 20px;}
    
    .priceblock {position: relative;padding-bottom: 90px;}
    #price .bottom {position: absolute;left: 0;bottom: 0;width: 100%;padding: 20px;text-align: center;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}

/* Learning ---------------*/
    #learning h2 {margin-bottom: 80px;}
    #learning .lblock {margin-bottom: 50px;}
    #learning .lblock img {border-radius: 100%;width: 215px;box-shadow: 0 0 20px rgb(60 60 60 / 26%);margin-bottom: 15px;}
    #learning .lblock h4 {font-size: 18px;line-height: 24px;}
    #learning .lblock p {font-size: 16px; line-height: 24px;}
    #learning .lblock h4, #learning .lblock p {max-width: 380px;margin-left: auto;margin-right: auto;}
    
    
/* FAQ ---------------*/
    #faq .q{padding: 30px 20px;border-left: 7px solid #1161a0;border-radius: 10px;box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.14);cursor:pointer;margin-bottom:20px;position: relative;}
    #faq .q:after {right: 30px;top: 50%;transform: translateY(-50%);width: 30px;height: 30px;background: url(/assets/img/icons/plus.svg) 0 0/100% no-repeat;content: '';position: absolute;display: block;transition: .5s;transform-origin: 50% 50%;}
    #faq .q.open:after {transform: translateY(-50%) rotate(45deg);}
    #faq .a{padding: 20px;margin-bottom: 20px;display: none;line-height: 26px;border: 1px solid #dadada;border-radius: 10px;margin-top: 20px;}
   


/* form ----------*/
    #form {position: relative;z-index: 2;}
    #form select {background: url(/assets/img/icons/arrowdown.svg) no-repeat 95% 21px #fff;line-height: 53px;max-height: 60px;background-size: 10px auto;border-radius: 20px;display: inline-block;margin-bottom: 20px;}
    select {-webkit-appearance: none;width: 100%;line-height: 50px;max-height: 50px;color: #757575 !important;padding: 0 40px 0 20px !important;background: url(/assets/img/icons/arrowdown.svg) no-repeat 95% 21px #f3f4f8;background-size: 10px auto;margin: 0 0 10px 0;outline: none;font-family: inherit;font-size: 1.8rem;border: none;line-height: 40px;max-height: 40px;}
    
    #form .logo {max-width: 200px;}  
    #form form {position: relative;z-index: 3;}
    #form .main {background: linear-gradient(90deg,#ecdcf7,#6e428c);box-shadow: var(--boxshadow);/* border: 2px solid #cecece; */background-repeat: no-repeat;padding: 57px 100px 55px;border-radius: 40px;position: relative;}
    #form .main:before {content: "";position: absolute;bottom: 46px;left: 0;width: 59px;height: 115px;background-image: url(/assets/img/06.form/form-bg1.png);background-repeat: no-repeat;z-index: 2;}
    #form .main:after {content: "";position: absolute;bottom: 15px;right: 0;width: 78px;height: 100px;background-image: url(/assets/img/06.form/form-bg2.png);background-repeat: no-repeat;z-index: 2;}
    
    input[type="text"], textarea {width: 100%;background: #fff;border-radius: 20px;border: 0;padding: 6px 20px;box-sizing: border-box;font: inherit;outline: none;min-height: 50px;}
    textarea {height: 70px;line-height: 25px;}
    #form h3 {font-size: 36px;line-height: 50px;margin-bottom: 70px;}
    #form h3 span {color: #fff;}
    #form img {position: absolute;left: -20px;top: -15px;}
    #form .button-arrow {font: inherit;background: #63b4e2;}
    
    #modal_1 input[type="text"], #modal_1 textarea {background: var(--grey);}
    #modal_1 select {background-color: var(--grey);line-height: 50px;max-height: 50px;border-radius: 20px;}

/* Footer ----------*/
    #footer {background: #f2f7fd}
    #footer .contact2 img {max-width: 35px;}
    #footer a {font-weight: 600;color: #000;}
    #footer .contact-block {padding-bottom: 10px;}
    #footer .contact-icon {width: 30px;display: inline-block;margin-right: 10px;}

    .copyright {font-size: .8em;display: inline-block;color: #000;text-decoration: none;transform: translateY(90px);}
    .copyright:hover {text-decoration: underline;}
    .copyright img {width: 50px;}




@media all and (max-width: 1220px) {
    .main {width: 990px;}
    
    /* header  -------------*/
        #form h3 {font-size: 28px;line-height: 40px;margin-bottom: 30px;}
        .banner-text {width: 50%;}
    
    /* BANNER -------------*/
        #banner .img,
        #banner .decor {transform: none !important;}
        
        #banner .img1 {right: 210px;}
        #banner .img2 {right: 240px;}
        #banner .img3 {right: 10px;}
        #banner .decor2 {right: 130px;}
        #banner .decor3 {right: 420px;}
 
     /* about  -------------*/
     #about .button-arrow {font-size: .9em;}
} 

@media all and (max-width: 980px) {
    .main {width:770px;}
    h1 {font-size: 3.0rem;line-height: 4.0rem;}
    h2 {font-size: 2.5rem;line-height: 3.5rem;}
    h3 {font-size: 2.3rem;line-height: 3.0rem;}
    h4 {font-size: 2.1rem;line-height: 2.9rem;}
    h5 {font-size: 2.0rem;line-height: 2.6rem;}
    h6 {font-size: 1.85rem;line-height: 2.3rem;}

    /* header  -------------*/
        .top_icon_block2 {display: none;}
        .top_icon_block1 {right: 200px;}
        
        .whyblock img {width: 50px;}
    
    /* BANNER -------------*/
        #banner .img1 {right: 115px;width: 240px;}
        #banner .img2 {top: 380px;right: 180px;width: 140px;}
        #banner .img3 {right: 0px;width: 150px;}
        #banner .decor1 {right: 0px;top: 100px;height: 80px;width: 80px;}
        #banner .decor2 {right: 50px;}
        #banner .decor3 {right: 290px;top: 335px;width: 40px;height: 40px;}
   
       .additional-block h2 {font-size: 36px;line-height: 46px;margin-bottom: 30px;}

        #form {margin-top: 0;padding: 0 0 30px 0 !important;}
        
    /* Program -------------*/
    .program-path {padding: 0 20px;}
    
    /* Price ---------------*/
        .flex.price-wrapper > div > img {width: 100%;}
    /* To Know ---------------*/
        #toknow {padding-bottom: 0;}
        .text_box, .image_box {margin-bottom: 100px;}
    
    /* form ----------*/
        #form {transform: none;}
        #form h3 {font-size: 28px;line-height: 40px;margin-bottom: 20px;}
        #form, #footer {padding: 50px 0;}
    
    /* contacts ----------*/  
        .copyright {transform: translateY(40px);}
}

@media all and (max-width: 768px) {
    .main {width: 100%;}
    .button-arrow {height: auto;line-height: 20px;padding: 10px 35px 10px 50px;font-size: 1.6rem;}
    .button-arrow:before {width: 20px;height: 20px;}

     h6 {font-size: 1.75rem;line-height: 2.3rem;}
    /* modal*/
        .modal {padding: 20px;left: 0;top: 0;transform: none !important;width: 100%;min-height: 100%;border-radius: 0;}
        .modal .close_modal {top: 5px;right: 5px;}
        .modal .comment {text-align: left;}
        #modal_1 .modal_boxs {width: 500px; margin: 0 auto; text-align: center;}
    
    /* BANNER -------------*/
        .banner-text {position: initial;}
        .top_icon_block3 {display: none;}
        .top_icon_block1 {right: -80px;}
        .banner-text {width: 100%;top: 40px;transform: none;}
         #banner {padding-top: 150px;}
        #banner .img1 {top: 409px;right: 230px;width: 200px;}
        #banner .img2 {top: 391px;right: 470px;width: 100px;}
        #banner .img3 {top: 376px;right: 30px;width: 150px;}
        #banner .decor1 {right: 50px;top: 300px;height: 50px;width: 50px;}
        #banner .decor2 {right: 220px;top: 409px;height: 30px;width: 30px;}
        #banner .decor3 {right: 481px;top: 526px;height: 40px;width: 40px;}
    
    /* Why -------------*/
    .additional-block h2 {font-size: 34px;line-height: 40px;margin-bottom: 30px;}

    
    /* About ----------------*/
        #about .aboutblock2 {padding-left: 0;}
        
    /* Teacher -----------*/
        .owl-carousel .owl-nav {display: none !important;}
    
    /* Price ---------------*/
        #price .info h2:before {left: 0;}

    /* FAQ ---------------*/
        #faq .q:after {right: 12px;}
        #faq .q {padding: 20px 10px;}
        
    /* form */
        
        #form .main {padding: 30px 45px;}

    /* contacts ----------*/
        #footer {padding: 100px 0 50px;}
    
    /* Modal ---------------------- */
    .modal {padding: 20px;left: 0;top: 0;transform: none !important;width: 100% !important;min-height: 100%;border-radius: 0;}
    .modal .close_modal {top: 5px;right: 5px;}
    .modal {text-align: left;}
    
        
    .modalwrapper_4 {padding: 10px !important;left: 0px;top: 0;transform: none !important;width: 100%;min-height: 100%;border-radius: 0;border:0;box-sizing: border-box;}
    .modalwrapper_4 .modal {left: 0;top: 0;transform: none;}
    .modalwrapper_4 .close_modal {top: 30px;right: 30px;}
    .modal-text-full {margin-top: -100px;}
    .modal-text-block {max-width: 90%;}
}

@media all and (max-width: 570px) {
    .main {width: auto;}
    
    h1 {font-size: 2.5rem;line-height: 3.5rem;}
    h2 {font-size: 2.3rem;line-height: 3.0rem;}
    h3 {font-size: 2.1rem;line-height: 2.9rem;}

    h2.style:before {top: -10px;left: 0;width: 52px;height: 58px;background: url(/assets/img/sec-bg.png) 50% 50%/100% no-repeat;}
    #form select, input[type="text"], textarea, #modal_1 select {font-size: 1.6rem;}

    /* header  -------------*/
    .oh {padding-top: 75px;}
    #header {position: fixed;left: 0;top: 0;width: 100%;height: 50px;z-index: 5;background: #fff;padding-top: 0;}
    #header .main {height: 50px;}
    #header .logo {height: 40px;}
    .top_icon_block1 {right: -90px;}
    .top_icon_block p {line-height: 18px;}
    
    #header.scrolled {height: 60px;}
    
    /* BANNER -------------*/
        #banner {padding-top: 0;margin-top: 60px;}
        #banner .krug {top: -410px;right: -111px;width: 960px;height: 890px;transform: rotate(0deg);}
        .banner-text {padding-top: 20px;}
        #banner .main {height: 500px;}
        #banner .img1, #banner .img2,#banner .img3,#banner .decor1,#banner .decor2,#banner .decor3 {display: none;}
    
    /* why  -------------*/
        #why {padding-top: 0;}
        #learning .lblock img {width: 160px;}
        
    /* Teacher -----------*/
        .owl-carousel  {padding-right: 45px;box-sizing: border-box;}
        .owl-carousel .owl-dots .owl-dot {width: 20px;margin: 0px 7px;}
        
    /* Price ---------------*/
    .additional-block.padding {padding: 10px 0 50px;}
    .additional-block .main {padding: 45px 35px 45px;border-radius: 40px;position: relative;}
    .additional-block h2 {font-size: 26px;line-height: 30px;margin-bottom: 20px;}
    .additional-block h3 {font-size: 19px;line-height: 25px;margin-bottom: 10px;}
        
    /* to know  -------------*/
        #toknow .text_box1, #toknow .text_box3 {padding-left: 10px;}
        #toknow .text_box2, #toknow .text_box4 {padding-right: 10px;}
        .text_box {margin-bottom: 0;}
        .image_box {margin-bottom: 100px;}
        #toknow p {font-size: 15px;line-height: 18px;}
        #toknow p {font: inherit;}
            #toknow .text_box1 {order: 1;}
            #toknow .image_box1 {order: 2;} 
            #toknow .text_box2 {order: 3;}
            #toknow .image_box2 {order: 4;} 
            #toknow .text_box3 {order: 5;}
            #toknow .image_box3 {order: 6;} 
            #toknow .text_box4 {order: 7;}
            #toknow .image_box4 {order: 8;} 
    
    /* FAQ ---------------*/
        #faq .q {padding: 20px 50px 20px 10px;}
        #form h3 {font-size: 22px;line-height: 28px;}
        #form .main {padding: 15px 20px;}
    
    /* form ----------*/  
        #form, #footer {padding: 20px 0 !important;}
    
    /* contacts ----------*/
        .copyright {transform: translateY(20px);}
}