@import url(https://fonts.googleapis.com/css?family=Open+Sans);

@import url(https://fonts.googleapis.com/css?family=PT+Sans);

@import url(https://fonts.googleapis.com/css?family=Roboto);

@import url(https://fonts.googleapis.com/css?family=Lobster);

@import url('https://fonts.googleapis.com/css?family=Oswald:300,400,700');

body,td,th {font-family: 'PT Sans', sans-serif;font-size: 12px;color: #000;}

body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;	background-color:#fff;overflow-x:hidden;}

* {margin: 0px; padding: 0px;}

a {font-family: 'PT Sans', sans-serif;font-size: 12px;color: #000000;text-decoration:none !important;}

a:visited {color: #000000;}

a:hover {color: #000000;	text-decoration:none !important;}

a:active {color: #000000;}

img{border:none;}

img a{border:none;}

p{margin:0px 0px 5px 0px;padding:0px;}

::selection{ color:#fff; background-color:#000;}



#header .comman{position: absolute;}

#header #logo{z-index: 2;}

#header #logo img{ height: 125px; }

#header .home-menu{z-index: 1; margin:40px 0px 0px 0px;}

#header .home-menu .navbar-nav{padding: 6px; margin-left: 200px;}

#header .home-menu .navbar-nav a{color: #000; font-size: 12px; font-weight: bold; text-transform: uppercase;}

#header .home-menu .navbar-nav a:hover{color:#000; background:#FF9900;}

#header .navbar-default { box-shadow: none; border: 2px solid #FF9900; border-radius: 0px; background: rgba(255, 255, 255, 0.7); width:100%;}

#featured-product {background:url(../imgs/bgfeatured.jpg) no-repeat center top; margin-top: -20px; height: 400px;}

#featured-product #feature-main-box h2{text-align: center; padding: 12px; font-weight: bold; color: #fff;}

#featured-product #feature-main-box h2 span{color: #FF9900;}

#featured-product #feature-main-box #categories-box h3{background: #fff;border: none;text-align: center;padding: 3px 0px 8px 0px;border: 1px solid #000;}

#featured-product #feature-main-box #categories-box h3 a{text-align: center;color: #000;font-weight: bold;padding: 32px 0px 33px 0px;}

#featured-product #feature-main-box #categories-box h3:hover{background: #FF9900; color: #fff; border: 1px solid #fff;}

#featured-product #feature-main-box #categories-box h3 a:hover{color: #fff;}

#featured-product #feature-main-box #categories-box .cat-class img {-webkit-transition: all 1s ease; /* Safari and Chrome */

    -moz-transition: all 1s ease; /* Firefox */

    -o-transition: all 1s ease; /* IE 9 */

    -ms-transition: all 1s ease; /* Opera */

    transition: all 1s ease;

        max-width: 100%;}

#featured-product #feature-main-box #categories-box .cat-class:hover img{-webkit-transform:scale(1.25); /* Safari and Chrome */

    -moz-transform:scale(1.25); /* Firefox */

    -ms-transform:scale(1.25); /* IE 9 */

    -o-transform:scale(1.25); /* Opera */

     transform:scale(1.25);}

#featured-product #feature-main-box #categories-box .cat-class{overflow: hidden;}

#main-short-about{background: #000; }

#main-short-about #about-text{background:url(../imgs/about.png) no-repeat center top;border: 3px solid #FF9900; margin-top: 28px; margin-bottom: 28px;}

#main-short-about #about-text h2{text-align: center; padding:0px; font-weight: bold; color: #fff; margin:10px 0px 0px 0px;}

#main-short-about #about-text h2 span{color: #FF9900;}

#main-short-about #about-text p{color: #fff; padding: 10px;}

#feature-pro {background: #000 !important;}

#feature-pro .padding-off {padding: 0px;}

#feature-pro #feature-image-box h2{text-align: center; padding: 12px; font-weight: bold; color: #fff;}

section #main-product h2 {

    text-align: center;

    padding: 0px;

    font-weight: bold;

    color: #fff;

    margin: 0px 0px 30px 0px;

	text-transform:uppercase;

}

section #main-product h2 span {

    color: #FF9900;

}





.short-about-bg {

    background: url(../imgs/about.png) no-repeat center top;

   

  

}



.short-about {

    font-family: 'Roboto', sans-serif;

}



.short-about h4 {

    font-size: 32px;

    text-transform: uppercase;

    color: #fff;

    padding-top: 90px;

    margin: 0px;

}.short-about p {

    font-family: 'Roboto', sans-serif;

    font-style: light;

    font-size: 14px;

    text-align: justify;

    color: #fff;

    padding: 20px 0px;

}

















section #main-category{margin:0px 0px 0px 0px; border-top: 2px solid #FF9900;border-bottom: 2px solid #FF9900; padding:0px 0px 5px 0px;  width:100%; background:#000; }

section #main-category #area-category { margin:5px 0px 0px 0px; padding:0px !important; width:100%;  overflow: hidden;}

section #main-category #area-category  img{width:100%; height:auto; transition:.8s;}

section #main-category #area-category:hover img{transform:scale(1.2);}

.thu{height:409px !important;}



.mgl{padding-left:0!important; padding-right:5px!important;}

.mgf{padding:0!important;}

.thu{height:409px !important;}

.btn {

    display: inline-block;

    padding: 6px 12px;

    margin-bottom: 0;

    font-size: 14px;

    font-weight: normal;

    line-height: 1.42857143;

    text-align: center;

    white-space: nowrap;

    vertical-align: middle;

    -ms-touch-action: manipulation;

    touch-action: manipulation;

    cursor: pointer;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    background-image: none;

    border: 1px solid transparent;

    border-radius: 4px;

    color: #000 !important;

}

#pagehead-area {

    border-top: solid 1px #f5f5f5;

    border-bottom: none !important;

    background: url(../imgs/prod-bg.jpg) no-repeat center top;

    min-height: 360px;

    float: left;

    width: 100%;

	margin:0px 0px 20px 0px;

}

#pagehead-area h5 {

    font-size: 35px;

    font-family: Roboto;

    color: #FFF;

    text-transform: uppercase;

    float: left;

    width: 100%;

    text-align: center;

    margin: 200px 0px 0px 0px;

    padding: 0px 0px 20px 20px;

}

#pagehead-area h6 {

    font-size: 16px;

    font-family: Roboto;

    color: #FFF;

    text-transform: uppercase;

    float: left;

    width: 100%;

    text-align: center;

    margin: 0px;

    padding: 20px 0px 20px 20px;

}

#feature-pro #feature-image-box h2 span{color: #FF9900;}

#feature-pro #feature-image-box .sub-box h3{width: 150px; background: #FF9900; color: #fff; text-align: center; font-size: 10px; padding: 12px;}

#feature-pro #feature-image-box .sub-box img{

  width: 150px;

  height: 150px;

  -webkit-transform: scale(1);

  transform: scale(1);

  -webkit-transition: .3s ease-in-out;

  transition: .3s ease-in-out;}

  #feature-pro #feature-image-box .sub-box:hover img{-webkit-transform: scale(1.3);

  transform: scale(1.3);}

#feature-pro #feature-image-box .sub-box h3:hover{background: #000; border:1px solid #fff; color: #fff; cursor: pointer;}

#main-short-news {background: #000; }

#main-short-news #news-text{border: 3px solid #FF9900; margin-bottom: 28px;}

#main-short-news #news-text h2 {text-align: center; padding: 12px; font-weight: bold; color: #fff;}

#main-short-news #news-text h2 span {color: #FF9900;}

#main-short-news #news-text p{color: #fff; padding:2px 15px;}



#back-space{height: 140px; width: 100%;}

#products-show .pro-thumb{border:1px solid #000; overflow: hidden;margin-bottom:  10px; padding-bottom: 20px;}

#products-show .pro-thumb .pic-thumb{overflow: hidden; text-align: center;}

#products-show .pro-thumb .viewdetail{padding: 4px 25px 4px 25px; color: #fff; background: #000;}

#img-box-zoom {border:1px solid #000; padding: 20px; }

#detail-content {border:1px solid #000; padding: 20px; }

#detail-content #form-fied .btn-success{background: #000; color: #fff; border: none; margin-top: 20px; margin-left:145px;}

#related-pro h2.breadcrumb{text-align: center; text-transform: uppercase; margin-bottom: 20px; padding: 10px 0px 10px 0px;color: #fff;font-size: 18px;font-weight: normal;border: none; background: #000;}

#related-pro .pro-thumb{border:1px solid #000; overflow: hidden;margin-bottom:  10px; padding-bottom: 20px;}

#related-pro .pro-thumb .pic-thumb{overflow: hidden; text-align: center;}

#related-pro .pro-thumb .pic-thumb .viewdetail {padding: 4px 25px 4px 25px;  color: #fff; background: #000;}



section #newsletter{margin:0px 0px; padding:0px; float:left; width:100%; background:url(../imgs/newsletter-bg.jpg) fixed; min-height:327px;}

section #newsletter h1{font-family:Roboto; font-size:30px; color:#fff; text-align:center; margin:80px 0px 0px 0px;}

section #newsletter h2{font-family:Roboto; font-size:18px; color:#fff; text-align:center;}

section #newsletter #arealetter {margin:30px 0px 0px 0px; padding:0px; float:left; width:100%; background:#fff;}

section #newsletter #arealetter .newsfield{font-family:Roboto; font-size:14px; color:#000; background:none; border:none; outline:none; padding:18px 10px; float:left;}



section #main-product {margin:0px; padding:0px 0px; float:left; width:100%; background:url(../imgs/product-bg.jpg) no-repeat center top;}

section #main-product #area-product{margin:0px; float:left; width:100%; background:#fff;}

section #main-product #area-product #art-no{margin:0px; float:left; width:100%; background:#CC0100; text-align:center;color:#fff; font-family:Oswald; font-size:18px; padding:10px 0px;}

marquee>a, marquee>a:hover{color:#000; text-decoration:none;}

.productbox {

    width:250px;

    height:auto;

    background-color:#ffffff;

    padding:10px;

	margin-bottom:10px;

	 padding: 10px;

        -webkit-border-radius: 3px;

        -moz-border-radius: 3px;

        border-radius: 3px;

        background-color: #fff;

        border: solid 1px #cbcbcb;

        transition: all .20s ease-in-out;

}

.productbox img{

    width:235px;

    height:214px;

    }

.producttitle {

    font-weight:bold;

	padding:5px 0 5px 0; 

   width: 235px;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

 text-align: center;

    

}

.producttitle a{

   color:#000;

   text-decoration:none;

       }

.producttitle .btn{

    background-color:#EDEEF0;

}

.image-abc {position: relative;width: 100%;}

.image {opacity: 1;display: block; width: 100%; height: auto; transition: .5s ease; backface-visibility: hidden;}

.middle {transition: .5s ease;opacity: 0;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%)}

.image-abc:hover .image {opacity: 0.3;}

.image-abc:hover .middle {opacity: 1;}











.red{background:#FF9900}



.header-email{font-family: 'Roboto', sans-serif; color:#fff;}



.header-email ul{margin:0px; padding:0px}



.header-email ul li{list-style:none; display:inline-flex; padding:10px 10px}



.header-email ul li a{color:#fff; text-decoration:none}



.header-email ul li .fa-phone{padding:4px 5px 0px 10px}



.header-email ul li .fa-paper-plane-o{padding:4px 5px 0px 10px}











.social-icons{text-align:right; font-size:16px}



.social-icons ul{margin:0px; padding:0px}



.social-icons ul li{list-style:none;display:inline-flex; padding:5px 0px 5px 10px}



.social-icons ul li a{text-decoration:none; color:#fff;}



.social-icons ul li a .fa-facebook{text-decoration:none; color:#fff; border:solid 2px #FFF; border-radius:50%; padding:7px 10px;}



.social-icons ul li a .fa-twitter{text-decoration:none; color:#fff; border:solid 2px #FFF; border-radius:50%; padding:8px 8px;}



.social-icons ul li a .fa-linkedin{text-decoration:none; color:#fff; border:solid 2px #FFF; border-radius:50%; padding:8px 9px;}



.social-icons ul li a .fa-google-plus{text-decoration:none; color:#fff; border:solid 2px #FFF; border-radius:50%; padding:8px 6px;}

















footer #main-footer{margin:20px 0px 0px 0px; padding:0px; float:left; width:100%; background:url(../imgs/bottom-bg.jpg) no-repeat center top;}

footer #main-footer h5 {font-family:Roboto; font-size:24px; color:#fff; text-transform:uppercase;  margin-top:80px;}



footer #main-footer h6{font-family:Roboto; font-size:16px; color:#fff; text-transform:uppercase; text-decoration:none;}

footer #main-footer h6 a{font-family:Roboto; font-size:16px; color:#fff; text-transform:uppercase; text-decoration:none;}

footer #main-footer h6 a:hover{color:#FF9900; }



footer #main-search {margin:0px; padding:0px; float:left; width:100%; background:#fff;}

footer #main-search .search-field {font-family:Roboto; font-size:14px; color:#000; background:none; border:none; margin:0px; padding:14px; outline:none;}

footer #main-search .search-iacon {margin:14px 10px 0px 0px; padding:0px; float:right;}

footer #main-footer h2{font-family:Roboto; font-size:16px; color:#fff; text-decoration:none; line-height:24px;}



footer #main-footer #copyright {margin:0px; padding:0px; float:left; width:100%; background:#FF9900;}

footer #main-footer #copyright .coay{font-family:Roboto; font-size:14px; color:#fff; text-align:center; margin:0px; padding:15px 0px; }

.btmsocial { padding-top: 3px; float:left;}

.btmsocial a { background: url(../imgs/btmsocial.png) no-repeat; display: inline-block; width: 35px; height: 35px; margin: 0 5px; -webkit-transition: .5s; transition: .5s; }

.btmsocial a.bfb { background-position: 0 -40px; }

.btmsocial a.bfb:hover { background-position: 0 0; }

.btmsocial a.btw { background-position: -48px -40px; }

.btmsocial a.btw:hover { background-position: -48px 0; }

.btmsocial a.bgp { background-position: -96px -40px; }

.btmsocial a.bgp:hover { background-position: -96px 0; }

.btmsocial a.byt { background-position: -144px -40px; }

.btmsocial a.byt:hover { background-position: -144px 0; }

.btmsocial a.bli { background-position: -192px -40px; }

.btmsocial a.bli:hover { background-position: -192px 0; }

.btmsocial a.bpi { background-position: -240px -40px; }

.btmsocial a.bpi:hover { background-position: -240px 0; }



.fxd-clear{clear: both;}



@media (max-width:1024px){



#header .home-menu .navbar-nav a{color: #fff; font-size: 12px; font-weight: bold; text-transform: uppercase; padding:10px 10px;}



}

@media (max-width:1200px){



.thu{height:339px !important;}

}



@media (max-width:992px){

	#header .home-menu .navbar-nav{margin-left: 9px;}

	#header #logo img {height: 125px;width: 284px;}

    .thu{height:260px !important;}

	}

@media (max-width:768px){

	#header .comman{position: static;}

	#header .home-menu .navbar-nav{margin-left: 0px; padding: 6px; margin-left: 0px;}

	#header .navbar-default{border:none;}

	#header #logo img {height: 125px;width: 100%; background: #FF9900;}

	#slider {margin-top: -20px;}

	.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand{color: #FF9900 !important; background-color: transparent;}

	.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover{color: #5e5e5e; background-color: transparent;}

	#featured-product {background:url(../imgs/bgfeatured.jpg) no-repeat center top; background: #000; height: auto;}

	#back-space{height: auto; width: 100%;}

  #feature-pro #feature-image-box .sub-box img{width: 100%; height: auto;}

  #header .navbar-default {background: #000;}

  #feature-pro #feature-image-box .sub-box h3{width: 100%;}

   #products-show .pro-thumb .pic-thumb .img-wrapper{text-align: center;}

  #products-show .pro-thumb .pic-thumb .image{width: 100%; text-align: center;}

  #main-short-news #news-text{float:left;}

  #cssmenu > ul > li > a{color:#fff!important;}

  #cssmenu > ul > li > a:hover{color:#FF0000!important;}

}























h2.breadcrumb{text-align:center; text-transform:uppercase; margin-bottom:20px; padding:0px 0px 10px 0px; color:#000; font-size:30px; font-weight:normal;}

h2.breadcrumb span{color:#000;}





#main-sidebar-wrapper *{transition:none; -webkit-transition:none; -o-transition:none; -ms-transition:none;}

h2.heading{display:block; margin:0px 0px 10px 0px; text-transform:uppercase; font-size:20px; font-weight:normal; background-color:#000; color:#fff; padding:10px 10px 10px 10px;}

h2.heading::after{display:block; content:""; position:absolute; top:2px; right:2px; width:0; height:0; border-style:solid; border-width:0 10px 10px 0; }

#main-sidebar-wrapper ul{list-style:none; margin:0px; padding:0px;}

#main-sidebar-wrapper ul.menu{padding:10px;}

#main-sidebar-wrapper ul li{margin-bottom:15px;}

#main-sidebar-wrapper ul li a.mcat, #sidebar #page-wrapper #main-sidebar-wrapper ul li strong{display:block; cursor:pointer;}

#main-sidebar-wrapper ul li b{display:block; position:relative; font-family:"swis", Arial, Helvetica, sans-serif; cursor:pointer; font-weight:normal; font-size:18px; padding:0px 10px 15px 20px; border-bottom:1px solid #CCC; color:#222; text-transform:uppercase;}

#main-sidebar-wrapper ul li:hover b{color: #FF9900;}

#main-sidebar-wrapper ul li b::after{display:block; content:""; position:absolute; top:8px; left:0px; width:0; height:0; border-style:solid; border-width:0 10px 10px 0; }

#main-sidebar-wrapper ul li ul{padding:10px 20px;}

#main-sidebar-wrapper ul li ul li{margin-bottom:0px;}

#main-sidebar-wrapper ul li ul li a{display:block; position:relative; text-transform:uppercase; padding:4px 4px 4px 15px; font-size:13px; color:#666; font-weight:normal;}

#main-sidebar-wrapper ul li ul li a.current{font-weight:bold;}

#main-sidebar-wrapper ul li ul li a::before{display:block; content:""; position:absolute; top:8px; left:0px; width:8px; height:8px; border-radius:8px; background-color:#CCC;}

#main-sidebar-wrapper ul li ul li a:hover{color: #FF9900; text-decoration:none;}

#page-content-wrapper{}

#page-wrapper #page-content-wrapper .texts{line-height:22px; color:#222;}

#page-wrapper #main-prd-img{display:block; text-align:center;}

#page-wrapper #main-prd-img img{display:block; max-width:100%; margin:auto;}

#page-wrapper #main-prd-detail{padding-top:30px;}

#page-wrapper #singprdwrapper_txt_art{color:#282828; margin-bottom:10px;}

#page-wrapper #singprdwrapper_txt_size{color:#282828; margin-bottom:10px;}

#page-wrapper #singprdwrapper_txt_detail{color:#000; line-height:21px;}

#page-wrapper #singprdwrapper_txt_detail .txt_detail{color:#282828; display:inline-block; margin-right:10px;}

#page-wrapper #singprdwrapper_txt_detail ul{margin-left:15px; display:block;}



.img-wrapper {position: relative;width: 50%;}

.image {opacity: 1;display: block;height: auto;transition: .5s ease;backface-visibility: hidden;}

.middle {transition: .5s ease;opacity: 0;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%)}

.img-wrapper:hover .image { opacity: 0.3;}

.img-wrapper:hover .middle {opacity: 1;}

.text {background-color: #000;color: white;font-size: 16px; padding: 15px 35px; margin-left: 10px;}