@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 100;
    src: url(/fonts/Inter/Inter-Thin.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 100;
    src: url(/fonts/Inter/Inter-ThinItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 200;
    src: url(/fonts/Inter/Inter-ExtraLight.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 200;
    src: url(/fonts/Inter/Inter-ExtraLightItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 300;
    src: url(/fonts/Inter/Inter-Light.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 300;
    src: url(/fonts/Inter/Inter-LightItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 400;
    src: url(/fonts/Inter/Inter-Regular.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 400;
    src: url(/fonts/Inter/Inter-Italic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 500;
    src: url(/fonts/Inter/Inter-Medium.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 500;
    src: url(/fonts/Inter/Inter-MediumItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 600;
    src: url(/fonts/Inter/Inter-SemiBold.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 600;
    src: url(/fonts/Inter/Inter-SemiBoldItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 700;
    src: url(/fonts/Inter/Inter-Bold.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 700;
    src: url(/fonts/Inter/Inter-BoldItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 800;
    src: url(/fonts/Inter/Inter-ExtraBold.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 800;
    src: url(/fonts/Inter/Inter-ExtraBoldItalic.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: normal;
    font-weight: 900;
    src: url(/fonts/Inter/Inter-Black.woff2) format("woff2")
}

@font-face {
    font-display: swap;
    font-family: Inter;
    font-style: italic;
    font-weight: 900;
    src: url(/fonts/Inter/Inter-BlackItalic.woff2) format("woff2")
}

:root
{
    --black: #183B59; /*#164F6D;*/
    --dark:#183B59; /*#3C3C3B;*/
    --dark2:#183B59;
    --blue: #0C6ED6;
    --white: #ffffff;
   	--orange:#FF9432;
   	--light:#F1F4FA;

   	--h0: 700 3.5rem/120% "Inter", sans-serif;
    --h1: 800 3rem/120% "Inter", sans-serif;
    --h2big:800 2.67rem/120% "Inter", sans-serif;
    --h2:800 2.2rem/120% "Inter", sans-serif;
    --h3:700 1.6rem/120% "Inter", sans-serif;
    --h3thin:400 1.6rem/120% "Inter", sans-serif;
    --p: 400 1rem/120% "Inter", sans-serif;
    --ps: 400 0.93rem/1.8rem "Inter", sans-serif;
    --pb: 400 1.07rem/125% "Inter", sans-serif;
    --small: 400 0.67rem/120% "Inter", sans-serif;
}


body,html
{	
	padding:0;
	margin: 0;
	min-height: 100vh;
	background: #fff;
	font:var(--p);
	font-size: 15px;
	color: var(--black);
	-webkit-font-smoothing: antialiased;
}
body
{
}
a
{
	text-decoration: none;
	color: var(--black);
}
div,li,a,p,span 
{
	position: relative;
	box-sizing: border-box;
}
.shadow
{
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 200;
	position: fixed;
	top:0;
	left: 0;
	right: 0;
	bottom:0;
	background-color: rgba(0, 51, 86, 0.5);
}
.window
{
	width: 67%;
	box-shadow: 4px 6px 20px 0px rgba(0, 0, 0, 0.25);
	z-index: 201;
	background-color: var(--white);
	padding:3.2rem 1.6rem 4.27rem;
	border-radius: 2rem;
	line-height: 150%;
	color: var(--dark2);
	max-height: 90vh;
}
.window .title
{
	font:var(--h3);
	color: var(--blue);
}
.window  .blue-button
{
	background-color: var(--blue);
	font-size: 1.33rem;
	color: var(--white);
	box-shadow: none;
	transition: all 0.3s ease;
	width: 13.6rem;
}
.window .content
{
	overflow: auto;
	max-height: calc(90vh - 7.47rem);
}
.window .text
{
	margin:2.67rem 0;
}
.line-with-button
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: 0.5rem;
}
.line-with-button p
{
	max-width: 20rem;
}
.window .close
{
	display: block;
	position: absolute;
	width: 2.14rem;
	padding:0.5rem;
	top:1.47rem;
	right: 1.67rem;
	transition: all 0.3s ease;
}
.window .close:hover
{
	transform: scale(1.2);
}
.window  .blue-button:hover
{
	transform: scale(1.03);
}
h1
{
	font:var(--h1);
	color: var(--blue);
	margin: 0;
	padding: 0;
}
img
{
	max-width: 100%;
}
.header
{
	position: fixed;
	top:0;
	left:0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding:0.6rem 1.5rem;
	gap:5rem;
	z-index: 100;
	transition: all 0.3s ease;
	background: transparent;
}
.logo
{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap:0.73rem;
}
.logo img
{
	height: 2.65rem;
	transition: all 0.3s ease;
}

.logo .l-white
{
	display: none;
}

.logo.white .l-color
{
	display: none;
}

.logo.white .l-white
{
	display: block;
}

.open .logo.white .l-white
{
	display: none;
}

.open .logo.white .l-color
{
	display: block;
}

.menu-icon
{
	display: none;
	width: 3.4rem;
}
.header.scrolled .menu-icon
{
	display: block;
}
.menu__body a
{
	text-transform: uppercase;
	font:var(--small);
	white-space: nowrap;
}
.menu__body a:before
{
	transform: scale(0);
}
.menu__body a:hover:before, .menu__body a.selected:before
{
	content: "";
	position: absolute;
	bottom: -5px;
	right: 0;
	left: 0;
	width: 100%;
	height: 2px;
	transform: scale(1);
	background-color: var(--orange);
	transition: all 0.3s ease;
}
.menu__body, .menu
{
	display: flex;
	align-items: center;
	gap:1rem;
	transition: all 0.3s ease;
}
.header.scrolled 
{
	padding-left:0.6rem;
}
.header.scrolled .logo>img.l-text
{
	opacity: 0;
}
.header.scrolled .menu__body
{
	opacity: 0;
	transform: translateX(150%);
}
.header.scrolled.open
{
	background: var(--white);
	border-bottom: 1px solid var(--light);
}
.header.scrolled.open .menu__body
{
	transform:  translateX(0);
	opacity: 1;
}
.page
{
	padding-top: 4rem;
	min-height: 100vh;
}
.first-page
{
	display: flex;
	flex-direction: column;
	background-color:rgba(212, 255, 252, 0.3);
	background-image: url('images/fp_decor.svg');
	background-position: center bottom;
	background-size: cover;
	padding-top: 3.5rem;
}
.first-page-content
{
	width: 60%; 
	padding-left:8rem;
	padding-bottom: 2rem;
	padding-top: 2rem;
	z-index: 3;
	display: flex;
	margin:auto 0;
	flex-direction: column;
	gap:0.7rem;
	justify-content: center;
	align-items: flex-start;
}
.first-page-content>p
{
	margin: 0;
	padding: 0;
	max-width: 35rem;
}
.fp-rectangle
{
	position: absolute;
	bottom: 0;
	right: 0;
	height: 100%;
	z-index: 1;
}
.fp-image
{
	position: absolute;
	left: 50%;
	bottom:0;
	width:46%;
	z-index: 2;
}
.buttons-line
{
	display: flex;
	gap:1.6rem;
	margin-top: 1rem;
}
.button
{
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 1.3rem;
	box-shadow: 0.27rem 0.4rem 0.47rem 0px rgba(0, 0, 0, 0.15);
	text-transform: uppercase;
	color: #FFF;
	text-align: center;
	width: 17rem;
	height: 4.27rem;
	font-weight: 500;
	padding:0 0.5rem;
}
.button:hover
{
	box-shadow: none;
}
.button.orange-gradient
{
	background: linear-gradient(90deg, #FFB546 0%, #FF790B 100%);
}
.button.blue-gradient
{
	background: linear-gradient(90deg, #60B5A2 0%, #3F88FF 100%);
}
.slides>div
{
	width: 30rem;
	height: 12.5rem;
	margin: 1.17rem 0 2.03rem;
	border-radius: 1.3rem;
	background: rgba(255, 255, 255, 0.75);
	box-shadow:  0.27rem 0.4rem 0.47rem 0px rgba(0, 0, 0, 0.15);
}
.slides>div, .slides>div .slide_text
{
	padding: 1.87rem 3.5rem 1.87rem 2.73rem;
}
.slides>div .slide_text
{
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	opacity: 0;
	transition: all 0.3s ease;
}
.slides>div .slide_text.visible
{
	opacity: 1;
}
.slides>div .title
{
	font: var(--h3);
	color: var(--blue);
}
.slides>div p 
{
	margin: 1rem 0 0;
}	
.slides>a 
{
	position: absolute;
	top:50%;
	margin-top:-1rem;
	height: 1rem;
}
.slides>a.left
{
	left:-2.4rem;
}
.slides>a.right
{
	right:-2.4rem;
}
.second-page, .third-page, .fourth-page, .fifth-page
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.for-whom
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap:6.67rem;
}
.for-whom .for-whom-item
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap:1.5rem;
}
.for-whom-item ul
{
	display: grid;
	flex-direction: column;
	gap:0.5rem;
}
.for-whom .for-whom-item>.image
{
	width: 8.67rem;
	height: 10rem;
	display: flex;
	align-items: flex-end;
}
.for-whom .for-whom-item>.image>img
{
	display: block;
	width: 100%;
}
.for-whom .for-whom-item .title 
{
	font: var(--h2);
	width: 100%;
	text-align: left;
	color:var(--blue);
}
.for-whom .for-whom-item .text
{
	width: 100%;
	text-align: left;
}
.for-whom .for-whom-item .text>p:first-child
{
	margin-top:0;
}
.text>ul
{
	list-style-type: none;
	margin-left: 1.5rem;
	padding: 0;
}
.text>ul>li
{
	display: flex;
	justify-content: flex-start;
}
.text>ul>li:before
{
	position: absolute;
	top:0;
	left:-1.5rem;
	content:'—';
	color:var(--blue);
}
.third-page
{
	flex-direction: column;
	background-color: #F2FFFE;
	color:var(--dark);
	padding-top:5.8rem;
	padding-bottom:4.13rem;
	gap:1rem;
	font:var(--ps);
}
h2
{
	font: var(--h2);
}
.third-page
{
	margin: 0 0 2.13rem;
}
.third-page .title
{
	font: var(--h3);
	margin-bottom: 2.13rem;
}
.third-page .macbook
{
	display: block;
	margin-top:2rem;
}
.columns2
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 3rem;
}
.columns2.dop
{
	position: relative;
	margin-top:1rem;
	padding-top:4.13rem;
	border-top:1px solid #F1F4FA;
}
.columns2.dop div:before
{
	content: '';
	position: absolute;
	display: block;
	top:-1.8rem;
	right:-0.5rem;
	width: 10rem;
	height: 10rem;
	background-size: cover;
	background-repeat:no-repeat;
	background-position: center center;
}
.columns2.dop div.fc p
{
	width:90%;
}
.columns2.dop div.fc:before
{
	background-image:url(/images/decor1.svg);
}
.columns2.dop div.sc:before
{
	background-image:url(/images/devor2.svg);
}
.fourth-page .columns2
{
	color: var(--dark2);
}
.fourth-page 
{
	flex-direction: column;
}
.main-numbers-block>span
{
	display: block;
}
.main-numbers-block .title
{
	font: var(--h2big);
	margin:0.5rem 0 1rem;
	color: var(--blue);
}
.main-numbers-block .for_classes
{
	margin-top:1.5rem;
	font: var(--h3thin);
}
.four-numbers-blocks
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid:0.5rem;
}
.four-numbers-blocks>div
{
	padding:2.2rem 1.6rem 2rem 0;
}
.four-numbers-blocks>div .title
{
	color: var(--blue);
	font:var(--h2);
}
.fon-numbers-block
{
	display: block;
	margin-top: -2rem;
	color: rgba(12, 110, 214, 0.1);
	width: 100%;
	font:900 4.27rem/100% "Inter", sans-serif;
}
.fon-numbers-block .title
{
	display: block;
	font:900 6.4rem/100% "Inter", sans-serif;
}
.seventh-page
{
	color: var(--dark2);
	padding: 8rem 11rem 4rem;
}
.seventh-page .columns3
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap:4.3rem;
	margin-bottom: 8rem;
}
.link-block
{

}
.link-block .title
{
	font: var(--h3);
	line-height: 133%;
}
.link-block a, .window .text a
{
	display: inline;
	/*text-decoration: underline solid var(--blue);
	text-decoration-thickness: 2px;*/
	border-bottom: 2px solid var(--blue);
	color: var(--dark2);
}
.link-block a
{
	padding-right: 0.5em;
}
.link-block li a
{
	white-space: nowrap;
}
.faq-list .content a
{
	border-bottom: 2px solid var(--orange);
	color: var(--dark);
}
.link-block a:hover
{
	border-bottom-width: 4px;
}
.faq-list .content a:hover, .window .text a:hover
{
	border-bottom-width: 3px;
}
.link-block a:after, .faq-list .content a:after
{
	content: '';
	/*position: absolute;
	display: block;
	bottom:0.1em;
	right:-1.5em;*/
	position: relative;
	display: inline-block;
	width: 0.5em;
	height: 0.5em;
	margin-left:0.5em;
	margin-right: -1.5em;
	background: url(/images/link_arrow.svg) center center no-repeat;
	background-size: contain;
}
.faq-list .content a:after
{
	margin-right:-1rem;
}
.link-block .num
{
	display: block;
	font:900 6.4rem/100% "Inter", sans-serif;
	position: absolute;
	top:-2.5rem;
	right:0;
	color: rgba(12, 110, 214, 0.1);
}
.link-block ul
{
	display: flex;
	flex-direction: column;
	gap:0.8rem;
	margin-top:2rem;
}
.link-block ul li 
{
	height:1.5rem;
}
.name-page
{
	display: block;
	position: absolute;
	top:1.6rem;
	left:0;
	right:0;
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	font:var(--small);
	color: var(--dark2);
}
.eighth-page
{
	padding: 6rem 8rem 11rem 8rem;
	display: grid;
	color: var(--dark);
}
.faq-divs
{
	display: grid;
	grid-template-columns: 3fr 5fr;
}
.faq-text .desc-top
{
	font: var(--small);
	font-style: italic;
	text-transform: uppercase;
	font-weight: 300;
}
.faq-text p
{
	font:var(--pb);
	max-width: 23rem;
}
.faq-text .contacts 
{
	font: var(--ps);
}
.faq-text .contacts a
{
	color: var(--dark);
}
.faq-text .contacts div:nth-child(3)
{
	margin-top:0.5rem;
}
.faq-text .contacts i
{
	font:var(--small);
	font-weight: 300;
	margin-bottom:-0.1rem;
}


.faq-list
{
	margin-top: 8rem;
	border-top:1px solid var(--light);
}
.faq-list>div
{
	padding:2rem 0;
	border-bottom:1px solid var(--light);
}
.faq-list .question-line
{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.faq-list .question-line .title
{
	font-weight: 600;
	color: var(--dark);
}
.faq-list .question-line .plus-minus
{
	display: flex;
	position: relative;
	width: 1.6rem;
  	height: 1.6rem;
  	flex: none;
}
.faq-list .question-line .plus-minus:before
{
	content: '';
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
  	top: 0;
  	left: 0;
  	width: 100%;
  	height: 100%;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	background-image: url(/images/plus.svg);
}
.faq-list .selected .question-line  .plus-minus:before
{
	background-image: url(/images/minus.svg);
}
.faq-list>div p 
{
	display: none;
}
.faq-list>div.selected p
{
	display: block;
}

.sixth-page
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	color:var(--white);
	padding:4rem 7.5rem;
	background-image: linear-gradient(148deg,#ffb546,#ff790b);
	overflow: hidden;
}
.sixth-page:after
{
	background-image: url(/images/orange-bg.svg);
	background-repeat: repeat;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.5;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
	background-size: 40px auto;
}
.video-collections__decor {
opacity: 0.3;
pointer-events: none;
position: absolute;
}
.video-collections__decor-1 {
left: 55%;
top: -11.8rem;
width: 13.2rem;
}
.video-collections__decor-2 {
right: -10.6rem;
top: -4.4rem;
width: 14.8rem;
}
.video-collections__logos 
{
	align-items: center;
	display: flex;
	position: relative;
	z-index: 1;
}
.video-collections__logo 
{
	border-right: 1px solid #fff;
	height: 2.15rem;
	padding: 0 1.6rem;
	width: auto;
}
.video-collections__logo:first-child {
padding-left: 0;
}
.video-collections__logo:last-child {
border-right: 0;
padding-right: 0;
}
.video-collections__items {
	align-items: flex-start;
	display: flex;
	flex-direction: column;
	margin-bottom: 4.3rem;
	position: relative;
	z-index: 1;
}
.video-collections__item 
{
	background-color: #fff;
	border-radius: 0.5rem;
	color: var(--dark);
	margin-bottom: 0.65rem;
	padding: 0.5rem 1rem;
}
.video-collections__controls {
	align-items: center;
	cursor: pointer;
	display: flex;
	position: relative;
	z-index: 1;
}
.video-collections__controls-btn {
	display: flex;
	align-items: center;
	background-color: #fff3;
	border: 1px solid #fff;
	border-radius: 0.5rem;
	color: #fff;
	font-size: 2rem;
	margin-right: 0.65rem;
	padding: 0.5rem 1.5rem;
}
.video-collections__controls-icon,.video-collections__controls-btn {
	transition: all 0.3s ease;
height: 3.6rem;
}
.video-collections__controls:hover .video-collections__controls-icon,.video-collections__controls:hover .video-collections__controls-btn
{
	transform: scale(1.03);
}
.video-collections__illustration {
	bottom: -27vw;
	position: absolute;
	right: -7.5rem;
	width: 52vw;
	z-index: 1;
}
.fifth-page
{
	display: flex;
	flex-direction: column;
	background: linear-gradient(180deg, #0288BC 0%, #01BAED 100%);
	color:var(--white);
	padding-left:10rem;
	padding-right:10rem;
}
.fifth-page:after 
{
	background-image: url(/images/online-lessons-bg.svg);
	background-repeat: repeat;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.1;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}
.online-lessons, .video-collections
{
	width: 100%;
	height: 100%;
	z-index: 2;
	flex:1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}
/*.video-collections
{
	justify-content: flex-start;
}*/
.fifth-page a
{
	color:var(--white);
	transition: all 0.3s ease;
}
.fifth-page a:hover
{
	transform: scale(1.05);
}
.online-lessons__item-btn:hover
{
	transform: scale(1.01);
}
.online-lessons__row, .online-lessons__logos
{
	align-items: center;
	display: flex;
}
.online-lessons__row
{
	justify-content: space-between;
	width: 100%
}
.online-lessons__logos
{
	gap:4rem;
}
.online-lessons__logo
{
	width: 10rem;
}
.online-lessons__logo.cok-logo
{
	width: 11.15rem;
}
.online-lessons__title, .video-collections__title
{
	font:var(--h0);
	width:79%;
	margin:2.5rem 0 3.5rem;
}
.video-collections__title
{
	font-weight: 900;
}
.video-collections__title span
{
	background-image: linear-gradient(296deg,#aee682,#408dfd);
	border-radius: 4.5rem;
	padding: 0 1.6rem 0.25rem;
}
.online-lessons__illustration
{
	display: block;
	position: absolute;
	bottom: -4rem;
	right:-6.5rem;
}

.online-lessons__items
{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	max-width: 43.5rem;
	grid-gap: 0.5rem;
}
.online-lessons__link, .online-lessons__item, .online-lessons__item-btn
{
	-webkit-backdrop-filter: blur(2.5px);
	backdrop-filter: blur(2.5px);
	border-radius: 0.5rem;
}
.online-lessons__link {
	background-color: #009acd;
	font-size: 1.3rem;
	padding: 0 1.4rem;
	z-index: 2;
	height: 2.6rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.online-lessons__item {
	background-color: #0064884d;
	border: 1px solid #ffffff4d;
	padding: 1.4rem 1.1rem;
}
.online-lessons__item-btn {
	background-color: #ff7b30;
	font:700 1.3rem/1.5rem "Inter", sans-serif;
	margin-bottom: 0.8rem;
	padding: 1rem;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}
.online-lessons__item-simple
{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}
.online-lessons__item-more {
	font:400 1.1rem/1.4rem "Inter", sans-serif;
	margin-left: 2.6rem;
	max-width: 14rem;
}
.online-lessons__item-icon {
margin-bottom: 13px;
max-width: 42px;
}
.online-lessons__item-title {
font-size: 25px;
line-height: 30px;
}


.forth-link.link-block p
{
	margin:1.6rem 0 0;
}
.video-slides
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin:3rem -2rem 0;
}
.video-slides>a
{
	width: 2rem;
	flex: none;
	display: flex;
}
.video-slides>a>img
{
	width: 1.4rem;
}

.video-slides>a.right
{
	justify-content: flex-end;
}
.video-slides-div
{
	flex: none;
	width: calc(100vw - 22rem);
	overflow: hidden;
}
.video-slides-div>div 
{
	display: flex;
	gap:1rem;
}
.video-slides-div>div>a
{
	flex: none;
	width: calc((100vw - 24rem) / 3);
	height:calc((100vw - 24rem)*0.5625 / 3);
	background-size: contain;
	border-radius: 0.8rem;
}
.video-slides-div>div>a>img 
{
	display: block;
	position: absolute;
	top:50%;
	left:50%;
	width:3.7rem;
	height: 3.7rem;
	margin-top:-1.80rem;
	margin-left:-1.85rem;
}


.footer
{
	position: absolute;
	bottom:0;
	left:0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap:4.6rem;
	padding: 2rem 2rem 2.3rem;
}
.footer a.nacproekti 
{
	width: 5.2rem;
}
.footer a.prosvet
{
	width: 10.1rem;
}

.rem
{
	display: block;
	position: absolute;
	width: 1rem;
	height: 1rem;
	pointer-events: none;
	opacity: 0;
}



@media all and (min-width:1551px)
{
	.menu__body a
	{
		font-size: 0.67rem;
	}
}

@media all and (min-width:1451px)
{
	body,html{font-size: 20px;}

	.menu__body a
	{
		font-size: 0.6rem;
	}
	.seventh-page
	{
		padding: 8rem 7.4rem 4rem;
	}
}
@media all and (max-width:1450px)
{
	body,html{font-size: 15px;}
}
@media all and (max-width:1260px)
{
}
@media all and (max-width:768px)
{
	body,html {font-size: 14px;}
}
@media all and (min-width:1001px)
{
	.second-page, .third-page, .fourth-page, .fifth-page
	{
		padding:4rem 8rem;
	}
	.second-page
	{
		background: url('images/books_decor.svg') bottom right no-repeat;
		background-size: 93% auto;
	}
	.page:before
	{
		content: '';
		display: block;
		position: absolute;
		top:0;
		bottom: 0;
		width: 1px;
		left:4.6rem;
		background-color: var(--light);
	}
	.page.eighth-page:before, .page.first-page:before
	{
		background: transparent;
	}
	.first-page-content>.fp-image,
	.slide-counter,
	.header .close-menu
	{
		display: none;
	}
	.menu
	{
		overflow: hidden;
		padding: 0.5rem 0;
	}

}
@media all and (max-width:1000px)
{
	:root
	{
		--h1: 700 2.1rem/120% "Inter", sans-serif;
		--h2big:800 2.14rem/120% "Inter", sans-serif;
	    --h2:800 1.7rem/130% "Inter", sans-serif;
	    --h3:700 1.43rem/120% "Inter", sans-serif;
	    --h3thin:400 1.43rem/120% "Inter", sans-serif;
	}

	.page
	{
		padding:4rem 1rem;
	}

	.menu__body
	{
		display: none;
	}

	.menu-icon
	{
		display: block;
	}

	.menu-icon:before
	{
		content: "меню";
		transform: rotate(-90deg);
		position: absolute;
		left: -2rem;
		top: 0.5rem;
		transform-origin: center;
		transition: all 0.3s ease;
		font-weight: 800;
	}

	.header.open .menu-icon:before
	{
		transform: rotate(-360deg);
		left: 4rem;
		font-size: 1.76rem;
	}

	.scrolled .logo.white .l-white
	{
		display: none;
	}

	.scrolled .logo.white .l-color
	{
		display: block;
	}

	.header.scrolled .logo>img.l-text
	{
		opacity: 1;
	}

	.header .menu, .header
	{
		transition: all 0.3s ease;
	}

	.header.open, .header.open.scrolled
	{
		height: 100vh;
		align-items: flex-start;
		background-color: rgba(212, 255, 252, 1);
		background-image: url('images/mobile_bg.png');
		background-position: center bottom;
		background-size: cover;
	}

	.header.open .menu__body
	{
		position: absolute;
		left: 0;
		top: 3.7rem;
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		gap: 2rem;
		padding-top: 2rem;
		width: calc(100vw - 2rem);
	}

	.header.open .menu__body a
	{
		font-size: 1rem;

	}

	.header.open .menu
	{
		left: 1rem;
		position: absolute;
	}	

	.header
	{
		padding: 0.6rem 1rem;
	}

	.header .close-menu
	{
		display: none;
	}

	.header.open .close-menu
	{
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 0.4rem;
	}
	.header .logo
	{
		transition: all 0.3s ease;
	}
	.header.open .logo
	{
		overflow: hidden;
		width: 0;
	}

	.for-whom 
	{
		display: flex;
		flex-direction: column;
		gap: 3.7rem;
	}

	.first-page
	{
		padding-top:6rem;
		padding-bottom: 2rem;
		background:url('images/bg_first_page_mobile.png') center center no-repeat;
		background-size: cover;
	}

	.fp-rectangle
	{
		display: none;
	}
	.first-page-content
	{
		padding-bottom: 0;
	}
	.first-page>.fp-image {display: none;}
	.first-page-content
	{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-areas: "title" "buttons" "image" "text" "slides";
		width: 100%;
		justify-content: initial;
		align-items: initial;
		padding-left: 0;
		grid-gap: 2rem;
	}


	.first-page-content>h1 {grid-area: title;}
	.first-page-content>p {grid-area: text; line-height: 1.7rem}
	.first-page-content>.buttons-line {grid-area: buttons;}
	.first-page-content>.slides {grid-area: slides;}
	.first-page-content>.fp-image {
		grid-area: image; 
		display: block; 
		position: relative;
		width: 100%;
		left: initial;
	}

	.first-page-content>.buttons-line
	{
		flex-direction: column-reverse;
	}

	.first-page-content>.buttons-line>a
	{
		width: initial;
	}

	.first-page-content>.slides>a
	{
		display: none;
	}
	.button
	{
		height: 4.57rem;
	}
	.buttons-line
	{
		gap:1.14rem;
	}

	.slide-counter
	{
		display: flex;
		gap: 0.5rem;
		justify-content: flex-end;
		align-items: center;
		position: absolute;
		right: 1em;
		bottom: 1.8rem;
	}

	.slide-counter>a img
	{
		width: 0.5rem;
		height: auto;
	}

	.first-page-content>.slides>div
	{
		width: calc(100vw - 2rem);
		height: 15rem;
	}

	.slides>div, .slides>div .slide_text
	{
		padding: 1.87rem 1rem 4.37rem;
	}
	.slides>div
	{
		padding-top:0;
		margin-top: 0;
	}
	.for-whom .for-whom-item>.image
	{
		width: 9.15rem;
		height: 9.72rem;
	}
	.columns2
	{
		grid-template-columns: repeat(1, 1fr);
		grid-gap:0;
	}
	.columns2.dop
	{
		grid-gap: 3rem;
	}
	.fourth-page.page, .seventh-page.page
	{
		padding-top: 6rem;
	}
	.four-numbers-blocks,.fon-numbers-block
	{
		margin-top: 2.28rem;
	}
	.four-numbers-blocks>div 
	{
		padding: 1rem 2rem 1rem 0;
	}
	.fon-numbers-block .title 
	{	
		font: 900 4.4rem/100% "Inter", sans-serif;
	}
	.fon-numbers-block
	{	
		font: 900 2.2rem/100% "Inter", sans-serif;
	}
	.online-lessons__title, .video-collections__title
	{
		font: var(--h1);
		width: 100%;
		margin: 2.5rem 0 1.5rem;
	}
	.video-collections__title
	{
		font-size: 2.8rem;
	}
	.online-lessons__illustration
	{
		display: none;
	}
	.online-lessons__link 
	{
		position: absolute;
		right: -1rem;
		top: -4rem;
	}
	.online-lessons__items
	{
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 1rem;
	}
	.online-lessons__item-title
	{
		font-size: 1.28rem;
	}
	.header.scrolled
	{
		background-color: var(--white);
	}
	.online-lessons__logos {
		gap: 2rem;
	}
	.online-lessons__logo {
	width: 8rem;
	}
	.online-lessons__logo.cok-logo {
	width: 9rem;
	}
	.video-collections__logo {
	height: 2.1rem;
	padding: 0 1.1rem;
	}
	.video-collections__illustration {
	display: block;
	margin-top: 4rem;
	margin-left: 5%;
	margin-right: auto;
	margin-bottom: -50%;
	position: static;
	width: 90%;
	}
	.video-collections__items
	{
		margin-bottom: 2rem;
	}
	.seventh-page .columns3
	{
		grid-template-columns: repeat(1, 1fr);
		grid-gap: 4rem;
		margin-bottom: 4.5rem;
	}
	.link-block .title
	{
		line-height: 160%;
	}
	.link-block ul
	{
		margin-top:1.5rem;
	}
	.forth-link.link-block p
	{
		line-height: 171%;
	}
	.faq-divs
	{
		grid-template-columns: repeat(1, 1fr);
	}
	.eighth-page.page
	{
		padding: 6rem 1rem 10rem;
	}
	.faq-list
	{
		margin-top: 4rem;
	}
	.window
	{
		padding:2rem 1rem;
		width: calc(100% - 2rem);
	}
	.window .title 
	{
		display: block;
		width: 80%;
	}
	.window .text
	{
		margin:2rem 0;
	}
	.line-with-button
	{
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		justify-content: flex-start;
	}

	.video-slides
	{
		margin: 3rem 0 0;
	}

	.video-slides-div
	{
		width: calc(100vw - 6rem);
	}

	.video-slides-div>div>a
	{
		width: calc((100vw - 6rem));
		height: calc((100vw - 6rem)*0.5625);
		background-repeat: no-repeat;
	}

}

@media all and (min-width:1860px)
{
	body,html{font-size: 22px;}
}
@media all and (min-width:2000px)
{
	body,html{font-size: 24px;}
}
@media all and (min-width:2400px)
{
	body,html{font-size: 26px;}
}