@charset "UTF-8";
/* CSS Document */

*{
	margin:0;
}

section, iframe {
	height: 100%;
}

body, html {
	height:100%;
	margin: 0;
	padding: 0;
	background: url("background option 1.jpg") center;
	background-size:cover;
}

nav {
	background: rgba(255,255,255,0.55);
	width: 100%;
	text-align: center;
	margin: 0;
	border: thin solid;
}
nav li {
	display: inline-block;
}
nav li a {
	color: black;
	text-decoration: none;
	margin: auto 40px;
	font-size: 18px;
	font-family: ibm-plex-mono, "monospace";
	font-weight: 700;
	display: block;
	padding: 15px 30px;
	border:thin solid rgba(255,255,255,0.0);
}
li a:hover{
	background: url("ocean-918999_1280.jpg");
	border: thin solid;
}	

body.subject {
	height: 100%;
	overflow: hidden;
}
iframe.subject {
	width: 100%;
	padding-top: 15px;
	overflow: hidden;
	border: none;
}
div.container {
	margin:25px auto;
	display: flex;
	flex-flow: column;
	border: 1px solid black;
	width: 95%;
	height: 88%;
}
.title {
	padding: 0px 10px 4px;
	height:30px;
	font-family: ibm-plex-mono, "monospace";
	font-weight: 600;
	font-size: 18px;
	background: rgba(134,132,132,1.00) url("ocean-918999_1280.jpg");
	border-bottom: 1px solid black;
	border:1px outset grey;
}
iframe{
	border:1px outset grey;
}