body { margin: 0px; font-family: "Times New Roman", Times, serif; color:rgb(0, 0, 0); font-size:12px;
       background-color:rgb(255, 255, 255);  text-rendering: optimizespeed; }

a { color:rgb(135, 135, 135);  text-decoration:none; }
a:hover { color:rgb(100, 100, 100);  text-decoration:none; cursor:pointer;
           -moz-transition: all 0.5s ease-out 0s;
           -webkit-transition: all 0.5s ease-out 0s;
           -o-transition: all 0.5s ease-out 0s; } 
a:active { outline-style:none; outline-width :0;}
h1, h2, h3, h4, h5 { font-weight:normal; margin:0; }
img { border: 0 }
input { font-size:12px; font-family: Trebuchet MS, "Arial", sans-serif; }
ul {}
ul li { list-style:none; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.mi { display:inline-flex; vertical-align:middle; }

.util { position:relative; }
#blur { position:absolute; z-index:998; top:0; right:0; background-color:#000; } /* used in recommendation & category loading */
.frame { width: 980px; margin: 0 auto; font-size: 1.1em; }
.gstincl { font-size:8pt; color:#888; display:inline-block; margin:0 0 10px 30px; }

/* Be a Reseller */
a.main-button { display: inline-block; padding: 4px 10px; text-align: center;
    -moz-transition: all 0.5s ease-out 0s;
    -webkit-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    text-decoration: none;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius:  3px;
    border-radius: 3px;
}
a.main-button:focus { outline: 0px none; }

a.reseller { font-size:16px; background-color:rgb(100, 100, 100); color:#fff; position:absolute; top:13px; left:0; }
a.reseller:hover, .reseller:focus {  text-decoration:none; background-color:#ddd; color:#777; }

#header { margin:20px 0; position:relative; }
#header #shopname { text-align:center; height:81px; line-height:81px; white-space:nowrap; }
#header #shopname img { border:0; margin-bottom:28px; margin-right:10px; vertical-align:middle; }
#header #shopname h1 { font-size:42px; color: rgb(48, 48, 48); display:inline-block; line-height:81px; letter-spacing:6px; text-transform:uppercase;
                        -moz-transition: all 0.5s ease-out 0s;
                        -webkit-transition: all 0.5s ease-out 0s;
                        -o-transition: all 0.5s ease-out 0s; }
#header #shopname a:hover h1 { color: #888888; }

/* Search panel */
.slide { position: relative; overflow: hidden; width: 248px; display:inline-block; white-space:nowrap;
         margin-bottom:-8px; margin-right:5px; }
#clickSlide { margin-left:10px; margin-bottom:-2px; background:url('images/theme015.png') no-repeat 0 -367px; width:14px; height:14px; display:inline-block; }

/* My Account */
#acc { margin:0; padding:0; text-align:right; font-size:11px; color:rgb(135, 135, 135);  text-align:right;
      -webkit-font-smoothing: subpixel-antialiased; }
#acc span { line-height:50px; display: inline-block; }

/* Main Menu */
.menu { text-align:center; }
.menu a {  display: inline-block; color:rgb(153, 153, 153);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
  -webkit-font-smoothing: subpixel-antialiased;
  border-bottom: 1px solid #e5e5e5;
  padding: 5px 17px 13px; }
.menu a:hover { color:rgb(100, 100, 100); }

/* Category */
/*.navi-bar { text-align: left; margin-top:20px; }
.navi-bar a { padding:0 15px; font-size:13px; }
.navi-bar .all { display:inline-block; padding: 8px 15px; text-decoration: none; line-height:20px; float:left; color:#000; } 
.navi-bar .all:hover { background-color:#000; color:#fff; border-radius: 3px 3px 0 0; }

#crumbs { height:50px; line-height:50px; position: relative; border-top: 1px solid rgb(196, 202, 197); border-bottom: 1px solid rgb(196, 202, 197); 
          font-size:20px; padding:0 10px; margin-bottom:30px; }
#crumbs a { display:inline-block; margin: 0 5px; color:rgb(20, 20, 20); }
#crumbs a:hover { color:rgb(135, 135, 135); }
*/

/* Header Font */
h1, h2, h3, h4, h5, h6, .util, a.reseller, .footer, .footer a, .page_header, .sub-title, .so, .bc-wrap { font-family: "Varela Round", sans-serif; }

/* Products background */
.product a:hover
{ background-color: #000000; }


.prod {
  float: left;
  clear: both;
  line-height: 0;
  width:100%;
  margin:0 0 0 -20px; width:1000px;
  }


.product, .product_header {
  -webkit-transition: all .35s ease-out;
  -moz-transition: all .35s ease-out;
  -ms-transition: all .35s ease-out;
  -o-transition: all .35s ease-out;
  transition:  all .35s ease-out; }


.product { position: relative; float: left; width: 300px; height: 383px;  margin: 30px 0 30px 30px;  background: transparent; }

.product a { position: static; display: block; overflow: hidden; width: 100%; height: 100%; font-size: 12px; color: #fff !important;
  border-radius: 4px; background: transparent; border: none; }

.product a:hover { color: #fff !important; }

.product .product_header { position: absolute; bottom:0; z-index: 1; opacity: 0; filter: alpha(opacity=0); /* IE6-IE8 */
  width: 280px; display:flex; align-items:center; justify-content:center; padding:0 10px; } /* margin: 55% auto 0;  <-- position middle */

.product_header h1,
.product_header h2,
.product_header h3 {
  margin: 0;
  font-size: 16px;
  line-height: normal;
  font-weight: normal;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.7);
  }

.product_header h1,
.product_header h2 {
  width: 100%;
  margin: 0 auto;
  font-size: 20px;
  letter-spacing: 3px;
  text-transform: uppercase;
  }
.product_header h2 .pc { display:inline-block; background-color:#000; color:#fff; padding:0 5px; margin-right:5px; transition: all 300ms linear 0s; }


.product_header h3 {
  margin-left: -1px;
  }

.product_header h3 span {
  position: relative;
}

.product_header .dash {
  display: block;
  width: 24px;
  height: 1px;
  margin: 6px auto 10px;
  background: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.7);
  }

.product_header .tag {   
  position: absolute;
  top: -13px;
  left: 0;
  text-align:center;
  width:100%;
 }
.product_header h5 {
  font-size: 11px;
  font-style: italic;
  color: #ddd;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.7);
  display:inline-block;
  padding:0 5px;
  }

.product .p-outer { display: table; #position: relative; margin:0 auto; height:383px; }
.product .p-middle { display: table-cell; #position: absolute; #top: 50%; #left:50%; vertical-align: middle; text-align:center; }
.product .p-inner { #position: relative;	#top: -50%; #left:-50%; }

.product_thumb { margin: 0; position:relative; width:300px; }
.product_thumb .so { position:absolute; bottom:0; left:0; width:280px; padding:0 10px; height:30px; line-height:30px; 
                     letter-spacing: 1px; font-size:20px; text-align:center; background-color:#aaa; color:#fff; text-shadow: 0 1px 1px #777; }
.product_thumb img { max-width:300px; max-height:383px; }
.tag-bottom { position:absolute; bottom:0; right:0; }
.tag-bottom .tagSpecialOffer { display:none; width:60px !important; min-width:unset; z-index:2; }
.tag-bottom .tagSpecialOffer.swing {
    animation: swing ease-in-out 1s infinite alternate;
    transform-origin: center 10px;
    float:left;
}
@keyframes swing {
    0% { transform: rotate(6deg); }
    100% { transform: rotate(-6deg); }
}

/* Normal style */
.product_header .price { white-space:nowrap; font-size:20px; font-weight:bold; font-family: "Varela Round", sans-serif; }
.product_header .pricePromo { line-height:20px; font-size:20px; font-weight:bold; font-family: "Varela Round", sans-serif; }
.product_header .strike { font-size:16px; text-decoration:line-through; font-weight:normal; }
.product_header .currencysign { font-size:9px; position:relative; top:-3px; font-family: "Varela Round", sans-serif; }
.product_header .et { font-size:11px; color:#ABD406; margin-top:3px; }  /* Extra light green */
.product_header .qty-left-color { font-size:11px; color:#d15535 !important; margin-top:3px;  font-weight:700} /* light brown */
.product_header .off { font-size:14px; color:#eee; }
.product_header .cdf { font-size:11px; color:#eee; margin-bottom:6px; }

/* Wholesale style */
.product_header .priceBFG { font-size:10px; color:#ccc; line-height:normal; display:block; }
.product_header .ng { margin-bottom:6px; }
.product_header .priceN { font-size:12px !important; font-weight:bold; font-family: "Varela Round", sans-serif; }
.product_header .priceN .strike { font-size:12px !important; }
.product_header .lbl { font-size:11px; display:block; font-weight:normal; margin:0; padding:0; color:#ddd; }
.product_header .priceW { font-size:20px; display:block; font-weight:bold; font-family: "Varela Round", sans-serif; padding-top:3px; }

/* Group Sale Points */
.gspl {margin-top:5px;color:#fff;font-size:12px}
.gspl .iconGroupSalePoints {width:18px;height:18px}
.gspl .dec {padding:0 3px}
.iconGroupSalePoints {background:url('/svg/icon-groupsalepoints.svg'); display:inline-block;}

.product:hover {
 background: transparent;
  }

.product a:hover {
  overflow: hidden;
  -webkit-box-shadow: 0 1px 8px rgba(0,0,0,.4);
  box-shadow: 0 1px 8px rgba(0,0,0,.4);
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  }

.product a:hover .product_header {
  opacity: .9;
  filter: alpha(opacity=90); /* IE6-IE8 */
  margin-bottom: 40%;
  }

.product a:hover .product_thumb {
  opacity: .4;
  filter: alpha(opacity=40); /* IE6-IE8 */
  }

.product a:hover .product_thumb img {
  border-radius: 0;
  }

.prod-nav-con{ clear:both; font-size: 0.9em; padding: 40px 40px 0 0; text-align:right; }
.prod-nav-con .highlight { border:solid 1px #fff; background-color:rgb(100, 100, 100); color:#fff; padding: 8px 10px; width:60px; font-size:13px; 
                           -moz-border-radius: 4px;
                           -webkit-border-radius: 4px;
                           -khtml-border-radius: 4px;
                           border-radius: 4px; }
.prod-nav-con .backnext { border:solid 1px #f8f0ef; background-color:#ece6e9; padding: 8px 10px; font-size:13px; 
                            -moz-border-radius: 3px;
                            -webkit-border-radius: 3px;
                            -khtml-border-radius: 3px;
                            border-radius: 3px; }
.prod-nav-con .backnext:hover { background-color:#fff; }
.prod-nav-con a{ border: 1px solid #f8f0ef; background-color: #ece6e9;	color: #666; padding: 8px 10px; width:60px; font-size:13px; 
                 -moz-border-radius: 3px;
                 -webkit-border-radius: 3px;
                 -khtml-border-radius: 3px;
                 border-radius: 3px; }
.prod-nav-con a:hover{ background-color: #ffffff; cursor:pointer; }


.footer { text-align:center; line-height:22px; margin-bottom:70px; color:#555; }
.footer h5 { font-size:24px; margin:20px 0; text-transform:uppercase; letter-spacing:2px; color:#333; text-shadow: 0 1px 1px rgb(255, 255, 255);}
.footer .text span { display:inline-block; }
.footer .text span.lbl { text-transform:uppercase;  margin-right:10px;
                         font-size:10px; }
.footer a { color:rgb(135, 135, 135); }
.footer .courier {  display:inline-block; margin:2px; background-color:#ffffff; padding:3px; width:110px; text-align:center; border:solid 2px #aaa;
                       -moz-border-radius: 5px;
                       -webkit-border-radius: 5px;
                       -khtml-border-radius: 5px;
                       border-radius: 5px; }
.footer .courier img {max-height:20px;}
           
.copyrights { margin:50px 0; text-align:center; color:#555; font-style:italic; font-size:11px; font-family:Times New Roman; }

/* Login Modal Popup */
.f-modalBackground { 	background-color:Black;	filter:alpha(opacity=60); opacity:0.6; }
.f-shadow {  -moz-box-shadow: 0px 0px 12px #000;
            -webkit-box-shadow: 0px 0px 12px #000;
            box-shadow: 0px 0px 12px #000; 
}
.rounded-corners10 {
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}
a.closePanel { z-index:999; position:absolute; top:-10px; right:-10px; background:url('../../Images/close.png') no-repeat; width:30px; height:30px; display:inline-block; }

.menubg { background-color:#fff; width:440px; position:relative; padding:10px;
           -moz-box-shadow: 0px 0px 12px #000;   
          -webkit-box-shadow: 0px 0px 12px #000;
          box-shadow: 0px 0px 12px #000;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            -khtml-border-radius: 5px;
            border-radius: 5px; }
.menubg table {  padding:0; border-collapse:collapse;  }

/* Subscribe newsletter */
.newsletter1 { position:relative; display:inline-block; height:34px; border:solid 1px #cacecf; width:220px; border-right:0; margin-left:-90px; }
.newsletter1 select { position:absolute; top:8px; left:0; z-index:99; border:0; margin:0; padding:0; }
.newsletter1 input { position:absolute; top:0; left:0; z-index:98; padding: 0 10px 0 60px; color: #666; height:34px; width:150px; border:0;
                     font-family: 'Trocchi', serif;  }
.newsletter1 .topSubscribe { height:34px; width:180px; display:inline-block }

.newsletter2 { position: relative; display:inline-block; height:34px; border:solid 1px #cacecf; border-right:0; width:275px; }
.newsletter2 input { position:absolute; top:0; left:0; padding: 0 10px; color: #666; height:34px; width:255px; border:0; }
.newsletter2 .topSubscribe { height:34px; width:255px; display:inline-block }
.newsletter2 a.submit { height:34px; display:inline-block; position:absolute; top:-1px; left:275px;  padding:0 10px;
                        line-height:36px; color:#fff; border:solid 1px #cacecf; border-radius:0 3px 3px 0;
                        background: -moz-linear-gradient(top, rgba(135, 135, 135, 1) 0px, rgba(135, 135, 135, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: -webkit-linear-gradient(top, rgba(135, 135, 135, 1) 0px, rgba(135, 135, 135, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: -o-linear-gradient(top, rgba(135, 135, 135, 1) 0px, rgba(135, 135, 135, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: linear-gradient(top, rgba(135, 135, 135, 1) 0px, rgba(135, 135, 135, 0.5) 100%) repeat scroll 0% 0% transparent;
                        transition: all 0.5s ease-out 0s; }
.newsletter2 a.submit:hover { background-color:#111; text-decoration:none; color:#fff;
                              background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0px, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0px, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: -o-linear-gradient(top, rgba(0, 0, 0, 0.8) 0px, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0% 0% transparent;
                        background: linear-gradient(top, rgba(0, 0, 0, 0.8) 0px, rgba(0, 0, 0, 0.5) 100%) repeat scroll 0% 0% transparent; }
.newsletter2 .loading { position:absolute; top: 10px; left: 365px; }    


.page_header { margin-bottom:30px; text-align:center; }
.page_header h1 { font-size: 24px; text-transform: uppercase; letter-spacing:2px; }
.page_header .dash {
  display: block;
  width: 24px;
  height: 2px;
  margin: 6px auto 10px;
  background: #000;
  text-shadow: 0 1px 2px rgba(0,0,0,.7);
  }
.sub-title { color: rgb(48, 48, 48); padding:40px 0 10px; font-size:18px;  text-transform: uppercase; text-align:center; }

.page-section { margin-bottom:40px; color:#444; }
.page-section:before, .page-section:after { content: ""; display: table; }
.page-section:after { clear: both; }
.page-section p { word-wrap:break-word; }
.page-section img { max-width:750px; margin:0 auto; }

/* new category menu using ajax */
.bc-wrap { position: relative; padding:10px 0; border-bottom: 1px solid rgb(236, 236, 236); }
/* #breadcrumb { display:inline-block; font-size: 16px; line-height: 20px; padding: 9px 20px; margin-left:50px; font-weight: bold; } */
#breadcrumb span { margin:0 3px; }
#breadcrumb a { font-size: 16px; text-decoration: none; }
/* .menubtn { font-size: 16px; line-height: 20px; font-weight:bold; color:#333; display:inline-block; 
           border: 1px solid #aaa; border-radius:5px; padding:8px 15px; background-color:#fff;
           background: -moz-linear-gradient(center top, #fff 0px, #ddd 100%) repeat scroll 0% 0% transparent;
           background: -webkit-linear-gradient(top, #fff 0px, #ddd 100%) repeat scroll 0% 0% transparent; }
.menubtn:hover { -moz-box-shadow: 0px 0px 10px #ccc;
                 -webkit-box-shadow: 0px 0px 10px #ccc;
                 box-shadow: 0px 0px 10px #ccc; }
#floatmenu { display:none; position:absolute; top:48px; left:20px; z-index:999999; background-color:#fefefe; overflow:auto; 
             border:solid 1px #999; box-shadow:0 1px 10px #999; width:245px; border-radius:10px; }
#floatmenu ul { margin:0; padding:0; }
#floatmenu ul li { margin:0; padding:0; list-style-type:none; line-height:30px; }
#floatmenu a { display:block; line-height:30px; padding:0 10px 0 20px; color:#444; border-bottom:solid 1px #cacaca;
               white-space: nowrap; text-overflow: ellipsis; overflow:hidden; position:relative; }
#floatmenu a:hover, #floatmenu a.selected:hover { background-color:#c4c4c4; cursor:pointer; }
#floatmenu a:active { background-color:#c9c9c9; color:#fff; } 
#floatmenu a.selected { font-weight:bold; padding:0 10px; background-color:#eaeaea; }
#floatmenu a .loading { position:absolute; top:7px; right:26px; background:url('../../images/loading.gif') no-repeat; height:16px; width:16px; }
#floatmenu a .ico-right { position:absolute; top:7px; right:7px; }
#floatmenu a .tick { position:absolute; top:0; right:7px; line-height:30px; } */
/* NEED FOR THEME 015 */
#floatmenu a .ico-right .arrow { position:relative; top:14px; left:0; }

/* Category Arrow - temporary solution for page browsing */
/* .ico-right { background:url('../../images/MasterImage(SBuy).png') no-repeat -743px -326px; width:14px; height:16px;  } */
.ico-left { background:url('../../images/MasterImage(SBuy).png') no-repeat -757px -326px; width:14px; height:16px; } 

#breadcrumb, .secTitle { display:block; line-height:30px; font-size: 16px; font-weight:bold; padding:10px 20px 10px 20px; background-color:#f0f0f0;
                         position:relative; border-top:solid 5px #dadada; }
.secTitle span { position:absolute; right:20px; font-size:12px; color:#888; }
.secTitle:hover, .secTitle:focus { background-color:rgba(255, 216, 0, 0.2); }
.seemore { text-align:center; margin:0 0 20px 0; }
.seemore a,  .resellerRF { display:inline-block; padding: 8px 20px; font-size:16px; background-color:#000; color:#fff; font-weight:bold; }
.seemore a:hover, .resellerRF:hover { box-shadow:0 0 10px #555; }

/* countdown for product */
.countdownp { }
.countdownp .num { font-size:10px; display:inline-block; }
.countdownp .h { display:inline-block; margin:0 4px 0 1px; }
.countdownp .over { font-size:12px; }

/* Category Banner */
.categoryBannerText { margin:80px 0 0; font-family: "Varela Round", sans-serif; }

/* Combo */
.cof { background:unset !important; background-color:rgba(255, 216, 0, 0.8) !important; }
.cof:hover { box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); }

/* Just Purchase */
.justPurchase { display:none; position:fixed; left:10px; bottom:-80px; width:320px; background-color:#fcfcfc; box-shadow:0px 0px 2px rgba(0,0,0,0.5); height:80px;
                border-radius:3px; border:solid 1px #259959; font-family:Arial; color:#555; z-index:50; }
.justPurchase .purchase-text { font-size:0.8rem; color:#555; line-height:18px; max-height:36px; overflow:hidden; }
.justPurchase .purchase-prod { font-size:0.8rem; height:18px; line-height:18px; color:#259959; white-space: nowrap; text-overflow: ellipsis; overflow:hidden; }
.justPurchase .purchase-time { font-size:0.7rem; color:#999; padding-top:3px; height:12px; line-height:12px; }

/* Popup TNC at First Page */
.popupTNCWrapper {display:none; position: fixed; background-color:#fff; font-size:12px;}
.popupTNCWrapper .popupTNCHeader {height:40px;line-height:40px; padding:0 10px; background-color:#ff0000; color:#ffffff; font-weight:bold; text-transform:uppercase}
.popupTNCWrapper .innerScrollTNCContent {overflow:auto;}
.popupTNCWrapper .popupTNCContent {padding:10px; padding-bottom:0;}
.popupTNCWrapper .popupTNCButtonAgree {display:inline-block;background-color:#ff0000; color:#fff; padding:10px 16px; font-size:14px;cursor:pointer}

/* Popup AROT at First Page */
.popupAROTWrapper {display:none; position: fixed; background-color:#fff; font-size:20px;}
.popupAROTWrapper .innerScrollAROTContent {overflow:auto;text-align:center}
.popupAROTWrapper .popupAROTContent {padding:10px; padding-bottom:0;}
.popupAROTWrapper .popupAROTButtonAgree {display:inline-block;background-color:#ff0000; color:#fff; padding:10px 16px; font-size:14px;cursor:pointer}
.popupAROTWrapper .inline-flex-center { display:inline-flex; vertical-align: middle; margin-top:-3px;}