
@import "../css/reset.css";
@import "../css/skeleton.css";
@import "../css/superfish.css";
@import "../css/flexslider.css";

article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}mark,rp,rt,ruby,summary,time{display:inline}
/* Global properties ======================================================== */
html {width:100%}

body {font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:22px; color:#8b8b8b; min-width:960px; background:#4e4e4e; -webkit-text-size-adjust: none;}

/*********************************fonts*************************************/
.reg {text-transform:uppercase}
.f_left {float:left}
.f_right {float:right}
.align_right {text-align:right}
.align_center {text-align:center}

.it{font-style:italic}
.let{letter-spacing:-1px}

/*********************************CLASSES**********************************/
.m_bottom_zero{ margin-bottom:0 !important;}
.m_left_zero{ margin-left:0 !important;}
.p_bottom_zero{ padding-bottom:0 !important;}
.p_left_zero{ padding-left:0 !important;}

.clear {clear:both;width:100%;line-height:0;font-size:0;}
.wrapper {width:100%;overflow:hidden; margin-top:20px;}
.extra_wrapper{ overflow:hidden;}
.container{width:100%}
.extra_last, .last{ margin-bottom:0 !important; padding-bottom:0 !important;}
.extra_last{ border:none !important; background:none !important;}
.bg_none{ background:none !important;}
.bd_n{border:none !important;}
/*==================================== Links ======================================================== */
a {color:#8b8b8b;outline:none; text-decoration:none; cursor:pointer;}
a:hover{ color:#4a4a4a; text-decoration:none;}

.button{ display:inline-block; padding:10px 17px 10px; margin: 21px 0 0; font-size: 12px; line-height: 16px; color:#4a4a4a;background: url('../images/button.jpg') repeat-x #f0f0f0;border-radius:4px;position: relative;text-transform:uppercase;}
.button em{background:#484848 !important;}

.button:hover{color:#000;}

.button1{ display:inline-block; padding:20px 26px; margin: 0 0 0 0; position: relative; font-size: 12px; line-height:16px; color:#fff;background: url('../images/button1.jpg') repeat-x #404040;text-transform:uppercase;border-radius:4px;}
.button em, .button1 em{display:block;position: absolute;width:0;height:0;top:50%;left:50%;background: url('../images/button1_h.jpg') repeat-x #8c8c8c;z-index:1;border-radius:4px;}
.button:hover, .button1:hover{color:#fff;}
.button:hover em, .button1:hover em{height:100%;left:0;top:0;width:100%;}
span.button , span.button1 {position: relative; display:none;z-index:10; width:100px; float:right; color:#4a4a4a;  }


/*********************************Displays*************************************/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*********************************header*************************************/

.header {padding:23px 0 0;background: url('../images/header_1.jpg') repeat-x #282828; height:150px;}
.header h1{width:240px;margin-left:0px;float: left;}
.header h1 a {display:block;width:400px;height:80px;background:url(../images/logo.gif) 0 0 no-repeat; text-decoration:none; text-indent:-9999px;}

.header_top{margin-bottom:34px;overflow: hidden;}
.social{ overflow:hidden;float: right;padding: 19px 2px 0;}
.social a{ display:block; float:left;width:30px;height:30px; overflow:hidden; margin-left:1px;}
.social a:first-child{margin: 0 0 0 0;}
.social a:hover img{ margin-top:-30px;}

.call{float: right; padding: 18px 0px 0 20px;font-size:14px;color:#ffffff; text-align:right;}
.call ul{float: right; color:#ffffff;display:inline-block;margin-left:4px; text-align:right;}


/*================================>> slider box <<========================================*/

.slider_box{padding:70px 0 35px ;background: url('../images/slider_bg.jpg') repeat-x #717171;overflow: hidden;border-bottom:1px solid #fff;position: relative; z-index:1;clear:both;}
.header_box{margin:0 5px;position: relative;}
/*********************************content*************************************/
#content {padding:82px 0px 47px 0px;clear:  both;background: url('../images/content.jpg') repeat-x #fff;}
.cont_pad{padding:35px 0 47px !important; }
.cont_pad1{padding:70px 0 47px !important;}

/*===============================>> Paragraphs <<=============================*/

p {margin-bottom:20px}
.p2{ margin-bottom:18px;}
.p3{ margin-bottom:7px;}
.p4{ margin-bottom:22px;}
/*================================>> LISTS <<========================================*/
.list1{}
.list1 li{ background:url(../images/marker1.png) 0 8px no-repeat; font-size:16px; padding-left:13px;border-bottom:1px solid #ececec;padding-bottom:9px;margin-bottom:8px;}
.list1_dta li{ margin-bottom:80px; font-size:16px;}
.list1 a{}
.grid_16 li img{max-width:100%; }

.list1_dta_img img{max-width:100%;}

/*================================>> H <<========================================*/
h2,h3,h4{ font-weight:normal;}
h2, h3, h4{margin-bottom:25px;font-size: 18px; line-height: 22px; color:#555555;letter-spacing:-1px;}

h4{color:#747474;}
h4 a{color:#555555;}

h2.ind{ margin-bottom:26px;}
h2.ind1{ margin-bottom:27px; color:#0000ff;}
h2.ind2{ margin-bottom:13px;}
h2.ind3{ margin-bottom:32px;}
h2.ind4{ margin-bottom:30px;}

/*================================>> GOOGLE FONTS  <<========================================*/
.title1, .title2, .offer .title, .os, h2{font-family: 'Open Sans', sans-serif;font-weight:800;text-transform:none;}

/*================================>> hovers <<========================================*/
.button1 em, .button em, a.img_wrap, footer a, .sf-menu a{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

/*********************************page_1*************************************/
.ext_list>li, .ext_box{ overflow:hidden;}
.ext_list>li>figure, .ext_box>figure{ float:left;}
.ext_list>li>div, .ext_box>div{overflow:hidden;}



.offer{padding-right:1px;}
.offer .title h2{background: url('../images/offer_title_2.png') repeat-x #474747;font-size: 18px; line-height: 20px; color: #fff;border-radius:4px 4px 0 0;padding: 10px 0 10px 17px;}

/*.offer .title span{font-size: 16px; line-height: 19px; color: #7c7c7c; display:block;margin-bottom:-9px;}*/
.offer .text{background: url('../images/offer_text.jpg') repeat-x #f0f0f0;padding: 16px 17px 17px;border-radius: 0 0 4px 4px;}

.link1{color:#444242;display:inline-block;text-transform:uppercase;margin-top:10px; background:#ccc; margin:0;font-size:10px; border:1px solid #e5e5e5; padding:4px 10px;outline:none; position:relative; font-family:Arial, Helvetica, sans-serif; border-radius:5px;}
.link1:hover{color:#444242; background:#ccc}

.welcome{border-bottom:1px solid #ececec;margin: 20px 0 20px;padding: 20px 0 20px;}
.welcome .title1 h2{font-size: 18px; line-height: 25px; color: #555555;margin-bottom:-3px; margin-top:-30px;}

.welcome .title2{font-size: 16px; line-height: 25px; color: #555555;letter-spacing:-1px;margin-bottom:14px; padding-top:20px;}
.welcome .buttons strong{display:inline-block;font-weight:normal;padding: 17px 6px 0;}

.f_14, .f_14 a, a.f_14{font-size:14px;line-height:22px;color:#424242;}
a.f_14:hover, .f_14 a:hover{color:#727272;}

.offer_list{margin-bottom:11px;}

.testimonial{overflow: hidden;}
.testimonial blockquote{float: left;background: url('../images/blockquote.jpg') repeat-x #eaeaea;width:161px;border-radius:4px;padding: 25px 20px 24px 19px;position: relative;}
.testimonial blockquote:after{width:15px;height:11px;display:block;right:-15px;top:16px;position: absolute;background: url('../images/blockquote_after.png') no-repeat;content:"";}
.testimonial figure{float: right;}
.testimonial .demo{text-decoration:none;}

.img_wrap{border:4px solid #d5d5d5;display:inline-block;background:#D5D5D5;}
.img_wrap, .img_wrap img{border-radius:4px;}
a.img_wrap:hover{border-color:#4c4c4c;}

.articles{}
.articles>li{}
.articles time{font-weight:bold;color:#fff;padding-top:1px;text-transform:uppercase;display:block;font-size:11px;}
.articles a{color:#9d9d9d;}
.articles a:hover{color:#fff;}

.links_list{text-transform:none;}
.links_list a{color:#9d9d9d;text-decoration:underline;}
.links_list li.current a, .links_list li a:hover{color:#fff;}
/*********************************page_2*************************************/
.we_are{border-bottom:1px solid #ebebeb;padding-bottom:20px;margin-bottom:42px;}
.we_are>li{border-bottom:1px solid #ebebeb;padding-bottom:15px;margin-bottom:25px;}
.we_are>li>div{}
.we_are>li>figure{background: url('../images/big_marker.png') no-repeat; width:51px;padding: 4px 0 25px;font-size: 36px; line-height: 43px; color: #fff;text-align:center;margin: 3px 17px 0 0;font-weight:bold;}
.we_are_g>li>figure{background: url('../images/big_marker_g.png') no-repeat; width:100px;padding: 4px 0 25px;font-size: 28px; line-height: 43px; color: #fff;text-align:center;margin: 3px 17px 0 0;font-weight:bold;}
.we_are>li.last{padding-bottom:10px !important;}
.box{border-bottom:1px solid #ebebeb;padding-bottom:44px;margin-bottom:41px;}

.m_bot1{margin-bottom:24px;}
.m_bot2{margin-bottom:9px;}

.team_box{}
.team{background:#e6e6e6;padding:10px 10px 15px;width:175px;border-radius:4px;float: left;margin-left:22px;}
.team img{margin-bottom:9px;}
.team_box .team:first-child{margin-left:0;}

/*********************************page_3*************************************/
.stripe{height:1px;background:#ebebeb;margin: 40px 5px;}
.stripe1{height:1px;background:#ebebeb;margin: 43px 5px 40px;}

.s_overview{}
.s_overview>li{margin-bottom:26px;}
.s_overview>li>div{}
.s_overview>li>div p{margin-bottom:10px;}
.s_overview>li>figure{margin: 1px 20px 0 0;}

/*********************************page_4*************************************/

.solution{background:#e6e6e6;border-radius:5px;padding:10px 10px 20px;}
.solution>a{display:block;margin-bottom:13px;}

/*********************************page_5*************************************/


/* Contact form */
#contactform { padding:1px 0 0 0;}
#contactform .success {width:246px;  padding:10px;}
#contactform textarea, #contactform input { margin:0;font-size:13px; border:1px solid #e5e5e5; color:#8f8f8f; padding:9px 13px;outline:none; position:relative; font-family:Arial, Helvetica, sans-serif;background:#fff;}
#contactform label input  {width:500px;float: left;}
#contactform textarea {overflow:auto; width:562px; height:231px;resize:none; float:left; margin: 0 0 0 0;}	
#contactform label {display: inline-block; min-height:0px; width:550px;overflow:hidden;}	
#contactform label.message { display:block; padding-bottom:0; }
#contactform .button {margin-left:8px;}	
#contactform .error, #contactform .empty, #contactform .success {display:none;}	
#contactform .error, #contactform .empty {text-align:left; color:red; font-size:11px; float: left;line-height:18px;}
#contactform .buttons2 {overflow:hidden;text-align:right; position:relative; clear:both; padding-top:24px;}
#contactform .button1 {background:#444242; cursor:pointer;color:#ffffff;}
#contactform .button1:hover { background:#CCCCCC; cursor:pointer;color:#000;}
#contactform .buttons2 span input{
	cursor:pointer;
	margin-top:0;
	text-align:center;
	background-color:#8f8f8f;
	color:#ffffff;
}
#contactform span{ display:inline; margin: 0px 0 0 5px;}

#contactform label.label-checkbox{
	width:80px;
	}
#contactform a:link{ color:#4a4a4a; text-decoration:underline;}
.map_wrapper{overflow:hidden;display:block;margin-bottom:20px;}
#map_canvas {
  width:100%;
   height:279px;
}
.adress{}
.adress span{ display:inline-block; width:74px;}
.adress dt{ margin-bottom:22px;}

.demo{colo2r:#424242;text-decoration:underline;}
.demo:hover{text-decoration:none;}
/****************************footer************************/
.footer {padding:20px 0;background: url('../images/footer_2.jpg') repeat-x;line-height:20px;}
.footer .privacy{text-transform:uppercase;margin-top:-6px;line-height:30px;}
.footer .privacy, footer .privacy a{color:#9d9d9d;}
.footer a:hover{color:#fff;}
.footer h2{color:#fff;letter-spacing:0;margin-bottom:19px;}

.liste ul li{
	list-style-type:circle;}

.sitemap-liste li{
	line-height: 2.0em;
}
.sitemap-liste {
	list-style-type:disc;
}
.sitemap-liste ul{
	list-style-type:square;
}

/*==================================RESPONSIVE LAYOUTS===============================================*/

@media only screen and (max-width: 995px) {
 body{min-width:768px;}
 

 .flexslider{height:300px;}
 .flexslider .title1{font-size:40px;}
 .flexslider .title2{font-size:20px;}
 .testimonial{overflow: hidden;}
 .testimonial blockquote{width:84%;float: none;}
 .testimonial blockquote:after{display:none;}
 .testimonial figure{float: none;margin-top:10px;}
 #search input{width:100px;}
 .team{margin-left:10px;width:140px;}
 .team img{width:100%;}
 .m_bot1{margin-bottom:20px;}
 .img_wrap img{width:100%;}
 #contactform textarea,  #contactform input{width:440px;}
  #contactform  .button1{width:150px;}
 .privacy span{display:block;}

}


@media only screen and (max-width: 767px) {
 body{min-width:420px;}
 .privacy span{display:inline;}
 .flexslider{height:184px;}
 header .call{float: none; clear: both;font-size:12px; padding-top:5px;}
 #content img{width:70%;}
 .sf-menu, #search{float: none;}
 #search{margin: 15px 15px 0;}
 .flexslider .title1{font-size: 20px; line-height: 36px; color: #7c7c7c; text-transform:uppercase; font-weight:800;letter-spacing:0px;}
.flexslider .title2{font-size: 15px; letter-spacing:0px; line-height: 30px;margin-top:-10px; }
.flexslider .text{display:none;}
.slider_box{padding-top:150px;}
.flexslider .banner{padding-top:15px;}
.flex-direction-nav a{top:64%;}
.welcome .title2{font-size:16px;line-height:27px;}
.testimonial figure{float: right;margin-top:0;}
.testimonial blockquote{width:60%;float: left;}
.testimonial blockquote:after{display:block;}
 #search input{width:350px;}
.header_box{margin:0;width:100%;}
#content{padding-top:160px;}
.cont_pad1{padding-top:160px !important;}
.team{width:400px;margin: 0 0 20px !important;}
.team_box.m_bot1{margin-bottom:0;}
.m_bot2{margin-bottom:30px;}
.img_wrap{display:block;}
#contactform textarea, #contactform input {width:391px;}
/* #contactform  .button1{width:150px;}*/
.grid_16 li img{max-width:7%; }
.list1_dta_img img {max-width:7%;}
.call{display:none;}

}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
  .header h1 a {background:url(../images/logo_kl_resposive.gif) 0 0 no-repeat;}

 
 .flexslider{height:131px;}
 .testimonial blockquote{width:50%;}
 .flexslider .banner{padding-top:0;}
 .flexslider .title1{font-size: 15px;}
 .flex-direction-nav a{top:60%;}
.flexslider .title2{font-size: 12px; letter-spacing:0px; line-height: 20px;margin-top:0;}
 #search input{width:230px;}
 .team{width:280px;}
 .s_overview>li>figure{float: none;width:100%;margin: 0 0 20px;}
 .s_overview .img_wrap img{border-radius:0;}
 

 .welcome .title1{ font-size:14px; text-align:justify;}
.welcome .title2{ font-size:12px; text-align:justify;}
.grid_16 li img{max-width:10%; float:left;}
.list1_dta_img img {max-width:10%;}
#contactform textarea  { max-width:270px; float:none;}
#contactform input  { width:270px;}
#contactform .button1 { width:100px;}

}
@media only screen and (max-width: 300px) {
body{min-width:250px;}
#contactform textarea  { max-width:190px; float:none;}
#contactform input  { width:190px;}
#contactform .button1 { width:80px;}
.grid_16 li img{ float:left;}

}



