/*  HTML5 ✰ Boilerplate  */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,  footer, header, hgroup,
menu, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display:block;
}
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration: none;}
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }


body { font:13px/1.231 sans-serif; *font-size:small; }
select, input, textarea, button { font:99% sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif;}

body, select, input, textarea { color: #444; }
h1,h2,h3,h4,h5,h6 { font-weight: bold; font-family: Arial, Verdana, Geneva;}
html { overflow-y: scroll; }

a:hover, a:active { outline: none; }
a, a:active, a:visited { color: #607890; }
a:hover { color: #036; }

ul, ol {margin-left: 0;}
ol {list-style-type: decimal;}
ul {list-style-type: none;}

nav ul, nav li { margin: 0; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
td, td img { vertical-align: top; }
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
pre {  padding: 15px;  white-space: pre;  white-space: pre-wrap;  white-space: pre-line;  word-wrap: break-word; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { border-radius: 1px;  -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red;  box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid,
.no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection{ background: #292929; color:#fff; text-shadow: none; }
::selection { background:#292929; color:#fff; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #292929; }

button {  width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr;}
.hidden { display: none; visibility: hidden;}
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px);  clip: rect(1px, 1px, 1px, 1px); }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after {content: "\0020"; display: block; height: 0; visibility: hidden;}
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

 /* Primary Styles
    Author: Shawn Drew
 */

html, body {background: #EAEAEA; font-family: arial, sans-serif;}

.container {width: 963px; margin: 0 auto;}
#container {padding-top: 15px;}

#main {border: 1px solid #BBBBBB; /*border-bottom: none;*/ overflow: hidden; background: #FFF; -moz-box-shadow: 0px 0px 10px #ccc; -webkit-box-shadow: 0px 0px 10px #ccc; box-shadow: 0px 0px 10px #ccc;}

	#col-a {width: 200px; float: left;}

		#logo {padding: 17px; display: block;}

		#primary-nav {background: #1E8033 url(../img/top-nav-bg-sprite.png) no-repeat scroll 0px -350px; padding: 6px;}
			#primary-nav li {}
				#primary-nav a {display: block; text-transform: uppercase; font-size: 14px; color: #FFF; line-height: 2em; padding: 4px; background: transparent url(../img/border-bg.png) repeat-x scroll bottom left;}
				#primary-nav a:hover, #primary-nav .current a {background: #1D802E; background-image: none;}

				#primary-nav li:last-child a {background-image: none;}

				#primary-nav .before-current a, #primary-nav .hover-before-current a {background-image: none;}

				.ie6 #primary-nav a {zoom: 1; background-image: none; border-bottom: 1px dashed #217930;}
				.ie6 #primary-nav a:hover, .ie6 #primary-nav .current a {border-bottom-color: #1D802E;}
				.ie6 #primary-nav .before-current a, .ie6 #primary-nav .hover-before-current a {border-bottom-color: #1D802E;}

		#secondary-nav {padding: 10px;}
			#secondary-nav li {background: #FFF url(../img/border-bg.png) repeat-x scroll bottom left;}
				#secondary-nav a {display: block; color: #474746; font-size: 15px; background: transparent url(../img/top-nav-bg-sprite.png) no-repeat scroll 0px -300px; padding-left: 25px; line-height: 39px;}
				#secondary-nav a:hover {text-decoration: underline;}

				.ie6 #secondary-nav a {background: #FFF url(../img/ie6-arrow.png) no-repeat left center;}

	#col-b {width: 761px; float: left;}

		#top-nav {background: #E9E9E9/* url(../img/top-nav-bg.png) repeat-x scroll top left*/; height: 50px;}
			#top-nav li {float: left; height: 50px; background: #E9E9E9 url(../img/top-nav-bg-sprite.png) no-repeat scroll top right; text-align: center;}
				#top-nav a {color: #6E6E6E; display: block; text-transform: uppercase; height: 50px; line-height: 50px; font-size: 14px; background: transparent url(../img/top-nav-bg-sprite.png) no-repeat scroll 0px -100px;}
				#top-nav a:hover {color: #1D1D1D; font-weight: bold;}

				#top-nav li.current {background-position: 100% -50px;}
				#top-nav .current a {background-position: 0px -150px; font-weight: bold;}

				#top-nav .home {width: 86px;}
				#top-nav .about {width: 92px;}
				#top-nav .products {width: 122px;}
				#top-nav .reviews {width: 109px;}
				#top-nav .gallery {width: 108px;}
				#top-nav .brochure {width: 122px;}
				#top-nav .contact {width: 122px;}

				#top-nav .home a {background-position: 0px -200px;}
				#top-nav .current.home a {background-position: 0px -250px;}
				.ie6 #top-nav .current.home a {background-position: 0px -200px;}

#footer {/*background: #ECECEC;*/ color: #535353; position: relative; padding: 10px 0;}

	#footer .copyright {float: left; padding: 0 10px;}

	#footer-nav {float: left; padding-left: 10px;}
	#footer-nav li {float: left;}
	#footer-nav li a {color: #1D802E; padding: 0 10px;}
	#footer-nav li a:hover {text-decoration: underline;}

	#footer .outro {float: right; padding-right: 10px; text-transform: uppercase;}

/* home */
#home #col-a {height: 580px; background: transparent url(../img/col-a-bg.png) repeat-x scroll bottom left;}

#welcome-fader {position: relative; overflow: hidden; width: 761px; height: 530px;}
	#welcome-fader li {position: absolute; top: 0px; left: 0px; width: 761px; height: 530px;}
	#welcome-fader li.n0 {z-index:1;}

#feature-list {padding: 8px 0 8px 7px; float: left;}
	#feature-list li {float: left; padding: 0 4px;}
	#feature-list a {display: block;}
	#feature-list img {border: 1px solid #E3E3E3;}

/* product category */
#product-category-list {}
	#product-category-list li {float: left; margin: 0 15px 15px 0; border: 1px solid #E6E5E5;}
	#product-category-list .n3 {margin-right: 0;}
	#product-category-list a {display: block;}
	#product-category-list img {display: block;}

	.product-category-list-title {display: block; font-size: 16px; border-top: 1px solid #E6E5E5; padding: 6px;}

/* product detail */
#product-description {width: 345px; padding-right: 11px; float: left;}
	.product-color-swatch {display: inline-block; width: 20px; height: 10px;}

	.ielt8 .product-color-swatch {display: inline; margin-right: .5em;}
	.ie7 .product-color-swatch { position: relative; top: -3px;}
	.ie6 .product-color-swatch {line-height: 5px; height: 5px;}

#product-photos {width: 345px; float: left;}
	#product-photos-primary {border: 1px solid #E6E5E5;}
	#product-photos-primary img {display: block;}

	#product-photos-thumbs {border: 1px solid #E6E5E5; border-top: none; padding: 6px 6px 6px 0;}
		#product-photos-thumbs li {float: left; margin-left: 6px;}
		#product-photos-thumbs a {float: left; display: block;}
		#product-photos-thumbs img {border: 2px solid #FFF;}
		#product-photos-thumbs .current img {border-color: #8B8B8B;}

#product-custom {clear: both;}

#product-custom-colours {}
	#product-custom-colours li {width: 120px; float: left; margin: 0 20px 20px 0;}
	#product-custom-colours img {display: block;}
	#product-custom-colours span {display: block; text-align: center; padding-top: .3em;}

/* reviews */
#reviews {}
	#reviews li {background: transparent url(../img/border-bg.png) repeat-x scroll bottom left; padding-top: 8px;}
	#reviews li:last-child {background-image: none;}
	#reviews blockquote {padding: 10px 48px 10px 10px ; background: transparent url(../img/quote-end.png) no-repeat scroll top right;}
	#reviews div {padding-left: 48px; background: transparent url(../img/quote-start.png) no-repeat scroll top left;}


/* sitemap */
#sitemap {background:transparent url(../img/site-map-list.gif) repeat-y 15px 0; margin-left: 0; padding-left: 0;}
	#sitemap ul {margin-left: 0; padding-left: 0;}
	#sitemap li {margin 0; padding 0; list-style-type: none;}
	#sitemap li {font-size:16px; margin:15px 0 20px; padding:0 0 0 10px;}
	#sitemap li a {background: #FFF; display:block; padding:3px;}
		#sitemap li ul li {background:transparent url(../img/site-map-list.gif) repeat-x 0 8px; font-size:13px; margin:4px 0 4px 5px; padding:0 0 0 20px;}
		#sitemap li ul li a {padding:0 0 0 3px;}
		#sitemap li ul li ul {background:transparent url(.../img/site-map-list.gif) repeat-y 15px 0; margin-bottom:10px;}
			#sitemap li ul li ul li {margin-left:16px; padding-left:10px;}

/* gallery */
.gallery-img {display: block;}

/* common */
#content-page {min-height: 350px;}

h1 {color: #009413; font-size: 36px; margin-bottom: 20px; font-weight: normal;}
	h1 a, h1 a:link, h1 a:visited {color: #818181;}
	h1 a:hover, h1 a:active {text-decoration: underline; color: #666;}
	h1 a.sep {background: transparent url(../img/sep.gif) no-repeat scroll center right; padding-right: 18px;}

h2 {color: #009413; font-size: 24px; margin-bottom: 12px; font-weight: normal; padding-top: 14px;}
h3 {color: #009413; font-size: 18px; margin-bottom: 12px; font-weight: normal; padding-top: 10px;}
h4 {font-weight: bold; margin-bottom: 8px;}

.content-shadow {background: transparent url(../img/content-shadow.png) no-repeat scroll top left; padding: 30px;}

p.intro {font-weight: bold;}
p.download {/*background: transparent url(../img/border-bg.png) repeat-x scroll bottom left;*/}
a.pdf {background: transparent url(../img/pdf.png) no-repeat scroll top left; padding-left: 58px; line-height: 48px; display: block; font-size: 20px;}

.back {padding-top: 1em;}
	.back a {text-decoration: underline; background: transparent url(../img/back.gif) no-repeat scroll center left; padding-left: 10px;}

.content p, .content ul, .content ol {margin-bottom: 1em;}

.list li {margin-bottom: 0.2em; list-style-type: disc; margin-left: 20px;}

table {font-family: "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", sans-serif; padding: 0; margin: 0 0 1em 0; border-collapse: collapse; color: #333; background: #F3F5F7;}

	table thead th {background: #3A4856; padding: 15px 10px; color: #fff; text-align: left; font-weight: normal;}
	table tbody, table thead {border-left: 1px solid #EAECEE; border-right: 1px solid #EAECEE;}
	table tbody {border-bottom: 1px solid #EAECEE;}
	table tbody td, table tbody th {padding: 10px; text-align: left;}
	table tbody tr {background: #F3F5F7;}
	table tbody tr.odd {background: #F0F2F4;}
	table tbody  tr:hover {background: #EAECEE; color: #111;}
	table tfoot td, table tfoot th, table tfoot tr {text-align: left; font: 120%  "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", sans-serif; text-transform: uppercase; background: #fff; padding: 10px;}

table.full {width: 95%}
table.wide {width: 550px;}
table.narrow {width: 400px;}

.float-right-padded {float: right; padding: 0 0 1em 1em;}

a img {border: none;}


/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/*
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{outline:0;}
    #cboxContent{margin-top:32px; overflow:visible; background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#000; padding:1px;}
        #cboxLoadingGraphic{background:url(../img/loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#000;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(../img/controls.png) no-repeat 0 0;}

        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious:hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext:hover{background-position:-25px -25px;}
        #cboxClose{background-position:-50px 0px; right:0;}
        #cboxClose:hover{background-position:-50px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}


@media all and (orientation:portrait) {

}

@media all and (orientation:landscape) {

}

@media screen and (max-device-width: 480px) {


  /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none !important; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; }
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}
