/*===================== 
	CSS reset/normalize 
=======================*/

/**Correct `block` display not defined in IE 8/9.**/
article,aside,details,figcaption,figure,footer,header,hgroup,
main,nav,section,summary {display: block;}
pre {white-space: pre-wrap;}
small { font-size: 80%;}


/*===================== 
		Fonts
=======================*/



/*===================== 
	base styles 
=======================*/

html {
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
	}

body {
    font-family: 'Roboto', sans-serif;
    margin: 0;
	padding:0;
	background:url(../siteart/p6.png) repeat;
	color:#000;
	}

svg:not(:root) {overflow: hidden;/*reset*/}
	
/* clear floats */ 
.group:before,
.group:after {content: ""; display: table;} 
.group:after {clear: both;}
.group {zoom: 1;}	
.clear { clear: both;}
	
/*image replacement*/
.hide-text {
	text-indent:  100%;
	white-space:  nowrap;
	overflow:  hidden;
	}	

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
	border-style: solid;
    height: 0;
	} 

img { border: 0; max-width:100%;} 
	
/*===================== 
	typography 
=======================*/

h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto', sans-serif;
	margin: 0;
	font-weight:900;
    line-height:1.5em;
	}
	h1 {font-size: 36px;}
	h2 {font-size: 30px;}
	h3 {font-size: 24px;}
	h4 {font-size: 20px;}
	h5 {font-size: 18px;}

p {
    font-family: 'Roboto', sans-serif;
	padding: 0 0 2% 0;
	font-size:18px;
	line-height:1.5em;
	margin: 0;
	}
strong{font-family: 'Roboto', sans-serif;font-weight:900;}

/*===================== 
	link styles 
=======================*/

a.link:focus {outline: thin dotted;/*reset*/
	}
	
a {
    text-decoration:none;
	color:inherit;
}

a:hover  {
	text-decoration: none;
	color: #0c4ca3;
	} 
	
	
.appbutton{}
.appbutton a{background:#38b749; padding:5px 10px;color:#fff; border-radius:3px;}
.appbutton a:hover{background:#262626; padding:5px 10px;color:#fff; border-radius:3px;}
 
 
/*===================== 
	list styles 
=======================*/
ul.list{
	margin:0;
	padding: 0 0 5% 7%;
}
ul.list li{
	font-size:16px;
}

/*===================== 
	header styles 
=======================*/
header{width:100%;margin:0;padding:10px 0;background:#fff;position:relative;border-bottom:2px solid #fff;}

.headerwrap{width:96%;max-width:1620px;margin:0 auto;}
.headlogo{float:left;}
.headright{float:right;text-align:right;margin-top:20px;}
.headright h4{color:#0c4ca3;margin-bottom:5px;}
.headright h3{color:#000;}
.navbar{position:absolute;right:0;bottom:0;text-align:left;width:75%;}
.navbar h3{padding:0;color:#636363;}

/*===================== 
	content styles 
=======================*/
.wrapper{width:96%;max-width:1620px;margin:0 auto;padding:0;}
.container{width:100%;max-width:1660px;margin:0 auto;}
.internal{position:relative;background:url("../siteart/ricepaper.jpg") repeat;padding:3% 0;}
.pagetitler{color:#0c4ca3;margin-bottom:1%;}
.internal .contactbutton{margin:10px 0;}
/*.copyhalf{display:inline-block;zoom: 1;*display: inline;vertical-align:top;width:48%;}*/

/*===================== 
	slideshow styles 
=======================*/
.heroblock{padding:1% 0;border-top:10px solid #000;background:url("../siteart/ricepaper.jpg") repeat;border-bottom:40px solid #636363;position:relative;}
.slides{background:url(../siteart/concrete_wall.png) repeat;padding:0;color:#fff;position:relative;float:left;width:75%;}
.herostack{float:right;width:23%;margin-left:2%;}
.contactwindow{margin-bottom:5%;}
.contactwindow h5{font-weight:400;}
.contactwindow h3{color:#0c4ca3;line-height:1em;margin-bottom:1%;}
.contactbutton{background:#0c4ca3;padding:8px 0;text-align:center;color:#fff;width:100%;font-weight:700;margin-top:5px;}
.contactbutton:hover{background:#000;cursor:pointer;}

.cycle-slideshow{box-shadow: 0px 2px 5px 1px rgba(0,0,0,.75);}
.cycle-slideshow img{
	width:100%;
}
.b-ml{display: none;}

/* pager */
.cycle-pager { 
    text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 10px; overflow: hidden;display:none;
}
.cycle-pager span { 
    font-family: arial; font-size: 50px; width: 16px; height: 16px; 
    display: inline-block; color: #ddd; cursor: pointer; transition: all .5s ease-in-out; 
}
.cycle-pager span.cycle-pager-active { color:#2885b3;}
.cycle-pager > * { cursor: pointer;}

#formpage .captchabox{text-align:left;}
#formpage .CaptchaPanel {margin:0 !important;padding:0 !important;}
#formpage .CaptchaImagePanel {padding:5px 0 !important;float:left;width:50%;}
#formpage .CaptchaImage { }
#formpage .CaptchaMessagePanel { padding: 5px 0 0 0 !important; font-weight: bold;float:left;width:46%;margin-left:4%;font-size:14px;text-align:left;}
#formpage .CaptchaAnswerPanel { padding: 5px 0 0 0 !important; }
#CaptchaAnswer{margin-bottom:0;}
#formpage .CaptchaWhatsThisPanel { padding: 5px 5px 10px 5px;font-size:13px; }	
.sendbutton{width:100%;background:#0c4ca3;color:#fff;font-size:18px;font-weight:700;}
.sendbutton:hover{background:#000;cursor:pointer;}

/*===================== 
	welcome styles 
=======================*/
.welcome{background:#fff;position:relative;padding:2% 0;}
.welcomeleft{float:left;width:68%;margin-right:2%;min-height:300px;}	
.welcome h4{color:#0c4ca3;}
.welcome h1{line-height:1.2em;color:#0c4ca3;}
.tagline{margin-bottom:2%;}
.shortened{width:30%;}
.welcomeright{position:absolute;right:0;top:0;bottom:0;width:20%;padding:2% 8% 2% 2%;background:#ccc;}
.welcomesidebar{position:absolute;right:0;top:0;bottom:0;width:20%;padding:2% 8% 2% 2%;background:#0c4ca3;}
.welcomesidebar h3{border-bottom:2px solid #fff;color:#fff;margin-bottom:5px;}
.welcomesidebar p{color:#fff;}
.welcomesidebar iframe{height:300px;}
.reversed{background:#fff;color:#0c4ca3;}
.reversed:hover{background:#ccc;}
.welcomesidebar a:hover{color:#ccc;}

/*===================== 
	map styles 
=======================*/
.mapblock iframe{height:400px;}

/*===================== 
	Form styles 
=======================*/
#formpage strong{font-size:14px;}
#contactform .third{float:left;width:31%;margin-right:2%;}
#contactform p{padding-bottom:10px;font-size:16px;}
#contactform .CaptchaImagePanel {padding:5px 0 !important;}
#contactform .CaptchaMessagePanel { padding: 5px 0 !important; font-weight: bold;font-size:14px;text-align:center;}
#contactform .CaptchaAnswerPanel { padding: 5px 0 !important; }
#contactform textarea{height:100px;margin-bottom:10px;}
#contactform h4{color:#0c4ca3;}
.neededbox{margin-top:10px;}
#contactform .commentbox,#contactform .captchabox{width:97%;}
#contactform strong{font-weight:500;}

form{
	margin:0 0 0;
}
label{
	display:block;
	font-size:16px;
	padding-top: 4%;
	width:100%;
}
input{
	font-family: 'Roboto', sans-serif;
	border: #999999 solid 1px;
	border-radius: 2px;
	padding: 1%;
	font-size:14px;
	width:98%;
	margin-bottom:10px;
}
input:focus{
	border: #2885b3 solid 1px;
}
input.button2{
	display:block;
	width:50%;
	margin:0 auto 5% auto;
	border:#277e32 solid 1px;
	background-color:#38b749;
	color:#fff;
	border-radius: 2px;
}

input.button2:hover{
	background-color:#277e32;
	cursor:pointer;
}

select{
	font-family: 'Roboto', sans-serif;
	border: #999999 solid 1px;
	padding: 1%;
	font-size:14px;
	width:100%;
    margin-bottom:10px;
}

textarea{
	font-family: 'Roboto', sans-serif;
	border: #999999 solid 1px;
	border-radius: 2px;
	padding: 1%;
	font-size:14px;
	width:98%;
}

input[type='checkbox'],input[type='radio']{width:15px !important;min-width:15px !important;margin-right:2px;}



/*===================== 
	layout styles 
=======================*/
.sitemap{background:url(../siteart/escheresque_ste.png) repeat;color:#fff;}
.sitemap p{line-height:2em;}
.sitemap i{font-size:42px;margin-right:20px;}

/*===================== 
	inventory styles 
=======================*/
.scrollingbar{background:url("../siteart/gray_sand.jpg") repeat;padding:1% 0;}
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}


.hosted-content .pagination > .drop-down-form select{width:8% !important;}
.hosted-content h1{font-size:24px !important;line-height:1.3em;}
.hosted-content h2{font-size:22px !important;line-height:1.2em;}
.hosted-content h3{font-size:20px !important;line-height:1.1em;}

.mobilecontainer { 
	overflow:hidden; /* must have this property for mobile phones and tablet display! */
	width:100%; 
	margin:0 auto;
	height:92px; 
	padding:0;
	background:#000;
}
iframe.banner {
	width:100%;
	height:92px;
	background:#000
}

/*===================== 
	klein styles 
=======================*/
.kleinlogo{max-width:300px;}

/*===================== 
	staff styles 
=======================*/
.employeeblock{margin:2% 0;}
.empphoto,.empdesc{display:inline-block;zoom: 1;*display: inline;vertical-align:top;}
.empphoto{width:20%;margin-right:2%;}
.empdesc{width:77%;}
.empdesc h3{color:#0c4ca3;}

/*===================== 
	footer styles 
=======================*/

.pagebottom{background:url("../siteart/gray_sand.jpg") repeat;padding:30px 0;border-bottom:5px solid #fff;}
.pagebottom h3{color:#fff;border-bottom:2px solid #fff;margin-bottom:10px;}
.pagebottom p{color:#fff;font-size:16px;}
.pagebottom a{color:#fff !important;text-decoration:none;}
.pagebottom a:hover{color:#ccc !important;}

.footerleft,.footerright{float:left;width:25%;}
.footercenter a,.footerright a{display:block;margin-bottom:2px;}
.footercenter{width:46%;float:left;padding:0 2%;}
.half{width:48%;float:left;margin-right:2%;}

.pubfooter{padding:1% 0;background:#0c4ca3;}

footer {
	margin: 0 auto;
	width: 100%;
	}
	
a.footerlink:link,
a.footerlink:visited, 
a.footerlink:active {
	text-decoration: none; 
	font-size:11px;
	color: #fff;
	border-bottom:none;
	}
	a.footerlink:hover {
		text-decoration:none; 
		font-size:11px;
		color: #fff;
		}

.footertext {
	font-size:11px; 
	color:#fff;
	}

.smallfootertext {
	font-size:11px; 
	color:#fff;
	}

.divfooter {
	margin:0 auto;
	}

/*===================== 
	Responsive styles 
=======================*/
@media screen and (max-width: 1480px) {
	h1 {font-size: 30px;}
	h2 {font-size: 26px;}
	h3 {font-size: 20px;}
	h4 {font-size: 18px;}
	h5 {font-size: 16px;}    
    p {font-size: 16px;}
    .contactwindow{margin-bottom:0;}
    #formpage input{margin-bottom:5px;}
    #formpage .CaptchaMessagePanel{font-size:12px;}
    .sendbutton,.contactbutton{font-size:15px;padding:5px 0;}
    .welcomesidebar,.welcomeright{width:26%;padding:2%;}
    .shortened{width:40%;}
    .mapblock iframe{height:300px;}
	.mail{display: none;}
	.b-ml{display: block; }
}

@media screen and (max-width: 1300px) {
    .navbar{width:65%;}
    .heroblock{padding-bottom:6%;border-bottom:5px solid #636363;}
    .slides{width:100%; margin: 0 auto 20px;}
    .herostack{width:0;}
    #consignwindow{position:absolute;width:96%;text-align:center;bottom:0;background:url("../siteart/gray_sand.jpg") repeat;padding:1% 2%;left:0;right:0;}
    #consignwindow h5,#consignwindow h3,#consignwindow .contactbutton{display:inline-block;zoom: 1;*display: inline;vertical-align:middle;margin:0;}
    #consignwindow h5,#consignwindow h3{font-weight:900;color:#fff;font-size:20px;}
    #consignwindow .contactbutton{width:300px;margin-left:2%;}
    #consignwindow .contactbutton:hover{background:#fff;color:#0c4ca3;}
    .footercenter a,.footerright a,.pagebottom p{font-size:14px;}
    
    #contactform .third{width:47.5%;}
	
	#mailwindow{position:absolute;width:96%;text-align:left;bottom:0;background:url("../siteart/gray_sand.jpg") repeat;padding:1% 2%;left:0;right:0;}
    #mailwindow h5,#mailwindow h3,#mailwindow .contactbutton{display:inline-block;zoom: 1;*display: inline;vertical-align:middle;margin:0;}
    #mailwindow h5,#mailwindow h3{font-weight:900;color:#fff;font-size:20px;}
    #mailwindow .contactbutton{width:300px;margin-left:2%;}
    #mailwindow .contactbutton:hover{background:#fff;color:#0c4ca3;}
	
	
	
}

@media screen and (max-width: 1000px) {
    header{padding-bottom:0;}
    .headlogo{width:30%;}
    .navbar{width:100%;position:relative;}
    .navbar h3{font-size:18px;text-align:center;}
    .slides,.herostack{float:none;width:100%;display:block;margin:0 auto;}
    .herostack{padding:2% 0;text-align:center;}
    .contactwindow h5,.contactwindow h3{display:inline-block;zoom: 1;*display: inline;vertical-align:middle;margin:0;font-weight:900;color:#0c4ca3;font-size:20px;}
    #consignwindow .contactbutton{width:250px;}
	#mailwindow .contactbutton{width:250px;}
    .signupfield{display:inline-block;zoom: 1;*display: inline;vertical-align:middle;width:30%;margin:0 1%;}
    #formpage .CaptchaPanel{width:40%;margin:0 auto !important;}
    #formpage .CaptchaImagePanel,#formpage .CaptchaMessagePanel{width:100%;float:none;display:block;margin:0 auto;text-align:center;}
    #formpage .sendbutton{width:40%;margin:0 auto;display:block;}
    .mapblock iframe{height:200px;}
    
    .kleinlogo{max-width:200px;}
    
    .empphoto{width:50%;margin:0;}
    .empdesc{width:100%;}
}

@media screen and (max-width: 800px) {
	h1 {font-size: 26px;}
	h2 {font-size: 22px;}
	h3 {font-size: 18px;}
	h4 {font-size: 16px;}
	h5 {font-size: 15px;}    
    p {font-size: 15px;}  
    .wrapper{width:92%;}
    .headlogo{width:35%;}
    .heroblock{padding-bottom:90px;}
    .herostack{padding:2% 0;}
    .signupfield{width:90%;text-align:left;}
    #formpage .CaptchaPanel,#formpage .sendbutton{width:60%;}   
    #consignwindow .contactbutton{display:block;margin:5px auto;width:60%;}
	#mailwindow .contactbutton{display:block;margin:5px auto;width:60%;}
    .welcome{padding:4% 0;}
    .welcomeleft{width:100%;margin:0 auto;float:none;display:block;text-align:center;min-height:auto;}
    .welcomesidebar,.welcomeright{position:relative;width:96%;top:auto;bottom:auto;right:auto;margin-top:4%;text-align:center;}
    .welcomeright{background:none;}
    .reversed,.shortened{width:60%;margin:0 auto !important;}
    .footercenter a,.footerright a,.pagebottom p{font-size:13px;}
    
    .pagetitler{text-align:center;}
    .internal .shortened{margin:5px auto !important;}
    
    #contactform{text-align:left !important;}
    #contactform strong{font-size:15px;}
    #contactform .third,#contactform .commentbox,#contactform .captchabox{width:100%;}
    .welcomesidebar iframe{height:200px;}
	.slides{    margin: 0 auto 80px;}
}

@media screen and (max-width: 600px) {
    .headlogo{width:40%;}
    .headright{margin-top:15px;}
    .pagebottom{text-align:center;padding:10px 0;}
    .pagebottom h3{margin-bottom:5px;}
    .footerleft,.footercenter,.footerright{float:none;width:80%;margin:2% auto;text-align:center;}
    .divfooter{text-align:center;}
	#mailwindow{position:absolute;width:96%;text-align:center;bottom:0;background:url("../siteart/gray_sand.jpg") repeat;padding:1% 2%;left:0;right:0;}
}

@media screen and (max-width: 480px){
    header{padding:0;}
    .headlogo{width:60%;float:none;display:block;margin:0 auto;}
    .headright{width:100%;float:none;display:block;text-align:center;margin:5px auto;}
    .headright h4{margin:0;}
    .heroblock{padding-bottom:110px;}
    #formpage .CaptchaPanel,#formpage .sendbutton{width:90%;}   
    #consignwindow .contactbutton{display:block;margin:5px auto;width:90%;}
    #consignwindow{padding:2%;}
	 #mailwindow .contactbutton{display:block;margin:5px auto;width:90%;}
    #mailwindow{padding:2%;}
    .contactwindow h5,.contactwindow h3{font-size:18px !important;}
    .welcome{padding:6% 0;}
    .welcomesidebar{padding:4%;width:92%;}
    .shortened{width:90%;}
    .reversed{width:95%;}
    .footerleft,.footercenter,.footerright{width:96%;margin:4% auto;}
    .slides{    margin: 0 auto 60px;}
    .pagetitler{line-height:1.1em;margin-bottom:4%;}
    
    .empphoto{width:80%;margin:0 auto;}
}

@media screen and (max-width: 375px){
    .headlogo{width:75%;}
    .navbar h3{font-size:16px;}
	.slides{    margin: 0 auto 90px;}
}



@media screen and (max-width: 360px){
    .headlogo{width:75%;}
    .navbar h3{font-size:16px;}
	.slides{    margin: 0 auto 90px;}
}