
* {box-sizing: border-box;}

body {background-image: url("webtile.png");
		background-color: #4D0000;
		background-repeat: repeat;
		color: #666666;
		font-family: Arial, Helvetica, sans-serif;}

#wrapper {margin-left: auto;
			margin-right: auto;
			width: 80%;
			background-color: #90C7E3;
			min-width: 960px;
			max-width: 2048px;
			box-shadow: 3px 3px 3px #333333;
			border: 1px solid #FFFFFF;
			background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3);
			background-repeat: no-repeat;}


header {background-image: linear-gradient(to bottom, #0D0D0D, #A52A2A);
		height: 120px;
		text-align: center;
		padding-top: 30px;
		padding-left: 3em;}
		
h1 {margin-bottom: 0;
	margin-top: 0;
	font-family: Georgia, Times-New-Roman, serif;
	font-size: 3em;
	letter-spacing: .25em;}	

header a {text-decoration: none;}

header a:link {color: #FFFFFF;}

header a:visited {color: #FFFFFF;}

header a:hover {color: #FFFFFF;}	

nav {padding-top: 4px;	
		font-weight: bold;
		font-size: 120%;
		text-align: center;
		color: #FFFFFF;
		background-color: #0D0D0D;
		height: 30px;} 
		
nav a {text-decoration: none;}
		
nav a:link {color: #FFFFFF;}

nav a:visited {color: #FFFFFF;}

nav a:hover {color: #A52A2A;}



#homehero {height: 700px;
			background-image: url(studio.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;}

#vidhero {height: 392px;
			background-image: url(videocamera.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;}
			
#audiohero {height: 392px;
			background-image: url(board.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;}
			
#abouthero {height: 392px;
			background-image: url(about.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;}
			
#contacthero {height: 392px;
			background-image: url(sunset.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;}
			
#uke {height: 250px;
			width: 250px;
			background-image: url(sunsetuke.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			display: block;
			margin-left: auto;
			margin-right: auto;
			border: 2px solid;}
			
#board {height: 250px;
			width: 250px;
			background-image: url(soundboard.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			display: block;
			margin-left: auto;
			margin-right: auto;
			border: 2px solid;}
			
#me {height: 250px;
			width: 250px;
			background-image: url(aboutpic.png);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			display: block;
			margin-left: auto;
			margin-right: auto;
			border: 2px solid;}
			
#redtext {color: #FF0000;}

#required {color: #FF0000;
			text-align: center;}
			
#phonepadding {padding-right: 5px;}
			
#sectioncenterright {padding-right: 80px;}

#sectioncenterleft {padding-left: 80px;}

#requestcenter {text-align: center;}

#videocenter {text-align: center;}
			
main {background-color: #222222;
		padding: 1px 20px 20px 30px;
		display: block;
		overflow: auto;}
		
section {float: left;
			width: 50%;
			padding-left: 2em;
			padding-right: 2em;
			text-align: center;}
			
section ul {padding-right: 50px;
			list-style-position: inside;
			color: #A52A2A;
			font-size: 200%;
			list-style-image: url(marker.png);
			line-height: 50px;
			text-shadow: 3px 3px 3px #000000;}

h2 {color: #A52A2A;
	font-family: Georgia, Times-New-Roman, serif;
	text-shadow: 1px 1px 1px #000000;}
	
h3 {font-family: Georgia, Times-New-Roman, serif;
	font-size: 1.5em;
	color: #FFFFFF;
	text-align: center;}
	
figure {text-align: center;}

footer {background-color: #333333;
		font-size: 75%;
		font-style: italic;
		text-align: center;
		font-family: Georgia, Times-New-Roman, serif;
		padding: 2em;}
		
footer a {color: #A52A2A;}


#quote {font-size: 200%;
		font-style: bold;
		color: #A52A2A;
		text-shadow: 3px 3px 3px #000000;}
#speaker {font-size: 90%;
			font-style: italic;}
			
.asterisk {color: #FF0000;}
			
		
		
table {border: 2px solid #A52A2A;
		border-collapse: collapse;
		color: #FFFFFF;}
		
td, th {padding: .5em;
		border: 2px solid #A52A2A;}
		
td {text-align: center;}

.text {text-align: left;}

tr:nth-of-type(odd) {background-color: #0D0D0D;}







@media (min-width: 600px) {
	
	#wrapper {margin-left: auto;
			margin-right: auto;
			width: 80%;
			background-color: #90C7E3;
			min-width: 960px;
			max-width: 2048px;
			box-shadow: 3px 3px 3px #333333;
			border: 1px solid #FFFFFF;

	}







@media (min-width: 1024px) {
	
	#wrapper {margin-left: auto;
			margin-right: auto;
			width: 80%;
			background-color: #90C7E3;
			min-width: 960px;
			max-width: 2048px;
			box-shadow: 3px 3px 3px #333333;
			border: 1px solid #FFFFFF;
	
	
}

