/**************************************************************
Isle of Wight Council Stylesheet for www.iwight.com.
Copyright Isle of Wight Council 2007
All rights reserved
Written by Matt Pattinson

IF YOU MAKE ANY AMENDMENTS RUN THE CODE THROUGH http://www.cleancss.com/ AND UPDATE THE COMPACT STYLESHEET

STYLESHEET CONTENTS
1. HTML Tags
2. Layout and formatting
	a. Site Layout
	b. Header
	c. Footer
	d. Navigation
	e. Content Column
	f. Info Column
	g. HomepageBox
	h. A-Z Services Grid
3. General Formatting Classes

COLOUR SCHEME
SubNav
Blue (Homepage / Council) - #659ACF
Green (Living) - #87AD5C
Red (Learning) - #D21D22
Purple (Working) - #A16182
Yellow (One Island) - #EFB914

***************************************************************/

/********************* HTML Tags ********************/
* { 
	margin: 0px;
	padding: 0px;}

html {font-family:Verdana; font-size:x-small;	}	

body {	
	background:url(../images/body_background.gif) top repeat-y;
	font-family:Verdana; font-size:x-small;
	}

p { font-family:Arial,Verdana;	}

li {
	list-style-type: none;}

a:link, a:active, a:hover, a:visited {}

a:hover {}

a img { border: none;}

h1, h2, h3{	}

h1 {}
		
h2 {}

h3 {}
	
/* Image Replacement */
h1 span, h2 span, h3 span, h4 span, header span { 
	display:none;}	

	
/********************* End HTML Tags *********************/
		
/********************* Layout and Formatting *********************/

/* -------- Site Layout -------- */

#container {	
	width: 950px;
	margin:0 auto;
	padding: 0px 10px;}
	

#leftColContainer {
	float: left;}

#content {
	float: left;
	width: 580px;
	padding: 5px;
	margin: 10px 0px 15px 15px;}	
	

/* -------- End Site Layout -------- */

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

#header {
	clear: both;
	background: url(../images/header_background.jpg) top left no-repeat;}
	

#accessibilityBar {
	text-align: right;
	background-color: #003E95;
	padding: 3px;
	width: 944px;}

#accessibilityBar a {
	}
				
#searchBox {}	

#txtIwightSearch {
	padding: 2px;}	

#btnIwightSearch {}	

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

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

#footer {
	clear:both;
	margin-top: 30px;
	padding: 30px 10px 10px 10px;
	background: url(../images/footerband.gif) top left repeat-x;}

#copyright {
	margin-left: 10px;}

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

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

#navContainer{}

#mainNav {	
	clear:both;
	padding: 130px 0px 0px 187px;}		

#mainNav ul{
	list-style-type: none;}

#mainNav li{
	display:inline;
	margin-right: 1px;}
	
#mainNav a {
	float:left;
	background:url(../images/tab_left_home.gif) no-repeat left top;
	margin-right: 1px;
	padding:0 0 0 4px;	
	line-height: 25px;}

#mainNav a span {
	float:left;
	display:block;
	background:url(../images/tab_right_home.gif) no-repeat right top;
	padding:3px 15px 3px 8px;}

/* Commented Backslash Hack hides rule from IE5-Mac \*/

#mainNav a span {
	float:none;}

/* End IE5-Mac hack */

#mainNav a:hover span {
	}
	
#mainNav a.active {	
	background-position:0% -44px;
	margin-top: -7px;
	line-height: 32px;}

#mainNav a.active span {
	background-position:100% -44px;}
	
#mainNav a.active:hover {	
	background-position:0% -44px;}

#mainNav a.active:hover span {
	background-position:100% -44px;}

#mainNav a:hover {	
	background-position:0% 3px;}

#mainNav a:hover span {
	background-position:100% 3px;}
				
#subNav {	
	clear:both;
	background-color: #659ACF;
	overflow: hidden;
	margin-left: 187px;}
	
#subNav ul li {
	display: inline;
	float: left;}	
	
#subNav ul li a{
	display:block;
	border-right: 1px solid #92B7DC; }	
	
#subNav ul li a:Hover, #subNav ul li a.subNavActive{
	background-color: #3D7EC0;}							
	
#breadcrumb {
	clear: both;
	margin: 5px 5px 5px 210px;}	

#sideNav {	
	overflow:hidden;
	clear: both;
	float: left;
	width: 177px;}	
	
#sideNavTitle, .sideNavTitle{	
	display: block;
	background-color: #3D7EC0;
	padding: 4px;}
	
#sideNav a{
	display: block;
	padding: 4px;
	border-bottom: solid 1px #cccccc; }
	
#sideNav ul li ul {
	display: none;
	margin-left: 10px;}
	
#sideNav .sideNavItem {
	padding: 5px 4px;}

#sideNav .sideNavParent {
	/*background: url(../images/section_arrow.gif) right no-repeat #D3DFF1;*/
	background-color: #D3DFF1;}

#sideNav ul li ul.showSubMenu {
	display:block;}

.sideNavActive{}	

#sideNav .sideSubNavItem {
	background: url(../images/sideSubNav_left_border.gif) top left repeat-y;
	padding-left: 8px;}

#sideNav .sideSubNavItem:hover, #sideNav .sideNavItem:Hover {
	background-color: #ECF2F9; 
	color:#039}
	
/* -------- End Navigation -------- */

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

#featurebox {
	margin-bottom: 20px;
	position: relative;
	border: 1px solid #CCC;
	padding: 2px;
	overflow: hidden;}
	
#featureBox .title {
	}

#featurebox .slides .slide .feature p {
	margin: 10px 0px;}

#featureBox img {
	float: left;
	margin-right: 10px;}

.fbLink {
	padding-left: 15px;
	background: url(../images/bulletTransparent.gif) left no-repeat;
	line-height: 15px;}
		
#featurebox .slides{
	height: 160px;}

#featurebox .slides .slide {
	float:left;
	width: 568px;
	position: absolute;}
	
#featureBox .slides .slide img {
	position: absolute;}
	
#featurebox .slides .slide .feature {
	position: absolute;
	width: 290px;
	right: 0;
	top: 0;}
	
#featurebox #slideButtons {
	width: 100%;}

#featurebox #slideButtons .slideBtn {
	width: 276px;
	float:left;
	display: block;
	border: 1px solid #CCC;
	padding: 2px;
	margin: 2px;}	

#featurebox #slideButtons .slideBtn:hover{
	cursor:pointer;}
		
/* -------- End Content Column -------- */

/* -------- Info Column -------- */

#InfoColumn {
	float: right;
	width: 160px;
	margin-bottom: 15px;}

#InfoColumnTitle, #quickLinksTitle {
	display: block;
	background-color: #3D7EC0;
	padding: 4px;}
	
#quickLinks {
	float: right;
	width: 160px;}

#quickLinksList {
	margin-top: 5px;}

#quickLinksList ul li {	
	border: 1px solid #CCC;
	padding: 2px;
	position: relative;
	margin-top: 5px;}

#quickLinksList ul li a {
	background: url(../images/quickLinkBG.gif) top left repeat-x;
	display: block;	
	height:29px;
	padding-top:12px;}	

#quickLinksList ul li a.long {
	padding-top:6px;
	height:35px;}
	
#quickLinksList ul li a.qlIcon {
	padding-left: 45px;}	
	
#quickLinksList ul li img {
	position:absolute;
	left: 0;
	top: 0;}		

/* -------- End Info Column -------- */

/* -------- homepageBox -------- */

#newsCol, #whatsNewCol, #councilCol {float: left;}

#newsCol {}
#whatsNewCol {}
#councilCol {}

.homepageBox {
	width: 183px;	
	margin: 5px 10px 5px 0px;
	float:left;
	clear: left;}
	
.hpbTitle {	
	display: block;
	background-color: #659ACF; /* #E1E6F0;*/
	border-bottom: 1px solid #FFF;
	padding: 3px 5px;
	overflow: hidden;}
	
.hpbTitle span {
	float: left;}	

.hpbTitle img {
	float: right;}		
	
.hpbContent {
	padding: 7px 5px 5px 7px;
	background-color: #F1F1F1;}
	
.hpbContent ul li {
	padding-left: 15px;
	background: url(../images/bulletTransparent.gif) left top no-repeat;
	margin: 4px 0px;}
	
.hpbContent ul li a{
	display:block;}
	
/* -------- End homepageBox -------- */
	
/* -------- A-Z Services Grid -------- */

#azGrid{
	float: left;
	clear: left;
	margin: 15px 0px;}
	
#azGridTitle{
	display: block;
	width: 169px;
	background-color: #3D7EC0;
	padding: 4px;}

#azGridList{
	margin-top: 5px;
	width: 177px;
	padding-left: 1px;}
	
#azGrid ul li{
	display: inline;
	float:left;
	width: 13%; 
	border: 1px solid #FFF;
	background-color: #E1E6F0;
	text-align: center;
	padding: 0;
	margin: 0;
	line-height: 29px;}	

#azGrid ul li#double {
	width: 27%;}

#azGrid ul li a{
	display:block;}
	
#azGrid ul li a:Hover{
	background-color: #C5CEE2;}	

/* -------- End A-Z Services Grid -------- */
	
/********************* End Layout and Formatting *********************/

/********************* General Formatting *********************/

.hide {
	display:none;}

#spacer {}
	
.noBot{}				
	
label {}	
	
input.text,	textarea.text	{}
	
.button {}	
	
.clear {
	clear:both;}	

/********************* End General Formatting *********************/


/************ Print specific stuff ******************/
@media Print {
	.header { display:none; }
	.noPrint {display:none;}
	.content {width:100%;}
	.onlyPrint { display:block; }
}
@media Screen 
{
	.onlyPrint {display:none;}	
}