html {
	background-color: hsl(var(--d), 25%, 75%);
	margin:auto;
	padding:5 5 5 5;
	border-width:1px;
	border-style:none;
	border-color:green;
	color:red;
	font-size:16px;
	max-width: 800px;
}

body {
	width:100%;
	margin:auto;
	padding:0;
	background-color:orange;
	border-width:1px;
	border-style:none;
	border-color:green;
}

header {
	width:90%;
	margin:0;
	padding:5%;
	background-color: hsl(var(--d), 50%, 55%);
	border-style:none;
	color:white;
	font-size:2rem;
}

main {
	background-color: hsl(var(--d), 50%, 90%);
	color: hsl(var(--d), 50%, 20%);
	width:90%;
	margin:0;
	padding:5%;
	border-style:none;
	font-size:1rem;
}

footer {
	width:90%;
	margin:0;
	padding:1% 5%;
	background-color: hsl(var(--d), 50%, 10%);
	border-style:none;
	color:white;
	font-size:0.8rem;
}

section {
	width:95%;
	padding: 0 1rem 0.5rem;
	border-style:dotted;
	border-width:0 0 1px 0;
	border-color:green;
}

article {
	width:95%;
	padding:0 1rem 0;
	border-style:solid;
	border-width:0 0 0 2px;
	border-color:green;
}

h2 {
	font-size:1.7rem;
	border-left:solid 5px #3333ff;
	border-bottom:solid 1px #3333ff;
	border-radius:0 0 0 1em;
	padding-left:2rem;
}
h3::before {
	content:"▶▶ ";
}
h3{
	padding-left:10%;
}
h4{
	padding-left:25%;
	font-size:0.5rem;
}
p {
	margin:0.5em;
	text-indent:1.5em;
	line-height:1.3em;
	font-size:1em;
	text-align:justify;
}

table {
	color:black;
	border:solid 1px black;
	border-collapse:collapse;
	margin:1rem auto 1rem;
	font-size:0.8rem;
}
th {
	border:solid 1px black;
	padding:0 0.5em 0;
}
td {
	border:solid 1px black;
	padding:0 0.5em 0;
}

img.center {
	display:block;
	margin:auto;
}

div#menu {
	margin:0;
	padding:0;
	background-color:black;
	display:flex;
	width:100%;
	border:none;
	justify-content: space-between;
}
nav {
	width:24%;
	line-height:2rem;
	background-color:black;
	color:white;
	position:relative;
}
nav a {
	display:block;
	text-decoration:none;
	color:white;
}
nav a:hover {
	background-color:pink;
	color:red;
}
nav:hover ul {
	display:block;
}
nav ul {
	display:none;
	width:100%;
	list-style-type:none;
	padding:0;
    	position:absolute;
	left:25%;
	top:1rem;
}
nav ul li {
	width:100%;
	line-height:2rem;
	background-color:grey;
	padding:0;	
}
nav ul li a {
	display:block;
	line-height:2rem;
}
div {
	margin: auto;
	padding: 5px;
	width:90%;
	border-style:none;
	border-width:2px;
	border-color:green;
	text-align:center;
}
div.code{
	margin:5px;
	padding:0px 5px 5px 10px;
	white-space: pre-wrap;
	font-family: monospace;
	color:white;
	background-color:
	darkgreen;width:250p;
	text-align:left;
	font-size:0.8rem;
}
    iframe{
		width:600px;
		height:480px;
	}
  @media screen and (max-width:480px) {
	iframe{
		width:300px;
		height:240px;
	}
  }
}