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

/*containers*/

#containerstart{
	width: 650px;
	height: 400px;
	left: 0px;
	top: 184px;
	position:relative;
	margin-left:170px;
}
#buttoncontainer{
	width:650px;
	height:50px;
	left: 175px;
	top:195px;
	z-index:2;
	position:fixed;
	
}
#containerspindle{
	width: 650px;
	height: 1160px;
	left: 0px;
	top: 184px;
	position:relative;
	margin-left:170px;
}
#containerspindle2{
	width: 650px;
	height: 400px;
	left: 0px;
	top: 184px;
	position:relative;
	margin-left:170px;
}

#containerportfolio{
	width: 650px;
	height: 1050px;
	left: 0px;
	top: 191px;
	position:relative;
	margin-left:170px;
}
#containerresume{
	width: 650px;
	height: 400px;
	left: 0px;
	top: 184px;
	position:relative;
	margin-left:170px;
}
#containerillustration{
	width: 650px;
	height: 800px;
	left: 0px;
	top: 191px;
	position:relative;
	margin-left:170px;
}
/*text*/

#spindletext{
	color:#8C9437;
	top:50px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}

#unavailabletextenglish{
color:#8C9437;
	top:440px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}

#unavailabletextjapanese{
color:#8C9437;
	top:430px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}

#unavailabletextenglish2{
color:#8C9437;
	top:565px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}

#unavailabletextjapanese2{
color:#8C9437;
	top:555px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}
#unavailabletextenglish3{
color:#8C9437;
	top:635px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}

#unavailabletextjapanese3{
color:#8C9437;
	top:625px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:0px;
}


#resumetext{
	color:#36875A;
	top:50px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:none;
}
#resumetextjapanese{
	color:#36875A;
	top:50px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:none;
}
#starttext{
	color:#A97D50;
	top:50px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:none;
}
#starttextjapanese{
	color:#A97D50;
	top:50px;
	position:relative;
	left:0px;
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size:15px;
	padding:none;
}
/*menu buttons for each page*/
#resumebuttonstart{
	top: -4px;
	left: 377px;
	position: absolute;
}
#illustrationbuttonstart{
	top:0px;
	left:124px;
	position:absolute;
}
#portfoliobuttonstart{
	top:0px;
	left:0px;
	position:absolute;
}
#spindlebuttonstart{
	top: 0px;
	left: 284px;
	position: absolute;
}
#resumebuttonillustration{
	top: -4px;
	left: 217px;
	position: absolute;
}
#portfoliobuttonillustration{
	top: 0px;
	left: 0px;
	position: absolute;
}
#spindlebuttonillustration{
	top: 0px;
	left: 125px;
	position: absolute;
}
#portfoliobuttonresume{
	top: 0px;
	left: 0px;
	position: absolute;
}
#illustrationbuttonresume{
	top: 0px;
	left: 124px;
	position: absolute;
}
#spindlebuttonresume{
	top: 0px;
	left: 284px;
	position: absolute;
}
#illustrationbuttonportfolio{
	top: 0;
	left: 0px;
	position:absolute;
}
#resumebuttonportfolio{
	top: -4px;
	left: 253px;
	position:absolute;
}
#spindlebuttonportfolio{
	top: 0px;
	left: 160px;
	position:absolute;
}
#illustrationbuttonspindle{
	top:0px;
	left:124px;
	position:absolute;
}
#resumebuttonspindle{
	top: -4px;
	left: 284px;
	position: absolute;
	width: 93px;
	height: 23px;
}
#portfoliobuttonspindle{
	top:0px;
	left:0px;
	position:absolute;
}

/*non-button graphics for each page*/

/*spindle graphic*/
#spindlelogos{
	top:200px;
	position:absolute;
}
#spindleconceptsketch{
	top:380px;
	position:absolute;
}
#spindlemerchandise{
	top:540px;
	position:absolute;
}
#spindlewebsite{
	top:740px;
	position:absolute;
}
#rotoscopingsnapshots{
	top:880px;
	position:absolute;
}
#spindleadvertisingposter{
	top:1020px;
	position:absolute;
}

/*illustration graphic*/
#modesnaclangraphic{
	top:90px;
	position:absolute;
}
#programmerangelgraphic{
	top:270px;
	position:absolute;
}
#miscellaneousartworkgraphic{
	top:410px;
	position:absolute;
}
#miscellaneoussketchesgraphic{
	top:590px;
	position:absolute;
}

/*portfolio graphic*/
#logodesigngraphic{
	top:90px;
	position:absolute;
}
#polyphonicguerrillasgraphic{
	top:270px;
	position:absolute;
}
#webdesigngraphic{
	top:410px;
	position:absolute;
}
#davidcarsongraphic{
	top:550px;
	position:absolute;
}
#corporateidentitygraphic{
	top:690px;
	position:absolute;
}
#miscprojectsgraphic{
	top:830px;
	position:absolute;
}

/*buttons for portfolio*/
#chatterboxbtn {
	position: absolute;
	top: 116px;
	left: 0px;
}
#dhbtn {
	position:absolute;
	top:116px;
	left: 210px;
}
#homtownbtn {
	position:absolute;
	top:116px;
	left: 42px;
}
#inklinebtn {
	position:absolute;
	top:116px;
	left:84px;
}
#mahonybtn {
	position:absolute;
	top:116px;
	left:126px;
}

#nubuxbtn {
	position:absolute;
	top:116px;
	left: 168px;
}
#ohana2btn {
	position:absolute;
	top:116px;
	left: 294px;
}
#ohanabtn {
	position:absolute;
	top:116px;
	left: 252px;
}
#sayuritabtn {
	position:absolute;
	top:116px;
	left:462px;
}
#polyphonicbtn {
	position:absolute;
	top:158px;
	left:0px;
}
#gmibtn {
	position:absolute;
	top:158px;
	left:42px;
}
#remodelbtn {
	position:absolute;
	top:158px;
	left:84px;
}
#horiebtn {
	position:absolute;
	top:158px;
	left:126px;
}
#leftbtn {
	position:absolute;
	top:158px;
	left:168px;
}
#tachibanabtn {
	position:absolute;
	top:158px;
	left:210px;
}
#omobtn {
	position:absolute;
	top:158px;
	left:252px;
}
#intrepidbtn {
	position:absolute;
	top:158px;
	left:294px;
}
#yenbtn {
	position:absolute;
	top:116px;
	left:336px;
}
#kbkbtn {
	position:absolute;
	top:116px;
	left:420px;
}
#aegbtn {
	position:absolute;
	top:116px;
	left:378px;
}
#cdalbumbtn {
	position: absolute;
	top: 297px;
	left: 0px;
}
#cdlabelbtn {
	position:absolute;
	top:297px;
	left: 42px;
}

#merchandisebtn {
	position:absolute;
	top:297px;
	left:84px;
}
#corpidpuzzle1btn {
	position: absolute;
	top: 715px;
	left: 0px;
}

#corpidpuzzle2btn {
	position:absolute;
	top:715px;
	left:42px;
}

#corpid3btn {
	position:absolute;
	top:715px;
	left:84px;
}

#davidcarsonbtn {
	position: absolute;
	top: 575px;
	left: 0px;
}

#page1btn {
	position: absolute;
	top: 436px;
	left: 0px;
}

#page2btn {
	position:absolute;
	top:436px;
	left:42px;
}

#page3btn {
	position:absolute;
	top:436px;
	left:84px;
}

#teapot1btn {
	position: absolute;
	top: 855px;
	left: 0px;
}
#teapot2btn {
	position: absolute;
	top: 855px;
	left: 42px;
}
#teapot3btn {
	position: absolute;
	top: 855px;
	left: 84px;
}
#teapot4btn {
	position: absolute;
	top: 855px;
	left: 126px;
}



/*buttons for spindle logos*/

#infinixbtn {
	position: absolute;
	top: 230px;
	left: 0px;
}
#tetsurobtn {
	position:absolute;
	top:230px;
	left: 42px;
}
#missionramenbtn {
	position:absolute;
	top:230px;
	left:84px;
}
#mondopupsbtn {
	position:absolute;
	top:230px;
	left: 126px;
}
#musclepunchbtn {
	position:absolute;
	top:230px;
	left: 168px;
}
#GCbtn {
	position:absolute;
	top:230px;
	left: 210px;
}
#happytaxibtn {
	position:absolute;
	top:230px;
	left: 252px;
}
#herzogbtn {
	position:absolute;
	top:230px;
	left: 294px;
}
#coffeebtn {
	position:absolute;
	top:230px;
	left: 336px;
}
#happycompanybtn {
	position:absolute;
	top:230px;
	left: 378px;
}
#arisakabtn {
	position:absolute;
	top:230px;
	left: 420px;
}
#sellarsjacobsbtn {
	position:absolute;
	top:230px;
	left: 462px;
}
#prabtn {
	position:absolute;
	top:272px;
	left: 0px;
}
#rheinerbtn {
	position:absolute;
	top:272px;
	left: 42px;
}
#fujiwarabtn {
	position:absolute;
	top:272px;
	left: 84px;
}
#hoverlimobtn {
	position:absolute;
	top:410px;
	left: 0px;
}
#hoverlimo2btn {
	position:absolute;
	top:410px;
	left: 42px;
}
#interceptor1btn {
	position:absolute;
	top:410px;
	left: 84px;
}
#interceptor2btn {
	position:absolute;
	top:410px;
	left: 126px;
}
#interceptor3btn {
	position:absolute;
	top:410px;
	left: 168px;
}
#liftingbodybtn {
	position:absolute;
	top:410px;
	left: 210px;
}
#taxitruckbtn {
	position:absolute;
	top:410px;
	left: 252px;
}

#spindleadposterbtn {
	position:absolute;
	top:1050px;
	left: 0px;
}

/*for copywright text*/

#copywrightaboutmestart {
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	
	font-size: 12px;
	font-style: normal;
	color: #A97D50;
	top: 180px;
	text-align: left;
	left:170px;
	position: relative;
	bottom: 0px;
	padding-left: 0px;
	padding-right:100px;
	padding-bottom:40px;
	padding-top: 40px;
}

#copywrightaboutmeportfolio {
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	
	font-size: 12px;
	font-style: normal;
	color: #BA7028;
	top: 140px;
	text-align: left;
	left:170px;
	position: relative;
	bottom: 0px;
	padding-left: 0px;
	padding-right:100px;
	padding-bottom:40px;
	padding-top: 40px;
}
#copywrightaboutmespindle {
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	
	font-size: 12px;
	font-style: normal;
	color: #666633;
	top: 140px;
	text-align: left;
	left:170px;
	position: relative;
	bottom: 0px;
	padding-left: 0px;
	padding-right:100px;
	padding-bottom:40px;
	padding-top: 40px;
}
#copywrightaboutmeresume {
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #368762;
	left: 162px;
	top: 160px;
	text-align:left;
	position: relative;
	bottom: 0px;
	padding-left: 0px;
	padding-right:100px;
	padding-bottom:40px;
	padding-top: 40px;
}
#copywrightaboutmeillustration {
	font-family: HelveticaNeue-Light, Helvetica-Neue-Light, HelveticaNeueLight, Verdana, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #225A7D; 
	top: 180px;
	text-align: left;
	left:170px;
	position: relative;
	bottom: 0px;
	padding-left: 0px;
	padding-right:100px;
	padding-bottom:40px;
	padding-top: 40px;
}

/*These are the buttons for the Illustration section*/ 
#kunibtn {
	position: absolute;
	top: 120px;
	left: 0px;
}
#duncanbtn {
	position: absolute;
	top: 120px;
	left: 42px;
}
#mastressjunobtn {
	position: absolute;
	top: 120px;
	left: 84px;
}
#mastressnewbtn {
	position: absolute;
	top: 120px;
	left: 126px;
}
#mastressdivinebtn {
	position: absolute;
	top: 120px;
	left: 168px;
}
#modesnachildbtn {
	position: absolute;
	top: 120px;
	left: 210px;
}
#montressbtn {
	position: absolute;
	top: 120px;
	left: 252px;
}
#stellabtn {
	position: absolute;
	top: 120px;
	left: 294px;
}

#swinggirlbtn {
	position: absolute;
	top: 120px;
	left: 336px;
}
#teapartyraidbtn {
	position: absolute;
	top: 120px;
	left: 378px;
}
#vyebtn {
	position: absolute;
	top: 120px;
	left: 420px;
}
#youngtyberiosbtn {
	position: absolute;
	top: 120px;
	left:462px;
}
#penbtn {
	position: absolute;
	top: 162px;
	left:0px;
}
#oldtyberiosbtn {
	position: absolute;
	top: 162px;
	left:42px;
}
#proangbtn1 {
	position: absolute;
	top: 300px;
	left: 0px;
}
#proangbtn2 {
	position: absolute;
	top: 300px;
	left: 42px;
}
#proangbtn3 {
	position: absolute;
	top: 300px;
	left: 84px;
}
#colinpowellbtn {
	position: absolute;
	top: 441px;
	left: 0px;
}
#cosmiquitabtn {
	position: absolute;
	top: 441px;
	left: 42px;
}
#fiatbtn {
	position: absolute;
	top: 441px;
	left: 84px;
}
#kantarubtn {
	position: absolute;
	top: 441px;
	left: 126px;
}
#selfportrait1btn {
	position: absolute;
	top: 441px;
	left: 168px;
}
#selfportrait2btn {
	position: absolute;
	top: 441px;
	left: 210px;
}
#yukikobtn {
	position: absolute;
	top: 441px;
	left: 252px;
}
#androidgeishabtn {
	position: absolute;
	top: 441px;
	left: 294px;
}
#untitledbtn {
	position: absolute;
	top: 441px;
	left: 336px;
}
#clothingfoldsbtn {
	position: absolute;
	top: 621px;
	left: 0px;
}
#proang05btn {
	position: absolute;
	top: 621px;
	left: 42px;
}
#proang07btn {
	position: absolute;
	top: 621px;
	left: 84px;
}
#kantarusketchbtn {
	position: absolute;
	top: 621px;
	left: 126px;
}
#modesnaqueensketchbtn {
	position: absolute;
	top: 621px;
	left: 168px;
}
#andradesketchbtn {
	position: absolute;
	top: 621px;
	left: 210px;
}
#recruitsbtn {
	position: absolute;
	top: 621px;
	left: 252px;
}
#yukikosketchbtn {
	position: absolute;
	top: 621px;
	left: 294px;
}
#andrademodesnasketchbtn {
	position: absolute;
	top: 621px;
	left: 336px;
}

#kimonogirlsketchbtn {
	position: absolute;
	top: 621px;
	left: 378px;
}
#tyberiosnewbtn {
	position: absolute;
	top: 621px;
	left: 420px;
}