﻿/* Custom CSS Responsive for Esa Mall General Site by Ndee Siswandhi */

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1350px) {
footer .footer-bottom {
	width: 90%;
}
}
@media (min-width: 1200px) and (max-width:1349px) {
footer .footer-bottom {
	width: 100%;
}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width:1199px) {
.account-link ul li a img {
	display: none;
}
header .cart-item .cart-box .cart-info {
	float: left;
	margin: 27px 15px 27px 30px;
}
header .logo h1 {
	margin: 14px 0 15px 0;
}
footer .footer-bottom {
	width: 100%;
}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width:991px) {
.account-link ul li a img {
	display: none;
}
.best-keyword {
	display: none;
}
header .search-box {
	width: 90%;
}
header .logo h1 {
	margin: 20px 0 20px 0;
}
article#home-content {
	margin: 20px 0;
}
div.bhoechie-tab-menu h4 {
	font-size: 12px;
}
article#home-content .tab-content {
	margin-bottom: 20px;
}
section#bottom-pane h3 {
	font-size: 18px;
	line-height: 30px;
}
footer .footer-bottom {
	width: 100%;
}
}
 @media (min-width: 481px) and (max-width:767px) {
header {
	background: url(../images/header-bg.png) repeat-x #f7f7f6 bottom;
	position: relative;
	height: auto;
	z-index: 1;
}
header .search-box {
	width: 100%;
}
.best-keyword {
	display: none;
}
header .search-panel {
	display: none;
}
header .logo {
	width: 100%;
}
header .logo h1 {
	float: left;
	width: 150px;
	margin: 15px;
}
.cd-dropdown-wrapper {
	float: right;
	width: 40px;
	margin: 15px;
	height: 40px;
}
.cd-dropdown-trigger {
	height: 40px;
	background: #ee1715;
	line-height: 30px;
	border-radius: 5px;
	padding: 8px 7px;
}
.cd-dropdown-trigger::before, .cd-dropdown-trigger::after {
	display: none;
}
.cd-dropdown-trigger .icon-bar {
	width: 26px;
	height: 5px;
	border-radius: 3px;
	background: #fff;
	display: block;
	margin-bottom: 4px;
}
.cd-dropdown-trigger .icon-bar:nth-last-child(1) {
	margin-bottom: 0px;
}
header .search {
	clear: both;
	margin-bottom: 15px;
}
header .account-link {
	height: auto;
	background: none;
}
header .account-link ul {
	margin: 0;
	padding: 0 0 0 15px;
}
header .account-link ul li {
	height: 36px;
	line-height: 36px;
	display: inline-block;
	width: 36px;
	text-align: center;
}
header .cart-item {
	height: 36px;
}
header .cart-item .cart-box {
	background: url(../images/cart-line.png) no-repeat 60px 50%;
}
header .cart-item .cart-box .cart-value {
	width: 20px;
	height: 20px;
	float: left;
	margin: 8px 0 8px 8px;
	position: relative;
	background-size: cover;
}
header .cart-item .cart-box .cart-value a {
	top: 0px;
	right: -20px;
	color: #fff;
	font-size: 16px;
	text-align: center;
	width: 20px;
	height: 20px;
	line-height: 20px;
}
header .cart-item .cart-box .cart-info {
	float: left;
	margin: 5px 15px 5px 45px;
}
header .cart-item .cart-box .cart-info p {
	display: none;
}
header .cart-item .cart-box .cart-info h3 {
	line-height: 26px;
}
section#slide-banner {
	padding: 0;
	height: 320px;
}
section#slide-banner button.slick-prev {
	left: -15px;
}
section#slide-banner button.slick-next {
	right: -15px;
}
section#slide-banner .banner-item {
	height: 320px;
}
section#slide-banner .banner-item .container {
	height: 320px;
}
section#slide-banner .banner-item .container .banner-content img {
	width: 100%;
}
.banner-gajian .container .banner-content {
	max-width: 384px;
}
.banner-lebaran .container .banner-content {
	max-width: 384px;
}
article#home-content {
	margin: 15px 0;
}
article#home-content .nav-tabs {
	padding-left: 0px;
}
article#home-content .nav-tabs > li {
	margin-bottom: 3px;
}
article#home-content .nav > li > a {
	padding: 7px 10px;
	border-radius: 4px;
}
article#home-content .nav-tabs > li.active > a, article#home-content .nav-tabs > li.active > a:hover, article#home-content .nav-tabs > li.active > a:focus {
	border: 1px solid #950100;
	border-bottom: 1px solid #950100;
}
div.bhoechie-tab {
	width: 100%;
}
div.bhoechie-tab-menu {
	padding-bottom: 20px;
}
div.bhoechie-tab .prod-box {
	min-height: 290px;
}
article#home-content .tab-content {
	margin-bottom: 15px;
}
.prod-container .cat-box .cat-image {
	height: 76px;
	overflow: hidden;
}
.prod-container .cat-box .cat-title h3 {
	position: relative;
	font-size: 24px;
	line-height: 24px;
	margin: 0;
}
.prod-container .cat-box .cat-title {
	min-height: 100%;
}
.title-box h2 {
	font-size: 24px;
	line-height: 30px;
}
article#brand-content .brand-char {
	display: inline-block;
	font-size: 16px;
}
article#brand-content .brand-letter {
	min-width: 20%;
}
article#brand-content .brand-link-container {
	flex-basis: 50%;
}
article#brand-content .brand-item:target {
	padding-top: 0px;
}
section#bottom-pane {
	padding: 15px 0;
}
section#bottom-pane .col-sm-4 {
	padding: 0;
}
section#bottom-pane h3 {
	padding: 0 10px;
	font-size: 18px;
	line-height: 30px;
}
section#bottom-pane .icon-box {
	padding: 15px 4px 11px;
}
footer .footer-top .container {
	padding: 0;
}
footer .footer-bottom {
	width: 90%;
	padding: 15px 0;
}
footer .footer-bottom .container {
	padding: 0;
}
footer .footer-bottom .footer-about img.align-left {
	float: none;
	margin-right: 0px;
	margin-bottom: 0px;
	width: 115px;
	display: block;
}
footer .footer-bottom h3 {
	margin: 15px 0 0 0;
}
footer .footer-bottom ul li {
	line-height: 24px;
}
.brand-terlaris a.thumbnail {
	width: calc(33.33333333% - 10px);
}
#LoginModal, #FormModal {
	top: 30px;
	width: 100%;
}
}
@media (max-width: 480px) {
header {
	background: url(../images/header-bg.png) repeat-x #f7f7f6 bottom;
	position: relative;
	height: auto;
	z-index: 1;
}
header .search-box {
	width: 100%;
}
.best-keyword {
	display: none;
}
header .search-panel {
	display: none;
}
header .logo {
	width: 100%;
}
header .logo h1 {
	float: left;
	width: 150px;
	margin: 15px;
}
.cd-dropdown-wrapper {
	float: right;
	width: 40px;
	margin: 15px;
	height: 40px;
}
.cd-dropdown-trigger {
	height: 40px;
	background: #ee1715;
	line-height: 30px;
	border-radius: 5px;
	padding: 8px 7px;
}
.cd-dropdown-trigger::before, .cd-dropdown-trigger::after {
	display: none;
}
.cd-dropdown-trigger .icon-bar {
	width: 26px;
	height: 5px;
	border-radius: 3px;
	background: #fff;
	display: block;
	margin-bottom: 4px;
}
.cd-dropdown-trigger .icon-bar:nth-last-child(1) {
	margin-bottom: 0px;
}
header .search {
	clear: both;
	margin-bottom: 15px;
}
header .account-link {
	height: auto;
	background: none;
}
header .account-link ul {
	margin: 0;
	padding: 0 0 0 15px;
}
header .account-link ul li {
	height: 36px;
	line-height: 15px;
	display: inline-block;
	width: 50px;
	text-align: center;
}
.account-link{
	font-size:10px;
	}	
header .account-link ul li a {
	text-transform: capitalize !important;
}
header .cart-item {
	height: 36px;
}
header .cart-item .cart-box {
	background: url(../images/cart-line.png) no-repeat 60px 50%;
}
header .cart-item .cart-box .cart-value {
	width: 20px;
	height: 20px;
	float: left;
	margin: 8px 0 8px 8px;
	position: relative;
	background-size: cover;
}
header .cart-item .cart-box .cart-value a {
	top: 0px;
	right: -20px;
	color: #fff;
	font-size: 16px;
	text-align: center;
	width: 20px;
	height: 20px;
	line-height: 20px;
}
header .cart-item .cart-box .cart-info {
	float: left;
	margin: 5px 15px 5px 45px;
}
header .cart-item .cart-box .cart-info p {
	display: none;
}
header .cart-item .cart-box .cart-info h3 {
	line-height: 26px;
}
section#slide-banner {
	padding: 0;
	height: 320px;
}
section#slide-banner button.slick-prev {
	left: -15px;
}
section#slide-banner button.slick-next {
	right: -15px;
}
section#slide-banner .banner-item {
	height: 320px;
}
section#slide-banner .banner-item .container {
	height: 320px;
}
section#slide-banner .banner-item .container .banner-content img {
	width: 100%;
}
.banner-gajian .container .banner-content {
	top: auto;
	bottom: 0%;
	margin-bottom: 30px;
	left: 50%;
	max-width: 384px;
	width: 90%;
	margin-left: -45%;
}
.banner-lebaran .container .banner-content {
	top: auto;
	bottom: 0%;
	margin-bottom: 30px;
	left: 50%;
	max-width: 384px;
	width: 90%;
	margin-left: -45%;
}
article#home-content {
	margin: 15px 0;
}
article#home-content .nav-tabs {
	padding-left: 0px;
}
article#home-content .nav-tabs > li {
	margin-bottom: 3px;
}
article#home-content .nav > li > a {
	padding: 7px 10px;
	border-radius: 4px;
}
article#home-content .nav-tabs > li.active > a, article#home-content .nav-tabs > li.active > a:hover, article#home-content .nav-tabs > li.active > a:focus {
	border: 1px solid #950100;
	border-bottom: 1px solid #950100;
}
div.bhoechie-tab {
	width: 100%;
}
div.bhoechie-tab-menu {
	padding-bottom: 20px;
}
div.bhoechie-tab .prod-box {
	min-height: 290px;
}
article#home-content .tab-content {
	margin-bottom: 15px;
}
.prod-container .cat-box .cat-image {
	height: 76px;
	overflow: hidden;
}
.prod-container .cat-box .cat-title h3 {
	position: relative;
	font-size: 24px;
	line-height: 24px;
	margin: 0;
}
.prod-container .cat-box .cat-title {
	min-height: 100%;
}
.title-box h2 {
	font-size: 24px;
	line-height: 30px;
}
article#brand-content .brand-char {
	display: inline-block;
	font-size: 16px;
}
article#brand-content .brand-letter {
	min-width: 20%;
}
article#brand-content .brand-link-container {
	flex-basis: 50%;
}
article#brand-content .brand-item:target {
	padding-top: 0px;
}
section#bottom-pane {
	padding: 15px 0;
}
section#bottom-pane .col-sm-4 {
	padding: 0;
}
section#bottom-pane .col-xs-6 {
	width: 100%;
}
section#bottom-pane h3 {
	padding: 0 10px;
	font-size: 18px;
	line-height: 30px;
}
section#bottom-pane .icon-box {
	padding: 15px 4px 11px;
}
footer .footer-top {
	height: auto;
}
footer .footer-top .col-xs-8 {
	width: 100%;
}
footer .footer-top .col-xs-4 {
	width: 100%;
}
footer .footer-top .container {
	padding: 0;
}
footer .footer-top .social-bar p {
	text-align: center;
}
footer .footer-top .backtotop p {
	text-align: center;
}
footer .footer-bottom {
	width: 90%;
	padding: 15px 0;
}
footer .footer-bottom .container {
	padding: 0;
}
footer .footer-bottom .footer-about img.align-left {
	float: none;
	margin-right: 0px;
	margin-bottom: 0px;
	width: 115px;
	display: block;
}
footer .footer-bottom h3 {
	margin: 15px 0 0 0;
}
footer .footer-bottom ul li {
	line-height: 24px;
}
footer .footer-bottom .col-xs-6 {
	width: 100%;
}
.brand-terlaris a.thumbnail {
	width: calc(33.33333333% - 10px);
}
#LoginModal, #FormModal {
	top: 30px;
	width: 100%;
}
}
/* Novri */
  @media (max-width: 480px) {
.account-link img{
	position:absolute;
	display:block;
	top:5px;
	text-align:center;
	}
.account-link img{
	    margin: 0 0 0 12px;
	}
header .account-link span{
    position: absolute;
    display: block;
    margin: 0 0 0 10px;
    top: 22px !important;
}
article#home-content .nav-tabs > li {
                width: 100% !important;
            border: #ccc 1px solid ;
        }
#sale{
    display:none !important;
}
    }

.product-qty {
    margin-bottom: 50px;
}
@media (min-width: 768px) {
    .prod-box .prod-image img.img-responsive {
        max-height: 200px;
    }
    .prod-box .prod-desc {
        /*height: 120px !important;*/
    }
}

	/* end */