/*"Yanone Kaffeesatz","Arial Narrow",Arial,sans-serif*/
@font-face {
    font-family: 'LibelSuitRegular';
    src: url('fonts/libelsuit-webfont.eot');
    src: url('fonts/libelsuit-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/libelsuit-webfont.woff') format('woff'),
         url('fonts/libelsuit-webfont.ttf') format('truetype'),
         url('fonts/libelsuit-webfont.svg#LibelSuitRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
a:focus,
a:hover     { color: #49c5ff; }
a           { color: #09f;}
html {
	background:#100d0d url(images/guitar-bg.png) bottom left repeat-y;
	color:#fff;
}
body {
	background:url(images/guitar.png) 19px bottom no-repeat fixed;
	color:#fff;
	width:100%;
	min-width:980px;    /* Minimum width of layout - remove line if not required */
	
	/* Or clearfix... background issues */
	float:left;

	font-family: 'Nunito', arial, serif;
	font-size:101%;

}


h1,h2,h3 {
}
header {
	clear:both;
	min-width:980px;
	/*
	background:#100d0d;
	*/
	background:#000 url(images/bg-blue.png) right repeat-y;
	padding:0;
	position:relative;
}
header h1 {
	margin:0;
	/*
	background:url(images/hands.png) bottom left no-repeat;
	*/
	background:url(images/hands-and-guitar.png) bottom left no-repeat;
	color:#fff;
	float:left;
	margin-right:-140px;
	padding:15px 15px 15px 150px;
}

header h3 {
	padding:0;
	margin:0;
	color:#fff;
	position:absolute;
	right:15px;
	bottom:15px;
	font-family:LibelSuitRegular;

}
header h1 a {
	background:url(images/logo.png) center center no-repeat;
	width:515px;
	height:95px;
	text-indent:-9999px;
	display:block;
	/*
	z-index:999;
	position:relative;
	box-shadow:#000 -6px 6px 20px;
	behavior:url(http://localhost/reachconcertseries.com/public/ie/PIE.htc);
	*/
}
nav {
	width:100%;
	clear:both;
	float:left;
	z-index:100;
	text-align:right;
	background:#666 url(images/black-gradient.png) 50% 50%;
}
nav li {
	float:left;
}
nav li a {
	padding:10px;
	float:left;
}
nav ul {
	float:right;
}
nav a {
	font:18px Impact;
	text-transform:uppercase;
	color:#d4dde4;
	text-decoration:none;
}
nav a:focus,
nav a:hover {
	color:#fff;
	text-shadow:#fcea84 0 0 10px;
	outline:0;
}
nav .active a {
	background-color:#1d3f57;
	background:#666 url(images/black-gradient.png);
}
nav.default {

}
nav.fixed {
	position: fixed;
	top:0;
	left:0;
	width:100%;
	background:url(images/bg-black.png);
}


/* No text-shadow for IE, no decent filters either */
.IE nav a:focus,
.IE nav a:hover {
	color:#fcea84;
}



#wrapper {
	max-width:1600px;
	min-width:980px;
	position:relative;
}



#content-wrapper {
	color:#222;
	background:#fefefe;
	
}
#content {
	padding:15px 4% 200px 4%;
	min-height:500px;
}
.heading,
#content h1 {
	padding:10px;
	width:100%;
	margin:0 0 15px 0;
	font-size:32px;
	position:relative;
	left:-10px;

	/*
	font-family:Impact;
	font-family:LibelSuitRegular;
	text-transform:uppercase;
	background:#0a9ad6;
	color:#fdde01;
	*/
	background:#222;
	color:#3FA2FF;
	border-radius:4px;
	behavior:url(http://reachconcertseries.com/public/ie/PIE.htc);
}
#content p {
	max-width:680px;
}
h2,
h3,
h4,
h5,
h6 {
	color:#3FA2FF;
}
h4 {
	color:#FF6600;
	color:#a33b8d;
	color:#db605b;
}
#content img {
	max-width:100%;
}

/* Wrapper for images */
.photos {
	text-align:center;
}


.message {
	padding:1.2em;
	margin:0 0 1em 0;
	border:1px solid #ddd;
	background:#f5f5f5;
}


.album-cover {
	float:left;
	width:48%;
	margin:1% 1% 5% 1%;
	padding:0;
	text-align:center;
}
.album-cover img {
	
}
.album-cover a {
	text-decoration:none;
}
.album-cover a img {
	opacity:.9;
}
.album-cover a:focus img,
.album-cover a:hover img {
	opacity:1;
	box-shadow:0 3px 6px #222;
}
.album-cover .title {
	display:block;
	min-height:4em;
}

.thumbnail {
	display:inline-block;
	margin:4px;
}
.IE7 .thumbnail {
	float:left;
}
#photos {
	text-align:center;
}
#photos img {
	min-height:80px;
	min-width:80px;
	background:#000 url(images/loader.gif) center center no-repeat;
	display:inline-block;
}






.text-to-donate {
    background:#030303 url(images/black-gradient.png) 0 -15px repeat-x;
    display:block;
    padding:5px 0;
    text-align:center;
    text-decoration:none;
	height:1.3em;
	position:absolute;
	top:0;
	width:100%;
	color:#f5f5f5;
	max-width:1600px;
}
body{margin-top:26px;}
.text-to-donate strong {
	color:#FF6600;
}
.text-to-donate:hover,
.text-to-donate:focus {
    background-position:0 -5px;
	color:#fff;
}

.reach-link {
	text-decoration:none;
	text-align:right;
	padding:15px 15px 0;
	display:block;
}
.reach-link:focus,
.reach-link:hover {
	text-decoration:underline;
}
.reach-link img {
	float:left;
	margin:0 10px 10px 0;
}
/*
.social-links {
	position:fixed;
	bottom:5px;
	right:5px;
}
*/
.social-links {
	position: absolute;
	right: 10px;
	top: 10px;
	display:none;
}
#sharethis {
	position: absolute;
    right: 15px;
    top: 15px;
}



	/* column container */
	.colmask {
		position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	    clear:both;
	    float:left;
        width:100%;				/* width of whole page */
		overflow:hidden;		/* This chops off any overhanging divs */
	}
	/* holy grail 3 column settings */
	.holygrail {
	    background:0;    	/* Right column background colour */
	}
    .holygrail .colmid {
        float:left;
        width:200%;
        margin-left:-280px; 	/* Width of right column */
        position:relative;
        right:100%;
         background:0;    /*	Centre column background colour */
    }
    .holygrail .colleft {
        float:left;
        width:100%;
        margin-left:-50%;
        position:relative;
        left:560px;         	/* Left column width + right column width */
        background:0;    	/* Left column background colour */
    }
    .holygrail .col1wrap {
        float:left;
	    width:50%;
	    position:relative;
	    right:280px;        	/* Width of left column */
	    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
	}
	.holygrail .col1 {
        margin:0 280px 0 280px;	/* Centre column side padding:
                            	Left padding = left column width + centre column left padding width
                            	Right padding = right column width + centre column right padding width */
        position:relative;
	    left:200%;
	    overflow:hidden;
	}
    .holygrail .col2 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:280px;        	/* Width of left column content (left column width minus left and right padding) */
        position:relative;
        right:0px;         	/* Width of the left-hand side padding on the left column */
    }
    .holygrail .col3 {
        float:left;
        float:right;			/* This overrides the float:left above */
        width:280px;        	/* Width of right column content (right column width minus left and right padding) */
        margin-right:0px;  	/* Width of right column right-hand padding + left column left and right padding */
        position:relative;
        left:50%;
    }

	/* Footer styles */
	footer {
        clear:both;
		background:#000;
		margin-left:280px;
		padding:15px;
		text-align:center;

		
    }
		
/* Had to make up for some margin I couldn't find the source of *
.holygrail {
 margin-bottom: -15px !important;
}
	
/* Needed because of the fixed position header
.col3 {
	padding-top:120px;
}
.holygrail {
	top:-120px;
} */



.box {
	margin:10px;
	padding:10px;
	float:left;
	width:240px;
	background:url(images/bg-black.png);
	border-radius:12px;
	color:#ccc;
}
.box strong {
	color:#fff;
}



/* Programs page */
.programs img {
	float:left;
	margin:0 10px 0px 0;
}
.programs div {
	clear:both;
	float:left;
	margin:0 0 15px 0;
	padding:10px;
	box-shadow:0 2px 4px #666;
	behavior:url(http://reachconcertseries.com/public/ie/PIE.htc);
	position:relative;
	background:#fff;
}
.programs h4 {
	margin:0 0 10px 0;
	padding:3px 15px 3px 0;
	background:#222;
	text-align:right;
}

/* Sponsors */
.sponsor-images {
	width:80%;
	padding:20px 10%;
	background:#fff;
	text-align:center;
	float:left;
}
.sponsor-images img {
	margin:0 0 10px;
}


/* Music */
.music .performer {
	position:relative;
	margin:0 0 15px;
}
.music h3 {
	position:absolute;
	top:2px;
	left:2px;
	z-index:10;
	padding:0;
	color:#fff;
	float:left;
	background:#222;
	padding:8px;
	border-radius:4px;
	filter: alpha(opacity=80);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	opacity:.8;
}
.music img {
}


/* Videos */
.videos {
	text-align:center;
}
.videos div {
    background:#222;
	margin:20px 0 0;
	padding:15px;
	overflow:hidden;
	border-radius:8px;
}
.videos h5 {
	margin:0 0 15px 0;
	padding:0;
}
.videos embed,
.videos iframe {
	
}



#poll-container {
	width:250px;
	float:left;
	margin:10px 0;
	padding:15px;
	clear:both;
	height:340px;
	display:block;
	color:#fff;
	background:#333;
}
#poll-container input:focus + label,
#poll-container label:hover {
	color:#FF6600;
}

/* Bar Graphs */

.bar-title {
  position: relative;
  float: left;
  width: 250px;
  line-height: 20px;
  margin-right: 0px;
  font-weight: 100;
  text-align: left;
}
.bar-container {
  position: relative;
  float: left;
  width: 250px;
  height: 10px;
  margin: 0px 0px 15px;
}

.bar-container div {
  background-color:#cc4400;
  height: 20px;
}
.bar-container strong {
  position: absolute;
  right: -2px;
  top: 0px;
  overflow: hidden;
}

#poll-results p {
  text-align: center;
}


/* Twitter feed */
#twitter-feed{min-height:200px}
#twitter-feed-wrapper{clear:both;font-size:80%;padding:1em;}
#twitter-feed li{margin:0 5px 1em;}


.button {
	cursor:pointer;
	-moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	box-shadow:inset 0px 1px 0px 0px #bbdaf7;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
	background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
	background-color:#79bbff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #84bbf3;
	display:inline-block;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:1px 1px 0px #528ecc;
}.button:hover {
	color:#fff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
	background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
	background-color:#378de5;
}.button:active {
	position:relative;
	top:1px;
}


.current-promo {
	background:#eee;
	padding:1em;
	border:1px solid #ccc;
	border-radius:10px;
	margin:0 0 1em;
}
.current-promo .center {
	text-align:center;
}


/* Fundraiser Thermometer */
.thermometer-wrapper {
	margin:0;
	position:relative;
}

.thermometer {
	width:20px;
	height:200px;
	background:#aaa;
	position:relative;
	float:left;
	margin:0 70px 10px 20px;
	
	/* Compensate for bubble */
	margin-bottom:20px;
	/**/
}

.thermometer-value {
	width:100%;
	background:#ca0619;
	position:absolute;
	bottom:0;
	left:0;
	border-bottom:1px solid #000;
	white-space:nowrap;
}

/* PIE won't do psuedo elements? *
.thermometer-value:after {
/**/
.thermometer-bubble {
	content:" ";
	display:block;
	width:40px;
	height:40px;
	border-radius:20px;
	background:#ca0619;
	position:absolute;
	bottom:-20px;
	margin-left:-10px;
	behavior:url(http://reachconcertseries.com/public/ie/PIE.htc);
}

.thermometer-value span {
	color:#eee;
	font:14px Arial;
	background:#444;
	position:relative;
	z-index:100;
	margin-left:20px;
	padding:3px;
}

.thermometer-increment {
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	border-bottom:1px solid #000;
	display:block;
	white-space:nowrap;
	font:12px Arial;
	text-indent:25px;
}
.thermometer-increment span {
	position:relative;
	top:1em;
}




.sold-out {
	background:#111;
	letter-spacing:.2em;
	color:#ff0000;
	text-transform:uppercase;
	text-align:center;
	padding:.5em;
	margin:0;
	font:900 22px "Arial Black",Arial,sans-serif;
}
/* end file */
