@charset "utf-8";
/* CSS Document for SPE Group - www.spetechnology.com
By MadAboutDesign Pte Ltd
www.madaboutdesign.com
/* =Reset CSS Styles 
---------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}


blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

img { border: 0; }

/* =blocktext */
h2, h3, h4, h5, p, ul {
margin: 0 0px;
padding: .5em 0; }

/* General Styles
---------------------------------------------------------*/
body {
	margin: 0;
	padding: 0;
	background: url(../images/bg_site.jpg) repeat-x top left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	overflow-x: hidden;
}

body#subpage { background: url(../images/bg_subpages.jpg) repeat-x top left; }

a:link {
	color: #0072FF;
	text-decoration: none;
}

a:visited {
	color: #0072FF;
	text-decoration: none;
}

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

h2, h3, h4, h5, h6 { font-family: "Trebuchet MS", Verdana, Arial; font-weight: bold; }

h3 {
	font-size: 14px;
	color: #666666;
}

h4 {font-size: 14px; color: #0072FF; }

h5 { font-size: 12px;}

.highlight {
	font-weight: bold;
	color: #0072FF;
}

.datestamp { font-weight: bold; color: #0052A3; font-size: 11px; }

/* =Layout Styles
---------------------------------------------------------*/
#branding {
	background:url(../images/bg_branding.jpg) repeat-x;
	width: 800px;
	position: relative;
	top: 0;
	left: 0;
	height: 92px;
}

#branding h1 {
	float: left;
	margin: 15px 0 0 20px;
	width: 120px;
	height: 64px;
	background: url(../images/logo_spe.gif) no-repeat;
	text-indent: -9000px;
	cursor: pointer;
	display: inline;
}

#branding h1 a { background: url(../images/logo_spe.gif) no-repeat; }

#toplinks {
	float: left;
	background: url(../images/bg_toplinks.jpg) no-repeat top right;
	width: 619px;
	height: 92px;
}

#toplinks p {
	position: relative;
	left: 475px;
	font-size: 10px;
}

/* =Nav Styles
----------------------------------------------------------*/
#nav {
	clear: both;
	width: 760px; 
	height: 28px;
	background: url(../images/bg_navend.jpg) top right no-repeat; 
}

#masthead { width: 800px; background: #fff; }

/* =Content Styles
----------------------------------------------------------*/
#contentWrapper {
width: 840px;
background: url(../images/bg_contentsArea.gif) repeat-y; 
}

#secondaryContent {
	float: left;
	background: url(../images/bg_secondaryContent.jpg) repeat-x 0 28px;
	width: 220px;
}

#primaryContent {
	float: left;
	width: 560px;
	margin: 0 0 0 20px; 
	
}

#primaryContent p { line-height: 16px;}

/* removes IE6/5Win Double Margin bug */
* html #primaryContent, * html #secondaryContent { display: inline; }

#secondaryContent p, #secondaryContent img, #secondaryContent blockquote { margin: 0 15px; }

#secondaryContent h2 {
	text-transform: uppercase;
	font-size: 12px;
	font-weight: bold;
	color: #0052A3;
	background: url(../images/bg_subheader.jpg) repeat-x;
	height: 25px;
	padding: 6px 0 0 15px;
}

.home #primaryContent h2 {
	background: url(../images/title_welcome.gif) no-repeat 0 50%;
	text-indent: -9000px;
}

#subpage #primaryContent h2 { font-size: 16px; color: #0052A3; padding: 3px 0 15px 0; }

/* basic data table appearance */
#table { border-top: 1px solid #e7e7e7; border-left: 1px solid #e7e7e7; margin: 10px 0 0 0;}
#table caption { text-align: center; color: #0072FF; margin: 0 1em;}
#table th, #table td { padding: 10px; border-right: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7;}
#table th { font-weight: bold; font-size: 12px; background: #0072FF; color: #FFF;}
#subpage.contactus table { margin: 0;}

/* list styles for subpages */
.services, .quality ul, .ourcustomers ul { list-style: disc; margin-left: 30px;}

.services { font-weight: bold; font-size: 11px; margin-bottom: 50px;}
.services li { padding: 0 10px 15px 0;}

/* list styles for sitemap */
#sitemap { font-size: 120%; font-weight: bold; }
#sitemap li { list-style: none;}
#sitemap li a { color: #0052A3;}
#sitemap li a:hover { color: #999;}

/* second level */
#sitemap li ul {
margin: 6px 15px;
padding: 0 15px;
font-size: 90%;
border-left: 1px dotted #999;
}

#sitemap li ul a { color: #0072FF;}
#sitemap li ul a:hover { color: #999;}

/* third level */
#sitemap li ul li ul { border: none; }

#sitemap li ul li ul li {
font-weight: normal;
padding-left: 16px;
background: url(../images/arrow_right.gif) no-repeat 0 50%;
}

#sitemap li ul li ul li a { color: #666;}
#sitemap li ul li ul li a:hover { color: #0072ff;}

.imgwrap { margin: 0 8px 0 0; float: left; } 
.imgwrap_left { margin: 0 0 0 8px; float: right; }

.divider { margin: 10px 0;}

/* =FORMS
-----------------------------------------------------------------------------*/
fieldset {
	margin: 1em 0;
	padding: 1em;
	border: 0 solid #ccc;
	background: #f8f8f8;
}

legend { font-weight: bold; }

label {
	float: left;
	width: 10em;
	font-weight: bold;
}

.required {
	font-style:italic;
	color: #FF0000;
}

input { width: 200px; }

input#Submit, input#Clear { width: auto; }

input#Submit { margin-left: 10em; }


/* =Footer Styles
----------------------------------------------------------*/
/* Content Footers Shortcut links */
ul#contentFooter { background: #e1e1e1; padding: 5px; display: block; width: 100%; margin: 20px 0; height: 15px; }
#contentFooter a { color: #0052A3;}
#contentFooter li { display: inline; }
#contentFooter .next { float: right; text-indent: 10px; background: url(../images/arrow_right.gif) left center no-repeat; }
#contentFooter .top { float: left; text-indent: 10px; background: url(../images/arrow_up.gif) left center no-repeat; }

#footer {
	width: 100%;
	clear: both;
	border-top: 1px solid #e1e1e1;
	font-size: 11px;
	color: #999999;
}

#footer p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	padding: 10px 0 15px 20px;
}

#footer a.mad { color: #dddddd;}

.clear { clear: both; }
