html, body, div, form, img, object, embed{
	margin: 0;
	border: 0;
	padding: 0;
}
	
	
object, embed {
	float: left;
	margin: 0;
	border: 0;
	padding: 0;
}	
	
body {
	font-family: 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
	font-size: 62.5%; /* makes 1em = 10px */
}

h3 {
	font-family: 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
	font-size: 16px;
	color: #003466;
	margin:0;
	}

p {
	margin: 0.5em 0 1em 0;
	padding: 0;
	font-size: 12px;
}

a {
	text-decoration: none;
	color: #024;
	outline: none;
	border: 0;
}

a:hover, a:focus {
	color: #468;
	
}

a:active {
	color: #000;
}

.stepcontainer {
	width: 69%;
	padding-left: 15%;
	padding-right: 15%;
	}
	
	/* step 1 */
#stepheader {
	float: left;
	padding-top: 10px;
	font-size:14px;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	}
#steptext {
	padding-top: 4%;
	font-size:12px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	width: 37%;
	}
#steptext h1 {
	font-size:20pt;
	color:#888888;
	font-family:Arial, Helvetica, sans-serif;
	}
#steptext h2 {
	font-size:18pt;
	color:#555555;
	font-family:Arial, Helvetica, sans-serif;
	}
#stepimageright {
	float: right;
	padding-left: 20px;
	text-align: right;
	}
#stepimageright span {
	font-size: 9px;
	}
	
	/* step 2 */
	
#step2header {
	padding-top: 10px;
	font-size:14px;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	}
#step2text {
	float: right;
	padding-top: 5%;
	font-size:12px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	width: 37%;
	}
#step2text h2 {
	font-size:18pt;
	color:#555555;
	font-family:Arial, Helvetica, sans-serif;
	}
#step2imageleft {
	float: left;
	padding-right: 20px;
	text-align: left;
	}
#step2imageleft span {
	font-size: 9px;
	}
	
		/* step 3 */
#step3header {
	float: left;
	padding-top: 10px;
	font-size:14px;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	}
#step3text {
	padding-top: 8%;
	font-size:12px;
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	width: 37%;
	}
#step3text h2 {
	font-size:18pt;
	color:#555555;
	font-family:Arial, Helvetica, sans-serif;
	}
#step3imageright {
	float: right;
	padding-left: 20px;
	text-align: right;
	}
#step3imageright span {
	font-size: 9px;
	}
/* ------- Backgrounds Layout ------- */ 

#container {
	width: 830px;
	margin: auto;
}


#top {
	background: url("images/bg-top2.gif") no-repeat top center;
	padding-top: 20px;
	float: left;
	width: 826px;
}

#bottom {
	background: url("images/bg-bottom.gif") no-repeat bottom center;
	padding-bottom: 26px;
	float: left;
	width: 826px;
}


#middle {
	padding: 0 13px;
	float: left;
	width: 800px; /* (width of image) - (padding) :: ie. 826-26=800 */
	background: url("images/bg-main.gif") repeat-y center;
}



/* ------- Sections ------- */


#header {
	text-align: right;
	color: #fff;
	padding: 15px 20px 25px 20px;
	background: url("images/header-bg.gif") repeat-x bottom #003466;
}

#header-logo {
	background: url("images/logo2.jpg") no-repeat top left;
	float: left;
	
}

#header-tel {
	display: block;
	padding-top: 5px;
	color: #eee;
	font-size: 3.5em;
}

#header-time {
	display: block;
	font-size: 1.1em;
}

#crumbtrail {
	font-size: 10px;
	line-height: 19px;/* size of bg */
	float: left;
	margin: 0 1px;
	width: 768px;
	padding: 0 15px;
	background: url("images/bg-crumbtrail.jpg") top;
	}

#crumbtrail a:hover {
	text-decoration:underline;
	}

#content {
	padding: 0 4% 0 4%;
	}

#content-half {
	float: left;
	width: 71%;
	padding: 0 4% 0 2%;
}

#content-half-right {
	float: right;
	width: 71%;
	padding: 0 4% 0 2%;
}

#larger {
	font-size:16px;
	}

#content h1, #content-half h1, #content-half-right h1 {
	color: #003466;
	margin: 0;
	padding: 0;
	font-size: 2.2em;
}

#content h2, #content-half h2, #content-half-right h2 {
	color: #003466;
	margin: 0;
	padding: 0;
	font-size: 1.8em;
}

#content hr, #content-half hr, #content-half-right hr, #side-left hr {
	border: 0;
	height: 1px;
	color: #000;
	background-color: #000;
	margin: 0;
	padding: 0;
}

#side-left hr {
	border: 0;
	height: 1px;
	color: #ccc;
	background-color: #000;
	margin: 0;
	padding: 0;
}

#side {
	float: right;
	width: 22%; /* width - padding */
	padding: 0 1% 0 0;
}

#sidepriv {
	float: right;
	padding-top: 8px;
}

#side p {
	font-size: 10px;
	}

#side-left {
	float: left;
	width: 22%; /* width - padding */
	padding: 5px 0 0 1%;
}

#side-left-ul ul {
	list-style-type:square;
	padding: 0 0 0 22px;
	margin: 0;
	}

#side-left {
	font-size: 12px;
	}

#partners {
	margin-top: 3em;
	float: left;
	width: 100%;
	padding-bottom: 40px;
	background: url("images/partners.gif") bottom no-repeat;
}

#copyright {
	text-align: center;
	font-size: 1.2em;
	margin-bottom: 1em;
}

#sublinks {
	text-align: center;
	font-size: 1.0em;
	margin-bottom: 1em;
}

#valid {
	text-align: center;
	}

/* ------ Navigation ------- */

#image {
	background: url("images/clouds.jpg") no-repeat top center;
	padding-top: 149px; /* (image height [149]) - (nav size) */	 
}

#nav {
	background: url("images/nav-bottom.gif") repeat-x bottom;
	padding-bottom: 11px;
	font-size: 18px;
	line-height: 18px;
	float: left;
	width: 800px;
	margin-top: -28px; /* (line-height + padding of <A>) */
}
#nav_flash {
	background: url("images/nav-bottom.gif") repeat-x bottom;
	padding-bottom: 11px; /* background height */
	font-size: 11px;
	line-height: 11px;
	float: left;
	width: 800px;
}

#nav ul {
	float: left;
	margin: 0;
	padding: 0;
	background: url("images/nav-bg.png") repeat;
	width: 800px;
}

#nav ul li {
	float: left;
	list-style: none;
	margin: 0;
	padding: 0;
} 

#nav ul li a {
	font-weight: 700;
	padding: 5px 19px 5px 21px;
	display: block;
	color: #036;
}

#nav ul li a:hover, #nav ul li a:focus {
	background: url("images/nav-bg-over.png") repeat;
	color: #fff;
}

#side ul {
	float: left;
	margin: 0;
	padding: 0;
	font-size: 12px;
}

#side ul li {
	float: left;
	margin: 0;
	padding: 0;
} 


/* ------ i-stuff ------ */


#i-support, #i-protect, #i-backup {
	float: left;
	width: 33%;
	background: url("images/i-support.gif") top center no-repeat;
	padding-top: 46px;
	font-size: 1.2em;
}

#i-support ul li, #i-protect ul li, #i-backup ul li {
	margin: 0;
	padding: 0; 
}

#i-support ul, #i-protect ul, #i-backup ul {
	margin: 0;
	padding: 0 2em 0 3em;
}

#i-protect {
	background: url("images/i-protect.gif") top center no-repeat;
}

#i-backup {
	background: url("images/i-backup.gif") top center no-repeat;
}

#i-support hr, #i-protect hr, #i-backup hr {
	border: 0;
	height: 1px;
	color: #000;
	background-color: #000;
	margin: .5em auto 1.5em auto;
	width: 80%;
	text-align: center;
	padding: 0;
	clear: both;
}


/* ------ Forms ------ */
.form p {
	padding-left: 180px;
	clear: left;
}

.form p label {
	margin-left: -180px;
	width: 170px;
	float: left;
}

#small {
	font-size: 7pt;
	}

#splicecomeimage {
	text-align: center;
	}

.numbered {
	margin-left: 20px;
	list-style: none;
	}

/* ------ sort out ------ */
.website-examples {
	border: #ccc 1px solid;
	height: 132px; /* margin of image div + height of image div +2 */
	background: url("images/bg-faded_small.jpg") repeat-x top left;
	margin: 0 0 10px 0;
	}

#website-examples-image-c49s a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/club49_thumbnail.jpg");
	}
	
#website-examples-image-c49s a:hover {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #000 1px solid;
	background: url("images/club49_thumbnail_over.jpg");
	}
	
#website-examples-image-deb a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/debretton_thumbnail.jpg");
	}
	
#website-examples-image-deb a:hover {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #000 1px solid;
	background: url("images/debretton_thumbnail_over.jpg");
	}
	
#website-examples-image-cukss a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/cukss_thumbnail.jpg");
	}
	
#website-examples-image-cukss a:hover {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #000 1px solid;
	background: url("images/cukss_thumbnail_over.jpg");
	}

#website-examples-image-idash a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/idash_thumbnail.jpg");
	}
	
#website-examples-image-syn a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/syn_thumbnail.jpg");
	}

#website-examples-image-idash2 a {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #ccc 1px solid;
	background: url("images/idash2_thumbnail.jpg");
	}
	
#website-examples-image-idash a:hover {
	height: 120px;
	width: 160px;
	float: left;
	margin: 5px;
	border: #000 1px solid;
	background: url("images/idash_thumbnail_over.jpg");
	}

#subcontent {
	font-size: 12px;
	}

#content-stub-left {
	float: left;
	width: 50%;
	}
#content-stub-right {
	float: none;
	width: 50%;
	}
#content h5 {
	float:right;
	}
#content-image-user {
	height: 157px;
	width: 208px;
	float: right;
	background: url("images/keyboardhelp.jpg");
	}
#content-image-hardware {
	height: 157px;
	width: 208px;
	float: right;
	background: url("images/hardware.jpg");
}
#content-image-software {
	height: 157px;
	width: 208px;
	float: right;
	background: url("images/software.jpg");
}
#content-image-plan {
	height: 157px;
	width: 208px;
	float: right;
	background: url("images/networkplan.jpg");
}
#content-image-disaster {
	height: 157px;
	width: 208px;
	float: right;
	background: url("images/disaster.jpg");
}
#content-text {
	float: left;
	width: 60%;
	font-size: 12px;
	}
#content-footer {
	width: 100%;
	padding-top: 10px;
	}





/* ---- Calculator ---- */

form#calculator p {
	margin: 0.8em 0;
	margin-left: 140px;
}
form#calculator p label {
	float: left;
	width: 140px;
	margin-left: -140px;
	color: #444;
	font-weight: bold;
}
#calculator th { text-align: center; color: #888; }
#calculator td { text-align: center;   }
#calculator td.h { text-align: left; width: 100px }
.calculator_table .c_rates { text-align: right; padding-left: 30px; }
.calculator_table td { vertical-align: top; }
.calculator_table th { font-size: 1.3em; }
.calculator_table .total td { font-weight: 700; color: #003466; }
.calculator_table .saving td { font-weight: 700; color: #003466; font-size: 1.3em }
