/*************************8      header css           ****************************************************/
.wcfm_catalog_enquiry  {display:none !important;}
.woocommerce .quantity .qty{visibility:hidden;}
.shrink{background-color:#fff;box-shadow: 0px 25px 20px -20px rgba(0,0,0,0.25);z-index:999;}

.logo {max-height:110px;-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;}
.shrink .logo {max-height:110px;-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s; margin:4px 0px;}

.main-nav{-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;}
.shrink .main-nav{background-color:#000B29;padding:5px 0px!important;box-shadow:0px 5px 12px rgba(0,0,0,.5);}



ul.navbar-nav li.menu-item-has-children:hover > ul.dropdown-menu{
    display: block !important;
}
.whychoosebbox{font-size:18px;}

.woocommerce ul.products li.product .button {
    display: inline-block;
    margin-top: 1em;
    font-size: 15px;
}

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
    text-align: center;
    box-shadow: 0px 4px 4px rgb(5 5 5 / 20%);
    padding-bottom: 10px;
}
.contact-detail ul li{list-style:none;}
.contact-detail ul li:nth-child(1)::after {
    background-image: url(../images/location.svg);
}
.contact-detail ul li:nth-child(2)::after {
    background-image: url(../images/call.svg);
}

.contact-detail ul li:nth-child(3)::after {
    background-image: url(../images/email.svg);
}
.contact-detail ul li::after {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    height: 17px;
    width: 17px;
    background-image: url(../images/call.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
/*.main-nav .logo{margin-top:-17px;}*/
#Navigation{margin:0px;}
.navbar .nav-item{margin:0px 0px;font-size:15px;font-weight:600;}
.navbar .nav-item .nav-link{color:#fff;}
.navbar .nav-item.active .nav-link,.navbar .nav-item .nav-link:hover{color:#F50027;}

/**********                Home page css       *******************************/
.circle{padding:30px 20px; border-radius:40px; text-align:center; display:block; margin:auto; background:#FFF;}

/**************              Footer                 ******************************/
.footer a{color:#fff;}
.footer a.active,.footer a:hover{color:#F50027;}

/********************     Media query       ***************************************/

.TestiImg{padding:25px; border-radius:12px; min-height:250px; display:flex; justify-content:start; align-items:start;}
.AbBox{border-radius:40px; padding:45px 30px;}


@media (min-width: 1400px){
	.shrink .navbar.pb-xxl-5{padding-bottom:0px!important;}
}

@media (min-width: 1600px){
	.txtsize{font-size:35px;}
	.container {max-width: 1540px;}
	.g-4{--bs-gutter-y:2rem!important;--bs-gutter-x:2rem!important;}
	.gx-xxl-5{--bs-gutter-x:5rem!important;}
    
	.display-3{font-size:80px;}
	.display-4{font-size:75px;}
	.display-5{font-size:65px;}
	.display-6{font-size:50px;}
	h1,.h1{font-size:40px;}
	.h2{font-size:35px;}
	h3{font-size:30px;}
	.fs-18{font-size:20px;}
	.fs-22{font-size:25px;}
	
	.lh-xxl-lg{line-height:2;}
	.pb-xxxl-3{padding-bottom:padding-bottom: 1rem;}
	
	.logo {max-height:174px;}
	
	.navbar .nav-item{margin:0px 10px;}
	
	.testimonial .w-75{width:85%!important;} .TestiImg{padding:45px;} .AbBox{padding:60px 70px;}
}

@media (min-width: 1920px){
	.txtsize{font-size:40px;}
	.txtjoin{font-size:38px;}
	.banner img {height:880px; width: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center;}
	.container {max-width: 1630px;}
	
	.gx-xxl-5{--bs-gutter-x:5rem!important;}
	.pe-xxxl{padding-right:120px;}
	
	.circle{width:95%;height:274px;padding:40px 40px;}
}

@media (min-width: 1400px) and (max-width: 1599.98px){
	.logo {max-height:150px;}
	.navbar .nav-item{margin:0px 5px;}
	
	.circle{width:140px;height:140px;padding:15px 10px;}
	.circle p{margin-bottom:10px;}
	.txtsize{font-size:38px;}
	.txtjoin{font-size:34px;}
}


@media (max-width: 1399.98px) { 
	.txtsize{font-size:40px;}
	.txtjoin{font-size:33px;}
}

@media (min-width: 991.98px) and (max-width: 1199.98px) {   /**                       FOR IPAD   ***********************/
	.main-nav.position-absolute{position:static!important;background-color:#000B29;}
	.navbar .nav-item{margin:0px 8px;}
	.txtsize{font-size:40px;}
	.txtjoin{font-size:33px;}
}

@media (max-width: 991.98px) { 
	.txtsize{font-size:35px;}
	.txtjoin{font-size:28px;}
	.py-100,.py-60,.py-80{padding-top:50px;padding-bottom:50px;}
	.main-nav.position-absolute{position:static!important;background-color:#000B29;}
	
	.navbar .nav-item{margin:0px 10px;}
}

@media (min-width: 768px) and (max-width: 991.98px) { 
	
}

@media (max-width: 767.98px){
	.txtjoin{font-size:24px;}
	.txtsize{font-size:31px;}
	.container {max-width:100% !important;}
	.fs-22{font-size:20px;line-height:1.4;}
}

@media (max-width: 575.98px){
	.banner img {height:250px;width: 100%;-o-object-fit: cover;object-fit: cover;-o-object-position: center;object-position: center;}
	.navbar-brand {display: block;max-width: calc(100% - 90px);}
}

.work {
    height: 300px;
    object-fit: cover;
	width:100%;
}
/* Custom responsive styles */
.banner {
  min-height: 300px;
}

@media (max-width: 768px) {
  .banner-heading {
    font-size: 1.5rem !important;
    line-height: 1.3;
  }
  
  .banner-subheading {
    font-size: 1rem !important;
    line-height: 1.4;
  }
  
  .search-input {
    font-size: 0.875rem !important;
    padding: 0.5rem 0.75rem !important;
  }
  
  .search-btn {
    font-size: 0.75rem !important;
    padding: 0.375rem 0.75rem !important;
    white-space: nowrap;
  }
  
  .input-group {
    flex-wrap: nowrap !important;
  }
  
  .input-group .form-control {
    width: auto !important;
    flex: 1 1 auto !important;
  }
  
  .input-group-append {
    margin-left: -1px;
  }
  
  /* Button responsive styles */
  .browse-products-btn,
  .join-supplier-btn {
    font-size: 0.875rem !important;
    padding: 0.5rem 1.25rem !important;
    width: auto;
    min-width: 160px;
  }
  
  .gap-3 {
    gap: 0.75rem !important;
  }
}

@media (max-width: 576px) {
  .banner-heading {
    font-size: 1.25rem !important;
  }
  
  .banner-subheading {
    font-size: 0.875rem !important;
  }
  
  .search-input {
    font-size: 0.75rem !important;
    padding: 0.375rem 0.5rem !important;
  }
  
  .search-btn {
    font-size: 0.7rem !important;
    padding: 0.25rem 0.5rem !important;
  }
  
  /* Mobile button styles */
  .browse-products-btn,
  .join-supplier-btn {
    font-size: 0.75rem !important;
    padding: 0.375rem 1rem !important;
    min-width: 140px;
  }
  
  .px-3 {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}

@media (min-width: 769px) {
  .banner-heading {
    font-size: 2.5rem !important;
  }
  
  .banner-subheading {
    font-size: 1.25rem !important;
  }
  
  .browse-products-btn,
  .join-supplier-btn {
    font-size: 1rem !important;
    transition: all 0.3s ease;
  }
  
  .browse-products-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
  }
  
  .join-supplier-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
  }
}

/* Ensure z-index and positioning */
.zindex {
  z-index: 2;
}

.img-op-40 {
  opacity: 0.4;
}

.bg-black {
  background-color: #000;
}

/* Fix for search box overlap */
.position-absolute {
  pointer-events: none;
}

.position-absolute form,
.position-absolute .container,
.position-absolute .d-flex {
  pointer-events: auto;
}

/* Button hover effects */
.btn-outline-light {
  border-width: 2px;
}

.btn-outline-light:hover {
  background-color: #fff;
  color: #000 !important;
  border-color: #fff;
}

.btn-danger {
  background-color: #dc3545;
  border-color: #dc3545;
}

.btn-danger:hover {
  background-color: #bb2d3b;
  border-color: #b02a37;
}

/* Animation for buttons (optional) */
.browse-products-btn,
.join-supplier-btn {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.browse-products-btn:active,
.join-supplier-btn:active {
  transform: translateY(0);
}