﻿@charset "utf-8";
/* CSS Document */
/*Skin Style Sheet Notes for [JOB NAME]

version:   		1.0
author:    		StormID
email:    		info@stormid.com
website:   		http://www.[THESITE].com/

last updated:	15/10/2009

Basic Color Palette

primary-color:
secondary-color:
titles-color:
font-color:
link:
link-hover:
link-visited:

Font-size Adjustment

To change the size of a font, use a percentage value from the list below.
Always use percentages as the units because they render more consistently than ems,
and because they allow user-initiated resizing (unlike pixels).
		 
For pixels(px) Declare the appropriate percentage(%)

			Pixels 	EMs 		Percent Points  
			6px 	0.462em 	46.2% 	5pt     
			7px 	0.538em 	53.8% 	5pt	    
			8px 	0.615em 	61.5% 	6pt      
			9px 	0.692em 	69.2% 	7pt      
			10px 	0.769em 	77% 	8pt     
			11px 	0.846em 	85% 	8pt      	
			12px 	0.923em 	93% 	9pt      	
			13px 	1em 		100% 	10pt
			14px 	1.077em 	108% 	11pt
			15px 	1.154em 	116% 	11pt
			16px 	1.231em 	123.1% 	12pt
			17px 	1.308em 	131% 	13pt
			18px 	1.385em 	138.5% 	14pt
			19px 	1.462em 	146.5% 	14pt
			20px 	1.538em 	153.9% 	15pt
			21px 	1.615em 	161.6% 	16pt
			22px 	1.692em 	167% 	17pt
			23px 	1.769em 	174% 	17pt
			24px 	1.846em 	182% 	18pt 
				
For custom font sizes see http://pxtoem.com/ and use the 100% setting as body size.
				
Skin Style Sheet Notes end */
body {
				background: #FFFFFF url(../images/common/bg-body.png) repeat-x left top;
}
/* Basic Positional Holders Starts */
.container_12 {
				/* wraps the whole of the content. Appears directly after the body tag*/
    /* temp background image used as visual aid for grid*/
    background: #FFFFFF /* url(../images/common/bg-grid.gif) repeat-y left top*/;
				margin-top: 10px;
				margin-bottom: 10px;
}
.hd.print {
				/* hides inline logo for print.css use*/
	display: none;
}
.bd {
}
.ft {
}
/* Basic Positional Holders Ends */
/* Basic Element Styles Starts (part of YUI's CSS Foundation) */
h1 {
				/*22px equivalent*/
	font-size: 167%;
				color: #BD8A57;
}
h2 {
				/*18px equivalent*/
	font-size: 138.5%;
				padding: 0px 0px 10px 0px;
				border-bottom: 1px dotted #BD8A57;
}
h3 {
				/*14px  equivalent*/
	font-size: 108%;
				color: #BD8A57;
}
h4 {
				/*11px  equivalent*/
	font-size: 85%;
				background-color: #F0F0F0;
				border-bottom: 1px solid #BD8A57;
				padding: 5px;
				color: #000;
}
h1, h2, h3, h4 {
				/* top & bottom margin based on font size */
	margin: 1em 0;
}
h1, h2, h3 {
				/*bringing boldness back to headers and the strong element*/
	font-weight: bold;
				font-family: 'Lucida Sans', Georgia, Times New Roman, Serif;
				font-weight: normal;
}
strong {
				/*bringing boldness back to the strong element*/
	font-weight: bold;
}
p {
				/* Sets equilant of 12px */
	font-size: 93%;
				line-height: 130%;
				color: #666666;
				margin-bottom: 1em;
}
abbr, acronym {
				/*indicating to users that more info is available */
	border-bottom: 1px dotted #000;
				cursor: help;
}
em {
				/*bringing italics back to the em element*/
	font-style: italic;
				border-bottom: 1px dotted #CCCCCC;
				display: block;
}
strong, b {
				/*bringing bold back to the strong and b elements*/
	font-style: italic;
}
.blockquote, ul, ol, dl {
				/*giving blockquotes and lists room to breath*/
	margin: 1em;
}
ol, ul, dl {
				/*bringing lists on to the page with breathing room */
	margin-left: 2em;
}
ol li {
				/*giving OL's LIs generated numbers*/
	list-style: decimal outside;
				margin: 4px 0;
}
ul li {
				/*giving UL's LIs generated disc markers*/
	list-style: disc outside;
				margin: 4px 0;
				color: #666666;
				font-size: 93%;
}
blockquote {
				/*callout text holder default styling*/
	border-bottom: 1px solid #ccc;
				border-top: 10px solid #ccc;
				display: block;
				float: left;
				margin: 10px 20px 20px 0;
				padding: 10px 0;
				width: 220px;
				display: block;
}
blockquote p {
				/*callout text default styling*/
	color: #666666;
				display: block;
				float: left;
				font-size: 130%;
				line-height: 140%;
				margin: 0 15px 5px;
				padding: 0 !important;
}
.annotation {
				display: block;
				padding: 10px;
				font-size: 93%;
				color: #999;
				background-color: #ededed;
				margin: 0 0 10px 0;
				border-bottom: 1px solid #ddd;
}
/* Basic Element Styles Ends */
/* Search Box Styles Start*/
.srch {
				margin: 40px 0 0 0;
				width: auto;
}
.srch .textfield {
				padding: 5px 10px;
				width: 200px;
}
.srch .button {
				padding: 5px 10px;
}
/* Search Box Styles End*/
/* Basic Link Styles Start */
a.header:link {
				/* unvisited link */
	color: #000000;
				text-decoration: none;
}
a.header:active {
				color: #999;
				text-decoration: underline;
}
a:visited {
				/* visited link */
	color: #000;
}
a:hover {
				/* mouse over link */
	color: #CCC;
				text-decoration: underline;
}
/* Basic Link Styles End */
.logo a {
				margin: 0;
				position: relative;
				width: 540px;
				height: 104px;
				font-size: 77%;
				display: block;
				text-decoration: none;
}
.logo a span {
				background: #FFFFFF url(../images/branding/bg-logo.png) no-repeat left top;
				display: block;
				height: 100%;
				position: absolute;
				width: 100%;
				text-decoration: none;
}
.pc {
}
.box {
				background-color: #EEE;
				padding: 10px 10px;
				margin: 0 0 10px;
				margin-top: 10px;
}
.box h1, .box h2, .box h3 {
				margin-top: 0;
				padding-top: 0;
}
/* Basic Element Styles End */
/* Navigation Styles Start - Handle Sub-navigation by casscading styles, eg .ns ul ul*/
.np ul, .ns ul, .nt ul, .nb ul, .ft ul, .tools ul {
				/*giving navigation ul's no margins*/
	margin: 0;
}
.np li, .ns li, .nt li, .nb li, .ft li, .tools li {
				/*giving navigation ul li's no margins and removing disc markers*/
	margin: 0 0 0 0;
				list-style-type: none;
}
/* Navigate Primary Styles Start */
.np {
				/* Navigate Primary*/ 
    float: left;
				width: 100%;
				background: #FFFFFF;
				font-size: 93%;
				line-height: normal;
				border-bottom: 1px solid #DDDDDD;
				padding: 0;
				margin: 0;
}
.np ul {
				margin: 0 0 1px 0;
				padding: 10px 10px 0 10px;
/* Controls the indentation of the tabs */				list-style: none;
}
.np li {
				display: inline;
				margin: 0 0px 0 0;
				padding: 0;
}
.np a {
				float: left;
				background: url(../images/navigation/bg-np-left.gif) no-repeat left top;
/* displays the left hand side of the Tab graphic in the off state */				margin: 0 5px 0 0;
/* Controls the space between the tabs */				padding: 0 0 0 5px;
				text-decoration: none;
}
.np a span {
				float: left;
				display: block;
				background: url(../images/navigation/bg-np-right.gif) no-repeat right top;
/* displays the right hand side of the Tab graphic in the off state */				padding: 10px 15px 10px 6px;
				color: #000;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
.np a span {
				float: none;
}
/* End IE5-Mac hack */
.np a:hover span {
				color: #FFF;
}
.np a:hover {
				text-decoration: :none;
				background-position: 0% -42px;/* Controls position of left hover state graphic */
}
.np a:hover span {
				background-position: 100% -42px;/* Controls position of right hover state graphic */
}
.np .selected a {
				background-position: 0% -42px; /* Controls position of left Selected state graphic */
}
.np .selected a span {
				background-position: 100% -42px;
/* Controls position of right Selected state graphic */				color: #FFF;
}
/* Navigate Primary Styles End */
/* Navigate Secondary Styles Start */
.ns .ns-hd {
				/* Navigation Secondary header span*/ 
     display: block;
				color: #666;
				font-weight: bold;
				padding: 8px 0 8px 10px;
				margin: 10px 0 0 0;
				background-color: #ddd;
}
.ns {
}
.ns li a {
				display: block;
				height: 24px; /* minimum height = desired height - top + Bottom padding used in following class */;
				text-decoration: none;
				color: #000;
				font-size: 93%;
}
.ns li a:link, .ns li a:visited {
				color: #000;
				background-image: url(../images/navigation/bg-ns.gif);
				background-position: 0 0;
				background-repeat: repeat-x;
				padding: 8px 0 0 10px;
}
.ns li a:hover, .ns li.selected a {
				color: #000;
				background-image: url(../images/navigation/bg-ns.gif);
				background-repeat: repeat-x;
				background-position: 0 -32px;
				padding: 8px 0 0 10px;
				text-decoration: none;
}
.ns li.selected {
				padding: 0;
}
/* Navigate Secondary Submenu Styles Start */
.ns ul ul {
				margin: 0 0 1px 0px;
				padding: 0 0 0 20px;
				background-color: #ffffff;
}
.ns ul ul li a {
				height: auto;
				padding: 5px 10px;
				margin: 1px 0 0 0;
}
.ns ul ul li a:link, .ns ul ul li a:visited {
				color: #000;
				display: block;
				background-color: #fff;
				background-image: none;
				padding: 5px 10px;
}
.ns ul ul li a:hover, .ns ul ul li.selected a {
				color: #333;
				background-color: #dddddd;
				background-image: none;
}
/* Navigate Secondary Submenu Styles End */
/* Navigate Secondary Styles End */
/* Navigate Tertiary Styles Start */
.nt {
				/* Navigation Tertiary*/
    font-size: 85%;
				color: #999999;
				margin: 10px 0px;
				padding: 0 10px;
}
.nt ul {
				margin: 0;
				padding: 0;
				float: right;
}
.nt ul li {
				display: inline;
				float: left;
				margin: 0 0 0 0;
				padding: 0;
				height: 20px;
				line-height: 20px;
}
.nt ul li a {
				margin: 0 0 0 10px;
				padding: 0 0px 0 0px;
}
/* Navigate Tertiary Styles End */
/* Navigate Breadcrumb Styles Start */
.nb {
				/* Navigation Breadcrumb*/
    font-size: 85%;
				color: #999999;
				margin: 0;
				border-bottom: 1px solid #CCCCCC;
}
.nb ul {
				margin: 0;
				padding: 0;
				float: left;
}
.nb ul li {
				display: inline;
				float: left;
				height: 30px;
				line-height: 30px;
				margin: 0;
				padding: 0 0px 0 10px;
}
.nb ul li a {
				margin: 0 0 0 0px;
				padding: 0 15px 0 0px;
				background: url(../images/navigation/bg-nbc-li.png) no-repeat right center;
				color: #333333;
}
/* Navigate Breadcrumb Styles End */
/* Navigate Footer Styles Start*/
.ft {
				/* Navigation Footer*/   
    font-size: 85%;
				color: #999999;
				border-top: 1px solid #dddddd;
				background-color: #fff;
}
.ft p {
				font-size: 110%;
				color: #666666;
				margin: 0;
				padding: 10px 10px 0;
}
.ft ul {
				margin: 0;
				padding: 0;
				float: left;
}
.ft ul li {
				display: inline;
				float: left;
				margin: 0px 0 10px 0;
				padding: 0;
				height: 20px;
				line-height: 20px;
}
.ft ul li a {
				margin: 0 0 0 10px;
				padding: 0 0px 0 0px;
}
/* Navigate Footer Styles End */
/* Navigate Tools Styles Start */
.tools {
				border-top: 1px solid #DDDDDD;
				height: 30px;
				margin: 0 0 10px 0;
}
.tools ul {
				list-style-image: none;
				list-style-position: outside;
				list-style-type: none;
				margin: 0 0 1px;
				padding: 10px 10px 0;
				text-align: right;
}
.tools ul li {
				display: inline;
				margin: 0 0 0 0;
				padding: 0;
}
.tools ul li a {
				float: right;
				color: #999;
				font-size: 93%;
				display: block;
				margin: 0 5px 0 0;
				padding: 0 0 0 5px;
				text-decoration: none;
}
.tools ul li a:hover {
				color: #000;
				text-decoration: underline;
}
.tools ul li a.print span.icon {
}
.tools ul li a.print span.icon, .tools ul li a.top span.icon, .tools ul li a.email span.icon {
				display: block;
				height: 16px;
				width: 16px;
				margin: 0 5px 0 0;
				float: left;
				color: #000;
				background-image: url(../images/icons/sprite-icons.png);
}
.tools ul li a.print span.icon {
				background-position: -48px 0;
}
.tools ul li a.top span.icon {
				background-position: -64px 0;
}
.tools ul li a.email span.icon {
				background-position: -80px 0;
}
/* Navigate Tools Styles End*/
/* Navigation Styles End  */
/* Gallery Rotator Styles Start */
.ad-gallery {
				width: 700px;
}
.ad-gallery, .ad-gallery * {
				margin: 0;
				padding: 0;
}
#gallery {
				margin-bottom: 10px;
				margin-top: 10px;
}
.ad-gallery .ad-image-wrapper {
				width: 100%;
				height: 270px;
				margin-bottom: 10px;
				position: relative;
				overflow: hidden;
}
.ad-gallery .ad-image-wrapper .ad-loader {
				position: absolute;
				z-index: 10;
				top: 48%;
				left: 48%;
				border: 1px solid #CCC;
}
.ad-gallery .ad-image-wrapper .ad-next {
				position: absolute;
				right: 0;
				top: 0;
				width: 25%;
				height: 100%;
				cursor: pointer;
				display: block;
				z-index: 100;
}
.ad-gallery .ad-image-wrapper .ad-prev {
				position: absolute;
				left: 0;
				top: 0;
				width: 25%;
				height: 100%;
				cursor: pointer;
				display: block;
				z-index: 100;
}
.ad-gallery .ad-image-wrapper .ad-prev, .ad-gallery .ad-image-wrapper .ad-next {
				/* Or else IE will hide it */
      background: url(non-existing.jpg)\9;
}
.ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image, .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
				background: url(../images/gallery/ad_prev.png);
				width: 30px;
				height: 30px;
				display: none;
				position: absolute;
				top: 47%;
				left: 0;
				z-index: 101;
}
.ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
				background: url(../images/gallery/ad_next.png);
				width: 30px;
				height: 30px;
				right: 0;
				left: auto;
}
.ad-gallery .ad-image-wrapper .ad-image {
				position: absolute;
				overflow: hidden;
				top: 0;
				left: 0;
				z-index: 9;
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description {
				position: absolute;
				bottom: 0px;
				left: 0px;
				padding: 7px;
				text-align: left;
				width: 100%;
				z-index: 2;
				background: url(../images/gallery/opa75.png);
				color: #000;
}
* html .ad-gallery .ad-image-wrapper .ad-image .ad-image-description {
				background: none;
				filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='opa75.png');
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description .ad-description-title {
				display: block;
}
.ad-gallery .ad-controls {
				height: 20px;
}
.ad-gallery .ad-info {
				float: left;
}
.ad-gallery .ad-slideshow-controls {
				float: right;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-start, .ad-gallery .ad-slideshow-controls .ad-slideshow-stop {
				padding-left: 5px;
				cursor: pointer;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-countdown {
				padding-left: 5px;
				font-size: 0.9em;
}
.ad-gallery .ad-slideshow-running .ad-slideshow-start {
				cursor: default;
				font-style: italic;
}
.ad-gallery .ad-nav {
				width: 100%;
				position: relative;
}
.ad-gallery .ad-forward, .ad-gallery .ad-back {
				position: absolute;
				top: 0;
				height: 100%;
				z-index: 10;
}
/* IE 6 doesn't like height: 100% */
* html .ad-gallery .ad-forward, .ad-gallery .ad-back {
				height: 100px;
}
.ad-gallery .ad-back {
				cursor: pointer;
				left: -20px;
				width: 13px;
				display: block;
				background: url(../images/gallery/ad_scroll_back.png) 0px 22px no-repeat;
}
.ad-gallery .ad-forward {
				cursor: pointer;
				display: block;
				right: -20px;
				width: 13px;
				background: url(../images/gallery/ad_scroll_forward.png) 0px 22px no-repeat;
}
.ad-gallery .ad-nav .ad-thumbs {
				overflow: hidden;
				width: 100%;
}
.ad-gallery .ad-thumbs .ad-thumb-list {
				float: left;
				width: 9000px;
				list-style: none;
}
.ad-gallery .ad-thumbs li {
				float: left;
				padding-right: 5px;
				list-style-type: none;
}
.ad-gallery .ad-thumbs li a {
				display: block;
}
.ad-gallery .ad-thumbs li a img {
				border: 3px solid #CCC;
				display: block;
}
.ad-gallery .ad-thumbs li a.ad-active img {
				border: 3px solid #616161;
}
/* Can't do display none, since Opera won't load the images then */
.ad-preloads {
				position: absolute;
				left: -9000px;
				top: -9000px;
}
/* Gallery Rotator Styles End */
.top-curve {
				background-image: url('../images/common/top-curve-bg.jpg');
				background-position: left top;
				background-repeat: no-repeat;
}
.open-for-business {
				float: right;
}
.home-hero {
				margin-top: 10px;
				margin-bottom: 10px;
}


.ft {
				background-image:url('../images/common/ft-bg.jpg');
				background-position:right top;
				background-repeat:no-repeat;
				height:100px;
}