/*	--------------------------------------------------
	----- LAYOUT: FLUID (FUNCTIONS) */
.block
{
	overflow: hidden;
	float: left;
	width: 25%;
}

.block.center-gap {width: 25%;}
.block.one-column {width: 100%;}
.block.two-column {width: 75%;}
.block.half-column {width: 50%;}

textarea {resize: none;}

button:focus,
a:focus, a:active {outline: none;}

section,
.outer-region {position: relative;}
.inner-region
{
	position: relative;
	max-width: 1200px;
	margin: 0px auto;
	z-index: 2;
	*width: 960px;
}
	
.inner-padding {padding: 5px;}
.clearFloat {clear: both; float: none !important;}
.clearFloat.handheld {clear: none;}

/*	--------------------------------------------------
----- LAYOUT: GENERAL */
#logo
{
	padding: 18px 0px 10px 0px;
	float: left;
}

#logo img {vertical-align: top;}
#header, header, #header-inner {height: 146px;}

#header
{
	background-image: url('images/header-tile.jpg');
	background-color: #000;
}

#header-inner
{
	background-image: url('images/header-highlight.png');
	background-position: center top;
	background-repeat: no-repeat;
}

#slidehsow-block, #content {background-color: #333;}
#front {background-color: #444;}
#footer {background-color: #222;}
#closure {background-color: #191919;}

body {background-color: #191919;}
td {vertical-align: top;}

.block .text .inner-padding {padding: 5px 0px;}

.list li
{
	margin-left: 15px;
	display: list-item;
	list-style: square outside none;
	padding-bottom: 5px;
}

.list.sub {padding: 5px 0px;}
.list.sub li {list-style: disc outside none; padding-bottom: 0px;}

.side-bar a, 
div.table a,
.page a {color: #aaa !important;}
.side-bar a:hover, 
div.table a:hover,
.page a:hover {color: #fff !important;}

.form-button {cursor: pointer;}

.form-textarea.error,
.form-textbox.error
{
	-webkit-box-shadow: 0px 0px 5px #d25f1d;
	-moz-box-shadow: 0px 0px 5px #d25f1d;
	box-shadow: 0px 0px 5px #d25f1d;
	border-color: #d25f1d;
}

.form-textarea.error:focus, .form-textbox.error:focus
{
	-webkit-box-shadow: 0px 0px 0px #d25f1d;
	-moz-box-shadow: 0px 0px 0px #d25f1d;
	box-shadow: 0px 0px 0px #d25f1d;
}

.contact-form label,
#contact-form label
{
	padding-bottom: 5px;
	position: relative;
	display: block;
	color: #ccc;
	font-size: 0.9em;
}
.contact-form label span,
#contact-form label span {color: #ff823b;}

.contact-form,
#contact-form
{
	padding: 0px 30px 0px 0px;
	display: block;
}

.form-textbox, .form-textarea
{
	border: 1px solid #222;
	padding: 5px;
	width: 96%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-color: #666;
}

.form-textbox:focus, .form-textarea:focus {background-color: #fff;}

.form-textarea {height: 90px;}

/*	--------------------------------------------------
----- DEFAULT PAGE LAYOUT */


.page
{
	background-color: #444;
	min-height: 420px;
	max-height: 100%;
	color: #ccc;
	font-size: 0.9em;
}
.mail-sent,
.side-bar,
.sidebar {color: #ccc;}

.sidebar  {position: relative;}

.mail-sent p,
.sidebar p, .side-bar p,
.page p {font-size: 0.9em;}

.page .inner-padding {padding: 30px 35px;}

.page-shadow
{
	position: absolute;
	height: 100%;
	width: 200px;
	z-index: 1;
	top: 0px;

	display: none;
}

.page-shadow.left
{
	background-image: url('images/page-shadow-left.png');
	left: 0px;
}

.page-shadow.right
{
	background-image: url('images/page-shadow-right.png');
	right: 0px;
}

.image-grid
{
	position: relative;
	width: 100%;
}

.image-grid div
{
	position: relative;
	float: left;
	width: 25%;
}

.image-grid a
{
	display: block;
	padding: 5px;
}

.image-grid img
{
	vertical-align: middle;
	width: 100%;
	box-shadow: 0px 0px 5px #000;	
	-webkit-box-shadow: 0px 0px 5px #000;
}

div.info {float: left; width: 30%; height: 360px;}
div.map {text-align: right; float: right; width: 100%; height: 360px;}
div.map .buffer {padding: 0px;}
div.map iframe.google-map
{
	/*box-shadow: 0px 0px 5px #000;	
	-webkit-box-shadow: 0px 0px 5px #000;*/
	background-image: url("images/map.jpg");
	background-position: center center;
	width: 100%;
	height: 360px;
}

.chunk
{
	line-height: 1.3em;
	float: left;
	width: 50%;
}
.chunk p {margin: 0px 3px;}

.chunk.full
{
	padding-top: 15px;
	width: 100%;
}

.page h1
{
	padding: 3px 0px 15px 0px;
	text-shadow: 0 0 2px #222222;
	font-size: 1.5em;
	color: #ff823b;
}

.page h2
{
	text-decoration: none;
	text-shadow: none;
	font-size: 1.3em;
}

.page h3
{
	text-shadow: none;
	font-size: 1.1em;
}

/*	--------------------------------------------------
----- DEFAULT SIDE-BAR LAYOUT */

.side-bar {overflow: visible;}
.side-bar .inner-padding {padding: 25px 5px 15px 5px;}

#footer-nav li,
.page-nav li
{
	position: relative;
	margin-bottom: 2px;
	display: block;
}

#footer-nav li span,
.page-nav li span
{
	background-image: url('images/page-selected-arrow.png');
	background-position: right center;
	background-repeat: no-repeat;
	position: absolute;
	display: none;
	height: 100%;
	width: 24px;
	left: 100%;
	top: 0px;
}

#footer-nav li,
.page-nav li.selected span {display: block;}

#anchor,
#footer-nav a,
.page-nav li a
{
	padding: 5px 15px 5px 0px;
	text-align: right;
	line-height: 27px;
	margin: 0px 15px 0px 0px;
	display: block;
	height: 25px;
	color: #aaa;
	
	font-size: 0.9em;
}

#anchor
{
	margin: 0px 10px 0px 0px;
	background-color: #111;
	padding: 5px 40px;
	float: right;
	display: none;
	
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.side-bar h3
{
	padding: 9px 0px 0px 0px;
}

#footer-nav a:hover,
.page-nav li a:hover {color: #fff;}
.side-bar h3 {color: #ff823b;}
.page-nav li.selected a,
page-nav li.selected a :active
{color: #fff !important;}

/*	--------------------------------------------------
----- PRODUCTS: HOME PAGE */
.product-category
{
}

.product-category .inner-padding
{
	background-color: #333;
	border: 1px solid #555;
	padding: 7px;
	margin: 5px;
}

.product-category .inner-padding.shell
{
	position: relative;
	height: 360px;
	padding-bottom: 42px;
}

.product-category .image
{
	background-image: url('images/kal-gard-logo-mini.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #000;
	border: 1px solid #666;
	overflow: hidden;
	height: auto;
}

.product-category .image img {width: 100%; vertical-align: middle;}

.product-category .text
{
	overflow: auto;
	height: auto;
	color: #ccc;
	font-size: 0.9em;
}

.product-category .text h3
{
	padding: 5px 0px 15px 0px;
	color: #ff823b;
}

.product-category .text .inner-padding
{
	padding: 5px;
	border: none;
}

.form-button,
#slideshow .link-more,
.contact-form-button.link-more,
.product-category .link-more
{
	background-image: url('images/button-bg.png');
	text-transform: uppercase;
	border: 1px solid #1e1e1e;
	background-color: #000;
	text-align: center;
	font-weight: bold;
	line-height: 27px;
	font-size: 0.8em;
	margin: 0px 7px;
	display: block;
	padding: 0px;
	height: 27px;
	color: #ccc;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
}

.link-wrapper
{
	position: absolute;
	bottom: 7px;
	left: 0px;
	width: 100%;
}

.product-category .link-more
{}

.form-button
{
	line-height: 1em;
	padding: 5px 30px;
	margin: 0px;
	float: right;
}

.contact-form-button.link-more:hover,
.form-button:hover,
.product-category .link-more:hover {color: #ff823b;}
#slideshow .link-more {margin: 0px auto;}

/*	--------------------------------------------------
	----- FOOTER BLOCKS */

.footer-block
{
	position: relative;
	margin: 20px 0px;
}

.footer-block .inner-padding
{
	background-color: transparent;
	border-right: 1px solid #333;
	margin: 0px 0px 0px 5px;
	padding: 3px 7px;
}

.footer-block.first .inner-padding {border-left: 1px solid #333;}
.footer-block.last .inner-padding {margin-right: 5px;}

.footer-block .text {color: #fff; height: 280px;}
.footer-block .text h3
{
	padding-bottom: 15px;
	color: #ff823b;
}

h2 {text-shadow: 0px 0px 2px #222;}
h3 {text-shadow: 0px 0px 2px #000;}

.footer-block .text a
{
	display: block;
	color: #aaa;
}

.footer-block.contact .text li {display: block;}
.footer-block .text a:hover {color: #fff;}

.footer-block .text .inner-padding
{
	border: none;
	padding: 5px;
	font-size: 0.8em;
	line-height: 1.7em;
}
	
/*	--------------------------------------------------
	----- NAVIGATION: PRIMARY & SECONDARY */

/*	----- PRIMARY */
#nav
{
	float: right;
	height: 100%;
}

#nav a
{
	line-height: 32px;
	padding: 5px 15px;
	margin: 49px 10px;
	font-size: 1em;
	display: block;
	height: 32px;
	float: left;
	color: #fff;
	
	border-bottom: 1px solid #333;
	border-right: 1px solid #333;
	border-top: 1px solid #111;
	border-left: 1px solid #111;
	text-shadow: 1px 3px 3px #000;
	background-color: #111;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	
	opacity: 0.8;
}


#nav li.selected a:hover,
#nav a:hover
{	
	background-color: #000;
	color: #fff;
	opacity: 1;
}

#nav .menu {display: none;}
#nav .menu a {color: #fff; background-color: #000; opacity: 1;}

#footer-nav {display: none;}
#footer-nav a {}

.front #nav li.front a,
.coatings #nav li.coatings a,
.lubricants #nav li.lubricants a,
.polymers #nav li.polymers a,
.contact #nav li.contact a,
.front #footer-nav li.front a,
.coatings #footer-nav li.coatings a,
.lubricants #footer-nav li.lubricants a,
.polymers #footer-nav li.polymers a,
.contact #footer-nav li.contact a
{color: #ff823b; opacity: 1;}

/*	--------------------------------------------------
	----- SLIDESHOW: HEADER */
#slidehsow-block-inner {padding: 20px 0px;}
.slideshow-inner {border: 1px solid #555555;}
	
#slideshow
{
	position: relative;
	overflow: hidden;
	height: 400px;
	*height: 370px;
	width: 100%;
}

#slideshow .slide
{
	position: absolute;
	display: block;
	height: 100%;
	width: 100%;
	z-index: 5;
	top: 0px;
}

#slideshow .slide.active .text,
#slideshow .slide.active .image {display: block;}
#slideshow .slide.active .text {z-index: 15;}
#slideshow .slide.active {z-index: 10;}

#slideshow .slide .image
{
	background-image: url('images/kal-gard-logo-mini.png');
	background-position: center center;
	background-repeat: no-repeat;
	position: absolute;
	overflow: hidden;
	display: none;
	height: 100%;
	width: 100%;
	z-index: 9;
}

#slideshow .slide .image .inner-padding {padding: 0px;}
#slideshow .slide .image img {width: 100%;}

#slideshow .slide .text
{
	background-image: url('images/slideshow-text-bg.png');
	position: absolute;
	overflow: hidden;
	display: none;
	height: 100%;
	color: #fff;
	right: 0px;
	width: 33%;
	z-index: 15;
}

#slideshow .slide .text span {font-size: 0.9em;}
#slideshow .slide .text .inner-padding {padding: 25px 45px;}

#slideshow .slide .text .link
{
	position: absolute;
	bottom: 0px;
	width: 100%;
	left: 0px;
}

#slideshow .slide .image.dead
{
	display: none;
	top: 100%;
}
#slideshow .slide .text.dead {display: none;}

#slideshow .slide .text .link .link-more {margin: 45px 45px; font-size: 0.9em;}
#slideshow .slide .text .link .link-more:hover {color: #FF823B;}

#slideshow .slide .text h3
{
	text-transform: uppercase;
	padding-bottom: 15px;
	color: #FF823B;
}

#slideshow .slide .text .link a.link-more {padding: 0px 15px;}

#slideshow .pager
{
	position: absolute;
	height: 80px;
	width: 10px;
	right: 10px;
	z-index: 25;
	top: 160px;
}

#slideshow .pager .indicator
{
	padding: 5px 0px;
	display: block;
	float: left;
}

#slideshow .pager .indicator a
{
	background-image: url('images/slideshow-pager-indicators.png');
	background-position: center bottom;
	background-repeat: no-repeat;
	text-indent: -999px;
	overflow: hidden;
	display: block;
	height: 10px;
	width: 10px;
	float: left;
}

#slideshow .pager .indicator.active  a {background-position: center top;}

.slideshow-shadow
{
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 10;
}

.slideshow-shadow.top {background-image: url('images/slideshow-shadow-top.png'); top: 0px;}
.slideshow-shadow.left {background-image: url('images/slideshow-shadow-left.png'); left: 0px;}
.slideshow-shadow.right {background-image: url('images/slideshow-shadow-right.png'); right: 0px;}
.slideshow-shadow.bottom {background-image: url('images/slideshow-shadow-bottom.png'); bottom: 0px;}
.slideshow-shadow.top, .slideshow-shadow.bottom {background-repeat: repeat-x; height: 45px;}
.slideshow-shadow.left, .slideshow-shadow.right {background-repeat: repeat-y; width: 45px;}

/*	--------------------------------------------------
	----- CONTENT */
.nav-image
{
	overflow: hidden;
	height: 150px;
}	
	
.nav-image img {width: 100%;}
.link-button {float: right;}

/*	--------------------------------------------------
	----- OTHER */
.footer-link {padding: 10px 0px;}
#closure {font-size: 0.8em;}

.mail-sent
{
	background-color: #d25f1d;
	color: #fff;
	padding: 5px;
	clear: both;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	
}

.error-links,
.mail-sent p {text-align: center;}

.block.footer-block.last.contact {overflow: visible;}
.block.footer-block.last.contact .text .inner-padding {position: relative;}
.block.footer-block.last.contact .contact-info {display: none;}
.block.footer-block.last.contact .contact-form-block {display: block;}
.block.footer-block.last.contact .contact-form-block .contact-form {padding: 0px;}
.block.footer-block.last.contact .contact-form-block  .form-textarea {height: 45px;}

.block.footer-block.last.contact .contact-form-block label
{
	padding: 7px 0px;
	line-height: 1em;
}

.block.footer-block.last.contact .contact-form-block .form-button
{
	margin-top: 7px;
}

.contact-form-button
{
	background-color: #444;
	text-align: center;
	position: relative;
	padding: 0px 5px;
	float: right;	
	width: 64px;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	
}

.contact-form-button:hover
{
	background-color: #d25f1d;
}

.contact-form-button.link-more {padding: 0px 7px;}
.contact-form-button.open span {display: none;}

span.form-sent
{
	position: absolute;
	display: none;
	right: 22px;
	top: -20px;
	
	width: 100px;
	text-align: center;
	padding: 2px 8px;
	margin: 0px 0px 20px 0px;
	background-color: #d25f1d;
	border: 1px solid #111;
	border-top: none;
	
	color: #fff;
	
	font-size: 0.9em;
	
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	
	/*-webkit-box-shadow: 0px 3px 5px #000;
	-moz-box-shadow: 0px 3px 5px #000;
	box-shadow: 0px 3px 5px #000;*/
}

#bwd
{
	background-image: url('images/logo-bwd-medium.png');
	background-position: center top;
	background-repeat: no-repeat;
	overflow: hidden;
	display: block;
	float: right;
	height: 42px;
	width: 60px;
	padding: 0px;
	
	text-indent: -999px;
}

#bwd:hover
{
	background-position: center bottom;
}

#copyright
{
	line-height: 44px;
	padding: 0px;
	height: 42px;
	float: left;
	color: #333;
	font-size: 0.8em;
}

#closure .inner-padding {padding: 20px 5px;}

.slide .text,
.chunk p strong,
#copyright,
#footer h3
{cursor: default;}