.container{max-width: 980px; margin:0 auto; padding-left: 15px; padding-right: 15px; width: 100%; box-sizing: border-box;}
h1#logo{background: none; font-size:inherit}
h1#logo a{text-indent: 0;}
.home-slider .nivoSlider{width: 100% !important; height: auto !important;}
.home-slider .metaslider.metaslider-nivo{max-width:100% !important;}
.logo img{max-width: 90%;}
#header h1#logo{height: auto; max-width:100%; float: left; width: calc(100% - 320px);}
#header h1#logo a{width: auto; height: auto; display: inline;}
#header #card{width: 320px;}
#header #phone{background: none; padding: 0px;}
#header #phone a, #header #phone a span{color: #fff;}
#header #phone a span{font-size: 30px; margin-left: 10px; }
#page #body_content_left{width: 61.2244%; box-sizing: border-box;}
#page #body_content_right{width: 38.7755%; box-sizing: border-box; padding-left: 10px;}
#page #latest-news{width: auto; height: auto;}
ul#products{width: 100% !important;}
ul#products li{width: 50% !important; float: left; box-sizing: border-box;}
footer .footer{height: auto;}
.footer-links{padding: 3px 0px; display: inline-block; width: 100%;}
.copyright-socialDiv{width: 100%; display: inline-block;}
.copyright-socialDiv .copyrightDiv{width: calc(100% - 35px); float: left;}
.copyright-socialDiv .socialDiv{width: 35px; float: left;}
.copyright-socialDiv .socialDiv .facebook{float: right; margin: 0px;}
.footer{padding-bottom: 10px;}
 .copyright-socialDiv .copyrightDiv .copyright , .copyright-socialDiv .copyrightDiv .address, .copyright-socialDiv .copyrightDiv .poweredby{ padding: 3px 0px;}
h1, h2{transition: all 0.4s ease 0s}
.footer-links span{padding: 0px 5px;}
.footer-links span:first-child{padding-left: 0px;}
.search-latestnews-page, .search-latestnews-page .span-24.last{width: 100%;}
.search-latestnews-page .long-divider{width: 100%;}
.search-latestnews-page{min-height: 700px;}
#page .span-24{width: 100%;}
#page .products.span-24{margin-left: -10px; margin-right: -10px; width: calc(100% + 20px);}
#page .products.span-24 .product{border: 1px solid #ff0000; box-sizing: border-box; float: left; margin: 0 10px 25px; width: calc(33.3% - 20px); height: auto; position: relative; padding:0px 0px 60px 0px; background: none; border: 1px dashed #ccc;}
#page .product-1{margin: 0px;}
#page .products.span-24 .product img{width: 100%; height: auto;}
#page .products.span-24 .product div.summary{width: calc(100% - 20px); height: auto; padding: 10px 10px 0px;}
#page .products.span-24 .product div.summary p{margin: 0px;}
#page .products.span-24{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex;}
#page .products.span-24.last{-webkit-flex-wrap:wrap;flex-wrap:wrap;}
#page .span-24 iframe{width: 100% !important;}
.contact-page #contact-us-title{display: inline-block; float: none; width: 100%;}
.contact-page #contact-us-title h1, .contact-page #contact-us-title p{display: inline-block; float: none; margin-bottom: 0; margin-right: 0; margin-top: 0; line-height: normal;} 
#body_content_right .inner{padding: 0px;}
.contact-page #body_content_left .inquiries form input, .contact-page #body_content_left .inquiries form textarea{width: calc(100% - 20px);}
#page .contact-page #body_content_left{padding-right: 20px;}
#page .contact-page #body_content_left .inquiries form .field:nth-of-type(7) label{display:none;}
#page .contact-page #body_content_left .inquiries form .actions, .span-15.last.product-detail .span-15 .inquiries .actions{margin: 0px;}
#page .contact-page #body_content_left .inquiries form .actions input{width: 80px;}
 .overlay.open{display: none;}
.overflow{overflow: hidden;}
.span-9.product-detail {width: 320px; margin-bottom: 30px;}
.span-15.last.product-detail .span-15, .span-15.last.product-detail .span-15 #item-description{width: 100%;}
.span-15.last.product-detail{ box-sizing: border-box; display: inline-block; width: calc(100% - 330px);}
.span-15.last.product-detail .span-15 .inquiries form input, .span-15.last.product-detail .span-15 .inquiries form textarea{width:calc(100% - 130px);}
.span-15.last.product-detail .span-15 .inquiries .field:nth-of-type(7) label{display:none;}



/*-----------------implement css ----------------------*/
.menu-icon{display:none;}
.navigation-box{ background: rgba(0, 0, 0, 0) url("../images/nav-bg.png") repeat-x scroll 0 0;  float: left; adding: 5px 0; width: 100%;}
.navigation{ position:relative; }
.navigation .navigation-box .navbar-collapse, .navigation .navigation-box .navbar-collapse .navbar-nav, .navbar-nav > li{ margin:0; padding:0; }
.navigation .navigation-box .navbar-collapse .navbar-nav > li a{ color: #67687d; font-family: "Oswald"; font-size: 20px; font-weight: 400; padding: 0 20px; text-transform: uppercase; line-height:62px; height:64px; }
.navigation .navigation-box .navbar-collapse .navbar-nav > li a:hover{ border-bottom:2px solid #01579b; background-color:transparent; }
.navigation .navigation-box .navbar-collapse .navbar-nav > li a.cative{ border-bottom:2px solid #01579b; }
.navigation .nav > li > a:hover, .nav > li > a:focus {  background-color:transparent; border-bottom:2px solid #01579b;  }
.navigation .navigation-box .navbar-collapse{ position:relative; }
.navigation .responsive-icon, .navigation .nav-close{ display:none; }
.navigation .social-icon{ position:absolute; right:15px; top:15px; }
.navigation .social-icon a{ color:#fff; display:inline-block; }
/*-----------------implement css ----------------------*/
@media(max-width:1366px){
.search-latestnews-page { min-height: 523px;}
}
@media(max-width:1100px){
.search-latestnews-page { min-height: 490px;}
]
@media(max-width:980px){
.span-15.last.product-detail .span-15{width: 100%;}
.span-15.last.product-detail .span-15 #item-description{width: 100%;}

    
#page .contact-page #body_content_left{width: 58.224%;}
#page .contact-page #body_content_right{width: 41.776%;}
#page .contact-page .inquiries .field:last-child > label{display: none;}
h1{ font-size: 30px;}
h2{font-size: 24px;}
#header #phone a img { max-width: 26px;}
#address{position: relative; right: 0; top: -4px;}
.navigation .social-icon{top: 15px;}
.logo img{max-width: 70%;}
#header #phone a{color: #fff; font-size: 16px; vertical-align: top}
#header #phone a span{font-size: 26px; margin-left: 10px; }
#page #body_content_left{padding-right: 20px;}

}
@media(max-width:850px){
.span-15.last.product-detail .span-15 .inquiries form input, .span-15.last.product-detail .span-15 .inquiries form textarea{width: calc(100% - 20px);}
#page .contact-page #body_content_left .inquiries form .field:nth-of-type(7) label{display:block;}
#page .contact-page #body_content_left .inquiries form .actions{margin-left: 110px;}
.contact-page #body_content_left, .contact-page #body_content_right{width: 100% !important; padding: 0px !important;}
.contact-page #body_content_left .inquiries form input, .contact-page #body_content_left .inquiries form textarea{width: calc(100% - 130px);}
}

@media (max-width: 767px) {
.search-latestnews-page { min-height: 433px;}
.span-9.product-detail > h2{text-align: center;}
.span-9.product-detail .item-photo span.magnify-icon{ left: calc(50% - 60px);}
.span-9.product-detail #item-gallery, .span-9.product-detail .item-photo{text-align: center; width: 100%;}
.span-9.product-detail, .span-15.last.product-detail{width: 100%;}
#menu ul{position: relative; top: -69px;}
.overlay.open{position: fixed; left: 0; right: .0; margin: 0 auto; top: 0px; bottom: 0px; background: rgba(0, 0, 0, 0.7); z-index: 99; display: block;}
#header #phone a img { max-width: 18px;}
#header #phone a span { font-size: 18px; margin-left: 3px;}
#header #phone a { color: #fff; font-size: 16px; padding: 0 15px 0px 2px; position: absolute; right: 0; text-align: right; top: -36px; vertical-align: top; z-index: 99;}
/*#page{padding-top: 110px;}
  header { background: #000 none repeat scroll 0 0; height: 50px; top: 0; margin-bottom: 15px; padding-top: 35px; position: fixed; width: 100%; z-index: 99;}*/
#page .products.span-24 .product{width: calc(50% - 20px);}
.navigation-box{ background:rgb(14, 4, 3); }
#header #card{width: 280px;}
#header #phone{float: left;}
.copyright-socialDiv .socialDiv .facebook {left: 0; margin: 0 auto; position: absolute; right: 0; top: 10px;}
.copyright-socialDiv .socialDiv { min-height: 50px; position: relative; text-align: center; width: 100%;}
.copyright-socialDiv .copyrightDiv, .footer-links { text-align: center; width: 100%;}
#page #latest-news .news-item{background: rgba(0, 0, 0, 0) url("../images/latest-news-line.png") repeat-x scroll 0 0;}
#page #latest-news{width: 100%; }
#page #latest-news #read-more{width: 100%;}
#page #body_content_left{margin-bottom: 30px ;}
#page #body_content_left,  #page #body_content_right{width: 100%; padding: 0px;}
.copyright-socialDiv .copyrightDiv .copyright , .copyright-socialDiv .copyrightDiv .address, .copyright-socialDiv .copyrightDiv .poweredby{ padding: 5px 0px;}

.logo img{max-width: 320px; margin-top: 5px; transition: all 0.4s ease 0s}
#header h1#logo{width: calc(100% - 100px);}
header{padding-top:35px; margin-bottom: 15px;}
#address{ position: absolute; right: 0; top: -35px; text-align: left; padding: 4px 15px; height: 20px; left: 0; z-index: 99; border-bottom: 1px solid #422217;}
/*----------------- navigation slider left css ----------------------*/

    #menu ul li{ background: none; box-sizing: border-box; float: left; list-style: outside none none; margin: 0; padding: 10px 15px; width: 100%; text-align:left;}
	.navigation-box.small-nav{ width:300px; display:block; right:0px }
	.menu-icon{ display:block;}
	button{ outline:none;}
	outline{ outline:0;}
	.page-content{height:100%; width:100%; position:absolute;}
	.contentRight {width:100%;}
	.navigation-box{width:0; bottom:0; top:0; z-index:100; right:0px; position:fixed; overflow:hidden;border-right:#2d3a46 solid 1px; -webkit-transition: width 0.5s;transition: width 0.4s;}
	.navigation-box:hover{overflow-y:auto;}
	.nav-closeicon{ color:#fff; background-image:url(../images/nav_close.jpg); cursor:pointer; width:24px; height:25px; float:right; margin:25px 30px 90px 30px}
/*----------------- navigation slider left css ----------------------*/
/*-----------------implement css ----------------------*/
.navigation .navigation-box .navbar-collapse{ max-height:calc(100% - 125px);  background-color: #fff; margin: 0; overflow-y: auto; position: fixed; z-index: 999; width:100%;}
.closeDiv { background-color:; border-bottom: 1px solid #000; height:69px; }
.navigation .navigation-box .navbar-collapse .navbar-nav > li a{ font-size:18px; padding:0px 15px; }
.navigation .responsive-icon{ color: #fff; font-size: 24px; position: fixed; right: 15px; top: 35px; display: block; background:#30150c; border: 1px solid #140605;    
    width: 42px; height: 42px; cursor: pointer; z-index: 99;}
.navigation .nav-close{color: #fff; font-size: 26px; position: absolute; right: 20px; top: 15px; display:block;  background: transparent; border: 1px solid #f9f9f9; 
    width: 40px; height: 38px;cursor: pointer; text-align: center; z-index: 999;}
.navigation .social-icon{ background-color: rgb(14, 4, 3); bottom: 0; padding: 7px 0px; position: absolute; right: 0; top: auto; width: 100%; height:50px; border-top: 1px solid #000}
.ul-scroll{ height:100%; overflow-y:scroll;}
/*-----------------implement css ----------------------*/
.homepage .navbar-inverse .navbar-nav > li > a{ width:100%;}
.navbar-inverse .navbar-toggle{ border-color:#01579b;}
.navbar-inverse .navbar-toggle .icon-bar{ background-color:#01579b; }
.homepage .navbar-toggle{ margin-right:0px; }
.homepage .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{ background-color:#F00;} 
.homepage .navbar-nav > li{ margin:0; }
.container > .navbar-header, .container > .navbar-collapse{margin-left: 0;}
.navbar-nav > li {padding-bottom: 0;}
.nav-tabs > li.active > a:after{display: none;}
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {background-color:#7FC500;}
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a{color:#fff}
.navbar { padding-bottom:10px}
    .logo img{max-width: 65%;}
}
@media(max-width:600px){
    
    .search-latestnews-page { min-height: 433px;}
    h1{ font-size: 26px;}
     .logo img {max-width: 280px; margin-top: 7px;}
    #header h1#logo { width: calc(100% - 80px);}
}
@media(max-width:500px){
     .logo img {width: 400px; margin-top: 7px;}
    #header #phone a{right: 15px; top: -32px; padding:0 3px 0 2px;}
    #header #phone a span {display: none;}
    #page .contact-page #body_
    content_left .inquiries form .field:nth-of-type(7) label{display: none;}
    #page .contact-page #body_content_left .inquiries form .actions{margin-left: 0px;}
    .contact-page #body_content_left .inquiries form input, .contact-page #body_content_left .inquiries form textarea{width: calc(100% - 20px);}
    .inquiries form label{width: 100%;}
    ul#products li{width: 100% !important;}
}
@media(max-width:480px){
    #page .products.span-24 .product{width: 100%;}
}
@media(max-width:400px){
    .search-latestnews-page { min-height: 330px;}
    table.contact td{display: block; width: 100%; padding: 0px 5px 6px 0px;}
    .footer-links span{padding: 0px 0px;}
    .logo img { max-width: 220px; margin-top: 7px;}
    #address{padding: 4px 10px; font-size: 13px;}
    #header h1#logo { width: calc(100% - 60px);}
}
    @media(max-width:360px){
        .search-latestnews-page { min-height: 200px;}
    }