@charset "utf-8";

	:root {	--blue: #03f;
			--a_blue: #0080ff;
			--fon: #f2f2f2;
			--border: 1px solid lightblue;
			--Times: "Times New Roman", "Times CY", "Nimbus Roman No9 L", serif;
			--Verdana: Verdana, "Geneva CY", "DejaVu Sans", sans-serif;
			--Georgia: Georgia, "Century Schoolbook L", serif;
			--a_height: 23px;
			--width_menu_mobile: 150px;
			--padding_main: 25px;
			}
/*-----------------------------------------------------------------------------------------------------------------------*/
	
	#content {display: inline-block; margin-left: 20px; line-height: 1.7; padding: 15px 10px 20px var(--padding_main); font-size: 14px; border: var(--border); border-radius: 10px;}
	
	h1 {font-size: 19px; margin-bottom: 20px; font-family: var(--Georgia);}
	h2 {font-size: 18px; margin-top: 30px; margin-bottom: 20px; color: #0080ff; font-family: var(--Georgia);}
	h3 {font-size: 18px; margin-top: 30px; margin-bottom: 20px; font-family: var(--Times); font-style: italic; color: #FF6464; letter-spacing: 0.1em;}
	h4 {font-size: 17px; margin-top: 20px; margin-bottom: 10px; font-family: var(--Times);}
	
	.i {font-family: var(--Times); font-style: italic; letter-spacing: 0.04em;}
	
	.video {position: absolute; display: none; background: #fff; border: 1px solid blue; z-index: 1;}
	#off {position: absolute; color: red; display: none; z-index: 2;}

	footer {background: var(--fon);}
	
	/*-------------------------------------------------------------------------------------*/
	
	/*	скрытые формулы библиотеки MathML	*/
	
	.math-hidden {position: absolute; width: 0; height: 0; overflow: hidden; opacity: 0; pointer-events: none;}
	.math-red {color: red;}
	.math-orange {color: orange;}
	
	/*-------------------------------------------------------------------------------------*/
	
	/*	выделенные блоки для закрепления материала	*/
	
	.section-prompt {display: inline-block; margin: 30px 0 30px 5%; border: 5px solid transparent; border-radius: 40px; padding: 20px; background: linear-gradient(white, white) padding-box, linear-gradient(90deg, #00c6ff, #0072ff, #8a2be2) border-box;}
		
	.title-prompt {font-size: 1.2em; color: red; font-weight: bold; text-align: center;}
	.prompt {font-size: 1.2em;}
	.prompt math {font-size: 1.2em;}
	

@media screen and (min-width : 1030px) and (max-width : 1200px) {			/*	 стили контента	*/
	
	#content {font-size: 16px;}
	
	h3 {font-size: 19px;}
}

@media screen and (max-width : 1029.9px) {			/*	 стили контента	*/
	
	#content {margin: 0; padding: 20px 10px 20px 20px; display: block; font-size: 18px; border: none;}
	
	h1 {font-size: 21px;}
	h2 {font-size: 20px;}
	h3 {font-size: 21px;}
	h4 {font-size: 20px;}
}

@media screen and (max-width : 724px) {			/*	 стили контента	*/
	
	#content {font-size: 17px;}
	
	h1 {font-size: 21px;}
	h2 {font-size: 20px;}
	h3 {font-size: 20px;}
	h4 {font-size: 19px;}
}

@media screen and (max-width : 600px) {			/*	 стили контента	*/

	
}

@media screen and (max-width : 500px) {			/*	 стили контента	*/

	#content {padding: 20px 5px 20px 10px; font-size: 15px;}
	
	h1 {font-size: 19px;}
	h2 {font-size: 18px;}
	h3 {font-size: 18px;}
	h4 {font-size: 17px;}
}

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

	#content {font-size: 14px;}
	
	h1 {font-size: 18px;}
	h2 {font-size: 17px;}
	h3 {font-size: 17px;}
	h4 {font-size: 16px;}
}

@media (any-hover: hover) {

	#off:hover {cursor: pointer;}
}

/*-----------------------------------------------------------------------------------------------------------------------*/

.bold {font-weight: bold;}

.middle {vertical-align: middle;}

.left5 {margin-left: 5px;}
.left10 {margin-left: 10px;}
.left20 {margin-left: 20px;}
.left30 {margin-left: 30px;}
.leftMinus5 {margin-left: -5px;}
.leftMinus10 {margin-left: -10px;}

.right5 {margin-right: 5px;}
.right10 {margin-right: 10px;}
.right15 {margin-right: 15px;}
.right20 {margin-right: 20px;}
.right30 {margin-right: 30px;}

.top5 {margin-top: 5px;}
.top10 {margin-top: 10px;}
.top15 {margin-top: 15px;}
.top20 {margin-top: 20px;}
.top25 {margin-top: 25px;}
.top30 {margin-top: 30px;}
/*--------------------------------------*/
.bottom5 {margin-bottom: 5px;}
.bottom10 {margin-bottom: 10px;}
.bottom15 {margin-bottom: 15px;}
.bottom20 {margin-bottom: 20px;}


.line-height30 {line-height: 30px;}
.line-height35 {line-height: 35px;}
.line-height40 {line-height: 40px;}

.inline-block {display: inline-block;}
/*--------------------------------------*/
.clear10 {clear: both; height: 10px;}

.up1 { margin-top: -1px;}
.up2 { margin-top: -2px;}
.up3 { margin-top: -3px;}
.up4 { margin-top: -4px;}
.up5 { margin-top: -5px;}
.up6 { margin-top: -6px;}
.up7 { margin-top: -7px;}
.up8 { margin-top: -8px;}
.up9 { margin-top: -9px;}
.up10 { margin-top: -10px;}
.up14 { margin-top: -14px;}

.down3 { margin-bottom: -3px;}
.down5 { margin-bottom: -5px;}
