/*
This is from Teppy's Layouts. :)
*/

@font-face {
  font-family: bodytext;
  src: url('/assets/fonts/FiraSans.ttf');
}

body, html {
	margin: 0;
	background: black;
	color: #0099ff;
	font-family: 'bodytext';
	font-size: 15px;
}

img {
	max-width: 100%;
}

.page {
	padding: 24px;
	background-color: black;
}

.page h1:first-child {
	margin-top: 0;
}

.header-image {
	height: 150px;
	margin: 1em auto;
	display: block;
}

.wrapper {
	margin: auto;
	margin-top: 1em;
	width: 70%;
	padding:.5em;
}

.menu {
	text-align: center;
	margin-bottom: 24px;
	margin-top: 24px;
}

.menu a {
	color: #0099ff;
    text-decoration: none;
}

a:hover{
    color:black;
    background-color: #0099ff;
}

main,
.box,
.bigbox {
	width: 100%;
	position: relative;
    border: 1px solid #0099ff;
    padding:1em;
    border-radius: 5px;
	display: block;
}

main{
  overflow-y: auto;
  padding:2em;
  padding-bottom:8em;
  height: max-content;
  float:center;
  margin-bottom:2em;
}

hr{
	border: .1em dashed #0099ff;
	margin:1em;
}

.box{
	width:30%;
    max-width:15em;
	float:right;
    margin:.5em;
}

.bigbox{
	margin:auto;
	width:69%;
	max-width:90em;
	overflow-y: scroll;
	height:20em;
	margin-top:2em;
	float:left;
}

h1, h2, h3, h4, h5, mark {
    color: black;
    background-color: #0099ff;
}

h1, h2, h3, h4, h5 {
    letter-spacing: 2px;
    text-transform:uppercase;
}

h1 {
	border-bottom: .2em dashed black;
}

h2 {
	border-bottom: .15em dashed black;
}

a {
	color: #0099ff;
}

table {
	border-collapse: collapse;
}

td, th {
	vertical-align: top;
	border: 1px solid #0099ff;
	padding: 3px 6px;
}

th {
	background: #0099ff;
	color: black;
}

li{
    list-style-type: none;
	margin-bottom:.7em;
}

.width-50 {
	max-width: 50%;
}

.border {
	padding: 3px;
	border: 1px solid #0099ff;
}

table.border-0 th, table.border-0 td {
    border: 0;
}

.border-0 {
    border: none;
}

@media (max-width: 1085px) {


	.bigbox,
	.box {
		width: 95%;
		height: 25em;
		float:center;
		margin:auto;
	}

	.box{
		max-width: 50em;
		margin-bottom:1.4em;
	}


	main{
		height:25em;
		min-width: fit-content;
	}

	.wrapper{
		justify-content: center;
	}
	
	body{
		padding-left:-1em;
	}

	.header{
		margin-left:4em;
	}

}