/* ---------- DOCUMENT LAYOUT ---------- */

html, body {
	background-color:#E5E5E5;
	text-align:justify;
	color:#CCCCCC;
}

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:18px;

	margin:0px;
	padding:0px;

	padding:0em 0 0 0;
	background:url(foo) fixed;

	overflow-x:hidden;
	overflow-y:scroll;
}

#bin {
	margin:0px;
	padding:0px;
	width:960px;
	position:absolute;
	top:0px;
	/*left:30px;*/
	left:50%;
	margin-left:-495px;
	border-left:15px solid #808080;
	border-right:15px solid #808080;
	z-index:1;
}

#header {
	height:80px;
	margin:0px;
/*	padding:40px 40px 0px 40px;*/
	text-align:right;
/*	background-image:url("../imagesHTML/header.jpg");*/
	background-position:right;
	background-repeat:no-repeat;
/*	border-bottom:1px solid #CCCCCC;*/
	background-color:#808080;
	color:#FFFFFF;
}

/*
#header a {
	text-decoration:none;
}
*/

#headerImg {
	display:block;
	position:absolute;
/*	z-index:3;*/
	left:405px;
	top:12px;
}

#headerImg img {
	border-width:0px;
}

#navi {
	height:40px;
/*	background-image:url("../imagesHTML/header.jpg");*/
	background-position:center;
	background-repeat:no-repeat;
/*	border-bottom:1px solid #CCCCCC;*/
	background-color:#808080;
/*	z-index:10;*/
}

#page {
	padding:45px 30px 30px 30px;
	/*background-color:#808080;*/
	background-color:#4D4D4D;
}

#footer {
	height:40px;
	display:block;
	padding-top:10px;
	/*border-top:1px solid #CCCCCC;*/
	background-color:#808080;
	text-align:center;
}

.separator {
	border-bottom:1px solid #666666;
	margin:10px 0px 10px 0px;
}

.separatorFull {
	border-bottom:1px solid #FF8000;
	margin:30px 0px 30px 0px;
}

.leftBlock {
	float:left;
	width:180px;
	padding-right:15px;
	border-right:1px solid #CCCCCC;
	text-align:right;
}

.rightBlock {
	float:left;
	padding-left:15px;
	text-align:left;
}

/* ---------- INTERACTIONS ---------- */

#navi a,
.current {
	float:left;
	display:block;
	height:30px;
	/*padding:3px 15px 7px 15px;*/
	font-weight:bold;
	font-size:18px;
	color:#4D4D4D;
	/*font-variant:small-caps;*/
	text-align:center;
	line-height:1.9em;
	background-color:#BFBFBF;
}

#navi a:link, #navi a:visited {
	text-decoration:none;
}

#navi a:hover {
	background-color:#FFFFFF;
	color:#FF8000;
}

.current {
	cursor:default;
	background-color:#4D4D4D;
	color:#FFFFFF;
}

/*------------------------------------------*/

#preloader {
	display:none;
}

#artButton, #artButton a,
#codeButton, #codeButton a,
#techButton, #techButton a,
#infoButton, #infoButton a,
#emailButton, #emailButton a {
	float:left;
	display:block;
	width:80px;
	height:40px;
	background-repeat:no-repeat;
	background-color:#808080;
}

#artButton {
	background-image:url("../imagesHTML/art_curr.jpg");
}
#artButton a:link, #artButton a:visited {
	background-image:url("../imagesHTML/art_off.jpg");
}
#artButton a:hover {
	background-image:url("../imagesHTML/art_on.jpg");
}

#codeButton {
	background-image:url("../imagesHTML/code_curr.jpg");
}
#codeButton a:link, #codeButton a:visited {
	background-image:url("../imagesHTML/code_off.jpg");
}
#codeButton a:hover {
	background-image:url("../imagesHTML/code_on.jpg");
}

#techButton {
	background-image:url("../imagesHTML/tech_curr.jpg");
}
#techButton a:link, #techButton a:visited {
	background-image:url("../imagesHTML/tech_off.jpg");
}
#techButton a:hover {
	background-image:url("../imagesHTML/tech_on.jpg");
}

#infoButton {
	background-image:url("../imagesHTML/info_curr.jpg");
}
#infoButton a:link, #infoButton a:visited {
	background-image:url("../imagesHTML/info_off.jpg");
}
#infoButton a:hover {
	background-image:url("../imagesHTML/info_on.jpg");
}

#emailButton {
	background-image:url("../imagesHTML/email_curr.jpg");
}
#emailButton a:link, #emailButton a:visited {
	background-image:url("../imagesHTML/email_off.jpg");
}
#emailButton a:hover {
	background-image:url("../imagesHTML/email_on.jpg");
}

/*------------------------------------------*/

#prev a, #next a {
	display:block;
	position:fixed;
	z-index:10;
	top:50%;
	left:50%;
	width:40px;
	height:80px;
	margin-top:-40px;
	background-repeat:no-repeat;
	text-decoration:none;
}

#prev a {
	margin-left:-520px;
	background-image:url("../imagesHTML/prev_off.jpg");
}

#prev a:link, #prev a:visited {
	background-image:url("../imagesHTML/prev_off.jpg");
}
#prev a:hover {
	background-image:url("../imagesHTML/prev_on.jpg");
}

#next a {
	margin-left:480px;
	background-image:url("../imagesHTML/next_off.jpg");
}

#next a:link, #next a:visited {
	background-image:url("../imagesHTML/next_off.jpg");
}
#next a:hover {
	background-image:url("../imagesHTML/next_on.jpg");
}

/*------------------------------------------*/

#awsm a,
#wrench a,
#eotech553 a,
#sw360 a,
#anatomy a,
#androarachnid a,
#ciceto a,
#dragon a {
	display:block;
	width:320px;
	height:240px;
	background-repeat:no-repeat;
	text-decoration:none;
}

#awsm a:link, #awsm a:visited,
#wrench a:link, #wrench a:visited,
#eotech553 a:link, #eotech553 a:visited,
#sw360 a:link, #sw360 a:visited,
#anatomy a:link, #anatomy a:visited,
#androarachnid a:link, #androarachnid a:visited,
#ciceto a:link, #ciceto a:visited,
#dragon a:link, #dragon a:visited {
	border:1px solid #4D4D4D;
}

#awsm a:hover,
#wrench a:hover,
#eotech553 a:hover,
#sw360 a:hover,
#anatomy a:hover,
#androarachnid a:hover,
#ciceto a:hover,
#dragon a:hover {
	border:1px solid #FF7F00;
}


#awsm a {
	background-image:url("../art/icon_1001_awsm.jpg");
}

#wrench a {
	background-image:url("../art/icon_0908_wrench.jpg");
}

#eotech553 a {
	background-image:url("../art/icon_0906_eotech553.jpg");
}

#sw360 a {
	background-image:url("../art/icon_0905_sw360.jpg");
}

#anatomy a {
	background-image:url("../art/icon_0806_anatomy.jpg");
}

#androarachnid a {
	background-image:url("../art/icon_0801_androarachnid.jpg");
}

#ciceto a {
	background-image:url("../art/icon_0708_ciceto.jpg");
}

#dragon a {
	background-image:url("../art/icon_0706_dragon.jpg");
}

/*------------------------------------------*/

#ciceto_easy, #ciceto_sneaky, #ciceto_angry, #ciceto_images {
	margin:0px 0px 0px 150px;
	padding:0px;
}

#center600 {
	margin:0px 0px 0px 150px;
	padding:0px;
}

/*------------------------------------------*/

.toggleButton a {
	display:block;
	float:left;
	margin:0px 10px 0px 0px;
	padding:0px 3px 1px 3px;
	width:13px;
	height:18px;
	background-color:#BFBFBF;
	font-size:15px;
	font-weight:bold;
	color:#4D4D4D;
}

.toggleButton a:link, .toggleButton a:visited {
	text-decoration:none;
}

.toggleButton a:hover {
	background-color:#FFFFFF;
	cursor:pointer;
	color:#FF8000;
}

/*--------------------------------------------------------------------------------------------*/


/* Tables */
table {
	padding:0px;
	margin:0px;
	font-size:12px;
	/*line-height:18px;*/
	border-collapse:collapse;
}
td, tr {
	padding:0px 15px 0px 0px;
	margin:0px;
}


/*--------------------------------------------------------------------------------------------*/


/* Lists */
ul, ol {
	padding: 0px 0px 0px 0px;
}

ul {
	list-style-image:url("../imagesHTML/squareDot.gif");
	margin: 0px 0px 0px 17px;
}

ol {
	list-style-image:none;
	margin: 0px 0px 0px 20px;
}

li {
	margin: 9px 0px 9px 0px;
}


/* Images */
img {
	margin:0px;
	padding:0px;
	/*border:1px solid #000000;*/
}

a img {
	border:1px solid #4D4D4D;
}

a img:hover {
	border:1px solid #FF7F00;
}

a img:link, a img:visited {
	border:1px solid #4D4D4D;
}

object {
	margin:0px;
	padding:0px;
}


/*------------------------------------------*/


/* Layout */
.noPad {
	padding:0px;
}



/* Text Links */
a.navigation {
	font-weight:bold;
	color:#FFFFFF;
}
a.navigation:link, a.navigation:visited {
	text-decoration:none;
}
a.navigation:hover {
	text-decoration:underline;
}


/* Text */

.bold {
	font-weight:bold;
}

.title, .section, .subSection, .shortCut, .option, .colorBold {
	font-weight:bold;
	/*font-variant:small-caps;*/
	color:#FFFFFF;
}
.title {
	font-size:24px;
}
.section {
	font-size:18px;
}
.subSection {
	font-size:16px;
}
.option {
	font-size:13px;
}
.colorBold {
	font-variant:normal;
}

.note, .shortCut {
	font-size:10px;
	/*color:#333333;*/
}

