@charset "utf-8";
/* CSS Document */

body{
	text-align:center;/*IE 5.x and IE 6 in quirks mode doesn't honor auto margins. Luckily, IE misunderstands text-align: center, centering everything instead of just the text. You can use this to your advantage by centering everything in the body tag, including the wrapper div, and then realigning the contents of the wrapper back to the left:*/
	/*In Netscape 6, when the width of the browser window is reduced below the width of the wrapper, the left side of the wrapper spills off the side of the page and cannot be accessed. To keep this from happening, you need to give the body element a minimum width equal to or slightly wider than the width of the wrapper element:*/
	background-color:#E2E0DF;
	font-family:Verdana, Geneva, sans-serif;
	font-size:11px;
	margin:0px;
	padding:0px;
	}

/*-------------header layouts------------------*/
#header{
	margin:0 auto;
	height: 120px;
	background-color:#ffffff;
	
-moz-border-radius-bottomleft: 50px;
border-bottom-left-radius: 50px;
}

.source-image {
	width: 100%;

	top: 0;
	left: 5%;
	height:120px;
	-moz-border-radius-bottomleft: 50px;
border-bottom-left-radius: 50px;

}

/*-------------content layout------------------*/	
#wrapper{
	width:90%;
	margin:0 auto;
	text-align:left;
	}
	
#main-content{
min-height:600px;
background-color:#fff;
-moz-border-radius-topleft: 50px;
border-top-left-radius: 50px;

}
	
	
#left{
float:left;
width:200px;
background-color:#393;
-moz-border-radius-topleft: 50px;
border-top-left-radius: 50px;
}

#right{
float:right;
width:200px;
background-color:#d3d3d3;
}


#content{
background-color:#ffffff;
margin: 0px 200px 0px 200px;
padding:20px;
}

#footer {
	margin:0px 20px 20px 20px;
	padding:0px;
  height:20px;
	
	}


.titlebox{ 
background-color: #393 ; 
padding:10px 10px 10px 10px; 
color:#fff; 
font-size:18px; 
margin:0px 0px 0px 0px;}
	

.greybox{
margin:0px;
padding:10px;
background-color:#F2F2F2;
}

.greybox p{font-size:11px; line-height:14px;}
.greybox h2{font-size:12px; }
.greybox blockquote p{font-size: 12px; line-height:18px;}

.greybox ul.news_list{margin:0px; padding:0px;}
.greybox ul.news_list li{margin-bottom: 10px;}





/*-------------image wrap classes------------------*/	

.imageleft{
float:left;
margin:0px 20px 20px 0px;
}

.imageright{
float:right;
margin:0px 0px 20px 20px;
}	

.clearbox{clear:both;}

/*-------------menu navigation------------------*/
#nav{
background-color:#393;
margin: 40px 0px 0px 0px; /*removes indent IE and Opera*/
padding: 0; /*removes indent Mozilla and NN7*/
padding: 0px;
float:left;
width:200px;

}
#nav ul {
margin: 0; /*removes indent IE and Opera*/
padding: 0; /*removes indent Mozilla and NN7*/
list-style-type: none; /*turns off display of bullet*/
font-size:16px;
font-weight:normal;
}
#nav li {
padding:12px 2px 12px 0px;
border-bottom: 0.01em solid #959595;
}

#nav a, #nav a:visited {
color: #fff;
text-decoration: none;
padding-left:20px;
}

#nav a:hover {
color: #666;
text-decoration: none;
padding-left:20px;

}
#nav li:hover {
padding:12px 2px 12px 0px;
border-bottom: 0.01em solid #959595;
background-color:#9C0;
}

/*-------------links------------------*/
a:link{
	color:#006699;
	text-decoration: none;
}
a:visited {color:#006699;
	text-decoration: none;
	}
a:hover {
	text-decoration:none;
	color:#00CC00;
}
a:active {
	text-decoration: none;
	color: #88888A;
}
/*end link styles*/


/*-------------text styles------------------*/
p{font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	margin:0px 0px 8px 0px;
	padding:0px;
	line-height:18px;
	}
	
h1{	
font-size: 18px;
color:#336633;
text-align:left;
margin:0px 0px 8px 0px;
font-weight:normal;

}

h2 {
padding:0px;
margin:20px 0px 8px 0px;
font-size: 12px;
color:#339966;
font-weight: normal;
text-align:left;
}


h3 {
padding:0px;
margin:0px 0px 8px 0px;
font-size: 12px;
color:#5F5845;
font-weight: normal;
text-align:left;
}


h4 {
padding:0px;
margin:10px 0px 8px 0px;
font-size: 12px;
color:#d61419;
font-weight: bold;
text-align:left;
}


/*-------------list styles------------------*/

li{
list-style-type:none;
padding-left:16px;
}

.item{width:400px}

ul.squaredot{list-style-image:url(/images/bullet.jpg);
margin:0px 0px 20px 25px;
padding:0px;
font-size: 12px;
color: #666;
line-height:16px;

}

ul.squaredot li{
	margin:0px 0px 5px 0px;
	padding:0px 0px 0px 10px;
	}


/*-------------footer------------------*/



#footer ul {padding:0px; margin:8px 25px 0 0px; list-style:none; }
#footer li {padding:0; margin:0; display:inline; color:#8D8D8D; font-size:11px;}
#footer li.copyright { float:left; }
#footer li.doodlefish { float:right;}
#footer li a:link, #footer li a:visited{padding:0; margin:0; text-decoration:none; color:#8D8D8D;}
#footer li a:hover{color:#74a400;}



/*quotes------------------*/
blockquote {
display: block;
padding: 0px 0px 0px 0px;
width: 170px;
margin:0px 0px 0px 15px;
font-family:Georgia, "Times New Roman", Times, serif;

}

blockquote p {
font-family:Georgia, "Times New Roman", Times, serif;
font-style:italic;	
font-size:12px;
color:#959595;
line-height:22px;
margin:0px 0px 0px 0px;}

blockquote:before, blockquote:after {
color:#E31B23;
display: block;
font-size: 60px;
width: 5px;
}

blockquote:before {
content: open-quote;
height: 20px;
margin-left: -25px;
}
blockquote:after {
content: close-quote;
margin:-20px 0px 0px 155px;
height: 15px;
}

.righttext{font-size:10px; text-align:right; color:#959595; margin:30px 0px 0px 0px;}
.quote {
background-color:#FD7E01;
width: 330px;
margin: 20px 15px 20px 15px;

font-family:Georgia, "Times New Roman", Times, serif;
font-style:italic;
float:right;
}




/*-- social links --*/
#socialmedia {margin: 10px 0px 0px 25px; width: 190px; padding: 0px;}
#socialmedia ul.media{margin:0; padding:0; list-style:none; }
ul.media li{margin:0 2px 0 0; padding:0; display:inline;}

ul.media li a:link, ul.media li a:visited {display:inline-block; margin:0px 0px 0 0; padding:0; height:20px; width:20px;}
a.facebook:link, a.facebook:visited {background:url(images/facebook_logo.png) no-repeat;}
a.facebook:hover {background:url(images/facebook_logo-hover.png) no-repeat; }
a.twitter:link, a.twitter:visited {background:url(images/twitter.png) no-repeat; }
a.twitter:hover {background:url(images/twitter-hover.png) no-repeat; }
a.email:link, a.email:visited {background:url(images/email-logo.png) no-repeat; }
a.email:hover {background:url(images/email-logo-hover.png) no-repeat; }

.subscribe{margin:5px 0px 5px 0px;
width:210px;}

.subscribe a {
 outline: none;/* get rid of dotted borders in FireFox */
 display:block;
 width:210px;
 height:70px;
 background: url("images/subscribebox.jpg") 0 0 no-repeat;
 }
 
 .subscribe a:hover {
 outline: none;/* get rid of dotted borders in FireFox */
 display:block;
 width:210px;
 height:70px;
 background-position: 0px -70px;
 }

 
 /*-- expanding image gallery --*/

#slideright ul{height:200px; width:100%;}
 
#slideright li{
	 list-style-type:none;
	 margin:0px;
	 padding:0px;
 }
 
#slideright a#pho1{background-image:url(/images/capiphon-belt-redirecting-water-flow.jpg);}
#slideright a#pho2{background-image:url(/images/capiphon-installation.jpg);}
#slideright a#pho3{background-image:url(/images/installation-in-railway.jpg);}
#slideright a#pho4{background-image:url(/images/view-of-capiphon-belt.jpg);}
#slideright a#pho5{background-image:url(/images/landscaping-after-capiphon-installation.jpg);}

#slideright li{
	float:left;
}
 #slideright li a{
	 display:block;
	 width:40px;
	 height:180px;
	 border:2px solid #eee;
	 border-radius:8px;
	 padding:4px;
	 background-repeat: no-repeat;
	 box-sizing: border-box;
	 text-decoration:none;
	 color:#fff;
	 -webkit-transition: all .8s ease-out;
	 position:relative;
 }
 
 #slideright a#pho1:hover, #slideright a#pho2:hover, #slideright a#pho3:hover, #slideright a#pho4:hover, #slideright a#pho5:hover{
	 width:380px;
	 border:2px solid #ff0;
 }
	 
 #slideright a em{
	 position:absolute;
	 top:4px;
	 left:4px;
	 z-index:-1;
 }
 #slideright a:hover em{
	 z-index: 1;
	 -webkit-transition: z-index 800ms ease-in .4s;
 }
 
 
 p.literature-container{
	 margin:30px 0px 0px 0px;}
 
 
 .news{
	 margin:0px 0px 30px 0px;}
	 
	 .news p{
	 margin:0px 0px 10px 15px;}
 
.galogo {
  position:absolute;
  margin:0px;
  padding:0px;
}

.faq-question{padding-bottom:10px;}