/*####################Fonts(Using Montserat instead of Gotham)#######################*/
/* @font-face {
   font-family: 'Montserrat';
   src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'Gotham';
   src: url('../fonts/Gotham.ttf') format('truetype');
   font-weight: 300;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'Gotham';
   src: url('../fonts/Gotham.ttf') format('truetype');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
} */
 
 @font-face {
   font-family: 'Gotham';
    src: url('../fonts/GOTHAM-BOLD.TTF') format('truetype');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
}
/* @font-face {
  font-family: 'Gotham';
  src: url('../fonts/Gotham-Light.otf') format('opentype');
  font-weight: 300; 
  font-style: normal;
  font-display: swap;
} */

body{font-family: 'Gotham';}
/*############################################ Fonts [END]################################# */

/*#########################################General [START]##################################*/
p {
   margin-bottom: 0;
}

svg {
   cursor: pointer;
}

a:hover {
   color: inherit;
   text-decoration: none;
}

#header-middle,
#index {
   padding: 0 25px;
}

#header-middle {
   justify-content: space-between;
}

.hidden {
   display: none !important;
}
.view-total{
   margin-top: -125px !important;
}
/*######################################## General [END]#################################### */

/*######################################Top Header [Start]###################################*/
#header-top {
   background-color: #000000;
   color: #ffffff;
   font-size: 15px;
   text-transform: uppercase;
   text-align: center;
   padding: 8px;
}

.splide {
   z-index: 999;
}

.splide__track--draggable {
   height: 38px !important;
}

.splide__list {
   color: #ffffff !important;
   width: 100%;
}

.splide__slide {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 15px;
   background-color: #313842 !important;
   font-family: 'Gotham';
}

.splide__list i {
   margin-right: 30px;
}

.bold-text {
   font-weight: 800;
   margin-right: 5px;
   margin-left: 5px;
}

.close-banner-button {
   color: white;
   position: absolute;
   top: 20px;
   right: 20px;
   z-index: 1;
   cursor: pointer;
   background-color: transparent !important;
   border: none;
}

@media (max-width: 800px) {
   .splide__list i {
      margin-right: 10px !important;
   }

   .splide__slide {
      font-size: 12px;
   }
}

/*##################################### Top Header [End]#######################################*/

/*##################################### Main Header [End]#######################################*/
#header-logo img {
   /* max-width: 200px; */
   max-width: 145px;
   width: 100%;
   object-fit: contain;
   margin: 20px 0px;
}

.navbar .nav-link {
   display: inline-block;
   font-size: 15px;
   color: #000000;
   font-family: 'Gotham';
   padding: 3px;

}

.wishList,
.cart {
   position: relative;
   display: inline-block;
}
.cart{width: 100%;}

.wishlist-count,
.spnCartCount {
   position: absolute;
   top: 55%;
   /* left: 50%; */
   /* left: 38% ;  */
   transform: translate(-50%, -50%);
   font-size: 12px;
   font-weight: bold;
   color: #000000;
   margin-left: 10px;
}
.wishlist-count{margin-left: 13px !important;top:54% !important}

#header-icons {
   display: flex;
   align-items: center;
   justify-content: end;
   gap: 40px;
}

#Dname {
   font-size: 12px;
   color: #000000;
   display: block;
   position: absolute;
}

.account {
   /* margin-bottom: -15px; */
   text-align: center;
}

.search-form {
   display: flex;
   min-width: 230px;
   background: #fff;
   z-index: 9999;
}

.search-form input {
   width: 80%;
   border: none;
   border-bottom: 1px solid #000;
   outline: none;
}

.search-form button {
   width: 17px;
   background-color: transparent;
   border: none;
}


.dropdown-submenu {
   list-style: none;
   padding-left: 0;
   margin-top: 8px;
}

.sub-item {
   font-size: 0.9em;
}

.dropdown-item.dropdown-toggle {
   font-family: 'Gotham';
   font-weight: bold;
   color: #000000;
   text-wrap: balance;
}

.dropdown-item.dropdown-toggle:hover,
.list-unstyled li a:hover {
   background-color: transparent;
   /* color: #EC1E24; */
}

.dropdown-submenu li a:hover {
   background-color: transparent;
   /* color: #EC1E24; */
}

.dropdown-item.sub-item {
   font-size: 12px;
   font-family: 'Montserrat';
   color: #000000;
}

.list-unstyled .dropdown-item {
   font-family: 'Gotham';
   font-weight: bold;
   color: #000000;
}

.full-width-dropdown .container-fluid .row {
   width: 100%;
   margin: 0;
}

.full-width-dropdown .container-fluid .row.flex-wrap .col-4 {
   margin: 18px 0px;
}

.full-width-dropdown .container-fluid .row .col-3.static {
   border-right: 1px solid #f4ecec;
   display: flex;
   flex-direction: column;
   /* justify-content: center; */
   align-items: center;
   gap: 2px;
}

.dropdown-item.dropdown-toggle::after {
   content: none;
}

.full-width-dropdown .container-fluid .row .col-3.static .list-unstyled {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

#boxes .nav-item.active .nav-link {
   color: #313842;
   border-bottom: 2px solid transparent;
   transition: color 0.3s ease, border-bottom-color 0.3s ease;
}

#boxes .nav-item.active:hover .nav-link {
   /* color: #EC1E24; */
   border-bottom-color: #000;
}

#boxes .nav-item.active:hover svg path {
   fill: #EC1E24;
   stroke: #EC1E24;
}

.mob-menu-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 15px;
   border-bottom: 1px solid gray;
   width: 100%;
}


/* .navbar .dropdown-menu{
   background-color: rgb(94, 67, 64);
}
.nav .dropdown-item{
   color: #fff;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.nav .dropdown-item:hover{
   background-color: white;
   color: #5E4340;
}
.nav .dropdown-item:hover{
   color: rgb(94, 67, 64);
}
.nav .dropdown-toggle::after{
   display: none;
}
.dropdown-menu li {
   position: relative;
}
.dropdown-submenu{
   position: absolute;
    left: 100%;
    top: 0;
    list-style: none;
    background: rgb(94, 67, 64);
    display: none;
    padding: 10px 0;
    min-width: 200px;
    border-radius: 3px;

}
.dropdown-menu li:hover .dropdown-submenu {
   display: block;
} */




/*##################################### Main Header [End]#######################################*/

/*#####################################---{{{FOOTER}}}----#####################################*/
footer {
   margin: 45px 25px 0px;
   background: #d3d3d3;
   border-radius: 23px;
   padding: 25px 30px;
}

#footer-container {
   margin-bottom: 20px;
   border-bottom: 1px solid #ECECEC;
}

#footer-container .columnI img {
   object-fit: contain;
}

#footer-container li a {
   color: inherit;
}


/*##################################### Media Queries [START]#######################################*/
/* if screen size is greater than 992 */
@media screen and (min-width: 992px) {
   .navbar-expand-lg .navbar-nav .nav-link {
      padding: 0;
   }

   .dropdown-menu li svg {
      transform: rotate(270deg);
      stroke: white
   }

   .dropdown-menu li:hover svg {
      stroke: #000000;
   }

   .mob-menu-header {
      display: none !important;
   }


}

@media screen and (max-width:767px) {
   #Dname {
      display: none;
   }
   #footer-container .columnI img{width: 200px;}
   footer{margin: 45px 0px 0px;}
   .account {
      margin-bottom: 0;
   }
}

/* if screen size is greater less than 992 */
@media (max-width: 991px) {
   header .navbar-toggler-icon {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='23.775' viewBox='0 0 30 23.775'%3E%3Cg id='menu' transform='translate(-1 -4.112)'%3E%3Cpath id='Path_54' data-name='Path 54' d='M30,4.112H2a1,1,0,0,0,0,2H30a1,1,0,0,0,0-2Z' fill='%235E4340'/%3E%3Cpath id='Path_55' data-name='Path 55' d='M30,15H2a1,1,0,0,0,0,2H30a1,1,0,0,0,0-2Z' fill='%235E4340'/%3E%3Cpath id='Path_56' data-name='Path 56' d='M30,25.888H2a1,1,0,0,0,0,2H30a1,1,0,0,0,0-2Z' fill='%235E4340'/%3E%3C/g%3E%3C/svg%3E");
   }

   nav.navbar {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: white;
      transform: translate(-101%);
      transition: transform .5s cubic-bezier(.4, 0, .2, 1);
      overflow: hidden;
      z-index: 999;
   }

   #boxes .nav-link {
      text-align: center;
      padding: 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
   }
   #boxes .nav-link svg {
      z-index: 9999;
      width: 15px;
      height: 15px;
   }

   #boxes .nav-item {
      display: flex;
      align-items: flex-start;
      border-bottom: 1px solid #d3d3d3 !important;
      padding: 5px 10px;
      flex-direction: column;

   }
   .full-width-dropdown .container-fluid .row.flex-wrap .col-4{
      max-width: 100%;
      flex: 100%;
      border-bottom:1px solid rgb(224, 224, 224)
   }
   .nav-item .col-9{max-width: 100%;flex:100%}
   .nav-item .dropdown-submenu{display: none;}
   #header-logo {
      order: 1
   }

   #header-icons {
      order: 2;
      gap: 20px
   }

   #header-nav {
      order: 3
   }

   /* .navbar-toggler{position: absolute;right: 0;top: -70px;} */
   #header-nav-mobile {
      width: 30px;
      height: 30px;
   }

   header nav .navbar-toggler-icon {
      display: none;
   }

   .full-width-dropdown {
      width: 100%;
      left: 0;
      right: 0;
      top: 94%;
      border: 0;
   }

   nav .static {
      display: none !important;
   }
}

/* if screen size is less than 500 */
@media screen and (max-width: 500px) {
   #header-icons {
      gap: 12px
   }

   #mob-menu-toggler {
      padding: 2px;
   }
}

/* if screen size is less than 425 */
@media screen and (max-width: 425px) {
   #header-icons {
      gap: 7px
   }

   #header-icons svg {
      width: 18px;
   }

   header .navbar-toggler-icon {
      background-size: 18px;
   }

}


/*##################################### Media Queries [END]#########################################*/



/*#####################################---{{{FOOTER}}}----#####################################*/


/*######## Footer Column I ########*/
.footer-newsletter {
   font-family: 'Gotham';
   font-size: 20px;
   margin-top: 1rem;
   /* color: white; */
}

.footer-newsletter form {
   margin: 1rem 0px;
}

.footer-newsletter .form-group {
   /* display: flex; */
   align-items: center;
   position: relative;
   max-width: 400px;
}

.footer-newsletter .form-group .form-control {
   width: 100%;
   padding: 30px;
   box-sizing: border-box;
   border: 1px solid #000000;
   border-radius: 30px;
}

.footer-newsletter .form-group .btn {
   position: absolute;
   right: 0;
   top: 0;
   bottom: 0;
   border-radius: 50%;
   border: 1px solid #000000;
   background: #000000;
   cursor: pointer;
   padding: 0 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 62px;
}

.footer-newsletter .form-group .btn svg {
   width: 33px;
   height: 33px;
}

.social-icons {
   margin: 10px 0px;
   display: flex;
   gap: 0.5rem;
}

/*######## Footer Column II AND Column III ########*/
#footer-container .columnII,
#footer-container .columnIII {
   font-family: 'Gotham';
   /* color: #fff */
}

#footer-container .columnII ul,
#footer-container .columnIII ul {
   list-style: none;
   padding: 0;
   text-decoration: none;
   font-family: 'Gotham';
}

#footer-container .columnII ul li,
#footer-container .columnIII ul li {
   margin: 7px 0px;
   font-size: 18px;
}


/*######## Footer Bottom ########*/
#footer-bottom .footerCopyrights,
.cumuluslogo p {
   font-family: 'Gotham';
   font-size: 15px;
   color: #bbb9b7;
}



.footer-cookies {
   width: 100%;
   background: #000000;
   font-size: 13px;
   position: fixed;
   bottom: 0;
   padding: 10px 0;
   text-align: center;
   z-index: 9999;
}

.footer-cookies p {
   position: relative;
   font-size: 13px;
   font-weight: bold;
   color: #fff;
   margin: 0;
}

.footer-cookies p a {
   color: #ffffff;
   font-size: 13px;
   text-transform: capitalize;
   font-weight: bold;
}

.footer-cookies .close {
   width: 20px;
   height: 28px;
   position: absolute;
   right: 5px;
   top: 1px;
}