/* Screen Stylesheet
-----------------------------------------------------------------------------
version:   1.0
date:      10/08/2009
author:    Chris Beale
website:   http://www.handbsensors.co.uk
*/

/* Basic Elements
-----------------------------------------------------------------------------*/
html body div.clear,
html body span.clear
{
     background: none;
     border: 0;
     clear: both;
     display: block;
     float: none;
     font-size: 0;
     margin: 0;
     padding: 0;
     position: static;
     overflow: hidden;
     visibility: hidden;
     width: 0;
     height: 0;
}

body {
	background: #000;
	color: #fff;
	font: 70% Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	text-align: left;
}

#bodywrap {
	background: #fff;
	margin: 0 auto;
	padding: 0;
	text-align: left;
	width: 781px;
}

img {
	border: 0px;
	margin: 0;
	padding: 0;
}

/* Typography
-----------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6, #cardDetail {
	font-weight: normal;
	margin: 0;
	padding: 0;
}
 
h1 {
	color: #009ee0;
	font-family: Trebuchet, "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	font-size: 2em;
}
 
h2 {
	font-size: 1.5em;
	letter-spacing: -1px;
	padding: 0;
}

h3 {
	font-size: 1em;
	font-weight: bold;
}

h4, h5, h6 {color: #009ee0;}

a, a:visited {
	color: #990000;
	text-decoration: none;
}
a:hover {
	color: #990000;
	text-decoration: underline;
}

.productList ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.productList ul li {
	background-image: url("/img/li.gif");
	background-position: 0 .4em;
	background-repeat: no-repeat;
	padding-left: 1.6em;
}

#extraBar h3 {padding: 0 0 0 20px;}

#extraBar a, #extraBar a:visited {
	color: #006699;
	text-decoration: none;
}

#extraBar a:hover {
	color: #000;
	text-decoration: none;
}


/* Header
-----------------------------------------------------------------------------*/

#header {
	background: #000 url("/img/background-header.png") top right no-repeat;
	border-bottom: 1px solid #ccc;
	height: 126px;
}

#logo {
	height: 191px;
	text-align: left;
	width: 126px;
}

#phonebox {
	color: #249cd3;
	font-family: Trebuchet, "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	font-size: 17px;
	height: 126px;
	margin: 0 0 0 126px;
	padding-top: 50px;
	position: absolute;
	text-align: right;
	top: 0;
	width: 655px;
}

#phonebox a, #phonebox a:hover, #phonebox a:visited {
	color: #249cd3;
	text-decoration: none;
}

/* Content
-----------------------------------------------------------------------------*/

#container {
	background: #fff URL("/img/background-container.jpg") top repeat-x;
	clear: both;
	color: #000;
	padding: 20px 15px 20px 20px;
}

.centerMe {
	margin: 0 auto;
	text-align: center;
}

.leftMeBox {
	border-bottom: 1px solid #ccc;
	clear: left;
	margin: 0 0 2px 0;
	padding: 3px 0 0 0;
}

.leftMeBox2 {
	border-bottom: 0px solid #ccc;
	clear: left;
	margin: 0 0 2px 80px;
	padding: 3px 0 0 0;
}

.leftMeBox p, .leftMeBox2 p {margin: 8px 0 0 0;}

.leftMe {
	float: left;
	padding: 0 10px 0 0;
}

.photo-category {
	border: 0;
	margin: 0 3px 3px 3px;
	padding: 0 6px 6px 6px;
}

.productBoxBig {
	border-bottom: 1px #ccc solid;
	display: block;
	float: left;
	margin: 6px;
	width: 700px;
}

.shiftTypes {padding-left: 45px;}

.productBox {
	display: block;
	float: left;
	margin: 6px;
	width: 350px;
}

#colExtra {
	background: #fff;
	float: right;
	padding: 0;
	text-align: center;
	width: 220px;
}

#colExtra2 {
	background: #fff;
	border-left: 1px solid #ccc;
	float: right;
	padding: 0;
	text-align: center;
	width: 220px;
}

#colExtra img {
	border: 1px solid #ccc;
	margin: 3px;
	padding: 6px;
}

#colExtra img.photo-category {border: 1px solid #fff;}

#colExtra #box {
	display: block;
	height: 201px;
	width: 202px;
}

/* Footer
-----------------------------------------------------------------------------*/

#footer {
	background: #000;
	clear: both;
	font-size: 85%;
	margin: 0 0 0 0;
	padding: 20px 0 20px 0;
	text-align: center;
}

#footer a, #footer a:hover, #footer a:visited {color: #ccc;}

/* Navigation
-----------------------------------------------------------------------------*/

#extraBar {
	background: #ccc URL("/img/background-extraBar.jpg") top repeat-x;
	clear: both;
	color: #006699;
	padding: 8px 0 2px 0;
	width: 100%;
}

.nav {
	border-top: 2px solid #666;
	clear: both;
	font-size: 11px;
}

.navmenu {
	background: #000 url("/img/background-nav.jpg");
	float: left;
	height: 236px;
	text-align: center;
	width: 191px;
}

.navmenu ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.navmenu li {
	border-bottom: 1px dashed #fff;
	font-weight: bold;
	height: 33px;
	margin: 0 auto;
	padding: 0;
	text-align: left;
	width: 160px;
}

.navmenu a {
	color: #fff;
	display: block;
	margin: 0;
	padding: 9px 12px 0 18px;
	text-decoration: none;
}

.navmenu a:hover {
	background: #006699;
	color: #fff;
	padding-bottom: 9px;
}  

#rndimg, #rndimg img {
	background: #000;
	float: right;
	height: 236px;
	width: 590px;
}

textarea, input {
	background: #ccc;
	border: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/* Business Cards
-----------------------------------------------------------------------------*/
#cardBox {
	background: #000;
	color: #fff;
	margin: 0 auto;
	padding: 0;
	width: 400px;
}

#cardDetail {
	background: #fff url("/img/background-businesscards.jpg") no-repeat;
	display: block;
	font-family: Trebuchet, "Trebuchet MS", "Lucida Grande", Arial, sans-serif;
	height: 223px;
	margin: 0;
	overflow: hidden;
	padding: 15px;
	width: 370px;
}