@import "../css/reset.css";
@import "../css/skeleton.css";
@import "../css/superfish.css";
@import "../css/flexslider.css";
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300);
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:14px;
  line-height:22px;
  color:#b1b0b0;
  min-width:960px;
  background:#a8adb4;
  -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}
.rel{position: relative;}

.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}
.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;}

/*==================================== Links ======================================================== */
a {
  color:#b1b0b0;
  outline:none;
  text-decoration:none;
  cursor:pointer;
}
a:hover{
  color:#6ba0c6;
  text-decoration:none;
}

.button{
  display:inline-block;
  padding:11px 13px 12px 15px;
  margin: 0 0 0 0;
  font-size: 16px;
  line-height: 19px;
  color:#ffffff;
  background: #000;
  font-weight: 300;
  text-transform: uppercase;
 }
.button span{background: url('../images/arrow_btn.png') no-repeat;display: inline-block;width: 6px;height: 11px;margin: 4px 0 0 13px;}
.button:hover{
  background:#5a99c4;
  color:#fff;
}

.but_wrap{padding-top: 35px;}

.link1{color: #ACD232;text-decoration: underline;}
/*********************************Displays*************************************/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*********************************header*************************************/

header {background: #fff;padding: 15px 0 ;}
header h1{padding-right: 2px;}
header h1 a {
  display:block;
  width:215px;
  margin: 0 auto;
  height:87px;
  background:url(../images/logo.png) 0 0 no-repeat;
  text-decoration:none;
  text-indent:-9999px;
}

.social{
  right: 120px;
  top: 13px;
  position: absolute;
  overflow:hidden;
}
.social a{
  display:block;
  float:left;
  width:32px;
  height:32px;
  overflow:hidden;
  margin-left:25px;
}
.social a:first-child{margin: 0 0 0 0;}
.social a:hover img{
  margin-top:-32px;
}

/*================================>> Slider <<========================================*/
.slider_box{background: #ACD232;min-height: 5px;}

/*********************************content*************************************/
#content {padding:41px 0px 50px; background: #f9f9f9;}
.cont_pad{padding:0 0 50px !important;}

/*===============================>> Paragraphs <<=============================*/

p {margin-bottom:22px}

/*================================>> LISTS <<========================================*/
.list1{}
.list1 li{
  background:url(../images/marker1.png) 2px 8px no-repeat;
  padding-left:21px;
  margin-top: 8px;
}
.list1 li:first-child{margin-top: 0;}
.list1 a{color: #ACD232;}
.list1 a:hover{color: #000;}

/*================================>> H <<========================================*/
h2,h3,h4{
  font-weight:normal;
}
h2{
  font-size: 30px;
  line-height: 36px;
  color:#ACD232;
  font-weight: 300;
}

h2.ind{ margin-bottom:24px;}
h2.ind1{ margin-bottom:27px;}
h2.ind2{ margin-bottom:21px;}
h2.ind3{ margin-bottom:18px;}
h2.ind4{ margin-bottom:17px;}

h3, h3 a{
  font-size: 14px;
  line-height: 19px;
  color:#4c4c4c;
  text-transform: uppercase;
  margin-bottom: 2px;
}
/*================================>> GOOGLE FONTS  <<========================================*/
.sf-menu a, #search input, #carousel, .title, h2, .f_menu{font-family: 'Open Sans', sans-serif;}
#carousel .font2, .button{font-family: 'Open Sans Condensed', sans-serif;}
/*================================>> hovers <<========================================*/
{-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_list{
  list-style: none;
}
.offer_list li{
  float: left;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  position: relative;
  width: 202px;
  text-align: center;
  margin-left: 36px;
}
.offer_list .title{letter-spacing: -1px;font-size: 18px;line-height: 22px;margin-top: -8px;color: #5a99c4;}
.offer_list li.first{margin-left: 0;}
.offer_list li .inner{padding: 19px 0 14px 19px;}
.offer_list li:after, .offer_list li:before{
  display: block;
  position: absolute;
  top: -1px;
  height: 152px;
  content: "";
}
.offer_list li:after{width: 30px;right: -28px;background: url('../images/offer_after.png') no-repeat;}
.offer_list li:before{width: 27px;left: -26px;background: url('../images/offer_before.png') no-repeat;}
.offer_list li.last_item:after, .offer_list li.first:before{display: none;}
.offer_list li.last_item{width: 218px;}
.offer_list li.last_item .inner{padding-left: 10px;}

.m_bot1{margin-bottom: 41px;}
.m_bot2{margin-bottom: 44px;}
.m_bot3{margin-bottom: 34px;}
.m_bot4{margin-bottom: 50px;}

.f_18, .f_18 a{color: #4c4c4c;font-size: 18px;line-height: 24px;}
.f_18{margin-bottom: 25px;}
.f_18 a:hover{color: #8a8a8a;}
.box1{}
.box1>div{}
.box1>figure{
	margin: 4px 23px 0 0;
}

.box2>figure{
	margin: 2px 21px 0 0;
}

.news_list{background: #fff;position: relative;border: 1px solid #e5e5e5;padding-bottom: 2px;margin-bottom: -3px;}
.news_list:after{display: block;width: 100%;height: 6px;position: absolute;bottom: -6px;left: 0;background: url('../images/news_shadow.png') no-repeat;content: "";}
.news_list>li{border-top: 1px solid #e5e5e5;padding: 9px 15px 9px 0 ;}
.news_list>li:hover{background: #f9f9f9;}
.news_list>li:first-child{border: none;}
.news_list>li>div{}
.news_list>li>figure{
	padding: 12px 0 0;
  width: 59px;
  text-align: center;
  font-size: 20px;
  line-height: 24px;
  color: #6ba0c6;
}
.news_list>li>figure span{margin-top: -3px;display: block;font-size: 12px;text-transform: uppercase;}
/*********************************page_2*************************************/
.testimonials li{margin-top: 17px;}
.testimonials li:first-child{margin: 0;}
.testimonials .author1{padding-top: 23px;margin: 0;}

.staff figure{margin-bottom: 15px;}

.choose{}
.choose>div{}
.choose>figure{
	margin: 1px 20px 0 0;
  background: #c1c1c1;
  height: 46px;
  border-radius: 500px;
  width: 60px;
  text-align: center;
  padding: 14px 0 0;
}

/*********************************page_3*************************************/
.feat{}
.feat figure{margin-bottom: 12px;}
.feat .f_18{margin-bottom: 1px;}

.work_list{padding-top: 1px;}
.work_list>li{margin-top: 20px;}
.work_list>li:first-child{margin-top: 0;}

.box3>figure{margin: 5px 20px 0 0;}
/*********************************page_4*************************************/

.project figure{margin-bottom: 13px;}
.project .f_18{margin-bottom: 1px;}


/*********************************page_5*************************************/

.blog_info{margin-bottom: 16px;}
.blog_info>div{}
.blog_info>figure{
  width: 45px;
  text-align: center;
  font-size: 20px;
  line-height: 24px;
  color: #6ba0c6;
}

.blog_list{padding-right: 60px;}
.blog_list>li{margin-top: 26px;}
.blog_list>li:first-child{margin-top: 0;}


.blog_info .f_18{margin-bottom: 1px;}
.blog_info figure span{margin-top: -3px;display: block;font-size: 12px;text-transform: uppercase;}
.img_box{margin-bottom: 13px;}

.res_posts li{margin-top: 22px;}
.res_posts li:first-child{margin-top: 0;}


/* Contact form */
#contact-form {
  padding:0px 0 0 0;
  position: relative;
}
#contact-form .success
{
  display: block;
  position: absolute;
  width: 100%;
  top: 0;
  left:0;
  z-index: 99;
  background: #4b84bb;
  text-align: center;
  padding: 20px 0;
  color: #fff;
}
#contact-form textarea, #contact-form input {
  margin:0;
  font-size:14px;
  border:1px solid #e6e6e6;
  color:#b1b0b0;
  border-radius: 4px;
  padding:9px 20px 10px;
  outline:none;
  position:relative;
  font-family:Arial, Helvetica, sans-serif;
  background:#fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow: 1px 1px 0 #fff;
}
#contact-form input {
  width:219px;
}
#contact-form textarea {
  overflow:auto;
  width: 100%;
  height:247px;
  resize:none;
  float:left;
  margin: 0 0 0 0;
}
  
#contact-form label {
  display:inline-block;
  position: relative;
  min-height:57px;
  overflow:hidden;
 }
#contact-form label.message {
  display:block;
  padding-bottom:0;
}
#contact-form .button {
  margin-left:8px;
}
#contact-form .error, #contact-form .empty, #contact-form .success {display:none;}
#contact-form .error, #contact-form .empty {
  text-align:left;
  color:red;
  font-size:11px;
  position: absolute;
  right: 10px;
  top: 5px;
}
#contact-form .buttons2 {
  overflow:hidden;
  text-align:right;
  position:relative;
  clear:both;
  padding-top:32px;
}
#contact-form .buttons2 a {
	cursor:pointer;
	margin-top:0;
	text-align:center;
}

.map_wrapper{
  overflow:hidden;
  display:block;
  margin-bottom:14px;
}
#map_canvas {
   width:100%;
   height:273px;
}
.adress{}
.adress span{
  display:inline-block;
  width:82px;
}

.demo{color: #5d96c5;}
.demo:hover{ text-decoration:underline;}

/*================================>> Aside <<========================================*/
aside{
  background: #c7cbd0;
  padding: 15px 0;
}

.brands_list{
  overflow: hidden;
}
.brands_list li{
  float: left;
  border-right: 1px solid #a3a5a7;
  text-align: center;
  width: 234px;
  padding:  19px 0 0px ;
  height: 69px;
}
.brands_list li:first-child{width: 233px;border-left: 1px solid #a3a5a7;}

/****************************footer************************/
footer {
  padding:38px 0;
}
.privacy{font-size: 12px;float: left;}
.privacy span{display: inline-block;margin-top:7px;}
footer, footer a{color: #f9f9f9;}
footer a:hover{color: #000;}

.f_menu{float: right;padding:  5px 0;font-weight: 300;}
.f_menu li{float: left;border-left: 1px solid #ced0d4;padding-left: 16px;margin-left: 16px;}
.f_menu li:first-child{border: none;}
.f_menu li a{font-size: 14px;line-height: 22px;color: #fff;}
.f_menu li a:hover, .f_menu li.current a{color: #000;}


/*==================================RESPONSIVE LAYOUTS===============================================*/
@media only screen and (max-width: 995px) {
 body{min-width:768px;}
 .social{display: none;}
#carousel .slides > li{width: 249px !important;}
#carousel .slides > li .font1{font-size: 16px;}
.offer_list li.last_item, .offer_list li{width: 158px;}
.offer_list li .inner{padding-left: 5px;}
.offer_list li.last_item .inner{padding-left: 0;}
.box1 div, .box2 div, .box3 div{overflow: visible;}
.brands_list li{width: 184px !important;}
.f_menu li{padding-left: 10px;margin-left: 10px;}
.blog_list{padding-right: 0;}
#contact-form input{width: 100%;}
#contact-form label{display: block;margin-bottom: -24px;}
#slider .flex-direction-nav .flex-next {right: -19px; }
#slider .flex-direction-nav .flex-prev {left: -15px;}
}

@media only screen and (max-width: 767px) {
 body{min-width:420px;}
 #carousel{display: none;}
 .offer_list li:after, .offer_list li:before{display: none;}
 .offer_list li{width: auto !important;float: none;margin: 15px 0 0px;}
 .box1>figure, .box2>figure, .box3>figure{float: none;margin: 0 0 15px;}
 .box1 img, .staff img, .box2 img, .feat img, .box3 img, .project img, .blog_list img{width: 100%;}
 .brands_list li, .brands_list li:first-child{float: none;padding: 0;margin: 0;width: auto !important;border: none;}
 .privacy, .f_menu{float: none;}
.f_menu{display: none;}
#slider .flex-direction-nav a{top: 23%;}
}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
}