/* ============================= banner ====================== */
#banner_wrapper{ position: relative; padding-top: 0px; padding-bottom: 0px;}

.banner_title{}

#banner{position: relative; padding-bottom: 0px; padding-top: 0px; }

.banner_prev{display: block; width: 25px; height: 42px; position: absolute; left: -29px; top: 50%; margin-top: -21px; z-index: 0;}
.banner_prev .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/prev2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_prev:hover .over1{opacity: 1; filter: alpha(opacity=100);}

.banner_next{display: block; width: 25px; height: 42px; position: absolute; right: -29px; top: 50%; margin-top: -21px; z-index: 0;}
.banner_next .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/next2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_next:hover .over1{opacity: 1; filter: alpha(opacity=100);}

.banner_prev1{display: block; width: 25px; height: 42px; position: absolute; left: -29px; top: 50%; margin-top: -21px; z-index: 0;}
.banner_prev1 .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/prev2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_prev1:hover .over1{opacity: 1; filter: alpha(opacity=100);}

.banner_next1{display: block; width: 25px; height: 42px; position: absolute; right: -29px; top: 50%; margin-top: -21px; z-index: 0;}
.banner_next1 .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/next2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_next1:hover .over1{opacity: 1; filter: alpha(opacity=100);}


.banner_prev2{display: block; width: 25px; height: 42px; position: absolute; left: -9px; top: 50%; margin-top: -21px; z-index: 100;}
.banner_prev2 .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/prev2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_prev2:hover .over1{opacity: 1; filter: alpha(opacity=100);}

.banner_next2{display: block; width: 25px; height: 42px; position: absolute; right: -9px; top: 50%; margin-top: -21px; z-index: 100;}
.banner_next2 .over1{display: block; width: 100%; height: 100%; position: absolute; background: url(../images/next2.png) left top no-repeat;opacity: 0.2; filter: alpha(opacity=20);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner_next2:hover .over1{opacity: 1; filter: alpha(opacity=100);}




#banner .carousel-box{position: relative;}
#banner .carousel-box .inner{position: relative; overflow: hidden; max-width: none; margin: 0;}
#banner .carousel.main{position: relative; overflow: hidden; margin: 0; padding: 0;margin-right: -30px; }
#banner .carousel.main1{position: relative; overflow: hidden; margin: 0; padding: 0;margin-right: -30px; }
#banner .carousel.main2{position: relative; overflow: hidden; margin: 0; padding: 0;margin-right: -30px; }
#banner .caroufredsel_wrapper{padding: 0; margin: 0;}
#banner .caroufredsel_wrapper ul{padding: 0; margin: 0;}
#banner .carousel-box ul li { float:left; display: inline-block; padding:0px 0px 0px 0px; position:relative; width:300px; overflow:hidden; padding-right:30px }

.banner{ border-radius:10px;}
.banner .banner_inner{ background: none repeat scroll 0 0 #eaeaea;
    border-radius: 10px;}
.banner .banner_inner a{display: block; text-decoration: none; position: relative; background: none; padding: 0px; text-align: left;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a:hover{  }
.banner .banner_inner a .txt1{font-family: 'Roboto Condensed'; font-weight: 700; font-size: 20px; line-height: 48px; color: #3bc1ff; text-transform: uppercase; padding-bottom: 2px; text-align:center;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a:hover .txt1{}
.banner .banner_inner a figure{margin: 0; padding: 0px; position: relative; border: none; padding: 0px; background: none; border-radius:0px; -moz-border-radius:0px; -webkit-border-radius:0px;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a:hover figure{}
.banner .banner_inner a figure .img{width: 100%;}
.banner .banner_inner a figure em{position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 2; background: none; opacity: 0; filter: alpha(opacity=0);
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a figure:hover .img{opacity:0.4;}
.banner .banner_inner a:hover figure em{opacity: 1; filter: alpha(opacity=100);}
.banner .banner_inner a .caption{background: #eaeaea; padding: 20px 9px 0px 15px; border: 1px solid #e1e1e1; border-top: none;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;  border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; 
}
.banner .banner_inner a:hover .caption{background: #fff;}
.banner .banner_inner a .caption .txt2{color: #201f1e; font-weight: 700; text-transform: uppercase; padding-bottom: 5px;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a:hover .caption .txt2{}
.banner .banner_inner a .caption .txt3{color: #858585; padding-bottom: 30px;
transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;
}
.banner .banner_inner a:hover .caption .txt3{}
.banner .banner_inner a .caption .txt4{   background: url("../images/bg-read-more.png") no-repeat scroll 50% 0 rgba(0, 0, 0, 0);
    display: block;
    float: none;
    font-family: 'Open Sans';
    font-size: 16px;
    height: 51px;
    line-height: 44px;
    margin: 0 auto 7px;
    transition: none 0s ease 0s ;
}
.banner .banner_inner a:hover .caption .txt4{ background: url(../images/bg-read-more.png) 50% bottom no-repeat;
  color:#fff;}
/* ============================= banner end ====================== */


/* Default landscape and desktop to large desktop */
@media (max-width: 1219px) {
  #banner{padding-bottom: 70px;}

  .banner_prev{left: 50%; margin-left: -40px; top: auto; bottom: 0; margin-top: 0;}
  .banner_next{right: 50%; margin-right: -40px; top: auto; bottom: 0; margin-top: 0;}
  .banner_prev1{left: 50%; margin-left: -40px; top: auto; bottom: 0; margin-top: 0;}
  .banner_next1{right: 50%; margin-right: -40px; top: auto; bottom: 0; margin-top: 0;}
  .banner_prev2{left: 50%; margin-left: -40px; top: auto; bottom: 0; margin-top: 0;}
  .banner_next2{right: 50%; margin-right: -40px; top: auto; bottom: 0; margin-top: 0;}
}


/* Landscape phone to portrait tablet */