You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

5447 lines
79 KiB

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5,
h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt,
dd, ol, ul, li, fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
embed, figure, figcaption, footer, header, hgroup, menu, nav,
output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
}
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
img, fieldset, a img {
border: none;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
-webkit-appearance: none;
}
input[type="submit"],
button {
cursor: pointer;
}
input[type="submit"]::-moz-focus-inner,
button::-moz-focus-inner {
padding: 0;
border: 0;
}
textarea {
overflow: auto;
}
input, button {
margin: 0;
padding: 0;
border: 0;
}
div, input, textarea, select, button,
h1, h2, h3, h4, h5, h6, a, span, a:focus {
outline: none;
}
ul, ol {
list-style-type: none;
}
table {
border-spacing: 0;
border-collapse: collapse;
width: 100%;
}
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
.icon-add-plus {
width: 1em;
height: 1em;
fill: #B5B5B5;
}
.icon-arrow-down {
width: 1.71em;
height: 1em;
fill: #333;
}
.icon-arrow-left {
width: 1.33em;
height: 1em;
fill: #333;
}
.icon-arrow-right {
width: 1.28em;
height: 1em;
fill: #333;
}
.icon-close {
width: 1em;
height: 1em;
fill: #191919;
}
.icon-date {
width: 0.95em;
height: 1em;
fill: #979797;
}
.icon-delete {
width: 1em;
height: 1em;
fill: #C8C8C8;
}
.icon-edit {
width: 1em;
height: 1em;
fill: #C8C8C8;
}
.icon-eye {
width: 1.69em;
height: 1em;
fill: #333;
}
.icon-facebook {
width: 0.5em;
height: 1em;
fill: #FFF;
}
.icon-fb {
width: 0.44em;
height: 1em;
fill: #1C2635;
}
.icon-image-text {
width: 2.07em;
height: 1em;
fill: #333;
}
.icon-image {
width: 1em;
height: 1em;
fill: #333;
}
.icon-images {
width: 1em;
height: 1em;
fill: #333;
}
.icon-instagram {
width: 1em;
height: 1em;
fill: #1C2635;
}
.icon-like-bold {
width: 1.07em;
height: 1em;
fill: #333;
}
.icon-like-fill-bold {
width: 1.07em;
height: 1em;
fill: #333;
}
.icon-like-fill {
width: 1.17em;
height: 1em;
fill: #B5B5B5;
}
.icon-like {
width: 1.17em;
height: 1em;
fill: #B5B5B5;
}
.icon-live {
width: 2.6em;
height: 1em;
fill: #333;
}
.icon-location {
width: 0.76em;
height: 1em;
fill: initial;
}
.icon-lock {
width: 0.74em;
height: 1em;
fill: initial;
}
.icon-menu {
width: 2em;
height: 1em;
fill: #202124;
}
.icon-money {
width: 1.53em;
height: 1em;
fill: #979797;
}
.icon-photo {
width: 1.33em;
height: 1em;
fill: #FFF;
}
.icon-play {
width: 0.8em;
height: 1em;
fill: #FFF;
}
.icon-plus {
width: 1em;
height: 1em;
fill: #BEBEBE;
}
.icon-search {
width: 1em;
height: 1em;
fill: initial;
}
.icon-searching {
width: 0.97em;
height: 1em;
fill: initial;
}
.icon-share-facebook {
width: 1em;
height: 1em;
fill: #35578C;
}
.icon-share-google {
width: 1em;
height: 1em;
fill: #CC4F42;
}
.icon-share-instagram {
width: 1em;
height: 1em;
fill: #EA418C;
}
.icon-share-pinterest {
width: 1em;
height: 1em;
fill: #B8242B;
}
.icon-share-twitter {
width: 1em;
height: 1em;
fill: #38A0CD;
}
.icon-showcase {
width: 1em;
height: 1em;
fill: #C8C8C8;
}
.icon-text {
width: 0.82em;
height: 1em;
fill: #333;
}
.icon-thumb {
width: 0.96em;
height: 1em;
fill: initial;
}
.icon-time {
width: 1em;
height: 1em;
fill: #979797;
}
.icon-twitter {
width: 1.18em;
height: 1em;
fill: #1C2635;
}
.icon-user {
width: 1em;
height: 1em;
fill: #191919;
}
.icon-video-stroke {
width: 0.82em;
height: 1em;
fill: #333;
}
.icon-video {
width: 1.43em;
height: 1em;
fill: #C8C8C8;
}
.icon-wallet {
width: 1.15em;
height: 1em;
fill: initial;
}
.icon-youtube {
width: 1.2em;
height: 1em;
fill: #1C2635;
}
@font-face {
font-family: ProximaNova-Regular;
src: url("fonts/ProximaNova-Regular.woff2") format("woff2"), url("fonts/ProximaNova-Regular.woff") format("woff");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: ProximaNova-Bold;
src: url("fonts/ProximaNova-Bold.woff2") format("woff2"), url("fonts/ProximaNova-Bold.woff") format("woff");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: ProximaNova-SemiBold;
src: url("fonts/ProximaNova-SemiBold.woff2") format("woff2"), url("fonts/ProximaNova-SemiBold.woff") format("woff");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: ProximaNova-Light;
src: url("fonts/ProximaNova-Light.woff2") format("woff2"), url("fonts/ProximaNova-Light.woff") format("woff");
font-weight: normal;
font-style: normal;
}
body {
min-width: 360px;
font-family: 'ProximaNova-Regular', serif;
font-size: 15px;
color: #191919;
line-height: 1.333;
}
body.no-scroll {
overflow: hidden;
}
button,
input,
textarea,
select {
font-family: 'ProximaNova-Regular', serif;
font-size: 15px;
}
button {
background: none;
}
a {
color: #FF9393;
text-decoration: none;
}
input,
textarea {
text-overflow: ellipsis;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #A7A7A7;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #A7A7A7;
}
input::placeholder,
textarea::placeholder {
color: #A7A7A7;
}
textarea {
border: none;
}
strong,
b {
font-family: 'ProximaNova-Bold', serif;
}
*::-moz-selection {
background: #FF9393;
color: white;
}
*::selection {
background: #FF9393;
color: white;
}
.outer {
display: -ms-flexbox;
display: flex;
min-height: 100vh;
-ms-flex-direction: column;
flex-direction: column;
}
.container {
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.center {
width: 100%;
max-width: 1024px;
margin: 0 auto;
padding: 0 40px;
}
.center_md {
max-width: 860px;
}
.center_sm {
max-width: 700px;
}
.center_xs {
max-width: 540px;
}
.btn {
position: relative;
padding: 13px 24px 12px;
background-image: linear-gradient(-225deg, #D1FF7F 0%, #56FFFD 100%);
border-radius: 3px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #191919;
text-transform: uppercase;
letter-spacing: 2px;
text-align: center;
transition: all .2s;
z-index: 2;
}
.btn:hover {
box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.11);
}
.btn:active {
box-shadow: 0 0 0 0 transparent;
color: rgba(38, 38, 38, 0.1);
}
.btn:active .icon {
fill: rgba(38, 38, 38, 0.1);
}
.btn__title,
.btn .icon {
display: inline-block;
vertical-align: middle;
}
.btn__title {
margin-top: -1px;
}
.btn .icon {
position: relative;
top: -1px;
margin-right: 15px;
fill: #191919;
transition: fill .2s;
}
.btn_dark {
background: #191919;
color: white;
}
.btn_dark:hover {
background: #545454;
}
.btn_dark:active {
color: rgba(255, 255, 255, 0.1);
}
.btn_light {
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
}
.btn_stroke:hover:before, .btn_stroke:active:before {
opacity: 0;
}
.btn_stroke:before {
content: '';
position: absolute;
top: 1px;
left: 1px;
right: 1px;
bottom: 1px;
background: white;
border-radius: 2px;
transition: opacity .2s;
z-index: -2;
}
.btn_gray {
background: #F8F8F8;
}
.btn_md {
padding: 18px 24px 17px;
}
.btn_lg {
padding: 28px 40px 27px;
}
.btn_lg.btn_stroke {
padding: 27px 39px 26px;
}
.btn_icon {
padding-left: 9px;
padding-right: 9px;
background: transparent;
border: 1px solid #E6E6E6;
font-size: 0;
}
.btn_icon .icon {
margin: 0;
font-size: 13px;
fill: #191919;
}
.btn.loading {
box-shadow: none;
color: transparent;
}
.btn.loading .icon {
visibility: hidden;
}
.btn.loading:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 24px;
height: 24px;
margin: -12px 0 0 -12px;
border: 3px solid #191919;
border-left: 3px solid transparent;
border-radius: 50%;
animation: loading .6s infinite linear;
}
.btn_fb {
background: #3957A7;
color: white;
}
.btn_fb:active {
color: rgba(255, 255, 255, 0.2);
}
.btn_fb:active .icon {
fill: rgba(255, 255, 255, 0.2);
}
.btn_fb .icon {
margin: -9px 15px -6px -25px;
font-size: 20px;
fill: white;
}
.btn_fb.loading {
box-shadow: none;
color: transparent;
}
.btn_fb.loading .icon {
visibility: hidden;
}
.btn_fb.loading:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 24px;
height: 24px;
margin: -12px 0 0 -12px;
border: 3px solid #fff;
border-left: 3px solid transparent;
border-radius: 50%;
animation: loading .6s infinite linear;
}
@keyframes loading {
0 {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
a.btn {
display: inline-block;
}
.logo {
display: block;
width: 219px;
height: 71px;
background: url(../img/school-lil-city.svg) no-repeat 0 0/contain;
}
.search {
position: relative;
width: 40px;
height: 40px;
}
.search__input {
position: absolute;
top: 0;
right: 0;
width: 40px;
height: 40px;
padding: 0 15px;
background: rgba(25, 25, 25, 0.1);
border-radius: 20px;
color: rgba(25, 25, 25, 0.8);
transition: width .4s;
}
.search__btn {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 40px;
}
.search__btn .icon {
font-size: 17px;
fill: rgba(25, 25, 25, 0.5);
-ms-transform: translate(0, 2px);
transform: translate(0, 2px);
}
.search.open .search__input {
width: 170px;
}
.header {
position: relative;
z-index: 20;
}
.header__container {
display: -ms-flexbox;
display: flex;
height: 100px;
border-bottom: 1px solid #E6E6E6;
-ms-flex-align: center;
align-items: center;
}
.header__wrap {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.header__actions {
display: -ms-flexbox;
display: flex;
margin: auto;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.header__status {
margin-right: 5px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #A7A7A7;
letter-spacing: 1px;
}
.header__btn {
margin-left: 10px;
}
.header__nav {
display: -ms-flexbox;
display: flex;
margin: auto;
}
.header__group {
position: relative;
}
.header__group:hover .header__section {
color: #191919;
}
.header__group:hover .header__list {
opacity: 1;
visibility: visible;
}
.header__section {
display: block;
height: 100px;
margin: 0 15px;
border-bottom: 1px solid transparent;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #8C8C8C;
line-height: 100px;
transition: color .2s;
}
.header__section.active {
border-color: #191919;
color: #191919;
}
.header__list, .header__drop {
position: absolute;
top: 100%;
left: 50%;
width: 190px;
margin-left: -95px;
padding: 10px 0;
background: white;
box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
border-radius: 2px;
opacity: 0;
visibility: hidden;
transform: translate3d(0, 0, 0);
transition: opacity .2s, visibility .2s;
overflow: hidden;
}
.header__drop {
left: auto;
right: 20px;
margin: 0;
}
.header__balance {
margin-bottom: 10px;
padding: 0 20px 10px;
border-bottom: 1px solid #E6E6E6;
}
.header__link {
display: block;
position: relative;
padding: 8px 20px 7px;
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
color: #8C8C8C;
text-transform: uppercase;
transition: color .2s;
}
.header__link:hover {
color: #191919;
}
.header__link_green {
color: #5BD700;
}
.header__link_green:hover {
color: #45a400;
}
.header__link_border {
margin-bottom: 5px;
padding: 2px 20px 10px;
border-bottom: 1px solid #E6E6E6;
color: #191919;
}
.header__link.active .header__title:after {
content: '';
position: absolute;
top: 50%;
left: -10px;
right: -10px;
height: 2px;
margin-top: -2px;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
}
.header__title {
display: table;
position: relative;
}
.header__menu, .header__close {
display: none;
}
.header__menu .icon, .header__close .icon {
fill: #191919;
}
.header__menu .icon {
font-size: 10px;
}
.header__close .icon {
font-size: 20px;
}
.header__enter {
height: 100px;
margin-left: 40px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #8C8C8C;
line-height: 100px;
transition: color .2s;
}
.header__enter:hover {
color: #191919;
}
.header__enter .icon {
display: none;
}
.header__login {
position: relative;
margin-right: -20px;
padding: 30px 20px;
-ms-flex: 0 0 80px;
flex: 0 0 80px;
}
.header__login:hover .header__drop {
opacity: 1;
visibility: visible;
}
.header__ava {
height: 40px;
}
.header_bg .header__container {
border-color: transparent;
}
.main {
display: -ms-flexbox;
display: flex;
position: relative;
min-height: 500px;
margin-top: -100px;
padding: 120px 0 50px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
text-align: center;
z-index: 4;
}
.main:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
opacity: .8;
z-index: -2;
}
.main__center {
margin: auto;
}
.main__title {
max-width: 780px;
margin: 0 auto 40px;
font-family: 'ProximaNova-Bold', serif;
font-size: 50px;
line-height: 1.2;
}
.main__content {
margin-bottom: 30px;
}
.main__time {
padding: 7px 0;
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 3px;
}
.main_green:before {
background-image: linear-gradient(-225deg, #E2E2E2 0%, #E2FFDF 100%);
}
.main_sm {
min-height: 0;
padding: 135px 0 55px;
}
.main_sm .main__title {
margin-bottom: 0;
}
.title {
position: relative;
margin-bottom: 35px;
font-family: 'ProximaNova-Bold', serif;
font-size: 32px;
line-height: 1.09375;
z-index: 4;
}
.title_center {
text-align: center;
}
.title_sm {
margin-bottom: 20px;
font-size: 25px;
}
.subtitle {
margin-bottom: 25px;
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
letter-spacing: 4px;
text-transform: uppercase;
}
.text {
position: relative;
max-width: 620px;
margin: 0 auto 60px;
font-family: 'ProximaNova-Light', serif;
font-size: 24px;
text-align: center;
z-index: 2;
}
.text p:not(:last-child) {
margin-bottom: 35px;
}
.text__curve {
position: absolute;
pointer-events: none;
z-index: -2;
}
.text__curve_one {
left: -95px;
bottom: 5px;
}
.text__curve_two {
left: -105px;
bottom: -50px;
}
.text__curve_three {
left: -65px;
bottom: -35px;
}
.text__curve_four {
left: -75px;
bottom: -45px;
}
.text_lg {
max-width: 740px;
}
.text_mb0 {
margin-bottom: 0;
}
.section {
padding: 60px 0;
}
.section_review {
background: url(../img/bg-elephants.jpg) 0 0/100px 102px;
}
.section_gray {
background: #F8F8F8;
}
.section_border {
position: relative;
}
.section_border:after {
content: '';
position: absolute;
top: 100%;
left: 50%;
width: 100%;
max-width: 944px;
height: 1px;
background: #E6E6E6;
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.section_gradient {
background-image: linear-gradient(-225deg, #F8F8F8 0%, #FFF2F2 100%);
}
.section_tabs {
padding-top: 20px;
}
.section_menu {
padding: 20px 0;
}
.section_confirm {
padding: 30px 0 50px;
}
.ava {
display: block;
position: relative;
overflow: hidden;
}
.ava__pic {
display: block;
width: 100%;
border-radius: 50%;
}
.ava__input {
position: absolute;
top: 0;
right: 0;
font-size: 140px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
z-index: 2;
}
.ava__icon {
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
font-size: 0;
}
.ava__icon .icon {
font-size: 30px;
fill: white;
}
.likes {
display: -ms-flexbox;
display: flex;
color: #191919;
-ms-flex-align: center;
align-items: center;
}
.likes__counter {
margin-right: 5px;
font-family: 'ProximaNova-Bold', serif;
font-size: 13px;
}
.likes__icon {
position: relative;
font-size: 0;
}
.likes.active .icon {
display: none;
}
.likes.active .icon-like-fill, .likes.active .icon-like-fill-bold {
display: block;
}
.likes .icon {
position: relative;
top: -1px;
font-size: 14px;
fill: #191919;
}
.likes .icon-like-fill, .likes .icon-like-fill-bold {
display: none;
fill: #FF9393;
}
.likes .icon-like-fill-bold {
position: relative;
top: -1px;
}
.user {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.user__ava {
height: 40px;
margin-right: 10px;
-ms-flex: 0 0 40px;
flex: 0 0 40px;
}
.user__ava {
height: 40px;
margin-right: 10px;
-ms-flex: 0 0 40px;
flex: 0 0 40px;
}
.user__info {
-ms-flex: 0 0 calc(100% - 50px);
flex: 0 0 calc(100% - 50px);
}
.user__name, .user__date {
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.5px;
line-height: 1.1;
}
.user__name {
margin-bottom: 5px;
}
.user__meta {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.user__date {
color: #A7A7A7;
}
.user__likes {
margin: -5px 0 -5px auto;
font-family: 'ProximaNova-Regular', serif;
font-size: 15px;
}
.user_white .user__date {
color: white;
}
.video {
display: block;
position: relative;
}
.video__pic {
display: block;
width: 100%;
}
.video .icon-play {
position: absolute;
top: 50%;
left: 50%;
font-size: 48px;
fill: white;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.video__soon {
display: -ms-flexbox;
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 20px;
background: rgba(25, 25, 25, 0.5);
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-direction: column;
flex-direction: column;
color: white;
}
.video__title {
margin-bottom: 20px;
}
.video__time {
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 3px;
}
.about {
display: -ms-flexbox;
display: flex;
padding-right: 160px;
}
.about__ava {
height: 120px;
margin-right: 40px;
-ms-flex: 0 0 120px;
flex: 0 0 120px;
}
.about__content {
margin-bottom: 20px;
}
.about__ceo {
margin-bottom: 20px;
}
.about__ceo a {
font-family: 'ProximaNova-Bold', serif;
}
.about__video {
margin-bottom: 20px;
}
.about__more {
text-align: center;
}
.online {
display: block;
position: relative;
padding: 55px 0 50px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
color: white;
text-align: center;
z-index: 4;
}
.online:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(-1deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.6) 100%);
z-index: -2;
}
.online__type {
margin-bottom: 85px;
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
letter-spacing: 4px;
}
.online__title {
margin-bottom: 2px;
font-family: 'ProximaNova-Bold', serif;
font-size: 50px;
line-height: 1.2;
}
.online__text {
max-width: 600px;
}
.online__action {
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
letter-spacing: 1px;
}
.online__action .icon {
position: relative;
top: 4px;
margin-right: 15px;
font-size: 16px;
}
.benefits {
display: -ms-flexbox;
display: flex;
position: relative;
max-width: 890px;
margin: 0 auto 80px;
text-align: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-pack: center;
justify-content: center;
z-index: 4;
}
.benefits__item {
padding: 0 15px;
-ms-flex: 0 0 25%;
flex: 0 0 25%;
}
.benefits__preview {
display: -ms-flexbox;
display: flex;
height: 45px;
margin-bottom: 20px;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.benefits__preview .icon-thumb {
font-size: 43px;
}
.benefits__preview .icon-wallet {
font-size: 38px;
}
.benefits__preview .icon-location {
font-size: 40px;
}
.benefits__preview .icon-searching {
font-size: 37px;
}
.benefits__title {
display: -ms-flexbox;
display: flex;
min-height: 38px;
margin-bottom: 10px;
font-family: 'ProximaNova-Bold', serif;
font-size: 14px;
letter-spacing: 2.5px;
line-height: 1.42;
text-transform: uppercase;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.reviews {
padding-right: 80px;
}
.reviews__item {
display: -ms-flexbox;
display: flex;
}
.reviews__item:not(:last-child) {
margin-bottom: 20px;
}
.reviews__ava {
height: 60px;
margin-right: 20px;
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
.reviews__wrap {
padding: 20px 30px 30px;
background: white;
box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1);
border-radius: 0 10px 10px 10px;
}
.reviews__name {
font-family: 'ProximaNova-Bold', serif;
font-size: 15px;
line-height: 1.33;
}
.gallery {
display: -ms-flexbox;
display: flex;
margin: 0 -10px -20px;
}
.gallery__grid {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
overflow: hidden;
}
.gallery__item {
float: left;
width: calc(33.33% - 20px);
margin: 0 10px 20px;
}
.gallery__item_lg {
width: calc(66.66% - 20px);
}
.gallery__item:nth-child(4) {
clear: both;
}
.gallery__pic {
display: block;
width: 100%;
}
.app {
position: relative;
margin-top: 72px;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
}
.app__center {
display: -ms-flexbox;
display: flex;
-ms-flex-align: end;
align-items: flex-end;
}
.app__col:first-child {
position: relative;
padding: 50px 0 60px;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
text-align: center;
z-index: 2;
}
.app__col:last-child {
-ms-flex: 0 0 51%;
flex: 0 0 51%;
}
.app__theme {
margin-bottom: 20px;
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
color: #4A90E2;
}
.app__title {
margin-bottom: 25px;
font-size: 32px;
line-height: 1.25;
}
.app__content {
margin-bottom: 30px;
}
.app__links {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
justify-content: center;
}
.app__link {
margin: 0 10px;
-ms-flex: 0 0 135px;
flex: 0 0 135px;
}
.app__preview {
display: -ms-flexbox;
display: flex;
height: 100px;
-ms-flex-align: end;
align-items: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.app__pic {
display: block;
max-width: 100%;
max-height: 277px;
}
a.grey-link {
color: #A7A7A7;
border-bottom: 1px #ccc solid;
font-size: 14px;
}
a.grey-link:hover {
color: #000;
border-bottom: 1px #545454 solid;
}
.game {
position: relative;
padding: 70px 0 80px;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
overflow: hidden;
}
.game__wrap {
max-width: 375px;
}
.game__theme {
margin-bottom: 20px;
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
color: #4A90E2;
}
.game__title {
margin-bottom: 65px;
font-size: 32px;
line-height: 1.25;
}
.game__btn {
background: transparent;
padding: 11px 24px 10px;
border: 2px solid #191919;
color: #191919;
}
.game__btn:hover {
background: #191919;
border-color: #191919;
color: white;
}
.game__btn:active {
color: rgba(255, 255, 255, 0.1);
}
.game__preview {
position: absolute;
top: 0;
left: calc(50% - 145px);
bottom: 0;
}
.game__pic {
display: block;
width: auto;
height: 100%;
}
.teachers {
margin-bottom: 50px;
}
.teachers__item {
display: -ms-flexbox;
display: flex;
margin-bottom: 40px;
}
.teachers__ava {
height: 140px;
margin-right: 25px;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.teachers__title {
margin-bottom: 5px;
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 4px;
}
.teachers__name {
margin-bottom: 20px;
font-family: 'ProximaNova-Bold', serif;
}
.teachers__content {
font-size: 16px;
line-height: 1.375;
}
.toggle {
font-size: 14px;
}
.toggle__head {
color: #FF9393;
}
.toggle__head .icon {
position: relative;
top: -1px;
margin-left: 10px;
font-size: 6px;
transition: transform .2s;
}
.toggle__head.active .icon {
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.toggle__body {
display: none;
padding-top: 10px;
color: #888;
}
.schedule {
margin-bottom: 70px;
}
.schedule__item {
display: -ms-flexbox;
display: flex;
margin-bottom: 40px;
}
.schedule__day {
padding-top: 2px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #FF9393;
letter-spacing: 2px;
text-transform: uppercase;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.schedule__title, .schedule__content {
font-size: 16px;
}
.schedule__title {
font-family: 'ProximaNova-Bold', serif;
}
.schedule__toggle {
margin-top: 10px;
}
.theme {
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 2px;
color: #FF9393;
}
.theme_green {
color: #8ECFC0;
}
.theme_violet {
color: #B995D9;
}
.theme_lg {
font-size: 20px;
letter-spacing: 4px;
}
.courses__list {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.courses__item {
display: block;
margin: 0 10px 60px;
color: #191919;
-ms-flex: 0 0 calc(33.33% - 20px);
flex: 0 0 calc(33.33% - 20px);
}
.courses__preview {
display: block;
position: relative;
margin-bottom: 15px;
color: #191919;
}
.courses__preview:hover .courses__view {
opacity: .9;
}
.courses__label {
position: absolute;
top: 0;
right: 20px;
width: 30px;
height: 45px;
background-repeat: no-repeat;
background-size: contain;
z-index: 6;
}
.courses__label_fav {
background-image: url(../img/fav.svg);
}
.courses__label_clock {
background-image: url(../img/clock.svg);
}
.courses__pic {
display: block;
width: 100%;
border-radius: 2px;
}
.courses__view {
display: -ms-flexbox;
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
border-radius: 2px;
opacity: 0;
font-size: 18px;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
transition: opacity .2s;
z-index: 4;
}
.courses__soon {
display: -ms-flexbox;
display: flex;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 10px;
background: rgba(0, 0, 0, 0.4);
color: white;
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
}
.courses__left {
margin-bottom: 5px;
font-size: 15px;
}
.courses__time {
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 3px;
}
.courses__details {
display: -ms-flexbox;
display: flex;
margin-bottom: 10px;
}
.courses__price {
margin-left: auto;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 2px;
color: #191919;
}
.courses__title {
display: block;
margin-bottom: 10px;
font-family: 'ProximaNova-SemiBold', serif;
font-size: 18px;
color: #191919;
}
.courses__user {
margin-top: 20px;
}
.courses_two .courses__item {
-ms-flex: 0 0 calc(50% - 20px);
flex: 0 0 calc(50% - 20px);
}
.load {
margin-top: 30px;
}
.load__btn {
width: 100%;
padding: 22px 24px 21px;
background: none;
border: 1px solid #E6E6E6;
}
.more {
text-align: center;
}
.more__btn {
position: relative;
min-width: 300px;
padding: 19px 24px 18px;
border-radius: 28px;
letter-spacing: 2px;
z-index: 4;
}
.more__btn:hover:before {
opacity: 0;
}
.more__btn:before {
content: '';
position: absolute;
top: 5px;
left: 5px;
right: 5px;
bottom: 5px;
background: white;
border-radius: 24px;
transition: opacity .2s;
z-index: -2;
}
.partners {
display: -ms-flexbox;
display: flex;
margin: 0 -10px -20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.partners__item {
margin: 0 10px 20px;
-ms-flex: 0 0 calc(16.66% - 20px);
flex: 0 0 calc(16.66% - 20px);
}
.partners__pic {
display: block;
width: 100%;
}
.switch {
display: block;
position: relative;
font-size: 13px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: pointer;
}
.switch__input {
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
.switch__input:checked + .switch__content:after {
opacity: 1;
}
.switch__content {
display: block;
padding: 3px 0 3px 30px;
font-size: 14px;
}
.switch__content:before, .switch__content:after {
content: '';
position: absolute;
}
.switch__content:before {
top: 0;
left: 0;
width: 20px;
height: 20px;
border: 1px solid #E6E6E6;
}
.switch__content:after {
top: 5px;
left: 5px;
width: 10px;
height: 10px;
background-image: linear-gradient(-225deg, #B4EC51 0%, #61E9E7 100%);
opacity: 0;
transition: opacity .2s;
}
.switch__cell {
padding-right: 10px;
}
.switch__cell:first-child {
padding-top: 3px;
font-family: 'ProximaNova-Bold', serif;
font-size: 11px;
text-transform: uppercase;
-ms-flex: 0 0 110px;
flex: 0 0 110px;
}
.switch__cell:nth-child(2), .switch__cell:last-child {
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
.switch__cell:nth-child(3) {
-ms-flex: 0 0 calc(100% - 230px);
flex: 0 0 calc(100% - 230px);
}
.switch__cell:last-child {
padding: 0;
text-align: right;
}
.switch_blue .switch__content:after {
background: #4A90E2;
}
.switch_lesson .switch__content {
display: -ms-flexbox;
display: flex;
padding: 19px 0 19px 50px;
border-bottom: 1px solid #E6E6E6;
font-size: 16px;
color: #A7A7A7;
transition: color .2s;
}
.switch_lesson .switch__content:before, .switch_lesson .switch__content:after {
-ms-transform: translateY(18px);
transform: translateY(18px);
}
.switch_lesson:first-child .switch__content {
border-top: 1px solid #E6E6E6;
}
.switch_lesson .switch__input:checked + .switch__content {
color: #191919;
}
.switch_circle .switch__content:before, .switch_circle .switch__content:after {
border-radius: 50%;
}
.switch_lg .switch__content {
padding: 0 0 0 30px;
font-size: 16px;
}
.footer {
padding: 50px 0 30px;
background: #F8F8F8;
}
.footer__row {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.footer__row_second {
margin-top: 50px;
}
.footer__col {
padding: 0 10px;
-ms-flex: 0 0 16.66%;
flex: 0 0 16.66%;
}
.footer__col_md {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
}
.footer__col_lg {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
}
.footer__logo {
width: 188px;
height: 58px;
margin: 2px 0 25px;
font-size: 18px;
line-height: 1.22222;
}
.footer__content {
max-width: 200px;
font-size: 18px;
}
.footer__title {
padding: 20px 0 50px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 0.92px;
text-transform: uppercase;
}
.footer__link, .footer__contact {
display: table;
font-size: 14px;
color: #191919;
line-height: 1.42857;
}
.footer__contact {
margin-bottom: 20px;
}
.footer__contact a {
color: #191919;
}
.footer__group, .footer__links {
display: -ms-flexbox;
display: flex;
color: #888;
}
.footer__copyright {
margin-right: 20px;
}
.footer__links .footer__link {
color: #888;
}
.footer__divider {
margin: 0 10px;
}
.subscribe__field {
margin-bottom: 10px;
}
.subscribe__input {
width: 100%;
height: 40px;
padding: 0 10px;
font-size: 16px;
text-align: center;
}
.subscribe__btn {
width: 100%;
}
.subscribe__content {
margin-top: 15px;
font-size: 12px;
line-height: 1.25;
}
.socials {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.socials__item {
font-size: 0;
}
.socials__item:not(:last-child) {
margin-right: 20px;
}
.socials__item .icon-instagram {
font-size: 18px;
}
.socials__item .icon-twitter {
font-size: 17px;
}
.socials__item .icon-fb {
font-size: 19px;
}
.socials__item .icon-youtube {
font-size: 15px;
}
.select {
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
z-index: 4;
}
.select__head {
position: relative;
height: 36px;
border-bottom: 1px solid #E6E6E6;
transition: border-color .2s;
font-size: 18px;
line-height: 36px;
white-space: nowrap;
text-overflow: ellipsis;
color: #A7A7A7;
cursor: pointer;
transition: border-color .2s;
overflow: hidden;
}
.select__head:after {
content: '';
position: absolute;
top: 14px;
right: 0;
width: 0px;
height: 0px;
border-style: solid;
border-width: 8px 4px 0 4px;
border-color: #191919 transparent transparent transparent;
}
.select__drop {
position: absolute;
left: 0;
right: 0;
top: calc(100% + 10px);
padding: 10px 0;
background: white;
box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
border-radius: 2px;
opacity: 0;
visibility: hidden;
transition: opacity .2s, visibility .2s;
overflow: hidden;
}
.select__option {
display: block;
position: relative;
padding: 8px 20px 7px;
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
color: #8C8C8C;
text-transform: uppercase;
transition: color .2s;
text-transform: uppercase;
cursor: pointer;
}
.select__option:hover {
color: #191919;
}
.select__option.active {
color: #191919;
}
.select__option.active .select__title:after {
content: '';
position: absolute;
top: 100%;
left: -10px;
right: -10px;
height: 2px;
margin-top: 2px;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
}
.select__title {
display: table;
position: relative;
}
.select.active {
z-index: 99;
}
.select.active .select__head {
border-color: #191919;
}
.select.active .select__head:after {
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.select.active .select__drop {
opacity: 1;
visibility: visible;
}
.select.selected .select__head {
color: #191919;
}
.field {
margin-bottom: 20px;
}
.field__label {
display: -ms-flexbox;
display: flex;
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
letter-spacing: 1px;
text-transform: uppercase;
}
.field__label_gray {
color: #A7A7A7;
}
.field__link {
margin-left: auto;
}
.field__wrap {
position: relative;
}
.field__input, .field__textarea {
width: 100%;
border-bottom: 1px solid #E6E6E6;
background: transparent;
font-size: 18px;
transition: border-color .2s;
}
.field__input:focus, .field__textarea:focus {
border-color: #191919;
}
.field__input_bg, .field__textarea_bg {
background: #F8F8F8;
border: 1px solid #F8F8F8;
}
.field__input_sm, .field__textarea_sm {
font-size: 16px;
}
.field__input {
height: 36px;
}
.field__input[type='password'] {
font-size: 30px;
}
.field__input[type='password']::-webkit-input-placeholder {
font-size: 18px;
}
.field__input[type='password']:-ms-input-placeholder {
font-size: 18px;
}
.field__input[type='password']::placeholder {
font-size: 18px;
}
.field__input_bg {
height: 50px;
padding: 0 20px;
}
.field__textarea {
display: block;
height: 36px;
padding: 7px 0;
resize: vertical;
}
.field__textarea_lg {
height: 80px;
font-size: 25px;
}
.field__preview {
position: absolute;
top: 8px;
right: 0;
}
.field__pic {
display: block;
width: auto;
height: 20px;
}
.field__error {
margin-top: 5px;
font-size: 12px;
color: #FF9393;
}
.field__switch {
margin-top: 10px;
}
.field__switch:first-child {
margin-top: 5px;
}
.field_code .field__input {
height: 40px;
font-size: 15px;
}
.field_info .field__label {
color: #A7A7A7;
}
.field_info .field__input,
.field_info .field__textarea {
border-color: rgba(230, 230, 230, 0.2);
color: white;
}
.field_info .field__input:focus,
.field_info .field__textarea:focus {
border-color: white;
}
.field.error .field__input,
.field.error .field__textarea {
border-color: #FF9393;
}
.field.success .field__input,
.field.success .field__textarea {
border-color: #5BD700;
}
.auth {
padding: 0 20px 25px;
}
.auth__nav {
display: -ms-flexbox;
display: flex;
margin-bottom: 30px;
}
.auth__type {
border-bottom: 1px solid #E6E6E6;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 2px;
line-height: 60px;
color: #A7A7A7;
text-transform: uppercase;
text-align: center;
-ms-flex: 1 0 50%;
flex: 1 0 50%;
transition: border-color .2s, color .2s;
}
.auth__type.active {
border-color: #191919;
color: #191919;
}
.auth__tab {
display: none;
}
.auth__fieldset {
display: -ms-flexbox;
display: flex;
}
.auth__fieldset {
display: -ms-flexbox;
display: flex;
margin: 0 -7px;
}
.auth__fieldset .auth__field {
margin: 0 7px 20px;
-ms-flex: 0 0 calc(50% - 14px);
flex: 0 0 calc(50% - 14px);
}
.auth__link {
display: block;
margin: -5px 0 0;
font-size: 12px;
color: #191919;
text-decoration: underline;
line-height: 1.5;
}
.auth__foot {
margin-top: 30px;
}
.auth__btn {
width: 100%;
padding: 18px 24px 17px;
}
.auth__or {
padding: 10px 0;
font-size: 14px;
text-align: center;
}
.auth__pass {
display: none;
}
.popup {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
min-width: 360px;
padding: 15px;
background: rgba(25, 25, 25, 0.7);
opacity: 0;
transition: opacity .2s;
overflow: auto;
z-index: 999;
}
.popup__wrap {
position: relative;
width: 100%;
max-width: 340px;
margin: auto;
background: white;
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
border-radius: 3px;
-ms-transform: scale(0.9);
transform: scale(0.9);
transition: transform .2s;
}
.popup__wrap_md {
max-width: 620px;
}
.popup__wrap_lg {
max-width: 1000px;
}
.popup__close {
position: absolute;
top: -15px;
right: -15px;
padding: 10px;
background: #191919;
border-radius: 50%;
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
font-size: 0;
}
.popup__close .icon {
font-size: 14px;
fill: white;
}
.popup.open {
display: -ms-flexbox;
display: flex;
}
.popup.visible {
opacity: 1;
}
.popup.visible .popup__wrap {
-ms-transform: scale(1);
transform: scale(1);
}
.head {
display: -ms-flexbox;
display: flex;
margin-bottom: 50px;
}
.head__right {
-ms-flex: 0 0 220px;
flex: 0 0 220px;
}
.head__right.hidden {
visibility: hidden;
}
.head__title {
position: relative;
margin: 0;
padding: 0 20px 0 260px;
-ms-flex: 0 0 calc(100% - 220px);
flex: 0 0 calc(100% - 220px);
z-index: 4;
}
.head__curve {
position: absolute;
top: 50%;
left: calc(50% - 60px);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: -2;
}
.layout {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
}
.layout__container, .layout__sidebar {
padding: 0 10px;
}
.layout__container {
-ms-flex: 0 0 66.66%;
flex: 0 0 66.66%;
}
.layout__search {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.layout__sidebar {
-ms-flex: 0 0 33.33%;
flex: 0 0 33.33%;
}
.similar__item {
display: -ms-flexbox;
display: flex;
margin-bottom: 30px;
color: #191919;
}
.similar__preview {
margin-right: 15px;
-ms-flex: 0 0 80px;
flex: 0 0 80px;
}
.similar__pic {
display: block;
width: 100%;
border-radius: 2px;
}
.similar__wrap {
-ms-flex: 0 0 calc(100% - 95px);
flex: 0 0 calc(100% - 95px);
}
.similar__title {
margin-bottom: 5px;
}
.similar__ava {
font-size: 10px;
color: #A7A7A7;
text-transform: uppercase;
}
.go {
display: -ms-flexbox;
display: flex;
margin-bottom: 50px;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-align: center;
align-items: center;
}
.go__item {
display: -ms-flexbox;
display: flex;
max-width: calc(50% - 20px);
-ms-flex-align: center;
align-items: center;
color: #191919;
}
.go__arrow {
margin-right: 15px;
font-size: 0;
}
.go__arrow .icon {
font-size: 17px;
fill: #191919;
}
.go__title {
font-size: 18px;
line-height: 1.33;
}
.go__title + .go__arrow {
margin: 0 0 0 15px;
}
.go__btn {
width: 220px;
}
.meta, .meta__item {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.meta__item:not(:last-child) {
margin-right: 40px;
}
.meta__icon {
margin-right: 10px;
font-size: 0;
}
.meta__icon .icon {
font-size: 16px;
fill: #A7A7A7;
}
.meta__icon .icon-video {
font-size: 14px;
}
.meta__icon .icon-showcase {
font-size: 18px;
}
.meta__icon .icon-date {
font-size: 20px;
}
.meta_white .meta__icon .icon {
fill: white;
}
.course {
margin-bottom: 60px;
}
.course__head {
display: -ms-flexbox;
display: flex;
min-height: 40px;
margin-bottom: 30px;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: justify;
justify-content: space-between;
}
.course__title {
margin-bottom: 20px;
}
.course__content {
margin-bottom: 40px;
}
.course__about {
position: relative;
margin-bottom: 40px;
}
.course__about:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
}
.course__pic {
display: block;
width: 100%;
}
.course__btn {
position: absolute;
top: 50%;
left: 50%;
min-width: 200px;
background: transparent;
border: 2px solid white;
color: white;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
overflow: hidden;
}
.course__btn:active {
color: rgba(255, 255, 255, 0.4);
}
.course__user {
margin-bottom: 40px;
}
.course__info {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.course__buy {
width: 220px;
margin-left: auto;
}
.course__metas {
display: -ms-flexbox;
display: flex;
margin-bottom: 45px;
-ms-flex-pack: justify;
justify-content: space-between;
}
.course__actions {
display: -ms-flexbox;
display: flex;
margin: 0 -10px 50px;
}
.course__action {
position: relative;
margin: 0 10px;
-ms-flex: 0 0 calc(50% - 20px);
flex: 0 0 calc(50% - 20px);
}
.course__action .icon {
position: absolute;
top: 50%;
right: 45px;
margin: 0;
font-size: 19px;
-ms-transform: translateY(calc(-50% - 1px));
transform: translateY(calc(-50% - 1px));
}
.course__video {
margin-bottom: 30px;
}
.course__share {
margin-bottom: 60px;
}
.course_promo {
position: relative;
margin: 0;
padding: 100px 0 110px;
background-size: cover;
background-position: 50% 50%;
background-repeat: no-repeat;
color: white;
z-index: 4;
}
.course_promo:before, .course_promo:after {
content: '';
position: absolute;
}
.course_promo:before {
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.64) 100%);
z-index: -2;
}
.course_promo:after {
left: 50%;
bottom: -1px;
margin-left: -16px;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 16px 16px 16px;
border-color: transparent transparent #F8F8F8 transparent;
}
.course_promo .course__likes {
color: white;
}
.course_promo .course__likes .icon {
fill: white;
}
.lessons__list {
margin-bottom: 60px;
}
.lessons__item {
position: relative;
margin-bottom: 40px;
transition: box-shadow .2s;
}
.lessons__item:hover .lessons__actions {
opacity: 1;
visibility: visible;
}
.lessons__subtitle {
margin-bottom: 20px;
}
.lessons__row {
display: -ms-flexbox;
display: flex;
}
.lessons__preview {
margin-right: 25px;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.lessons__pic {
display: block;
width: 100%;
}
.lessons__content {
-ms-flex: 0 0 calc(100% - 165px);
flex: 0 0 calc(100% - 165px);
}
.lessons__actions {
display: -ms-flexbox;
display: flex;
position: absolute;
top: 10px;
right: 10px;
opacity: 0;
visibility: hidden;
transition: opacity .2s, visibility .2s;
}
.lessons__action {
margin-left: 10px;
padding: 10px;
font-size: 0;
}
.lessons__action:hover .icon {
fill: #191919;
}
.lessons__action .icon {
font-size: 20px;
fill: #C8C8C8;
transition: fill .2s;
}
.lessons__foot {
text-align: center;
}
.lessons__btn {
width: 220px;
}
.lessons_kit .lessons__item {
margin-bottom: 20px;
padding: 20px;
}
.lessons_kit .lessons__item:hover {
box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.06);
border-radius: 10px;
}
.lessons_kit .lessons__content {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.lesson__subtitle {
margin-bottom: 10px;
color: #191919;
}
.lesson__content {
margin-bottom: 30px;
color: #191919;
}
.lessons__subtitle {
margin-bottom: 10px;
color: #191919;
}
.lessons__content {
margin-bottom: 30px;
color: #191919;
}
.materials__item {
display: -ms-flexbox;
display: flex;
}
.materials__item:not(:last-child) {
margin-bottom: 40px;
}
.materials__preview {
margin-right: 25px;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.materials__pic {
display: block;
width: 100%;
}
.materials__wrap {
-ms-flex: 0 0 calc(100% - 180px);
flex: 0 0 calc(100% - 180px);
}
.materials__title {
margin-bottom: 10px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 2px;
text-transform: uppercase;
}
.examples {
display: -ms-flexbox;
display: flex;
margin: 0 -10px -20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.examples__item {
margin: 0 10px 20px;
-ms-flex: 0 0 calc(25% - 20px);
flex: 0 0 calc(25% - 20px);
}
.examples__pic {
display: block;
width: 100%;
}
.questions__form, .questions__item {
display: -ms-flexbox;
display: flex;
}
.questions__form {
margin-bottom: 40px;
padding-bottom: 20px;
border-bottom: 1px solid #E6E6E6;
}
.questions__item:not(:last-child) {
margin-bottom: 25px;
}
.questions__item_reply {
padding-left: 80px;
}
.questions__reply-info {
display: none;
margin-bottom: 10px;
}
.questions__item_reply .questions__details {
margin-bottom: 10px;
padding: 20px;
background: white;
border-radius: 0 10px 10px 10px;
}
.questions__ava {
height: 60px;
margin-right: 20px;
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
.questions__pic {
display: block;
width: 100%;
}
.questions__wrap {
-ms-flex: 0 0 calc(100% - 80px);
flex: 0 0 calc(100% - 80px);
}
.questions__field {
margin-bottom: 20px;
}
.questions__textarea {
display: block;
width: 100%;
height: 70px;
padding: 11px 15px;
border-radius: 2px;
font-size: 16px;
resize: vertical;
}
.questions__btn {
display: block;
margin: 0 auto;
border-radius: 20px;
}
.questions__details {
margin-bottom: 5px;
}
.questions__head, .questions__action {
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
letter-spacing: 2px;
text-transform: uppercase;
}
.questions__head {
margin-bottom: 15px;
}
.questions__action, .questions__date {
color: #A7A7A7;
}
.questions__author {
margin-right: 15px;
}
.questions__date {
display: inline-block;
}
.questions__foot {
text-align: right;
}
.questions__action {
margin-left: auto;
}
.share__title {
margin-bottom: 45px;
font-family: 'ProximaNova-Bold', serif;
font-size: 20px;
text-align: center;
}
.share__list {
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
justify-content: center;
}
.share__item {
font-size: 0;
}
.share__item:not(:last-child) {
margin-right: 20px;
}
.share__item .icon {
font-size: 40px;
}
.share_sm .share__title {
margin-bottom: 15px;
}
.share_sm .share__item:not(:last-child) {
margin-right: 10px;
}
.share_sm .share__item .icon {
font-size: 30px;
}
.share_right .share__list {
-ms-flex-pack: start;
justify-content: flex-start;
}
.buy {
padding: 15px 30px 30px;
}
.buy__row {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.buy__col {
margin-bottom: 20px;
padding: 0 10px;
-ms-flex: 0 0 320px;
flex: 0 0 320px;
}
.buy__col:nth-child(2n-1) {
-ms-flex: 0 0 calc(100% - 320px);
flex: 0 0 calc(100% - 320px);
}
.buy__head_main {
padding-top: 25px;
}
.buy__label {
font-size: 16px;
}
.buy__title {
font-size: 30px;
}
.buy__content {
font-size: 12px;
color: #A7A7A7;
}
.buy__foot {
margin-top: 20px;
text-align: center;
}
.buy__btn {
width: 275px;
}
.order {
padding: 2px;
background-image: linear-gradient(-225deg, #FFE2EB 0%, #D8F5F5 100%);
border-radius: 8px;
}
.order__wrap {
padding: 20px 30px 30px;
background: white;
border-radius: 6px;
}
.order__title {
margin-bottom: 20px;
font-size: 20px;
}
.order__preview {
margin: 0 -30px 20px;
}
.order__pic {
display: block;
width: 100%;
}
.order__label {
margin-bottom: 10px;
font-family: 'ProximaNova-Bold', serif;
font-size: 11px;
text-transform: uppercase;
}
.order__foot {
display: -ms-flexbox;
display: flex;
margin: 30px -30px -10px;
padding: 20px 30px 0;
border-top: 1px solid #E6E6E6;
font-family: 'ProximaNova-Bold', serif;
font-size: 16px;
}
.order__total {
margin-left: auto;
}
.lock {
padding: 50px 60px 40px;
text-align: center;
}
.lock__label {
margin-bottom: 70px;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #A7A7A7;
letter-spacing: 2px;
}
.lock__title {
margin-bottom: 20px;
}
.lock__content {
margin-bottom: 70px;
}
.lock__btn {
width: 220px;
}
.profile {
position: relative;
padding-bottom: 20px;
text-align: center;
}
.profile__btn {
padding: 10px 15px;
background: transparent;
border: 1px solid #A7A7A7;
color: #A7A7A7;
}
.profile__btn_edit {
position: absolute;
top: 0;
right: 0;
}
.profile__row {
display: -ms-flexbox;
display: flex;
margin-bottom: 25px;
-ms-flex-align: center;
align-items: center;
}
.profile__ava {
width: 120px;
height: 120px;
margin: 0 auto 20px;
}
.profile__name {
margin-bottom: 15px;
font-size: 20px;
letter-spacing: 3px;
text-transform: uppercase;
}
.profile__share {
margin-bottom: 35px;
}
.profile__content {
max-width: 760px;
margin: 0 auto;
}
.profile__foot {
display: none;
margin-top: 30px;
text-align: center;
}
.tabs__nav {
display: -ms-flexbox;
display: flex;
height: 56px;
margin-bottom: 40px;
border-bottom: 1px solid #E6E6E6;
}
.tabs__btn {
height: 56px;
border-bottom: 1px solid #E6E6E6;
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
color: #A7A7A7;
letter-spacing: 1px;
transition: border-color .2s, color .2s;
}
.tabs__btn:not(:last-child) {
margin-right: 40px;
}
.tabs__btn:hover {
color: #191919;
}
.tabs__btn.active {
border-color: #191919;
color: #191919;
}
.tabs__item {
display: none;
}
.menu {
display: -ms-flexbox;
display: flex;
}
.menu__link {
font-size: 16px;
color: #A7A7A7;
transition: color .2s;
}
.menu__link:not(:last-child) {
margin-right: 30px;
}
.menu__link.active {
font-family: 'ProximaNova-Bold', serif;
color: #191919;
}
.confirm__title {
margin-bottom: 20px;
font-size: 24px;
}
.confirm__form {
display: -ms-flexbox;
display: flex;
margin: 25px -10px 30px;
-ms-flex-align: center;
align-items: center;
}
.confirm__field, .confirm__btn {
margin: 0 10px;
-ms-flex: 0 0 calc(50% - 20px);
flex: 0 0 calc(50% - 20px);
}
.form {
position: relative;
}
.form__ava {
position: absolute;
left: -160px;
width: 140px;
height: 140px;
}
.form__group {
position: relative;
margin-bottom: 40px;
}
.form__title {
margin-bottom: 30px;
font-size: 25px;
}
.form__content {
margin-bottom: 40px;
}
.form__fieldset {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
}
.form__fieldset .form__field {
padding: 0 10px;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.form__field {
margin-bottom: 25px;
}
.form__switch {
margin-bottom: 10px;
}
.form__btn {
width: 100%;
}
.transactions__row {
display: -ms-flexbox;
display: flex;
margin: 0 -10px 20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.transactions__cell {
padding: 0 10px;
font-size: 13px;
}
.transactions__cell:first-child {
font-family: 'ProximaNova-Bold', serif;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 2px;
-ms-flex: 0 0 60%;
flex: 0 0 60%;
}
.transactions__cell:nth-child(2), .transactions__cell:last-child {
-ms-flex: 0 0 20%;
flex: 0 0 20%;
text-align: right;
}
.transactions__cell:last-child {
color: #5BD700;
}
.empty {
max-width: 300px;
margin: 0 auto;
text-align: center;
}
.done {
padding: 60px 0;
text-align: center;
}
.done__foot {
margin-top: 60px;
}
.done__btn {
width: 100%;
max-width: 300px;
}
.author__row {
display: -ms-flexbox;
display: flex;
}
.author__ava {
height: 90px;
margin-right: 20px;
-ms-flex: 0 0 90px;
flex: 0 0 90px;
}
.author__wrap {
-ms-flex: 0 0 calc(100% - 110px);
flex: 0 0 calc(100% - 110px);
}
.author__hi, .author__name {
display: table;
font-family: 'ProximaNova-Bold', serif;
text-transform: uppercase;
}
.author__hi {
margin-bottom: 30px;
font-size: 12px;
letter-spacing: 2px;
}
.author__name {
font-size: 10px;
letter-spacing: 1.66px;
}
.author__content {
margin-bottom: 30px;
}
.upload {
position: relative;
font-size: 18px;
color: #4A90E2;
overflow: hidden;
}
.upload__file {
position: absolute;
top: 0;
right: 0;
opacity: 0;
cursor: pointer;
}
.info {
display: -ms-flexbox;
display: flex;
background: #F8F8F8;
}
.info__section {
display: -ms-flexbox;
display: flex;
position: relative;
background-position: 50% 50%;
background-size: cover;
-ms-flex: 0 0 calc(50% + 169px);
flex: 0 0 calc(50% + 169px);
-ms-flex-pack: end;
justify-content: flex-end;
z-index: 4;
}
.info__section:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.64) 100%);
z-index: -2;
}
.info__sidebar {
-ms-flex: 0 0 calc(50% - 169px);
flex: 0 0 calc(50% - 169px);
}
.info__main {
display: -ms-flexbox;
display: flex;
max-width: 675px;
height: 550px;
padding: 30px 40px 50px;
-ms-flex-direction: column;
flex-direction: column;
}
.info__head {
display: -ms-flexbox;
display: flex;
-ms-flex-align: start;
align-items: flex-start;
}
.info__user {
display: -ms-flexbox;
display: flex;
margin-bottom: 45px;
-ms-flex-align: center;
align-items: center;
}
.info__ava {
width: 40px;
height: 40px;
margin-right: 20px;
-ms-flex: 0 0 40px;
flex: 0 0 40px;
}
.info__label {
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
color: #A7A7A7;
letter-spacing: 1px;
}
.info__value {
font-size: 18px;
color: white;
}
.info__upload {
margin-left: auto;
font-size: 16px;
color: rgba(255, 255, 255, 0.7);
}
.info__foot {
display: -ms-flexbox;
display: flex;
margin-top: auto;
}
.info__foot .info__field {
margin-right: 20px;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.info__wrap {
max-width: 349px;
height: 550px;
padding: 30px 40px 30px 30px;
}
.info__wrap {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
}
.info__wrap .info__field {
margin-bottom: 30px;
}
.info__wrap .info__field:last-child {
margin: 0;
}
.info__fieldset:first-child {
margin-bottom: 50px;
}
.info__fieldset:last-child {
margin-top: auto;
}
.add {
display: -ms-flexbox;
display: flex;
}
.add__toggle {
font-size: 0;
}
.add__circle, .add__title {
display: inline-block;
vertical-align: middle;
}
.add__circle {
position: relative;
margin-right: 10px;
padding: 19px;
border: 1px solid #E6E6E6;
border-radius: 50%;
}
.add__circle .icon {
font-size: 20px;
fill: #B5B5B5;
}
.add__title {
margin-left: 10px;
font-size: 20px;
color: #B5B5B5;
}
.add__list {
display: none;
}
.add__btn {
width: 60px;
height: 60px;
border: 1px solid #888;
border-radius: 50%;
font-size: 0;
}
.add__btn:not(:last-child) {
margin: 0 10px 10px 0;
}
.add__btn .icon {
font-size: 22px;
fill: #191919;
}
.add__btn .icon-live {
font-size: 10px;
}
.add__btn .icon-image-text {
font-size: 15px;
}
.add__btn .icon-text {
font-size: 17px;
}
.add__btn .icon-images {
font-size: 32px;
}
.add.open .add__circle .icon {
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.add.open .add__title {
display: none;
}
.add.open .add__list {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.kit {
max-width: 620px;
}
.kit__section {
margin-bottom: 60px;
}
.kit__nav {
display: -ms-flexbox;
display: flex;
margin: 0 -10px 60px;
}
.kit__btn {
margin: 0 10px;
-ms-flex: 0 0 calc(50% - 20px);
flex: 0 0 calc(50% - 20px);
}
.kit__add {
margin-bottom: 40px;
}
.kit__service {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.kit__service .kit__field {
margin: 0;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.kit__upload {
margin-left: 20px;
}
.kit__row {
display: -ms-flexbox;
display: flex;
}
.kit__row .kit__photo {
height: 110px;
margin-right: 20px;
-ms-flex: 0 0 140px;
flex: 0 0 140px;
}
.kit__photo {
display: -ms-flexbox;
display: flex;
position: relative;
border: 1px solid #E6E6E6;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-align: center;
align-items: center;
overflow: hidden;
}
.kit__photo .icon {
font-size: 20px;
fill: #B5B5B5;
}
.kit__file {
position: absolute;
top: 0;
right: 0;
font-size: 100px;
opacity: 0;
cursor: pointer;
}
.kit__fieldset {
-ms-flex: 0 0 calc(100% - 160px);
flex: 0 0 calc(100% - 160px);
}
.kit__gallery {
display: -ms-flexbox;
display: flex;
margin: 0 -10px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.kit__gallery .kit__photo, .kit__preview {
margin: 0 10px 20px;
-ms-flex: 0 0 calc(25% - 20px);
flex: 0 0 calc(25% - 20px);
}
.kit__pic {
display: block;
width: 100%;
}
.kit__theme {
margin-bottom: 30px;
padding-bottom: 5px;
font-size: 20px;
border-bottom: 1px solid #E6E6E6;
}
.kit__foot {
text-align: center;
}
.kit__submit {
width: 220px;
}
.editor {
position: relative;
}
.fontstyle {
position: absolute;
top: -40px;
left: 40px;
padding: 0 15px;
background: #191919;
border-radius: 35px;
font-size: 0;
white-space: nowrap;
}
.fontstyle__regular, .fontstyle__bold, .fontstyle__italic {
width: 28px;
height: 35px;
font-size: 16px;
color: white;
}
.fontstyle__bold {
font-family: 'ProximaNova-Bold', serif;
}
.fontstyle__italic {
font-style: italic;
}
.ui-datepicker {
display: none;
width: 240px;
margin-top: 10px;
padding: 5px;
background: white;
box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
z-index: 99 !important;
}
.ui-datepicker-header {
display: -ms-flexbox;
display: flex;
margin-bottom: 5px;
-ms-flex-align: center;
align-items: center;
}
.ui-datepicker-prev, .ui-datepicker-next {
padding: 10px;
font-size: 0;
cursor: pointer;
}
.ui-datepicker-prev:before, .ui-datepicker-next:before {
content: '';
display: block;
width: 10px;
height: 10px;
border: solid #E6E6E6;
border-width: 2px 2px 0 0;
}
.ui-datepicker-prev {
-ms-flex-order: 1;
order: 1;
}
.ui-datepicker-prev:before {
-ms-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.ui-datepicker-title {
text-align: center;
-ms-flex-order: 2;
order: 2;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.ui-datepicker-next {
-ms-flex-order: 3;
order: 3;
}
.ui-datepicker-next:before {
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.ui-datepicker-calendar th,
.ui-datepicker-calendar td {
font-family: 'ProximaNova-Bold', serif;
font-size: 10px;
text-transform: uppercase;
text-align: center;
vertical-align: middle;
}
.ui-datepicker-calendar th {
padding: 5px;
}
.ui-datepicker-calendar a {
display: block;
padding: 7px;
color: #8C8C8C;
transition: color .2s;
}
.ui-datepicker-calendar a:hover {
color: #191919;
}
.ui-datepicker-calendar a.ui-state-active {
background: #F8F8F8;
color: #FF9393;
}
.form__common-error {
margin-top: 15px;
font-size: 14px;
background: #FF9393;
color: #fff;
padding: 10px;
display: none;
}
.searching {
display: -ms-flexbox;
display: flex;
margin-bottom: 40px;
}
.searching__input {
height: 40px;
padding: 0 10px;
border: 1px solid #E6E6E6;
border-radius: 3px 0 0 3px;
font-size: 18px;
transition: border-color .2s;
-ms-flex: 0 0 calc(100% - 100px);
flex: 0 0 calc(100% - 100px);
}
.searching__input:focus {
border-color: #191919;
}
.searching__btn {
border-radius: 0 3px 3px 0;
-ms-flex: 0 0 100px;
flex: 0 0 100px;
}
@media only screen and (max-width: 1023px) {
body {
font-size: 14px;
line-height: 1.57;
}
.center {
padding: 0 15px;
}
.btn {
line-height: 1.33;
}
.logo {
width: 124px;
height: 40px;
}
.header__container {
height: 65px;
}
.header__section {
height: 65px;
font-size: 10px;
line-height: 65px;
}
.header__enter {
height: 65px;
margin-left: 25px;
font-size: 10px;
line-height: 65px;
}
.header__login {
margin-right: -15px;
}
.main {
min-height: 350px;
padding: 137px 0 40px;
}
.main__title {
max-width: 400px;
font-size: 24px;
line-height: 1.33;
}
.main_sm {
min-height: 0;
}
.title {
margin-bottom: 20px;
font-size: 24px;
line-height: 1.33;
}
.subtitle_center {
text-align: center;
}
.text {
max-width: 400px;
margin-bottom: 40px;
font-size: 14px;
line-height: 1.5;
}
.text p {
display: inline;
}
.text p:not(:last-child) {
margin: 0;
}
.text__curve_one {
left: -85px;
bottom: -60px;
}
.text__curve_two {
left: -85px;
}
.text__curve_three {
left: -85px;
}
.text__curve_four {
left: -60px;
width: 90px;
}
.text_mb0 {
margin-bottom: 0;
}
.section {
padding: 40px 0;
}
.section_border:after {
max-width: calc(100% - 30px);
}
.likes__counter {
font-size: 12px;
}
.about {
padding: 0;
}
.about__ava {
margin-right: 25px;
height: 90px;
-ms-flex: 0 0 90px;
flex: 0 0 90px;
}
.about__video {
max-width: calc(100% - 55px);
}
.about__more {
text-align: left;
}
.online {
padding: 30px 0;
}
.online__type {
margin-bottom: 30px;
font-size: 12px;
letter-spacing: 2px;
}
.online__title {
margin-bottom: 6px;
font-size: 24px;
}
.online__text {
margin-bottom: 65px;
}
.benefits {
margin: 0;
}
.benefits__item {
margin-bottom: 40px;
-ms-flex: 0 0 33.33%;
flex: 0 0 33.33%;
}
.benefits__content {
font-size: 12px;
}
.reviews {
padding: 0;
}
.reviews__item:not(:last-child) {
margin-bottom: 40px;
}
.reviews__ava {
height: 45px;
-ms-flex: 0 0 45px;
flex: 0 0 45px;
}
.gallery__grid:first-child {
-ms-flex: 0 0 60%;
flex: 0 0 60%;
}
.gallery__grid:last-child {
-ms-flex: 0 0 40%;
flex: 0 0 40%;
}
.gallery__grid:last-child .gallery__item {
width: calc(50% - 20px);
}
.gallery__grid:last-child .gallery__item_lg {
width: calc(100% - 20px);
}
.gallery__grid:last-child .gallery__item:nth-child(3),
.gallery__grid:last-child .gallery__item:nth-child(5),
.gallery__grid:last-child .gallery__item:nth-child(6) {
display: none;
}
.app {
margin-top: 42px;
}
.app__col:first-child {
padding: 30px 0 35px;
-ms-flex: 0 0 47%;
flex: 0 0 47%;
}
.app__col:last-child {
-ms-flex: 0 0 53%;
flex: 0 0 53%;
}
.app__theme {
margin-bottom: 5px;
}
.app__title {
margin-bottom: 30px;
font-family: 'ProximaNova-Bold', serif;
font-size: 24px;
line-height: 1.33;
}
.app__content {
display: none;
}
.app__link {
margin: 0 5px;
-ms-flex: 0 0 80px;
flex: 0 0 80px;
}
.game {
padding: 30px 0 35px;
}
.game__wrap {
max-width: 220px;
}
.game__title {
margin-bottom: 30px;
font-family: 'ProximaNova-SemiBold', serif;
font-size: 18px;
line-height: 1.33;
}
.game__preview {
left: calc(50% - 110px);
}
.teachers {
margin-bottom: 0;
}
.teachers__ava {
height: 100px;
margin-right: 20px;
-ms-flex: 0 0 100px;
flex: 0 0 100px;
}
.teachers__title {
font-size: 12px;
letter-spacing: 2px;
}
.schedule {
margin-bottom: 0;
}
.courses__item {
margin-bottom: 40px;
}
.courses__preview {
margin-bottom: 10px;
}
.courses__label {
width: 20px;
height: 30px;
right: 10px;
}
.courses__left {
font-size: 12px;
}
.courses__time {
font-size: 12px;
letter-spacing: 1px;
}
.courses__title {
line-height: 1.33;
}
.courses_two .courses__item {
-ms-flex: 0 0 calc(33.33% - 20px);
flex: 0 0 calc(33.33% - 20px);
}
.more {
margin-top: 30px;
}
.switch__cell:nth-child(2) {
padding: 0;
text-align: right;
-ms-flex: 0 0 calc(100% - 110px);
flex: 0 0 calc(100% - 110px);
}
.switch__cell:nth-child(3) {
padding: 0;
-ms-flex: 0 0 calc(100% - 60px);
flex: 0 0 calc(100% - 60px);
}
.switch_lesson .switch__content {
padding: 10px 0 10px 40px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
line-height: 1.33;
}
.switch_lesson .switch__content:before, .switch_lesson .switch__content:after {
-ms-transform: translateY(9px);
transform: translateY(9px);
}
.footer {
padding: 30px 0 35px;
}
.footer__row_first .footer__col:nth-child(2) {
-ms-flex-order: 1;
order: 1;
}
.footer__row_first .footer__col:nth-child(3) {
-ms-flex-order: 2;
order: 2;
}
.footer__row_first .footer__col:nth-child(4) {
-ms-flex-order: 3;
order: 3;
}
.footer__row_first .footer__col:nth-child(1) {
-ms-flex: 0 0 59%;
flex: 0 0 59%;
-ms-flex-order: 4;
order: 4;
}
.footer__row_first .footer__col:nth-child(5) {
-ms-flex: 0 0 41%;
flex: 0 0 41%;
-ms-flex-order: 5;
order: 5;
}
.footer__row_first .footer__col:nth-child(1), .footer__row_first .footer__col:nth-child(5) {
margin-top: 40px;
}
.footer__row_second {
display: block;
width: 60%;
margin-top: -50px;
}
.footer__col {
-ms-flex: 0 0 33.33%;
flex: 0 0 33.33%;
}
.footer__logo {
width: 188px;
height: 58px;
margin-top: 0;
}
.footer__content {
max-width: 250px;
font-size: 14px;
line-height: 1.33;
}
.footer__title {
padding: 0 0 20px;
letter-spacing: 2px;
}
.footer__link, .footer__contact {
padding: 5px 0;
}
.footer__copyright {
margin: 20px 0 0;
}
.footer__links {
display: none;
}
.head {
margin-bottom: 40px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.head__right {
margin-left: auto;
}
.head__title {
margin: 0 0 15px;
padding: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.layout {
display: block;
}
.layout__container {
margin-bottom: 40px;
}
.similar {
display: -ms-flexbox;
display: flex;
margin: 0 -10px -30px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.similar__item {
margin: 0 10px 30px;
-ms-flex: 0 0 calc(50% - 20px);
flex: 0 0 calc(50% - 20px);
}
.go {
margin-bottom: 30px;
}
.go__arrow {
margin-right: 10px;
}
.go__arrow .icon {
font-size: 12px;
}
.go__title {
font-size: 14px;
}
.go__title + .go__arrow {
margin-left: 10px;
}
.meta__item:not(:last-child) {
margin-right: 30px;
}
.course__head {
margin-bottom: 10px;
}
.course__title {
margin-bottom: 10px;
}
.course__content {
margin-bottom: 25px;
}
.course__about {
margin-bottom: 25px;
}
.course__user {
margin-bottom: 30px;
}
.course_promo {
padding: 60px 0;
}
.buy {
padding: 10px 15px 25px;
}
.buy__col {
-ms-flex: 0 0 260px;
flex: 0 0 260px;
}
.buy__col:nth-child(2n-1) {
-ms-flex: 0 0 calc(100% - 260px);
flex: 0 0 calc(100% - 260px);
}
.buy__head_main {
padding-top: 21px;
}
.buy__label {
font-size: 14px;
}
.buy__title {
font-size: 24px;
}
.order__wrap {
padding: 15px 20px 20px;
}
.order__preview {
margin: 0 -20px 20px;
}
.order__foot {
margin: 30px -20px 0;
padding: 20px 20px 0;
}
.form__ava {
position: relative;
left: 0;
margin-bottom: 40px;
}
.info__main {
width: 100%;
max-width: 100%;
padding: 30px 15px 50px;
}
.info__wrap {
max-width: 100%;
height: auto;
padding: 30px 15px 30px;
}
}
@media only screen and (max-width: 599px) {
.btn_md {
padding: 13px 24px 12px;
}
.btn_lg {
padding: 13px 20px;
}
.btn_lg.btn_stroke {
padding: 12px 19px;
}
.search {
width: 100%;
}
.search__input {
width: 100%;
}
.search.open .search__input {
width: 100%;
}
.header__container {
height: 70px;
margin: 0 -15px;
-ms-flex-pack: justify;
justify-content: space-between;
}
.header__wrap {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: white;
-ms-flex-direction: column;
flex-direction: column;
z-index: 20;
}
.header__wrap.visible {
display: block;
}
.header__actions {
position: absolute;
top: 100%;
left: 0;
right: 0;
padding: 10px 15px;
background: white;
}
.header__top {
display: -ms-flexbox;
display: flex;
height: 70px;
border-bottom: 1px solid #E6E6E6;
-ms-flex-align: center;
align-items: center;
}
.header__search {
margin-left: 10px;
-ms-flex: 0 0 calc(100% - 90px);
flex: 0 0 calc(100% - 90px);
}
.header__nav {
display: block;
height: calc(100vh - 71px);
margin: 0;
padding: 15px 0;
overflow: auto;
}
.header__group:hover .header__section {
color: #FF9393;
}
.header__section {
position: relative;
height: auto;
margin: 0;
padding: 15px 40px 15px 20px;
border: none;
font-size: 14px;
color: #FF9393;
letter-spacing: 2.5px;
line-height: 1.33;
}
.header__section_sub:before, .header__section_sub:after {
content: '';
position: absolute;
top: 50%;
background: #A7A7A7;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.header__section_sub:before {
right: 20px;
width: 12px;
height: 2px;
}
.header__section_sub:after {
right: 25px;
width: 2px;
height: 12px;
}
.header__section.active {
color: #FF9393;
}
.header__section.open:after {
opacity: 0;
}
.header__list {
display: none;
position: static;
width: 100%;
margin: 0;
box-shadow: none;
opacity: 1;
visibility: visible;
}
.header__drop {
padding: 0;
}
.header__drop .header__link {
padding: 8px 20px 7px;
}
.header__drop .header__link_border {
padding: 12px 20px 10px;
}
.header__link {
padding: 11px 20px;
font-size: 12px;
color: #191919;
}
.header__link_green {
color: #5BD700;
}
.header__menu, .header__enter, .header__close {
display: block;
width: 60px;
height: 60px;
font-size: 0;
}
.header__enter {
margin: 0;
font-size: 0;
line-height: 1;
}
.header__enter .icon {
display: inline-block;
font-size: 20px;
fill: #191919;
}
.header__login {
margin: 0;
padding: 15px 20px;
}
.main {
min-height: 400px;
}
.main__title {
margin-bottom: 50px;
}
.main_sm {
min-height: 0;
}
.subtitle {
margin-bottom: 15px;
font-size: 12px;
letter-spacing: 2px;
}
.text {
margin-bottom: 30px;
}
.text__curve_one {
width: 200px;
left: 0;
top: -10px;
bottom: auto;
}
.text__curve_two {
left: 0;
bottom: -15px;
width: 150px;
}
.text__curve_three {
left: 0;
bottom: -10px;
}
.text__curve_four {
left: 30px;
bottom: -20px;
}
.text_mb0 {
margin-bottom: 0;
}
.section {
padding: 30px 0;
}
.section_tabs {
padding-top: 10px;
}
.video .icon-play {
font-size: 22px;
}
.about__ava {
margin-right: 15px;
height: 60px;
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
.about__video {
max-width: 100%;
}
.online {
padding: 20px 0;
}
.online__type {
margin-bottom: 40px;
}
.online__text {
max-width: 80%;
margin-bottom: 40px;
}
.benefits {
display: block;
}
.benefits__item {
padding: 0;
}
.benefits__preview {
height: auto;
margin-bottom: 15px;
}
.benefits__title {
min-height: 0;
}
.benefits__content {
font-size: 14px;
}
.reviews__ava {
margin-right: 10px;
}
.reviews__wrap {
padding: 15px 20px 20px;
}
.gallery {
display: block;
margin: 0 -5px -10px;
}
.gallery__grid:last-child {
display: none;
}
.gallery__item {
width: calc(33.33% - 10px);
margin: 0 5px 10px;
}
.gallery__item_lg {
width: calc(66.66% - 10px);
}
.app {
margin-top: 35px;
}
.app__col:first-child {
padding: 20px 0;
text-align: left;
}
.app__theme {
margin-bottom: 15px;
}
.app__title {
margin-bottom: 15px;
font-size: 16px;
}
.app__link {
margin: 0 5px 0 0;
}
.app__preview {
margin: 0 -15px;
}
.app__pic {
max-height: 185px;
}
.game {
padding: 20px 0;
}
.game__wrap {
max-width: 180px;
}
.game__theme {
margin-bottom: 15px;
}
.game__title {
margin-bottom: 15px;
font-size: 14px;
}
.game__preview {
left: 50%;
}
.teachers__ava {
height: 95px;
margin-right: 25px;
-ms-flex: 0 0 95px;
flex: 0 0 95px;
}
.schedule__item {
display: block;
margin-bottom: 30px;
}
.schedule__day {
margin-bottom: 10px;
padding: 0;
}
.courses__list {
display: block;
margin: 0;
}
.courses__item {
margin: 0 0 30px;
}
.courses_scroll {
margin: 0 -15px;
overflow: auto;
}
.courses_scroll .courses__list {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.courses_scroll .courses__item {
margin-left: 15px;
-ms-flex: 0 0 220px;
flex: 0 0 220px;
}
.courses_scroll .courses__item:last-child {
padding-right: 15px;
-ms-flex: 0 0 235px;
flex: 0 0 235px;
}
.load {
margin-top: 40px;
}
.load__btn {
padding: 17px 20px 16px;
}
.partners {
margin: 0 -5px -10px;
}
.partners__item {
margin: 0 5px 10px;
-ms-flex: 0 0 calc(33.33% - 10px);
flex: 0 0 calc(33.33% - 10px);
}
.footer__row_first .footer__col:nth-child(4) {
margin-top: 30px;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.footer__row_first .footer__col:nth-child(1) {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
-ms-flex-order: 5;
order: 5;
}
.footer__row_first .footer__col:nth-child(5) {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
-ms-flex-order: 4;
order: 4;
}
.footer__row_second {
width: 100%;
margin-top: 30px;
}
.footer__col {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.footer__contact {
margin: 0;
}
.select__option {
padding: 11px 20px;
font-size: 12px;
color: #191919;
}
.head__right {
margin: 0;
}
.similar__item {
-ms-flex: 0 0 calc(100% - 20px);
flex: 0 0 calc(100% - 20px);
}
.go__btn {
width: auto;
}
.course__info {
display: block;
}
.course__buy {
width: auto;
margin: 20px 0 0;
}
.course__metas {
display: block;
margin-bottom: 25px;
}
.course__metas .course__meta {
margin-bottom: 20px;
}
.course__action .icon {
right: 20px;
}
.course_promo {
padding: 40px 0 45px;
}
.lessons__list {
margin-bottom: 40px;
}
.lessons__item {
margin-bottom: 30px;
}
.lessons__row {
display: block;
}
.lessons__preview {
display: none;
}
.materials__preview {
margin-right: 20px;
-ms-flex: 0 0 100px;
flex: 0 0 100px;
}
.materials__wrap {
-ms-flex: 0 0 calc(100% - 120px);
flex: 0 0 calc(100% - 120px);
}
.examples {
margin: 0 -5px -10px;
}
.examples__item {
margin: 0 5px 10px;
-ms-flex: 0 0 calc(33.33% - 10px);
flex: 0 0 calc(33.33% - 10px);
}
.questions__item_reply {
padding: 0;
}
.questions__item_reply .questions__details {
padding: 10px;
}
.questions__ava {
height: 40px;
margin-right: 10px;
-ms-flex: 0 0 40px;
flex: 0 0 40px;
}
.questions__wrap {
-ms-flex: 0 0 calc(100% - 50px);
flex: 0 0 calc(100% - 50px);
}
.questions__textarea {
height: 64px;
}
.questions__head {
margin-bottom: 5px;
}
.share__title {
margin-bottom: 30px;
}
.share_right .share__list {
-ms-flex-pack: center;
justify-content: center;
}
.buy__row {
-ms-flex-direction: column;
flex-direction: column;
}
.buy__col {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.buy__col:nth-child(2n-1) {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.buy__btn {
width: 100%;
}
.lock {
padding: 30px 020px;
}
.lock__label {
margin-bottom: 40px;
font-size: 10px;
}
.lock__content {
margin-bottom: 40px;
}
.profile {
padding: 0;
}
.profile__btn_edit {
display: none;
}
.profile__row {
display: block;
margin-bottom: 30px;
}
.profile__ava {
width: 140px;
height: 140px;
}
.profile__name {
margin-bottom: 10px;
font-family: 'ProximaNova-Bold', serif;
font-size: 24px;
letter-spacing: 0;
text-transform: none;
}
.profile__foot {
display: block;
}
.tabs__nav {
margin: 0 -15px 30px;
}
.tabs__btn {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.tabs__btn:not(:last-child) {
margin: 0;
}
.confirm__form {
display: block;
}
.confirm__field {
margin-bottom: 20px;
}
.form__title {
font-family: 'ProximaNova-Bold', serif;
font-size: 24px;
line-height: 1.33;
}
.form__content {
margin-bottom: 30px;
}
.form__fieldset {
display: block;
}
.form__field {
margin-bottom: 20px;
}
.transactions__cell:first-child {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
}
.transactions__cell:nth-child(2) {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
}
.transactions__cell:last-child {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.done {
padding: 0;
}
.done__foot {
margin-top: 40px;
}
.author__ava {
height: 60px;
margin-right: 15px;
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
.author__wrap {
-ms-flex: 0 0 calc(100% - 75px);
flex: 0 0 calc(100% - 75px);
}
.author__hi {
margin-bottom: 10px;
}
.author__content {
margin-bottom: 10px;
}
.info {
display: block;
margin-top: 60px;
}
.info__foot {
display: block;
}
.kit__row .kit__photo {
-ms-flex: 0 0 110px;
flex: 0 0 110px;
}
.kit__fieldset {
-ms-flex: 0 0 calc(100% - 130px);
flex: 0 0 calc(100% - 130px);
}
.mobile-hide {
display: none;
}
}
/*# sourceMappingURL=app.css.map */