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

@import url('../fonts/DejaVu/stylesheet.css');
@import url('../fonts/Nobile/stylesheet.css');


@media screen {
 body	{
	font:normal 95%/1.2em 'NobileRegular', Verdana, Arial, Helvetica, sans-serif;
	color: #EEE;
	background: #0D1102 url(../images/mainbg.jpg) repeat-x 50% 292px;
	text-align:center;
	margin:0;
	padding:0
	}
}
@media print {
boy {font-size:100%}
}
	#main {max-width:1120px; min-width:920px; border:1px solid #000; border-radius:20px; -webkit-border-radius:20px; margin:30px auto; padding:20px 0; background: transparent url(../images/IMG_0471.jpg) center center; -webkit-box-shadow:  0px 0px 15px 8px rgba(0, 0, 0, .5); box-shadow:  0px 0px 15px 8px rgba(0, 0, 0, .5);}
	#header {margin:0 0 20px 0; border-bottom:1px solid #590; font-size:120%; padding-bottom:20px; text-align:left}
	#header h1 { color:#9A5; font:normal 190%/.9em 'DejaVuSerifBold', Georgia, "Times New Roman", Times, serif; text-shadow:0 2px 3px black}
	#header ul#nav  {list-style:none; clear:both}
	#header #nav li {float:left; margin-right:3px}
	#header #nav li a {padding:10px 20px; display:block; background:#7E8C1D url(../images/but_nav.png) -20px 0 no-repeat; color:#FFFFFF; border:1px solid #FFF; font-size:110%;  text-shadow:0 2px 3px black}
	#header #nav li a:hover {color:#FF3; background-position:-23px 0}
	#nav li:first-child a {border-radius:10px 0 0 10px; -moz-border-radius:10px 0 0 10px; -webkit-border-radius:10px 0 0 10px;}
	#nav li:last-child a {border-radius:0 10px 10px 0; -moz-border-radius:0 10px 10px 0; -webkit-border-radius:0 10px 10px 0;}
	.header_content {margin-left:20px; width:680px; float:left}
	.widget_emailcapture {float:right; width:300px; margin-right:40px}
	#leftCol {float:left; width:50%}
	#leftCol img {border:1px solid #FFF}

	ol  { text-align:left; margin:10px; padding:10px; border:1px solid #9f9;  background-image:url(../images/bg_px.png); border-radius:15px 0 15px 15px; -webkit-border-radius:15px 0 15px 15px; text-shadow:1px 1px 2px #033}
	ol li {margin: 3px 3px 3px 30px}
	ol li a:link, ol li a:visited {text-decoration:none; color:#9F0}
	ol li a:hover {color:#DDD}
	
	ol.songslist {background:none; border:none; margin:0; padding:0; font-size:90%}
	
	#rightCol {float:right;  width:49%}
	#rightCol img {border:1px solid #FFF; }
	#leftColsmall {}
	
	a:link, a:visited {color:#FFFF00; text-decoration:none}
	a:hover {color:#FFFFCC}
	
	.clearFloat {clear:both; height:1px;}
	.clearLeft {clear:left; height:1px;}
	
	#footer {border-top:1px solid #590; padding:10px; margin-top:20px }
	#footer a:link, #footer a:visited {text-decoration:none; color:#9F0}
	#footer a:hover {text-decoration:none; color:#999}
	
	h1 {margin:5px 10px; font-size:130%;  color:#FFF; }
	h1, h2 {font-family: 'DejaVuSerifBold'; line-height:1.1em}
	h3 {margin:10px 20px}
	#main h1 {font-size:200%; margin-bottom:40px}
	.subtitle {padding-top:0; margin-top:-15px}
	ol.gallery img {width:99%!important; height:auto; margin-bottom:10px}
	
	input, textarea {float:right}
	form p {clear:right}
	label {float:left}
	input[type=image] {float:none}
	
	.bigButton {text-align:center; margin-top:0}
	.bigButton a {display:block; padding:10px;  border:6px solid #580; background:#030; opacity:0.7; filter:alpha(opacity=70) }
	.bigButton a:hover {background:#060; border-color:#690; color:white}
	
	hr {height:1px; border:none; margin:20px auto 10px; width:70%; text-align:center; color:#250; background-color:#250}
		
	/* ********************************** style for iPad ********************** */
	@media all and (max-width: 920px) and (min-width: 700px) {
	#main {max-width:920px; min-width:700px}
	#header {padding:0 0 20px; text-align:left}
	#header h1, #header h2 {font-size:150%}
	#header h2 {font-size:120%; margin-top:-20px}
	#header #nav {margin-left:-20px; text-align:center}
	#header #nav li {margin-bottom:5px; margin-right:1px}
	#header #nav li a {width:135px; padding:5px; border-radius:10px; -webkit-border-radius:10px;}
	.header_content {width:60%; text-align:center; margin:0}
	.widget_emailcapture {margin:0}
	#leftCol, #rightCol {float:none; width:100%}
	#rightCol {padding-top:20px}
	ol #leftCol {float:left;}
	ol #rightCol {float:right}
	ol {margin:0 10px}
	ol.songslist li {float:left}
	ol.songslist li:after{content:' , '}
	ol.gallery img {width:1000%; height:auto}
		}
	
	@media all and (max-width: 699px) and (min-width: 481px) {
	#main {max-width:699px; min-width:481px}
	#leftCol, #rightCol {float:none; width:100%}
	#rightCol {padding-top:20px}
	#header {padding:0 0 20px; text-align:left}
	#header h1, #header h2 {font-size:150%}
	#header h2 {font-size:120%; margin-top:-20px}
	#header #nav {margin-left:-20px}
	#header #nav li {margin-bottom:5px}
	#header #nav li a {width:135px; padding:5px; border-radius:10px; -webkit-border-radius:10px;}
	.header_content {width:100%; text-align:center; margin:0}
	.widget_emailcapture {margin:0; text-align:center; width:100%}
	ol {margin:0 10px}
	ol #leftCol, ol #rightCol {float:none; width:100%}
	ol.songslist li {float:left}
	ol.songslist li:after{content:' , '}
	ol.gallery img {width:550px; height:auto}
	}
	
	@media only screen and (max-width: 480px) and (min-width:321px), only screen and (max-device-width: 480px) and (max-device-width: 321px) {
	#main {max-width:480px; min-width:321px}
	#leftCol, #rightCol {float:none; width:100%}
	#header {padding:0 0 20px; text-align:left}
	#header h1, #header h2 {font-size:150%}
	#header h2 {font-size:120%; margin-top:-20px}
	#rightCol {padding-top:20px}
	#header #nav { text-align:center}
	#header #nav li {margin-bottom:5px}
	#header #nav li a {width:120px; padding:5px; margin-right:10px; border-radius:10px; -webkit-border-radius:10px;}
	#header #nav li:last-child {margin:0 20%}
	.header_content {width:100%; text-align:center; margin:0}
	.widget_emailcapture {margin:0; text-align:center; width:100%}
	ol {margin:0 10px}
	ol #leftCol, ol #rightCol {float:none; width:100%}
	img.scalableimage {width:99%; height:auto}
	ol.gallery img {width:300px; height:auto}
	}
	
	@media all and (max-width: 320px) and (min-width: 280px) {
	#main {max-width:320px; min-width:280px}
	#leftCol, #rightCol {float:none; width:100%}
	#header {padding:0 0 20px; text-align:left}
	#header h1, #header h2 {font-size:150%}
	#header h2 {font-size:120%; margin-top:-20px}
	#header, #nav li {text-align:center}
	#header #nav li a {width:120px; padding:5px; border-radius:10px; -webkit-border-radius:10px;}
	.header_content {width:100%; text-align:center; margin:0}
	.widget_emailcapture {margin:0; text-align:center; width:100%}
	ol {margin:0 10px}
	ol #leftCol, ol #rightCol {float:none; width:100%}
	ol.gallery img {width:260px; height:auto}

}