@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');

a:hover {text-decoration:none; transition:all ease 0.5s; outline:none;}

.scrollable-menu { height: auto; max-height: 400px; overflow-x: hidden; }

a:focus {text-decoration:none; transition:all ease 0.5s; outline:none;}

a:focus, a:hover {text-decoration:none; transition:all ease 0.5s; outline:none;}

body {font-family: 'Roboto', sans-serif;}

.header-top {width:100%; background-color:#5cc6d0;}

.header-top p {font-size:17px; color:#FFFFFF; margin:13px 8px 13px 0px; float:left;}

.header-top p a {color:#FFFFFF;}

.header-top p a:hover {color:#000000;} 

.header-top p i {margin-right:5px; color:#FFFFFF;}

.header-top .social-icon{margin:5px 0px 0px;float:right;}

.header-top .facebook{display:inline;padding-left:7px;}

.header-top .facebook a{text-align:center;vertical-align:middle;display:inline-block;color:#FFF;background-color:transparent;transition:all ease .3s; font-size:30px;}

.header-top .facebook a:hover{color:#3b5998;}

.header-top .twitter{display:inline;padding-left:7px;}

.header-top .twitter a{text-align:center;vertical-align:middle;display:inline-block;color:#FFF;background-color:transparent;transition:all ease .3s; font-size:30px;}

.header-top .twitter a:hover{color:#00aced;}

.header-top .google{display:inline;padding-left:7px;}

.header-top .google a{text-align:center;vertical-align:middle;display:inline-block;color:#FFF;background-color:transparent;transition:all ease .3s; font-size:30px;}

.header-top .google a:hover{color:#dd4b39;}

.header-top .youtube{display:inline;padding-left:7px;}

.header-top .youtube a{text-align:center;vertical-align:middle;display:inline-block;color:#FFF;background-color:transparent;transition:all ease .3s; font-size:30px;}

.header-top .youtube a:hover{color:#bb0000;}

.fixed-header {position: fixed; top: 0; left: 0; width: 100%; background-color:#f5f5f5;}

.header {width:100%; background-color:#FFFFFF; postion: fixed; z-index:999; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black;}

.header .navbar-default {margin:0px; background-color:transparent; border:none; float:right; padding:15px 0px 15px 0px; width:100%;}

.header .navbar-default .navbar-nav > li > a {font-size:18px; color:#373435; background-color:transparent; border:0px; padding:20px 15px 20px 15px; line-height:30px; border-right:1px solid #bbbbbb;}

.header .navbar-default .navbar-nav > li > a.last{border:none;}

.header .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {color:#5cc6d0; background-color:transparent;}

.header .navbar-right {margin-right:-38px;}

.header .navbar-brand {padding:0px; height:auto;}

.header .caret-up {width: 0; height: 0; border-left: 4px solid rgba(0, 0, 0, 0); border-right: 4px solid rgba(0, 0, 0, 0); border-bottom: 4px solid; display: inline-block; margin-left: 2px; vertical-align: middle;}

.header .dropdown-menu {background-color:#5cc6d0;}

.header .dropdown-menu > li > a {color:#FFFFFF; padding:6px 20px;}

.header .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {background-color:#71d0f6; color:#000000;}

.header .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {background-color:#5cc6d0; color:#FFFFFF;}

.header .dropdown-menu {padding:0px; border-radius:0px;}

.banner {width:100%;}

.welcome {width:100%; padding:30px 0px 30px;}

.welcome .box {padding:20px 20px 20px; text-align:justify; margin:10px 0px 10px; border:2px solid #5cc6d0;}

.welcome .box h1 {font-size:36px; color:#000000; font-weight:300; margin:0px 0px 20px;}

.welcome .box h1 span {color:#5cc6d0; font-weight:500;}

.welcome .box p {color:#717171; font-size:16px; text-align:justify; margin:10px 0px 10px; line-height:24px;}

.count {width:100%; background-color:#f2f3f5; padding-top:50px;}

.count .icone-box {width:100%; text-align:center; margin:0 auto; color:#5cc6d0;}

.count .icone-box .fa {font-size:80px;} 

.count .icone-box .fa-plus {font-size:20px;}

.count h4 {font-size:24px; font-weight:600; color:#71d0f6;}

.count p {font-size:16px; width:70%; margin:0 auto; padding-bottom:30px; color:#373435;}

.our-title {width:100%; background-color:#5cc6d0; padding:50px 0px 50px;}

.our-title h1 {text-align:center; color:#FFFFFF; margin:0px; font-weight:300;}

.our {width:100%; padding:40px 0px 20px;;}

.our img{max-width:100%;}
.our a{-webkit-transition:all 150ms ease;-moz-transition:all 150ms ease;-ms-transition:all 150ms ease;-o-transition:all 150ms ease;transition:all 150ms ease;}
.our a:hover{-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);filter:alpha(opacity=50);opacity:.6;text-decoration:none;}
.our .carousel ul {padding-left:0px; list-style:none;}
.our .thumbnails li> .fff .caption{background:#fff!important;padding:10px 0px 10px;}
.our .thumbnails li> .fff .caption h4 {font-size:17px;}
.our .page-header{background:#f9f9f9;margin:-30px -40px 40px;padding:20px 40px;border-top:4px solid #ccc;color:#999;text-transform:uppercase;}
.our .page-header h3{line-height:.88rem;color:#000;}
.our ul.thumbnails{margin-bottom:0;}
.our .thumbnail a > img {margin-left:0; margin-right:0;}
.our .thumbnail .img-responsive {margin:0 auto; text-align:center; width:100%;}
.our .caption h4{color:#444;}
.our .caption p{color:#999;}
.our .control-box{text-align:right;width:100%;}
.our .carousel-control{background:#666;border:0;border-radius:0;display:inline-block;font-size:34px;font-weight:200;line-height:18px;opacity:.5;padding:4px 10px 0;position:static;height:30px;width:15px;}
.our .caption .btn-change7{height:auto;width:100%;background:#5cc6d0;margin:0px;border:0;color:#fff;box-shadow:0 0 1px #ccc;-webkit-transition-duration:.5s;-webkit-transition-timing-function:linear;box-shadow:0 0 0 #71d0f6 inset; display:block; font-size:18px; text-align:center; padding:10px 0px 10px;}
.our .caption .btn-change7:hover{box-shadow:600px 0 0 #71d0f6 inset;}
@media (max-width: 767px) {
.our .page-header,.control-box{text-align:center;}
}
@media (max-width: 479px) {
.our .caption{word-break:break-all;}
}

.contact {width:100%; background-color:#edeef0; padding:55px 0px 50px; float:left;}

.contact h3 {color:#373435; margin:0px; font-size:30px;}

.contact h3 i {color:#5cc6d0;}

.contact .info {text-align:center;}

.contact .info .btn-change7{height:auto;width:100%;background:#5cc6d0;margin:0px;border:0;color:#fff;box-shadow:0 0 1px #ccc;-webkit-transition-duration:.5s;-webkit-transition-timing-function:linear;box-shadow:0 0 0 #71d0f6 inset; padding:10px 50px 10px; font-size:18px;}
.contact .info .btn-change7:hover{box-shadow:200px 0 0 #71d0f6 inset;}

.footer {width:100%; background-color:#5cc6d0; padding:30px 0px 10px;}

.footer p {font-size:18px; color:#FFFFFF; line-height:30px; margin:10px 0px 26px; text-align:justify;}

.footer .media {margin-top:10px;}

.footer .social-icon{margin:20px 0px 20px; float:left;}

.footer .facebook{display:inline;padding-right:7px;}

.footer .facebook a{height:40px;width:40px;line-height:42px;text-align:center;vertical-align:middle;display:inline-block;color:#5cc6d0;background-color:#FFF;transition:all ease .3s; border-radius:5px; font-size:28px; box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.5);}

.footer .facebook a:hover{background-color:#3b5998;color:#FFF;}

.footer .twitter{display:inline;padding-right:7px;}

.footer .twitter a{height:40px;width:40px;line-height:42px;text-align:center;vertical-align:middle;display:inline-block;color:#5cc6d0;background-color:#FFF;transition:all ease .3s; border-radius:5px; font-size:28px; box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.5);}

.footer .twitter a:hover{background-color:#00aced;color:#FFF;}

.footer .google{display:inline;padding-right:7px;}

.footer .google a{height:40px;width:40px;line-height:42px;text-align:center;vertical-align:middle;display:inline-block;color:#5cc6d0;background-color:#FFF;transition:all ease .3s; border-radius:5px; font-size:28px; box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.5);}

.footer .google a:hover{background-color:#dd4b39;color:#FFF;}

.footer .youtube{display:inline;padding-right:7px;}

.footer .youtube a{height:40px;width:40px;line-height:42px;text-align:center;vertical-align:middle;display:inline-block;color:#5cc6d0;background-color:#FFF;transition:all ease .3s; border-radius:5px; font-size:28px; box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.5);}

.footer .youtube a:hover{background-color:#bb0000;color:#FFF;}

.footer .social-icon-1 {margin:5px 0px 20px; float:left;}

.footer hr {margin:5px 0px 5px;}

.footer .group {display:inline;padding-right:7px;}

.footer .group a{text-align:center;vertical-align:middle;display:inline-block;color:#FFF;transition:all ease .3s; border-radius:5px; font-size:18px; box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.2); padding:5px; margin:5px 0px 5px;}

.footer .group a:hover{color:#000;}

.footer h3 {font-size:26px; color:#FFFFFF; margin:0px 0px 15px; font-weight:500;}

.footer ul {padding-left:20px; margin:0px 0px 10px;}

.footer ul li{list-style: outside none none; padding:5px 0px 5px 0px; line-height:33px;}

.footer ul li:before{content:"\f105"; font-family: FontAwesome; display:inline-block; margin-left:-1.3em ; width:1.3em; color:#FFFFFF; font-size:20px;}

.footer ul li a{text-decoration:none;  color:#FFFFFF; font-size:20px;}

.footer ul li a:hover {text-decoration:none; color:#000000;}

.footer .media .media-left .fa {color:#FFFFFF; font-size:16px; margin-top:3px; margin-left:2px;}

.footer .media .media-body p {font-size:16px; color:#FFFFFF; font-weight:300; line-height:22px; margin:0px;}

.footer .media .media-body p a {color:#FFFFFF;}

.footer .media .media-body p a:hover {color:#000000; transition: all ease 0.5s;}

.footer-bottom {width:100%; background-color:#292b33; border-top:1px solid #3f4148;}

.footer-bottom h5 {font-size:16px; color:#FFFFFF; margin:21px 0px 24px; text-align:left;}

.footer-bottom h6 {font-size:16px; color:#FFFFFF; margin:21px 0px 24px; text-align:right;}

.footer-bottom h6 a {color:#5cc6d0;}

.footer-bottom h6 a:hover {color:#71d0f6;}

.breadcome {width:100%; background-color:#FFFFFF; height:304px; margin-top:0px; border-top:2px solid #000000; border-bottom:2px solid #000000;}

.breadcome h1 {color:#FFFFFF; font-size:36px; padding:125px 0px; margin:0px; font-weight:bold; text-align:center;}

.breadcome .about-bg {background-image:url(../images/about-us-banner.jpg); background-repeat:no-repeat; height:304px;}

.about-us {width:100%; padding:30px 0px 30px;}

.about-us p {color:#717171; font-size:18px; text-align:justify; margin:10px 0px 10px; line-height:30px;}

.breadcome-1 {width:100%; background-color:#71d0f6;}

.breadcome-1 h1 {color:#FFFFFF; font-size:36px; padding:50px 0px 20px; margin:0px; font-weight:bold; text-align:center;}

.breadcome-1 .breadcrumb {text-align:center; margin-bottom:10px; background-color:transparent;}

.breadcome-1 .over-bg {background-image:url(../images/bg.png);}

.breadcome-1 .breadcrumb li a {color:#FFFFFF;}

.breadcome-1 .breadcrumb>li+li:before{color:#FFFFFF;}

.breadcome-1 .breadcrumb > .active {color:#000000;}

.product {width:100%; padding:50px 0px 50px;}

.product .box-1 {width:49%; border:2px solid #5cc6d0; margin:0px 0px 20px; float:left;}

.product .box-1 .carousel-control.right {background-image:none;}

.product .box-1 .carousel-control.left {background-image:none;}

.product .box-1 .carousel-control {text-shadow: 0 1px 2px rgba(0,0,0,1);}

.product .carousel-inner .item .img-responsive {margin:0 auto; text-align:center;}

.product .box-2 {width:49%; border:2px solid #5cc6d0; margin:0px 0px 20px; float:right;}

.product h2 {font-size:30px; color:#000000; margin:0px 0px 30px; border-left:4px solid #5cc6d0; padding-left:10px;}

.product h3 {font-size:30px; color:#000000; margin:0px 0px 30px; border-left:4px solid #5cc6d0; padding-left:10px;}

.product p {color:#000000; text-align:justify; margin:0px 0px 20px; line-height:24px; font-size:16px;}

.product ul{padding-left:20px; margin:0px;}

.product ul li{list-style: outside none none; padding:5px 0px 5px 0px; line-height:25px; color:#000000; font-size:16px;}

.product ul li:before{content:"\f105"; font-family: FontAwesome; display:inline-block; margin-left:-1.3em ; width:1em; color:#5cc6d0; font-size:16px;}

.product ul li a{text-decoration:none;  color:#5cc6d0; font-size:16px;}

.product ul li a:hover {text-decoration:none;  color:#71d0f6;}

.product blockquote {padding:10px 20px; margin:0 0 20px; border-left:5px solid #5cc6d0; background-color:#eeeeee;}

.product blockquote p {color:#000000; font-size:24px;}

.product table tr th {color:#000000; font-size:16px;}

.product table tr td {color:#000000; font-size:16px;}

.product .info {text-align:center; margin:20px 0px 0px;}

.product .info .btn-change7{height:auto;width:100%;background:#5cc6d0;margin:0px;border:0;color:#fff;box-shadow:0 0 1px #ccc;-webkit-transition-duration:.5s;-webkit-transition-timing-function:linear;box-shadow:0 0 0 #71d0f6 inset; padding:10px 50px 10px; font-size:18px;}
.product .info .btn-change7:hover{box-shadow:500px 0 0 #71d0f6 inset;}

.product .info .btn-change7 i {margin-right:10px;}

.product .box-3 {width:100%; border:2px solid #5cc6d0; margin:10px 0px 10px; float:left; background-color:#FFFFFF;}

.product .box-3 .img-responsive {margin:0 auto; text-align:center;}

.scroll-top-wrapper{position:fixed;opacity:0;visibility:hidden;overflow:hidden;text-align:center;z-index:99999999;background-color:#000000;color:#eee;width:50px;height:48px;line-height:48px;right:-1px;bottom:30px;padding-top:2px;-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;}
.scroll-top-wrapper:hover{background-color:#333333;}
.scroll-top-wrapper.show{visibility:visible;cursor:pointer;opacity:1;}
.scroll-top-wrapper i.fa{line-height:inherit;}

.inquiry {width:100%; overflow:auto; padding:50px 0px 50px;}

.inquiry .box-1 {width:100%; float:left;}

.inquiry .box-2 {width:18%; float:left; font-size:16px; margin:10px 0px 10px;}

.inquiry .box-3 {width:70%; float:left; margin:10px 0px 10px;}

.inquiry .box-3 input, button, select, textarea {width:100%;}

.inquiry h2 {font-size:30px; color:#000000; margin:0px 0px 30px; border-left:4px solid #5cc6d0; padding-left:10px;}

.inquiry h3 {font-size:30px; color:#000000; margin:0px 0px 30px; border-left:4px solid #5cc6d0; padding-left:10px;}

.inquiry p {color:#000000; text-align:justify; margin:0px 0px 20px; line-height:24px; font-size:16px;}

.inquiry ul{padding-left:20px; margin:0px;}

.inquiry ul li{list-style: outside none none; padding:5px 0px 5px 0px; line-height:25px; color:#000000; font-size:16px;}

.inquiry ul li:before{content:"\f105"; font-family: FontAwesome; display:inline-block; margin-left:-1.3em ; width:1em; color:#5cc6d0; font-size:16px;}

.inquiry ul li a{text-decoration:none;  color:#5cc6d0; font-size:16px;}

.inquiry ul li a:hover {text-decoration:none;  color:#71d0f6;}

.inquiry .table-inquiry td {10px;font-size:16px; border:none; text-align:left;}

.inquiry table {border:none!important;}

.inquiry .indi {text-align:center; font-weight:400; margin:20px 0px 20px; font-size:16px;}

.inquiry .indi-red {color:#FF0000; display:inline;}

.inquiry .table-inquiry {font-weight:400;}

.inquiry .table-inquiry td {padding:10px;}

.inquiry fieldset {margin:10px 0px 10px;}

.contact-us {width:100%; padding:50px 0px 40px;}

.contact-us .box {width:100%; padding:0px;}

.contact-us .media .media-body h5 {color:#000000; font-size:14px; line-height:28px; text-align:justify;}

.contact-us .media .media-body h5 a {color:#000000; font-size:18px;}

.contact-us .media .media-body h5 a:hover {color:#5cc6d0;}

.contact-us .media .media-body .media-heading {margin-top:2px; font-size:24px; color:#5cc6d0;}
















@media (max-width:320px) {
.header-top p {float:none; text-align:center; margin:13px 0px 13px 0px;}

.header-top .social-icon{margin:0;float:none; text-align:center;}

.header .navbar-brand {width:50%; height:auto; margin-bottom:10px;}

.header .navbar-default {margin:18px 0px 10px 0px;} 

.header .navbar-toggle {margin-top: 14px;}

.header .navbar-default .navbar-nav > li > a {padding: 10px 7px 10px 7px;}	

.header .navbar-right {margin-right:0px; float:none;}

.welcome h1 {font-size:32px; margin:0px 0px 20px; text-align:center;}

.footer h3 {margin:20px 0px 20px;}

.footer-bottom h5 {text-align:center;}

.footer-bottom h6 {text-align:center;}

.contact h3 {text-align:center; margin:0px 0px 20px; font-size:20px;}

.breadcome h1 {font-size: 26px; padding: 113px 0px; line-height: 38px;}

.breadcome-1 h1 {font-size: 26px; line-height: 38px;}

.product h2 {font-size:24px; line-height:30px;}

.product .box-1 {width:100%;}

.product .box-2 {width:100%; float:left;}

.product blockquote p {font-size:22px;}

.product .info {text-align:center; margin:30px 0px 50px;}

.inquiry .box-2 {width:100%;}

.inquiry .box-3 {width:100%;}
}
@media screen and (min-width:321px) and (max-width:767px) {
.header-top p {float:none; text-align:center; margin:13px 0px 13px 0px;}

.header-top .social-icon{margin:0;float:none; text-align:center;}

.header .navbar-brand {width:50%; height:auto; margin-bottom:20px;}

.header .navbar-default {margin:18px 0px 10px 0px;} 

.header .navbar-toggle {margin-top:30px;}

.header .navbar-default .navbar-nav > li > a {padding: 10px 7px 10px 7px;}	

.header .navbar-right {margin-right:0px; float:none;}

.welcome h1 {font-size:32px; margin:0px 0px 20px; text-align:center;}

.footer h3 {margin:20px 0px 20px;}

.footer-bottom h5 {text-align:center;}

.footer-bottom h6 {text-align:center;}

.contact h3 {text-align:center; margin:0px 0px 20px; font-size:20px;}

.breadcome h1 {font-size: 26px; padding: 113px 0px; line-height: 38px;}

.breadcome-1 h1 {font-size: 26px; line-height: 38px;}

.product h2 {font-size:24px; line-height:30px;}

.product blockquote p {font-size:22px;}

.product .box-1 {width:100%;}

.product .box-2 {width:100%; float:left;}

.product .info {text-align:center; margin:30px 0px 50px;}

.inquiry .box-2 {width:100%;}

.inquiry .box-3 {width:100%;}

}
@media (min-width:768px) and (max-width:1024px) {
.header .navbar-brand {width:75%; height:auto; margin-bottom:20px;}

.header .navbar-default {margin:18px 0px 20px 0px;} 

.header .navbar-default .navbar-nav > li > a {padding:20px 7px 10px 7px;}	

.header .navbar-right {margin-right:0px; float:none;} 

.header .navbar-toggle {margin-top:30px;}

.header .navbar-collapse {margin-top:12px;}

.product .box-1 {width:100%;}

.product .box-2 {width:100%; float:left;}
}
@media (min-width:1025px) and (max-width:1680px) {
.our figure.effect-zoe h2 {font-size:18px;}
}
@media (min-width:1200px) and (max-width:1300px) {

}