/* Resets with HTML5 */
/********************************************************/
html, body, div, span, applet, object, button, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, u, ul, ol, li, i, center, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, a img { margin: 0; padding: 0; border: 0; outline: none; font-size: 100%; font: inherit; }
img{ line-height:0px; vertical-align:top; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
sup, sub { height: 0; line-height: 1; vertical-align:baseline; _vertical-align:bottom; position:relative; font-size:.8em }
sup { bottom:.4em; }
sub { top: .5ex; }
strong{ font-weight:bold; }
h1,h2,h3,h4,h5,h6{ font-weight:normal; }
p{ margin:15px 0; }
section > p:first-child,
div > p:first-child,
div > h1:first-child,
div > h2:first-child,
div > h3:first-child { margin-top:0px; }
button{ border:none; cursor:pointer; }
a{ text-decoration: none; } 


/* Fonts */
/********************************************************/
@font-face {
    font-family: 'merienda_oneregular';
    src: url('/assets/fonts/Meriendaone/meriendaone-regular-webfont.eot');
    src: url('/assets/fonts/Meriendaone/meriendaone-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/Meriendaone/meriendaone-regular-webfont.woff') format('woff'),
         url('/assets/fonts/Meriendaone/meriendaone-regular-webfont.ttf') format('truetype'),
         url('/assets/fonts/Meriendaone/meriendaone-regular-webfont.svg#merienda_oneregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'satisfyregular';
    src: url('/assets/fonts/Satisfy/satisfy-regular-webfont-webfont-webfont.eot');
    src: url('/assets/fonts/Satisfy/satisfy-regular-webfont-webfont-webfont.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/Satisfy/satisfy-regular-webfont-webfont-webfont.woff') format('woff'),
         url('/assets/fonts/Satisfy/satisfy-regular-webfont-webfont-webfont.ttf') format('truetype'),
         url('/assets/fonts/Satisfy/satisfy-regular-webfont-webfont-webfont.svg#satisfyregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* HTML Elements */
/********************************************************/
body {
	background: url(/assets/img/gplaypattern_@2X.png);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #333;
}

/*ul {
    overflow: auto;
} */

/* Common Classes */
/********************************************************/
.top-p{ margin-top:0px; }


/* Header */
/********************************************************/
#main-title{
	display: block;
	font:40px/45px 'satisfyregular';
	color:#000;
	padding:15px 0 0 30px;
}


/* Main and Sub Common */
/********************************************************/
.sub-nav li, .main-nav li{
	display: inline-block;
	*display:inline;
	*zoom:1;
}

/* Sub Nav */
/********************************************************/
.sub-nav{
	text-align: right;
	margin-bottom:5px;
}
.sub-nav a{
	display: inline-block;
	*display:inline;
	*zoom:1;
	color:#4F94CD;
	padding:1px 20px;
}
.sub-nav a:hover{
	color:#00008B;
}


/* Main Nav */
/********************************************************/
.main-nav{
	background:#000;
	font-size:0%;
	line-height: 0%;
}
.main-nav a{
	font-size:14px;
	line-height: 14px;
	color:#fff;
	display: inline-block;
	*display:inline;
	*zoom:1;
	padding:4px 30px;
	text-transform: uppercase;
}
.main-nav a:hover, .main-nav a.selected{
	color:#000;
	background:#ccc;
}


/* Content Styling */
/********************************************************/

#main-content{
	width:900px;
	-webkit-box-shadow: 3px 3px 5px 3px rgba(7, 3, 3, .2);
	box-shadow: 3px 3px 5px 3px rgba(7, 3, 3, .2);
	margin: 30px auto;
	padding:15px 30px 30px 30px;	
	background-image: url(/assets/img/billie_holiday_@2X.png);
}
#main-content header{
	text-align: center;
	padding:5px 0 20px 0;
}
#main-content header h1{
	font:30px/35px 'satisfyregular';
}
.sub-header{
	text-align: center;
	font-size:15px;
	line-height:19px;
	margin-bottom:30px;
}
.sub-header span{
	font:18px/18px 'merienda_oneregular';
}


	/* Home Page */
	/********************************************************/
	.home:after{
		content:'';
		display: block;
		clear:both;
	}
	.home img{
		float:left;
		margin-right:20px;
		border:solid 6px #4F94CD;
	}

	/* Accordian */
	/********************************************************/
	.accordian button{
		display: block;
		border-bottom:solid 1px #222;
		width: 100%;
		padding:10px 0;
		color:#fff;
		background: rgb(87,150,208);
		background: -moz-linear-gradient(top, rgba(87,150,208,1) 0%, rgba(61,109,153,1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(87,150,208,1)), color-stop(100%,rgba(61,109,153,1)));
		background: -webkit-linear-gradient(top, rgba(87,150,208,1) 0%,rgba(61,109,153,1) 100%);
		background: -o-linear-gradient(top, rgba(87,150,208,1) 0%,rgba(61,109,153,1) 100%);
		background: -ms-linear-gradient(top, rgba(87,150,208,1) 0%,rgba(61,109,153,1) 100%);
		background: linear-gradient(to bottom, rgba(87,150,208,1) 0%,rgba(61,109,153,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5796d0', endColorstr='#3d6d99',GradientType=0 );
	}
	.accordian button:hover, .accordian button.selected{
		background: rgb(61,109,153);
		background: -moz-linear-gradient(top, rgba(61,109,153,1) 0%, rgba(87,150,208,1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(61,109,153,1)), color-stop(100%,rgba(87,150,208,1)));
		background: -webkit-linear-gradient(top, rgba(61,109,153,1) 0%,rgba(87,150,208,1) 100%);
		background: -o-linear-gradient(top, rgba(61,109,153,1) 0%,rgba(87,150,208,1) 100%);
		background: -ms-linear-gradient(top, rgba(61,109,153,1) 0%,rgba(87,150,208,1) 100%);
		background: linear-gradient(to bottom, rgba(61,109,153,1) 0%,rgba(87,150,208,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d6d99', endColorstr='#5796d0',GradientType=0 );
	}
	.drop-down{
		padding:15px;
		background: #ececec;
		display: none;
	}
	.drop-down ul a{
		display: block;
		color:#fff;
		background:#222;
		padding:10px 15px;
		border-bottom:solid 1px #ccc;
		text-align: center;
	}
	.drop-down ul a:hover{
		background: #111;
	}

	.drop-down article ul{ margin-bottom:30px; text-align: center; }
	.drop-down article li{
		display: inline-block;
		*display:inline;
		*zoom:1;
		vertical-align: top;
		width:250px;
		height:250px;
	}
	.drop-down article li a{
		padding:0px;
	}
	.drop-down article li img{
		border:solid 1px #bbb;
	}
	.drop-down article li:nth-child(2){
		margin:0 40px;
	}
	


