@import url(https://fonts.google.com/?query=Noto&subset=cyrillic-ext&lang=bg_Cyrl);

.title {
    font-family: var(--cci-font-title);
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueRegular.eot);
    src: local("Bebas Neue Regular"), local("BebasNeueRegular"), url(../fonts/BebasNeueRegular.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueRegular.woff) format("woff"), url(../fonts/BebasNeueRegular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueBold.eot);
    src: local("Bebas Neue Bold"), local("BebasNeueBold"), url(../fonts/BebasNeueBold.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueBold.woff) format("woff"), url(../fonts/BebasNeueBold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueLight.eot);
    src: local("Bebas Neue Light"), local("BebasNeueLight"), url(../fonts/BebasNeueLight.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueLight.woff) format("woff"), url(../fonts/BebasNeueLight.ttf) format("truetype");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeue-Thin.eot);
    src: local("Bebas Neue Thin"), local("BebasNeue-Thin"), url(../fonts/BebasNeue-Thin.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeue-Thin.woff) format("woff"), url(../fonts/BebasNeue-Thin.ttf) format("truetype");
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue Book;
    src: url(../fonts/BebasNeueBook.eot);
    src: local("Bebas Neue Book"), local("BebasNeueBook"), url(../fonts/BebasNeueBook.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueBook.woff) format("woff"), url(../fonts/BebasNeueBook.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueRegular.eot);
    src: local("Bebas Neue Regular"), local("BebasNeueRegular"), url(../fonts/BebasNeueRegular.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueRegular.woff) format("woff"), url(../fonts/BebasNeueRegular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueBold.eot);
    src: local("Bebas Neue Bold"), local("BebasNeueBold"), url(../fonts/BebasNeueBold.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueBold.woff) format("woff"), url(../fonts/BebasNeueBold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeueLight.eot);
    src: local("Bebas Neue Light"), local("BebasNeueLight"), url(../fonts/BebasNeueLight.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueLight.woff) format("woff"), url(../fonts/BebasNeueLight.ttf) format("truetype");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue;
    src: url(../fonts/BebasNeue-Thin.eot);
    src: local("Bebas Neue Thin"), local("BebasNeue-Thin"), url(../fonts/BebasNeue-Thin.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeue-Thin.woff) format("woff"), url(../fonts/BebasNeue-Thin.ttf) format("truetype");
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: Bebas Neue Book;
    src: url(../fonts/BebasNeueBook.eot);
    src: local("Bebas Neue Book"), local("BebasNeueBook"), url(../fonts/BebasNeueBook.eot?#iefix) format("embedded-opentype"), url(../fonts/BebasNeueBook.woff) format("woff"), url(../fonts/BebasNeueBook.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: Inter SemiBold;
    src: url(../fonts/Inter/static/Inter-SemiBold.ttf);
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: Inter Medium;
    src: url(../fonts/Inter/static/Inter-Medium.ttf);
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Inter Light;
    src: url(../fonts/Inter/static/Inter-Light.ttf);
    font-weight: 400;
    font-style: normal
}

.simpleslider {
    width: 100%;
}
.simpleslider .slides {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
}
.simpleslider .slides .slide {
    -webkit-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}
.simpleslider .slides .slide.right,
.simpleslider .slides .slide.righter {
    -webkit-transform: translate(110%);
    -ms-transform: translate(110%);
    transform: translate(110%);
}
.simpleslider .slides .slide.left,
.simpleslider .slides .slide.lefter {
    -webkit-transform: translate(-110%);
    -ms-transform: translate(-110%);
    transform: translate(-110%);
}

.fill-height {
    height: 100%
}

.text-center {
    text-align: center !important
}

.text-right {
    text-align: right !important
}

.text-left {
    text-align: left !important
}

.m-align-center {
    margin-right: auto
}

.m-align-center, .to-right {
    margin-left: auto
}

.to-left {
    margin-right: auto
}

.opacity-0 {
    opacity: 0
}

.opacity-1 {
    opacity: .1
}

.opacity-2 {
    opacity: .2
}

.opacity-3 {
    opacity: .3
}

.opacity-4 {
    opacity: .4
}

.opacity-5 {
    opacity: .5
}

.opacity-6 {
    opacity: .6
}

.opacity-7 {
    opacity: .7
}

.opacity-8 {
    opacity: .8
}

.opacity-9 {
    opacity: .9
}

.h-100vh {
    height: calc(var(--vh, 1vh) * 100) !important
}

.mh-100vh {
    min-height: calc(var(--vh, 1vh) * 100) !important
}

.w-33 {
    width: 33.3333% !important
}

.w-66 {
    width: 66.6666% !important
}

.mt-0 {
    margin-top: 0 !important
}

.mr-0 {
    margin-right: 0 !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.ml-0, .mx-0 {
    margin-left: 0 !important
}

.mx-0 {
    margin-right: 0 !important
}

.ma-0, .my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.pt-0 {
    padding-top: 0 !important
}

.pr-0 {
    padding-right: 0 !important
}

.pb-0 {
    padding-bottom: 0 !important
}

.pl-0, .px-0 {
    padding-left: 0 !important
}

.px-0 {
    padding-right: 0 !important
}

.pa-0, .py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.mt-1 {
    margin-top: 2px !important
}

.mr-1 {
    margin-right: 2px !important
}

.mb-1 {
    margin-bottom: 2px !important
}

.ml-1, .mx-1 {
    margin-left: 2px !important
}

.mx-1 {
    margin-right: 2px !important
}

.ma-1, .my-1 {
    margin-top: 2px !important;
    margin-bottom: 2px !important
}

.pt-1 {
    padding-top: 2px !important
}

.pr-1 {
    padding-right: 2px !important
}

.pb-1 {
    padding-bottom: 2px !important
}

.pl-1, .px-1 {
    padding-left: 2px !important
}

.px-1 {
    padding-right: 2px !important
}

.pa-1, .py-1 {
    padding-top: 2px !important;
    padding-bottom: 2px !important
}

.mt-2 {
    margin-top: 4px !important
}

.mr-2 {
    margin-right: 4px !important
}

.mb-2 {
    margin-bottom: 4px !important
}

.ml-2, .mx-2 {
    margin-left: 4px !important
}

.mx-2 {
    margin-right: 4px !important
}

.ma-2, .my-2 {
    margin-top: 4px !important;
    margin-bottom: 4px !important
}

.pt-2 {
    padding-top: 4px !important
}

.pr-2 {
    padding-right: 4px !important
}

.pb-2 {
    padding-bottom: 4px !important
}

.pl-2, .px-2 {
    padding-left: 4px !important
}

.px-2 {
    padding-right: 4px !important
}

.pa-2, .py-2 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
}

.mt-3 {
    margin-top: 6px !important
}

.mr-3 {
    margin-right: 6px !important
}

.mb-3 {
    margin-bottom: 6px !important
}

.ml-3, .mx-3 {
    margin-left: 6px !important
}

.mx-3 {
    margin-right: 6px !important
}

.ma-3, .my-3 {
    margin-top: 6px !important;
    margin-bottom: 6px !important
}

.pt-3 {
    padding-top: 6px !important
}

.pr-3 {
    padding-right: 6px !important
}

.pb-3 {
    padding-bottom: 6px !important
}

.pl-3, .px-3 {
    padding-left: 6px !important
}

.px-3 {
    padding-right: 6px !important
}

.pa-3, .py-3 {
    padding-top: 6px !important;
    padding-bottom: 6px !important
}

.mt-4 {
    margin-top: 8px !important
}

.mr-4 {
    margin-right: 8px !important
}

.mb-4 {
    margin-bottom: 8px !important
}

.ml-4, .mx-4 {
    margin-left: 8px !important
}

.mx-4 {
    margin-right: 8px !important
}

.ma-4, .my-4 {
    margin-top: 8px !important;
    margin-bottom: 8px !important
}

.pt-4 {
    padding-top: 8px !important
}

.pr-4 {
    padding-right: 8px !important
}

.pb-4 {
    padding-bottom: 8px !important
}

.pl-4, .px-4 {
    padding-left: 8px !important
}

.px-4 {
    padding-right: 8px !important
}

.pa-4, .py-4 {
    padding-top: 8px !important;
    padding-bottom: 8px !important
}

.mt-5 {
    margin-top: 10px !important
}

.mr-5 {
    margin-right: 10px !important
}

.mb-5 {
    margin-bottom: 10px !important
}

.ml-5, .mx-5 {
    margin-left: 10px !important
}

.mx-5 {
    margin-right: 10px !important
}

.ma-5, .my-5 {
    margin-top: 10px !important;
    margin-bottom: 10px !important
}

.pt-5 {
    padding-top: 10px !important
}

.pr-5 {
    padding-right: 10px !important
}

.pb-5 {
    padding-bottom: 10px !important
}

.pl-5, .px-5 {
    padding-left: 10px !important
}

.px-5 {
    padding-right: 10px !important
}

.pa-5, .py-5 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
}

.mt-6 {
    margin-top: 12px !important
}

.mr-6 {
    margin-right: 12px !important
}

.mb-6 {
    margin-bottom: 12px !important
}

.ml-6, .mx-6 {
    margin-left: 12px !important
}

.mx-6 {
    margin-right: 12px !important
}

.ma-6, .my-6 {
    margin-top: 12px !important;
    margin-bottom: 12px !important
}

.pt-6 {
    padding-top: 12px !important
}

.pr-6 {
    padding-right: 12px !important
}

.pb-6 {
    padding-bottom: 12px !important
}

.pl-6, .px-6 {
    padding-left: 12px !important
}

.px-6 {
    padding-right: 12px !important
}

.pa-6, .py-6 {
    padding-top: 12px !important;
    padding-bottom: 12px !important
}

.mt-7 {
    margin-top: 14px !important
}

.mr-7 {
    margin-right: 14px !important
}

.mb-7 {
    margin-bottom: 14px !important
}

.ml-7, .mx-7 {
    margin-left: 14px !important
}

.mx-7 {
    margin-right: 14px !important
}

.ma-7, .my-7 {
    margin-top: 14px !important;
    margin-bottom: 14px !important
}

.pt-7 {
    padding-top: 14px !important
}

.pr-7 {
    padding-right: 14px !important
}

.pb-7 {
    padding-bottom: 14px !important
}

.pl-7, .px-7 {
    padding-left: 14px !important
}

.px-7 {
    padding-right: 14px !important
}

.pa-7, .py-7 {
    padding-top: 14px !important;
    padding-bottom: 14px !important
}

.mt-8 {
    margin-top: 16px !important
}

.mr-8 {
    margin-right: 16px !important
}

.mb-8 {
    margin-bottom: 16px !important
}

.ml-8, .mx-8 {
    margin-left: 16px !important
}

.mx-8 {
    margin-right: 16px !important
}

.ma-8, .my-8 {
    margin-top: 16px !important;
    margin-bottom: 16px !important
}

.pt-8 {
    padding-top: 16px !important
}

.pr-8 {
    padding-right: 16px !important
}

.pb-8 {
    padding-bottom: 16px !important
}

.pl-8, .px-8 {
    padding-left: 16px !important
}

.px-8 {
    padding-right: 16px !important
}

.pa-8, .py-8 {
    padding-top: 16px !important;
    padding-bottom: 16px !important
}

.mt-9 {
    margin-top: 18px !important
}

.mr-9 {
    margin-right: 18px !important
}

.mb-9 {
    margin-bottom: 18px !important
}

.ml-9, .mx-9 {
    margin-left: 18px !important
}

.mx-9 {
    margin-right: 18px !important
}

.ma-9, .my-9 {
    margin-top: 18px !important;
    margin-bottom: 18px !important
}

.pt-9 {
    padding-top: 18px !important
}

.pr-9 {
    padding-right: 18px !important
}

.pb-9 {
    padding-bottom: 18px !important
}

.pl-9, .px-9 {
    padding-left: 18px !important
}

.px-9 {
    padding-right: 18px !important
}

.pa-9, .py-9 {
    padding-top: 18px !important;
    padding-bottom: 18px !important
}

.mt-10 {
    margin-top: 20px !important
}

.mr-10 {
    margin-right: 20px !important
}

.mb-10 {
    margin-bottom: 20px !important
}

.ml-10, .mx-10 {
    margin-left: 20px !important
}

.mx-10 {
    margin-right: 20px !important
}

.ma-10, .my-10 {
    margin-top: 20px !important;
    margin-bottom: 20px !important
}

.pt-10 {
    padding-top: 20px !important
}

.pr-10 {
    padding-right: 20px !important
}

.pb-10 {
    padding-bottom: 20px !important
}

.pl-10, .px-10 {
    padding-left: 20px !important
}

.px-10 {
    padding-right: 20px !important
}

.pa-10, .py-10 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
}

.mt-11 {
    margin-top: 22px !important
}

.mr-11 {
    margin-right: 22px !important
}

.mb-11 {
    margin-bottom: 22px !important
}

.ml-11, .mx-11 {
    margin-left: 22px !important
}

.mx-11 {
    margin-right: 22px !important
}

.ma-11, .my-11 {
    margin-top: 22px !important;
    margin-bottom: 22px !important
}

.pt-11 {
    padding-top: 22px !important
}

.pr-11 {
    padding-right: 22px !important
}

.pb-11 {
    padding-bottom: 22px !important
}

.pl-11, .px-11 {
    padding-left: 22px !important
}

.px-11 {
    padding-right: 22px !important
}

.pa-11, .py-11 {
    padding-top: 22px !important;
    padding-bottom: 22px !important
}

.mt-12 {
    margin-top: 24px !important
}

.mr-12 {
    margin-right: 24px !important
}

.mb-12 {
    margin-bottom: 24px !important
}

.ml-12, .mx-12 {
    margin-left: 24px !important
}

.mx-12 {
    margin-right: 24px !important
}

.ma-12, .my-12 {
    margin-top: 24px !important;
    margin-bottom: 24px !important
}

.pt-12 {
    padding-top: 24px !important
}

.pr-12 {
    padding-right: 24px !important
}

.pb-12 {
    padding-bottom: 24px !important
}

.pl-12, .px-12 {
    padding-left: 24px !important
}

.px-12 {
    padding-right: 24px !important
}

.pa-12, .py-12 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
}

.mt-13 {
    margin-top: 26px !important
}

.mr-13 {
    margin-right: 26px !important
}

.mb-13 {
    margin-bottom: 26px !important
}

.ml-13, .mx-13 {
    margin-left: 26px !important
}

.mx-13 {
    margin-right: 26px !important
}

.ma-13, .my-13 {
    margin-top: 26px !important;
    margin-bottom: 26px !important
}

.pt-13 {
    padding-top: 26px !important
}

.pr-13 {
    padding-right: 26px !important
}

.pb-13 {
    padding-bottom: 26px !important
}

.pl-13, .px-13 {
    padding-left: 26px !important
}

.px-13 {
    padding-right: 26px !important
}

.pa-13, .py-13 {
    padding-top: 26px !important;
    padding-bottom: 26px !important
}

.mt-14 {
    margin-top: 28px !important
}

.mr-14 {
    margin-right: 28px !important
}

.mb-14 {
    margin-bottom: 28px !important
}

.ml-14, .mx-14 {
    margin-left: 28px !important
}

.mx-14 {
    margin-right: 28px !important
}

.ma-14, .my-14 {
    margin-top: 28px !important;
    margin-bottom: 28px !important
}

.pt-14 {
    padding-top: 28px !important
}

.pr-14 {
    padding-right: 28px !important
}

.pb-14 {
    padding-bottom: 28px !important
}

.pl-14, .px-14 {
    padding-left: 28px !important
}

.px-14 {
    padding-right: 28px !important
}

.pa-14, .py-14 {
    padding-top: 28px !important;
    padding-bottom: 28px !important
}

.mt-15 {
    margin-top: 30px !important
}

.mr-15 {
    margin-right: 30px !important
}

.mb-15 {
    margin-bottom: 30px !important
}

.ml-15, .mx-15 {
    margin-left: 30px !important
}

.mx-15 {
    margin-right: 30px !important
}

.ma-15, .my-15 {
    margin-top: 30px !important;
    margin-bottom: 30px !important
}

.pt-15 {
    padding-top: 30px !important
}

.pr-15 {
    padding-right: 30px !important
}

.pb-15 {
    padding-bottom: 30px !important
}

.pl-15, .px-15 {
    padding-left: 30px !important
}

.px-15 {
    padding-right: 30px !important
}

.pa-15, .py-15 {
    padding-top: 30px !important;
    padding-bottom: 30px !important
}

.mt-16 {
    margin-top: 32px !important
}

.mr-16 {
    margin-right: 32px !important
}

.mb-16 {
    margin-bottom: 32px !important
}

.ml-16, .mx-16 {
    margin-left: 32px !important
}

.mx-16 {
    margin-right: 32px !important
}

.ma-16, .my-16 {
    margin-top: 32px !important;
    margin-bottom: 32px !important
}

.pt-16 {
    padding-top: 32px !important
}

.pr-16 {
    padding-right: 32px !important
}

.pb-16 {
    padding-bottom: 32px !important
}

.pl-16, .px-16 {
    padding-left: 32px !important
}

.px-16 {
    padding-right: 32px !important
}

.pa-16, .py-16 {
    padding-top: 32px !important;
    padding-bottom: 32px !important
}

.mt-17 {
    margin-top: 34px !important
}

.mr-17 {
    margin-right: 34px !important
}

.mb-17 {
    margin-bottom: 34px !important
}

.ml-17, .mx-17 {
    margin-left: 34px !important
}

.mx-17 {
    margin-right: 34px !important
}

.ma-17, .my-17 {
    margin-top: 34px !important;
    margin-bottom: 34px !important
}

.pt-17 {
    padding-top: 34px !important
}

.pr-17 {
    padding-right: 34px !important
}

.pb-17 {
    padding-bottom: 34px !important
}

.pl-17, .px-17 {
    padding-left: 34px !important
}

.px-17 {
    padding-right: 34px !important
}

.pa-17, .py-17 {
    padding-top: 34px !important;
    padding-bottom: 34px !important
}

.mt-18 {
    margin-top: 36px !important
}

.mr-18 {
    margin-right: 36px !important
}

.mb-18 {
    margin-bottom: 36px !important
}

.ml-18, .mx-18 {
    margin-left: 36px !important
}

.mx-18 {
    margin-right: 36px !important
}

.ma-18, .my-18 {
    margin-top: 36px !important;
    margin-bottom: 36px !important
}

.pt-18 {
    padding-top: 36px !important
}

.pr-18 {
    padding-right: 36px !important
}

.pb-18 {
    padding-bottom: 36px !important
}

.pl-18, .px-18 {
    padding-left: 36px !important
}

.px-18 {
    padding-right: 36px !important
}

.pa-18, .py-18 {
    padding-top: 36px !important;
    padding-bottom: 36px !important
}

.mt-19 {
    margin-top: 38px !important
}

.mr-19 {
    margin-right: 38px !important
}

.mb-19 {
    margin-bottom: 38px !important
}

.ml-19, .mx-19 {
    margin-left: 38px !important
}

.mx-19 {
    margin-right: 38px !important
}

.ma-19, .my-19 {
    margin-top: 38px !important;
    margin-bottom: 38px !important
}

.pt-19 {
    padding-top: 38px !important
}

.pr-19 {
    padding-right: 38px !important
}

.pb-19 {
    padding-bottom: 38px !important
}

.pl-19, .px-19 {
    padding-left: 38px !important
}

.px-19 {
    padding-right: 38px !important
}

.pa-19, .py-19 {
    padding-top: 38px !important;
    padding-bottom: 38px !important
}

.mt-20 {
    margin-top: 40px !important
}

.mr-20 {
    margin-right: 40px !important
}

.mb-20 {
    margin-bottom: 40px !important
}

.ml-20, .mx-20 {
    margin-left: 40px !important
}

.mx-20 {
    margin-right: 40px !important
}

.ma-20, .my-20 {
    margin-top: 40px !important;
    margin-bottom: 40px !important
}

.pt-20 {
    padding-top: 40px !important
}

.pr-20 {
    padding-right: 40px !important
}

.pb-20 {
    padding-bottom: 40px !important
}

.pl-20, .px-20 {
    padding-left: 40px !important
}

.px-20 {
    padding-right: 40px !important
}

.pa-20, .py-20 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
}

.mt-21 {
    margin-top: 42px !important
}

.mr-21 {
    margin-right: 42px !important
}

.mb-21 {
    margin-bottom: 42px !important
}

.ml-21, .mx-21 {
    margin-left: 42px !important
}

.mx-21 {
    margin-right: 42px !important
}

.ma-21, .my-21 {
    margin-top: 42px !important;
    margin-bottom: 42px !important
}

.pt-21 {
    padding-top: 42px !important
}

.pr-21 {
    padding-right: 42px !important
}

.pb-21 {
    padding-bottom: 42px !important
}

.pl-21, .px-21 {
    padding-left: 42px !important
}

.px-21 {
    padding-right: 42px !important
}

.pa-21, .py-21 {
    padding-top: 42px !important;
    padding-bottom: 42px !important
}

.mt-22 {
    margin-top: 44px !important
}

.mr-22 {
    margin-right: 44px !important
}

.mb-22 {
    margin-bottom: 44px !important
}

.ml-22, .mx-22 {
    margin-left: 44px !important
}

.mx-22 {
    margin-right: 44px !important
}

.ma-22, .my-22 {
    margin-top: 44px !important;
    margin-bottom: 44px !important
}

.pt-22 {
    padding-top: 44px !important
}

.pr-22 {
    padding-right: 44px !important
}

.pb-22 {
    padding-bottom: 44px !important
}

.pl-22, .px-22 {
    padding-left: 44px !important
}

.px-22 {
    padding-right: 44px !important
}

.pa-22, .py-22 {
    padding-top: 44px !important;
    padding-bottom: 44px !important
}

.mt-23 {
    margin-top: 46px !important
}

.mr-23 {
    margin-right: 46px !important
}

.mb-23 {
    margin-bottom: 46px !important
}

.ml-23, .mx-23 {
    margin-left: 46px !important
}

.mx-23 {
    margin-right: 46px !important
}

.ma-23, .my-23 {
    margin-top: 46px !important;
    margin-bottom: 46px !important
}

.pt-23 {
    padding-top: 46px !important
}

.pr-23 {
    padding-right: 46px !important
}

.pb-23 {
    padding-bottom: 46px !important
}

.pl-23, .px-23 {
    padding-left: 46px !important
}

.px-23 {
    padding-right: 46px !important
}

.pa-23, .py-23 {
    padding-top: 46px !important;
    padding-bottom: 46px !important
}

.mt-24 {
    margin-top: 48px !important
}

.mr-24 {
    margin-right: 48px !important
}

.mb-24 {
    margin-bottom: 48px !important
}

.ml-24, .mx-24 {
    margin-left: 48px !important
}

.mx-24 {
    margin-right: 48px !important
}

.ma-24, .my-24 {
    margin-top: 48px !important;
    margin-bottom: 48px !important
}

.pt-24 {
    padding-top: 48px !important
}

.pr-24 {
    padding-right: 48px !important
}

.pb-24 {
    padding-bottom: 48px !important
}

.pl-24, .px-24 {
    padding-left: 48px !important
}

.px-24 {
    padding-right: 48px !important
}

.pa-24, .py-24 {
    padding-top: 48px !important;
    padding-bottom: 48px !important
}

.mt-25 {
    margin-top: 50px !important
}

.mr-25 {
    margin-right: 50px !important
}

.mb-25 {
    margin-bottom: 50px !important
}

.ml-25, .mx-25 {
    margin-left: 50px !important
}

.mx-25 {
    margin-right: 50px !important
}

.ma-25, .my-25 {
    margin-top: 50px !important;
    margin-bottom: 50px !important
}

.pt-25 {
    padding-top: 50px !important
}

.pr-25 {
    padding-right: 50px !important
}

.pb-25 {
    padding-bottom: 50px !important
}

.pl-25, .px-25 {
    padding-left: 50px !important
}

.px-25 {
    padding-right: 50px !important
}

.pa-25, .py-25 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
}

.mt-auto {
    margin-top: auto !important
}

.mb-auto {
    margin-bottom: auto !important
}

.ml-auto {
    margin-left: auto !important
}

.mr-auto, .mx-auto {
    margin-right: auto !important
}

.mx-auto {
    margin-left: auto !important
}

.my-auto {
    margin-bottom: auto !important;
    margin-top: auto !important
}

.pt-auto {
    padding-top: auto !important
}

.pb-auto {
    padding-bottom: auto !important
}

.pl-auto {
    padding-left: auto !important
}

.pr-auto, .px-auto {
    padding-right: auto !important
}

.px-auto {
    padding-left: auto !important
}

.py-auto {
    padding-bottom: auto !important;
    padding-top: auto !important
}

.hidden-xs-up {
    display: none !important
}

.w-0 {
    width: 0 !important
}

.w-5 {
    width: 5% !important
}

.w-10 {
    width: 10% !important
}

.w-15 {
    width: 15% !important
}

.w-20 {
    width: 20% !important
}

.w-25 {
    width: 25% !important
}

.w-30 {
    width: 30% !important
}

.w-35 {
    width: 35% !important
}

.w-40 {
    width: 40% !important
}

.w-45 {
    width: 45% !important
}

.w-50 {
    width: 50% !important
}

.w-55 {
    width: 55% !important
}

.w-60 {
    width: 60% !important
}

.w-65 {
    width: 65% !important
}

.w-70 {
    width: 70% !important
}

.w-75 {
    width: 75% !important
}

.w-80 {
    width: 80% !important
}

.w-85 {
    width: 85% !important
}

.w-90 {
    width: 90% !important
}

.w-95 {
    width: 95% !important
}

.w-100 {
    width: 100% !important
}

.w-auto {
    width: auto !important
}

.d-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.d-inline-flex {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.d-block {
    display: block
}

.d-inline-block {
    display: inline-block
}

.d-inline {
    display: inline
}

.d-none {
    display: none
}



html {
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.71em;
    margin: 0;
    padding: 0;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    scroll-behavior: smooth
}

button, input, select, textarea {
    font-family: Roboto, sans-serif;
    font-size: 14px ;
    line-height: 1.71em !important;
    outline: none !important
}

/*body {
    background: #fff;
    color: #36414d;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    width: 100%;
    scroll-behavior: smooth;
    letter-spacing: .2px
}*/

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    outline: none !important
}

h1, h2, h3 {
    font-family: Lato, Roboto, sans-serif;
    margin: 0 0 30px;
    font-weight: 900
}

h1 {
    font-size: 2.285rem;
    line-height: 1.06em
}

h2 {
    font-size: 1.285rem;
    line-height: 1.33em
}

img {
    max-width: 100%
}

img.radius {
    display: block;
    border-radius: 20px
}

a {
    color: #36414d;
    text-decoration: none
}

a:hover {
    text-decoration: underline
}

p {
    -webkit-margin-after: 1em;
    margin-block-end: 1em;
    margin-top: 0
}

textarea {
    width: 100%;
    line-height: 2.3em !important;
    height: 4.6em;
    border: none;
    background: url(/assets/images/textarea-bg.png);
    padding: 0
}

.radio-block .items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    border: 1px solid #36414d;
    border-radius: 2px;
    overflow-x: hidden
}

.radio-block .items label {
    border-right: 1px solid #36414d
}

.radio-block .items label span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 52px;
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #36414d;
    padding: 0 13px;
    white-space: nowrap
}

.radio-block .items label:last-child {
    border: none
}

.radio-block .items label input {
    display: none
}

.radio-block .items label input:checked + span {
    background: #36414d;
    color: #fff
}

.checkbox, .radio {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 10px 0
}

.checkbox input, .radio input {
    display: block;
    border: none;
    margin: 0 6px 0 0;
    width: 22px;
    height: 20px;
    background: url(/assets/images/checkbox-unchecked.svg) no-repeat 0 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.checkbox input:checked, .radio input:checked {
    background-image: url(/assets/images/checkbox-checked.svg)
}

.checkbox .label, .radio .label {
    width: calc(100% - 28px);
    color: rgba(54, 65, 77, .7);
    opacity: 1
}

.checkbox .label b, .radio .label b {
    color: rgba(54, 65, 77, .9)
}

.radio input {
    background-image: url(/assets/images/radio-unchecked.svg)
}

.radio input:checked {
    background-image: url(/assets/images/radio-checked.svg)
}

.white .checkbox .label, .white .radio .label {
    color: hsla(0, 0%, 100%, .7)
}

.white .checkbox .label b, .white .radio .label b {
    color: hsla(0, 0%, 100%, .9)
}

.bgcolor-yellow {
    background-color: #eec930
}

.bgcolor-blue {
    background-color: #208bfc
}

.bgcolor-red {
    background-color: #f76059
}

.weight-700 {
    font-weight: 700
}

.weight-900 {
    font-weight: 900
}

.uppercase {
    text-transform: uppercase !important
}

.tt-none {
    text-transform: none !important
}

.wrapper {
    width: 100%
}

.container, .container-semi, .container-wide {
    width: 100%;
    margin: 0 auto;
    padding: 0 20px
}

.invisible {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    opacity: 0;
    pointer-events: none
}

.invisible.active {
    opacity: 1;
    pointer-events: auto
}

.pointer {
    cursor: pointer
}

.plus {
    width: 14px;
    height: 14px
}

.plus:after, .plus:before {
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background: #f76059;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.plus:after {
    -webkit-transform: translateX(-50%) rotate(90deg);
    -ms-transform: translateX(-50%) rotate(90deg);
    transform: translateX(-50%) rotate(90deg)
}

.color-gray, .color-gray a {
    color: #36414d !important
}

.muted {
    color: #e6e6e6
}

.hero {
    width: 100%
}

.hero.hero-blue {
    background: -o-linear-gradient(195.18deg, #004e9f 0, #3a9aff 100%);
    background: linear-gradient(254.82deg, #004e9f, #3a9aff);
    color: #fff
}

.hero.hero-blue .counter, .hero.hero-blue a {
    color: #fff
}

.hero.hero-blue .counter {
    opacity: .3
}

.hero.hero-yellow {
    background: -o-linear-gradient(195.18deg, #f3be00 0, #ffe062 100%);
    background: linear-gradient(254.82deg, #f3be00, #ffe062)
}

.hero.hero-red {
    background: -o-linear-gradient(142.28deg, #f76059 5.2%, #d53730 86.07%);
    background: linear-gradient(307.72deg, #f76059 5.2%, #d53730 86.07%);
    color: #fff
}

.hero.hero-red .counter, .hero.hero-red a {
    color: #fff
}

.hero.hero-red .counter {
    opacity: .3
}

.first-padding {
    padding-top: 70px
}

mark {
    background: none
}

h1 {
    font-size: 32px;
    line-height: 106%
}

h1, h2 {
    font-family: Lato, Roboto, sans-serif;
    font-weight: 900;
    letter-spacing: .01em;
    margin-bottom: 20px
}

h2 {
    font-size: 18px;
    line-height: 133%
}

h1 .counter, h2 .counter {
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #36414d
}

h1.yellow .counter, h1.yellow mark, h2.yellow .counter, h2.yellow mark {
    color: #eec930
}

h1.blue .counter, h1.blue mark, h2.blue .counter, h2.blue mark {
    color: #208bfc
}

h1.cyan .counter, h1.cyan mark, h2.cyan .counter, h2.cyan mark {
    color: #26cad3
}

h1.red .counter, h1.red mark, h2.red .counter, h2.red mark {
    color: #f76059
}

section {
    padding: 35px 0
}

.t2 {
    font-size: 14px;
    font-weight: 700
}

.simple-star {
    display: inline-block;
    width: 18px;
    height: 18px;
    top: -2px;
    background: url(/assets/images/star-red.svg) no-repeat 50%;
    background-size: contain
}

.simple-star.inactive {
    background-image: url(/assets/images/star-gray.svg);
    opacity: .1
}

.simple-star.big {
    width: 30px;
    height: 30px
}

.simple-star.white {
    background-image: url(/assets/images/star-white.svg)
}

.simple-star.blue {
    background-image: url(/assets/images/star-blue.svg)
}

.simple-star.yellow {
    background-image: url(/assets/images/star-yellow.svg)
}

.quote-sign {
    width: 17px;
    height: 17px;
    background: url(/assets/images/quote-red.svg) no-repeat 50%;
    background-size: contain
}

.quote-sign.red {
    background-image: url(/assets/images/quote-red.svg)
}

.quote-sign.yellow {
    background-image: url(/assets/images/quote-yellow.svg)
}

.quote-sign.blue {
    background-image: url(/assets/images/quote-blue.svg)
}

.quote-sign.cyan {
    background-image: url(/assets/images/quote-cyan.svg)
}

.quote-sign.white {
    background-image: url(/assets/images/quote-white.svg)
}

.plate {
    border: 1px solid #e6e6e6;
    width: calc(100% + 20px);
    left: -10px;
    background: #fff;
    margin-bottom: 20px;
    overflow-x: hidden
}

.plate.no-overflow {
    overflow: initial !important
}

.plate.padding {
    padding: 20px 0
}

.plate.rounded {
    border-radius: 10px
}

.plate.shadowed {
    -webkit-box-shadow: 0 20px 40px rgba(0, 0, 0, .07);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .07)
}

.plate p:last-child {
    margin-bottom: 0
}

.plate.plate-red {
    color: #fff;
    background: -o-linear-gradient(142.28deg, #f76059 5.2%, #d53730 86.07%);
    background: linear-gradient(307.72deg, #f76059 5.2%, #d53730 86.07%)
}

.plate.plate-quarter {
    padding-top: 40px
}

.plate.plate-quarter:before {
    content: "";
    display: block;
    width: 181px;
    height: 179px;
    position: absolute;
    right: 0;
    top: 0;
    background: url(/assets/images/quarter.svg) no-repeat 100% 0;
    border-top-right-radius: 10px
}

.video {
    width: 100%
}

.video .play {
    width: 144px;
    height: 40px;
    background: url(/assets/images/video-view.svg) no-repeat 50%;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.video video {
    max-width: 100%
}

.video.rounded video {
    border-radius: 10px
}

.button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    height: 52px;
    border-radius: 2px;
    color: #fff;
    background: #36414d;
    padding: 0 15px;
    cursor: pointer;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.button.densed {
    height: 40px
}

.button.button-squared {
    width: 52px
}

.button.button-squared.densed {
    width: 40px
}

.button.button-light {
    background: #e6e6e6
}

.button.button-blue {
    background: #208bfc;
    color: #fff
}

.button.button-blue.button-outlined {
    color: #208bfc;
    background: none;
    border: 1px solid #208bfc
}

.button.button-red {
    background: #f76059;
    color: #fff
}

.button.button-red.button-outlined {
    color: #f76059;
    background: none;
    border: 1px solid #f76059
}

.button.button-red.button-outlined.button-arrow-back:after, .button.button-red.button-outlined.button-arrow-down:after, .button.button-red.button-outlined.button-arrow-up:after, .button.button-red.button-outlined.button-arrow:after {
    background-image: url(/assets/images/arrow-right-red.svg)
}

.button.button-red.button-outlined:hover {
    background: #f76059
}

.button.button-red.button-outlined:hover.button-arrow-back:after, .button.button-red.button-outlined:hover.button-arrow-down:after, .button.button-red.button-outlined:hover.button-arrow-up:after, .button.button-red.button-outlined:hover.button-arrow:after {
    background-image: url(/assets/images/arrow-right-white.svg)
}

.button.button-yellow {
    background: #eec930;
    color: #36414d
}

.button.button-yellow.button-outlined {
    color: #eec930;
    background: none;
    border: 1px solid #eec930
}

.button.button-white {
    background: #fff;
    color: #36414d !important
}

.button.button-white.button-outlined {
    color: #fff !important;
    background: none;
    border: 1px solid #fff
}

.button.button-white.button-outlined.button-arrow:after {
    background-image: url(/assets/images/arrow-right-white.svg)
}

.button.button-white.button-arrow-back:after, .button.button-white.button-arrow-down:after, .button.button-white.button-arrow-up:after, .button.button-white.button-arrow:after {
    background-image: url(/assets/images/arrow-right-gray.svg)
}

.button span {
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase
}

.button.button-arrow:after {
    content: "";
    display: block;
    width: 21px;
    height: 8px;
    background: url(/assets/images/arrow-right-white.svg) no-repeat 100%
}

.button.button-arrow.button-arrow-down:after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.button.button-arrow-back:after {
    content: "";
    display: block;
    width: 21px;
    height: 8px;
    background: url(/assets/images/arrow-right-white.svg) no-repeat 100%;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.button.button-text {
    border: none !important
}

.button.button-check:after {
    content: "";
    display: block;
    width: 19px;
    height: 15px;
    background: url(/assets/images/check-red.svg) no-repeat 100%;
    background-size: contain
}

.button.button-outlined {
    color: #36414d;
    background: none;
    border: 1px solid #36414d
}

.button.button-outlined.button-light {
    border-color: #e6e6e6
}

.button.button-outlined.button-arrow:after {
    background-image: url(/assets/images/arrow-right-gray.svg)
}

blockquote {
    width: 100%;
    margin: 40px 0 20px;
    padding: 20px;
    background: hsla(0, 0%, 90.2%, .2);
    border-radius: 2px
}

blockquote:before {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    content: "";
    width: 17px;
    height: 17px;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(/assets/images/quote-blue.svg) no-repeat;
    background-size: contain
}

blockquote p:last-child {
    margin-bottom: 0
}

.tags {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.tags::-webkit-scrollbar {
    display: none
}

.tags .tags-inner {
    padding: 20px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tags .tags-inner, .tags .tags-inner .tag {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tags .tags-inner .tag {
    height: 40px;
    /*border: 1px solid #e6e6e6;
    border-radius: 2px;*/
    padding: 0 10px;
    white-space: nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    margin-right: 10px
}

.tags .tags-inner .tag span {
    /*color: #208bfc;*/
    margin-left: 5px
}

.tags .tags-inner .tag.active {
    /*border-color: #208bfc;
    background-color: #208bfc;
    color: #fff !important;*/
    font-weight: 700
}

.tags .tags-inner .tag:last-child {
    margin-right: 0
}

.tags.yellow .tag span {
    color: #eec930
}

.tags.yellow .tag.active {
    border-color: #eec930;
    background-color: #eec930
}

.tags.red .tag span {
    color: #f76059
}

.tags.red .tag.active {
    border-color: #f76059;
    background-color: #f76059
}

.stepper {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.stepper::-webkit-scrollbar {
    display: none
}

.stepper .stepper-inner {
    padding: 20px 20px 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.stepper .stepper-inner, .stepper .stepper-inner .step {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.stepper .stepper-inner .step {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    margin-right: 40px
}

.stepper .stepper-inner .step .ls {
    margin-right: 10px
}

.stepper .stepper-inner .step .ls .counter {
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #f76059;
    margin-bottom: 5px
}

.stepper .stepper-inner .step .ls:after {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    position: relative;
    left: 5px;
    background: url(/assets/images/star-red.svg) no-repeat 50%;
    background-size: contain;
    opacity: 0
}

.stepper .stepper-inner .step h2 {
    color: #e6e6e6;
    margin-bottom: 0
}

.stepper .stepper-inner .step.active h2 {
    color: #36414d
}

.stepper .stepper-inner .step.active .ls:after {
    opacity: 1
}

.stepper .stepper-inner .step:last-child {
    margin-right: 0
}

.relative-materials {
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.relative-materials::-webkit-scrollbar {
    display: none
}

.relative-materials .relative-materials-inner {
    padding: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.relative-materials .relative-materials-inner .relative-material {
    width: 70vw;
    margin-right: 20px
}

.relative-materials .relative-materials-inner .relative-material .category {
    color: #f76059;
    margin-bottom: 1em;
    font-weight: 700
}

.relative-materials .relative-materials-inner .relative-material:last-child {
    margin-right: 0
}

.ul-counter {
    list-style: none
}

.ul-counter li {
    margin-bottom: 1rem
}

.ul-counter li:before {
    content: ".01";
    display: block;
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #36414d;
    position: absolute;
    left: -40px;
    top: 1px
}

.ul-counter li:nth-child(2):before {
    content: ".02"
}

.ul-counter li:nth-child(3):before {
    content: ".03"
}

.ul-counter li:nth-child(4):before {
    content: ".04"
}

.ul-counter li:nth-child(5):before {
    content: ".05"
}

.ul-counter li:nth-child(6):before {
    content: ".06"
}

.ul-counter li:nth-child(7):before {
    content: ".07"
}

.ul-counter li:nth-child(8):before {
    content: ".08"
}

.ul-counter li:nth-child(10):before {
    content: ".10"
}

.ul-counter li:nth-child(11):before {
    content: ".11"
}

.ul-counter li:nth-child(12):before {
    content: ".12"
}

.ul-counter li:nth-child(13):before {
    content: ".13"
}

.ul-counter li:nth-child(14):before {
    content: ".14"
}

.ul-counter li:nth-child(15):before {
    content: ".15"
}

.ul-counter li:nth-child(16):before {
    content: ".16"
}

.ul-counter li:nth-child(17):before {
    content: ".17"
}

.ul-counter li:nth-child(18):before {
    content: ".18"
}

.ul-counter li:nth-child(19):before {
    content: ".19"
}

.ul-counter.counter-red li:before {
    color: #f76059
}

.ul-counter.counter-yellow li:before {
    color: #eec930
}

.ul-counter.counter-blue li:before {
    color: #208bfc
}

.bignumber {
    font-weight: 900;
    font-size: 48px;
    line-height: 1.167em;
    letter-spacing: -.02em
}

.bignumber.red {
    color: #f76059
}

.bignumber.yellow {
    color: #eec930
}

.bignumber.blue {
    color: #208bfc
}

.bignumber.white {
    color: #fff
}

.bignumber.white.muted, .bignumber.white .muted {
    color: hsla(0, 0%, 100%, .3) !important;
    font-size: 18px
}

.bignumber.muted, .bignumber .muted {
    color: #e6e6e6 !important;
    font-size: 32px;
    line-height: 1.156em
}

.hr {
    width: 100%;
    height: 1px;
    background: #e6e6e6
}

.slider-circle {
    width: 100vw
}

.slider-circle .slides {
    width: 100%;
    height: 100%;
    overflow-x: hidden
}

.slider-circle .slides .slide {
    position: absolute;
    left: 10%;
    width: 80%
}

.slider-circle .slides .slide, .slider-circle .slides .slide .img {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.slider-circle .slides .slide .img {
    width: 100%;
    padding-top: 100%
}

.slider-circle .slides .slide .img img {
    max-height: 206px;
    z-index: 3
}

.slider-circle .slides .slide .img:after, .slider-circle .slides .slide .img:before, .slider-circle .slides .slide .img img {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.slider-circle .slides .slide .img:after, .slider-circle .slides .slide .img:before {
    content: "";
    display: block;
    width: 162px;
    height: 162px;
    border-radius: 50%;
    background: -o-linear-gradient(195.18deg, #d53730 0, #f76059 100%);
    background: linear-gradient(254.82deg, #d53730, #f76059)
}

.slider-circle .slides .slide .img:before {
    background: #e6e6e6
}

.slider-circle .slides .slide .digit {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    font-weight: 900;
    font-size: 48px;
    line-height: 116.7%;
    text-align: center;
    letter-spacing: -.02em;
    color: #f76059
}

.slider-circle .slides .slide .arrow {
    width: 8px;
    height: 16px;
    background: url(/assets/images/arrow-up-gray.svg) no-repeat top;
    background-size: contain;
    margin: 0 auto 8px
}

.slider-circle .slides .slide .text {
    text-align: center;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

.slider-circle .slides .slide .text h2 {
    margin-bottom: 23px
}

.slider-circle .slides .slide.inactive.lefter {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%)
}

.slider-circle .slides .slide.inactive.righter {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%)
}

.slider-circle .slides .slide.inactive.left {
    -webkit-transform: translateX(-55%);
    -ms-transform: translateX(-55%);
    transform: translateX(-55%)
}

.slider-circle .slides .slide.inactive.left .digit {
    -webkit-transform: translateX(10px) scale(.7);
    -ms-transform: translateX(10px) scale(.7);
    transform: translateX(10px) scale(.7)
}

.slider-circle .slides .slide.inactive.right {
    -webkit-transform: translateX(55%);
    -ms-transform: translateX(55%);
    transform: translateX(55%)
}

.slider-circle .slides .slide.inactive.right .digit {
    -webkit-transform: translateX(-10px) scale(.7);
    -ms-transform: translateX(-10px) scale(.7);
    transform: translateX(-10px) scale(.7)
}

.slider-circle .slides .slide.inactive .img:after, .slider-circle .slides .slide.inactive .img:before {
    width: 94px;
    height: 94px
}

.slider-circle .slides .slide.inactive .img:after {
    opacity: 0
}

.slider-circle .slides .slide.inactive .img img {
    -webkit-transform: translate(-50%, -50%) scale(.7);
    -ms-transform: translate(-50%, -50%) scale(.7);
    transform: translate(-50%, -50%) scale(.7)
}

.slider-circle .slides .slide.inactive .digit {
    color: #e6e6e6
}

.slider-circle .slides .slide.inactive .text {
    opacity: 0
}

.slider-circle.slider-yellow .slides .slide .img:after {
    background: -o-linear-gradient(195.18deg, #f3be00 0, #ffe062 100%);
    background: linear-gradient(254.82deg, #f3be00, #ffe062)
}

.slider-circle.slider-yellow .slides .slide .digit {
    color: #eec930
}

.slider-circle.slider-yellow .slides .slide.inactive .digit {
    color: #e6e6e6
}

.step-page .income input, .step-page .income span {
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 600;
    font-size: 18px !important;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #36414d
}

.step-page .income .input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    background: hsla(0, 0%, 90.2%, .3);
    height: 52px
}

.step-page .income .input input {
    width: 90%;
    border: 0;
    border-bottom: 1px solid #36414d;
    background: none
}

.step-page .income .input .price-pop {
    position: absolute;
    right: 0;
    top: 130%;
    z-index: 5;
    width: 90%;
    background: #fff;
    border: 1px solid #e6e6e6;
    padding: 20px;
    border-radius: 10px;
    -webkit-box-shadow: 0 20px 40px rgba(0, 0, 0, .07);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .07)
}

.step-page .income .input .price-pop:after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    width: 20px;
    height: 20px;
    background: #fff;
    border-color: #e6e6e6;
    border-style: solid;
    border-width: 1px 0 0 1px
}

.step-page #lastStep .loginout {
    font-weight: 700;
    font-size: 14px;
    line-height: 171%;
    letter-spacing: .01em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.step-page #lastStep .loginout:after {
    content: "";
    display: block;
    width: 21px;
    height: 8px;
    margin-left: 10px;
    background: url(/assets/images/arrow-right-gray.svg) no-repeat 100%
}

.step-page #lastStep:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100vw;
    height: 93.86666666666667vw;
    background: url(/assets/images/rocket.png) no-repeat bottom;
    background-size: cover
}

.step-page #lastStep .bottom {
    z-index: 5
}

.circledimg {
    width: 100%;
    padding-top: 100%
}

.circledimg img {
    max-height: 220px;
    max-width: 182px
}

.circledimg:before, .circledimg img {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.circledimg:before {
    content: "";
    display: block;
    width: 146px;
    height: 146px;
    border-radius: 50%;
    background: -o-linear-gradient(195.18deg, #d53730 0, #f76059 100%);
    background: linear-gradient(254.82deg, #d53730, #f76059)
}

header {
    padding-top: 20px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100vw
}

header .logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    z-index: 200
}

header .logo:before {
    content: "";
    display: block;
    width: 41px;
    height: 16px;
    background: url(/assets/images/logo-header-gray.svg) no-repeat 0 0;
    background-size: contain;
    margin-right: 20px
}

header .logo:before, header .logo span {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

header .logo span {
    top: 1px;
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 106%;
    letter-spacing: .13em;
    color: #36414d;
    opacity: .3;
    text-transform: uppercase
}

header .menu .burger {
    width: 22px;
    height: 22px;
    z-index: 201
}

header .menu .burger, header .menu .burger span {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

header .menu .burger span {
    display: block;
    width: 5px;
    height: 5px;
    background: #36414d;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

header .menu .burger span:first-child {
    top: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

header .menu .burger span:nth-child(2) {
    top: 100%;
    -webkit-transform: translate(-50%, -100%);
    -ms-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%)
}

header .menu .burger span:nth-child(3), header .menu .burger span:nth-child(4) {
    opacity: 0
}

header .menu-in {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: calc(var(--vh, 1vh) * 100);
    background: #208bfc;
    z-index: 100;
    padding: 114px 20px 31px;
    color: #fff;
    overflow-y: auto;
    opacity: 0;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    pointer-events: none;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease
}

header .menu-in a {
    color: #fff
}

header .menu-in ul {
    margin: 0;
    padding: 0;
    list-style: none
}

header .menu-in .menu-block {
    margin-bottom: 40px
}

header .menu-in .menu-block__header {
    font-family: Lato, Roboto, sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 106%;
    letter-spacing: .01em;
    margin-bottom: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

header .menu-in .menu-block__header:before {
    content: ".01";
    width: 32px;
    display: block;
    font-family: Bebas Neue, Roboto, sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 122%;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #fff;
    opacity: .3;
    position: relative;
    top: 3px
}

header .menu-in .menu-block:nth-child(2) .menu-block__header:before {
    content: ".02"
}

header .menu-in .menu-block:nth-child(3) .menu-block__header:before {
    content: ".03"
}

header .menu-in .menu-block:nth-child(4) .menu-block__header:before {
    content: ".04"
}

header .menu-in .menu-block:nth-child(5) .menu-block__header:before {
    content: ".05"
}

header .menu-in .menu-block .list {
    font-weight: 700;
    font-size: 14px;
    line-height: 171%;
    letter-spacing: .01em
}

header .menu-in .menu-block .list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

header .menu-in .menu-block .list li:before {
    content: "";
    display: block;
    width: 16px;
    height: 8px;
    margin-right: 16px;
    background: url(/assets/images/arrow-right-white.svg) no-repeat 100%
}

header .menu-in .menu-bottom .login {
    height: 24px;
    background: #fff;
    color: #36414d;
    padding: 0 10px;
    border-radius: 2px
}

header .menu-in .menu-bottom .loginout {
    font-weight: 700;
    line-height: 171%;
    letter-spacing: .01em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

header .menu-in .menu-bottom .loginout:after {
    content: "";
    display: block;
    width: 21px;
    height: 8px;
    margin-left: 10px;
    background: url(/assets/images/arrow-right-white.svg) no-repeat 100%
}

header.active .logo:before {
    background-image: url(/assets/images/logo-header-white.svg)
}

header.active .logo span {
    color: #fff
}

header.active .menu .burger {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

header.active .menu .burger span {
    background-color: #fff
}

header.active .menu .burger span:nth-child(3) {
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 1
}

header.active .menu .burger span:nth-child(4) {
    left: 100%;
    -webkit-transform: translate(-100%, -50%);
    -ms-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
    opacity: 1
}

header.active .menu-in {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto
}

header.header-white .logo:before {
    background-image: url(/assets/images/logo-header-white.svg)
}

header.header-white .logo span {
    color: #fff
}

header.header-white .menu .burger span {
    background-color: #fff
}

footer {
    background: -o-linear-gradient(195.18deg, #004e9f 0, #3a9aff 100%);
    background: linear-gradient(254.82deg, #004e9f, #3a9aff);
    height: 70px;
    margin-top: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

footer .logo {
    width: 41px;
    height: 16px;
    background: url(/assets/images/logo-header-white.svg) no-repeat 0 0;
    background-size: contain
}

footer .social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

footer .social a {
    display: block;
    width: 20px;
    height: 20px;
    margin: 0 5px
}

footer .social a.fb {
    background: url(/assets/images/fb.svg) no-repeat 50%;
    background-size: contain
}

footer .social a.insta {
    background: url(/assets/images/insta.svg) no-repeat 50%;
    background-size: contain
}

footer .social a.vk {
    background: url(/assets/images/vk.svg) no-repeat 50%;
    background-size: contain
}

footer:after {
    width: 105px;
    height: 100px;
    position: absolute;
    right: 0;
    bottom: 0;
    content: "";
    display: block;
    background: url(/assets/images/footer-flag.png) no-repeat 0 0;
    background-size: contain
}

.index-page #firstHero .bubbles {
    width: 100vw;
    height: 282px;
    position: absolute;
    left: 0;
    top: 70px;
    background: url(/assets/images/bubbles-mobile.png) no-repeat 50%;
    background-size: cover
}

.index-page #firstHero h1 {
    margin-bottom: 20px
}

.index-page #firstHero .text {
    width: 90%
}

.index-page #firstHero .button {
    width: 100%
}

.index-page #secondSlider .slides .slide .img img {
    max-width: 1000px;
    max-height: 164px;
    top: 45%
}

.index-page #secondSlider .slides .slide.inactive .img img {
    max-height: 100px
}

.index-page #secondSlider .slides .slide:first-child .img img:first-child {
    max-height: 164px;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate(-38%, -50%) rotate(-20.08deg);
    -ms-transform: translate(-38%, -50%) rotate(-20.08deg);
    transform: translate(-38%, -50%) rotate(-20.08deg)
}

.index-page #secondSlider .slides .slide:first-child .img img:nth-child(2) {
    -webkit-transform: translate(-23%, -64%) scale(.8);
    -ms-transform: translate(-23%, -64%) scale(.8);
    transform: translate(-23%, -64%) scale(.8)
}

.index-page #secondSlider .slides .slide:first-child.inactive .img img:first-child {
    max-height: 82px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.index-page #secondSlider .slides .slide:first-child.inactive .img img.active {
    opacity: 0
}

.index-page #secondSlider .slides .slide:nth-child(2).inactive .img img {
    max-height: 124px;
    top: 43%
}

.index-page #secondSlider .slides .slide:nth-child(3) .img img {
    max-height: 172px;
    top: 40%
}

.index-page #secondSlider .slides .slide:nth-child(3).inactive .img img {
    max-height: 144px;
    top: 40%
}

.index-page #secondSlider .slides .slide:nth-child(4) .img img {
    max-height: 146px;
    top: 45%
}

.index-page #secondSlider .slides .slide:nth-child(4).inactive .img img {
    max-height: 100px;
    top: 41%
}

.index-page #secondSlider .slides .slide:nth-child(5).inactive .img img {
    max-height: 115px;
    top: 41%
}

.index-page #secondSlider .slides .slide:nth-child(6) .img img {
    max-height: 183px;
    top: 40%;
    left: 53%
}

.index-page #secondSlider .slides .slide:nth-child(6) .img img:first-child {
    opacity: 1;
    z-index: 5
}

.index-page #secondSlider .slides .slide:nth-child(6).inactive .img img {
    max-height: 120px;
    top: 41%;
    left: 50%
}

.index-page #secondSlider .slides .slide:nth-child(6).inactive .img img:first-child {
    opacity: 0
}

.index-page #secondSlider .slides .slide:nth-child(7).inactive .img img {
    max-height: 120px;
    top: 41%
}

.index-page .quotesSlider {
    width: 100vw
}

.index-page .quotesSlider .slides {
    width: 100%;
    height: 100%;
    overflow-x: hidden
}

.index-page .quotesSlider .slides .slide {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    position: absolute;
    left: 20px;
    width: 80%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.index-page .quotesSlider .slides .slide .avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 14px
}

.index-page .quotesSlider .slides .slide .avatar img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%;
    width: 100%
}

.index-page .quotesSlider .slides .slide .position {
    margin-bottom: 33px
}

.index-page .quotesSlider .slides .slide .avatar, .index-page .quotesSlider .slides .slide .name, .index-page .quotesSlider .slides .slide .position {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.index-page .quotesSlider .slides .slide .quote {
    padding: 20px;
    background: hsla(0, 0%, 90.2%, .2);
    border-radius: 2px
}

.index-page .quotesSlider .slides .slide .quote:before {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    content: "";
    width: 17px;
    height: 17px;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(/assets/images/quote-cyan.svg) no-repeat;
    background-size: contain
}

.index-page .quotesSlider .slides .slide .quote p:last-child {
    margin-bottom: 0
}

.index-page .quotesSlider .slides .slide.inactive {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.index-page .quotesSlider .slides .slide.inactive .avatar, .index-page .quotesSlider .slides .slide.inactive .name, .index-page .quotesSlider .slides .slide.inactive .position {
    left: 20px;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.index-page .quotesSlider .slides .slide.inactive .quote:before {
    left: 20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.index-page .quotesSlider .slides .slide.inactive.right {
    -webkit-transform: translateX(105%);
    -ms-transform: translateX(105%);
    transform: translateX(105%)
}

.index-page .quotesSlider .slides .slide.inactive.righter {
    -webkit-transform: translateX(210%);
    -ms-transform: translateX(210%);
    transform: translateX(210%)
}

.index-page .quotesSlider .slides .slide.inactive.left, .index-page .quotesSlider .slides .slide.inactive.lefter {
    -webkit-transform: translateX(-110%);
    -ms-transform: translateX(-110%);
    transform: translateX(-110%)
}

.index-page #lastHero {
    padding: 35px 0 20px;
    overflow: hidden
}

.index-page #lastHero:before {
    width: 226px;
    height: 327px;
    position: absolute;
    left: 50%;
    top: 388px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    content: "";
    display: block;
    background: url(/assets/images/flag.png) no-repeat top;
    background-size: contain
}

.interior-page #firstHero .circle:before {
    content: "";
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #fff
}

.interior-page #firstHero .circle .counter {
    position: absolute;
    right: 0;
    top: 20px;
    text-align: right;
    font-weight: 900;
    font-size: 52px;
    letter-spacing: .01em
}

.interior-page #firstHero .circle img {
    position: absolute;
    left: 50%;
    top: 40%;
    -webkit-transform: translate(-56%, -40%);
    -ms-transform: translate(-56%, -40%);
    transform: translate(-56%, -40%);
    width: 80%
}

.interior-page .plate .img-cup {
    position: absolute;
    right: -15px;
    top: -40px;
    width: 150px;
    height: 188px;
    /*background: url(/assets/images/cup-red.png) no-repeat 50%;*/
    background-size: contain;
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1)
}

.interior-page .article {
    margin-bottom: 30px
}

.interior-page .article .crumb, .interior-page .article .date {
    color: #208bfc
}

.interior-page .article .crumb {
    margin-bottom: 15px
}

.percenter {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    border: solid #e6e6e6;
    border-width: 0 0 1px;
    padding-bottom: 12px;
    margin-bottom: 20px
}

.percenter .line {
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
    height: 3px;
    border-radius: 1.5px;
    background: #36414d
}

.percenter .stars {
    font-weight: 700;
    letter-spacing: .01em;
    color: rgba(54, 65, 77, .3)
}

.percenter .stars span {
    color: #36414d;
    font-weight: 900;
    font-size: 18px;
    display: inline-block;
    margin-right: 2px
}

.percenter .stars:after, .percenter .stars:before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    top: 2px;
    margin-left: 8px;
    position: relative;
    background: url(/assets/images/star-gray.svg) no-repeat 50%;
    background-size: contain
}

.percenter .stars:before {
    display: none;
    margin-left: 0;
    margin-right: 10px
}

.percenter .stars.stars-big span {
    font-size: 32px
}

.percenter .stars.stars-big:after, .percenter .stars.stars-big:before {
    width: 30px;
    height: 30px
}

.percenter .stars.stars-before:after {
    display: none
}

.percenter .stars.stars-before:before {
    display: inline-block
}

.percenter.upside {
    border-bottom-width: 0;
    border-top-width: 1px
}

.percenter.upside .line {
    top: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.percenter.yellow .line {
    background-color: #eec930
}

.percenter.yellow .stars:after, .percenter.yellow .stars:before {
    background-image: url(/assets/images/star-yellow.svg)
}

.percenter.blue .line {
    background-color: #208bfc
}

.percenter.blue .stars:after, .percenter.blue .stars:before {
    background-image: url(/assets/images/star-blue.svg)
}

.percenter.red .line {
    background-color: #f76059
}

.percenter.red .stars:after, .percenter.red .stars:before {
    background-image: url(/assets/images/star-red.svg)
}

.percenter.white {
    color: #fff;
    border-color: hsla(0, 0%, 100%, .3)
}

.percenter.white .stars {
    color: hsla(0, 0%, 100%, .3)
}

.percenter.white .stars span {
    color: #fff
}

.percenter.white .line {
    background-color: #fff
}

.percenter.white .stars:after, .percenter.white .stars:before {
    background-image: url(/assets/images/star-white.svg)
}

.medal {
    width: 36px;
    height: 49px;
    color: #fff;
    font-weight: 700;
    text-align: center
}

.medal span {
    display: block;
    width: 36px;
    height: 36px;
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    z-index: 2
}

.medal:before {
    width: 16px;
    height: 18px;
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    background: url(/assets/images/medal-flag-blue.svg) no-repeat 50%;
    background-size: contain;
    opacity: 0
}

.medal:after, .medal:before {
    content: "";
    display: block;
    position: absolute
}

.medal:after {
    width: 36px;
    height: 36px;
    background: #e6e6e6;
    border-radius: 50%;
    left: 0;
    top: 0
}

.medal.active:before {
    opacity: 1
}

.medal.active:after {
    background: #eec930
}

.medal:nth-child(2n):before {
    background-image: url(/assets/images/medal-flag-red.svg)
}

.achievement {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    margin-bottom: 10px
}

.achievement:before {
    content: "";
    display: block;
    width: 40px;
    height: 45px;
    margin-right: 10px;
    background: url(/assets/images/achievement-inactive.svg) no-repeat top;
    background-size: contain
}

.achievement span {
    display: block;
    width: calc(100% - 50px);
    height: 40px;
    background: #e6e6e6;
    border-radius: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    color: #fff;
    padding: 0 15px
}

.achievement span:after {
    content: "";
    display: block;
    width: 11px;
    height: 8px;
    background: url(/assets/images/arrow-right-white.svg) no-repeat 100%;
    background-size: cover
}

.achievement.active:before {
    background-image: url(/assets/images/achievement-active.svg)
}

.achievement.active span {
    background: -o-linear-gradient(195.18deg, #d53730 0, #f76059 100%);
    background: linear-gradient(254.82deg, #d53730, #f76059)
}

/*.course-page .img-target {
    width: 149px;
    height: 195px;
    position: absolute;
    right: 20px;
    top: -65px;
    background: url(/assets/images/target-rev.png) no-repeat bottom;
    background-size: contain
}*/

.check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 10px 0;
    border-bottom: 1px solid #e6e6e6
}

.check.noborder {
    border-bottom: none
}

.check:before {
    content: "";
    display: block;
    margin-right: 10px;
    width: 18px;
    height: 18px;
    border: 1px solid #e6e6e6;
    border-radius: 2px
}

.check .title {
    font-weight: 700
}

.check .title span {
    color: #f76059
}

.check .stars {
    color: #e6e6e6;
    width: 75px;
    margin-left: auto
}

.check .stars span {
    color: #f76059
}

.check .stars:before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    top: 2px;
    margin-right: 10px;
    position: relative;
    background: url(/assets/images/star-gray.svg) no-repeat 50%;
    opacity: .1;
    background-size: contain
}

.check.checked:after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background: url(/assets/images/check-red.svg) no-repeat 50%;
    background-size: contain;
    position: absolute;
    left: 4px;
    top: 8px
}

.check.checked .stars:before {
    oapcity: 1;
    background-image: url(/assets/images/star-red.svg)
}

.check.white {
    border-bottom-color: hsla(0, 0%, 100%, .3)
}

.check.white .stars span, .check.white .title span {
    color: #fff
}

.check.white .stars:before {
    background-image: url(/assets/images/star-white.svg);
    opacity: 1
}

.check.white.checked:after {
    background-image: url(/assets/images/check-white.svg)
}

.test-page #firstHero .circledimg:before {
    background: #fff;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 170px;
    height: 170px
}

.bank-page .firstVideo .video {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.bank-page .firstVideo .video:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #36414d;
    opacity: .6;
    z-index: 2
}

.bank-page .firstVideo .video .play {
    z-index: 3;
    top: 55%
}

.bank-page .category {
    color: #eec930;
    font-weight: 700;
    margin-bottom: 1em
}

.bank-page .relative-materials .relative-materials-inner .relative-material .category, .bank-page .relative-materials .relative-materials-inner .relative-material .date {
    color: #eec930;
    font-weight: 400
}

.bank-page .relative-materials .relative-materials-inner .relative-material .title {
    margin-bottom: 1em;
    display: block
}

.bank-page .article {
    margin-bottom: 40px
}

.bank-page .article .crumb, .bank-page .article .date {
    color: #eec930
}

.bank-page .article .crumb {
    margin-bottom: 1em
}

.stories-page .story {
    width: 100%;
    margin-bottom: 40px;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.stories-page .story .avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 14px
}

.stories-page .story .avatar img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 100%;
    width: 100%
}

.stories-page .story .position {
    margin-bottom: 33px
}

.stories-page .story .avatar, .stories-page .story .name, .stories-page .story .position {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.stories-page .story .quote {
    padding: 20px;
    background: hsla(0, 0%, 90.2%, .2);
    border-radius: 2px
}

.stories-page .story .quote:before {
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    content: "";
    width: 17px;
    height: 17px;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url(/assets/images/quote-blue.svg) no-repeat;
    background-size: contain
}

.stories-page .story .quote p:last-child {
    margin-bottom: 0
}

.story-page img, .story-page p {
    margin-bottom: 1em
}


@media screen and (max-width: -1px) {
    .hidden-xs-down {
        display: none !important
    }
}

@media (min-width: 1200px) {
    .hide-desktop {
        display: none !important
    }

}

@media (max-width: 768px) {
    .hide-phone {
        display: none !important
    }
}
@media screen and (min-width: 768px) and (max-width: 1200px) {
    .hide-laptop {
        display: none !important
    }
}


.offcanvas {
    margin-top: var(--mh);
}

.languageScrlolllist {
    overflow-y: scroll;
}
.all_courses_list {

    -moz-column-count: 2; /* Для Firefox */
    -webkit-column-count: 2; /* Для Safari и Chrome */
    column-count: 2;
    column-gap: 48px;

}
.menuColRed {
    color: #fa5f55  !important;
}

.btn-close {
    width: 24px !important;
    height:24px !important;
    padding: 0 !important;

}
.offcanvas {
    width: 350px !important;
}
.dropdown-menu-countries {
    margin-top: 16px !important;
    background-color: white  !important;
    /*border: 1px solid #324A5D38 !important;*/
    border: none;
    box-shadow: 0px 8px 16px -2px #0433671C !important;

}
/*.password {
        position: relative;
    }
    .password-control {
        position: absolute;
        top: 11px;
        right: 6px;
        display: inline-block;
        width: 20px;
        height: 20px;
        background: url(/view.svg) 0 0 no-repeat;
    }
    .password-control.view {
        background: url(/no-view.svg) 0 0 no-repeat;
    }*/
.dropdown-menu-auth {
    background-color: white;
    width: 328px !important;
    margin-top: 8px !important;
    /*border: 1px solid #324A5D38 !important;*/
    border: none;
    box-shadow: 0px 2px 2px -1px #0050B20F, 0px 8px 16px -2px #0433671C;
    /*font-size:1rem;*/
}

.modal-menu-auth {
    background-color: white;
}

.modal-menu-auth .auth-input {
    border: 2px solid #D1D8DD !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 3em !important;
    margin-top: 8px !important;
    margin-bottom:8px !important;

}

.modal-menu-auth .auth-input-err {
    border: 2px solid #fa5f55 !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 3em !important;
    margin-top: 8px !important;
    margin-bottom:8px !important;

}

.auth-input::placeholder {
    padding-left: 4px !important;
}

.auth-div {
  padding: 16px;
}

.dropdown-menu-auth .auth-input {
    border: 2px solid #D1D8DD !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 3em !important;
    margin-top: 8px !important;
    margin-bottom:8px !important;
    padding-left:8px !important;
}

.dropdown-menu-auth .auth-input-err {
    border: 2px solid #fa5f55 !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 3em !important;
    margin-top: 8px !important;
    margin-bottom:8px !important;
    padding-left:8px !important;
}

.auth-input::placeholder {
    padding-left: 4px !important;
}
.dropdown-auth {
    background-color: #FDC9C240 !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    padding: 12px 16px !important;
}

.dropdown-auth:hover {
    background-color: #F3635540 !important;

}

.dropdown-out{
    background-color: white !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    color: #39444c !important;
    padding: 12px 16px !important;
}
.dropdown-out:hover {
    background-color: #3B6D9514 !important;
}

.header {
    background-color: white !important;
    font-size: 16px !important;
    box-shadow:  0px 2px 2px -1px #0050B20F, 0px 2px 8px -1px #0A478517;
;

}

.header-desktop {
     padding: 16px 64px  !important;
 }
.header-tablet{
    padding: 16px 32px  !important;
}
.header-mobile {
    padding: 16px  !important;
}

.user_avatar {
    border: solid 2px #ffffff;
    border-radius: 50%;
    background-color: #dcdcdc;
    max-height: 50px;
    max-width: 50px;
    min-height: 50px;
    min-width: 50px;
    box-shadow: 0px 0px 0px 2px #e5e5e5;
}
.userAvatarWrapper{
    margin-right:16px;
}
.user_text-avatar{
    background-color: #dcdcdc;
    border: solid 2px #ffffff;
    border-radius: 50%;
    height: 40px;
    line-height: 25px;
    width: 40px;
    padding-top: 12px;
    text-align: center;
    font-weight: 500;
    font-size: 18px;
    box-shadow: 0px 0px 0px 2px #9e9e9e;
}

.modal-content {
    border: none !important;
    box-shadow: 0px 2px 2px -1px #0050B20F, 0px 8px 16px -2px #0433671C !important;
}

html,
body {
    height: 100% !important;
}

.wrapper {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}
.content-box {
    flex: 1 0 auto !important;
}
.footer {
    flex: 0 0 auto !important;
    background: #091219 !important;
    margin: 0px !important;
   }
.footer .top{
    /*display: none;*/
    padding: 0px 64px  !important;
}
.footer .top-tablet{

    padding: 0px 32px  !important;
}
.footer .bottom-tablet{
     padding: 24px 32px  !important;
 }
.footer .bottom{
    padding: 24px 64px  !important;
}

.footer .bottom-mobile{
    padding: 24px 24px  !important;
}

.footer .top-mobile{

    padding: 0px 16px  !important;
}
.footer .bottom-mobile{
    padding: 16px  !important;
}

.circledimg-nd {
    width: 100%;
    padding-top: 100%
}

.circledimg-nd img {
    max-height: 220px;
    max-width: 182px
}

.circledimg-nd:before, .circledimg-nd img {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.circledimg-nd:before {
    content: "";
    display: block;
    width: 146px;
    height: 146px;
    border-radius: 50%;
    background: -o-linear-gradient(195.18deg, #d53730 0, #f76059 100%);
    background: linear-gradient(254.82deg, #d53730, #f76059)
}


/* +++ open blocks style props*/
@media screen and (min-width: 1400px) {
    .continer-fluit-paddings {
        padding: 0 96px;
        width: 100%;
    }
    .course-page .goToTest .img-target {
        width: 30%;
        padding-top: 52.3489932885906%;
        height: 0;
        background-image: url(/assets/images/target-big-active.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .course-page .goToTest.muted .img-target {
        background-image: url(/assets/images/target-big.png);
    }
    .st-fish-title {
       font-family: 'Inter Medium';
       font-size: 16px !important;
       margin-bottom: 15px;
   }
    .circledimg img {
        max-height: 564px;
        max-width: 1000px
    }

    .circledimg:before {
        width: 392px;
        height: 392px
    }
    .open-xxl {
        padding: 0px 64px;
        width: 100%;

    }
    .cont-r {
        padding: 68px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 64px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 72px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 64px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:28px;
        text-align:center;
        font-size: 18px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top:-80px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/Picture.png');
        height: 500px;
    }
    .hide-xxl {display: none;}
    .backlink {
        font-size: 18px !important;
    }
    .indentation {
        padding: 0px 64px;
        width: 100%;
    }
    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.125;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 48px;
    }
    .add-school-description {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 28px;
    }
    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 48px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 18px;
        line-height: 28px;
        margin-bottom: 48px;
    }
    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 30px;
    }
    .awards-bottom {
        margin-bottom: 50px;
    }
    .mess_continue {
        font-family: 'Inter Medium';
        font-size: 18px;
        line-height: 28px;

    }
    .theme-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;

    }


}


@media screen and (min-width: 1200px) and (max-width: 1399px) {
    .continer-fluit-paddings {
        padding: 0 96px;
        width: 100%;
    }
    .course-page .goToTest .img-target {
        width: 40%;
        padding-top: 52.3489932885906%;
        height: 0;
        background-image: url(/assets/images/target-big-active.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .course-page .goToTest.muted .img-target {
        background-image: url(/assets/images/target-big.png);
    }
    .circledimg img {
        max-height: 564px;
        max-width: 1000px
    }

    .circledimg:before {
        width: 392px;
        height: 392px
    }
    .next-step-title {
        font-size: 14px !important;
    }
    .open-xl {

       padding: 0 64px;
        width: 100%;
    }
    .cont-r {
        padding: 68px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 64px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 72px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 64px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:28px;
        text-align:center;
        font-size: 18px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top:-80px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/Picture.png');
        height: 500px;
    }
    .hide-xl {display: none;}
    .backlink {
        font-size: 18px !important;
    }
    .indentation {
        padding: 0px 64px;
        width: 100%;
    }
    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.125;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 32px; font-weight: 700;
        line-height: 36px;
        margin-bottom: 36px;
    }
    .add-school-description {
        font-family: 'Inter Medium'; font-size: 15px; line-height: 24px;
    }
    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 48px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 18px;
        line-height: 28px;
        margin-bottom: 48px;
    }
    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 30px;
    }
    .awards-bottom {
        margin-bottom: 50px;
    }
    .theme-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;

    }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
    .continer-fluit-paddings {
        padding: 0 76px;
        width: 100%;
    }
    .course-page .goToTest .img-target {
        width: 35%;
        padding-top: 60.0%;
        height: 0;
        background-image: url(/assets/images/target-big-active.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .course-page .goToTest.muted .img-target {
        width: 35%;
        padding-top: 50.0%;
        height: 0;
        background-image: url(/assets/images/target-big.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .circledimg img {
        max-height: 564px;
        max-width: 1000px
    }

    .circledimg:before {
        width: 392px;
        height: 392px
    }
    .next-step-title {
        font-size: 13px !important;
    }
    .open-lg{
        padding: 0 32px;
        width: 100%;
    }
    .cont-r {
        padding: 68px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 64px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 72px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 64px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:28px;
        text-align:center;
        font-size: 18px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top:-60px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/Picture.png');
        height: 400px;
    }
    .hide-lg {display: none;}
    .backlink {
        font-size: 18px !important;
    }
    .indentation {
        padding: 0 32px;
        width: 100%;
    }
    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.125;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 28px; font-weight: 700;
        line-height: 30px;
        margin-bottom: 30px;
    }
    .add-school-description {
        font-family: 'Inter Medium'; font-size: 14px; line-height: 20px;
    }
    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 48px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 48px;
    }

    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 48px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 30px;
    }
    .awards-bottom {
        margin-bottom: 10px;
    }
    .theme-title-one {
        font-family: 'Inter SemiBold';
        font-size: 48px; font-weight: 700;
        line-height: 48px;

    }
    .circledimg-nd img {
        max-height: 564px;
        max-width: 1000px
    }

    .circledimg-nd:before {
        width: 392px;
        height: 392px
    }


}
@media screen and (min-width: 768px) and (max-width: 991px) {
    .continer-fluit-paddings {
        padding: 0 64px;
        width: 100%;
    }
    .course-page .goToTest .img-target {
        width: 35%;
        padding-top: 60.0%;
        height: 0;
        background-image: url(/assets/images/target-big-active.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .course-page .goToTest.muted .img-target {
        width: 35%;
        padding-top: 50.0%;
        height: 0;
        background-image: url(/assets/images/target-big.png);
        right: auto;
        left: 20px;
        top: auto;
        bottom: 20px;
    }
    .next-step-title {
        font-size: 13px !important;
    }
    .open-md {
        padding: 0 32px;
        width: 100%;
    }
    .cont-r {
        padding: 48px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 64px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 64px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 48px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:16px;
        text-align:center;
        font-size: 16px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top:-50px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/Picture.png');
        height: 300px;
    }
    .hide-md {display: none;}
    .backlink {
        font-size: 16px !important;
    }
    .indentation {
        padding: 0 32px;
        width: 100%;
    }
    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.15;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 36px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description {
        font-family: 'Inter Medium';
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 40px;
    }
    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 48px;
    }
    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 36px; font-weight: 700;
        line-height: 30px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 30px;
    }
    .theme-title-one {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 40px;

    }

}

@media screen and (min-width: 576px) and (max-width: 767px) {

    .continer-fluit-paddings {
        padding: 0 48px;
        width: 100%;
    }
    .open-sm {
        padding: 0 16px;
        width: 100%;
    }
    .cont-r {
        padding: 48px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 32px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 48px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 44px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:16px;
        text-align:center;
        font-size: 16px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top:-30px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/Picture.png');
        height: 240px;
    }

    .hide-sm {display: none;}
    .backlink {
        font-size: 14px !important;
    }
    .indentation {
        padding: 0 16px;
        width: 100%;
    }
    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.125;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 36px;
    }

    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 36px;
    }

    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 36px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 30px;
    }
    .theme-title-one {
        font-family: 'Inter SemiBold';
        font-size: 40px; font-weight: 700;
        line-height: 40px;

    }
}

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

    .continer-fluit-paddings {
        padding: 0 32px;
        width: 100%;
    }
    .open-xs {
       padding: 0 16px;
       width: 100%;
    }
    .cont-r {
        padding: 48px 0px 0px 0px;
        z-index: 500;
    }
    .sub-cont-r {
        width: 100%;
        margin: auto auto 0px auto;
    }
    .open {
        padding: 0px 64px;
        width: 100%;
        background-color: #6edff6;

    }
    .hello-r{
        line-height: 48px;
        text-align:center;
        font-family: Inter SemiBold;
        font-size: 44px;
        width: 100%;
        margin: 24px auto
    }
    .descr-r{
        line-height:16px;
        text-align:center;
        font-size: 16px;
        width: 100%;
        margin: auto
    }
    .link-r{
        margin-top: 48px;
    }
    .sub-link-r{
        text-decoration-line:none;
        background-color: #fa5f55;
    }
    .img-r{
        margin-top: 0px;
        background-repeat: no-repeat;
        background-size: cover;         /* или contain */
        background-position: center;
        background-image: url('/local/components/cci/chains/templates/.default/images/picture-l.png');
        height: 500px;
    }

    .hide-xs {display: none;}
    .backlink {
        font-size: 12px !important;
    }
    .indentation {
        padding: 0 16px;
        width: 100%;
    }

    .yt-responcive {
        width: 100%;
        aspect-ratio: 2 / 1.125;
    }
    .add-school-title {
        font-family: 'Inter SemiBold';
        font-size: 32px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description {
        font-family: 'Inter Medium';
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 36px;
    }


    .add-school-title-one {
        font-family: 'Inter SemiBold';
        font-size: 32px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 40px;
    }
    .add-school-description-one {
        font-family: 'Inter Medium';
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 36px;
    }
    .add-school-title-progress{
        font-family: 'Inter SemiBold';
        font-size: 32px; font-weight: 700;
        line-height: 40px;
        margin-bottom: 30px;
    }
    .add-school-description-progress {
        font-family: 'Inter Medium';
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 30px;
    }
    .theme-title-one {
        font-family: 'Inter SemiBold' !important;
        font-size: 40px; font-weight: 700 !important;
        line-height: 40px !important;

    }


}

/* --- open blocks style props*/
.btn-gero {

    border: none !important;
    border-radius: 3px !important;
    font-size: 16px !important;
    padding: 12px 24px !important;

}

.btn-gero-md-sm {

    border: none !important;
    border-radius: 3px !important;
    font-size: 14px !important;
    padding: 8px 12px !important;

}

.course-info-box-xxl {
 min-width: calc(100vw/3 - 85px);
 min-height: calc(100vw/3.5 - 85px);
    border-radius: 4px;
}

.course-info-box-xl {
    min-width: calc(100vw/3 - 60px);
    min-height: calc(100vw/3.5 - 60px);
    border-radius: 4px;
}

.course-info-box-lg {
    min-width: calc(100vw/3 - 35px);
    min-height: calc(100vw/3.5 - 35px);
    border-radius: 4px;
}

.course-info-box-md {
    min-width: calc(100vw/3 - 30px);
    min-height: calc(100vw/3.5 - 30px);
    border-radius: 4px;
}

.course-info-box-sm {
    min-width: 100%;
    min-height: 130px;
    border-radius: 4px;
    margin-bottom: 16px;
}
.left-cover {
    min-width: 10%;
    min-height: 100%;
}
.right-cover {
    min-width: 90%;
    min-height: 100%;
}
.right-cover-sm {
    width: 100%;
    margin: auto auto auto 32px;
    padding-top: 1vw;
    padding-right: 1vw;
}
.right-cover-xs {
    width: 100%;
    margin: auto auto auto calc(100vw/48);
    padding-right: 2vw;
}

.digital{
    width: calc(100vw/15);
    padding: calc(100vw/30) 0px calc(100vw/24.5) 0px;
}

.digital-sm{
    width: calc(100vw/8);
    padding: calc(100vw/24) 0px calc(100vw/24) 0px;
}

.digital-xs{
    width: 96px;
    padding: calc(100vw/20) 0px calc(100vw/20) 0px;
}

.left-cover-sm {
    min-width: 10%;
    min-height: 100%;
}

.responsive16-9 {
    width: 100%;
    padding-top: 56.25%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.video-item .category {
    font-weight: 400;
}
.video-item .title {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 24px;
    display: block;
}
.video-item .date,
.video-item .category {
    color: #208bfc;
}
.video-item .category {
    margin-bottom: 24px;
}
.first-padding {
    padding-top: 30px;
}

.to-read .read {
    width: 159px;
    height: 60px;
    /*background: url(/assets/images/read.svg) no-repeat center;*/
    background: var(--read) no-repeat center !important;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.video .download {
    width: 144px;
    height: 42px;
    background: var(--download) no-repeat center !important;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.to-read .download {
    width: 194px;
    height: 62px;
    background: var(--download) no-repeat center !important;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.video .play {
    width: 144px;
    height: 40px;
    background: var(--view) no-repeat center !important;
    background-size: contain;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.table-wrapper{
    width: 100%;
    overflow-x: auto;
}
#form-test span.error {
    position:absolute;
    top: -35px;
    width:300px;
    border:solid #fff 1.5px;
}

/*cba +++*/
#testBar .plate {
    border: 1px solid #e6e6e6;
    width: calc(100% + 20px);
    left: -10px;
    background: white;
    margin-bottom: 20px;
    overflow-x: hidden;
}
#testBar .plate.no-overflow {
    overflow: initial !important;
}
#testBar .plate.padding {
    padding: 20px 0;
}
.plate.rounded {
    border-radius: 10px;
}
#testBar .plate.shadowed {
    -webkit-box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.07);
    box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.07);
}
#testBar .plate p:nth-last-child(1) {
    margin-bottom: 0;
}
#testBar .plate.plate-red {
    color: #fff;
    background: -o-linear-gradient(142.28deg, #f76059 5.2%, #d53730 86.07%);
    background: linear-gradient(307.72deg, #f76059 5.2%, #d53730 86.07%);
}
#testBar .plate.plate-blue {
    color: #fff;
    background: -o-linear-gradient(195.18deg, #004e9f 0%, #3a9aff 100%);
    background: linear-gradient(254.82deg, #004e9f 0%, #3a9aff 100%);
}

#testBar .plate.plate-yellow {
    background: -o-linear-gradient(195.18deg, #f3be00 0%, #ffe062 100%);
    background: linear-gradient(254.82deg, #f3be00 0%, #ffe062 100%);
}

#testBar .plate.plate-quarter {
    padding-top: 40px;
}
#testBar .plate.plate-quarter::before {
    content: "";
    display: block;
    width: 181px;
    height: 179px;
    position: absolute;
    right: 0;
    top: 0;
    background: url(/assets/images/quarter.svg) no-repeat right top;
    border-top-right-radius: 10px;
}
#testBar .plate.muted {
    background: #e6e6e6;
}
#testBar .plate.w-100 {
    left: 0;
}
.modal-backdrop {
    z-index: 20 !important;
}
/*cba ---*/