/* @override http://www.darkroomserver.com/design/site.css */

/*
 * 		s i t e . c s s
 * 		darkroomserver.com style file. do not duplicate without permission!
 *
 * 		$Author: arash $
 * 		$Id: site.css 558 2008-06-21 19:06:06Z arash $
 */

body {
	font: 12px/18px "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif;
	background: #f9f8f6 url(images/bg.png) top left repeat-x;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	font-weight: bold;
}
#container {
	width: 800px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#header {
	background: #DDDDDD; 
	padding: 0 0px 0 0px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
}
#header #menubar{
	height: 54px;
	background: url(images/menubar.png) top left no-repeat;
}
#header #menubar ul{
	padding: 0; margin:  0;
	height:  54px;
	float: right;
}
#header #menubar li{
	display: inline;
	list-style: none;
}
#header #menubar li a{
	float: left;
	height: 18px;
	padding-top: 36px;
	padding-right: 12px;
	padding-left: 3px;
	border-left: 1px solid #333333;
	font-size: 10px;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
	color: black;
	text-decoration: none;
}

#header #menubar li a:hover{
	background-color: #F5F5F5;
}

#header #menubar li a.selected{
	color: white;
	background: #b21515 url(images/selectedmenubg.png) repeat-y right center;
}
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}

/* FRONTPAGE CLASSES/IDs */


#homeSplash {
	background: url(images/home-splash.jpg) top left no-repeat;
	height: 260px;
}

#bigStatement {
	background-color: #222;
	padding: 0px 15px;
	color: #FFF;
	border: 4px solid #2c2c2c;
}

#bigStatement h1 {
	font-size: 16px;
}

#midHeader {
	padding: 5px 0px;
	background: #2c2c2c;
	color: white;
}

#midHeader h1 {
	margin-top: 0px;
	font-size: 22px;
	text-transform: uppercase;
}

#midHeader h1 .numeral {
	color: #c81818;
}

#midHeader p {
	color: #cccccc;
	font-size: 12px;
}

#midHeader ul {
	margin: 20px 0px;
	padding: 0;
}

#midHeader li {
	padding: 0px 15px;
	width: 235px;
	float: left;
	display: inline;
	list-style: none;
	margin-bottom: 20px;
	border-right: 1px solid #555555;
}

#midHeader li.last{
	margin-right: 0px;
	background: none;
	border: none;
}

#mainContent {
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background: #FFFFFF;
}

#mainContent a {
	font-style: italic;
}
#mainContent a:hover {
	text-decoration:underline;
}

#mainContent #pageContent {
	padding: 20px 0;	
}

#mainContent #pageContent #triColumnLeft{
	padding: 0px 15px;
	width: 235px;
	float: left;
}

#mainContent #pageContent #triColumnCenter{
	padding: 0px 15px;
	margin:  0px;	
	width: 235px;
	float: left;
	border-left: 1px #CCCCCC solid;
	border-right: 1px #CCCCCC solid;	
}

#mainContent #pageContent #triColumnRight{
	padding: 0px 15px;
	margin:  0px;	
	width: 235px;
	float: left;
}

#mainContent #pageContent h1 {
	margin-bottom: 10px;
	margin-top: 0px;
	font-size: 16px;
	text-transform: uppercase;
	color: #c81818;
}

div.columnimage {
	text-align: center;
}

#mainContent #pageContent h2 {
	margin-top: 0px;
	font-size: 22px;
	text-transform: uppercase;
	color: #c81818;
}

#mainContent #pageContent a{
	color: #444444;
	text-decoration: none;
}

/* END FRONTPAGE CLASSES/IDs */

/* INNERPAGE CLASSES/IDs */

#featuresSplash {
	background: url(images/features-splash.jpg) top left no-repeat;
	height: 220px;
}

#mainContentInner {
	border-top: solid #2c2c2c 8px;
	background: white;
}

#mainContentInner #rightBar{
	text-align: right;
	float: right;
	width: 200px;
	background: white;
}

#mainContentInner #rightBar #noteBox{
	background: #2c2c2c;
	padding: 8px 8px 12px 8px;
	color: #CCCCCC;
	font-size: 11px;
	line-height: 13px;
	text-align: justify;
}

#mainContentInner #rightBar #noteBox a{
	color: #FFFFFF;
	text-decoration: none;
}

#mainContentInner #rightBar #rightBarContent{
	padding: 1px 8px;
	background: white url(images/sideshadow.png) no-repeat left top;
}

#mainContentInner #rightBar #rightBarContent h1{
	margin-top: 0;
	padding-bottom: 5px;
	padding-top: 5px;
	font-size: 14px;
	border-bottom: 2px #CCCCCC solid;
}

#mainContentInner #rightBar #rightBarContent p{
	font-weight: bold;
	font-size: 11px;
}

#mainContentInner #rightBar #rightBarContent p.testimonial{
	font-weight: normal;
	font-size: 11px;
}

#mainContentInner #rightBar #rightBarContent img{
	border: none;
	margin-bottom: -15px;
}

#mainContentInner #pageContent{
	background: white;
	margin-right: 200px;
	padding-right: 20px;
}

#mainContentInner #pageContent p
{
	padding-left: 15px;
	color: #343434;
}

#mainContentInner #pageContent div.formdiv
{
	padding-left: 15px;
	color: #343434;
}

div#titleBox {
	font-size: 40px;
	padding: 15px 0px 10px 7px;
	text-transform: lowercase;
	height: 40px;
 	font-weight: normal;
	border-left: 10px solid #77AACC;
}

#mainContentInner #pageContent h1
{
	color: #b21515;
	background: url(images/h1-edgehighlight.png) repeat-y left top;
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 22px;
	text-transform: uppercase;
}

#mainContentInner #pageContent h2
{
	font-size: 16px;
	padding-left: 15px;
}

#mainContentInner #pageContent h3
{
	text-transform: uppercase;
	font-size: 12px;
	margin-bottom: -12px;
	padding-left: 15px;
}

#mainContentInner #pageContent div.h2highlight {
	background: #F0F0F0;
	padding: 1px 20px 1px 0;
	margin-top: 20px;
	margin-right: -20px;
}

#mainContentInner #pageContent div.insetbox
{
	margin-left: 15px;
}

/* END INNERPAGE CLASSES/IDs */

#footer {
	padding: 15px 15px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#CCCCCC;
	color: #444444;
	font-size: 10px;
	text-transform: uppercase;
}

#footer a{
	color: #444444;
	text-decoration: none;
}

#footer a:hover{
	color: #c81818;
	text-decoration: underline;
}


.clearbox{
	clear: both;
	height: 1px;
}

#pageContent p a {
	color: #c81818;
}

#pageContent div.formdiv fieldset {
	width: 400px;
	text-transform: uppercase;
	font-size: 10px;
}

#pageContent div.insetbox div.insetimage{
	float: right;
	margin-left: 10px;
	margin-right: -15px;
	
}
