html { 
  background: url("/img/background.webp") no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#161050;
}

@media screen and (max-width: 81em)
{
html
{
background:#161050;
}
}

body 
{
background-color:#0B0C50; 
background:url("/img/main.png"); 
font-family:Verdana,"lucida grande",sans-serif; 
font-size:100%; 
color:#f5f9ff;
margin:0 auto 0 auto;
max-width:80em;
-webkit-animation: bugfix infinite steps(4) 1s;
box-shadow: rgba(0,0,20,1) 0em 0em 1.5em;
}
/* Hack for android browser to make the hamburger menu work */
@-webkit-keyframes bugfix
{
	from { padding: 0; }
	to { padding: 0; }
}

body.indexid li.indexnav,
body.newsid li.newsnav,
body.downloadid li.downloadnav,
body.makeyourownid li.makeyourownnav,
body.shoutboxid li.shoutboxnav,
body.spamburpid li.spamburpnav,
body.donationsid li.donationsnav,
body.linksid li.linksnav,
body.contactid li.contactnav
{
background-color:#baddee;
}

h1 
{
font-family:verdana,"lucida grande",sans-serif; 
font-size:250%;
font-weight:bold;
line-height:1em; 
margin:0.25em; }

h2
{
font-family: "georgia","lucida grande",sans-serif; 
font-size:125%;
font-weight:bold; 
color:#f5f9ff;
background-color:transparent;
margin-bottom: 0.7em;
margin-top: 1.6em;
}
p
{
font-family:Verdana,"lucida grande",sans-serif; 
font-size:100%;
text-align:justify; 
color:#f5f9ff;
background-color:transparent; 
margin-top:0; }

ul
{
list-style-type:none; 
margin-left:0; 
padding-left:0; }

iframe
{
border:0; }

.menulist
{
line-height:1.5em;
text-align:left; }

.menu_left
{
background:#70a3c9; 
padding-top:.5em; 
padding-bottom:0.5em;
width:10em;
clear:left;
box-shadow: rgba(0,0,0, 0.9) 0 0 0.7em;
}

.menu_container
{
font-family:Verdana,"lucida grande",sans-serif; 
font-size:100%; 
font-weight:bold; 
text-align:center; 
width:10em;
margin-left:0;
margin-right:0;
float:left; 
color:#000; 
padding-right:1em;
position:absolute;
top:auto;
height:100%;
}

.menu_top
{
font-family:Verdana,"lucida grande",sans-serif; 
font-weight:bold; 
color:#000; 
background-color:#202020; 
background: url("/img/right.png") no-repeat 100% 0%, url("/img/left.png") no-repeat 0% 0%, url("/img/mid.png"); 
background-size: auto 100%, auto 100%, auto 100%;
width:100%;
margin-top:0; 
margin-left:0; 
margin-right:0; 
margin-bottom:1em;
text-align:center; 
padding:0;
box-shadow: rgba(0,0,0, 0.9) 0 0 1em;
}

.menu_top img
{
	max-width: 399px;
	min-width: 133px;
	width: 70%;
	height: auto;
	margin-bottom: 7px;
}
.menu_top h1 
{
	font-size:250%; 
	margin:0;
	padding-top:4px;
	padding-bottom:6px;
}

.text_main
{
background-color:#123b63;
font-family:Verdana,"lucida grande",sans-serif;
font-weight:normal; 
margin:0 9em 0 11em;
padding-left:1.6em;
padding-right:1.6em;
padding-top:0.5em;
padding-bottom:1em;
z-index: 1;
position:static;
overflow:hidden;
box-shadow: rgba(0,0,0, 0.9) 0 0 0.7em;
}

.albumlist
{
float:left;
padding:0;
margin-right:1em;
margin-top:0em;
width:16em;
}

.valid
{
margin-top:2em; 
margin-bottom:2em; }

.right-ad
{
font-family:Verdana,"lucida grande",sans-serif; 
font-size:100%; 
text-align:center;
float:right;
width:8em;
overflow:hidden;
color:#000; 
background-color:transparent;
}

img
{
border:none; }

a:link
{
color:#FF8080; 
text-decoration:none; 
font-weight:bold; }

a:visited
{
color:#FF8080; 
text-decoration:none; 
font-weight:bold; }
a:hover
{
color:#208020; 
text-decoration:none; }
a:active
{
text-decoration:none; }

a.menulink
{
display:block;
}

a.menulink:link
{
color:#000; 
text-decoration:none; 
font-weight:bold; }

a.menulink:visited
{
color:#000; 
text-decoration:none; 
font-weight:bold; }
a.menulink:hover
{
color:#2020AA; 
text-decoration:none; 
font-weight:bold; }
a.menulink:active
{
color:#000; 
text-decoration:none; 
font-weight:bold; }

.indexnav,
.newsnav,
.downloadnav,
.makeyourownnav,
.shoutboxnav,
.spamburpnav,
.donationsnav,
.linksnav,
.contactnav
{
background-color:#9abdce;
padding-left:1em;
margin-bottom:2px;
-webkit-transition: background-color 0.7s ease-out;
-moz-transition: background-color 0.7s ease-out;
-o-transition: background-color 0.7s ease-out;
transition: background-color 0.7s ease-out;
}

.indexnav:hover,
.newsnav:hover,
.downloadnav:hover,
.makeyourownnav:hover,
.shoutboxnav:hover,
.spamburpnav:hover,
.donationsnav:hover,
.linksnav:hover,
.contactnav:hover
{
background-color:#baddee;
}

.spotify_embed
{
	margin: 0 0 1em 1em;
}

#hamburger
{
	position: absolute;
	left: 0;
	top: 0;
	clip: rect(0, 0, 0, 0);
}
label[for='hamburger']
{
	/*width: 100%;*/
	height: 1.5em;
	/*position: absolute;*/
	margin:0;
	text-align:left;
	cursor: pointer;
	background-image: url("/img/hamburger.svg");
	background-size: contain;
	background-repeat: no-repeat;
	display: none;
}
label[for='hamburger']:after
{
	content: "Menu";
	margin-left: 1.5em;
	font-size: 1.3em;
}

@media screen and (max-width: 60em) {
	.right-ad 
	{
		display: none;
	}
	.text_main
	{
		margin:0 1em 0 11em;
	}
}

@media screen and (max-width: 44em)
{
	.menu_top h1
	{
		font-size:150%;
		padding-bottom:5px;
		padding-top:0px;
		margin-top:0px;
		
	}
	.menu_top img
	{
		margin-bottom: 0;
	}
	.menu_top
	{
		margin-bottom: 0;
	}
	
	label[for='hamburger']
	{
		display: block;
	}
	#hamburger:checked ~ .menu_left
	{
		display: block;
		width:100%;
		padding-top: 0;
		padding-bottom: 0;
	}
	#hamburger:checked ~  .valid
	{
		display: inline-block;
		margin: 0 0.5em 0 0;
		padding:0;
		
	}
	#leftmenu
	{
		
		width: 100%;
		
		display: inline-block;
		background: #555555;
		min-height:2em;
		margin: 0;
		padding:0.5em;
		box-sizing: border-box;
		background: #70a3c9;
		position:absolute;
		height: auto;
		z-index: 10000;
		box-shadow: 0 0.3em 0.05em rgba(0, 0, 64, 0.4);
		
		text-align: left;
	}
	.menu_left, .valid
	{
		display: none;
	}
	.text_main
	{
		margin: 2.75em 0.25em 0 0.25em;
		padding: 0.5em;
	}
	.albumlist
	{
		width:100%;
		clear:both;
		text-align:justify;
	}
}
@media screen and (max-width: 600px)
{
	.topad
	{
		display:none;
	}
	.spotify_embed
	{
		margin: 0;
		display: inline-block;
		display: block;
		width: 100%;
	}
}
.page_item
{
display: block;
background-color: #20608D;
float: left;
padding: 0.5em;
margin: 0.375em;
text-decoration: none;
border: none;
}
.page_item:hover
{
background-color: #2A729D;
border: none;
}
.page_item span
{
display: block;
width: 250px;
margin: 0.75em 0 0.35em 0;
color:white;
}
.page_item img
{
display: block;
}
.nostylelist
{
list-style: none;
margin: 0;
padding: 0;
font-size: 0;
}
.nostylelist li
{
display: inline-block;
vertical-align: top;
margin: 0;
font-size: 1rem;
margin-bottom: 1.5em;
width: 17.35em;
}
.nostylelist li > span
{
margin-left: 0.3em;
font-weight: bold;
}
.nostylelist li > div
{
margin-left: 0.5em;
}
.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
#disqus_thread {
    min-height: 100px;
}