﻿/***** Global Settings *****/
/* Key Colours
	Mid Blue: #1A3F95
	Dark Blue: #0D348D
	Mid Grey: #949BA3
	Light Grey: #E8E8E8
*/

html {
	background: url(images/gradient.jpg) repeat-x;
}

body {
	margin-top: 10px;
	padding:0;
	font:12px verdana, sans-serif;
	color:#5C5C5C; /*Text Colour*/
}

/***** Common Formatting *****/

h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
}

h1 {
	padding:25px 0px 20px 10px;
	letter-spacing:1px;
	font:20px Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
}

h2 {
margin: 20px 0px 0px 0px;
padding: 10px 0px 10px 10px;
letter-spacing:1px;
font:16px Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
color:#0D348D
}

h3 {
font:14px Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
}
h4 {
font:12px Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
text-decoration: underline;
text-align:center;
}
h5 {
font:12px Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
text-decoration: none;
text-align:left;
}

p, ul, ol {
margin:0;
padding:0 0 10px 0;
}

ul, ol {
padding-left:25px;
margin-left:20px;
}

blockquote {
margin:22px 40px;
padding:0;
}

small {
font-size:0.85em;
}

img {
border:0;
margin: 0px;
}

sup {
position:relative;
bottom:0.3em;
vertical-align:baseline;
}

sub {
position:relative;
bottom:-0.2em;
vertical-align:baseline;
}

acronym, abbr {
cursor:help;
letter-spacing:1px;
border-bottom:1px dashed;
}

/***** Links *****/

a, a:visited {
	text-decoration:underline;
	color:#0000DD;
}

/***** Forms *****/

form {
margin:0;
padding:0;
display:inline;
}

input, select, textarea {
font:1em arial, helvetica, sans-serif;
}

textarea {
line-height:1.25;
}

label {
cursor:pointer;
}

/***** Tables *****/

table {
border:0;
margin:0 0 18px 0;
padding:0;
}

table tr td {
padding:2px;
}

/***** Global Classes *****/

.clear 			{ clear:both; }

.float-left 	{ float:left; }
.float-right 	{ float:right; }

.text-left 		{ text-align:left; margin-left:10px; margin-right:10px; }
.text-indent 	{ text-align:left; margin-left:35px; margin-right:10px; }
.text-right 	{ text-align:right; margin-left:10px; margin-right:10px; }
.text-center 	{ text-align:center; }
.text-justify 	{ text-align:justify; margin-left:10px; margin-right:10px;  }

.bold 			{ font-weight:bold; }
.boldEnvBlue	{ font-weight:bold; color:#0081c7;}
.boldEnvGreen	{ font-weight:bold; color:#84C43C;}
.italic 		{ font-style:italic; }
.underline 		{ border-bottom:1px solid; }
.highlight 		{ background:#ffc; }

.img-left 		{ float:left;margin:4px 10px 4px 0; }
.img-right 		{ float:right;margin:4px 0 4px 10px; }

.nopadding 		{ padding:0; }
.noindent 		{ margin-left:0;padding-left:0; }
.nobullet 		{ list-style:none;list-style-image:none; }


/******* Main Styles *******/

/***** Wrapper *****/

#wrap
{
width:1000px;
margin: 0px auto; /*Centre the page*/
padding-bottom:-20px;
text-align:justify;
background-color:#FFF;
}

#content {
	width: 570px;
	float: left;
	margin: 0px 10px 0px 40px;
}
#content p{
padding-top: 15px;
clear:both;
}

#content-narrow {
	width: 300px;
	float: left;
	margin: 0px 20px 0px 30px;
}
#content-wide {
	width: 920px;
	margin: 0px 10px 0px 40px;
}
#content-centre {
	width: 700px;
	margin: 0px 10px 0px 140px;
}

#news-column {
margin:0px 30px 0px 10px;
padding:10px;
width: 270px;
float:right;
background:#E8E8E8;
text-align:justify;
}
		
#news-column p, #extra-column p{
			background: url(images/article-top.gif) no-repeat;
			padding-top: 17px;
			margin-top: 10px;
		}
		
#news-column p span, #extra-column p span{
			display: block;
			background: url(images/article-btm.gif) bottom no-repeat;
			padding-bottom: 17px;
		}
		
#news-column p span span, #extra-column p span span {
			display: block;
			background: white;
			padding: 0 20px;
		}
#news-column img {
		background: white;
		padding: 0 0px;
		/*Centre the image*/
		display:block;
		margin: 0 auto;
		}


#extra-column {
margin:0px 0px 0px 20px;
padding:10px;
width: 270px;
float:left;
background:#E8E8E8;
text-align:justify;
}
#services-column-left {
margin:0px 0px 0px 0px;
padding:10px;
width: 260px;
height:500px;
float:left;
background:#E8E8E8;
text-align:justify;
}
#services-column-right {
margin:0px 0px 0px 10px;
padding:10px;
width: 260px;
height:500px;
float:right;
background:#E8E8E8;
text-align:justify;
}



/********** Navigation ********/
#mainNav {
background-color:#FFF;

}
#mainNav a{
background-position:right bottom;
color: #000;
font-weight:normal;
font-size:11px;
cursor: default;
display:block;
float:left;
margin:0px 0px 0px 3px ;
line-height: 16px;
text-decoration:none;
height:35px;

}
/* Highlight Current Page Menu Button */
#home #mainNav .home a,
#aboutus #mainNav .aboutus a,
#pcsupport #mainNav .pcsupport a,
#services #mainNav .services a,
#networks #mainNav .networks a,
#websitedesign #mainNav .websitedesign a,
#products #mainNav .products a,
#contactus #mainNav .contactus a,
#tools #mainNav .tools a 
{
	font-weight: bold;
	text-align:center; 
	color: #FFF;
	background: #949BA3 url('images/menutab-lft.gif') no-repeat;
	border-left: 1px #FFF solid;
	border-right: 1px #FFF solid;
	padding:3px 10px 0px 10px;}

#mainNav ul {
margin:0;
padding:0;
list-style:none;
width:860px;
float:left;
}

#mainNav ul li{
float:left;
}

#mainNav ul a,
#mainNav ul a:visited{
display:block;
width:90px; /* Width of menu tabs */
float:left;
padding:3px 10px 0px 10px;
text-decoration:none;
text-align:center; 
color:#000;
}

#mainNav ul .first a {
background:none;
}

#mainNav ul a:hover {
	color: #000;
	background: #C0C0C0 url('images/menutab-lft-hvr.gif') no-repeat;;
}

/********** End of Navigation ***********/
#TopMargin {
padding:0px 0px;
width:1000px;
line-height:16px;
height:20px;
/*background:#1A3F95; Top Margin background colour */
/*border:0px #FFF solid;*/
background: url(images/top-border.gif) #386CE7;
color:#FFF;
font:12px;
text-align:right;
}
#NavMargin {
clear:both;
margin-top:0px;
width:1000px;
height:7px;
background:#0D348D;
}

#BottomMargin {
clear:both;
width:1000px;
height:22px;
color:#FFFFFF;
font: 10px Verdana, Arial, Helvetica, sans-serif;
line-height:18px;
background-color: #1A3F95;
/*background: url(images/btm-border.gif) no-repeat;*/
}
.BotMarginCopyright{
position: relative;
width:190px;
margin-left: 20px;
}
.BotMarginContact{
position: relative;
width:100px;
margin-left: 150px;
}

.BotMarginWebDesign{
position: relative;
width: 290px;
margin-left:200px;
}
.BotMarginWebDesign a, 
.BotMarginWebDesign a:visited  {
color:#FFFFFF;
}
#branding{
	height:100px;
	float: left;
	top:auto;
}
#branding img{
	border: 0px;
	margin-left: 16px;
	margin-right: 10px;
	margin-top: 10px;
}

/* Form Styling */
#contact-form {
	background:#B2D8EF;
	clear: both;
	font-size:12px;
	margin-left: 15px;
}
#contact-form .label {
float: left;
width:175px;	
text-align: right;
clear: left;
margin-right: 15px;
}
#contact-form p {
margin-left: 15px;
}

#contact-form .textbox {
float: 	left;
background:white;
text-align: left;
margin-left: 15px;
}

#contact-form .sendbutton {
	margin-left: 250px;
	background-color:#A8D5EC;
}
#contact-form .sentmsg {
	font-size:12px;
	font-weight:bold;
	color:red;
	text-align:	center;
}
textarea#details {
	margin-left:30px;
}