@charset "utf-8";
/* CSS Document */
/* =================  desktop 1024px ================= */
@media (min-width: 1200px){
.container {
    width: 1220px;}
}

/* ================= Tablet (landscape) 1024px ================= */
@media only screen and (max-width: 1024px)
{
.container{ width:100%;}

.top-2{ width:80%;}

ul.nav li{ font-size:12px;}

/* products */
.pro-item-wrap a.pro-name{ position:static;}
.pro-item-wrap .image figure img{ width:100%;}
ul.social-links li{ margin:0;}



}


/* ================= Tablet (Portrait) 768px - 959px ================= */
@media only screen and (max-width: 999px)
{
.container{ width:100%;}
.row{ padding:0px; margin:0;}

/* logo */
.logo{ margin-right:0; width:15%;}
.logo img{ max-width:100%;}

.top-2{ width:84%; float:right;}

/* nav section */
.nav-section{ width:100%; float:none;}
ul.nav li{ font-size:12px;}
ul.nav li a{ padding:13px 6px;}

.inner-abouts h3{ font-size:21px;}
a.refer{ font-size:14px !important;}


.dtl-des_cont{ height:431px; overflow:auto;}

/* carousel */
.carousel{ height:164px;}
.pro-item-wrap .image{ width:279px;}

.pro-item-wrap a.pro-name{ position:static;}

.custom-social{ width:100%; text-align:center;}


.foot-logo img{ max-width:100%;}

.quick-links{ width:48%;}
.quick-links a{ width:67%;}

.custom-social{ clear:both; width:100% !important; text-align:center !important;}
.col-wrap{ width:33.33%;}
ul.social-links{ float:none;}
.item-wrap:hover .name{ display:none;}
}

/* ================= mobile (landscape) 515 ================= */
@media only screen and (max-width: 515px)
{
/* logo */
.logo{ width:100%; text-align:center; margin-bottom:20px;}
.top-2{ width:100%; text-align:center;}
.top-2 .logo2{ width:100%; text-align:center; margin-bottom:20px;}
.top-2 .logo2 img{ max-width:90%;}

.top-2 .right-links{ float:none; width:80%; margin:auto; display:block; text-align:center;}
.top-2 .right-links ul.links li{ float:none; display:inline-block; text-align:center;}


/* nav */
.header{padding-bottom:0px;}
.navbar-toggle .icon-bar{ background-color:#000000; padding:2px 3px;}
.nav-section{ width:100%; margin:0 !important;}
ul.nav li a{ padding:10px 15px!important; border-bottom:1px solid #666; background-color:#333; color:#fff;}
ul.nav li a:hover{ background-color:#ea9703; color:#333;}
.main-nav{ margin:0 !important;}
.navbar-header{padding:0; margin:0 !important;}

/* scroller */
.carousel{ height:164px;}
.carousel-control.right{ right:0px;}
.carousel-control.left{ left:0px;}

/* products */
.pro-item-wrap .image{ width:279px;}
.pro-item-wrap a.pro-name{ position:static;}

/* social icons */
.col-wrap{ text-align:center; height:auto;}
ul.social-links{ float:none; display:block; border-bottom:1px solid #c3c2c0; padding:10px 0;}
.ul.social-links li{ display:inline-block; text-align:center !important; float:none !important;}

.details{border-bottom:1px solid #c3c2c0; padding:10px 0; text-align:left;}

/* footer */
.quick-links{ width:100%;}
.quick-links a{ display:block; width:100%;}
.foot-logo{ float:none; text-align:center; clear:both; padding-top:20px;}
.copyright{ padding:20px 0; border-radius:0;}

/* footer */
.slide-menu{ display:none; padding:10px;}
.quick-links{ padding:0px;}
.quick-links a{ display:block; width:100%; padding:5px 0; border-bottom:1px solid #fff;}
.quick-links h3{ font:400 20px/20px Roboto, sans-serif; color:#fff; padding:0px 0px 10px 0px; border-bottom:1px solid #e5e5e5; background:url(../images/open.png) no-repeat 97% center; cursor:pointer; display:block; outline:none; margin:0; padding:10px 0;}
.quick-links h3.f_act{background:url(../images/close.png) no-repeat 97% center; outline:none;}
.quick-links h3 a{font:400 20px/20px Roboto, sans-serif; color:#fff; display:block; float:none; width:100%; text-transform:uppercase; padding-left:10px; outline:none; border-bottom:0;}
.quick-links h3 a:hover{ text-decoration:none;}

.item-wrap:hover .name{ display:none;}
a.refer{display:none;}
.inner-abouts p{ padding:0 10px;}
.foot-logo img{ max-width:50%;}

}

/* ================= Mobile (Landscape) 480px - 767px ================= */
@media only screen and (max-width: 767px) 
{
/* logo */
.logo{ width:100%; text-align:center; margin-bottom:20px;}
.top-2{ width:100%; text-align:center;}
.top-2 .logo2{ width:100%; text-align:center; margin-bottom:20px;}
.top-2 .logo2 img{ max-width:90%;}

.top-2 .right-links{ float:none; width:80%; margin:auto; display:block; text-align:center;}
.top-2 .right-links ul.links li{ float:none; display:inline-block; text-align:center;}


/* nav */
.header{padding-bottom:0px;}
.navbar-toggle .icon-bar{ background-color:#000000; padding:2px 3px;}
.nav-section{ width:100%; margin:0 !important;}
ul.nav li a{ padding:10px 15px!important; border-bottom:1px solid #666; background-color:#333; color:#fff;}
ul.nav li a:hover{ background-color:#ea9703; color:#333;}
.main-nav{ margin:0 !important;}
.navbar-header{padding:0; margin:0 !important;}

/* scroller */
.carousel{ height:164px;}
.carousel-control.right{ right:0px;}
.carousel-control.left{ left:0px;}



/* social icons */
.col-wrap{ text-align:center; height:auto;}
ul.social-links{ float:none; display:block; border-bottom:1px solid #c3c2c0; padding:10px 0;}
.ul.social-links li{ display:inline-block; text-align:center !important; float:none !important;}

.details{border-bottom:1px solid #c3c2c0; padding:10px 0; text-align:left;}

/* footer */
.quick-links{ width:100%;}
.quick-links a{ display:block; width:100%;}
.foot-logo{ float:none; text-align:center; clear:both; padding-top:20px;}
.copyright{ padding:20px 0; border-radius:0;}

/* footer */
.slide-menu{ display:none; padding:10px;}
.quick-links{ padding:0px;}
.quick-links a{ display:block; width:100%; padding:5px 0; border-bottom:1px solid #fff;}
.quick-links h3{ font:400 20px/20px Roboto, sans-serif; color:#fff; padding:0px 0px 10px 0px; border-bottom:1px solid #e5e5e5; background:url(../images/open.png) no-repeat 97% center; cursor:pointer; display:block; outline:none; margin:0; padding:10px 0;}
.quick-links h3.f_act{background:url(../images/close.png) no-repeat 97% center; outline:none;}
.quick-links h3 a{font:400 20px/20px Roboto, sans-serif; color:#fff; display:block; float:none; width:100%; text-transform:uppercase; padding-left:10px; outline:none; border-bottom:0;}
.quick-links h3 a:hover{ text-decoration:none;}

/* donwload catalog */
.logo{ margin-top:50px;}
.download-catalogue{ top:0; right:auto !important; width:100%; text-align:center;}
.nav-pills > li{ float:none; display:inline-block;}
ul.nav li a{ background-color:#eee;}
.dropdown-menu{ padding:0 !important;}
.download-catalogue ul.nav li{ background-color:#eee !important;}
.item-wrap:hover .name{ display:none;}
a.refer{display:none;}
.inner-abouts p{ padding:0 10px;}

.foot-logo img{ max-width:50%;}
.details p{ font-size:14px;}
.sitemap a{ float:none; width:98%;}

.pro-item-wrap .image{ width:253px;}

}


/* ================= Mobile (Portrait) below 480px  ================= */
@media only screen and (max-width: 479px)
{
/* logo */
.logo{ width:100%; text-align:center; margin-bottom:20px;}
.top-2{ width:100%; text-align:center;}
.top-2 .logo2{ width:100%; text-align:center; margin-bottom:20px;}
.top-2 .logo2 img{ max-width:90%;}

.top-2 .right-links{ float:none; width:80%; margin:auto; display:block; text-align:center;}
.top-2 .right-links ul.links li{ float:none; display:inline-block; text-align:center;}


/* nav */
.header{padding-bottom:0px;}
.navbar-toggle .icon-bar{ background-color:#000000; padding:2px 3px;}
.nav-section{ width:100%; margin:0 !important; position:static;}
ul.nav li a{ padding:10px 15px!important; border-bottom:1px solid #666; background-color:#333; color:#fff;}
ul.nav li a:hover{ background-color:#ea9703; color:#333;}
.main-nav{ margin:0 !important;}
.navbar-header{padding:0; margin:0 !important;}

/* scroller */
.carousel{ height:164px;}
.carousel-control.right{ right:0px;}
.carousel-control.left{ left:0px;}

.pro-item-wrap a.pro-name{ position:static;}

/* detail page */
.dtl_images{ display:none;}
.thm_img{ display:none;}
.mobile-view{ display:block; width:100%;}
.mobile-view img{ max-width:100%;}

/* social icons */
.col-wrap{ text-align:center; height:auto;}
ul.social-links{ float:none; display:block; border-bottom:1px solid #c3c2c0; padding:10px 0;}
.ul.social-links li{ display:inline-block; text-align:center !important; float:none !important;}

.details{border-bottom:1px solid #c3c2c0; padding:10px 0; text-align:left;}

/* footer */
.quick-links{ width:100%;}
.quick-links a{ display:block; width:100%;}
.foot-logo{ float:none; text-align:center; clear:both; padding-top:20px;}
.copyright{ padding:20px 0; border-radius:0;}

/* footer */
.slide-menu{ display:none; padding:10px;}
.quick-links{ padding:0px;}
.quick-links a{ display:block; width:100%; padding:5px 0; border-bottom:1px solid #fff;}
.quick-links h3{ font:400 20px/20px Roboto, sans-serif; color:#fff; padding:0px 0px 10px 0px; border-bottom:1px solid #e5e5e5; background:url(../images/open.png) no-repeat 97% center; cursor:pointer; display:block; outline:none; margin:0; padding:10px 0;}
.quick-links h3.f_act{background:url(../images/close.png) no-repeat 97% center; outline:none;}
.quick-links h3 a{font:400 20px/20px Roboto, sans-serif; color:#fff; display:block; float:none; width:100%; text-transform:uppercase; padding-left:10px; outline:none; border-bottom:0;}
.quick-links h3 a:hover{ text-decoration:none;}

/* donwload catalog */
.logo{ margin-top:50px;}
.download-catalogue{ top:0; right:auto !important; width:100%; text-align:center;}
.nav-pills > li{ float:none; display:inline-block;}
ul.nav li a{ background-color:#eee; color:#333;}
.dropdown-menu{ padding:0 !important;}
.download-catalogue ul.nav li{ background-color:#eee !important;}

.item-wrap:hover .name{ display:none;}
a.refer{display:none;}
.inner-abouts p{ padding:0 10px;}

.foot-logo img{ max-width:50%;}


.col-wrap{ width:33.33%;}
.sitemap a{ float:none; width:98%;}
.pro-item-wrap .image{ width:253px;}

.details{ height:150px;}

}



