/*!
 * Gridpak Beta CSS
 *
 * Generator - http://gridpak.com/
 * Created by @erskinedesign
 */
 
 body,
html,
div {
     margin: 0;
     padding:0;
 }

/* Reusable column setup */
.col {
    border:0px solid rgba(0,0,0,0);
    float:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -moz-background-clip:padding-box !important;
    -webkit-background-clip:padding-box !important;
    background-clip:padding-box !important;
	width:100%;
}
.clear{
	clear:both;
}

/* Old Phone */

body{
	background:#010A1A;	
	overflow-x:hidden;
	color: #FFFFFF;
	font-family:arial;
	font-size:13px;
}

header{
	text-align:center;
	position:relative;
	z-index: 101;
	padding-top:10px !important;
}
header h1, header h2{
	text-indent:-10000px;
	font-size:0.1px;
}

h2{
	color:#c42323;
	font-size:16px;
}

h3 a{
	text-decoration:none;
}
h3 a:hover{
	text-decoration:underline;
}

a, .delete{
	color:#c42323;
}

h3{
	color:#c42323;
	margin-bottom:5px;
	font-size:13px;
}

p{
	margin-top:5px;
	margin-bottom:5px;
}




#clouds{
	background:url(../images/cloudsSmall.png) no-repeat center top;
	width: 100%;
	height:80px;
	position: absolute;
	z-index: 100;
	top: 0;
}

header h1{
	background:url(../images/headerSmall.png) no-repeat;
	height:44px;
	width:250px;
	background-size: cover;
	-ms-behavior: url(/css/backgroundsize.min.htc);
	margin:0 auto;
	position:relative;
	margin-top:-7px;
}

nav{
	position:relative;
	margin-top:-27px;
	margin-left:-108px;
	left:50%;
	z-index:200;
	font-size: 16px;
	width: 250px;
	font-size:13px;
}
nav ul{
	list-style:none;
	padding-left:0;
	margin-top:0;
	width: 250px;
}
nav li{
	float:left;
	padding-right:10px;
}
nav a{
	color:#fff;
	text-decoration:none;
}
nav li.hover a{
	color:#C42323;
}

#navVideos{
	margin-left:20px;
}
#navMusic{
	padding-right:0;
}

#plaguedoctors{
	margin-left:-146px;
	position:absolute;
	left:50%;
	z-index:9;
	background:url(../images/plaguedoctorsSmall.png) no-repeat;
	width:300px;
	height:245px;
	background-size: cover;
	-ms-behavior: url(/css/backgroundsize.min.htc);
	margin-top:31px;
}

#maincontent{
    position: relative;
    width: 241px;
	z-index: 10;
	margin-left:-121px;
	left:50%;
	padding-top:30px;
}

#contentWrapper{
	margin-top:0;
}

.biog img{
	margin-left:0 !important;
	width:240px;
}

.biog{
	margin-top:20px;
}

#maincontent iframe{
	width: 236px;
	height:133px;
}

#amazingaudioplayer-1{
	width:245px !important;
	margin:0 !important;
}

.amazingaudioplayer-bar{
	margin:0 !important;
}

.picturegallery h2{
	margin-left:43px;
}
.picturegallery img{
	margin-left:41px;
}

.videostillsgallery img{
	width:238px;
}

.pictures img{
	width:238px;
}

#admin{
	padding:20px;
}

#admin h2, #admin h3{
	color:#fff;
}

#admin a{
	color:#999;
}
#admin a.delete{
	color:red;
}

#admin #Logout{
	position: fixed;
    right: 20px;
	top:30px;
}

.headshot{
	float: left;
	margin-bottom: 4px;
	margin-right: 10px;
}

.news img{
	max-width: 244px;
}

/* Tablet */
@media screen and (min-width: 700px) {
	
	.col {
		margin-left:2%;
		padding:0 1.5%;
	}
	
	.row .col:first-child {
		margin-left:0;
	}
	
	.header{
		width:100.0%;
	}
	
	.navigation{
		width:30%;
	}
	
	
	body{
		background:#010A1A;	
	}
	
	#spotlight{
		position:fixed !important;
		background:url(../images/spotlightMedium.png) no-repeat;
		width:1397px;
		height:289px;
		margin-left: -495px;
		top: 407px;
		left:50%;
		/*opacity:0.1;*/
	}
	
	#clouds{
		background:url(../images/cloudsMedium.png) no-repeat center top;
		margin-top: -25px;
		position: fixed;
		height:177px;
	}
	
	header{
		margin: 0 !important;
		position:fixed;
		width:100%;
		padding-top:0 !important;
	}
	
	h2{
		font-size:18px;
		display:block;
	}
	h3{
		font-size:15px;
	}
	
	header h1{
		background:url(../images/headerLarge.png) no-repeat;
		height:70px;
		width:400px;
		background-size: cover;
		-ms-behavior: url(/css/backgroundsize.min.htc);
		margin-top:3px;
	}
	
	header h2{
		display:none;
	}
	
	#plaguedoctors{
		margin-left:-266px;
		margin-top:0;
		position:fixed;
		left:50%;
		z-index:9;
		top:99px;
		background:url(../images/plaguedoctors.png) no-repeat;
		width:586px;
		height:479px;
		background-size: cover;
		-ms-behavior: url(/css/backgroundsize.min.htc);
	}
	
	#contentWrapper{
		margin-top:138px;
	}
	
	#maincontent{
		position: relative;
		width: 441px;
		z-index: 10;
		margin-left:-202px;
		left:50%;
		padding-top:0;
	}
	
	nav{
		left: 50%;
		margin-left: -342px;
		top: 155px;	
		width:auto;
		margin-top:0 !important;
		position:fixed;
	}
	nav ul{
		padding-left: 0;
		width:134px;
	}
	nav li{
		float:none;
		padding-right:0;
	}
	nav ul li{
		list-style:none;
	}
	nav ul li a{
		text-indent:-100000px;
		font-size:1px;
		padding-bottom:5px;
		display:block;
	}
	nav #navWelcome a{
		background:url(../images/navWelcome.png) no-repeat;
	}
	nav #navWelcome.hover a{
		background:url(../images/navWelcomeHover.png) no-repeat;
	}
	nav #navWelcome a, nav #navWelcome.hover a{
		width:80px;
		height:22px;
		background-size:80px 22px;
	}
	
	nav #navNews a{
		background:url(../images/navNews.png) no-repeat;
	}
	nav #navNews.hover a{
		background:url(../images/navNewsHover.png) no-repeat;
	}
	nav #navNews a, nav #navNews.hover a{
		width:50px;
		height:20px;
		background-size:50px 20px;
	}
	
	nav #navBiography a{
		background:url(../images/navBiography.png) no-repeat;
		padding-bottom:3px;
	}
	nav #navBiography.hover a{
		background:url(../images/navBiographyHover.png) no-repeat;
	}
	nav #navBiography a, nav #navBiography.hover a{
		width:102px;
		height:25px;
		background-size:102px 25px;
	}
	
	nav #navMusic a{
		background:url(../images/navMusic.png) no-repeat;
	}
	nav #navMusic.hover a{
		background:url(../images/navMusicHover.png) no-repeat;
	}
	nav #navMusic a, nav #navMusic.hover a{
		width:61px;
		height:22px;
		background-size:61px 22px;
	}
	
	nav #navVideos a{
		background:url(../images/navVideo.png) no-repeat;
	}
	nav #navVideos.hover a{
		background:url(../images/navVideoHover.png) no-repeat;
	}
	nav #navVideos a, nav #navVideos.hover a{
		width:70px;
		height:22px;
		background-size:70px 22px;
	}
	
	nav #navPictures a{
		background:url(../images/navPictures.png) no-repeat;
	}
	nav #navPictures.hover a{
		background:url(../images/navPicturesHover.png) no-repeat;
	}
	nav #navPictures a, nav #navPictures.hover a{
		width:93px;
		height:22px;
		background-size:93px 22px;
	}
	
	nav #navFame a{
		background:url(../images/navFame.png) no-repeat;
	}
	nav #navFame.hover a{
		background:url(../images/navFameHover.png) no-repeat;
	}
	nav #navFame a, nav #navFame.hover a{
		width:50px;
		height:22px;
		background-size:50px 22px;
	}
	
	nav #navBlog a{
		background:url(../images/navBlog.png) no-repeat;
		width:62px;
		height:31px;
	}
	nav #navBlog.hover a{
		background:url(../images/navBlogHover.png) no-repeat;
	}
	nav #navBlog a, nav #navBlog.hover a{
		width:50px;
		height:25px;
		background-size:50px 25px;
	}
	
	#navVideos{
		margin-left:0;
	}
	
	.biog img{
		margin-left:0 !important;
		width:430px;
	}
	
	#maincontent iframe{
		width: 410px;
		height:231px;
	}
	
	#amazingaudioplayer-1{
		width:320px !important;
	}
	
	.picturegallery h2{
		margin-left:auto;
	}
	.picturegallery img{
		margin-left:auto;
	}
	
	.videostillsgallery img{
		width:458px;
	}
	
	.pictures img{
		width:auto;
	}
	
	.news img{
		max-width: 500px;
	}
	
}

/* Desktop */
@media screen and (min-width: 960px) {
	
	.col {
		margin-left:2%;
		padding:0 1.5%;
	}
	
	.row .col:first-child {
		margin-left:0;
	}
	
	.header{
		width:100.0%;
	}
	
	.main_content{
		width:68%;
	}
	
	#clouds{
		background:url(../images/cloudsLarge.png) no-repeat center top;
		margin-top: 0;
		height:254px;
	}
	
	h2{
		font-size:24px;
	}

	h3{
		font-size:18px;
	}
	
	header h1{
		height:95px;
		width:542px;
		background-size: 542px 95px;
		margin-top:10px;
	}
	
	header h2{
		background:url(../images/headerSub.png) no-repeat;
		height:29px;
		width:247px;
		margin:0 auto;
		display:block;
	}
	
	nav ul{
		width: 199px;
	}	
	
	#spotlight{
		background:url(../images/spotlight.png) no-repeat;
		width:1397px;
		height:289px;
		margin-left: -695px;
		top: 547px;
	}
	
	#plaguedoctors{
		margin-left:-367px;
		position:fixed;
		left:50%;
		z-index:9;
		top:168px;
		background:url(../images/plaguedoctors.png) no-repeat;
		width:786px;
		height:642px;
	}
	
	#maincontent{
		width: 551px;
		margin-left:-262px;
	}
	
	#contentWrapper{
		margin-top:232px;
	}
	
	nav{
		margin-left: -469px;
		top: 249px;	
	}
	nav #navWelcome a, nav #navWelcome.hover a{
		width:100px;
		height:27px;
		background-size:100px 27px;
	}
	nav #navNews a, nav #navNews.hover a{
		width:62px;
		height:25px;
		background-size:62px 25px;
	}
	nav #navBiography a, nav #navBiography.hover a{
		width:128px;
		height:31px;
		background-size:128px 31px;
	}
	nav #navMusic a, nav #navMusic.hover a{
		width:76px;
		height:27px;
		background-size:76px 27px;
	}	
	nav #navVideos a, nav #navVideos.hover a{
		width:88px;
		height:27px;
		background-size:88px 27px;
	}
	nav #navPictures a, nav #navPictures.hover a{
		width:116px;
		height:27px;
		background-size:116px 27px;
	}
	nav #navFame a, nav #navFame.hover a{
		width:63px;
		height:27px;
		background-size:63px 27px;
	}
	nav #navBlog a, nav #navBlog.hover a{
		width:62px;
		height:31px;
		background-size:62px 31px;
	}
	
	.biog img{
		margin-left:0 !important;
		width:auto;
		margin-top:15px;
	}
	
	.videostillsgallery img{
		width:auto;
	}
	
	.fame iframe{
		width:410px !important;
	}
	
	.news img{
		max-width: 630px;
	}
	
}