@charset "utf-8";

/*
фон вёртки — background-color: rgba(255,255,255,0.3);
оранжевый — color: rgba(250,165,69,1.0);
чёрный — color: rgba(16,0,20,1.0);
*/

/* (c) студия "EVERNICE" | evernice.ru */

/* Основные стили */

@media screen {
* {border: 0; padding: 0; margin: 0; box-sizing: border-box;}
*:link, *:hover, *:visited, *:visited:hover, *:focus, * {outline: none !important; /*ie-dummy: expression(this.hideFocus=true); noFocusLine: expression(this.onFocus=this.blur());*/ -webkit-tap-highlight-color: rgba(255,255,255,0.0); -webkit-tap-highlight-color: transparent;}

html {min-height: 100%; display: flex; flex-direction: column; background-color: rgba(16,0,20,1.0);}
body {min-height: 100vh; font-family: 'Montserrat', sans-serif; color: rgba(255,255,255,1.0); font-weight: 300; font-style: normal; text-align: left; position: relative; overflow: visible; display: flex; align-content: center; align-items: center; justify-content: flex-start; flex-direction: column; flex: auto;}

img {font-size: 70%; color: rgba(255,255,255,1.0); display: block;}

a {color: inherit; text-decoration: underline; transition: 0.25s ease;}
a:visited {color: inherit;}
a:hover {color: inherit; text-decoration: none;}

.nobr {white-space: nowrap;}
}

/* Заголовок сайта */

@media screen {
header {width: 100%; max-width: 1400px; max-height: 100vh; max-height: calc( (var(--vh, 1vh) * 100) ); background-image: url(/images/glavnaya_1400.webp); background-position: center bottom; background-repeat: no-repeat; background-size: cover; position: relative; overflow: hidden; display: flex; z-index: 1;}
header:before {padding-top: calc( 100% * ( 860/1400 ) ); display: block; content: ''; z-index: -1;}
}

@media screen and (max-width: 1200px) {
header {background-image: url(/images/glavnaya_1200.webp);}
header:before {padding-top: calc( 100% * ( 730/1200 ) );}
}

@media screen and (max-width: 1024px) {
header {background-image: url(/images/glavnaya_1000.webp);}
header:before {padding-top: calc( 100% * ( 610/1000 ) );}
}

@media screen and (max-width: 800px) {
header {background-image: url(/images/glavnaya_800.webp);}
header:before {padding-top: calc( 100% * ( 490/800 ) );}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
header {background-image: url(/images/glavnaya_1400.png);}
}

/* КОНТЕНТ — общие стили */

@media screen {
main {width: calc( 100% - ( 100% * ( 136/1400 ) )*2 + 20px*2 ); max-width: 1170px; margin: 0 calc( 100% * ( 136/1400 ) ); position: relative; overflow: visible; display: flex; flex-wrap: wrap; flex: auto; z-index: 2;}
main strong {font-weight: 700;}

article {width: 100%; position: relative; overflow: visible; display: flex; flex-direction: column; flex-wrap: wrap;}

section {width: 100%; position: relative; overflow: visible; display: flex; flex-direction: column; flex-wrap: wrap;}
}

/* КОНТЕНТ — вступительный текст */

@media screen {
#vstuplenie {width: calc( 100% - 20px*2 ); margin: calc( ( 100% * ( -160/1400 ) ) + 65px ) 20px 0;}
#vstuplenie > p {font-size: 18px; line-height: 28px; font-weight: 500; text-align: center; margin: -10px 0 -8px;}
}

@media screen and (max-width: 1024px) {
#vstuplenie {margin: calc( ( 100% * ( -160/1400 ) ) + 45px ) 20px 0;}
#vstuplenie > p {font-size: 15px; line-height: 20px; font-weight: 300; margin: -7px 0 -5px;}
}

@media screen and (max-width: 768px) {
#vstuplenie {margin: calc( ( 100% * ( -160/1400 ) ) + 25px ) 20px 0;}
}

/* КОНТЕНТ — вопросы */

@media screen {
#question {margin: 60px 0 0; flex-direction: row; justify-content: center;}

#question > div {border-radius: 14px; padding: 15px 29px; margin: 20px 20px 0; position: relative; overflow: visible; display: flex; justify-content: center; flex-wrap: wrap;}
#question > div:nth-of-type(1), #question > div:nth-of-type(4) {background-color: rgba(250,165,69,1.0);}
#question > div:nth-of-type(2), #question > div:nth-of-type(7) {background-color: rgba(0,216,177,1.0);}
#question > div:nth-of-type(3), #question > div:nth-of-type(9) {background-color: rgba(203,232,61,1.0);}
#question > div:nth-of-type(5), #question > div:nth-of-type(8) {background-color: rgba(255,201,79,1.0);}
#question > div:nth-of-type(6) {background-color: rgba(232,100,58,1.0);}
#question > div > p {font-size: 20px; line-height: 24px; font-weight: 700; color: rgba(16,0,20,0.7); text-align: center; text-transform: uppercase; margin: -5px 0;}

#question > p {width: 100%; font-size: 30px; line-height: 32px; font-weight: 700; color: rgba(250,224,195,1.0); text-align: center; text-transform: uppercase; padding: 40px 0 0; margin: -4px 0 -6px;}
}

@media screen and (max-width: 768px) {
#question {margin: 35px 0 0; flex-direction: column;}

#question > div {padding: 10px 19px; margin: 15px 20px 0;}
#question > div > p {font-size: 16px; line-height: 20px; font-weight: 500; margin: -3px 0 -5px;}

#question > p {font-size: 26px; line-height: 28px; padding: 30px 0 0; margin: -5px 0;}
}

/* КОНТЕНТ — выпуски */

@media screen {
#vypuski {width: calc( 100% - 20px*2 ); margin: 0 20px;}
#vypuski > h2 {font-size: 60px; line-height: 70px; font-weight: 700; color: rgba(250,165,69,1.0); text-align: center; text-transform: uppercase; padding: 30px 0 20px; margin: -14px 0;}

#vypuski > div {width: 100%; margin: 30px 0 0; position: relative; overflow: visible; display: flex; flex-wrap: wrap;}
#vypuski > div > picture {width: 100%; min-width: 200px; max-width: 300px;}
#vypuski > div > picture > img {width: 100%; height: auto; border-radius: 0px 0px 100px 0px;}
#vypuski > div:nth-of-type(1) > picture > img, #vypuski > div:nth-of-type(3) > picture > img {border-radius: 0px 100px 100px 100px;}
#vypuski > div:nth-of-type(2) > picture > img, #vypuski > div:nth-of-type(4) > picture > img {border-radius: 100px 0px 100px 100px;}
#vypuski > div > div {padding: 0 0 0 30px; position: relative; overflow: visible; display: flex; flex-direction: column; flex-wrap: wrap; flex: 1;}
#vypuski > div > div > p:nth-of-type(1) {font-size: 30px; line-height: 32px; font-weight: 700; text-transform: uppercase; padding: 12px 0 0; margin: -4px 0 -6px; z-index: 1;}
#vypuski > div:nth-of-type(1) > div > p:nth-of-type(1) {color: rgba(232,100,58,1.0);}
#vypuski > div:nth-of-type(2) > div > p:nth-of-type(1) {color: rgba(0,216,177,1.0);}
#vypuski > div:nth-of-type(3) > div > p:nth-of-type(1) {color: rgba(255,201,79,1.0);}
#vypuski > div:nth-of-type(4) > div > p:nth-of-type(1) {color: rgba(203,232,61,1.0);}
#vypuski > div > div > p:nth-of-type(2), #vypuski > div > div > p:nth-of-type(4) {font-size: 30px; line-height: 32px; padding: 24px 0 0; font-weight: 500; text-transform: uppercase; margin: -4px 0 -6px; z-index: 2;}
#vypuski > div > div > p:nth-of-type(3), #vypuski > div > div > p:nth-of-type(5) {font-size: 15px; line-height: 20px; padding: 24px 0 0; margin: -7px 0 -5px; z-index: 1;}

#vypuski > div:nth-of-type(1) > picture, #vypuski > div:nth-of-type(3) > picture {order: 2;}
#vypuski > div:nth-of-type(1) > div, #vypuski > div:nth-of-type(3) > div {padding: 0 30px 0 0; order: 1;}
#vypuski > div:nth-of-type(1) > div > p, #vypuski > div:nth-of-type(3) > div > p {text-align: right;}
}

@media screen and (max-width: 768px) {
#vypuski > h2 {font-size: 40px; line-height: 50px; font-weight: 700; padding: 30px 0 0; margin: -11px 0;}

#vypuski > div {align-content: center; align-items: center; flex-direction: column;}
#vypuski > div > div {padding: 0; align-content: center; align-items: center;}
#vypuski > div > div > p {text-align: center;}
#vypuski > div > div > p:nth-of-type(1) {font-size: 26px; line-height: 28px; padding: 12px 0 0; margin: -5px 0;}
#vypuski > div > div > p:nth-of-type(2), #vypuski > div > div > p:nth-of-type(4) {font-size: 26px; line-height: 28px; margin: -5px 0;}

#vypuski > div:nth-of-type(1) > picture, #vypuski > div:nth-of-type(3) > picture {order: 1;}
#vypuski > div:nth-of-type(1) > div, #vypuski > div:nth-of-type(3) > div {padding: 0; align-content: center; align-items: center; order: 2;}
#vypuski > div:nth-of-type(1) > div > p, #vypuski > div:nth-of-type(3) > div > p {text-align: center;}
}

/* Подвал */

@media screen {
footer {width: calc( 100% - ( 100% * ( 136/1400 ) )*2); max-width: 1130px; margin: 100px calc( 100% * ( 136/1400 ) ) 80px; position: relative; overflow: visible; display: flex; flex-direction: column; flex-wrap: wrap;}
footer > h1 {font-size: 60px; line-height: 70px; font-weight: 700; color: rgba(232,100,58,1.0); text-align: center; text-transform: uppercase; margin: -14px 0;}
footer > p:nth-of-type(1) {font-size: 18px; line-height: 28px; font-weight: 500; text-align: center; padding: 18px 0 0; margin: -10px 0 -8px;}
footer > p:nth-of-type(2) {font-size: 30px; line-height: 32px; font-weight: 700; color: rgba(255,201,79,1.0); text-align: center; text-transform: uppercase; padding: 36px 0 0; margin: -4px 0 -6px;}

footer > div {width: 100%; position: relative; overflow: visible; display: flex; justify-content: center; flex-wrap: wrap;}
footer > div > a {font-size: 17px; line-height: 25px; text-decoration: none; border-bottom: none; margin: 18px 10px 0;}
footer > div > a > svg {width: 40px; height: 40px;}
footer > div > a:nth-of-type(1) > svg {fill: rgba(255,0,0,1.0);}
footer > div > a:nth-of-type(2) > svg {fill: rgba(255,255,255,1.0);}
footer > div > a:nth-of-type(3) > svg {fill: rgba(0,119,255,1.0);}
footer > div > a:nth-of-type(4) > svg {fill: rgba(237,130,7,1.0);}
}

@media screen and (max-width: 768px) {
footer {margin: 60px calc( 100% * ( 136/1400 ) );}
footer > h1 {font-size: 40px; line-height: 50px; font-weight: 700; margin: -11px 0;}
footer > p:nth-of-type(1) {font-size: 15px; line-height: 20px; font-weight: 300; margin: -7px 0 -5px;}
}

/* Сервис НАВЕРХ */

@media screen {
#en_scroll_top {position: absolute; right: 90px; display: none; z-index: 99;}
#en_scroll_top > div {width: 40px; height: 40px; border-radius: 40px; background-color: rgba(250,165,69,1.0); position: fixed; bottom: 100px; overflow: hidden; display: flex; align-content: center; align-items: center; justify-content: center; transition: 0.45s ease; cursor: pointer;}
#en_scroll_top > div:hover {background-color: rgba(219,109,67,1.0);}
#en_scroll_top > div > svg {width: 16px; height: 16px; fill: rgba(16,0,20,1.0);}
}

/* Полоса прокрутки */

@media screen {
::-webkit-scrollbar {width: 8px; height: 8px;}
::-webkit-scrollbar-button {width: 0; height: 0; background-image: url(''); background-repeat: no-repeat;}
::-webkit-scrollbar-track {background-color: rgba(16,0,20,1.0);}
::-webkit-scrollbar-track-piece {background-color: transparent;}
::-webkit-scrollbar-thumb {border-radius: 0; -webkit-border-radius: 0; background-color: rgba(250,165,69,1.0);}
::-webkit-scrollbar-corner {background-color: transparent;}
::-webkit-resizer {width: 8px; height: 1px; background-image: url(''); background-repeat: no-repeat;}
}

@media screen and (max-width: 1024px) {
::-webkit-resizer {width: 4px;}
::-webkit-scrollbar {width: 4px; height: 4px;}
}
