/* =========================================================
   The Milk Guy
   ========================================================= */

:root{
  --bg: #fff;          
  --bg-2: #fff;       
  --black: #0A233F;
  --white: #fff;
  --paper: #ffffff;
  --ink: #2b2b2b;
  --muted: #6b6b6b;
  --border-color:#0A233F;

  --brand: #00abf0;       
  --brand-2: #b0aeaf;     
  --navy: #283f68;        
  --choco: #3a2a1b;       

  --border: rgba(0,0,0,.10);
  --shadow: 0 12px 28px rgba(0,0,0,.10);
  --shadow-soft: 0 10px 22px rgba(0,0,0,.08);
  --radius: 16px;
  --radius-sm: 12px;
  --footer-bg: #ebebeb;
}

.mt-20{margin-top:20px;}

/* ---------- Base ---------- */
body{
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 28px;
  color:var(--ink);
      background: var(--bg);
}

.h1, h1, .h2, h2, .h3, h3{
  color: var(--brand);
  font-family: "Montserrat", cursive;
}

.h1, h1{
  font-size: 46px;
  font-weight: 700 !important;
  margin-bottom: 30px;
	letter-spacing: -0.02em;
}
.glyphicon-unchecked:before{color:#ccc;}
.glyphicon-check:before{color:var(--brand);}

.h2, h2{ font-size: 48px; font-weight: 600 !important;letter-spacing: -0.01em; }
.h3, h3{ font-size: 38px; letter-spacing: -0.01em;}

a{ color: var(--navy); }
a:hover, a:active, a:focus{ color: var(--brand-2); text-decoration: none; }

.container-wide,
#breadcrumbDiv,
#products .body-wrapper,
#BodyDiv .body-wrapper{
  max-width: 1390px;
  margin: 0 auto;
  padding: 20px 20px;
}
#privacy-policy h2,
#terms-of-use h2{font-size:32px;}
#BodyDiv .body-wrapper{padding-top:50px;}

#breadcrumbDiv{
  padding-bottom: 0;
  padding-top: 40px;opacity:0;
}

.breadcrumb-wrapper{ background: transparent; }
#vendor-demo-1 .breadcrumb-wrapper{ display:none; }
#breadcrumbDiv .breadcrumb{ background: transparent; }

.container-wide .col-md-6 img{width:100%;height:auto;}
.container-wide .col-md-6:first-of-type img:last-of-type{border-radius:30px;width:60%;margin:0 auto;}

.container-wide .col-md-6:last-of-type img{margin-top:-100px;width:50%;}

/* ---------- Header / Top bar ---------- */

.preheader{background:#ffffff80;}
.preheader .container{display:flex;flex-direction:row;padding:10px 0;justify-content:space-between;font-size:15px;position:relative;z-index:1;}
.preheader .container:before,.preheader .container:after{display:none;}
.preheader .container .left{display:flex;flex-direction:row;}
.preheader .container .left a:before{content:'';}
.preheader .container a span:before{color:var(--black)!important;}
.preheader .container a:hover{color:var(--black);text-decoration:underline;}
.preheader .container a:first-of-type{margin-right:10px;}
.preheader .container .right a{display:block;height:25px;width:25px;border-radius:50%;background:var(--black);text-align:center;}
.preheader .container .right a:first-of-type{margin-left:10px;}
.preheader .container .right{display:flex;flex-direction:row;}
.preheader .container .right a span:before{color:var(--white)!important;}
.preheader .container .right a:hover{background:var(--brand);}

#contact-us .body-wrapper{padding-top:40px;}
#contact-us .col-lg-4 h3{font-size:24px;font-weight:700;}

#header{
  background: var(--brand);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
  padding: 15px 0;position:relative;z-index:999;
  height:161px;
}


#header .container-wide{ padding: 0 20px; }
#header .container-wide .logomain{ display:block; width: 100%; } /* larger logo */
.navbar-brand>img{ max-width: 360px; }

#header-top{
  background: var(--choco);
  color: #fff;
  font-size: 16px;
  text-align: center;
}
#header-top .container-wide{ padding: 6px 12px; }
#header-top .fa{ color: var(--brand); margin-right: 6px; }
#header-top a{ color:#fff; }
#header-top a:hover, #header-top a:focus{ color: var(--brand); }
#header-top .container-wide .row{
  display:flex;
  width:100%;
  justify-content:end;
  flex-direction:row;
}
#header-top .container-wide .row .phone_wrapper,
#header-top .container-wide .row .social_icons{
  width:auto!important;
  text-align:right!important;
  margin-top:0;
}
.social_icons ul{ margin:0; list-style:none; display:inline-block; padding-left:0!important; }
.social_icons ul li{ display:inline-block; }
.phone_wrapper, .address_top, .social_icons{ margin-top: 5px; }

/* ---------- Navigation ---------- */
#main-nav{
  margin-top: 30px;
  font-family:"Montserrat", sans-serif;
  font-weight: 400;
}

#main-nav li a{
  color: var(--white);
  font-size: 16px;
  padding: 0 8px;
  text-transform: normal;
}

#main-nav li a:hover{
  color: var(--black);
  transition: .2s ease;
  text-decoration: none;
  background: none;
}

.navbar-nav > li{ margin-right: 25px; }
.navbar-nav > li:last-child{ margin-right: 0; }

.navbar-nav > li > ul.dropdown-menu > li{
  padding:10px 10px;
  border-bottom: 1px solid var(--border);
}
.navbar-nav > li > ul.dropdown-menu > li > a{
	color:var(--black)!important;
}
.navbar-nav > li > ul.dropdown-menu > li:last-of-type{ border:0; }
.caret{ margin-left:10px!important; }

.nav .open>a, .nav .open>a:hover, .nav .open>a:focus{background:none;}

.navbar-nav > li > a.button:hover,
.navbar-nav > li#log-in a:hover{background:var(--white)!important;text-decoration:none;color:var(--black);}

.navbar-collapse{ box-shadow:none; clear:both; }

/* Mobile toggler */
.navbar-toggler{
  background: url('/media/3092/menu-icon-png-file.png');
  border:none;
  height:40px;
  width:38px;
  background-size:38px;
  float:right;
  margin: 10px;
}

/* ---------- Main / Sections ---------- */
.main-content{
  background: url('/media/3206/pouring-milk-banner.jpeg') no-repeat;
	background-size:cover;background-position:center;
  color:var(--choco);
  padding: 50px 0;
}
.main-content h1,
.main-content h2 small{ color:var(--choco); }

#about-us .wrapper,
#about-us .wrapper .body-wrapper{
  background: var(--bg-patter-img) var(--bg);
}

/* ---------- Buttons (REPLACED) ---------- */
/* Bootstrap-like .btn override */
.btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding: 15px 25px;
      border-radius: 999px;
      border: 1px solid var(--black);
      background: var(--black);
      color:#fff;
      font-weight:800;
      letter-spacing:.06em;
      text-transform: uppercase;
      box-shadow: 0 10px 20px rgba(0,0,0,.20);
      transition: transform .15s ease, background .15s ease;
      white-space:nowrap;
	font-size: 16px;
    }
.btn:hover,.btn:active{
	transform: translateY(-1px);
	background: var(--white);
	border-color:var(--white);
}



.btn-lg{
  font-size: 18px;
  padding: 20px 25px;
  margin-top: 20px;
}



/* Old “banner_btn” types used in your slider */
.banner_btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 14px 20px;
  font-size: 18px;
  font-weight: 800;
  border-radius: 999px;
  min-width: 220px;
  text-align:center;
  border: 1px solid rgba(0,0,0,.18);
  border-bottom: 3px solid rgba(0,0,0,.18);
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.brown-btn, .blue-btn:hover, .blue-btn:focus{
  background: linear-gradient(180deg, #f0c46a, var(--brand));
  color: var(--choco);
  transition: .2s ease;
}
.blue-btn, .brown-btn:hover, .brown-btn:focus{
  background: linear-gradient(180deg, #4a3726, var(--choco));
  color: #fff;
  transition: .2s ease;
}

/* ---------- Cards ---------- */
.card{
  background: rgba(255,255,255,.85);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

.card .card-header{
  border-radius: 0;
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(232,188,90,.25), rgba(232,188,90,.08));
  border-bottom: 1px solid var(--border);
  color: var(--choco);
  font-weight: 800;
}

.CustomLogin{background:none;}

.CustomLogin .card .card-header{
  background: var(--black);
  padding: 16px;
  text-align: center;
}

.favourite.card-header{
  color: var(--choco);
  background: linear-gradient(180deg, rgba(232,188,90,.30), rgba(232,188,90,.10)) !important;
}

/* ---------- Pills / Tabs ---------- */
.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover{
  background-color: var(--choco);
  color: #fff;
}

.nav-pills>li>a:hover{
  color: var(--choco);
  background-color: rgba(255,255,255,.65);
}

/* ---------- Searchbar ---------- */

.searchbar form{
  border: 1px solid var(--border);
  border-radius: 999px;
  background-color: rgba(255,255,255,.85);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}
.searchbar form .PSBox_Div input{
  width:75%;
  border:0;
  background: transparent;
}
.searchbar form .PSBox_Div button{
  width:19%;
  padding: 8px 20px 8px 0;
  border-radius: 999px;
text-align:right;
}

.searchbar form .PSBox_Div button .glyphicon{color:var(--brand)!important;}

/* ---------- Product list / Shop ---------- */
.product-info{
  background: rgba(255,255,255,.88);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 22px;
  min-height: 418px;
  margin-bottom: 20px;
  box-shadow: var(--shadow-soft);
}
.product-info h5{
  font-size: 18px;
  font-weight: 800;
  color: var(--choco);
}
.product-info p{
  font-size: 14px;
  line-height: 24px;
  margin-top: 16px;
  color: var(--muted);
}
.product-info img{
  width: 100%;
  max-height: 168px;
  border-radius: 12px;
  object-fit: cover;
}

.ProductItemDiv{
  background-color: transparent;
  width: 100%;
}

/* Add to cart button */
.btnAddtoCart{
  margin-left: 0;
  padding: 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.16);
  border-bottom: 3px solid rgba(0,0,0,.16);
  background: rgba(255,255,255,.85);
  margin-top: 10px;
  display:flex;
  align-self:center;
  width:100%;
  justify-content:center;
  transition: all .15s ease;
	align-items: center;
}
.btnAddtoCart:hover{
  background:  var(--brand-2);
}
.glyphicon{ color: var(--white) !important; }

/* Filters */
.ProductsFilterDiv{
  padding: 20px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: rgba(255,255,255,.65);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}
.FilterContent{ background:none; }
.FilterHeader{
  background:none;
  border-radius:0;
  border-bottom:1px solid var(--border);
  font-size:20px;
  font-weight:800;
  color: var(--choco);
}
.FilterSubHeader{
  text-align:left;
  font-weight:400;
  color: var(--muted);
}
.FilterSelected .CategoryFilterItem,
.FilterSelected .CategoryFilterItem:hover{
  background-color: rgb(217 242 253);
}
.FilterButtonDiv .btn{
  width:100%;
}

.flexslider{border:0;background:var(--bg);}
.flexslider .slides li{padding:10px;border-radius:20px;background:#fff;
}

/* ---------- Banner / Carousel ---------- */
.container.hero-inner{
	background:url('/media/3214/themilkbanner3.gif') no-repeat #fbfbfb;
	background-size:cover;background-position:center;
}
.hero-container{
	max-width:1390px;
	padding:0 20px;
	margin:0 auto;
}
.hero-container .hero-copy{
	text-align:center;
}
.hero-container .hero-copy p{
	font-size:26px; margin-bottom:30px; line-height:1.3;
}
.banner{position:relative;}
.banner img{width:100%;height:auto;}

.wave_container{
  background-image: url("/media/1505/wave-white-hor.png");
  background-size: cover;
  position: absolute;
  bottom: -4px;
  height: 100px;
  z-index: 2;
  pointer-events: none;
  width: 100%;
  display: none;
}

.carousel-caption{ top: 15%; text-shadow:none; text-align:left!important; }
.slider_title_h1{
  font-size: 24px;
  font-family: "Montserrat", sans-serif;
  font-weight: 800 !important;
  color: var(--brand);
  text-transform: uppercase;
  margin-bottom: 0;
}
.slider_title{
  font-size: 52px;
  font-family: "Domine", serif;
  font-weight: 900 !important;
  color:#fff;
}
.slider_description{ font-size: 22px; line-height: 32px; }
.slider_description strong{ border-bottom:2px solid var(--brand); font-weight: inherit; }

.carousel .carousel-control{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(58,42,27,.9);
  text-shadow:none;
  top: 40%;
  box-shadow: 0 10px 20px rgba(0,0,0,.18);
}
.carousel-control .fa{ font-size: 32px; margin-top: 2px; }
.carousel-control.left{ left: 30px; }
.carousel-control.right{ right: 30px; }

@media screen and (min-width: 768px){
  .carousel-caption{
    right: 53%;
    left: 10%!important;
  }
	.container-wide .col-md-6 img.oconm{margin-top:-350px;margin-bottom:50px;}
}
@media screen and (max-width: 1624px){
  .slider_title{ font-size: 32px!important; }
}

/* ---------- Testimonials (warm dark) ---------- */
#testimonials{
  padding-top: 100px;
  background: linear-gradient(180deg, rgba(58,42,27,.96), rgba(51,51,51,.96));
  min-height: 500px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#testimonials .testimonial_title{
  text-align:center;
  font-size: 40px;
  color:#fff;
}
#testimonials .carousel .item{
  color:#fff;
  text-align:center;
  overflow:hidden;
  min-height: 220px;
}
#testimonials .carousel .testimonial{ padding: 30px 50px; }
#testimonials .carousel .star-rating .fa{ font-size:18px; color: #ffdc12; }
#testimonials .carousel .carousel-control{
  background: rgba(232,188,90,.9);
  color: var(--choco);
}
#testimonials .carousel-indicators li{ background:#e2e2e2; border-color: transparent; }
#testimonials .carousel-indicators li.active{ background: var(--brand); }

/* ---------- Back to top ---------- */
.backtotop{ position:absolute; right:20px; bottom:20px; }
.backtotop a{
  font-size:10px!important;
  text-transform:uppercase;
  font-weight:800;
  padding:10px 12px;
  border-radius:999px;
  background: linear-gradient(180deg, #f0c46a, var(--brand));
  color: var(--choco);
  display:inline-flex;
  gap:8px;
  align-items:center;
  box-shadow: 0 10px 20px rgba(0,0,0,.12);
}
.backtotop a span:before{ font-size:18px; }

/* ---------- Forms ---------- */
.form-wrapper{padding:30px;border-radius:30px;background:var(--white);}
.form-wrapper label{ font-weight: normal; }
.form-wrapper .form-control{
  font-size: 13px;
  height: 46px;
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,.85);
}
.form-wrapper h2{font-weight:700!important;font-size:42px!important;}
.form-wrapper h2 small{display:block;margin-top:10px;margin-bottom:20px;}
/*-----Grids -----*/
.features-grid .row{
	display:flex;flex-direction:row;
	padding:50px 0;
}
.features-grid .row .col h3{
font-weight:700;
}
.features-grid .row .col{
	text-align:center;
	padding:40px;
	border-radius:30px;background:var(--brand);
	    box-shadow: 0 10px 20px rgb(0 0 0 / 6%);
	display:flex;flex-direction:column;
    transition: transform .15s ease, background .15s ease;font-size:24px;
	position:relative;
}
.features-grid .row .col:before{
	position:absolute;content:'';width:150px;height:3px;background:var(--brand);
	right:-50px;top:50%;
}
.features-grid .row .col:after{
	display:black;color:var(--white);content:'CREATE ACCOUNT';margin-top:20px;
}
.features-grid .row .col:first-of-type:after{
	display:black;color:var(--white);content:'OUR PRODUCTS';margin-top:20px;
}
.features-grid .row .col:last-of-type:after{
	display:black;color:var(--white);content:'CONTACT US';margin-top:20px;
}

.features-grid .row .col:last-of-type:before{display:none;}


.features-grid .row .col:last-of-type{border-right:0;}
.features-grid .row .col:first-of-type{border-left:0;}


.features-grid.aboutus .row .col{color:var(--white);font-size:18px;line-height:1.3;text-align:left;}
.features-grid.aboutus .row .col h3{font-size:21px;color:var(--white);}
.features-grid.aboutus .row .col p{position:relative;z-index:1;}
.features-grid.aboutus .row .col:before{
	position:absolute;content:'';width:150px;height:3px;background:var(--brand);
	right:-50px;top:50%;
}
.features-grid.aboutus .row .col:after{
	display:black;color:var(--white);content:'2.';margin:10px 0 0 auto;font-weight:700;font-size:56px;
}
.features-grid.aboutus .row .col:first-of-type:after{
	display:black;color:var(--white);content:'1.';margin:20px 0 0 auto;
}
.features-grid.aboutus .row .col:last-of-type:after{
	display:black;color:var(--white);content:'3.';margin:20px 0 0 auto;
}

.section-title{text-align:center;position:relative;}
.section-title h2{position:relative;z-index:2;display:inline;width:auto;padding:0 60px;font-weight:700!important;}
.section-title h2:before{position:absolute;background: var(--bg);top:0;right:0;bottom:0;left:0;content:'';display:block;width:100%;z-index:-1;}
.section-title:before{position:absolute;content:'';display:block;width:100%;left:0;right:0;bottom:50%;top:50%;border-top:2px solid var(--border-color);border-bottom:2px solid #fff;display:none;}

.favorites-grid{display:flex;flex-direction:row;flex-wrap: wrap;justify-content: space-around;}
.favorites-grid .grid-item{overflow:hidden;border-radius:30px;background:#fff;box-shadow: 0 8px 18px rgba(0, 0, 0, .06);}
.favorites-grid .grid-item .product-body{padding:20px  40px 40px;text-align:center;}

/* ---------- Layout widths ---------- */
.account{
  max-width: 1590px;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
}

table td{ font-size: 16px; }

/* ===========================
   Busy Bee Promo Section
   =========================== */

.bb-promo{
  padding: 26px 20px;
}

.bb-promo__inner{
  margin: 50px auto;
  justify-content: center;
position:relative;
  display: flex;
  flex-direction:row;

  background: url('/media/3196/leftbannerimg.png') #fff no-repeat;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
	background-size:contain;
  padding: 28px 26px;
  align-items: center;
  overflow: hidden;
}

.bb-promo__inner:after{
	content:'';display:block;position:absolute;right:0;top:0;bottom:0;left:auto;background-position:right;
	background: url('/media/3197/leftimginbannera.png') #fff no-repeat;
	background-size:contain;
	width:24%;
}

.bb-promo__media{
  display: flex;
  align-items: center;
  justify-content: center;
}

.bb-promo__media img{
  width: 100%;
  max-width: 260px;
  height: 170px;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.08);
  background: #fff;
}

.bb-promo__content{
  text-align: center;
  padding: 8px 10px;position:relative;z-index:2;
}

.bb-promo__content h2{
  margin: 0 0 6px;
  font-family: "Kalam", cursive;
  font-weight: 900;
  color: var(--black);
}

.bb-promo__subhead{
  margin: 0 0 10px;
  font-weight: 700;
  color: #767676;
}

.bb-promo__text{
  margin: 0 auto 16px;
  max-width: 560px;
  color: rgba(43,43,43,.85);
  font-size: 16px;
  line-height: 26px;
}

.bb-promo__btn{
  margin: 0 auto;
  min-width: 170px;
}

.badge-col .container{
	display:flex;flex-direction:row;justify-content:space-between;
}

.badge-col .container .col{
	display:flex;
}

.badge-col .container .col img{
	height:45px;margin-right:10px;
}
.badge-col .container .col .txts{line-height:1.2;}
.badge-col .container .col .txts strong{
	display:block;
}

.whatwedo{
	background:var(--brand);
	padding:50px 0;
}

.whatwedo .container{
display:flex;flex-direction:row;justify-content:space-between;color:var(--white);
}
.whatwedo .container h3{color:var(--white);font-size:24px;font-weight:700;}
.whatwedo .container:before,
.whatwedo .container:after{display:none;}

.whatwedo .container .col{padding:30px;border-radius:30px;border:1px solid white;}

.aboutus .container{
	display:flex;flex-direction:row;justify-content:space-between;padding:50px 0;
}

.aboutus .container .col:last-of-type{text-align:right;}
.aboutus .container .col h3{font-size:26px;font-weight:700;}

/* Footer Area */
footer.footer,.body-wrapper,.breadcrumb-wrapper{background: var(--bg-patter-img) var(--bg);}
.footer .CartLink{position:fixed;bottom:20px; right:20px; padding:15px;border-radius:50%;background:#fff;background: #fdfce6;
    border-bottom: 3px solid rgba(0, 0, 0, .18);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .08);z-index:9999;display:none;
}
.footer .CartLink .site-cart-icon-div{padding:0;}

.footer-container {
    display: flex;
    justify-content: space-between;text-align:left;
	padding:50px 0;
}

#footerHtmlDiv{background:var(--footer-bg);}
.footer-container .col h4{font-weight:700;color:var(--black);}
.footer-container .col {
    width: 20%;
    text-align: left;
}

.footer-container .col li,
.footer-container .col p,
.footer-container .col a{color:var(--muted);list-style:none;}
.footer-container .col a:hover{color:var(--black);}

.footer-container .col li img{width:70%;}

.footer-container .col ul{padding:0;margin:10px 0 0 0;}

#copyrightDiv{padding-top:10px;background:var(--footer-bg);}
#Registration .footer{display:none;}

/*products*/

.ProductsFormDiv #ProductListForm{padding:20px;border-radius:30px;
border: 1px solid var(--border);
    background: rgba(255, 255, 255, .65);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .06);
}

/* Responsive */
@media (max-width: 992px){
	.features-grid .row .col:before{display:none;}
  .bb-promo__inner{
    grid-template-columns: 1fr;
    text-align: center;
  }
	.whatwedo .container{flex-direction:column;}
  .bb-promo__media img{
    max-width: 520px;
    height: 200px;
  }
	#BodyDiv .body-wrapper{
		padding-left:20px!important;padding-right:20px!important;
	}
	#BodyDiv .body-wrapper #ProductFilterForm{margin-bottom:30px!important;}
	.FilterHeader2{
		display:block;
		width:100%;
	  align-items:center;
	  justify-content:center;
		letter-spacing: 0.05em;
	  font-size: 16px;
	  font-weight: 700;
	  letter-spacing: .02em;
	  padding: 12px 30px;

	  border: 1px solid rgba(0,0,0,.18);
	  border-bottom: 3px solid rgba(0,0,0,.18);
	  border-radius: 10px !important;

	  background: linear-gradient(180deg, #00abf0, #00abf0);
	  color: var(--choco) !important;

	  text-transform: uppercase;
	  box-shadow: 0 8px 18px rgba(0,0,0,.08);
	  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
	  margin-bottom: 10px;
	}
	.aboutus .container{flex-direction:column;}
	.aboutus .container .col img{width:100%;}
	.footer-section .footer-container,
	.badge-col .container{flex-direction:column;}
	.footer-section .footer-container .col,
	.badge-col .container .col{width:100%;}
	.preheader{display:none;}
	.hero-container .hero-copy .btn.btn--xl{margin-top:150px;position:relative;bottom:-50px;}
	.hero-container{padding-bottom:30px!important;}
	.features-grid .row .col img{width:45px!important;margin-right:10px;height:50px!important;}
	.features-grid .row .col{flex-direction:row;text-align:left;margin-bottom:15px;padding:20px;border-radius:15px;display:block;align-content:center;}
	#header{height:90px;}
	#main-nav{background:var(--brand);}
	.container-width .row{padding-bottom:0;}
	.badge-col .container{width:80%;}
	.badge-col .container .col{margin-bottom:20px;}
	.container.grid-container{padding:0 25px;}
	.section-title h2{font-size:24px;}
	.aboutus .container{padding:10px 25px;}
	.footer-section .footer-container{padding:15px 25px;}
}


/* ---------- Responsive ---------- */
@media (min-width:1125px){
  .wrapper .navbarDiv #header .topbar .topbar-container{ width:1470px; }
  .MyCartHeader{ max-width:1470px; margin:30px auto 0 auto; }
  .searchbar{ padding-top:13px; float:right;margin-right:30%;width:40%;}
	#header .container-wide .col-md-8{width:75%!important;float:right;clear:both;}
	#header .container-wide .col-md-1{width:21%!important;}
	.navbar-nav > li#log-in a{margin-top:-15px!important;}
	.container.hero-inner{padding:50px 0;width:100%; }
	.features-grid .row .col{
		width:33%;
	}
	.container.features-grid,
	.container.grid-container,.bb-promo__inner{max-width:100%!important;width:1390px;}
	.features-grid .container-width{max-width:1390px;}
	.features-grid .row .col img{width:30%;margin:0 auto;}
	.section-title{width:80%;margin:30px auto;}
	#header .container-wide .logomain{position:absolute;}
	.container.hero-inner{padding:200px 0 50px 0; position:relative;}
	.container.hero-inner:before,
	.banner:before{position:absolute;width:100%;content:'';top:0;left:0;right:0;height:48px;background:#ffffff70;display:block;}
	.hero-container .hero-copy .btn.btn--xl{padding:15px 40px!important;font-size:18px!important;}
	.hero-container .hero-copy .btn{margin-top:200px;}
	.preheader .container{max-width:1320px;width:100%;margin-bottom:-48px;}
	.footer-area .footer-section{max-width:1320px;width:100%;margin:0 auto;}
	.Detail-ProductTitle{font-size:46px;}
	#Registration .body-wrapper form{max-width:1320px;width:100%;margin:0 auto;padding-top:50px;}
}

@media (max-width: 1024px){
  .nav>li>a{ padding: 10px 15px !important; }
	.footer .CartLink{display:block;}
}

@media (max-width: 992px){
	* .row{margin-left:0;margin-right:0;}
  .searchbar form .PSBox_Div button{ display:none; }
  .searchbar form .PSBox_Div input{ width:90%; }
	.container.hero-inner{background-size:cover;background-position:center;}
	.hero-container{padding-bottom:150px;}
	.section-title h2{padding:0 20px;}
	.features-grid .row{flex-direction:column;}
	.features-grid .row .col{border:0!important;}
	.features-grid .row .col h3{font-size:24px;}
	.features-grid .row .col img{width:100%;height:auto;}
	
  .MyCartHeader{ width:90%; margin:0 auto; padding-bottom:20px; }
  #CartLink{ padding-left:10px; }
	
	#about-us .body-wrapper img{float:none!important;display:block;margin:0 auto;width:100%;margin-left:0!important;margin-bottom:30px;}

  #header{ min-height:72px; }
  #header .container-wide{ padding-bottom:0; }
	#header .container-wide .row .col-md-1:first-of-type{width:auto;float:left;}

  .navbar-brand>img{ max-width: 102px; }
  #header .container-wide .logomain{ width: 140px; } /* keep logo bigger on mobile */
	
	.bb-promo__inner{height:500px;border-radius:0;background-size:70%;}
	.bb-promo__inner:after{width:40%;}
	.bb-promo__inner .bb-promo__content{padding-top:120px;}

  #banner{
    margin-top: 0px!important;
    padding-top: 50px!important;
    height: auto!important;
  }
  #banner h2{ font-size: 38px!important; }
  #banner h3{ font-size: 18px!important; }

  #header-top{ display:none; }
  .slider_title_h1{ font-size:21px; }
  .slider_title{ font-size:26px; }

  #products-content{ height:auto!important; }
  #testimonials{ padding-top:35px!important; }
	#copyrightDiv{padding:20px;}
	#copyrightDiv * {font-size:16px;}
}

@media(max-width:767px){
  .searchbar{ display:none!important; }

  .h1, h1{ font-size: 34px; }
  .h2, h2{ font-size: 28px; }
  .h3, h3{ font-size: 18px; }

  .navbar-nav{ margin-top: 40px; }
	
	#BodyDiv .body-wrapper {padding:40px 0;}

  #banner{
    background: url('/media/1085/website-bg-mob.jpg')!important;
    background-size: 290%!important;
    margin-top: 0!important;
    padding-top: 50px!important;
  }
}

@media(min-width: 992px){
	
	.features-grid .row .col{width:30%;}
	.features-grid .row{    justify-content: space-between;}
	
  .navbar-toggler{ display:none; }
  .navbar-collapse{
    width:auto;
    border-top:0;
  }
  .navbar-collapse.collapse{
    display:block!important;
    height:auto!important;
    padding-bottom:0;
    overflow:visible!important;
  }
  .navbar-expand-lg .navbar-collapse{
    display: contents!important;
  }
	.whatwedo .container .col{width:48%;}
	.aboutus .container .col{width:48%;}
	.aboutus .container .col img{width:80%;margin:0 auto;}
}

@media(min-width: 970px) and (max-width: 1440px){
	#header .col-md-3.searchbar{
		width: 20%!important;
	}
	#header .container-wide .col-md-8 {
        width: 75% !important;
    }
}

/* ---------- Cart Icon (kept) ---------- */
#CartLink .CartLink .site-cart-icon-div{ padding:0; }
#CartLink .CartLink .site-cart-icon-div span{ position:absolute; top:-8px; right:-5px; }
#CartLink .CartLink .site-cart-icon-div img{ margin-top:-5px; }
#CartLink .CartLink{ background-repeat:no-repeat!important; background-size:contain!important; }
#CartLink .CartLink span.fa{ opacity:0; }
#CartLink{margin-top:-4px;}
#CartLink .CartLink .site-cart-icon-div img{opacity:0;}
#CartLink .CartLink .site-cart-icon-div{background:url('/media/3190/whiteiocn.png') no-repeat;background-size:contain;}


/* ---------- Minor legacy bits ---------- */
#main-nav #log-in a:before{ display:none; }
.navbar-nav > li#Register .btn .fa{ display:none; }
.navbar-nav > li#log-in a,
.navbar-nav > li#Register a{ padding-top:0; padding-bottom:0; font-weight:600; }
.navbar-nav > li#log-in a{padding: 12px 18px;}

/* ---------- Your products-content background (optional) ---------- */
/* Keep your existing section but make it less harsh */
#products-content{
  background-color: var(--choco);
  background-image: url("/media/3089/produc-dlieosssss.jpg");
  color: rgba(255,255,255,.88);
  padding-top: 15px;
}

/* Product box label softened */
#products-content .product-box{
  border-radius: var(--radius);
  display:inline-block;
  width:100%;
  position:relative;
  margin-top: 35px;
  overflow:hidden;
  box-shadow: var(--shadow-soft);
  border: 1px solid rgba(255,255,255,.12);
}
#products-content .product-box img{ border-radius: 0; }
#products-content .block_label{
  display: table;
  background: rgba(232,188,90,.85);
  position:absolute;
  width:100%;
  bottom:0;
  padding: 14px 16px;
  font-size: 22px;
  font-weight: 900;
  color: var(--choco);
}
#products-content .product-box:hover .block_label{
  background: rgba(58,42,27,.92);
  color:#fff;
  transition: .2s ease;
}
#products-content h3{
  font-size: 40px;
  color:#fff;
  margin: 10px 0;
  line-height: 50px;
}
#products-content h2{
  font-size: 30px;
  color: var(--brand);
  font-weight: 800 !important;
  margin-bottom: 0;
}