@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600|Oswald:300,400,500,600,700|Roboto+Condensed:400,700');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
@import url('https://fonts.googleapis.com/css?family=Raleway:400,300,100,600,700');

body{ padding:0; margin:0; font:400 12px/14px "Roboto",sans-serif; }
*{ box-sizing:border-box; padding:0; margin:0;}
div:after, ul:after, ol:after{ clear:both; content:""; display:table;}
img{ max-width:100%; vertical-align:middle;}
a:link, a:visited{ text-decoration:none !important;}
ul, ol{ list-style-type:none; padding:0; margin:0;}

.container { width:1200px; margin:0 auto; vertical-align:top;}
.container {box-shadow: 0 -5px 5px #000;}
#header-section img, #slider img, #shiping img, #photo-section img, #page-content img, #footer-section img{ max-width:100%;}
#header-section{ position:relative; z-index:12;}
.header-top{ background:#2b2b2b; padding-top:15px; padding-bottom:15px;}

#navigation-section{ background:#18b0c7;}
.call{ font:bold 32px/48px Arial, Helvetica, sans-serif; color:#fff; background:url(../images/call.png) no-repeat 0 50%; padding:0 0 0 60px; float:right; margin:15px 15px 0 0;}
#search {float:left;overflow: hidden;position: relative;width:230px; height:40px;  border:solid 1px #aaaaaa; border-radius:30px; margin: 0 0 0 8px;}
#search input[type="text"] {background: #fff;border: 0 none;font:400 14px/40px "Roboto",sans-serif;height:40px;text-indent: 10px;width:calc(100% - 40px); color:#000000; }
#search input[type="submit"], #search input[type="button"] {background:#fff url(../images/icon9.png) no-repeat scroll 50% 50%;border: 0 none;height:40px;position: absolute;right: 0;top: 0;width: 40px; cursor:pointer; font-size:0; border-left:solid 1px #ccc;}
.top_white{ background:#fff;}
#logo{ float:left; padding:0 0 0 15px;}

#nav-btn{ display:none;}
#navigation-panel{ position:relative;  background:#04006e;}
#navigation-panel ul{ margin-bottom:0; float:right;}
#navigation-panel ul li{ float:left; position:relative;}
#navigation-panel ul li+li{}
#navigation-panel ul li a{ display:block; color:#fff;font:bold 14px/44px Arial,Helvetica,sans-serif; text-transform:capitalize; padding:0 18px;}
#navigation-panel ul li ul li a{ padding:0 15px;}
#navigation-panel ul li a:hover, #navigation-panel ul li a:focus{ color:#fff; }
#navigation-panel ul li:first-child a{ color:#fff;  }
#navigation-panel ul li.hasmenu > a{ background-image:url(../images/submenu.png); background-repeat:no-repeat; background-position:calc(100% - 15px) 50%; cursor:pointer;}
#navigation-panel ul li .submenu{ display:none;}
#navigation-panel ul ul{ position:absolute; left:0; top:100%; background:#3c1706; min-width:230px; display:none; border-radius:0 0 4px 4px; z-index:
99;}
#navigation-panel ul ul ul{ position:absolute; left:100%; top:0; background:#682303; box-shadow:0 0 5px #000;}
#navigation-panel ul ul li{ float:none; padding:1px 0 0;}
#navigation-panel ul ul li a{ white-space:nowrap; font:400 17px/40px 'Roboto', sans-serif;}
#navigation-panel input[type="checkbox"]{ display:none;}
#navigation-panel input[type="checkbox"]:checked+ul{ display:block;}

#shiping{ position:relative; z-index:10; width:1200px; margin:0 auto; box-shadow:0 -5px 5px #000; background:#2b2b2b; padding:6px 0; }
#shiping > div{ width:33.333%; float:left; text-align:center;font:400 20px/22px "Raleway",sans-serif; color:#fff; text-transform:uppercase; box-sizing:border-box; min-height:60px;}
#shiping > div+div{ border-left:1px solid #fff;}
#shiping > div > div{ display:inline-block; position:relative; padding:10px 0 0 90px; text-align:left;}
#shiping span{ font-weight:600; display:block;}
#shiping img{ position:absolute; left:0; top:0;}

#page-content h1 span {
    background: rgba(0, 0, 0, 0) url("../images/line.jpg") repeat-x scroll 0 100%;
    display: inline-block;
    padding: 0 15px 10px 0;
}
 

.gallery-section { display:block; overflow: hidden; position:relative; text-align:center; margin:0 auto; max-width:700px;}
.image-holder{ padding:5px; border:1px solid #c2c2c2;}
.gallery-section .image-holder img{ border:0;}
.gallery-section ul{ list-style-type:none; margin:0;}
.gallery-section:after, .gallery-section div:after, .gallery-section ul:after{  clear: both; content: ""; display: block; line-height: 0; visibility: hidden;}
.gallery-section img{ border:solid 1px #ccc;  height: auto;  max-width: 100%; vertical-align: middle;}
.product-img-box{ display:block; overflow:hidden; position:relative;}
.product-img-box ul li+li{ display:none;}
.product-thumb {  margin: 0 0 -20px;  padding: 12px 0 20px;  z-index: 999;}
.product-thumb ul li {  float: left; padding: 3px !important;  text-align: center;  width:25%; box-sizing:border-box;}
.product-thumb ul li:nth-child(4n+1){ clear:left;}
.gallery-section .image-holder img{ box-shadow:none;}
.gallery-section label{ cursor:pointer;}
.image-holder input[type="radio"]{ display:none;}
.image-holder input[type="radio"]:checked+img{ opacity:1; position:relative; left:auto; top:auto;}
.image-holder input[type="radio"]+img{ opacity:0;transition: all 900ms ease-out 0s; position:absolute; left:-200%; top:-200%;}

.tab-content > label, .tab-content > a{/* background: #1d1d1d;  color: #000; display:inline-block;font:300 20px/47px 'Oswald', sans-serif;  margin-bottom:0; cursor:pointer; text-transform:uppercase; height:47px; text-align:center; border:none; margin-right:25px;*/

-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #fff none repeat scroll 0 0;
    border-color: #ccc #ccc currentcolor;
    border-image: none;
    border-radius: 5px 5px 0 0;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    color: #333;
    display: inline-block;
    font: 400 14px/46px "Raleway",sans-serif;
    padding: 0 25px;
    text-transform: uppercase;
	cursor:pointer;}
.tab-content input[type="radio"]{ display:none;}
.tab-content input[type="radio"]:checked+label, .tab-content > label:hover, .tab-content > a:hover{     -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #04006e none repeat scroll 0 0;
    border-color: #ccc #ccc currentcolor;
    border-image: none;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    color: #fff;
    text-decoration: none;}
.tab-content > div{ display:none;}
.accordion-content{ padding:5px; border:solid 1px #ccc; border-radius:5px;}
.accordion-heading{ font:400 16px/30px 'Raleway', sans-serif; padding:1px 18px; color:#313131; border-radius:4px 4px 0 0; border:1px solid #ececec; cursor:pointer; background:#c9cfcd;}
.accordion-heading.ui-accordion-header-active{ color:#fff; background:#77c9b5;}
.accordion-content p{ font:400 13px/23px  'Raleway', sans-serif;color:#3c1706; padding:10px 0 0;}
#tab1:checked ~ #content1, #tab2:checked ~ #content2, #tab3:checked ~ #content3, #tab4:checked ~ #content4, #tab5:checked ~ #content5, #tab6:checked ~ #content6   {    display: block;}

#details-left{ width:50%; float:left;}
#details-right{ width:48%; float:right;}
#details-right h1{ color: #151515;font: 600 24px/26px "Raleway",sans-serif;margin: 0 0 15px; }
#details-right h2{  color: #0c0c0c;
    font: 20px/22px "Roboto",sans-serif;
    margin: 0 0 10px;
    text-transform: uppercase;
}
#details-right h3{ color:#393939; font:400 15px/18px "Roboto",sans-serif;  padding:0 0 8px; }
#details-right p{ color:#464545; font:400 14px/20px "Roboto",sans-serif; padding:0 0 10px;}
#details-right .price{ color: #04006e;
    font: 400 26px/30px "Roboto",sans-serif;
    padding: 15px 0 0;}
.boynow {
    background: #04006e none repeat scroll 0 0;
    border: 2px solid #004550;
    border-radius: 30px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font: 400 18px/46px "Roboto",sans-serif;
    margin: 15px 0 0;
    padding: 0 40px;
}
.grey_box{ background:#ebebeb; padding:30px;position:relative;}
.tab-content{ margin:42px 0;}
.mainhold{ background:#fff; margin:35px 10px;}

#footer-section{ background:#4a4a4a; padding:10px; box-sizing:border-box; margin:20px auto 0; width:1200px;}
#footer-section p{ font:normal 13px/15px Arial, Helvetica, sans-serif; color:#fff;}
.footer-logo{ float:left; width:220px;}
.footer-nav{ float:left; width:750px; text-align:center; padding:20px 0 0;}
.footer-nav ul{ display:inline-block;}
.footer-nav ul li{ float:left;}
.footer-nav ul li a{ color:#fff; display:block; font:normal 13px/15px Arial, Helvetica, sans-serif; padding:0 10px;}
.power{ float:right; width:210px; text-align:right; padding:20px 0 0;}


.slider  .img-details{ position: absolute; left: 0; top: 0; -webkit-transition: all 0.25s; transition: all 0.25s;
 text-align:center; z-index:2; border: 1px solid #ccc; overflow: hidden; background: #FFF; height:590px; width:590px;}
.slider .grid-wrapper {  -webkit-flex-wrap: wrap;  -ms-flex-wrap: wrap;  flex-wrap: wrap; position:relative; margin:0 auto; height:590px; width:590px;}
 
.slider{	width: 100%;	display:inline-block;	position:relative;	padding:0px;}
.slider .grid-item {  height: 20%;  width: 20%;  position:relative;  z-index:2;  background:#ccc;  opacity:0;  float:left}

.slider .grid-item:hover:nth-of-type(5n + 1) ~ .img-details img{ left: 0px; }
.slider .grid-item:hover:nth-of-type(5n + 2) ~ .img-details img { left: -25%; }
.slider .grid-item:hover:nth-of-type(5n + 3) ~ .img-details  img{ left: -50%; right:auto;}
.slider .grid-item:hover:nth-of-type(5n + 4) ~ .img-details  img{ right: -25%; left:auto; }
.slider .grid-item:hover:nth-of-type(5n + 5) ~ .img-details  img{ right: 0%; left:auto; }
.slider .grid-item:hover:nth-of-type(1n + 1) ~ .img-details img { top: 0px; }
.slider .grid-item:hover:nth-of-type(1n + 6) ~ .img-details  img{ top: -25%; }
.slider .grid-item:hover:nth-of-type(1n + 11) ~ .img-details img { top:-50%; bottom:auto;}
.slider .grid-item:hover:nth-of-type(1n + 16) ~ .img-details  img{ bottom:-25%; top:auto;}
.slider .grid-item:hover:nth-of-type(1n + 21) ~ .img-details  img{ bottom:0;  top:auto;}




.slider .grid-item ~ .img-details img{ position:absolute; top:0; left:0; max-width:100%}
.slider .grid-item:hover ~ .img-details img{  width: 150%;  height:auto;  max-width:150%;  max-height:150%}
.slider input[name='slide_switch'] { display: none;}
.slider label { margin: 13px 0.5% 0; cursor: pointer; transition: all 0.5s; opacity: 1; float:left; width:24%;}
.slider span {  text-align:center; display:block; border: 1px solid #ccc;}
.slider #id5 + label,.slider #id10 + label,.slider #id15 + label{margin-right:0;}
.slider  span:has(img[src=""]){display:none;}
.slider label img[src=""]{display:none} 
.slider label img{display:none }
.slider label img{display:block !important; width:100%; }
.slider input[name='slide_switch'][value != ""] + label {display:  inline-block !important}
.slider input[name='slide_switch'][value != ""] + label + .img-details{display:  inline-block !important}
.slider input[name='slide_switch'][value=""] + label{display: none !important}
.slider input[name='slide_switch'][value=""] + label + .img-details{display:  none !important}
.slider input[name='slide_switch']:checked+label { opacity: 1;}
.slider input[name='slide_switch']:checked+label span, .slider span:hover { border-color: #ccc; }
.slider input[name='slide_switch'] ~ .img-details { opacity: 0; display:none;}
.slider input[name='slide_switch']:checked + label + .img-details { opacity: 1; display:inline-block; z-index:1;}
.slider label + .img-details { opacity: 1; display:block; z-index:1;}
.img-details {  transition: all 300ms ease-out 0s;}
.slider .grid-item:nth-child(5n+1){ clear:left;}


@media only screen and (max-width: 1198px) {
.container { width:1000px;}
#navigation-panel ul li a {padding: 0 35px;}
.slider  .img-details, .slider .grid-wrapper{ width:490px; height:490px;}

.rs-pview{ margin:0 !important;}
#footer-section{ width:1000px;}
#shiping, #photo-section, #page-content, #footer-section{    width: 970px;}
#shiping img{ width:55px; top:10px;}
#shiping > div{ font:400 18px/20px "Raleway",sans-serif;}
#shiping > div > div { padding: 10px 0 0 60px;}

}
@media only screen and (max-width: 990px) {
.container { width:750px;}
#navigation-panel ul li a {    padding: 0 10px;}
#details-left{ width:100%; float:none;}
#details-right{ width:100%; float:none; padding:15px 0 0;}
#footer-section{ width:750px;}

#shiping, #photo-section, #page-content, #footer-section{    width: 750px;}
.footer-nav{ display:none;}
.call{ font-size:26px;}
#shiping{ padding:0;}
#shiping > div{ width:50%; margin:5px 0; font:400 17px/20px "Raleway",sans-serif;}
#shiping > div+div{ border-left:0;}
#shiping > div:nth-child(2n+2){ border-left:1px solid #fff;}


}
@media screen and (max-width: 767px) {
.container { width:auto; width:98%;}
.tab-content > label, .tab-content > a{ width:100%; padding:0; margin:5px 0 0; text-align:center;}
#footer-section{ width:98%;}


#logo{ width:54%;}
.heading{ border:none; font-size:20px; line-height:22px; padding:0 0 40px; text-align:center;}
#search{ float:none; margin:10px auto 0; width:240px; }
#header h2{ float:none; text-align:center; display:block;}
.call_icon{ float:none; margin:0 auto; display:table; text-align:center;}
.heading{ border:none; font-size:20px; line-height:22px; padding:0 0 40px; text-align:center;}
.product_sec{ padding:14px;}

.header-top{ text-align:center;}
.call{ display:inline-block; float:none;}
#logo{ float:none; text-align:center; margin:0 auto; padding:0;}
.heading{ border:none; font-size:20px; line-height:22px; padding:0 0 40px; text-align:center;}
#search{ float:none; margin:10px auto 0; width:240px; }
#header h2{ float:none; text-align:center; display:block;}
.call_icon{ float:none; margin:0 auto; display:table; text-align:center;}
.heading{ border:none; font-size:20px; line-height:22px; padding:0 0 40px; text-align:center;}
.product_sec{ padding:14px;}


#navigation-panel{ padding:0; /* width:50px; margin:32px 0 0 0;*/ position:relative; z-index:99; }
#nav-btn{ display:block; /*margin:10px 5px 0;*/ background:url(../images/navigation.png) no-repeat 0 50%; font-size:18px; height:32px; color:#fff; text-transform:uppercase; cursor:pointer; border-radius:4px; border:solid 1px #ccc; text-align:right; line-height:32px;}
#navigation-panel ul{ width:290px; display:none; padding:0; background:#666; box-shadow:0 0 4px #323232; position:absolute; right:0; top:100%;}
#navigation-panel ul li, #navigation-panel ul li:last-child{ float:none; text-align:left;}
#navigation-panel ul li, #navigation-panel ul li+li{ background:none; border-top:solid 1px #323232; padding:0; border-left:none;}
#navigation-panel ul li a{ line-height:40px;}
#navigation-panel ul li.hasmenu > a{ display:block;}
#navigation-panel ul li.hasmenu .submenu{ background:url(../images/submenu.png) no-repeat 50% 50%; width:14px; height:14px; display:block; position:absolute; top:10px; right:5px; display:block;}
#navigation-panel ul li.hasmenu > a{ background-image:none;}
#navigation-panel ul ul{ position:relative; width:auto; min-width:inherit; top:auto; left:auto; background:#57250e; margin:0 4px; border-radius:4px;}
#navigation-panel ul ul ul{ position:relative; left:auto; top:auto;}

#shiping, #photo-section, #page-content{ width:calc(100% - 10px); margin-left:5px; margin-right:5px; }
.slider  .img-details, .slider .grid-wrapper{ width:360px; height:360px;}
#shiping > div > div{ width:300px;}
.footer-logo{float:none; margin:0 auto; text-align:center;}
.power{ float:none; text-align:center; width:100%;}
}
@media only screen and (max-width: 550px) {
#category-options > div {  padding: 15px 8px 0; width:100%; float:none;}

}
@media only screen and (max-width: 490px) {

.slider  .img-details, .slider .grid-wrapper{ width:290px; height:290px;}
#shiping{ padding:0;}
#shiping > div{ width:100%; margin:5px 0;}
#shiping > div+div{ border-left:0; border-top:1px solid #fff;}
#shiping > div:nth-child(2n+2){ border-left:0px solid #fff;}

}