html{
	height: 100%;
}
body {
	height: 100%;
	text-align: center;
	font-size: 22px;
}
#rightDiv {
	float: right;
	margin-right: 30px;
}
.rightDiv {
	-webkit-transform: translateZ(0);
	position: fixed;
	background-color:#FAB510;
	height: 100%;
	z-index: 1;
	writing-mode: vertical-rl;
}

#selfPic {
	position: relative;
	margin-right: 10%;
	float:right;
} 
#downLoadResume {
	position: relative;
	float: left;
	left:20%;
} 
#LinkedInLink{
	position: relative;
	float: right;
	right:20%;
}
#FilterGamesLink{
	position: relative;
	float: left;
	left:5%;
	background-color:#666666;
}
#LargeText {
	position: relative;
} 
#entry {
	position: relative;
	float:left;
	margin-left: 1%;
	text-align: left;
	padding: 20px;
	background-color:#666666;
	color:#000000;
	width:40%;
} 

#acc {
	position: relative;
	float:right;
	margin-right: 4%;
	padding: 20px;
	background-color:#040266;
	color:#EEEEEE;
	width:40%;
} 

.layerTitle{
	font-size: 10px;
	font-weight: lighter;
	float:left;
}
#currentProj {
	position: relative;
	float:left;
} 

.dirHeadL {
	position: relative;
	float:left;
}
.projTitle {
	position: relative;
	text-align: center;
}



#projectDesc_current {
	position: relative;
	float:left;
	margin-left: 1%;
	text-align: left;
	padding: 40px;
	width:65%;
	background-color:#000000;
	color:#EEEEEE;	
	box-shadow: 10px 10px 2px #B9BECA;
} 
#gameGallery_current {
	position: relative;
	float: right;
	margin-right: 4%;
	padding: 0px 40px 40px 0px;
	background-color:#000000;
	box-shadow: 10px 10px 2px #B9BECA;
}



#projectDesc_contract {
	position: relative;
	float:left;
	margin-left: 1%;
	text-align: left;
	padding: 40px;
	width:40%;
	background-color:#04122A;
	color:#DDDDDD;	
	box-shadow: 10px 10px 2px #B9BECA;
} 
#gameGallery_contract  {
	position: relative;
	float: right;
	margin-right: 4%;
	padding: 10px;
	background-color:#04122A;
	box-shadow: 10px 10px 2px #B9BECA;
}



#projectDesc_recent {
	position: relative;
	float:left;
	margin-left: 1%;
	text-align: left;
	padding: 40px;
	width:65%;
	background-color:#04122A;
	color:#CCCCCC;	
	box-shadow: 10px 10px 2px #B9BECA;
} 
#gameGallery_recent {
	position: relative;
	float: right;
	margin-right: 4%;
	padding: 0px 40px 40px 0px;
	background-color:#04122A;
	box-shadow: 10px 10px 2px #B9BECA;
}



#projectDesc_past {
	position: relative;
	float:left;
	margin-left: 1%;
	text-align: left;
	padding: 40px;
	width:65%;
	background-color:#16356A;
	color:#BBBBBB;	
	box-shadow: 10px 10px 2px #B9BECA;
} 
#gameGallery_past {
	position: relative;
	float: right;
	margin-right: 4%;
	padding: 0px 40px 40px 0px;
	background-color:#16356A;
	box-shadow: 10px 10px 2px #B9BECA;
}

.thumbImage {
	width: 160px;
	height: 40px;
}
.enlargedImg{
	width:875px; 
}




.clearBoth {
	clear:both;
}
.clearRight {
	clear:right;
}
.clearLeft {
	clear:left;
}













.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position:absolute;
background-color: gray;
padding: 2px;
border: 5px  white;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image in bordered box*/
border-width: 2px;
width: 850px;
max-height: 600px;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for borderedBox*/
visibility: visible;
right: 110%; /*position where enlarged image should offset horizontally */
bottom: -300px;
padding: 2px;
}







.hoverbox{ 
	cursor: default; 
	list-style:none;
} 
.hoverbox a{ 
	cursor: default; 
} 
.hoverbox a .preview{ 
	display:none; 
} 
.hoverbox a:hover .preview{ 
	display:block; 
	position: absolute; 
	top: -150px; 
	left: -50px; 
	z-index:1; 
} 
.hoverbox img{ 
	background:#fff; 
	border-color: #333 #333 #333 #ccc; 
	border-style:solid; 
	border-width: 1px; 
	color:inherit;
	padding: 1px; 
	vertical-align:top; 
	width:175px; 
	} 
	.hoverbox li{ 
		background:#eee; 
		border-color: #000 #000 #000 #ccc; 
		border-style:solid; 
		border-width: 1px; color:inherit; 
		display:inline; 
		float:left; 
		margin:3px; 
		padding:5px; 
		position:relative; 
	} 
	.hoverbox .preview{ 
		border-color:#000; 
		width:875px; 
	} 
	.hoverbox a{ 
		position:relative; 
	} 
	.hoverbox a:hover{ 
		display:block; 
		font-size:100%; 
		z-index:1; 
	} 
	.hoverbox a:hover .preview{  
		left: -875px; 
		padding-bottom: 40px;
	} 
	.hoverbox li{ 
		position:static; 
	}
/*
<div class="leftDiv">
	ART&nbsp;&nbsp;-------&nbsp;&nbsp;ART&nbsp;&nbsp;-------&nbsp;&nbsp;ART &nbsp;&nbsp;-------&nbsp;&nbsp;ART 
</div>
*/