/* =======================================================
	Global.css
	General Styles
=======================================================*/

* {margin:0;padding:0;}
    
img{border:0;}

object{margin:0 0 0 20px;padding:20px 0;}  
  
body{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* reset base size to 10px, 1.1em = 11px, 1.2em = 12px etc */
	background: #2f292b url(../images/bg_body.gif) repeat-x 0 0 ;
	color: #414141;
}

#container{
	margin:0 auto;
	text-align: left;	
	width:760px;
}

#header{
	position:relative;
	height:130px;
	clear:both;
}

#header img{
	position:relative;
	left:-45px;
	top:34px;
	z-index:9999;
}

#content{
	clear:both;
	padding:20px 0 0 0;
}

#footer{
	border-top:1px solid #5c595a;
	height:93px;
	padding:5px 0 0 0;
	margin:5px 0 0 0;
	clear:both;
	position:relative;
}

#footer p{
	color: #5c595a;
	font-size:1.2em;
	font-family:  Helvetica, Verdana, Arial,sans-serif;
	/* text-transform:uppercase;	*/
}

#footer ul{
	position:absolute;
	right:0;
	top:4px;
	}

#footer ul li{
	display:inline;
	padding:0 5px 0 5px;
	border-right:1px solid #5c595a;
}

#footer ul li.last{
	border:none;
	padding:0 0 0 5px;
}

#footer ul li a{
	color: #5c595a;
	font-size:1.2em;
	text-decoration:none;
	font-family:  Helvetica, Verdana, Arial,sans-serif;
	/* text-transform:uppercase;*/

}

#footer ul li a:hover{
	color:#f1e300;
	text-decoration:none;
}

/* =======================================================
	Navigation - Primary
=======================================================*/

#header #login a{
	position:absolute;
	top:10px;
	right:10px;
	background: transparent url(../images/nav-login.gif) no-repeat left top;
	width:125px;
	height:17px!important;
}

#header #login a:hover{
  background-position:left bottom;
}


a span {
  position:absolute;
  top:0;
  left:-9999px;
}

#header #login a{
 	color:#dddddd;
	font-size:1.2em;
	text-decoration:none;
	font-family: Arial, Verdana, Helvetica, sans-serif;		
  display:block;
  height:32px;	
  width:125px;
}

#header #login a:hover{
	color:#f1e300;
}

#header #nav{
	position:absolute;
	top:38px;
	right:0;
	background: transparent url(../images/bg_nav_secondary.gif) repeat-x 0 0;
	width:660px;
	height:84px;
}

#header #nav ul.primary{
	height:49px;
	list-style:none;
  width:544px;
  position:absolute;
  top:0;
  right:0;
}

#header #nav ul.primary li {
 	padding:0!important;
	margin:0!important;
	display:block;
	height:49px;
	float:left;
}

#header #nav ul.primary li a{
  height:49px;
  display:block;
}

#header #nav ul.primary li.homepage a{
  background: transparent url(../images/nav-home.gif) no-repeat left top;
  width:94px;
}

#header #nav ul.primary li.about a{ 
  background: transparent url(../images/nav-about.gif) no-repeat left top;
  width:97px;
}

#header #nav ul.primary li.products a{
  background: transparent url(../images/nav-products.gif) no-repeat left top;
  width:101px;
}

#header #nav ul.primary li.distributors a{
  background: transparent url(../images/nav-distributors.gif) no-repeat left top;
  width:120px;
}

#header #nav ul.primary li.contact a{
  background: transparent url(../images/nav-contact.gif) no-repeat left top;
  width:132px;
}

#header #nav ul.primary li.selected a, #header #nav ul.primary li a:hover{
  background-position:left bottom;
}

#header #nav ul.secondary{
	height:35px;
	list-style:none;
  width:460px;
  position:absolute;
  bottom:0;
  right:0;
}

#header #nav ul.secondary li{
 	padding:0!important;
	margin:0!important;
	display:block;
	height:35px;
	float:left;
}

#header #nav ul.secondary li a{
  display:block;
  height:35px;
}

#header #nav ul.secondary li.challenge a {
  background: transparent url(../images/nav-challenge.gif) no-repeat left top;
  width:200px;
}

#header #nav ul.secondary li.news a{
  background: transparent url(../images/nav-news.gif) no-repeat left top;
  width:121px;
}

#header #nav ul.secondary li.catalogue a{
  background: transparent url(../images/nav-cat.gif) no-repeat left top;
  width:139px;
}

#header #nav ul.secondary li.selected a, #header #nav ul.secondary li a:hover{
  background-position:left bottom;
}

/* =======================================================
	CTA - Home page
=======================================================*/

#cta{
	height:65px;
	padding:25px 0 0 0;
	margin:10px 0 0 0;
	background: transparent url(../images/divider.png) no-repeat 0 0;	
}

#cta .box{
	width:190px;
	height:65px;
	float:left;
	text-align:center;	
}

#cta .box a{
	color:#FFF;
	font-size:1.10em;
	line-height:1.4em;
	text-decoration:none;
	font-weight:normal;
	font-family:Helvetica, Verdana, Arial,sans-serif;
	text-transform:uppercase;

}

#cta .box a:hover{
	color:#f1e300;
	text-decoration:none;
}

/* =======================================================
	Content - 2 column layout
=======================================================*/

#content p{
	padding:0 20px 0 0;
}

#columnA{
	float:left;
	width:370px;
}

#columnB{
	float:left;
	width:370px;	
}

#columnA p,#columnA p{margin:0 0 10px 0;}

#columnB img{
	margin:10px 0 10px 0;
}

/* =======================================================
	Content - 1 column layout
=======================================================*/

#columnC{
	float:left;
	width:760px;
	margin:0 0 20px 0;
}


/* =======================================================
	Products
=======================================================*/

.hr {
	margin:20px 0 0px 0;
	background: transparent url(../images/divider.png) no-repeat 0 0;	
	clear:both;	
	width:760px;
	height:12px;
	display:block;
	border:0;
}

#products {
	padding:0px 0 20px 0;
	margin:0px 0 20px 0;
	clear:both;	
}

.row{
	clear:both;
	margin:0 0 0 10px!important;
	padding:0;	
}

.item{
	width:360px;
	float:left;
	position:relative;
	margin:20px 0 20px 10px!important;
	padding:0!important;
}

.textwrap{
	position:relative;
	top:-10px;
}

.item p{
	width:170px;
	float:right;
	margin:0 0 10px 0!important;
	}

p.title{
	letter-spacing:0.1em;
	text-transform:uppercase;
	margin:0 0 5px 0!important;	
	color:#ebdf14!important;
	/* color:#eb1306!important; red */
}

.item a{
	color:#5c595a;
	margin:0;
	font-size:1.2em;
	text-decoration:none;
	width:200px;
	position:absolute;
	bottom:10px;
	right:-10px;
}

a.moreinfo{
	color:#5c595a!important;
}

a.moreinfo:hover{
	color:#f1e300!important;
	text-decoration:underline!important;
}

.item img{
	float:left;
	margin:0px 10px 10px 0;
}


/* =======================================================
	Product detail 
=======================================================*/

#product_detail {
	padding:0px 0 20px 0;
	margin:10px 0 20px 0;
	background: transparent url(../images/divider.png) no-repeat 0 30px;	
	clear:both;	
	position:relative;
}

#product_detail h1{
	margin:0 0 30px 0;
}

#product_detail h2{
	text-transform:uppercase;
	font-weight:normal;
}

#content ul{
	padding:10px 0 0 0;
	list-style-type:none;
}

#content li{
	color:#FFF;margin:0 0 10px 20px;font-size:1.2em;line-height:1.4em;
	background: url(../images/bullet.gif) no-repeat 0 7px;
	padding-left:15px;
}

#member_login li{
	color:#FFF;margin:0 0 6px 0px;font-size:1.2em;line-height:1.4em;
	background: none;
	padding-left:15px;
}

#product_detail .row{
	padding:30px 0 0 110px;
	margin:10px 0 20px 0;
	background: transparent url(../images/divider.png) no-repeat left 0px;	
	clear:both;	
	height:120px;
}

a.goback{
	position:absolute;
	top:4px;
	right:0;	
	color:#FFF;margin:0 0 10px 0;font-size:1.1em;text-decoration:none;	
}

a:hover.goback{
	color:#f1e300;
}

#image_row {
	clear:both!important;
	margin:0 0 0 10px!important;
	padding:0!important;	
}


#image_row p{
	margin:20px 0 0 0;
    display:block;
	text-align:center;
	}

#image_row p img{
	margin:0 2em;
	}

#product_blurb{
	margin:5px 0 0 10px;}


/* =======================================================
	Client login
=======================================================*/

      .demo-show {

        width: 350px;

        margin: 1em .5em 20px .5em;

      }

      .demo-show h3 {

        margin: 0;

        padding: .25em;

        background: #bfcd93;

        border-top: 1px solid #386785;

        border-bottom: 1px solid #386785;

      }

      .demo-show div {

        padding: .5em .25em;

      }



/* =======================================================
	Client login
=======================================================*/

#member_login{
margin:20px 0 0 0;
	}
	
#member_login p {
  margin:5px 0 0 0;
}	
	
#member_login label{
	width:400px;
	float:left;
	margin:5px 0 10px 0;
	width:100px;
	}	
	
#member_login input {
	border:1px solid #bcbcbc;
	float:left;width:190px!important;margin:5px 0 15px 0;font-family: Verdana, Arial, Helvetica, sans-serif;padding:2px 0 2px 3px;color: #414141;background-image:url(../images/bg-input.gif);	
}

#login_form p{
	clear:both;
	padding:0px 0 0 0;
}

label{
	width:130px;
	float:left;
	margin:0 0 10px 0;
}

input {
	border:1px solid #bcbcbc;
	float:left;width:190px!important;margin:0 0 15px 0;font-family: Verdana, Arial, Helvetica, sans-serif;padding:2px 0 2px 3px;color: #6d6d6d;background-image:url(../images/bg-input.gif);	
}

textarea {
	border:1px solid #bcbcbc;
	float:left;width:320px!important;margin:0 0 10px 0;font-family: Verdana, Arial, Helvetica, sans-serif;padding:2px 0 2px 3px;color: #6d6d6d;background-image:url(../images/bg-input.gif);	
	height:100px;font-size:1.1em;
}

#submit_main{
	width:80px!important;
	border:none;
	background:none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#fff;
	font-weight:300;
	position:relative;
	top:0px;
	left:250px;
	font-size:1.2em;
	}


#submit_login input{
	width:80px!important;
	border:none;
	background:none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#fff;
    position:relative;
	top:0px;
	left:230px;
	font-size:1.2em;
	}

#company_details{
	position:relative;
}

#company_details h2{
	width:350px;
	float:left;	
	margin:0 0 20px 0;
}

#company_details p{
	float:left;
}

#company_details img	{
	float:right;
	border:none;
	margin:0 30px 0 0;
}

#company_details  a{color:#FFF;text-decoration:none;}
#company_details  a:hover{text-decoration:underline;}

#company_details a.map	{
	position:absolute;
	right:80px;
	bottom:-310px;
	color:#FFF;margin:0 0 10px 0;font-size:1.1em;text-decoration:none;		
}

#zemContactForm fieldset {
   border: none;
   }
#zemContactForm legend {
   /* padding: 0.5em 10px 0.5em 0;
   width: 60px; */
   display:none;
   }
#zemContactForm label {
  color:#FFF;font-size:1.2em;
   }
#zemContactForm br {
  clear: left; 
   }
#zemContactForm #zemSubmit input{
	width:80px!important;
	border:none;
	background:none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#fff;
    position:relative;
	top:0px;
	left:255px;
	font-size:1.2em;
   }

.zemThanks p{text-transform:uppercase;color:#f1e300;}

/* =======================================================
	Links - members
=======================================================*/

ul.links{
	list-style:none;
	margin:5px 0 20px 20px!important;
}

ul.links li{
	margin:0 0 10px 0;
}

ul.links li a{
	margin:0 0 10px 0;
	color:#FFF;font-size:1.1em;
	text-decoration:none;
}

ul.links li a:hover{
	color:#f1e300;
	text-decoration:underline;
}

a.pdf{
	background-image:url(../images/pdf.gif);
	background-repeat:no-repeat;
	padding:0 0 0 20px;
}

a.logout{
	margin:0 0 10px 0;
	color:#FFF;
	text-decoration:none;
	position:relative;
	left:290px;
}

a.logout:hover{
	color:#f1e300;
	text-decoration:underline;
}

/* =======================================================
	Typography
=======================================================*/

h1,h2,h3,h4,h5,h6{color:#FFF;font-size:1.4em;}
p{color:#FFF;font-size:1.2em;line-height:1.4em;}


h1{font-size:1.5em;margin:10px 0;font-weight:normal;}
h2{font-size:1.3em;margin:10px 0 10px 0;font-weight:normal;}

a,a:link,a:visited{color:#FFF;}

#content a{text-decoration:none;color:#FFF;}
#content a:hover{text-decoration:underline;color:#f1e300;}

a:hover.link{color:#f1e300;}

/* =======================================================
	Extras
=======================================================*/

.spacer{position:relative;margin:0;padding:0;clear:both;width:auto;font-size:1px;line-height:1px;height:1px;}
.tools{position: absolute; left: 0; top: -500px; width: 1px; height: 1px; overflow: hidden;}
