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


													/*Body Style*/


body {
	background-color: black;
	font-family: Arial, Helvetica, "sans-serif";
	color: white;
	margin: 0;
}

h1 {
	font-size: 40px;
	padding: 0px;
	text-align: center;
	text-decoration: none;
	padding-top: 20px;
}

h2 {
	font-size: 30px;
	padding: 0px;
	text-align: center;
	
}

h3 {
	font-size: 20px;
	padding: 0px;
	text-align: center;
}

h4 {
	font-size: 16px;
	padding: 0px;
	text-align: center;
}

p {
	padding: 0px;
	font-size: 18px;
	line-height: 1.5;
	font-weight: normal;
}


a:link {
	color: cyan;
	bacground-color: none;
	text-decoration: none;
}

a:hover figcaption {
	background-color: none;
	text-shadow: 2px 2px 0px #FF0000;
}



										/*Page Thumbnails CSS*/


.sketchmodelpagethumbnails {
	width: 100%;
	min-height: 80px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;
}

.sketchmodelpagethumbnails a {
	vertical-align: top;
	display: inline-block;
	*display: inline;
	zoom: 1; 
}

.stretchpage {
	width: 100%; 
	display: inline-block;
	font-size: 0px;
	line-height: 0px; 
}


img.storyboardpagethumb {
	display: inline-block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100px;
	height: 80px;
}

img.conceptsketchespagethumb {
	display: inline-block;
	position: absolute;
    left: 50%;
    margin-left: -50px;
	margin-right: auto;
	bottom: 0px;
	width: 100px;
	height: 80px;
}

img.sketchmodelpagethumb {
	display: inline-block;
	position: absolute;
	right: 0;
	bottom: 0;
	width: 100px;
	height: 80px;
}



													/*Title Page Style*/



div.titlepage {
	position: relative;
	width: 100%;
	margin: auto;
	display: block;
	top: 50px;
}

p.title {
	font-size: 60px;
	font-weight: bold;
	color: white;
	text-shadow: 5px 5px 0px #FF0000;
	width: 100%;
	text-align: center;
	position: absolute;
	display: block;
	top: 0px;
}

p.credits {
	font-size: 20px;
	color: white;
	text-shadow: 1px 1px 0px #FF0000;
	width: 100%;
	text-align: center;
	position: absolute;
	display: inline-block;
	top: 120px;
	
}


div.homepagethumbnails {
	width: 100%;
	min-height: 360px;
	padding: 0px;
	margin: 0px;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: absolute;
	bottom: 10px;
}

div.homepagethumbnails a {
	vertical-align: top;
	display: inline-block;
	*display: inline;
	zoom: 1; 
}

span.stretch {
	width: 100%; 
	display: inline-block; 
}


img.storyboardthumbnail {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 310px;
	height: auto;
}

img.conceptsketchesthumbnail  {
	position: absolute;
    left: 50%;
    margin-left: -125px;
	margin-right: auto;
	bottom: 0px;
	width: 250px;
	height: auto;
}

img.sketchmodelthumbnail  {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 280px;
	height: auto;
}

/*

figcaption.storyboardcaption {
	text-align: center;
	font-size: 30px;
	width: 310px;
	color: white;
	margin-top: 60px;
	margin-left: 20px;
}

figcaption.conceptsketchcaption{
	text-align: center;
	font-size: 30px;
	width: 280px;
	color: white;
	margin-top: 60px;
}

figcaption.sketchmodelcaption {
	text-align: center;
	font-size: 30px;
	width: 280px;
	color: white;
	margin-top: 60px;
	margin-right: 20px;
}
*/




												/*Storyboard Page Style*/
div.storyboardpage{
	width: 95%;
	min-height: 500px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	background-color: white;
	border-radius: 8px;
	position: relative;
}

h1.storyboardtitle {
	color: black;
}

img.homebutton {
	position: absolute;
	top: 5px;
	right: 5px;
	height: 55px;
}



div.mayhempart1 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody1 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard1 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart2 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody2 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard2 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart3 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody3 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard3 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart4 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody4 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard4 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart5 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody5 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard5 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart6 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody6 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard6 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart7 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody7 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard7 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.mayhempart8 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.mayhembody8 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.storyboard8 {
	display: block;
	float: right;
	width: 350px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}





												/*Concept Sketches Page Style*/
div.conceptsketchespage{
	width: 95%;
	min-height: 500px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	margin-bottom: 20px;
	background-color: white;
	border-radius: 8px;
	position: relative;
}

h1.conceptsketchestitle {
	color: black;
}

img.homebutton {
	position: absolute;
	top: 5px;
	right: 5px;
	height: 55px;
}

div.conceptsketchespart1 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.conceptsketchesbody1 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.conceptsketch1 {
	display: block;
	float: right;
	width: 300px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}


div.conceptsketchespart2 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.conceptsketchesbody2 {
	width: 60%;
	text-align: justify;
	right: 2%;
	position: absolute;
	top: 30%;
	color: black;
}

img.conceptsketch2 {
	display: block;
	float: left;
	width: 300px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.conceptsketchespart3 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.conceptsketchesbody3 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.conceptsketch3 {
	display: block;
	float: right;
	width: 300px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}





												/*Sketch Model Page Style*/
div.sketchmodelpage{
	width: 95%;
	min-height: 500px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-bottom: 75px;
	background-color: white;
	border-radius: 8px;
	position: relative;
}

h1.sketchmodeltitle {
	color: black;
}

img.homebutton {
	position: absolute;
	top: 5px;
	right: 5px;
	height: 55px;
}


div.sketchmodelpart0 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.sketchmodelbody0 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.sketchmodel0{
	display: block;
	float: right;
	width: 300px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}

div.sketchmodelpart1 {
	width: 90%;
	min-height: 400px;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.sketchmodelbody1 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 15%;
	color: black;
}

img.sketchmodel1{
	display: block;
	position: absolute;
	right: 5px;
	top: 10%;
	width: 30%;
	height: auto;
	border-radius: 8px;
}


div.sketchmodelpart2 {
	width: 90%;
	height: auto;
	padding-top: 10px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;	
} 

p.sketchmodelbody2 {
	width: 60%;
	text-align: justify;
	float: left;
	position: absolute;
	top: 20%;
	color: black;
}

img.sketchmodel2{
	display: block;
	float: right;
	width: 300px;
	height: auto;
	padding-top: 0px;
	border-radius: 8px;
}


div.sketchmodelpics1 {
	width: 100%;
	min-height: 500px;
	margin-bottom: 0px;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;
}

div.sketchmodelpics1 a {
	vertical-align: top;
	display: inline-block;
	*display: inline;
	zoom: 1; 
}

span.stretch {
	width: 100%; 
	display: inline-block; 
}

img.sketchmodelimage1 {
	display: inline-block;
	position: absolute;
	left: 5%;
	bottom: 0;
	width: 40%;
	height: auto;
}

img.sketchmodelimage2 {
	display: inline-block;
	position: absolute;
	right: 5%;
	bottom: 0;
	width: 40%;
	height: auto;
}

div.sketchmodelpics2 {
	width: 100%;
	min-height: 500px;
	margin-bottom: 0px;
	text-align: justify;
	display: block;
	overflow: hidden;
	position: relative;
}

div.sketchmodelpics2 a {
	vertical-align: top;
	display: inline-block;
	*display: inline;
	zoom: 1; 
}

span.stretch {
	width: 100%; 
	display: inline-block; 
}

img.sketchmodelimage3 {
	display: inline-block;
	position: absolute;
	left: 5%;
	bottom: 0;
	width: 40%;
	height: auto;
}

img.sketchmodelimage4 {
	display: inline-block;
	position: absolute;
	right: 5%;
	bottom: 0;
	width: 40%;
	height: auto;
}