*{margin:0; padding:0;}
html, body{width:100%;height:100%;}
#fon_body {background:url('fon_.jpg') no-repeat fixed; background-size:cover;}
#parent {margin:auto; width:90%;}
#parent div{margin-bottom:1px;width:100%;outline:0px blue solid;}

#nav_{width:max-content;outline: 0px solid;margin-bottom:10px;margin-top:10px;background:rgba(48,40,32,0.85)}
.hor_nav ul{display: flex;flex-direction: row;justify-content: left;align-items:center}
.hor_nav li{position: relative;list-style:none;}
.hor_nav ul a{display: block;width: auto;height: auto;padding: 10px 20px;text-decoration: none;background:rgba(255,255,255,0.25); font-size: 25px; font-weight: bold;}
.hor_nav li ul{position: absolute;display: none;}
.hor_nav li:hover ul{display: block;z-index: 3000;width:180%;background:rgba(135,122,97,0.9);}
li:hover{-webkit-transform: scale(0.9);-ms-transform: scale(0.9);transform: scale(0.9);opacity:1.0;}
li{transition:all 0.3s ease;opacity:0.6;}

.b1 {height:auto;margin:auto;margin-bottom:40px;margin-top:40px;}
.b3 {height:auto; background:rgba(36,26,29,0.85);padding-bottom:20px;padding-top:20px;}
.b4 {height:auto; background:rgba(48,40,32,0.85);padding:20px 10px;}
.b5 .img2{box-shadow:-5px 5px 50px black;}
.gal{height:auto; background:rgba(119,119,119,0.85);padding-bottom:20px;padding-top:20px;display: grid;margin:auto;
grid-template-areas:
"a a b"
"c d d"
"e e f"; 
}

.a{grid-area:a}
.b{grid-area:b}
.c{grid-area:c}
.d{grid-area:d}
.e{grid-area:e}
.f{grid-area:f}

img{display:block;transition:all 0.3s ease;}
.img2{margin:auto;width:85%;clear:both;}
.img3{margin:auto;width:60%;clear:both}
.img4{margin:auto;width:85%;clear:both;padding:25px 10px}
.img5{margin:auto;width:85%;clear:both;padding:10px}
.img3:hover,.img4:hover,.img5:hover{-webkit-transform: scale(1.25);-ms-transform: scale(1.25);transform: scale(1.25)}
.sound{align-content:strech;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;}

	figure{width:26%}
	audio{width:100%}
	
	figcaption{font-size:30px;margin:10px 20%;margin-top:20px;text-align:center;color:white}
	p{text-align:justify;font-size:20px;margin:10px 100px;color:white}
	.b4 p {font-size:1em;margin:0; padding:0 }
	h2{text-align:center;font-size:40px;margin:10px;color:white;} 
	h1{text-align:center;font-size:5em;color:rgb(150,0,0);display:none;}
	a{color:white;}

@media only screen and (max-width:1025px)
{
	.sound{display:inline;}
	figure{width:auto;margin:0px 50px}
}

@media only screen and (max-width:701px)
{
	#fon_body{background-color:#6c6965;background-image:none;}
	.img3{width:95%;}
	h4{font-size:20px}
	h3{font-size:25px}
	h2{font-size:30px}
	#parent{width:100%}
	.b1{width:100%}
	
	
}
@media only screen and (max-width:601px)
{
	.b5 .img4{box-shadow:-5px 5px 10px black;}
	
	p{margin:10px;}
	.gal{
		grid-template-areas:
		"a"
		"b"
		"c"
		"d"
		"e"
		"f"
		}
}

@media only screen and (max-width:375px)
{/*#fon_body {background-color:#6c6965;background-image:none;}*/
	.hor_nav ul li{width:#33%;}
	.hor_nav ul a{padding-left:13px;padding-right:5px;font-size:20px;letter-spacing:#2px}
	.hor_nav ul li ul li{width:100%;}
}