/* ------------------------------------------------------
	CSS for the Dihedrals.com site.
	Main file included in all pages on this site.
-------------------------------------------------------*/
html {
	overflow-y: scroll;
	height: 100%;
}
body {
	background-color: rgb(25%,25%,25%);							/* @SITE-COLOR@ Dark Gray */
	font-family: verdana, "sans serif";										/* @SITE-FONT@ Verdana */
	font-size: 11pt;
	font-weight: bold;
	color: white;
	text-align: center;
	height: 100%;
}




* {
	padding: 0;
	margin: 0;
}
img {
	border: none;
	vertical-align: bottom;
}
.hiddenText {
	display: none;
}
.clear {
	clear: both;
}


a {
	color: #ffffff;
}
a:hover {
	color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
}


h1, h2, h3 {
	font-weight: bold;
	color: rgb(30%,30%,30%);						/* Site Color: Header Gray */
	text-align: left;
	margin: 10px 0 15px 0;
}
h1 {
	font-size: 100%;
}
h2 {
	font-size: 100%;
	color: white;
}
h3 {
	font-size: 90%;
	color: white;
	text-align: centre;
}


/* Main Centered Box */
#centerBox {
	margin: 0 auto;
	width: 1000px;
}


/* Site Header, Logo and Main Menus */
#languagesMenu {
	margin: 10px 0;
	font-size: 80%;
	font-weight: bold;
	color: rgb(50%,50%,50%);	
	float: left;
	display: inline;
}	
	#languagesMenu li {
		float: left;
		display: inline;
		margin: 0 5px 0 0;
		list-style-type: none;
		cursor: default;
	}
	#languagesMenu li a {
		text-decoration: none;
		color: rgb(70%,70%,70%);			/* Site Color: Header Gray */	
	}
		#languagesMenu li a:hover {
			color: white;
		}
			
/* LOGO */	
#logo {
	float: right;
	display: inline;
}
	#logo img {
		margin: 0;
	}
	
			
/* Main Menus */	
#menuBox {
	float: left;
	display: inline;
	text-align: left;
	margin: 10px 0 0 0;
}
	#menuBox ul {
		font-size: 115%;
		font-weight: bold;
		color: white;	
	}	
		#menuBox ul li {
			float: left;
			display: inline;
			margin: 0 35px 0 0;
			list-style-type: none;
			position: relative;
			cursor: default;
		}	
			#menuBox ul li a {
				text-decoration: none;
				cursor: pointer;
			}	
			#menuBox ul li a:hover {
				color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
			}	
				#menuBox ul li .wrap {
					display: block;
					position: absolute;
					height: 52px;
					width: 115px;
					top: 30px; left: 10px;
				}
			#menuBox ul li #selectedMainMenu {
				color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
			}
			
/* Header Image */
#header {
	margin: 10px 0 20px 0;
}

/* Selected Menus. */
.dwa-selectedMainMenu,
.dwa-selectedSubMenu,
.dwa-selectedFooterMenu {
	color: rgb(255,168,0);										/* @SITE-COLOR@ Orange */
}
.dwa-selectedMainMenu a,
.dwa-selectedSubMenu a,
.dwa-selectedFooterMenu a {
	color: rgb(255,168,0) !important;							/* @SITE-COLOR@ Orange */
}
				
#subMenuBox {
	margin: 0;
	padding: 5px 0 5px 40px;
	height: 15px;
	text-align: left;
	background-color: rgb(25%,25%,25%);							/* @SITE-COLOR@ Dark Gray */
	border-top: 6px rgb(10%,10%,10%) solid;
	border-bottom: 1px rgb(15%,15%,15%) solid;
}
	#subMenuBox ul,
	#footerBox ul {
		font-size: 90%;
		font-weight: bold;
		color: white;
	}
		#subMenuBox ul li,
		#footerBox ul li {
			float: left;
			display: inline;
			margin: 0 20px 0 0;
			list-style-type: none;
			position: relative;
			cursor: default;
		}
			#subMenuBox ul li a,
			#footerBox ul li a {
				text-decoration: none;
				cursor: pointer;
			}	
			#subMenuBox ul li a:hover,
			#footerBox ul li a:hover  {
				color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
			}
			#subMenuBox ul li #selectedMainMenu,
			#footerBox ul li #selectedMainMenu {
				color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
			}
	
	
/* Page Contents */
#grayBox {
	background-color: rgb(25%,25%,25%);							/* @SITE-COLOR@ Dark Gray */
	border-bottom: 6px rgb(10%,10%,10%) solid;
}
#contents {
	margin: 30px 40px;
	text-align: left;
	line-height: 1.4em;
	color: white;
}
	#contents h1, 
	#contents h2, 
	#contents h3, 
	#contents p, 
	#contents ol, 
	#contents ul
	{
		margin: 0 0 10px 0;
		text-align: left;
		color: white;
		position: relative;
	}
	#contents h1 {
		color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
	}
	#contents h3 {
		font-style: italic;
	}

	#contents p, 
	#contents ol, 
	#contents ul
	{
		font-size: 85%;
	}
	
	#contents ol, 
	#contents ul
	{
		padding-left: 100px;
		margin: 15px 0;
	}
	#contents p {
		text-align: justify;
	}


/* Footer */
#footerBox {
	margin: 0;
	padding: 8px 0 5px 0;
	text-align: left;
}



#copyright {
	margin: 8px auto 10px auto;
	width: 800px;
	text-align: auto;
	color: black;
	font-size: 70%;
	cursor: default;
}
	/* Open Toolbox link */
	#copyright #dwa a {
		cursor: default;
		color: black;	
		text-decoration: none;
	}
	
	#copyright a {
		text-decoration: none;
		color: rgb(255,168,0);							/* @SITE-COLOR@ Orange */
	}
	#copyright a:hover {
		text-decoration: none;
		color: white;
	}
	

/* *********** DWA Component CSS ***********  */
/* Double Column Text */
.leftCol {
	margin-right: 40px !important;
	float: left;
	display: inline;
	width: 340px;
}
.rightCol {
	float: left;
	display: inline;
	width: 340px;
}
	
/* *********** DWA Component CSS ***********  */
/* Full Width Image */
.dwa-fullWidthImage {
	margin: 15px auto;
	clear: both;
	padding: 6px;
	border: 1px rgb(40%,40%,40%) solid;				/* Site Color: Dark Image Border Gray */	
	background-color: rgb(15%,15%,15%);
}
	.dwa-fullWidthImage p {
		margin: 5px 0 3px 0 !important;
		text-align: right !important;
		padding: 0 0 0 0 !important;
		color: rgb(70%,70%,70%) !important;			/* Site Color: Header Gray */	
		font-size: 75% !important;
		line-height: 1.2em !important;
	}



.dwa-floatLeftImg {
	float: left;
	display: inline;
	margin: 0 15px 5px 0;
	clear: left;
}
.dwa-floatRightImg {
	float: right;
	display: inline;
	margin: 0 0 5px 15px;
	clear: left;
}

	
/* Vertical Spacers */
.dwa-vSpacer10 {
	clear: both;
	height: 10px;
}	
.dwa-vSpacer25 {
	clear: both;
	height: 25px;
}	
.dwa-vSpacer50 {
	clear: both;
	height: 50px;
}


/* Image Float Left Linked */
.dwa-floatLeftLinkImg {
	float: left;
	display: inline;
	margin: 15px 0 15px 0;
	clear: right;
	border: 0px rgb(40%,40%,40%) solid;				/* Site Color: Dark Image 0 Border */	
	position: relative;
	width: 160px;
	height: 100px;
}
	.dwa-floatLeftLinkImg p {
		position: absolute !important;
		top: 0; left: 0;
		
	}
		.dwa-floatLeftLinkImg p a {
			display: block;
			width: 160px;
			height: 90px;
			text-decoration: none;
			background-image: url(/images/invis.gif);
		}
.dwa-hMenuSpacer {
	float: left;
	display: inline;
	height: 90px;
	width: 20px;
}

/* Header Box Image */
.dwa-headerImage {
	overflow: hidden;
	position: relative; /*or absolute*/
	z-index: 0;
}