@import url(masonry.css);
@import url(subscribe-box.css);
@import url(category-update.css);

body { color: #000; font-family: 'Arimo', sans-serif,myriadpro; margin: 0px; padding: 0px;  font-size:11.5px; background:#fff;  }
h1, h2, h3, h4, h5, p, ul, li, div, form{ margin:0; padding:0;}
p{line-height: 1.5;}
.clr { clear: both;}
.left { float: left;}
.right { float: right;}
a, img a { cursor: pointer;}
*{margin:0;}
*{ outline:none; border:none; text-decoration:none;}
html{ width:100%; height:100%;}
ul, ol, li{ list-style:none;}

/*Wrapper*/
.wrapper { margin: 0 auto; width:1001px; background:#fff;}
/*header*/
.header{ position:relative;}
.header h1.logo{ width:206px; padding:29px 0 0 24px; float:left; padding-bottom:26px;}
.header h1.logo a{ width:223px; height:135px; background:url(../images/kubis_website_logo.jpg); float:left; text-indent:-9999px;}
.socialBox{ float: right;
    height: 30px;
    margin-top: 10px;
    width: 94px;}
a.socialIcon{ width:26px; height:26px; margin-right:4px; float:left;}
.navOut{ width:100%; background:#2a2a2a; }
.navIn{ float:left; margin-left:10px;}
.navIn ul li{ display: inline-block; height: 100%; position: relative;}
.navIn ul li a{ color: #FFFFFF;
    font-size: 13.5px;
    font-weight: normal;
    letter-spacing: 0.6px;
    line-height: 41px;
    padding: 0 13px;
    text-transform: uppercase;}
.navIn ul ul.sM_l1, .navIn ul ul.sM_l2{z-index: 500; display: none;position: absolute;margin: 0;padding: 0; }
.navIn ul ul.sM_l1{ width: 300px; background: #555;}
.navIn ul ul.sM_l1 li a{line-height: 27px;font-size: 90%;}
.navIn ul ul.sM_l2 li a{color: black; font-weight:bold;}
.navIn ul ul.sM_l1 li:hover{ background: #999;}
.navIn ul ul.sM_l2 li:hover{ background: #FFC423;}
.navIn ul ul.sM_l2 {left: 100%;top: 0; width: auto; background: #F2BA21;}
.navIn ul li:hover ul.sM_l1{display: block;}
ul.sM_l1 li:hover ul.sM_l2{display: block;}
.navIn ul ul.sM_l1 li, .navIn ul ul.sM_l2 li{ display: block; width: 100%;width: auto;margin: 0;}
.navIn ul ul.sM_l2 li{width:210px;
}






.form1{ float:right; padding-top:8px; float:right; margin-right:10px;}

.form1 input[ type="text"]{ width:186px; height:22px; border:solid 1px #000; float:left; padding:0 5px;}
.form1 input[ type="submit"]{ background: none repeat scroll 0 0 #656565;
    border: medium none;
    color: #FFFFFF;
    cursor: pointer;
    float: left;
    font-size: 13px;
    height: 22px;
    margin-top: 1px;
    padding-bottom: 3px;
    text-transform: uppercase;
    width: 95px;}
/*container*/
.container{ background:url(../images/content-bg.jpg) top  no-repeat; width:999px; height:1117px; }

/*contact*/
.contactWrap{ width:960px; margin:0 auto; padding-top:25px; background:#fff}
.contactWrap h1{font-weight:bold; border-bottom:solid 1px #e5e5e5; padding-bottom:18px;  width:953px; font-size:16px; text-transform:uppercase;  }
h1.relatedH1{border-bottom:none; padding-bottom:0;}
.contactLeft{ width:473px; float:left; padding-top:21px;}
.map{ border:solid 1px #cfcfcf;}
.contactRight{ width:465px; float:left; padding:21px 0 0 22px; }
.infoBox{ width:395px; }
.infoBox h2{ font-size:19px; }
.infoBox p{ font-size:12px; color:#000; line-height:20px; padding-top:20px;}
.infoBox a{ color:#de0a0a; }
.infoBox a:hover{ text-decoration:underline;}
.form2{ padding-top:43px; width:465px;}
.column1{ float:left; width:195px;}
.column2{ float:left; width:195px; margin-left:33px;}
.row{ float:left; padding-bottom:17px; }
.form2 label{ font-size:12px; text-align:left;  }
.form2 input[ type="text"],.form2 input[ type="email"]{ width:184px; height:21px; padding:0 5px;  border:solid 1px #cfcfcf; float:left; margin-top:10px;  font-size:12px; }
.form2 select{width:197px; height:25px; border:solid 1px #cfcfcf; margin-top:10px; font-size:12px; float:left;}
.form2 input[ type="radio"]{ width:13px; height:13px;   float:left; margin-top:10px;  font-size:12px; }
.form2 .radio{ width:184px; height:21px;   float:left; margin-top:10px;  font-size:12px;  }
.form2 .radio label{font-size:12px; padding:8px 0 0 10px; float:left; }
.form2 textarea{width:412px; height:100px; padding:5px;  border:solid 1px #cfcfcf; float:left; margin-top:10px;  font-size:12px;}
.form2 input[ type="checkbox"]{ width:13px; height:13px;   float:left; margin-top:10px;  font-size:12px; }
.form2 input[ type="submit"]{ width:70px; height:22px; float:right; background:#ef3d32; text-align:center; color:#fff; font-size:12px; cursor:pointer; margin-top:18px;}
.form2 .checkbox{ width:352px; height:21px;   float:left; margin-top:10px;  font-size:12px;   }
.form2 .checkbox label{font-size:12px; padding:8px 0 0 15px; float:left; }
.bannerBg{ width:953px; margin-top:21px; border:none/*solid 1px #cfcfcf*/;}
.environmentLeft{float:left; width:462px; padding:24px 0 27px 0;}
.environmentLeft h1{ font-weight:bold; font-size:19px; border:none;}
.environmentLeft p{line-height:17px; }
.environment p{padding-bottom: 20px;
    padding-top: 0 !important;}
.environmentRight{float:left; width:462px; padding:40px 0 0 27px;}
.environmentRight p{line-height:17px; }
.report{ width:157px ; height:22px; background:#6b6b6b; text-align:center; margin-top:27px; color:#fff; line-height:23px; float:left;}
.report:hover{ color:#CCC;}
.arrowBox{ float:right; margin-top:-10px; width:38px;}
.box{ border-bottom:solid 1px #cfcfcf; padding-top:20px; width:953px; }
.box .description{
	height:160px;
}
.box img{ float:left; border:solid 1px #cfcfcf; margin-bottom:20px;}
.box .project-img{
	margin-top:0 !important;
}
.description{ width:700px; float:right; position:relative;}
.description h1{ font-size:19px; padding-bottom:5px; border:none;}
.description span{ line-height:17px; font-weight:bold; }
.description small{ line-height:17px; font-size:12px; }
.description p{ line-height:17px;}
.view{ float:right; width:63px; height:22px; padding:3px 0 0 0; text-align:center; color:#fff; background:#000; line-height:22px; text-transform:uppercase; cursor:pointer;}
.view:hover{ color:#ffc425;}
.spacer{ height:22px;}
.box2{  padding-top:20px; width:980px; }
.innerBox{ width:245px; display:block; float: left; padding:0; height: auto; overflow: hidden; vertical-align: top; border: none; margin:0; margin-bottom: 20px;}
.imageBox{ width:217px; border:solid 1px #cccccc; height:150px; overflow:hidden;}
.innerBox h2{
	font-size:14px;
	margin:10px 0 5px;
	
}
.more{ float:right; width:96px; height:22px; padding:3px 0 0 0; text-align:center; color:#fff; background:#ffc425; line-height:22px; text-transform:uppercase; cursor:pointer;}
.more:hover{ color:#2a2a2a;}
.textBox{ width:217px; }
.textBox p{ height: 53px; overflow: hidden; }
.textBox img{
	height: 20px;
    margin-top: 4px;
    width: auto;
}
.view2{ float:right; width:63px; height:22px;  text-align:center; color:#fff; background:#2A2A2A; line-height:22px; text-transform:uppercase; cursor:pointer; padding:3px 0 0 0;}
.view2:hover{ color:#ffc425;}

.breadcrumb{ border-bottom:solid 1px #e5e5e5; padding-bottom:18px;  width:953px; font-size:13px;  }
.breadcrumb li{ display:inline;}
.breadcrumb li:not(:last-child):after{ content: " >> ";}
.breadcrumb li a{font-size:13px; font-weight:bold; color:#000; text-transform:uppercase; }
.breadcrumb li a:hover{text-decoration:underline;}

/*footer*/
.footerOut{ padding-top:888px;}
.footerOut2{ margin: 3px auto 0; width:1001px;}
.footerOut3{ margin:2px auto auto auto; width:1001px;}

.footer{background:#fff ;   width:100%;    }
.footerNav{ padding:14px 0 26px 18px; width:145px; float:left;  }
.footerNav ul li{ display:block; font-weight:bold;}
.footerNav ul li a{ color:#999999; line-height:18px; font-size:11px; font-weight:normal;}
.footerNav ul li a:hover{ text-decoration:underline;}
.footerRight{ float:right; padding:26px 21px 0 0;}
.footerRight p{ text-align:left; line-height:18px; font-size:11px; }
.footerRight a{ color:#000; }
.footerRight a:hover{ text-decoration:underline;}



.imageArea{   width: 627px;   float: left; margin-top: 20px;}

.blog-list .imageArea {
    float: left;
    margin-right: 15px;
    margin-top: 0;
    width: 627px;
}

.imageArea .mainImCnt{    width: 627px;    height: 420px;    text-align: center;    margin: 0;    padding: 0; position: relative;}
.imageArea .mainImCnt .mainIm{ margin: auto; vertical-align: middle;}
.imageTCnt img{ border: 1px solid #ccc; display: none;}
.imageTCnt img.active{ border: 1px solid #fc7; display: none;}
.imageTCnt img, .rltCnt .rlPr{ margin: 15px 15px 2px 0; cursor: pointer; display: inline-block; padding:0;}
.imageTCnt img.i4th{ margin-right: 0;}
.transparent{ height:60px; background:url('/images/transparent.png') repeat; position:absolute; bottom:0; left:0; width: 100%;}
.transparent span{ font-size:17px; color:#fff; padding:0 0 0 20px; line-height:60px; float:left;}
.arrow{ background:url(../images/arrow.png) top left no-repeat; width:48px; height:37px; float:right; margin:12px 6px 0 0;}
div.arrowL{ width:19px; height:37px; cursor:pointer; text-indent:-9999px; float:left;}
div.arrowR{ width:19px; height:37px; cursor:pointer; text-indent:-9999px; float:right;}

.LftCl{width: 318px;margin: 0; float: right; margin-top: 20px; height:420px; position:relative;}
.LftCl h2 { text-transform: uppercase; margin: 0 0 10px;}
.LftCl .description { width: auto; float: none; margin-top:10px;}
.dlFls{ box-sizing: content-box; margin-top: 20px; position:absolute; bottom:-3px;}
.dlFl {color: white;
    display: block;
    float: left;
    line-height: 20px;
    margin-bottom: 3px;
    margin-right: 3px;
    padding: 2px 0 0;
    text-align: center;
    text-transform: uppercase;
    width: 155px; 
	background: #aaa;
	}
.dlFl.dlFl-datasheet{ background: #ffc425;}
.dlFl.dlFl-techdraw{ background: #ef3d32}
.dlFl.dlFl-hiresimg{ background: #999;}
.dlFl.dlFl-catalog{ background: #555;}
.rltCnt .rlPr{ border: 1px solid #ccc;}
.rltCnt .rlPr:nth-child(6n){ margin-right: 0;}
.project-img{
	margin:20px 0;
}
.break{
	background: none repeat scroll 0 0 #E8E8E8;
    height: 3px;
    margin-bottom: 20px;
    margin-left: -20px;
    margin-top: 20px;
    width: 1000px;
}
h1.headingBig{
font-size:18px;
text-transform:uppercase;
margin:20px 0;	
}
.details{
	margin:10px 0;
}
.view3 {
    background: none repeat scroll 0 0 #000;
    bottom: 0;
    color: #FFFFFF;
    cursor: pointer;
    float: right;
    height: 22px;
    line-height: 22px;
    padding: 0;
    position: absolute;
    right: 0;
    text-align: center;
    text-transform: uppercase;
    width: 63px;
}
.descriptionProject {
    float: right;
    height: 160px;
    position: relative;
    width: 700px;
}
.blogBox{
	border-bottom: 1px solid #E5E5E5;
    margin: 0 auto;
    padding-bottom: 15px;
    width: 953px;	
}
.blogBox h2{
	text-transform:uppercase;
	margin:8px 0;
}
.blogBox span{
	color:red;
	margin-bottom:8px;
}
.blogBox p{
	margin-top:8px;
	line-height: 1.5;
}
.blogBoximg{
	margin-bottom:10px;
}
.blog-img{
	float:left;
	margin:0 0 15px 0;
}
.posts{ float:right; width:123px; height:22px; padding:3px 0 0 0; text-align:center; color:#fff; background:#ef3d32; line-height:22px; text-transform:uppercase; cursor:pointer;margin-right: 5px; margin: 12px 5px 12px 0;}
.posts:hover{ color:#CCC;}
.lfImgInfo{
	margin:20px 0;
}
.brand{
margin:30px 0;	
}
.brand img{
	/*border:1px solid #e5e5e5;*/
	margin-bottom: 10px;
}
.brand h4{
	margin-bottom: 10px;
}
.rltCnt{
	padding-bottom:20px;
}
.lfImg{
	border:none;
}
.subscribe{
    display: block;
    float: right;
    margin: 95px 10px 0 0;
    position: absolute;
    right: 0;
    text-align: right;
}
.subscribe .search-button{
	background: none repeat scroll 0 0 #000;
    border: medium none;
    color: #FFFFFF;
    cursor: pointer;
    float: left;
    font-size: 13px;
    height: 24px;
    padding-bottom: 3px;
    text-transform: uppercase;
    width: 95px;
}
.subscribe .search-field{
	border: 1px solid #000000;
    float: left;
    height: 22px;
    padding: 0 5px;
    width: 186px;
}
.footerNav .quicklink-img{
	display:none;
}

.blog-list h1 {
    border-bottom: 1px solid #E5E5E5;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 22px;
    padding-bottom: 18px;
    text-transform: uppercase;
    width: 953px;
	line-height:1;
}
.blog-list{
	line-height:1.5;
}

.blog-list .blog-img{
	margin-right:10px;
}

.nextPost{
	float:right;
}
.nextPost a{
	background: none repeat scroll 0 0 #000000;
    color: #FFFFFF;
    display: block;
    height: 20px;
    margin: 20px 0;
    padding: 3px 0 0;
    text-align: center;
    text-transform: uppercase;
    width: 120px;
}
.prevPost{
	float:left;
}
.prevPost a{
	background: none repeat scroll 0 0 #000000;
    color: #FFFFFF;
    display: block;
    height: 20px;
    margin: 20px 0;
    padding: 3px 0 0;
    text-align: center;
    text-transform: uppercase;
    width: 120px;
}
