/**
* Master.css
*
* Krailler CSS designed and developed by Wiseguy Digital for V-On ltd.
* http://www.wiseguydigital.com
*/

html, * { margin:0; padding:0; }
body { font-family:"Lucida Grande", Arial, Helvetica, sans-serif; font-size:0.8em; color:#555; background:#fff; }
h1 { font-weight:normal; text-transform:none; color:#444; margin:1em 0 0 0; }
h1.centered { margin:10px 0 0 0; text-align:center; }
h1.top { margin-top:0; margin-bottom:1em; }
h2 { color:#444; font-size:1.4em; font-weight:normal; margin-top:.8em; margin-bottom:5px; }
h3 { margin:3em 0 0 0; }
a { color:#797A46; text-decoration:none; }
a:hover { color:#A8AE61; }
a.non-link, a.non-link:hover { color:#3B3B32; }
a.non-link:hover { cursor: pointer; }
p { line-height:1.4em; margin:1em 0; }
a img { border:none; }
ul { margin:1em 0 1em 2em; }

/** Sections */
#wrapper { width:960px; padding:10px; margin:auto; }

/** Header */
#header { position:relative; text-align:center; height:80px; width:940px; margin:auto; border-bottom:1px solid #ccc; margin-bottom:20px; }
#header p#logo { position:absolute; top:21px; left:0; display:block; width:161px; height:50px; margin:0; padding:0; }
#header p#logo a { outline:none; display:block; width:200px; height:50px; background:url(../images/logo.png) no-repeat; }
#header p#logo span { display:none; }
#header #call-now { position:absolute; top:15px; right:0; width:183px; height:19px; }
#header #sustainability { position:absolute; top:-6px; right:-4px; }
#header #client-area { position:absolute; top:-18px; right:-28px; }
#header ul { margin:0; text-align:right; position:absolute; top: 55px; right:0; }
#header ul.nav { list-style:none; }
#header ul.nav li { display:inline; margin-left:20px; }
#header ul.nav li a { text-decoration:none; color:#444; text-transform:uppercase; font-weight:bold; font-size:11px; }
#header ul.nav li.active a, #header ul.nav li.active a:hover { color:#A8AE61; }
#header ul.nav li a:hover { color:#797A46; }
/** Shop is separate */
#header ul.nav  li.last { margin-left:20px; border-left:3px solid #ccc; padding-left:20px; }
#header ul.nav li.last a {     background-color: #80A832;color: #FFFFFF;padding: 4px;position: relative;top: -1px; }
#header ul.nav li.last a:hover {  background-color: #666;color: #FFFFFF; padding: 4px;  }

/** Main content */
#main-content { position:relative; padding:0 0 10px 0; margin-left:10px; }
.small-box { background:#e2e2d4; height:195px; margin-bottom:20px; }
.small-box h2 { margin:5px 10px; text-align:center; font-size:24px; }
.slideshow { height:600px; position:relative; }
.slideshow img:hover { cursor:pointer; }
#slideshow-container { display:block; width: 940px; height:600px; position:relative; } 
#instructions { z-index:10001; position:absolute; background: url(../images/grey-transparency.png); color:#fff; bottom:0; margin:0; padding:20px; width:900px; text-align:center; }
#info-box { background:#e2e2d4; padding:10px; width:280px; color:#3b3b32; font-size:0.9em; }
#info-box h3 { margin-top:1.6em; }
.image-p { margin:0; }
.hometext { display:none; }
ul.sitemap { margin-left:2em; }
ul.sitemap ul { margin-left:2em; }

/** Home page content */
#home-title { display:none; position:absolute; top:350px; left:0; z-index:300; padding:20px; background:transparent url(../images/white-overlay.png); }
#home-title h1 { font-size:2.6em; color:#797A46; margin:0; padding:0; font-weight:normal; }
#home-large-image { width:940px; height:450px; background:#f8f8f8; margin-bottom:20px; }

/** Common Grid elements */
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10,
.grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16, .grid-17, .grid-18 { 
	margin-right:10px; margin-left:10px; display:inline; float:left;
}
.grid-first { clear:left; margin-left:0; }
.grid-last { clear:right; margin-right:0; }

/** 16 Grid-based sizes */
.grid-container-16 { width:960px; margin-left:auto; margin-right:auto; }
.grid-container-16 .grid-1 { width:40px; }
.grid-container-16 .grid-2 { width:100px; }
.grid-container-16 .grid-3 { width:160px; }
.grid-container-16 .grid-4 { width:220px; }
.grid-container-16 .grid-5 { width:280px; }
.grid-container-16 .grid-6 { width:340px; }
.grid-container-16 .grid-7 { width:400px; }
.grid-container-16 .grid-8 { width:460px; }
.grid-container-16 .grid-9 { width:520px; }
.grid-container-16 .grid-10 { width:580px; }
.grid-container-16 .grid-11 { width:640px; }
.grid-container-16 .grid-12 { width:700px; }
.grid-container-16 .grid-13 { width:760px; }
.grid-container-16 .grid-14 { width:820px; }
.grid-container-16 .grid-15 { width:880px; }
.grid-container-16 .grid-16 { width:940px; margin-left:10px; }

/** 12 Grid-based sizes */
.grid-container-12 { width:960px; margin-left:auto; margin-right:auto; }
.grid-container-12 .grid-1 { width:60px; }
.grid-container-12 .grid-2 { width:140px; }
.grid-container-12 .grid-3 { width:220px; }
.grid-container-12 .grid-4 { width:300px; }
.grid-container-12 .grid-5 { width:380px; }
.grid-container-12 .grid-6 { width:460px; }
.grid-container-12 .grid-7 { width:540px; }
.grid-container-12 .grid-8 { width:620px; }
.grid-container-12 .grid-9 { width:700px; }
.grid-container-12 .grid-10 { width:780px; }
.grid-container-12 .grid-11 { width:860px; }
.grid-container-12 .grid-12 { width:940px; margin-left:10px; }

/** Form */
#contact-box,
.shopping-options { background:#e2e2d4; padding:20px; color:#42505e; }
div.errors { padding:10px; background:#797A46 repeat-x; color:#fff; line-height:1.6em; }
form label { width:150px; float:left; text-align:right; margin-right:10px; }
form p.spaced { margin-left:160px; }
form input, form textarea { width:350px; border:1px solid #fff; padding:5px 7px; font-size:1.1em; font-family:Arial, Helvetica, sans-serif; color:#666; background:url(../images/input-bg.jpg) repeat-x #fff; }
form input.required, form textarea.required { border:1px solid #90a7bf; color:#666; }
form label.required { color:#797A46; }
form input.checkbox { width:auto; }
form input.submit-btn { border:none; background:url(../images/send-button.jpg) no-repeat transparent; display:block; width:150px; height:30px; color:#535633; font-size:10px; text-transform:uppercase; font-weight:bold;  }
form input.submit-btn:hover { background-position:-150px 0; cursor:pointer; color:#fff; }

/** Materials **/
#materials { background:#e2e2d4; padding:10px; width:920px; margin-bottom:2em; min-height:200px; }
#materials-nav { width:245px; float:left; list-style:none; margin:0; }
#materials-nav li { margin-bottom:10px; }
#materials-nav li a { background:url(../images/materials-pointer-dark.png) no-repeat transparent; outline:none; display:block; width:235px; height:25px; padding-left:10px; padding-top:5px; color:#D7DC79; font-size:15px; }
#materials-nav li a:active, #materials-nav li.material-selected a, #materials-nav li.material-selected a:hover { color:#222; background-image:url(../images/materials-pointer-light.png); }
#materials-nav li a:hover { color:#fff; }

#materials-info { background:#fff; padding:10px; width:655px; float:left; }
#materials-info ul { list-style:none; margin:0; }
#materials-info ul li { width:100px; height:140px; margin-right:10px; margin-bottom:20px; text-align:center; float:left; }
#materials-info ul li a { color:#222; }
#materials-info ul li.col-end { margin-right:0; }
#materials-info ul li.fixtures, #materials-info ul li.wide { height:100px; }
#materials-info ul li.fixtures span, #materials-info ul li.wide span { display:none; }
#materials-info ul li.wide { width:150px; }
.material-info-box { background:#fff; min-height:190px; }

#materials-info h3 { clear:both; margin-bottom:10px; margin-top:10px; color:#797A46; font-weight:bold; font-size:1.2em; border-bottom:1px solid #ccc; padding-bottom:10px; }
#materials-info h4 { margin-top:20px; color:#333; }
#materials-info ul li span { display:block; clear:both; }

/** FAQs */
#faqs dt:hover { cursor:pointer; color:#A8AE61; }
#faqs dt { padding:0 0 1em 20px; font-size:1.3em; color:#666; }
#faqs dt.unopen { background:url(../images/arrow-right.gif) no-repeat 0 5px; }
#faqs dt.open { color:#A8AE61; background:url(../images/arrow-down.gif) no-repeat 0 5px; padding-bottom:0; }
#faqs dd { padding:2em; margin-bottom:1em; background:#e2e2d4; color:#3b3b32; }

/** Online Store */
#cart { position:absolute; right:0; top:10px; }

table .cell-1 label { margin:0; width:auto; float:right; }
table .cell-1 { width:50px; text-align:right; padding:5px 20px 5px 0; }
.product-image { margin-top:20px; padding:5px; border:5px solid #fff; margin-bottom:5px; }
.product-image:hover { border-color:#666; }
.price { color:#222; font-weight:bold; }
.thumbnails { border:5px solid #ddd; margin-top:7px; width:150px; height:99px; display:block; margin-right:7px; float:left; padding:3px; }
.thumbnails:hover { border-color:#666; }
.last-thumb { margin-right:0; }
.image-info-text { text-align:center; clear:both; padding-top:10px; font-style: italic; font-size:0.9em; }
.foxycat { margin:0 20px 20px 0; }
.foxyprod { margin:0 0 0 0; padding:5px; border:5px solid #fff; text-align:center; }
.foxyprod:hover { border-color:#666; }
.back-to-cats { padding:5px 10px; display:block; background:#666; color:#fff; width:380px; }
.shop-sideblock { margin:20px 0; }
.shop-sideblock { background:#e2e2d4; padding:10px; color:#3b3b32; font-size:0.9em; }
.shop-sideblock ul { margin-left:15px; }
.shop-sideblock li { margin:5px 0;}
.shop-sideblock a { color:#222; }
.shop-sideblock a:hover { color:#666; }
.shop-categories h3 { font-size:12px; text-transform:uppercase; color:#fff; margin-top:10px; background:#e2e2d4; color:#333; padding:5px 7px; margin-bottom:1px; }
.shop-categories ul { margin:0; padding:0; list-style:none; }
.shop-categories li a { display:block; background:#666; color:#fff; padding:5px 7px; margin-bottom:1px; }
.shop-categories li a:hover { background:#444; }
.shop-categories li.active a { background:#222; color:#aaa; }

/** Footer */
#footer { position:relative; height:30px; width:940px; margin:auto; text-align:left; font-size:10px; padding:10px 0; border-top:1px solid #ccc; }
#footer, #footer a { color:#666; }
#footer p { position:absolute; left:0; top:20px; padding:0; margin:0; width:570px; }
#footer #credits { position:absolute; top:10px; right:0; width:330px; }
#footer #erameri { margin:0 10px 0 0; padding:0; }
#footer #v-on { margin:0; padding:0; }

a.back-button { display:block; width:150px; height:23px; color:#535633; background:url(../images/back-button.jpg) no-repeat transparent; padding-top:7px; text-align:center; }
a.back-button:hover { background-position:-150px 0; cursor:pointer; color:#fff; }
/** Generic */
.clear-all { clear:both; height:1px; }
/* facebook box */
.fb {width: 250px; float: right; margin-left: 320px; margin-top: 4px;}
.job {border-bottom: 1px solid #CCC;margin-bottom: -25px;}
#phonenumber { position:absolute; right:0; top:0px; }