@font-face {
    font-family: OpenSans;
    src: url('../fonts/Open_Sans/OpenSans-Regular.ttf');
}
@font-face {
    font-family: OpenSans;
    src: url('../fonts/Open_Sans/OpenSans-Bold.ttf');
	font-weight:bold;
}
@font-face {
    font-family: OpenSans;
    src: url('../fonts/Open_Sans/OpenSans-Light.ttf');
	font-weight:200;
}

body{margin:0px; font-family: 'OpenSans', serif !important;}
body a{text-decoration:underline; color:#6699FF}  

.content-wrapper{max-width:1000px; margin:auto; margin-top:1em; padding:0 0.5em; }
*:focus {    outline: 0 !important;}

.show-mobile{display:none}
.hide-mobile{display:inherit} 

.link {cursor:pointer} 
  
.page {clear:both; margin-top:1em; list-style:none;margin:0px;padding:0px;text-align:center;  } 
.page li{padding:0.2em 0.5em !important; font-size:0.9em; margin:0 0.3em !important;  text-align:center !important;width:30px; color: #333; display:inline-block; }
.page li:hover{text-decoration:underline}
.page-active{ background-color:#1699a6 !important;color:#fff !important;  text-decoration:none !important; } 
	
.prev-next-page {display:none; padding:0; text-align:center} 
.prev-next-page li {width:22%; background-color:#1699a6; color:#fff; margin:1% !important;text-decoration:none !important; display:inline-block; padding:0.5em 0;}
.prev-next-page li:hover {background-color:#C30}
.inactive-prev-next-page { background-color:#dedede !important; color:#333 !important;}

.content-title {font-size:1.3em;  margin-bottom:1em; border-left:0.5em solid #1699a6; padding-left:0.5em;}
.content-title  .div-table{width:100%}
.content-title .grid-layout {background-position:0px 0px !important; margin:0.5em 0.3em 0 0; float:right; cursor:pointer;}
.content-title .list-layout {background-position:-25px 0px !important;margin:0.5em 0.3em 0 0;  float:right; cursor:pointer;}

.icon-coll { background-image: url(../img/icon-coll.svg); background-repeat: no-repeat; height: 20px; width: 20px; }

.footer{height:3em; clear:both;  }
.footer .panel-data { border:0;}
.footer .mobile-panel {display:none; background-color:#1699a6; color:#fff; position:fixed; bottom:0; width:100%; padding:0.5em; text-align:center;}

.scrollToTop {color:#999 !important; text-decoration:none !important; line-height:1em; text-align:center;}
.scrollToTop:hover  {color:#333 !important;  text-decoration:none; }
.scrollToTop .arrow {width: 0;  height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #999; margin:auto; margin-bottom:0.5em;}
.scrollToTop:hover .arrow {border-bottom: 10px solid #333;}
	 
/* default table */ 
.div-table{display:table}
.div-table-col{display:table-cell; vertical-align:top;}
.div-table-col-5{display:table-cell; padding:0.5em; vertical-align:top;}
.div-table-col-3{display:table-cell; padding:0.3em; vertical-align:top;}
.div-table-row{display:table-row;} 
 

#top-menu-bar {background-color:#1699a6; color: #fff; background-image:url(../img/bg-header.jpg); background-repeat:no-repeat; background-position:center; -webkit-box-shadow: inset 0px -8px 36px -13px rgba(0,0,0,0.53); -moz-box-shadow: inset 0px -8px 36px -13px rgba(0,0,0,0.53); box-shadow: inset 0px -8px 36px -13px rgba(0,0,0,0.53);}
.onscroll-top-menu-bar {background-color:#1699a6; height:3em; width:100%; position:fixed; top:0; display:none;z-index:9999 !important}
.scroll-to-top {cursor:pointer; background-position:-50px -25px; }

#btn-side-menu {background: center center no-repeat transparent; background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC ); display: none; width: 2.5em; 	height:3em; position: absolute; top: 0; left: 10px;}
.btn-side-menu {background: center center no-repeat transparent; background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC ); width: 2.5em; height:3em; margin:auto;}

#mmenu-member {background-color:#1699a6; color:#fff; font-weight:200; padding:1.5em; margin-left:-20px !important; margin-right:-20px !important; margin-top:-20px} 
#mmenu-member .Selected {background-color:#2ec3d2}
#mmenu-member .title { font-size:1.2em; }
#mmenu-member ul {list-style:none; padding:0; margin:0.3em 0;}
#mmenu-member ul li{display:inline-block; float:left; margin:0.2em; border-radius:0.2em; background-color:#1699a6; padding:0.2em 0.5em;}
#mmenu-member ul li:hover {background-color:#2ec3d2;} 
#mmenu-member ul li a{color:#1699a6; text-decoration:none;}
#mmenu-member .avatar {width:4.5em; height:4.5em; border:1px solid #cecece; border-radius:15%; padding:0.2em;}
#mmenu-member .avatar .panel-data { width:100%; height:100%; background-color:#1699a6; background-position:center; background-repeat:no-repeat; background-size:contain;}

#main-menu { list-style:none;  padding:0; margin:0; margin-left:2% }
#main-menu li { margin:0; padding:0 1.2em; display:inline-block; float:left; margin:0em 0.1em; line-height:3em;  background-color:#1699a6;}
#main-menu li:hover{background-color:#2ec3d2}
#main-menu .Selected, #main-menu .Selected:hover{color:#1699a6 !important; background-color:#fff !important;}  

#member-menu  { float:right; list-style:none;  padding:0; margin:0; float:right; margin-right:2% }
#member-menu li{ margin:0; padding:0 0.5em; font-size:0.9em; display:inline-block; float:left;  margin:1em 0em 0.8em 0.5em;  line-height:2em; background-color:#1699a6; border-radius:0.3em;} 
#member-menu li:hover, #member-menu .Selected {background-color:#2ec3d2;} 
#mobile-menu-panel {height:3em}
#mobile-menu-panel .company-logo, .onscroll-top-menu-bar .company-logo{height:2em; margin:auto; margin-left:3em;  margin-top:0.5em;   background-repeat:no-repeat; background-position:center; background-size:contain; }
 
#category-menu-bar{ padding:1em 0em;  }
#category-menu-bar .current-category {background-color:#0093AF; color:#fff; font-size:0.8em; padding:0.3em 0.5em; cursor:pointer; display:inline-block;margin-top:0.5em; border-radius:0.3em;}
#category-menu-bar .current-category:hover{background-color:#00788f}
#category-menu-panel{ text-align:left; width:100%; } 
#category-menu-panel ul {list-style:none; display:inline-block; padding:0; margin-top:0.5em; max-width:1100px; width:100% }
#category-menu-panel ul li{ display:inline-block; padding:0.3em 0.2em; font-size:0.9em; text-align:center; color:#333; cursor:pointer; border-bottom:2px solid #0093AF;  margin:0.2em 0.3em}
#category-menu-panel ul li:hover,#category-menu-panel ul .selected {color:#1699a6; border-color:#1699a6} 

#searchbox {float:right;  width:25em;  color:#fff;   margin-right:2%; }
#searchbox input {border-radius:0;}
#searchbox .btn-quick-search {width:3em; cursor:pointer;background-color:#1699a6; }
#searchbox .btn-quick-search:hover {background-color:#2ec3d2}
#searchbox .btn-quick-search .icon-coll{background-position:-75px -25px !important; margin:auto; margin-top:0.5em;}

.camera_wrap_panel{width:100%; margin:auto; margin-top:0.5em;background-color:#fff; height:320px}
.camera_wrap_panel-dummy{max-width:1000px;  margin:auto;  }
.camera_wrap{width:100%;}

 
.item-category-menu ul{list-style:none; margin:auto; padding:0; margin:0; } 
.item-category-menu ul li{float:left; width:33.333%; padding:0.2em;}
.item-category-menu ul li .panel-data { border:1px solid #dedede; border-radius:0; margin:0; padding:0.2em; height:5em; text-align:right;font-size:1.7em; color:#666; background-repeat:no-repeat; background-position:left top; }
.item-category-menu ul li .panel-data:hover {color:#2ec3d2}
 
 
.item-data-card ul{list-style:none; margin:auto; padding:0; margin:0;}
.item-data-card ul li{float:left; width:25%; padding:0.2em; margin-bottom:1em;}
.item-data-card ul li .panel-data { width:100%; height:100%; border:1px solid #cecece; position:relative; border:1px solid #999;   border-radius:0; margin:auto; text-align:left; color:#333; }
.item-data-card ul li .panel-data:hover {color:#2ec3d2;}
.item-data-card ul li .panel-data .image{ height:300px; width:100%;  background-repeat:no-repeat; background-position:center; background-size:contain; }
.item-data-card ul li .panel-data .name {font-size:0.9em; margin:1em 0.4em 2em 0.4em;}
.item-data-card ul li .panel-data .price {  font-size:1.4em; font-weight:200;  position:absolute; bottom:0; right:0.4em; }
.item-data-card ul li .panel-data .stock {  font-size:1em; font-weight:200; color:#fff; padding:0 0.5em; position:absolute; bottom:0.4em; left:0.4em; }
.item-data-card ul li .panel-data .linethrough {text-decoration:line-through; color:#990000; font-size:1em; font-weight:normal;  position:absolute; bottom:1.6em; right:0.6em;} 
 
.section-title  { font-size:1.3em; padding:0.5em 0; margin-top:3em; margin-bottom:1em; border-top:5px solid #1699a6; display:inline-block;}

.text-08{font-size:0.8em;} 
 
.product-list {width:98%; margin:auto}
.product-list ul {padding:0; margin:0; list-style:none;}
.product-list ul li{padding:0; margin:0; padding:0.5em; background-color:#F3F3F3}
.product-list ul li .name{width:65%; float:left; color:#333; }
.product-list ul li .name  a {color:#333;}
.product-list ul li .name  a:hover{color:#1699a6}
.product-list ul li .price {width:20%; float:left; text-align:right; padding:0em 0.5em; }
.product-list ul li .stock {width:15%; float:left; text-align:center; }
.product-list ul li:nth-child(odd) {background-color:#E5E5E5}


.item-detail .price{border:1px solid #dedede; text-align:center; padding:0.5em; font-size:1.7em; color:#009900}
.item-description  {width:98%; margin:auto}
.item-description ul {padding:0; margin:0; list-style:none; text-align:justify; }
.item-description ul li {margin-bottom:2em; font-size:0.9em;}
.item-description ul li .title {color:#000; font-size:1.5em; margin-bottom:0.3em;}

.item-variant {list-style:none; padding:0; margin:0;} 
 
.item-variant li { width:33.33%; overflow:hidden; padding:0.2em; color:#ccc; display:inline-block; float:left; text-align:center;}
.item-variant li .panel-data {border:1px solid #ccc; border-radius:0.5em; line-height:3em;height:3em;}

.item-variant-link .panel-data{border:1px solid #333; color:#333; cursor:pointer;}
.item-variant-link .panel-data:hover {border-color:#1699a6; color:#1699a6;}
.item-variant-link  .selected, .item-variant-link  .selected:hover  {background-color:#1699a6; color:#fff}

.rewards-point .div-table-col-header{ vertical-align:middle; font-weight:bold; border:1px solid #574434; border-left:0; border-right:0; background-color:#fff !important;}
.rewards-point .void-row .div-table-col-5{color:#F00}
.rewards-point .div-table-row:nth-child(odd) .div-table-col-5{background-color:#E5E5E5}
	
#form-cart  {margin:auto}
#form-cart .btn-delete {margin:auto; background-color:#903; color:#fff; padding:0.2em 0.5em; cursor:pointer; text-align:center;}
#form-cart .edit {cursor:pointer; float:left;}  
#form-cart .div-table-col-header{ vertical-align:middle; font-weight:bold; border:1px solid #574434; border-left:0; border-right:0;}
#form-cart .col-footer-t{ border-top:1px solid #dedede;} 
#form-cart .col-footer-b{ border-bottom:1px solid #dedede;} 

.mobile-cart{ text-align:right; vertical-align:middle; color: #fff; line-height:2.8em; }
.mobile-banner img {width:100%}  

.form-default  {min-width:30em; width:50%; margin:auto;}   

.notification-msg{color:#fff; padding:0.3em 0;}
.notification-msg ul{margin:0; padding:0; padding-left:2em}

.button-notify  {color:#fff; background-color:#F30;padding:0.5em 0em; border-radius:0.3em; text-align:center; margin-top:1em; cursor:pointer;}
.button-notify:hover {background-color:#CC3300}

/* This rule is read by Galleria to define the gallery height: */
#galleria{height:500px; } 

/* mm-menu */
.mm-menu .mm-listview > li.mm-selected > a:not(.mm-next),
.mm-menu .mm-listview > li.mm-selected > span {
 color:#2ec3d2;}

/* TEXT COLOR SET */
.text-white {color:#FFF !important;}
.text-green-avocado  {color:#568203 !important;}
.text-red-cardinal  {color:#C41E3A !important;}
.text-yellow-mikado  {color:#FFC40C !important;}
.text-blue-munsell {color:#0093AF !important;}
.text-purple-purpureus{color:#9A4EAE !important;}
.text-black-jet{color:#343434 !important;}
.text-gray-dim{color:#696969 !important}
.text-cobalt-blue{color:#0047AB !important;} 


/* BG COLOR SET */
.bg-green-avocado {background-color:#568203  !important;}
.bg-red-cardinal {background-color:#C41E3A  !important;}
.bg-yellow-mikado {background-color:#FFC40C  !important;}
.bg-blue-munsell {background-color:#0093AF  !important ;}
.bg-blue-steel {background-color:#4682b4  !important ;}
.bg-purple-purpureus{background-color:#9A4EAE   !important;} 
.bg-gray-dim{background-color:#696969   !important;} 

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}


/* ============================ OVERLAY ========================= */	

/* Style for overlay and box */
#popupads  .overlay{position:fixed;top:0px;bottom:0px;left:0px;right:0px; display:none; background-color:#FFFFFF;  } 
#popupads  .box{position:fixed;top:-1000px; width:100%;height:98%;overflow:auto; }
#popupads .title{ font-family:'PT Sans Narrow'; color:#333;font-size:2em;float:left;padding-left:0.5em;}
#popupads .closebutton{ width:50px;height:50px;position:fixed; right:10px; background-position:center;background-image:url(../img/close.png);background-repeat:no-repeat;cursor:pointer; z-index:999;}
#popupads .content{  margin:auto;  width:95%;   margin-top:80px; } 	
/* ============================ OVERLAY ========================= */