/*
** C-Shels style sheet for CSS2-capable browsers.
** Copyright 2009 C-Shels, http://www.c-shels.com/
**
** Coded by Priyank Sharma, http://www.priyanksharma.com/
*/


/* Page
-------- */
body {
  background:#1e2227 url(../images/background.gif) top center repeat;
  margin:0;
  padding:0;
}


/* Interface
------------- */
div#interface {
  background:#eebb41 url(../images/interface.gif) top center repeat-y;
  margin:0 auto;
  overflow:hidden;
  width:790px;
}
div#splash {
  background:transparent;
  height:254px;
  margin:30px auto;
  padding:0;
  width:750px;
}


/* Header
---------- */
div#header {
  background:url(../images/header.gif) no-repeat;
  height:150px;
  margin:0 auto;
  width:750px;
}

div#header div#logo {
  height:150px;
  margin:0;
  padding:0;
  width:420px;
}


/* Menu
-------- */
div#menu {
  margin:0 auto;
  overflow:hidden;
  width:750px;
}

div#menu ul#nav {
  background:url(../images/menu.gif) no-repeat;
  height:50px;
  margin:0;
  position:relative;
  width:750px;
}
div#menu ul#nav li {
  float:left;
  list-style:none;
}
div#menu ul#nav li a {
  border:none;
  height:50px;
  position:absolute;
  text-decoration:none;
  text-indent:-9999px;
  top:0;
}

div#menu ul#nav li#nav-home a {
  background:url(../images/menu.gif) no-repeat -80px 0;
  left:80px;
  width:110px;
}
div#menu ul#nav li#nav-aboutus a {
  background:url(../images/menu.gif) no-repeat -190px 0;
  left:190px;
  width:150px;
}
div#menu ul#nav li#nav-products a {
  background:url(../images/menu.gif) no-repeat -340px 0;
  left:340px;
  width:160px;
}
div#menu ul#nav li#nav-contactus a {
background:url(../images/menu.gif) no-repeat -500px 0;
left:500px;
width:175px;
}

div#menu ul#nav li#nav-home a:hover {
  background-position:-80px -50px;
}
div#menu ul#nav li#nav-aboutus a:hover {
  background-position:-190px -50px;
}
div#menu ul#nav li#nav-products a:hover {
  background-position:-340px -50px;
}
div#menu ul#nav li#nav-contactus a:hover {
  background-position:-500px -50px;
}

div#menu ul#nav li#nav-home a.active {
  background-position:-80px -50px;
}
div#menu ul#nav li#nav-aboutus a.active {
  background-position:-190px -50px;
}
div#menu ul#nav li#nav-products a.active {
  background-position:-340px -50px;
}
div#menu ul#nav li#nav-contactus a.active {
  background-position:-500px -50px;
}


/* Interface
------------- */
div#content {
  margin:0;
  padding:0;
}
div#content #main {
  float:left;
  margin:0;
  overflow:hidden;
  width:790px;
}

img {
  border:none;
  margin:0;
  padding:0;
}

div.prod-win {
  float:left;
  margin:25px 0 0 32px;
}

div.prod-bar-armarallwaterproofing {
  background:url(../images/bar-armarallwaterproofing.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-constructionadmixture {
  background:url(../images/bar-constructionadmixture.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-liquidpaints {
  background:url(../images/bar-liquidpaints.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-otherproducts {
  background:url(../images/bar-otherproducts.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-primer {
  background:url(../images/bar-primer.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-surfacepreparationprod {
  background:url(../images/bar-surfacepreparationprod.gif) no-repeat;
  height:38px;
  width:220px;
}
div.prod-bar-powderpaint {
  background:url(../images/bar-powderpaint.gif) no-repeat;
  height:38px;
  width:220px;
}

div.prod-content {
  background:#a15001;
  border-bottom:2px solid #c7701c;
  width:220px;
}

div.prod-blank {
  background:transparent;
  border:none;
  height:100px;
  width:220px;
}


/* Typography
-------------- */
body {
  color:#974a00;
  font:12px/14px arial;
}

p {
  margin:0;
  padding:10px 35px 0 35px;
}
div.prod-content p {
  color:#fddd93;
  padding:12px 0 12px 18px;
}
div#footer p {
  color:#974a00;
  font-weight:bold;
  line-height:12px;
  text-align:center;
  padding:10px 0 0 0;
}

strong {
  color:#974a00;
}

.small {
  font-size:10px;
}


/* Hyperlinks
-------------- */
a:link,
a:visited {
  color:#974a00;
  font-weight:bold;
  text-decoration:underline;
}
a:hover,
a:active {
  color:#974a00;
  text-decoration:none;
}

div.prod-content a:link,
div.prod-content a:visited {
  color:#fddd93;
  font-weight:bold;
  text-decoration:underline;
}
div.prod-content a:hover,
div.prod-content a:active {
  color:#fddd93;
  text-decoration:none;
}

.small a:link,
.small a:visited {
  color:#b05701;
}

/* Spacers
----------- */
.spacer-quarter {
  clear:both;
  display:block;
  height:5px;
}
.spacer-half {
  clear:both;
  display:block;
  height:10px;
}
.spacer {
  clear:both;
  display:block;
  height:20px;
}
.spacer-double {
  clear:both;
  display:block;
  height:40px;
}


/* Titles
----------- */
h3 {
  padding:0 0 0 25px;
  margin:0;
}
h3 span {
  display:block;
  height:40px;
  text-indent:-9999px;
  width:480px;
}
div.panel h3 span {
  display:block;
  height:40px;
  text-indent:-9999px;
  width:200px;
}

h3.aboutus span {
  background:url(../images/title-aboutus.gif) no-repeat;
}
h3.contactus span {
  background:url(../images/title-contactus.gif) no-repeat;
}
h3.messagesentsuccessfully span {
  background:url(../images/title-messagesentsuccessfully.gif) no-repeat;
}
h3.ourproductrange span {
  background:url(../images/title-ourproductrange.gif) no-repeat;
}


/* Footer
----------- */
div#footer {
  background:url(../images/footer.gif) no-repeat;
  clear:both;
  height:49px;
  margin:0 auto;
  padding:0;
  width:790px;
}


/* Forms
--------- */
form {
  margin:0;
  padding:0;
}

input.textfield {
  background:url(../images/form-text.gif) no-repeat;
  border:none;
  color:#fff;
  font-family:arial;
  font-size:12px;
  font-weight:bold;
  height:23px;
  margin:3px 0 5px 0;
  padding:2px 0 0 5px;
  width:240px;
}
.textareafield {
  background:url(../images/form-textarea.gif) no-repeat;
  border:none;
  color:#fff;
  font-family:arial;
  font-size:12px;
  font-weight:bold;
  height:93px;
  margin:3px 0 5px 0;
  padding:5px 0 0 5px;
  resize:none;
  width:240px;
}