@charset "utf-8";
/* Цвета https://colorscheme.ru/html-colors.html */
/* Как сделать тёмную тему для сайта https://skillbox.ru/media/code/kak_sdelat_tyemnuyu_temu_dlya_sayta/ */
/* Макет 2-х колоночный, прижат футер флексами http://htmlbook.ru/blog/prizhatyy-podval-5-sposobov */

html, body {
    height: 100%;
   }

body {
	color: #111111;
	font-family: Arial, "Trebuchet MS", Helvetica, Tahoma, Geneva, Verdana, sans-serif;
	font-size: 18px;
	margin: 0px;
	background-image: url(img/diz/bg.jpg) repeat;
    background-color: #f4f4f4;
    display: flex;
    flex-direction: column;
	}
	
.main-div {
	max-width: 1004px;
	margin: 0 auto;
	padding: 0 10px;
	border: 0px solid #000;
	}
	
.header-div {
	border-bottom: 0px solid #000;
	}
	
.header-div img {
	display: block;
	}
	
.menu-div {
	background-color: LightYellow;
	padding: 10px 10px;
	border: 1px solid Crimson;
    border-radius: 5px;
	}
	
/* Цвета по словам https://colorscheme.ru/html-colors.html */

a:link {
	color: Red;
	text-decoration: none;
	}
    
a:visited {
	color: DarkOrange;
	text-decoration: none;
	}	

a:hover {
	color: DarkRed;
	text-decoration: none;
    border-radius: 5px;
	}

.menu-div a:link {
	color: Red;
	text-decoration: none;
    margin-right: 10px;
	}
	
.menu-div a:visited {
	color: DarkOrange;
	text-decoration: none;
	}	
	
.menu-div a:hover {
	color: DarkRed;
	text-decoration: none;
    border-radius: 5px;
	}
		
.content-div {
	padding: 0 0px;
    background-color: #f4f4f4;
	}
	
.footer-div {
	padding: 10px 0;
	border-top: 0px solid #000;
	}

h1 {
	color: DarkRed;
	}
	
h2 {
    color: DarkRed;
	}
	
h3 {
	color: DarkRed;
	}
	
.name {
	color: Crimson;
	}
		
img {
	max-width: 100%;
	height: auto;
}

.sidebar-content {
    float: right;
    width: 34%;
    background-color:#00C0C0;
}

.main-content {
    border: 1px solid #ccc;
    background-color:#8080FF;
    width: 66%;
}

.clear {
    clear:both;
}


/* Anonsy */
.anonsy {
	display: flex;
	width: 100%;
	margin: 12px auto;
}
.child_anons_1, .child_anons_2 {
	box-sizing: border-box;
	padding: 0px;
	border: 0px solid red;
    border-radius: 0px;
}
.child_anons_1 img, .child_anons_2 img {
    width: 100%;
    border-radius: 5px;
}

@media (max-width: 525px) {
	.anonsy {
		flex-direction: column;
	}
	.child_anons_1, .child_anons_2 {
		margin-bottom: 10px;
	}
}
@media (min-width: 526px) {
	.anonsy {
		justify-content: space-between;
	}
	.child_anons_1 {
    width: 50%;
    }
    .child_anons_2 {
    width: 50%;
    margin-left: 2%;
    }
}
/* Anonsy */

/* Контейнер адаптивный */
.parent {
	display: flex;
	width: 100%;
	margin: 12px auto;
}
.child_1, .child_2 {
	box-sizing: border-box;
	padding: 0px;
	border: 0px solid red;
    border-radius: 0px;
}

@media (max-width: 768px) {
	.parent {
		flex-direction: column;
	}
	.child_1, .child_2 {
		margin-bottom: 10px;
	}
}
@media (min-width: 769px) {
	.parent {
		justify-content: space-between;
	}
	.child_1 {
    width: 67%;
    }
    .child_2 {
    width: 33%;
    margin-left: 1.4%;
    }
}
/* Контейнер адаптивный */

/* Меню адаптивное */
@media (max-width: 500px) {
	.menu-div-mobile {
		display: block;
    }
    .menu-div {
        display: none;
    }
}

@media (min-width: 501px) {
	.menu-div-mobile {
		display: none;
	}
    .menu-div {
        display: block;
    }
}
/* Меню адаптивное */

/* Спойлер для меню http://shpargalkablog.ru/2013/04/details-html.html */
details > summary:after {
    content: "Открыть меню";
    list-style-type: "+ ";
}
details[open] > summary:after {
    content: "Закрыть меню";
    list-style-type: "- ";
}
details {
    background-color: #ffea5a;
	padding: 10px 10px;
	border-bottom: 0px solid #000;
	border-top: 0px solid #000;
    border-radius: 15px;
}

/* Спойлер для меню */


/* Код для адаптации видео */
.video-responsive {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
}

.video-responsive iframe, .video-responsive object, .video-responsive embed {
position: absolute; top: 0; left: 0;
width: 100%;
height: 100%; }
/* Конец кода для адаптации видео */