/**** © 2009 soVision Ltd ****/
/** CSS Styles for soVision   **/

/* ISP STYLES */

/* Site Wide Colours 
BACKGROUNDS    
	Grey		:	#666667
	Dark Grey	:	#333334
	Dark Blue	:	#3D6E91 
	Light Blue	:	#70A6D1  
    Gold        :   #FFCC34  

TEXT    
	Grey		:	#666666
	Dark Grey	:	#333333
	Dark Blue	:	#3D6E90 
	Light Blue	:	#70A6D0  
    Gold        :   #FFCC33      		
*/

/* PAGE HOLDER */
html{
	background:#70A6D1 url(images/page-bg.jpg) top repeat-x;		
}
body{
	margin:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#333;
	background:url(images/container.png) center repeat-y;
}

.container{
	width:970px;
	margin:0 auto 0 auto;
}

img{
	border:none;
}

/* STYLES FOR MAIN */
.main{
	margin:0 auto 0 auto;
	background:url(images/head-bg-call.jpg) top center no-repeat;
	width:948px;
	min-height:200px;
}
.main-contain{
	float:left;
	width:auto;
	padding:8px;
}
/* Banners */
.banners{
	height:64px;
	float:left;
	padding:12px 0 0 0;
	margin:0;
	position:relative;
	width:948px;
}
.banners .isp{
	background:url(images/banner-isp.png) top left no-repeat;
	width:272px;
	height:60px;
	float:left;
	margin:0 12px 0 0;
}
.banners .it{
	background:url(images/banner-it.png) top left no-repeat;
	width:272px;
	height:60px;
	float:left;
	margin:0 12px 0 0;
}
.banners .design{
	background:url(images/banner-design.png) top left no-repeat;
	width:272px;
	height:60px;
	float:left;
	margin:0 12px 0 0;
}
.banners h2{
	color:#ffffff;
	font-size:1.8em;
	font-weight:normal;
	padding:12px 0 0 12px;
}
.banners h3{
	margin:15px 14px 0 60px;
	color:#fff;
	font-size:0.9em;
	padding:0;
}
.banners h3 a{
	color:#fff;
	text-decoration:none;
}
.banners h3 a:hover{
	text-decoration:underline;
}
.banners .go{
}

	/* INTRO STYLES */
	.intro{
		clear:both;
		margin:12px auto 0 auto;
		height:140px;
		width:948px;
	}
	.logo{
		float:left;
		width:100%;
		height:120px;
		margin:0;
		background:url(images/it-icon.jpg) no-repeat;
		position:relative;
	}
	.logo img{
		position:absolute;
		right:0;
		margin-top:10px;
	}
	.logo h1{
		margin:0;
		padding:4px 0 0 80px;
		color:#000;
		font-size:2.4em;
		font-weight:bold;
	}
	.logo h2{
		margin:0;
		padding:0 0 0 80px;
		color:#666;
		font-size:1.3em;
		font-weight:normal;
	    width:570px;
	}
	.home-news{
		float:left;
		width:305px;
		height:127px;
		margin:0 16px 0 0;
		background:url(images/news-border.png) top left no-repeat; 
	}
	.home-news .inner{
		padding:12px;
	}
	.home-news h2{
		font-size:1.3em;
		margin:0;
	}
	.home-news p{
		margin:0.5em 0 0 0;
		font-size:0.8em;
		color:#666;
	}
	.toplist-title a
	{
	    color:#666;
	    font-weight:bold;
	    text-decoration:none;
	    float:left;
	    width:auto;
	}
	.read-more a{
	    color:#666;
	    font-weight:bold;
	}
	.promo-one{
		float:left;
		width:305px;
		height:127px;
	}
	
/* SIDE NAV STYLES */ 
.left-col{
    float:left;
    width:auto;
}
.side-nav{
	float:left;
	position:relative;
	margin:0 0 8px 0;
	width:176px;
	font-size:0.9em;
}
.side-nav-top{
	padding:12px 6px 0 6px;
	background:url(images/left-nav-top-bg.png) top center no-repeat;
}
.side-nav-top ul, .side-nav-top li, .sub-nav ul,  .sub-nav li{
	list-style:none;
	margin:0;
    padding:0;
}
.side-nav a{
	color:#fff;
	text-decoration:none;
	display:block;
	margin:0 1px 0 0;
	padding:7px 4px 4px 4px;
	border-top:1px solid #ccc;
}
.side-nav .sub-nav a{
    display:block;
	padding:4px 0 1px 10px;
	font-size:0.95em;
	border-top:1px solid #ccc;
	background:#1380FF;
}
.side-nav a:hover{
	color:#FFCC33;
	background:#0A67FF;
}
.side-nav .selected{
	background:#023BFF!important;
	color:#FFCC33;
}
.side-nav-bottom{
	font-size:1px;
	height:12px;
	background:#fff url(images/left-nav-bot-bg.png) bottom center no-repeat;
}
/* cert */
.cert{
	margin:12px 0 0 0;
	text-align:center;
}
	
/* PAGE CONTENT STYLES */	
.content-area{
	float:left;
	position:relative;
	margin:0 0 0 12px;
	padding:0;
	width:530px;
	min-height:154px;
	background:url(images/content-area-bg.png) top left no-repeat;
}
.content-area .inner{
	padding:12px 10px 12px 10px;
}
.content-area-list{
	float:left;
	position:relative;
	margin:0 0 0 12px;
	padding:0;
	width:735px;
	min-height:154px;
	background:url(images/content-area-list-bg.png) top left no-repeat;
}
.content-area-list .inner{
	padding:12px 10px 12px 10px;
}
.content-boxes{
	padding:0;
	margin:0;	
}
.content-boxes img{
	margin:14px 4px 0 0;
}

/* RIGHT COLUMN STYLES */
.right-col{
	float:left;
	position:relative;
	width:208px;
}
/* BOX STYLES */
	.black-box{
		background:url(images/208-black.png) top center no-repeat;
		width:208px;
		height:154px;
		margin:0 auto 10px auto;
	}
	.black-box .inner{ padding:12px;}
	.black-box h1{
		color:#fff;
		font-size:1.4em;
		padding:0 0 0.5em 0;
		margin:0;
	}
	.black-box h2{
		color:#333;
		font-size:1.2em;
		padding:0.1em;
		margin:0 0 0.25em 0;
		text-align:center;
		font-weight:bold;
		background:#ffffcc;
	}
	.black-box p{
		color:#fff;
		padding:0 0 0.5em 0;
		margin:0;
	}
	.black-box a{
		color:#FFCC33;
		text-decoration:none;		
	}
	.black-box a:hover{
		text-decoration:underline;
	}
	.go{
		width:29px;
		height:20px;
		background:url(images/go.png) top center no-repeat;
		text-align:center;
		text-decoration:none;
		line-height:20px;
		margin:0 0 0 1em;
		color:#fff!important;
		font-weight:bold;
		padding:2px 7px 3px 7px;
	}
	.button{
		text-align:right;
		height:20px;
		line-height:20px;
	}
	.button a{text-decoration:none;}
	.button a:hover{text-decoration:underline;}
	.button span{
		float:left;
		width:auto;
	}
	.call-back{
		background:url(images/call-0845-450-3669.png) top center no-repeat;
		height:156px;
	}
	.call-back .button{
		padding:120px 10px 0 0;
	}
	
/* STYLES FOR FOOT */
.foot{
	background:url(images/foot-bg.jpg) bottom center no-repeat;
	height:44px;
	clear:both;
	margin:4px 0 0 0;
	padding:0;
}
.foot-links{
	clear:both;
	padding:22px 0 0 0;
	font-size:0.7em;
	width:944px;
	text-align:center;
	color:#333;
	margin:0 auto 0 auto;
}
.foot-links a{
	color:#fff;
	text-decoration:none;
}
.foot-links a:hover{
	color:#FFCC33;
	text-decoration:underline;
}
.credits{
	background:#70A6D0 url(images/container-bot.png) top center no-repeat;
	padding:8px 0 0 0;
	height:30px;
}
.credits-content{
	width:970px;
	margin:0 auto 0 auto;
}
.copy{
	float:left;
	position:relative;
	font-size:0.7em;
	color:#0E5CA7;
	width:50%;
	padding:0;
	margin:10px 12px 0 12px;
}
.copy a{
	color:#0E5CA7;
	text-decoration:none;	
}
.copy a:hover{
	color:#0E5CA7;
	text-decoration:underline;	
}
.w3c{
	float:right;
	width:auto;
	position:relative;
	padding:0;
	margin:8px 12px 0 12px;
}
.w3c img{
	margin-left:12px;
}
/* MISC */
.clear{ clear:both;}
.listitem_date{
    font-size:0.75em;
    color:#666;
} 
/* TABLES */
/* Styles for tables */
.tablestyle td, .tablestyle th {
    border: 1px solid #eee;
    text-align:left;
    padding: 8px;
    vertical-align:top;
}
.tablestyle th.header{
    background-color:#bfd4e9;
}
.tablestyle th{
}
/* table grid formatting*/
.grid-table{border: #666 1px solid; color:#666;}
.grid-table .row1{	background:#fff;}
.grid-table .row2{ background:#E7EEF4;}
.grid-table th{background:#B8D3E8; font-weight:bold; padding:4px;}
.grid-table td{padding:4px;}
.grid-table p{padding:0; margin:0; text-align:center;}
.grid-table-header{background:#B8D3E8; font-weight:bold; padding:4px;}

/* IN PAGE PANEL */
.panel-holder{
	float:left;
	width:auto;
	clear:both;
	margin:0 -10px 0 -10px;
}
.panel{
	background: url(images/panel-bottom.jpg) center bottom no-repeat;
	width:235px;
	float:left;
	margin:0 6px 12px 4px;
	min-height:150px;
}
.panel-top{
	background:url(images/panel-top.jpg) top center no-repeat;
	min-height:100px;
	padding:6px 8px 6px 8px;
}
/* TEXT STYLING */
h1{
	color:#0E5CA7;
	font-size:1.8em;
	font-weight:normal;
	margin:0 0 0.6em 0;
	padding:0;
}
h1 em{
	font-style:normal;
	color:#666;
}
h2{
	color:#0E5CA7;
	font-size:1.3em;
	font-weight:normal;
	margin:0 0 0.6em 0;
	padding:0;
}
h2 a{
	color:#0E5CA7;
	text-decoration:none;
}
h2 a:hover{
    color:#666;
	text-decoration:underline;
}
h3{
	color:#0E5CA7;
	font-size:1.1em;
	margin:0 0 0.6em 0;
	padding:0;
}
h4{
	color:#0E5CA7;
	font-size:1.1em;
	font-style:italic;
	margin:0 0 0.6em 0;
	padding:0;
}
h4{
	color:#000;
	font-size:1em;
	margin:0 0 0.6em 0;
	padding:0;
}
h5{
	color:#666;
	font-size:1em;
	margin:0 0 0.6em 0;
	padding:0;
}
h6{
	color:#666;
	font-size:1em;
	font-style:italic;
	margin:0 0 0.6em 0;
	padding:0;
}
p{
	margin:0.2em 0 1.6em 0;
	padding:0;
}
ul{
    margin:0.2em 2em 1.6em 2em;
}
ul li{
    list-style:disc;
}
ol{
    margin:0.2em 2em 1.6em 2em;
}
ol li{
    list-style:decimal;
    }
hr{
    color:#666;
	background-color:#666667;
	border:0;
	height:1px;
}
a{color:#3D6E90;}
a:hover{color:#CC6600;}
.small{font-size:0.85em;}

/*portfolio*/
.portfolio-section{
    border:1px solid #ccc; 
    padding:4px 4px 0 4px; 
    margin:0 0 6px 0;
    float:left; 
    width:100%;
}
.portfolio{
    background:#E7EEF4;
    padding:4px;
    margin:0 0 4px 0;
    clear:both;
    min-height:180px;
}
.portfolio img{
    float:right;
    width:auto;
    padding:2px;
    margin:0 4px 0 4px;
    border:1px solid #ccc;
    background:#fff;
}