body/*white one*/
{
	font-size: 80%;
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	color: #000000;
	background-color: #E4E0E0;
	/*background-attachment:fixed; used to fix a background image so only text scrolls*/ 
	
	/*-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	user-select: none;*/
	
}
/* start tabs */
ul#tabs
{
	font-size:135%;
	display:block;
	float:none;
	padding:0px;
	text-decoration:none;
	/*width:device-width;*/
	margin:1.5em 0 20px 0;
	list-style:none;
	/*border: 1px solid #E3E2E2;*/
	/*
	background-image: -moz-linear-gradient(top, #F9F9F9, #EAE9E9);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #F9F9F9),color-stop(1, #EAE9E9));
	background-image: -webkit-linear-gradient(#F9F9F9, #EAE9E9);
	background-image: linear-gradient(top, #F9F9F9, #EAE9E9);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#F9F9F9', EndColorStr='#EAE9E9');   /*IE gradient*/
	/*-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	-o-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: inset 0 1px 0 0 #fff;
	-webkit-box-shadow: inset 0 1px 0 0 #fff;
	-o-box-shadow: inset 0 1px 0 0 #fff;*/
}
ul#tabs li
{
	float:left;
	position: relative;

}
ul#tabs li div
{
	background-color: #EEE9E9;/*#DB2929;/*#F9F9F9;*/
	display:block;
	border:1px solid #C9C9C9;
	padding:5px 20px;
	font-weight:bold;
	color:#666666;/*000000;/*color:#666;*/
	text-align: left;
	/*text-shadow: 1px 1px #fff;*/
	text-decoration:none;
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	user-select: none;	
	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	
/*
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
/*
	
	background-image: -moz-linear-gradient(top, #F9F9F9, #EAE9E9);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #F9F9F9),color-stop(1, #EAE9E9));
	background-image: -webkit-linear-gradient(#F9F9F9, #EAE9E9);
	background-image: linear-gradient(top, #F9F9F9, #EAE9E9);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#F9F9F9', EndColorStr='#EAE9E9'); */ /*IE gradient*/
}

ul#tabs li div:hover
{
	cursor:pointer;
	color:#000000;
	text-decoration:none;
	border-color:#000000;
	/*background-color:#BFBFBF;*/
	/*-webkit-transition: all .2s ease-in;
	-moz-transition: all .2s ease-in;
	-o-transition: all .2s ease-in;
	transition: all .2s ease-in;*/
	/*-webkit-box-shadow: 1px 0px 6px #cccccc;
	-moz-box-shadow: 1px 0px 6px #666666;
	box-shadow: 1px 0px 6px #666666;
	
	-webkit-box-shadow: 0px 2px 6px #cccccc inset;
	-moz-box-shadow: 0px 2px 6px #666666 inset;
	box-shadow: 0px 2px 6px #666666 inset;*/
}
ul#tabs li div:active
{
	-webkit-box-shadow: 0px 1px 5px #cccccc inset;
	-moz-box-shadow: 0px 1px 5px #666666 inset;
	box-shadow: 0px 1px 5px #666666 inset;
}
ul#tabs li div.selected
{
	color:#FFFFFF;
	background-color:#1E90FF;
	background-image:none;
	text-decoration:none;
	border-color:#000000;
	-webkit-box-shadow: 0px 1px 5px #666666 inset;
	-moz-box-shadow: 0px 1px 5px #666666 inset;
	box-shadow: 0px 1px 5px #666666 inset;
	
	/*-webkit-box-shadow: 2px 0px 6px #cccccc;
	-moz-box-shadow: 2px 0px 6px #666666;
	box-shadow: 2px 0px 6px #666666;*/
}
/* end tabs */

header
{
	
}

footer
{
	height: auto;
	height: 100%;
	margin: 0 auto -142px;
}

div#display
{
	/*display:table; if you want it to adjust to text-size */
	background-color:#FFFFFF;
	border:1px solid #FFFFFF;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	width:1200px;
	/*max-height:600px;*/
	overflow:auto;
	-webkit-box-shadow: 0px 0px 8px #888888;
	-moz-box-shadow: 0px 0px 8px #888888;
	box-shadow: 0px 0px 8px #888888;
	
	padding:3px;
}

div.display
{
	display:table; 

	background-color:#FFFFFF;
	border:1px solid #FFFFFF;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	width:1200px;
	/*max-height:600px;*/
	overflow:auto;
	-webkit-box-shadow: 0px 0px 8px #888888;
	-moz-box-shadow: 0px 0px 8px #888888;
	box-shadow: 0px 0px 8px #888888;
	
	padding:3px;
}

.infodiv
{
	background-color:#FFFFFF;
	border:1px solid #FFFFFF;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	width:480px;
	
	-webkit-box-shadow: 0px 0px 8px #888888;
	-moz-box-shadow: 0px 0px 8px #888888;
	box-shadow: 0px 0px 8px #888888;
	
	padding:3px;
}



/* regular links */
a
{
	color:#000000;/*blue is 1464F4;/*aqua is 00B2EE;*/ /* yellow is #FFFF00; */
	/*-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;*/
}
a:visited 
{
	/*color:#00B2EE;*/
}
a:active
{
	/*color:#00FF00;*/
}
a:hover
{
	color:#696969;/*#999999;/*blue-6D9BF1;/*05E9FF;/*00BFFF*/
}
/* end of regular links */

div.nospaces
{
	margin:0px;
	padding:0px;
	border-width:0px;
}
a#personalwork
{
	color:#E4E0E0; /*must be same as body background colour*/
}


.singlebutton
{
	font-size:90%;
	text-align:center;
	width:110px;
	line-height:40px;
	text-decoration:none;
	background-color: #EEE9E9;/*#DB2929;/*#F9F9F9;*/
	border:1px solid #C9C9C9;
	padding: 0 0 0.3em 0;
	font-weight:bold;
	color:#666666;/*000000;/*color:#666;*/
	/*text-shadow: 1px 1px #fff;*/
	text-decoration:none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	/*
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;*/
	display:block;
	
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.singlebutton:hover
{
	cursor:pointer;
	color:#000000;
	text-decoration:none;
	/*
	-webkit-box-shadow: 1px 0px 6px #cccccc;
	-moz-box-shadow: 1px 0px 6px #666666;
	box-shadow: 1px 0px 6px #666666;*/
	border-color:#000000;
}

.singlebutton:active
{	
	-webkit-box-shadow: 0px 1px 9px #cccccc inset;
	-moz-box-shadow: 0px 1px 9px #666666 inset;
	box-shadow: 0px 1px 9px #666666 inset;
}

.red
{
	background-color:#DB2929;
	color:#FFFFFF;
	border-color:#B22222;
}
.red:hover
{
	color:#FFFFFF;
	/*border-color:#B22222;*/
}
.green
{
	background-color:#61B329;
	color:#FFFFFF;
	border-color:#397D02;
}
.green:hover
{
	color:#FFFFFF;
	/*border-color:#397D02;*/
}
.blue
{
	background-color:#1E90FF;
	color:#FFFFFF;
	border-color:#009ACD;
}
.blue:hover
{
	color:#FFFFFF;
	/*border-color:#B22222;*/
}

.pink
{
	background-color:#FF3E96;
	color:#FFFFFF;
	border-color:#EE3A8C;
}
.pink:hover
{
	color:#FFFFFF;
	/*border-color:#EE3A8C;*/
}


.hideshow
{
	font-size:70%;
	text-align:center;
	width:140px;
	line-height:20px;
	text-decoration:none;
	background-color: #EEE9E9;/*#DB2929;/*#F9F9F9;*/
	border:1px solid #C9C9C9;
	padding: 0 0 0.3em 0;
	font-weight:bold;
	color:#666666;/*000000;/*color:#666;*/
	/*text-shadow: 1px 1px #fff;*/
	text-decoration:none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
}

.hideshow:hover
{
	cursor:pointer;
	color:#000000;
	text-decoration:none;
	/*
	-webkit-box-shadow: 1px 0px 6px #cccccc;
	-moz-box-shadow: 1px 0px 6px #666666;
	box-shadow: 1px 0px 6px #666666;*/
	border-color:#000000;
}

.hideshow:active
{
	-webkit-box-shadow: 0px 1px 9px #cccccc inset;
	-moz-box-shadow: 0px 1px 9px #666666 inset;
	box-shadow: 0px 1px 9px #666666 inset;
}

a img {border:0;}

.done
{
	display:none;
	text-decoration:line-through;
}/*px #666666;
}*/

.mobileonly
{
	display:none;
	visibility:hidden;
}


/* The following is only for mobile devices and smaller screens */
@media only screen 
and (max-width : 550px)
{
	ul#list-nav
	{
		/*display:none;*/
	}

	ul#tabs li
	{
		float:none;
		position: relative;
		width:400px;
	}

	ul#tabs li div
	{
		height:50px;
		text-align:center;
	}

	div.display
	{
		text-align:center;
		width:400px;
		font-size:14pt;
	}

	div.display ul
	{
		list-style:none; /*no bullets*/
		margin: 0px; /*no indent*/
		padding: 0px; /*no indent*/
	}

	div.display li
	{
		display:block;
	}

	div.display a
	{
		
	}

	.singlebutton
	{
		height:50px;
		width:400px;
	}


	.nonmobile /*add this to any class to have it not display on mobile version*/
	{
		display:none;
		visibility:hidden;
	}
	.mobileonly
	{
		display:inline;
		visibility:visible;
	}

	.infodiv
	{
		width:400px;
		font-size:14pt;
	}

	/* navbar */


	ul#list-nav
	{
		position:relative;
		/*margin:auto;*/
		padding:0px;
		width:400px;
		height:50px;
		font-size:120%;
		display:block;
		float:none;
		text-decoration:none;
		list-style:none;
			/*background-color: #1F1F1F;*/
		border:none;
		z-index:1000;
	}

	ul#list-nav li
	{
		position:relative;/*position:relative;*/
		float:none;
	}
	ul#list-nav a
	{
		font-weight:bold;
		height:50px;
			/*background-color:#1F1F1F;*/
		color:#C4C4C4;
		display:block;
		padding:5px 15px;
		text-align: center;
		text-decoration:none;
		font-size:25px;
	}

	ul#list-nav a:hover
	{
		/*background-color:#4D4D4D;*/
		color:#FFFFFF;
		/*text-shadow: 2px 2px #ff0000;*/
		text-decoration:none;
	}

	ul#list-nav a:active
	{
		/*background-color:#9C9C9C;*/
		text-decoration:none;
	}




}