/*
	Copyright 2010 ITNZ Solutions Ltd. All rights reserved.
*/


	/*****************************
	CONTENTS
	1.	Global Styles
		- Reset
		- Layout
		- Column Positioning
		- Typography
	2.	Navigation
	3.	Accordian Menus
	4.	Footer
	*****************************/


/*****************************
	1. Global Styles
*****************************/

/***************** Reset ****************/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input {margin: 0; padding: 0;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-size: 1em; font-weight: normal; font-style: normal;}
ul,ol {list-style: none; }
fieldset,img {border: none;outline: 0;}
caption,th {text-align: left; }
table {border-collapse: collapse; border-spacing: 0;}
.clearer {clear: both;}
.spacer {height: 10px; display: block; clear: both;}
a {outline: none;}
.hide {display: none;}
.noBorder {border: 0 !important;}
.noPadding {padding: 0 !important;}
.noMargin {margin: 0 !important;}
.noMarginTop {margin-top: 0 !important;}
.accessibility {position: absolute; left: -999em;}


/***************** Layout ****************/
html {height: 100%;}
body {
	height: 100%;
	background: url('https://www.itnz-solutions.co.nz/i/bg_gradient.gif') top left repeat-x #005096;
	color:#222;
	font-family: 'lucida grande', verdana, tahoma, sans-serif;
	font-size: 11px;
	line-height: 1.4em;
	font-family:  'Lucida Grande', 'Lucida Sans Unicode','Lucida Sans', 'Trebuchet MS', Helvetica, sans-serif;
}
b, strong, em, i {font-family: 'Lucida Sans', 'Lucida Sans Unicode', 'Lucida Grande', 'Trebuchet MS', Helvetica, sans-serif;}
#wrapper {
	width: 900px;/*the padding below pushes this wide (to 906px) for shadow to fit in*/
	padding: 1px 3px 5px 3px;
	padding: 0 3px;
	background: url('https://www.itnz-solutions.co.nz/i/shadow_middle.png') top left repeat-y;
	margin: 0 auto;
	position: relative;
	top: 14px;
	}
div#banner {
	width: 900px;
	height: 81px;
	overflow: hidden;
	background: url('https://www.itnz-solutions.co.nz/i/banner.gif') top right no-repeat #005096 !important;
	position: relative;
	}
div#logo {
	width: 130px;
	height: 64px;
	background: url('https://www.itnz-solutions.co.nz/i/logo_itnz.gif') top left no-repeat #005096;
	position: absolute;
	top: 8px;
	left: 20px;
	}
div#headerShadow {
	width: 16px;
	height: 97px;
	position: relative;
	left: 762px;
	}
div#content {
	background: url('https://www.itnz-solutions.co.nz/i/bg_columns.gif') top repeat-y;
	width: 900px;
	}
div#padding {
	padding: 0 10px 12px;
	width: 880px;
	position: relative;
	}
img.left {
	float: left;
	margin: 0 16px 10px 0;
	position: relative;
	top: 3px;
	}
img.right {
	float: right;
	margin: 0 0 10px 16px;
	position: relative;
	top: 3px;
	}
img.bordered {
	padding: 5px;
	border: 1px solid #ccc; 
	}
form {
	padding: 0;
	}
form p {
	padding: 0 10px 0 0;
	margin-top: 4px;
	margin-bottom: 0;
	font-weight: 900;
	width: 205px;
	float: left;
	text-align: right;
	clear: left;
	font-size: 1em;
	}
input, textarea {
	border-width: 1px;
	border-style: solid;
	border-color: #777 #ddd #ddd #777;
	width: 215px;
	display: block;
	margin: 3px 0 10px 0;
	padding: 2px 5px;
	font-family: 'lucida grande', verdana, tahoma, sans-serif;
	font-size: 1em;
	line-height: 1.4em;
	float: left;
	display: inline;
	}
input {
	width: 215px;
	}
textarea {
	width: 430px;
	}
input.button {
	position: relative;
	left: 215px;
	width: auto;
	padding: 2px 10px;
	border-color: #ddd #777 #777 #ddd;
	}
input:focus, textarea:focus {
	background-color: #fff; 
	border-color: #E00639;
	}

/***************** Staff Photos ****************/
div.staffPhoto {
	display: block;
	padding: 10px 11px;
	margin-bottom: 20px;
	width: 140px;
	background: url('https://www.itnz-solutions.co.nz/i/staff_bg.gif') left top no-repeat;
	}
div.staffPhoto p {
	font-weight: 900;
	margin: 12px 0 0 -10px;
	}
div.staffPhoto p span {
	font-weight: 300;
	font-size: 0.9em;
	color: #666;
	text-transform: uppercase;
	line-height: 1em;
	}

/***************** Column Positioning ****************/
.col1, .col2, .col3, .col4 {float: left; width: 215px; overflow: hidden;}
.col2, .col3 {margin-left: 6px;}
.col4 {margin-left: 8px;}
.col123 {float: left; width: 657px; overflow: hidden;/*border-top: 1px dotted #B2CBDF;*/}

/***************** Typography ****************/
th, h1, h2, h3, h4, h5, h6 {
	font-weight: 300;
	}
h1 {
	font-size: 18px;
	display: inline;
	padding-bottom: 11px;
	padding-top: 12px;
	background: #fff;
	display: block;
	color: #005096;
	font-family: helvetica, arial, sans-serif;
	}
h2, h3, h4 {
	font-size: 1.1em;
	font-weight: 900;
	clear: both;
	padding: 4px 10px;
	}
h2 {
	margin-top: 1.2em;
	margin-bottom: 8px;
	background-color: #ddd;
	color: #000;
	}
h3 {
	margin-top: 0;
	margin-bottom: 1.4em;
	background-color: #ddd;
	color: #000;
	}
h4 {
	background-color: #737373;
	color: #fff;
	font-weight: 300;
	text-transform: uppercase;
	padding: 3px 6px;
	}
h5 {
	background-color: #E00639;
	color: #fff;
	font-weight: 300;
	font-size: 12px;
	padding: 3px 10px;
	color: #E8F0F7;
	}
strong {
	font-weight: 900;
	}
p {
	padding: 0 10px;
	}
p, ol {
	color: #333;
	font-size: 12px;
	line-height: 18px;
	margin-bottom: 1em;
	color: #444;
	}
p + ol {
	margin-top: -0.5em;
	}
ol li {
	padding-left: 14px;
	padding-left: 24px;
	background: url('https://www.itnz-solutions.co.nz/i/bullet_ball.gif') 10px 3px no-repeat;
	}
a {
	color: #E00639;
	text-decoration: underline;
	}
a:hover {
	}
td {
	vertical-align: top;
	}
div#blurb {
	background: url('https://www.itnz-solutions.co.nz/i/bg_blurb.gif') left top repeat-x #001958;
	padding: 4px 0 7px 0;
	width: 657px;
	margin-bottom: 5px;
	}
div#blurb p {
	margin-bottom: 0;
	font-size: 13px;
	line-height: 18px;
	}
div#blurb  p {color: #dadada;}
div.homeBox {
	border: 1px solid #E00639;
	border: 1px solid #737373;
	background: #eee;
	height: 184px;
	position: relative;
	}
div.homeBox p {
	font-size: 0.95em;
	padding: 3px 6px;
	}
div.homeBox a.link {
	text-decoration: none;
	position: absolute;
	bottom: 2px;
	right: 6px;
	padding-right: 10px;
	background: url('https://www.itnz-solutions.co.nz/i/bullet_red.gif') right 6px no-repeat;
	}
div.homeBox a:hover {
	color: #eee;
	background: url('https://www.itnz-solutions.co.nz/i/bullet_white.gif') right 6px no-repeat #E00639;
	}
a:hover {
	cursor: pointer;
	}

/*****************************
	2. Nav
*****************************/
div#main_nav{
	width: 900px;
	height: 42px;
	background: url('https://www.itnz-solutions.co.nz/i/bg_nav.gif') top repeat-x;
	position: relative;
	}
ul#nav {
	position: absolute;
	left: 0px;
	top: 1px;
	list-style: none;
	text-transform: uppercase;
	}
ul#nav li {
	float: left;
	height: 38px;
	overflow: hidden;
	}
li#nav1 a {border-left: 0 !important;}
li#nav6 a {border-right: 0 !important;}

li#nav1{width: 91px;}
li#nav2{width: 139px;}
li#nav3{width: 139px;}
li#nav4{width: 139px;}
li#nav5{width: 171px;}
li#nav6{width: 90px;}
li#nav7{width: 131px;}

ul#nav li a {
	display: block;
	text-align: center;
	line-height: 36px;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	color: #e8f0f7;
	padding-top: 2px;
	border-left: 1px solid #407CB0;
	border-right: 1px solid #001958;
	}
ul#nav a:hover {
	color: #B2CBDF;
	background: #004B8D;
	border-left: 1px solid #005096;
	border-right: 1px solid #005096;
	}
ul#nav li:hover, #nav li.sfhover { 
	background: #005096;
	}
ul#nav li.current a {
    background: #e3e3e3;
    color: #001958;
    border-left: 1px solid #e3e3e3;
	border-right: 1px solid #e3e3e3;
}


/*****************************
	2b. Sub_nav
*****************************/

ul#sub_nav {
	position: relative;
    top: -3px;
    margin-bottom: -3px;
	list-style: none;
	width: 892px;
	height: 38px;
	background: white url('https://www.itnz-solutions.co.nz/i/bg_sub_nav.gif') top repeat-x;
padding-left: 8px;	
}
ul#sub_nav li {
	float: left;
	height: 38px;
	overflow: hidden;
	}
ul#sub_nav li a {
	xdisplay: block;
	text-align: center;
	line-height: 36px;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	color: #005096;
	padding: 0 0 0 12px;
margin-right: 12px;
	}
ul#sub_nav a:hover,
ul#sub_nav li.current a {
	color: #E00639;
	}



/*****************************
	3. Accordion Menus
	https://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu.htm
*****************************/
.arrowlistmenu .menuheader { /*CSS class for menu headers in general (expanding or not!)*/
	cursor: hand;
	cursor: pointer;
	background: url('https://www.itnz-solutions.co.nz/i/menu_top.gif') 0 0 no-repeat;
	padding: 4px 10px 0 20px;
	margin: 0;
	font-weight: 900;
	color: #000;
	border: none;
	}
.arrowlistmenu .openheader { /*CSS class to apply to expandable header when it's expanded*/
	background: url('https://www.itnz-solutions.co.nz/i/menu_top.gif') -215px 0 no-repeat;
	}
.arrowlistmenu h3 {
	margin: 0;
	font-size: 11px;
	}
.arrowlistmenu ul {
	/*background: url('https://www.itnz-solutions.co.nz/i/menu_middle.png') 0 0 repeat-y;*/
	padding: 2px 10px 0;
	margin: 0;
	line-height: 1.4em;
	}
.arrowlistmenu ul li {
	font-size: 10px;
	color: #005096;
	padding-left: 10px;
	padding-top: 3px;
	background: url('https://www.itnz-solutions.co.nz/i/bullet.gif') 0 7px no-repeat;
	font-family: helvetica;}


/*****************************
	4. Footer
*****************************/
div#byline {
	height: 34px;
	line-height: 32px;
	padding: 0 10px;
	background: #001958;
	color: #acb3b7;
	font-weight: normal;
	border-bottom: 1px solid #407CB0;
	border-top: 10px solid #fff;
	font-size: 12px;
	font-family: georgia, times, serif;
	font-style: italic;
	}
div#footer {
	height: 30px;
	padding: 8px 0px 0;
	}
div#footer ul, div#footer p {
	font-size: 10px;
	font-size: 11px;
	line-height: 20px;
	font-weight: 300;
	}
div#footer ul li {
	float: left;
	}
div#footer ul li a {
	display: block;
	text-align: center;
	font-weight: 300;
	text-decoration: none;
	color: #fff;
	border-left: 1px solid #407CB0;
	padding-left: 10px;
	margin-left: 10px;
	}
div#footer a:hover {
	color: #B2CBDF;
	}
div#footer p {
	float: right;
	color: #B2CBDF;
	}
div#footerShadow {
	height: 6px;
	position: relative;
	z-index: 12;
	width: 906px;
	left: -3px;
	background: url('https://www.itnz-solutions.co.nz/i/shadow_bottom.png') bottom left no-repeat;
	}




/*****************************
	5. Promo box
*****************************/

div.promo_box {
    border: 1px solid #E00639;
    padding-bottom: 5px;
    background: #fff;
    }
div.promo_box b {
    margin-bottom: 1em;
    color: #E00639;
    }
div.promo_box h5 {
    margin-bottom: 0.5em;
    }

div.white-spacer {
    height: 20px;
    background: #fff;
    }