@charset "utf-8";

body {
	font-family:Calibri, Arial, sans-serif;
	background: #000022;
	width:100%;
	height:100%;
	margin: 0;
	padding: 0;
	color: #000000;
	background-image:url(Media/Mountains_5.jpg);
	background-attachment:fixed;
	text-shadow: 1px 1px #20174d;
}

/* Standard element properties*/

ul {
	list-style-type: none;
}

ul li {
	text-align:left;
}

ol, dl { 
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 
	padding-right: 15px;
	padding-left: 15px; 
}

a img { 
	border: none;
}

a:link {
	color: #ff4477;
	text-decoration: underline;
	font-weight:bolder; 
}

a:visited {
	color: #ff4477;
	text-decoration: underline;
	font-weight:bolder;
}

a:hover {
	color:#ff4477;
}

a:hover, a:active, a:focus { 
	text-decoration: underline;
}

audio {
	width: 100%;
	margin-left:0%;
	background-color: transparent;
	border: 5px solid transparent;
}


/* divs common to all pages */

.container {
	width: 80%;
	height:100:;
	max-width: 1260px;
	min-width: 780px;
	margin: auto;
	background-color:transparent; 
}

.header {
	width: 100%;
	height:5%
	float: none;
	padding-top: 20px;
	padding-bottom:0px;
	padding-left:40px;
	text-align:left;
	font-size:36pt;
	font-weight:bolder;
	color:#ff4477;
	text-shadow: 1px 1px #20174d;
}

.content {
	float: none;
	padding-top: 0px;
	padding-bottom: 0px;
	height:90%;
	font-size: 18pt;
	font-weight: bolder;
	color: #ff0000;
	text-align: left;
	background-color:transparent;
}

.pageid {
	color: #22ffff;
	padding-left:40px;
	padding-top: 0px;
	font-size:28pt;
	text-shadow: 2px 2px #20174d;
}

.menu {
	float: none;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 19pt;
	font-weight: bolder;
	color: #ff0000;
	text-shadow: 5px 0px #20174d;
}

.main {
	float: none;
	width: 100%;
	height:90%;
	padding-top: 0px;
	padding-bottom: 10px;
	padding-left: 5%;
	font-size: 14pt;
	font-weight: bold;
	color: #22ffff;
}

.footer {
	width: 100%;
	height:5%;
	float: none;
	clear:left;
	padding-top:20px;
	padding-bottom:10px;
	text-align: left;
	padding-left:40px;
	font-size: 24pt;
	font-weight: bold;
	color: #22ffff;
	text-shadow: 1px 1px #20174d;
}

/* div for home page*/

.new_songs {
	columns:3;
	float:none;
	clear:right;
}

/* divs for music pages */

.music_player {
	width:90%;
	text-align:left;
	color:#ff4477;
	font-size:14pt;
	padding-left:5%;
}

.displayed_player {
	float:left;
	width:36%;
}

.now_playing {
	float:left;
	clear:right;
	padding-left:10px;
	padding-top:10px;
	background-color:transparent;
	color:#000000;
	width:60%;
	text-shadow:none;
	font-weight:bold;
	color:#ffff44;
	font-size:20pt;
}

.song_list {
	padding-top:0px;
}

/* divs for the "about" page */

.top{
	width:100%;
	float:none;
	text-align:left;
}

.topleft{
	width:70%;
	float:left;
	text-align:left;
}

.topright{
	width:30%;
	float:left;
	clear:none;
	text-align:center;
}

.top2{
	float:left;
	text-align:left;
}

.bot {
	width:100%;
	float:none;
	text-align:center;
}

.lower {
	float:left;
	text-align:left;
}
	
.botleft{
	width:30%;
	float:left;
	text-align:center;
}

.botright{
	width:70%;
	float:left;
	text-align:center;
}

/* Override properties */

.menu ul li {
	display:inline;
	padding-left:0px;
	padding-right:40px;
}

.active a {
	color:#ffff22;
}

#playlist {
	background:transparent;
	width:90%;
	padding:10px;
	list-style:none;
	columns:4;
	font-weight:bold;
}


#playlist2 {
	background:transparent;
	width:90%;
	padding:10px;
	list-style:none;
	columns:3;
	font-weight:bold;
}


#playlist a {
	text-decoration:none;
}


#playlist2 a {
	text-decoration:none;
}



#sub1 {
	columns:4;
	width:80%;
	padding-top:5px;
}

#sub2 {
	columns:4;
	width:80%;
	padding-top:5px;
}

#synthlist {
	background:transparent;
	width:90%;
	list-style:none;
	columns: 3;
	font-weight:bold;
}

#pluglist {
	background:transparent;
	width:90%;
	list-style:none;
	columns: 3;
	font-weight:bold;
}

#mehlist {
	background:transparent;
	width:90%;
	list-style:none;
	font-weight:bold;
	padding-top: 10px;
}

#instlist {
	background:transparent;
	width:90%;
	list-style:none;
	columns: 3;
	font-weight:bold;
}