/*master of everything*/
	
	body
	{
		background: #000000  url("cssimages/back.jpg") fixed top center no-repeat;
		font-family: 'Open Sans',sans-serif;
		font-size: 12px;
	}
	
/*chrome you are such a lil shit*/	
	.preload
	{		
		 -webkit-transition: none !important;
		 -moz-transition: none !important;
		 -ms-transition: none !important;
		 -o-transition: none !important;
	}

	h1,h2,h3,h4,h5,h6
	{
		font-family: 'Fredoka One',sans-serif;
		text-transform: uppercase;
		font-weight: 300;
	}

	a,
	a:link,
	a:visited
	{
		color: #df4291;
		text-decoration:none;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	a:hover,
	a:focus,
	a:active
	{
		color: #6d3d99;
		text-decoration: underline;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#dhome #topcontainer header
	{
		background: #584b75 url("cssimages/homehead.jpg") fixed top center no-repeat;
	}

	#dcharacters #topcontainer header
	{
		background: #703651 url("cssimages/charactershead.jpg") fixed top center no-repeat;
	}

	#dbeachcity #topcontainer header
	{
		background: #dcf1f2 url("cssimages/beachhead.jpg") fixed top center no-repeat;
	}

	#depisodes #topcontainer header
	{
		background: #8f7751 url("cssimages/episodeshead.jpg") fixed top center no-repeat;
	}

	#dmusic #topcontainer header
	{
		background: #d9feff url("cssimages/musichead.jpg") fixed top center no-repeat;
	}

	#dart #topcontainer header
	{
		background: #f8e8e3 url("cssimages/arthead.jpg") fixed top center no-repeat;
	}

	#dcrystalgems #topcontainer header
	{
		background: #052a3f url("cssimages/crystalgemshead.jpg") fixed top center no-repeat;
	}

	#dbeachcitycitizens #topcontainer header
	{
		background: #835564 url("cssimages/beachcitycitizenshead.jpg") fixed top center no-repeat;
	}

	#dhomeworldgems #topcontainer header
	{
		background: #02172a url("cssimages/homeworldgemshead.jpg") fixed top center no-repeat;
	}

	#dseason1 #topcontainer header
	{
		background: #ff7f7a url("cssimages/season1head.jpg") fixed top center no-repeat;
	}

	#dseason1 #topcontainer header
	{
		background: #ff7f7a url("cssimages/season1head.jpg") fixed top center no-repeat;
	}

	#dseason2 #topcontainer header
	{
		background: #f0dec5 url("cssimages/season2head.jpg") fixed top center no-repeat;
	}

	#dother #topcontainer header
	{
		background: #444349 url("cssimages/otherhead.jpg") fixed top center no-repeat;
	}

	#dmseason1 #topcontainer header
	{
		background: #0d0010 url("cssimages/mseason1head.jpg") fixed top center no-repeat;
	}

	#dmseason2 #topcontainer header
	{
		background: #ee9eac url("cssimages/mseason2head.jpg") fixed top center no-repeat;
	}

	#ddemos #topcontainer header
	{
		background: #42373d url("cssimages/demoshead.jpg") fixed top center no-repeat;
	}

	#dconceptart #topcontainer header
	{
		background: #d5e5f6 url("cssimages/conceptarthead.jpg") fixed top center no-repeat;
	}

	#dstoryboards #topcontainer header
	{
		background: #fff url("cssimages/storyboardshead.jpg") fixed top center no-repeat;
	}

	#dcrew #topcontainer header
	{
		background: #fff url("cssimages/crewhead.jpg") fixed top center no-repeat;
	}

	#topcontainer
	{
		min-width: 960px;
		z-index: 10;
	}

	/*shitstorm*/

	header
	{
		height: 300px;
	}

	header #logocontainer
	{
		width: 960px;
		height: 157px;
		display: block;
		position: relative;
		top: 68px;
		margin: 0 auto;
	}


	header #logocontainer h1 #logo
	{
		width: 425px;
		height: 157px;
		display: block;
		background: url("cssimages/logo.png") no-repeat top left;
		text-decoration:none;
		color: transparent;
		text-indent:-999999999999999999;
	}

	nav
	{
		height: 50px;
		background: #000;
		overflow: hidden;
	}

	nav ul
	{
		width: 960px;
		margin: 0px auto;
		text-align: center;
	}

	nav ul li
	{
		display: inline-block;
		font-size: 17px;
		letter-spacing:1px;
	}

	nav ul li a,
	nav ul li a:link,
	nav ul  li a:visited
	{
		font-family: 'Fredoka One',sans-serif;
		font-weight: 300;
		text-transform: uppercase;
		display: block;
		padding: 16px 0px 17px;
		margin: 0px 16px;
		color: #fff;
		border-bottom: #b22a91 5px solid;
		text-decoration: none;	
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	.current,
	.current:link,
	.current:visited
	{
		padding: 16px 0px 17px;
		background: url("cssimages/currentnav.gif") top left repeat-x ;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	nav ul li a:hover,
	nav ul li a:focus,
	nav ul li a:active,
	.current:hover,
	.current:focus,
	.current:active
	{
		border-bottom: #b22a91 5px solid;
		padding: 16px 0px 12px;
		transition: 1s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}



	#container
	{
		background: #fff url(cssimages/sideback.gif) top right repeat-y;
		width: 960px;
		margin: 0px auto;
		z-index: 9;
		box-shadow: 0px 0px 20px #000;
		-moz-box-shadow: 0px 0px 20px #000;
		-ms-box-shadow: 0px 0px 20px #000;
		-webkit-box-shadow: 0px 0px 20px #000;
		-o-box-shadow: 0px 0px 20px #000;
	}

	#container.fullcontainer
	{
		background: #fff;
	}

	main
	{
		width:630px;
		padding: 37px 45px 45px;
	}



	#directory
	{
		width:855px;
		padding: 37px 60px 45px 45px;
	}

	.gallery
	{
		width:960px;
		padding: 0px 0px 0px 0px;
		text-align: center;
	}

	#sided
	{
		width:615px;
		padding: 37px 45px 45px 45px;
		float:left;
	}

	main h2
	{
		font-size: 32px;
		line-height:40px;
		margin-bottom: 30px;
		color: #b22a91;
	
	}

	h2.dirh2
	{
		font-size: 32px;
		line-height:40px;
		margin-bottom: 10px;
		width:575px;	
		color: #b22a91;
	
	}

	main h3
	{
		font-size: 24px;
		margin: 30px 0px 15px;
	}

	main h4
	{
		font-size: 18px;
		margin-bottom: 5px;
	}

	main p
	{
		margin-bottom: 15px;
		line-height: 18px;
	}


	main>div.threecol
	{
		
		column-count: 3;
		-moz-column-count: 3;
		-webkit-column-count: 3;
		column-gap: 10px;
		-moz-column-gap: 10px;
		-webkit-column-gap: 10px;
		margin-bottom: 20px;
	}

	main>div.twocol
	{
		column-count: 2;
		-moz-column-count: 2;
		-webkit-column-count: 2;
		column-gap: 10px;
		-moz-column-gap: 10px;
		-webkit-column-gap: 10px;
		margin-bottom: 20px;
	}
	
	

/*when chrome is such an asshole*/
	div.threecol>ol>li,
	div.twocol>ol>li
	{
		margin-left: 36px;
	}

	div.threecol>ol>li>a,
	div.twocol>ol>li>a 
	{
		outline: none;
	}
/*fuck u chrome*/

	main div.bgallery
	{
		padding: 0px 45px;
		text-align: left;
	}

	main div.ginfo
	{
		padding: 45px;
	}

	main img.feature
	{
		float: left;
		margin: 5px 25px 45px 0px;
	}

	main img.mainfeature
	{
		margin: 15px 25px 20px 0px;
	}

/*list*/

	main ol
	{
		margin-bottom: 50px;
	
	}
	main ul.stats
	{
		margin: 0px 0px 20px;
		font-size: 14px;
		line-height: 20px;
	}

	main .stats li
	{
		list-style-type: none;
	}

	main .crewcontainer
	{
		margin-top: 30px;
	}

	main ul.crewlist
	{
		margin: 0px 10px 45px;
		float: left;
		width: 197px;
	}

	main ul.crewlist li
	{
		list-style-type: none;
		padding: 2px 0px;
	}

	main ul.crewlist li>ul
	{
		margin: 0px 0px 10px 18px;
	}

	main ul.crewlist li>h3
	{
		font-size: 18px;
		line-height: 24px;
		margin: 0px 0px 5px;
	}

	main ol.epsum li
	{
		padding: 2px 0px; 2px;
		margin-left: 36px;
	}


	main ol.eplist li
	{
		list-style-type: none;
		clear: both;
		height: 150px;
		padding-top: 15px;
	}

	main ol.eplist li img
	{
		list-style-type: none;
		float: left;
		padding: 0px 20px 0px 0px;	
	}


	main ol.songlist > li
	{
		list-style-type: none;
		clear: both;
		height: 150px;
		padding-top: 15px;
	}

	main ol.songlist > li > div.vid
	{
		list-style-type: none;
		width: 300px;
		float: left;
		padding: 0px 20px 0px 0px;
	
	}

	main ol.songlist > li > div.info
	{
		list-style-type: none;
		width: 257px;
		float: right;
		float: left;
		padding: 0px 20px 0px 0px;
	
	}

	ul.thumblist 
	{
		text-align: left;
	}

	main .thumblist li
	{
		width:160px;
		height:125px;
		text-align: left;
		display: inline-block;
		margin: 30px 5px 0px;
		overflow:hidden;
	}

	ul.center 
	{
		margin: 0px auto;
		display: block;
	}

	.thumblist li
	{
		width:160px;
		height:125px;
		text-align: left;
		display: inline-block;
		margin: 10px 5px 0px;
		overflow:hidden;
	}


	.qnimg
	{
		width:160px;
		height:125px;
	}

	.qnthumb a.qntitle,
	.qnthumb a.qntitle:link
	{
		color: #fff;
		width:136px;
		text-transform: uppercase;
		text-decoration: none;
		display: block;
		height:10px;
		width: 136px;
		font-family: 'Fredoka One',sans-serif;
		font-weight:300;
		font-size: 11px;
		padding: 10px 12px;
		border-bottom: #b22a91 5px solid;	
		background: rgba(0,0,0,.8);
		position:relative;
		top: -30px;		
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	.qnthumb:hover > a.qntitle
	{
		border-bottom: #b22a91 5px solid;	
		padding: 10px 12px 6px;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	ul.ggallery
	{
		padding: 20px 45px 45px;
		width: 870px;
		position: relative;		
		-moz-column-count: 3;
		-moz-column-gap: 20px;
		-webkit-column-count: 3;
		-webkit-column-gap: 20px;
		column-count: 3;
		column-gap: 20px;
	}


	ul.ggallery li
	{
		display: block;
		list-style-type: none;
		width: 280px;
		margin: 0px 0px 20px;
	}

	ul.ggallery>li>a
	{
		outline: none;
	}

/*green boxes*/

	#quicknavb
	{
		clear: left;
		background: #d5edeb;
		padding: 37px 45px 45px;
	}

	#quicknavb h3
	{
		font-size: 27px;
		line-height:40px;
		margin-bottom: 10px;
		color: #b22a91;
	
	}

	#quicknavs
	{
		width: 195px;
		float:right;
		padding: 30px 30px 45px;
	}

	#quicknavs h3 a,
	#quicknavs h3 a:link,
	#quicknavs h3 a:visited
	{
		font-size: 20px;
		line-height: 25px;
		color: #4c8d88;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}
	
	#quicknavs h3 a:hover,
	#quicknavs h3 a:focus,
	#quicknavs h3 a:active
	{
		color: #6cada8;
		text-decoration: underline;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#quicknavs h4 a,
	#quicknavs h4 a:link,
	#quicknavs h4 a:visited
	{
		font-size: 15px;
		line-height: 14px;
		text-transform: none;
		font-family: 'Open Sans',sans-serif;
		color: #be3785;
		font-weight: 700;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#quicknavs h4 a:hover,
	#quicknavs h4 a:focus,
	#quicknavs h4 a:active
	{
		color: #6d3d99;
		text-decoration: underline;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#quicknavs ul
	{
		text-indent: 18px;
	
	}


	#quicknavs ul li ul
	{
		text-indent: 36px;
		margin-bottom: 20px;
	}


	#quicknavs li
	{
		list-style-type: none;
		font-size: 12px;
		margin: 10px 0px;
	
	}

	#quicknavs a,
	#quicknavs a:link,
	#quicknavs a:visited
	{
		color: #b22Sung in final version bya91;
		text-decoration:none;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#quicknavs a:hover,
	#quicknavs a:focus,
	#quicknavs a:active
	{
		color: #6d3d99;
		text-decoration: underline;
		transition: .25s ease-in-out;
		-moz-transition: .25s ease-in-out;
		-ms-transition: .25s ease-in-out;
		-webkit-transition: .25s ease-in-out;
		-o-transition: .25s ease-in-out;
	}

	#quicknavt
	{
		padding: 30px;
		margin-bottom:45px;
		font-size: 14px;
		background: #d5edeb;
	}

	#quicknavt ul li
	{
		display: inline;
	}

	#buttop
	{
		position: fixed;
		bottom: 25px;
		right: 25px;
		height: 90px;
		width:90px;
	}

	#buttop a
	{
		display: block;
		text-indent:-999999999999999999px;
		overflow: hidden;
		background: url("cssimages/buttop.png");
		height: 90px;
		width:90px;
	}

	footer
	{
		background: #6d3d99;
		height: 14px;
		clear: both;
		padding: 18px 20px;
		font-size:12px;
	}

	#credit
	{
		float: left;
		width: 190px;
	}

	#credit a,
	#credit a:link,
	#credit a:visited
	{
		color: #fff;
		text-decoration:none;
	}

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

	#disclaim
	{
		float:right;
		text-align:right;
		width:700px;
		color: #d8b4ff;
	}