@charset "utf-8";
/* CSS Document */

/* -------------------- Page Layout styles -------------------- */
body {
	background-image: url(../images/bg-pattern-repeat.gif);
	margin: 0;
	padding: 0;
}
#bg-pattern-grad {
	background-image: url(../images/bg-pattern-grad-repeat.gif);
	background-repeat: repeat-x;
	margin: 0;
	padding: 28px 0 10px 15px;
	text-align: center;
}

#top {
	background-image: url(../images/bg-top.png);
	background-repeat: no-repeat;
	text-align: left;
	width: 605px;
	height: 69px;
	margin: 0 auto 0 auto;
	padding: 5px 15px 0 5px;
}

/* ------- the iepngfix doesn't tile bg images ---------------------------------------- */
/* ------- if page is very long then this BG image will need to be resized for ie 5 & 6 */
/* ------- currently 2000 pixels high ------------------------------------------------- */
#middle {
	background-image: url(../images/bg-middle.png);
	background-repeat: repeat-y;
	text-align: left;
	width: 600px;
	margin: 0 auto 0 auto;
	padding: 0 20px 0 5px;
	border: 0px;
}
#middle-shadow {
	background-image: url(../images/bg-middle.png);
	background-repeat: repeat-y;
	width: 610px;
	margin: 0 auto 0 auto;
	padding: 0 15px 0 0;
}
#middle-content {
	background-image: url(../images/bg-middle-repeat2.gif);
	background-repeat: repeat-y;
	width: 600px;
	padding: 10px 5px 0 5px;
	text-align: left;
}
#bottom {
	background-image: url(../images/bg-bottom2.png);
	background-repeat: no-repeat;
	text-align: left;
	width: 600px;
	height: 21px;
	margin: 0 auto 0 auto;
	padding: 0 20px 0 5px;
}
#header {
	float: left;
	width: 413px;
	margin: 0;
	padding: 0 10px 0 20px;
}
#logo {
	float: left;
	width: 147px;
	margin: 0;
	padding: 10px 15px 0 0;
}
#feature {
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
}
#info {
}
#services {
	width: 600px;
}
#footer {
	background-image: url(../images/bg-footer.gif);
	background-repeat: no-repeat;
	text-align: left;
	width: 600px;
	height: 20px;
}
#feature-navbar {
	background: #999;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-size: 70%;
	color: #333333;
	padding: 0 0 0 20px;
	margin: 0;
	width: 580px;
	height: 20px;
	line-height: 20px;
}
#togglebar {
	display: none;
/*
Info text Show/Hide bar hidden with css but is still in the HTML
*/
}

#main-navbar {
	background-image: url(../images/bg-nav2.gif);
	background-repeat: no-repeat;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-size: 70%;
	text-transform: uppercase;
	width: 600px;
	height: 20px;
}
#info-navbar {
	background-image: url(../images/bg-nav.gif);
	background-repeat: no-repeat;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-size: 70%;
	text-transform: uppercase;
	width: 600px;
	height: 20px;
}
.toggle-btn {
	float: right;
	margin: 0 2px 0 0;
}
.hideable-content {
}
#info-content {
	background-image: url(../images/bg-grad-services.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	margin: 0;
	color: #ffffff;
}
#info-shadow {
	background-image: url(../images/bg-grad-services.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	padding: 0 20px 0 20px;
}
#visible-feature {
	width: 600px;
	text-align: center;
}
#visible-info {
	padding: 0 20px 0 20px;
}
/* -------------------- Content styles -------------------- */

body, td {
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
}

th, h2, h3, h4, h5, h6 {
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

h1 {
	color: #FFFFFF;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
	font-weight: normal;
}

#header h1 {
	font-size: 125%;
	margin: 0;
	padding: 4px 0 0 0;
	text-transform: uppercase;
}
#header h2 {
	color: #999999;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
#sitelink {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 70%;
}

/* ---- 'padding' controls the spacing of paragraphs in the info area ---- */
#info-content p, #visible-info h4 {
	padding: 0 0 1.2em 0;
}

#info-content .first {
	padding-top: 0;
}
#info-content ul {
	padding: 0 0 1.5em 25px;
}



/* ---- Styles for the hidden text ---- */
/* ---- 'padding' below controls the spacing of strapline headers in the info area ---- */
/* NOTE: padding and margin css work in a clockwise manner sterting from the top, so 

padding: 4px 3px 2px 1px;

means padding of: 4 pixel top, 3 pixel right, 2 pixel bottom, 1 pixel left.
*/

#visible-info h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 110%;
	font-weight: bold;
	margin: 0;
	padding: 20px 0 4px 0;
}
#visible-info h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	font-weight: bold;
	line-height: 1.4em;
	margin: 0;
}
#visible-info p {
	font-size: 75%;
	line-height: 1.4em;
	margin: 0;
	padding: 0px 0 24px 0;
}



/* ---- Styles for the hidden text ---- */
.hideable-content h3 {
	font-size: 75%;
	font-weight: bold;
	margin: 0;
	padding: 0;
}
.hideable-content p, .hideable-content ul {
	font-size: 75%;
	line-height: 1.6em;
	margin: 0;
	padding: 0px 0 0px 0;
}



img {
	border: 0;
}

em {
	color: #ff0000;
	font-style: normal;
}

.clear-float {
	clear: both;
	display: block;
	margin: 0;
	padding: 0;
	height: 0px;
	line-height: 0px;
	font-size: 0px;
}

/* -------------------- Lightbox content styles -------------------- */
#lightbox p, #lbox-close {
	color: #333333;
	font-size: 75%;
	padding: 0 20px 0 20px;
}
#lbox-close {
	font-weight: bold;
	padding: 6px;
}



/* -------------------- Nav bars list items styles -------------------- */
#feature-navbar ul, #info-navbar ul, #main-navbar ul {
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#main-navbar ul {
	padding: 0 0 0 12px;
}
#feature-navbar ul li {
	display: inline;
	background: url(../images/bullet-menubar.gif) no-repeat 0 50%;
	margin: 0;
	padding: 0 0 0 8px;
}
#feature-navbar ul li.first {
	background-image: none;
	padding: 0;
}
#info-navbar ul li, #main-navbar ul li {
	display: inline;
	background: url(../images/bullet-menubar-white.gif) no-repeat right 50%;
	padding: 0 10px 0 8px;
	text-align: right;
	line-height: 20px;
}
#feature-navbar ul li.empty {
	background-image: none;
}




/* -------------------- Services Button area styles -------------------- */
.bg-grad-grey {
	background-image: url(../images/bg-grad-services.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	margin: 0;
	padding: 0 0 4px 0;
}

ul.serv-list {
	list-style: none;
	margin: 0;
	padding: 0;
	color: #ffffff;
}

li.serv-header {
	background-image: url(../images/bg-header-services-2tone-line.gif);
	background-repeat: repeat-x;
	margin: 0;
	padding: 0;
}

h2.serv-header-txt {
	float: left;
	background-image: url(../images/bg-header-services-2tone.gif);
	background-repeat: repeat-x;
	font-size: 70%;
	color: #FF0000;
	font-weight: bold;
	margin: 0 0 0 17px;
	padding: 0 5px 0 5px;
	text-transform: uppercase;
}

ul.serv-content {
	clear: both;
	list-style: none;
	margin: 0 0 0 7px;
	padding: 0;
}
ul.serv-content li {
	float: left;
	margin: 0 13px 0 14px;
	padding: 4px 0 2px 0;
	width: 119px;
}
.serv-btn-bg {
	background-color: #000000;
	width: 119px;
	height: 90px;
}
.serv-btn-txt {
	background-image: url(../images/bg-btn-services-bottom.gif);
	background-repeat: no-repeat;
	background-position: bottom left;
	font-size: 70%;
	margin: 0;
	padding: 0 4px 2px 4px;
	text-align: center;
}


/* -------------------- Footer styles -------------------- */
#bottom-rule {
	clear: both;
	width: 600px;
	height: 2px;
	margin: 0;
	padding: 0;
}


#address, #copyright {
	font-size: 65%;
	margin: 0 10px 0 10px;
	padding: 4px 0 0 0;
}
#copyright {
	float: right;
}




/* -------------------- Link styles -------------------- */
a img {
	vertical-align: middle;
}

a {
	color: #ff0000;
	text-decoration: none;
}
a:visited {
	color: #cc0000;
}
a:hover {
	color: #ff0000;
	text-decoration: underline;
}

a.toggle-show {
	color: #ff0000;
	text-decoration: none;
}
a:hover.toggle-show {
	color: #cccccc;
}
a.toggle-hide {
	color: #ff0000;
	text-decoration: none;
}
a:hover.toggle-hide {
	color: #cccccc;
}

#visible-feature a {outline: none;}
.hideable-content a {outline: none;}



