/****************************************
| ** Origin Stylesheet **
|
| Created by:	 James Hicks
| Date Created:	 2007-02-13
| Copyright 2007 Lightmaker Manchester
|
****************************************/


/* =============== */
/* = Main Blocks = */
/* =============== */

* {
	margin:  0;
	padding: 0;
}

a img	{ border:0; }

body {
	background-color: #3d3739;
	color: #979597;
	font: 11px Verdana, Geneva, Helvetica, sans-serif;
	width: 100%;
	height: 100%;
}

#menu, #flash, #panels, #backgroundBar, #content {
	float: left;
}

#footer {
	width: 955px;
	margin: 0 auto;
}

#verticalCenter {
	position: absolute;
	top: 50%;
	margin-top: -271px;
	width: 100%;
}

#backgroundBar {
	background-color: #332e2f;
	width: 100%;
	padding: 12px 0px;	
}

#holder {
	color: #c3c1c3;
	width: 955px;
	margin: 0 auto;
}

/* ======== */
/* = Menu = */
/* ======== */

#menu {
	width: 959px;
	white-space: nowrap;
}

#menu a {
	background: url('../images/menu_norm.gif') no-repeat;
	width: 132px;
	height: 67px;
	display: block;
	float: left;
}

#menu #selected {
	background: url('../images/menu_highlight.gif') no-repeat ;
}

#menu img {
	float: left;
}

/* ========== */
/* = Footer = */
/* ========== */

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

#footer a:hover {
	color: #ffdb01;
}

#footer .footerLeft {
	padding-top: 4px;
	float: left;
}

#footer .footerRight {
	padding-top: 4px;
	float: right;
}

/* ======== */
/* = Home = */
/* ======== */

#panels {
	margin-top: 4px;
}

#panels .panelFull, #panels .panelHalf {
	background-image: url("../images/panel_LINK.gif");
	background-position: bottom right;
	background-repeat: no-repeat;
	background-color: #000000;
	display: block;
}

#panels .panelFull {
	width: 477px;
	height: 184px;
	float: left;
}

#panels .panelHalf {
	width: 474px;
	height: 90px;
	float: right;	
}
#panels .panelBottomRight { margin-top: 4px; }

#panels a {
	text-decoration: none;
	color: #c3c1c3;
}

#panels a:hover {
	background-image: url("../images/panel_LINK_hover.gif");
	background-position: bottom right;
	background-repeat: no-repeat;
}

#panels a * {
	cursor: pointer;
}

#panels a img, #panels a span { float: left; }

#panels a p img { 
	margin-bottom: 12px;
}

#panels .panelFull span {
	width: 285px;
	margin: 18px 0px 0px 35px;
}

#panels .panelFull span span, #panels .panelHalf span span {
	margin: 12px 0px 0px 0px;
}

#panels .panelHalf span {
	width: 265px;
	margin: 18px 0px 0px 27px;
}

/* =========== */
/* = Content = */
/* =========== */

#content {
	width: 955px;
}

#content a {
	color:#ffffff;
	text-decoration: none;
}

#content a:hover {
	color:#ffdb01;
}


#content img, #content div {
	float: left;
}

#content div {
	background-color: #000000;
	padding: 0px 40px 0px 40px;
	display: block;
}

#content div.services { width: 472px; height: 400px; padding-top: 50px; }
#content div.standard { width: 250px; height: 410px; padding-top: 40px; }
#content #links	  { width: 162px; height: 410px; padding-top: 40px; }
#content div.contact  { width: 238px; height: 410px; padding-top: 40px; padding-left: 30px; padding-right: 30px; }
#content div.casetext { width: 253px; height: 410px; padding-top: 40px; }


#content div p {
	margin-top: 16px;
}

#content div img, #content div p {
	float: left;
	clear: both;
	display: block;	
}

#content div p {
	width: 100%;
}

#content ul {
	margin-top: 10px;
	float: left;
	width: 205px;
	margin-left: 25px;
}

#content ul.left {
	margin-right: 10px;
}

#content ul li {
	list-style-image: url("../images/bullet.gif");
	margin-top: 10px;
}

#content form {
	padding: 15px 0px 14px 0px;
}

#content label, #content input, #content textarea {
	display: block;
	width: 226px;
	height: 18px;
	padding-top: 3px;
}

#content textarea {
	height: 80px;
	padding-left: 3px;
	color: #979597;
	font: 11px Verdana, Geneva, Helvetica, sans-serif;
	background-color: #313131;
	border: none;
}

#content input {
	padding-left: 3px;
	color: #979597;
	font: 11px Verdana, Geneva, Helvetica, sans-serif;
	background-color: #313131;
	border: none;
}

#content #submit {
	padding: 0;
	height: 25px;
	width: 229px;
	margin-top: 10px;
}

/* History line height is different because it has a lot of content */
#content #history {
	line-height: 12px;
}

/* ================ */
/* = Case Studies = */
/* ================ */

#content #cases {
	width: 126px;
	float: left;
	padding: 0;
}

#content #cases * {
	padding: 0;
}

.case1 {
	background: url('../images/side_case_1.jpg') no-repeat;
	width: 126px;
	height: 113px;
}
.case2 {
	background: url('../images/side_case_2.jpg') no-repeat;
	width: 126px;
	height: 113px;
}
.case3 {
	background: url('../images/side_case_3.jpg') no-repeat;
	width: 126px;
	height: 113px;
}
.case4 {
	background: url('../images/side_case_4.jpg') no-repeat;
	width: 126px;
	height: 111px;
}

#cases div a {
	width: 100%;
	height: 100%;
	display: block;
}

#cases div a span{
	display: none;
}

#cases #currentCase {
	background-image: url("../images/side_case_selected.gif");	
	background-repeat: no-repeat;
	background-position: bottom left;
}

/* =========== */
/* = Contact = */
/* =========== */

div#contactOptions {
	margin: 16px 0 0 0 ;
	padding: 0;
	width: 100%;
}

.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

.yellow {
	color: #fddc05;
}