@charset "UTF-8";
.width100p { width: 100%;}
html { 
	/* background: #9BC86A; */
    background: url(//simdou1.crimea-school.ru/sites/default/files/pictures/bg-fs9.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
body {
	display: flex;
	flex-wrap: wrap;
	flex: 1 1 100vw;
	max-width: 1024px;
    margin: 3px auto;
    padding: 0 3px;
 
    color: #005a84;
    font-family: sans-serif;
    font-size: 90%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    background: white;
    border-radius: 5px;
}
header, nav, container, main, sidebar, footer, slider {
	display: flex;
	flex: 1 1 100vw;
	margin: 3px;
	background: azure;
	border-radius: 5px;
}
header {
    background: linear-gradient(to bottom, #c5deea 0%,#8abbd7 31%,#066dab 100%);
}
header #logo {
	display: flex;
	flex: 0 0 150px;
	justify-content: center;
	align-items: center;
	background: white;
	border-radius: 5px 
}
header #logo img { max-height: 150px; }
nameslogan { padding: 15px; }
nameslogan #site-slogan { margin-top: 5px; }
#openMenu, #closeMenu {
	border: none;
    background: white;
    border-radius: 5px;
    font-size: 30px;
	font-weight: bold;
	padding: 0px 5px 0px 5px;
	cursor: pointer;
	display: none;
}
nav {
    /* justify-content: center; */
    align-items: center;
    padding: 0 10px;
    margin-top: 9px;
}
container { 
    flex-direction: row;
    max-width: calc(100vw - 12px);
}
main, sidebar {
    margin: 0;
    padding: 5px 10px;
}
main {
    margin-right: 5px;
    flex-direction: column;
}
sidebar {
    margin-left: 5px;
    flex: 0 0 250px;
}
footer {
    padding: 5px 10px;
}
.content p {
    padding-top: .5em;
    padding-bottom: .5em;
}
a {
	text-decoration: none;
	color: inherit;
}
@media only screen and (max-width: 717px) {
    header { font-size: 66%; }
    header #logo { flex: 0 0 13%; }
    header #logo img { max-height: 55px; }
    container { flex-direction: column; }
	#openMenu, #closeMenu {
		display: block;
/*	}
	#openMenu { */
		margin-left: auto;
	}
	#closeMenu {
	    display: none;
		/* position: fixed;
		right: 15px;
		top: 65px; */
	}
	nav {
	    display: contents;
		/*position: fixed;*/
		/* flex-direction: column;* /
		width: 100vw;
		height: 100vh;*/
		background: rgba(255, 255, 255, 0.8);
		justify-content: center;
		align-items: center;
		margin: 0;
		display: none;
		opacity: 0;
		transition: 0.3s;
	}
	nav a {
		margin: 1%;
	}
	#nav {
		/* flex-direction: column; */
	    display: grid;
	}
	#nav ul {
	    display: block !important;
	    position: unset !important;
	}
	ul.menu-level-1 a { margin-left: 25px; }
	ul.menu-level-2 a { margin-left: 50px; }
    ul.menu-level-3 a { margin-left: 75px; }

}