html{height: 100%;width: 100%;}
body{margin: 0; font-family: 'Source Sans Pro', sans-serif;float: left;width: 100%;height: 100%; color:#fff;background:#fff;}
strong{font-weight:900;}
.container{float:left;width:100%;}
.wrapper{max-width:1200px;width:100%;margin: 0 auto;}
/*header*/
#head{background:rgba(0,0,0,0.5);font-size:16px;position:absolute;top:0;z-index: 100;}
#head .logo{float: left;margin: 15px 0;color: #fff;text-transform: uppercase;width:20%;}
#head .logo img{width:100%;}
#head .logo span{font-weight:300;}
#head .menu{float:right;width:80%;color:#fff;text-transform:uppercase;line-height: 80px;max-height: 80px;}
#head .menu label{display:none;}
#head .menu input{position:absolute;left:-9999px;top:-9999px;}
#head .menu ul{float: left;width: 100%;margin: 0;padding: 0;}
#head .menu ul li{float:left;padding:0 1.8%;list-style:none;}
#head .menu ul li a{text-decoration:none;color:#fff;padding-bottom: 5px;}
#head .menu ul li:nth-child(1) a{border-bottom: 2px solid #41B0E4;}
#head .menu ul li:nth-child(2) a{border-bottom: 2px solid #E62F36;}
#head .menu ul li:nth-child(3) a{border-bottom: 2px solid #EAB631;}
#head .menu ul li:nth-child(4) a{border-bottom: 2px solid #A571B0;}
#head .menu ul li:nth-child(5) a{border-bottom: 2px solid #41B0E4;}
#head .menu ul li:nth-child(6) a{border-bottom: 2px solid #EAB631;}
#head .menu ul li:nth-child(7) a{border-bottom: 2px solid #A571B0;}
#head .menu ul li:nth-child(8) a{border-bottom: 2px solid #E62F36;}
#head .menu ul li a.selected{}
#head .menu ul li a.dropdown{background:rgba(0,0,0,0.5)000;float:left;width:100%;float:left;text-align:center;line-height:40px;padding-bottom:0;}
#head .menu ul li .dropdowns{display:none;position:absolute;width: 150px;margin-left: -35px;}
#head .menu ul li:hover .dropdowns{display:block;}
.flipbook{margin-bottom:10px;}
/*home*/
.flexslider .slides li h2{float: right;margin-top: 550px;font-size: 80px;text-transform:uppercase;text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.9);line-height:70px;}
.flexslider {height:720px;}
.flexslider .slides li{height:720px !important;}
#yellow_bar{background:#EAB631;}
#yellow_bar ul{margin: 0;width: 100%;padding: 0;}
#yellow_bar li{list-style: none;width: calc(100%/7);width: -moz-calc(100%/7);width: -webkit-calc(100%/7);float: left;text-align: center;padding:20px 0;}
#yellow_bar li:hover{background: rgba(0,0,0,0.1);}
#yellow_bar li img{width: 90%;padding-bottom: 10px;}
#yellow_bar li .text{text-decoration:none;color:#fff;}
#yellow_bar a {text-decoration: none;}
#home .left{width:65%;float:left;}
#home .right{width:28%;float:right;text-align: center;}
#home .right img{max-width:100%;}
#home .main{margin:50px 0;width:73%;}
#home .news{margin:50px 0;width:20%; float:right; background:#EAB631; padding:1%; border-radius:5px; color: #fff;}
#home .news h3{font-size:24px; border-bottom:1px solid #fff; padding-bottom:5px;}
#home .news a {text-decoration:none;color: #fff;}
#home .main a{float: right;color: #fff;background: #41B0E4;text-decoration: none;text-transform: uppercase;padding: 10px 20px;}
#home .main h2{text-align:center;}


/*footer*/
#footer1{background: #ECECEC;}
#footer1 ul{margin-top: -25px;margin-bottom: 20px;float: left;width: 98%;padding: 1%;}
#footer1 li {width: 25%;float: left;list-style: none;}
#footer1 li img {float: left;width: 30%;}
#footer1 li .text {float: right;width: 65%;margin-top: 20px;line-height: 40px;font-size: 20px;color: #4d4d4d;}
#footer1 li .text strong{font-weight:900;font-size: 26px;}
#footer2{text-align: center;background: #EAB631;padding: 20px 0;}
#footer2 .logo{margin-top: -55px;float: right;width: 200px;}
#footer2 .links a{text-decoration:none;color:#fff;}
#footer2 .kaebel{margin-top: 10px;}
#footer2 .zimple{}

/*products*/
#products .image{float:left;margin-top:10px;margin-right:10px;width:calc((100% - 30px)/4);height:300px;}
#products .image a{float: left;width: 100%;height: 100%;background: rgba(0,0,0,0.5);color: #fff;opacity:1;}
#products .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;}
#products .image:hover a{opacity:0;}
#products .image:nth-child(4n+0){margin-right:0px;}
#products .main{margin-bottom:30px;}

/*inner head*/
#inner_head{background: url(../images/Banner2.jpg) no-repeat center center;background-size: cover !important;height: 300px;}
#inner_head h2{color: #fff;font-size: 80px;margin: 221px 0 0 0;text-transform: uppercase;opacity:0.7;}

/*inner*/
.main{float:left;width:100%;}
.main h2{margin-top:0;margin-bottom: 20px;color:#4D4D4D;text-transform: uppercase;font-size: 30px;font-weight:normal;}
.main h2 span{color:#BBB;text-transform: none;font-size: 12px;}
.main p{color:#BBB;font-weight: 300;color:#4D4D4D;}


/*about*/
#about .main a.more{float: right;color: #fff;background: #41B0E4;text-decoration: none;text-transform: uppercase;padding: 10px 20px;}
#about .main{margin-bottom: 50px;padding: 0;width: 100%;}
#about .white {float:left;width:100%;padding: 30px 0;}
#about .white .text {float:left;width:65%;}
#about .white .image {float:right;width:28%;text-align: center;}
#about .image img{max-width:100%}
#about .white .text a {float:left;}
#about .grey {float:left;width:100%;padding: 30px 0;background:#ECECEC;}
#about .grey .text {float:right;width:65%;}
#about .grey .image {float:left;width:28%;text-align: center;}
#about .button{
    float: left;
    color: #fff;
    background: #41B0E4;
    text-decoration: none;
    text-transform: uppercase;
    padding: 10px 20px;
}
#about h2{border-bottom: 2px solid #ddd;line-height: 50px;padding-bottom: 5px;}
#about ul{list-style:disc;color:#4d4d4d;font-weight:300;}
#about #chart{background:#fff;border:1px solid #4d4d4d;color:#4d4d4d;border-radius:5px;}
#about .news{float:left;width:calc((100% - 80px)/3);width:calc((100% - 80px)/3);width:calc((100% - 80px)/3);margin-right:40px;margin-top:40px;position: relative;}
#about .news:nth-child(3n+3){margin-right:0px;}
#about .news a.more{float:left;margin-top:20px;}
#about .news h2{font-weight: bold;font-size: 26px;text-transform: none;border:none;padding:0;margin-top: 0.73em;margin-bottom:0.73em;line-height:22px;float:left;width:100%;color:#41B0E4;}
#about .news .image{background-size:cover;background-position:center center;float:left;width:100%;height:387px;}
#about .news .text{float:left;width:100%;height: 140px;overflow: hidden;}
#about .news big{font-size:16px;}
#about .news .date{position: absolute;top: -20px;right: -20px;text-align: center;border-radius: 50%;width: 120px;height: 120px;background:#41B0E4;}
#about .news .date table{width: 100%;height: 100%;border-spacing: 0;}
#about .news .date table span{font-weight:bold;font-size:18px;}
#about .news .date table span.num{font-size:50px;line-height: 40px;}

/*custom*/
#custom .main a{float: right;color: #fff;background: #41B0E4;text-decoration: none;text-transform: uppercase;padding: 10px 20px;}
#custom .main{margin-bottom: 50px;padding: 0;width: 100%;}
#custom .white {float:left;width:100%;padding: 30px 0;}
#custom .white .text {float:left;width:34%;}
#custom .white .image {float:right;width:64%;text-align: center;}
#custom .image img{max-height:250px;}
#custom .white .text a {float:left;}
#custom .grey {float:left;width:100%;padding: 30px 0;background:#ECECEC;}
#custom .grey .text {float:right;width:34%;}
#custom .grey .image {float:left;width:64%;text-align: center;}
#custom h2{margin-top: 100px;padding:0;}


/*products*/
#detail .main a{float: right;color: #fff;background: #41B0E4;text-decoration: none;text-transform: uppercase;padding: 10px 20px;margin-top: 22px;}
#detail .main a.default{color:#0000EE;background:none;text-decoration: underline ;text-transform: uppercase;padding:0px;margin-top: 0px;}
#detail .main{margin:40px 0 60px 0;}
#detail .text{width:55%;float:left;}
#detail .text a{float:left;}
#detail .text img{float:left;width: 60px;}
#detail .image{width:43%;float:right;text-align:center;height:300px;}
#detail .image img{max-width:100%;}
#detail_images{padding:50px 0;border-top: 1px solid #eee;}
#detail_images .image{float:left;margin-top:10px;margin-right:10px;width:calc((1200px - 30px)/4);height:250px;}
#detail_images .image a{float: left;width: 100%;height: 100%;}
#detail_images .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;}
#detail_images .nav{width: 25px;position: absolute;margin-top: 115px;cursor:pointer;}
#detail_images .left{margin-left: calc(50% - 635px);}
#detail_images .right{margin-left: 10px;}
#detail_images{margin-left:0;}
#detail_data{padding:50px 0;border-top: 1px solid #eee;}
#detail_data .image{float:left;margin-top:10px;margin-right:10px;width:calc((1200px - 38px)/4);height:250px;border: 1px solid #ddd;}
#detail_data .image a{float: left;width: 100%;height: 100%;}
#detail_data .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;opacity:0;}
#detail_data .image table:hover{opacity:1;}
#detail_data .nav{width: 25px;position: absolute;margin-top: 115px;cursor:pointer;}
#detail_data .left{margin-left: calc(50% - 635px);}
#detail_data .right{margin-left: 10px;}
#detail_data{margin-left:0;}
#detail_data table{width:100%;float:left;height:100%;background:rgba(0,0,0,0.3);text-align:center;text-decoration:none;color:#fff;}
#colour_images{padding:50px 0;border-top: 1px solid #eee;}
#colour_images .image{float:left;margin-top:10px;margin-right:10px;width:calc((1200px - 30px)/4);height:250px;}
#colour_images .image a{float: left;width: 100%;height: 100%;}
#colour_images .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;}
#colour_images .nav{width: 25px;position: absolute;margin-top: 115px;cursor:pointer;}
#colour_images .left{margin-left: calc(50% - 635px);}
#colour_images .right{margin-left: 10px;}
#colour_images{margin-left:0;}
#attach_images{padding:50px 0;border-top: 1px solid #eee;}
#attach_images .image{float:left;margin-top:10px;margin-right:10px;width:calc((1200px - 30px)/4);height:250px;}
#attach_images .image a{float: left;width: 100%;height: 100%;}
#attach_images .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;}
#attach_images .nav{width: 25px;position: absolute;margin-top: 115px;cursor:pointer;}
#attach_images .left{margin-left: calc(50% - 635px);}
#attach_images .right{margin-left: 10px;}
#attach_images{margin-left:0;}

/*contact*/
#contact .main a{float: right;color: #fff;background: #41B0E4;text-decoration: none;text-transform: uppercase;padding: 10px 20px;}
#contact .main{margin:40px 0 60px 0;}
#contact h2{border-bottom: 2px solid #ddd;}
#contact .left{float:left;width:48%;}
#contact .left p{margin-bottom:50px;}
#contact .right{float:right;width:48%;}
#contact .inpt{float:left;width:100%;}
#contact label{float:left;width:24%;color:#4D4D4D;font-weight: 900;}
#contact strong{color:#4D4D4D;font-weight: 900;}
#contact input{float:right;width:74%;padding:1%;background:#E3E3E3;border:0;margin-bottom:20px;color:#4D4D4D;}
#contact textarea{float:right;width:74%;padding:1%;background:#E3E3E3;border:0;margin-bottom:20px;height: 162px;color:#4D4D4D;}
#contact input[type="submit"]{float:right;text-decoration:none;color:#fff;background:#41B0E4;text-transform: uppercase;padding: 10px 20px;font-family: 'Source Sans Pro', sans-serif;width: auto;cursor:pointer;}
#contact iframe{width:100%;height: 305px;}

/*gallery*/

#gallery .main{margin:40px 0 60px 0;}
#gallery h2{border-bottom: 2px solid #ddd;}
#gallery img{width: 23%;margin-right: 1.5%;margin-top:20px;}
#gallery .box{width:calc(((100% - 45px)/4) - 8px);height:250px;float:left;margin-right:10px;margin-bottom:10px;padding:2px;border: 2px solid #ddd;}
#gallery .fancybox:nth-child(4n+4) .box{margin-right:0;}
#gallery .image{float:left;margin-top:10px;margin-right:10px;width:calc((1200px - 48px)/4);height:250px;border: 1px solid #ddd;}
#gallery .image a{float: left;width: 100%;height: 100%;}
#gallery .image table{float: left;width: 100%;height: 100%;text-align: center;text-transform: uppercase;font-size: 30px;opacity:0;}

/*responsive*/
@media (max-width: 1300px) {
  #detail_images .left{margin-left: 25px;}
  #detail_images .right{margin-left: -30px;}
  #detail_data .left{margin-left: 25px;}
  #detail_data .right{margin-left: -30px;}
  #attach_images .left{margin-left: 25px;}
  #attach_images .right{margin-left: -30px;}
  #colour_images .left{margin-left: 25px;}
  #colour_images .right{margin-left: -30px;}
}
@media (max-width: 1250px) {
  #about.newses .wrapper{width:96%;padding:0 2%;}
}
@media (max-width: 1200px) {
  #head{font-size:16px;}
  #head .logo{padding-left: 2%;}
  #footer .logo{padding-right: 2%;}
  #head .menu{width:78%;}
  #home h1{padding:0 20px;}
  #inner_head h2{padding-left:20px;}
  #inner_head2 h2{padding-left:20px;}
  .main{padding:0 2%;width:96%;}
  #footer2 .logo {margin-right: 20px;}
  .flexslider .slides li h2 {margin-right: 20px;}
  #about .white{width: 96%;padding: 30px 2%;}
  #about .grey{width: 96%;padding: 30px 2%;}
  #head .menu{line-height: 20px;font-size: 20px;margin-top: 10px;max-height: inherit;}
  #head .menu ul{display:none;margin-left:20px;background:#EAB631;padding-bottom: 20px;}
  #head .menu label{display:block;margin-left: 20px;padding: 2%;background: #EAB631;cursor:pointer;}
  #head .menu input[type=checkbox]:checked ~ ul {display: block;}
  #head .menu ul li{width:100%;margin-top: 10px;}
  #head .menu ul li a{border-bottom:none !important;}
  #head .menu ul li .dropdowns{display: none !important;}
  .wrapper{width:96%;}
}
@media (max-width: 1130px) {
  #footer .menu{font-size:16px;width:80%;}
}
@media (max-width: 1080px) {
  #home .click a{width:70%;margin-left:15%;}
}
@media (max-width: 1023px) {
  #about .news{width:calc((100% - 40px)/2);width:calc((100% - 40px)/2);width:calc((100% - 40px)/2);}
  #about .news:nth-child(3n+3){margin-right:40px;}
  #about .news:nth-child(2n+2){margin-right:0px;}
}
@media (max-width: 1020px) {
  #footer2 {text-align: left;}
  #footer2 .kaebel{margin-left: 20px;}
  #footer2 .links{margin-left: 20px;}
}
@media (max-width: 1000px) {
  #gallery .box{width:calc((100% - 20px)/3);}
  #gallery .fancybox:nth-child(3n+3) .box{margin-right:0;}
  #gallery .fancybox:nth-child(4n+4) .box{margin-right:inherit;}
}
@media (max-width: 960px) {
   #footer1 ul li {display:none;width:auto;}
   #footer1 ul li:nth-child(2){display:block;}
}
@media (max-width: 900px) {
  #gallery img{width:48%;}
}
@media (max-width: 880px) {
  #home .click a{width:80%;margin-left:10%;}
}
@media (max-width: 850px) {
  #contact .label{width:30%;}
  #contact input{width:68%;}
  #contact textarea{width:68%;}
  #footer2 .logo{margin-top:-35px;}
}
@media (max-width: 810px) {
  #home h1{font-size:60px;}
}
@media (max-width: 800px) {
  #gallery .box{width:calc((100% - 10px)/2);}
  #gallery .fancybox:nth-child(2n+2) .box{margin-right:0;}
  #gallery .fancybox:nth-child(3n+3) .box{margin-right:inherit;}
  #gallery .fancybox:nth-child(4n+4) .box{margin-right:inherit;}
}
@media (max-width: 790px) {
  #footer .menu{display:none;}
  #footer .logo{padding: 15px 2% 10px 0;margin-top:0;}
}
@media (max-width: 780px) {
   #home .click a{width: 100%;margin-left: 0;padding: 32px 0px 35px 0px;}
}
@media (max-width: 767px) {
  #about .news{width:100%;margin-right:0px !important;}
  #home .main{width:96%; margin-bottom:0px;}
  #home .news{width:98%;}
}
@media (max-width: 700px) {
  #home .click a{padding: 15px 0px 35px 0px;}
  #home .right{display:none;}
  #home .left{width:100%;}
  #about .image{display:none;}
  #about .news .image{display:block;}
  #about .text{width:100% !important;}
  #detail .image{width:100%;float:left;margin-top: 30px;}
  #detail .text{width:100% !important;}
}
@media (max-width: 675px) {
  #contact .left{width:100%;}
  #contact .right{float:left;width:100%;}
  .flexslider .slides li h2{display:none;}
  .flexslider{height:auto;}
}
@media (max-width: 620px) {
  #home h1{font-size:50px;}
  #home .click a{font-size:50px;}
  #footer2 .logo{margin-top:10px;margin-left:20px;float:left;}
}
@media (max-width: 540px) {
  #home .click a{font-size:40px;}
}
@media (max-width: 500px) {
  #gallery img{width: 100%;margin-right: 0;}
}
@media (max-width: 450px) {
  #home .click a{font-size:30px;}
}
@media (max-width: 420px) {
  #head .menu{margin-top:15px;}
}
@media (max-width: 400px) {
  #gallery .box{width:100%;}
  #gallery .fancybox .box{margin-right:0 !important;}
}
@media (max-width: 350px) {
  #home .click a{padding: 10px 0px 35px 0px;}
}