@import 'slick.overrides.css';
@import 'semantic.overrides.css';
@import 'social.css';

@font-face {
  font-family: poppins;
  src: url(fonts/Poppins/Poppins-Regular.ttf);
}

/* Hide default scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

/* Style for scrollbar track */
::-webkit-scrollbar-track {
  background-color: #f1f1f1;
}

/* Style for scrollbar thumb */
::-webkit-scrollbar-thumb {
  background-color: #888;
}

/* Style for scrollbar thumb on hover */
::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}

body {
  font-size: 16px;
  font-family: poppins;
}
/* Margins */
.ui.ui-ma-none { margin: 0; }
.ui.ui-ma-xs { margin: 4px; }
.ui.ui-ma-sm { margin: 8px; }
.ui.ui-ma-md { margin: 16px; }
.ui.ui-ma-lg { margin: 24px; }
.ui.ui-ma-xl { margin: 32px; }
.ui.ui-ma-xxl { margin: 48px; }

.ui.ui-mx-none { margin: 0 0; }
.ui.ui-mx-xs { margin: 0 4px; }
.ui.ui-mx-sm { margin: 0 8px; }
.ui.ui-mx-md { margin: 0 16px; }
.ui.ui-mx-lg { margin: 0 24px; }
.ui.ui-mx-xl { margin: 0 32px; }
.ui.ui-mx-xxl { margin: 0 48px; }

.ui.ui-my-none { margin: 0 0; }
.ui.ui-my-xs { margin: 4px 0; }
.ui.ui-my-sm { margin: 8px 0; }
.ui.ui-my-md { margin: 16px 0; }
.ui.ui-my-lg { margin: 24px 0; }
.ui.ui-my-xl { margin: 32px 0; }
.ui.ui-my-xxl { margin: 48px 0; }

.ui.ui-mt-none { margin-top: 0; }
.ui.ui-mt-xs { margin-top: 4px; }
.ui.ui-mt-sm { margin-top: 8px; }
.ui.ui-mt-md { margin-top: 16px; }
.ui.ui-mt-lg { margin-top: 24px; }
.ui.ui-mt-xl { margin-top: 32px; }
.ui.ui-mt-xxl { margin-top: 48px; }

.ui.ui-mr-none { margin-right: 0; }
.ui.ui-mr-xs { margin-right: 4px; }
.ui.ui-mr-sm { margin-right: 8px; }
.ui.ui-mr-md { margin-right: 16px; }
.ui.ui-mr-lg { margin-right: 24px; }
.ui.ui-mr-xl { margin-right: 32px; }
.ui.ui-mr-xxl { margin-right: 48px; }

.ui.ui-mb-none { margin-bottom: 0; }
.ui.ui-mb-xs { margin-bottom: 4px; }
.ui.ui-mb-sm { margin-bottom: 8px; }
.ui.ui-mb-md { margin-bottom: 16px; }
.ui.ui-mb-lg { margin-bottom: 24px; }
.ui.ui-mb-xl { margin-bottom: 32px; }
.ui.ui-mb-xxl { margin-bottom: 48px; }

.ui.ui-ml-none { margin-left: 0; }
.ui.ui-ml-xs { margin-left: 4px; }
.ui.ui-ml-sm { margin-left: 8px; }
.ui.ui-ml-md { margin-left: 16px; }
.ui.ui-ml-lg { margin-left: 24px; }
.ui.ui-ml-xl { margin-left: 32px; }
.ui.ui-ml-xxl { margin-left: 48px; }

/* Paddings */
.ui.ui-pa-none { padding: 0; }
.ui.ui-pa-xs { padding: 4px; }
.ui.ui-pa-sm { padding: 8px; }
.ui.ui-pa-md { padding: 16px; }
.ui.ui-pa-lg { padding: 24px; }
.ui.ui-pa-xl { padding: 32px; }
.ui.ui-pa-xxl { padding: 48px; }

.ui.ui-px-none { padding: 0 0; }
.ui.ui-px-xs { padding: 0 4px; }
.ui.ui-px-sm { padding: 0 8px; }
.ui.ui-px-md { padding: 0 16px; }
.ui.ui-px-lg { padding: 0 24px; }
.ui.ui-px-xl { padding: 0 32px; }
.ui.ui-px-xxl { padding: 0 48px; }

.ui.ui-py-none { padding: 0 0; }
.ui.ui-py-xs { padding: 4px 0; }
.ui.ui-py-sm { padding: 8px 0; }
.ui.ui-py-md { padding: 16px 0; }
.ui.ui-py-lg { padding: 24px 0; }
.ui.ui-py-xl { padding: 32px 0; }
.ui.ui-py-xxl { padding: 48px 0; }

.ui.ui-pt-none { padding-top: 0; }
.ui.ui-pt-xs { padding-top: 4px; }
.ui.ui-pt-sm { padding-top: 8px; }
.ui.ui-pt-md { padding-top: 16px; }
.ui.ui-pt-lg { padding-top: 24px; }
.ui.ui-pt-xl { padding-top: 32px; }
.ui.ui-pt-xxl { padding-top: 48px; }

.ui.ui-pr-none { padding-right: 0; }
.ui.ui-pr-xs { padding-right: 4px; }
.ui.ui-pr-sm { padding-right: 8px; }
.ui.ui-pr-md { padding-right: 16px; }
.ui.ui-pr-lg { padding-right: 24px; }
.ui.ui-pr-xl { padding-right: 32px; }
.ui.ui-pr-xxl { padding-right: 48px; }

.ui.ui-pb-none { padding-bottom: 0; }
.ui.ui-pb-xs { padding-bottom: 4px; }
.ui.ui-pb-sm { padding-bottom: 8px; }
.ui.ui-pb-md { padding-bottom: 16px; }
.ui.ui-pb-lg { padding-bottom: 24px; }
.ui.ui-pb-xl { padding-bottom: 32px; }
.ui.ui-pb-xxl { padding-bottom: 48px; }

.ui.ui-pl-none { padding-left: 0; }
.ui.ui-pl-xs { padding-left: 4px; }
.ui.ui-pl-sm { padding-left: 8px; }
.ui.ui-pl-md { padding-left: 16px; }
.ui.ui-pl-lg { padding-left: 24px; }
.ui.ui-pl-xl { padding-left: 32px; }
.ui.ui-pl-xxl { padding-left: 48px; }

/* Global Reset for Gutters */
.ui.ui-gutter-none { gap: 0; }
/* Extra Small Gutters (4px) */
.ui.ui-gutter-xs { gap: 4px; }
.ui.ui-gutter-xs.row { row-gap: 4px; }
.ui.ui-gutter-xs.column { column-gap: 4px; }
/* Small Gutters (8px) */
.ui.ui-gutter-sm { gap: 8px; }
.ui.ui-gutter-sm.row { row-gap: 8px; }
.ui.ui-gutter-sm.column { column-gap: 8px; }
/* Medium Gutters (16px) */
.ui.ui-gutter-md { gap: 16px; }
.ui.ui-gutter-md.row { row-gap: 16px; }
.ui.ui-gutter-md.column { column-gap: 16px; }
/* Large Gutters (24px) */
.ui.ui-gutter-lg { gap: 24px; }
.ui.ui-gutter-lg.row { row-gap: 24px; }
.ui.ui-gutter-lg.column { column-gap: 24px; }
/* Extra Large Gutters (32px) */
.ui.ui-gutter-xl { gap: 32px; }
.ui.ui-gutter-xl.row { row-gap: 32px; }
.ui.ui-gutter-xl.column { column-gap: 32px; }
/* Specific Directions (Horizontal and Vertical) */

/* Horizontal Gutters */
.ui.ui-gutter-x-none { column-gap: 0; }
.ui.ui-gutter-x-xs { column-gap: 4px; }
.ui.ui-gutter-x-sm { column-gap: 8px; }
.ui.ui-gutter-x-md { column-gap: 16px; }
.ui.ui-gutter-x-lg { column-gap: 24px; }
.ui.ui-gutter-x-xl { column-gap: 32px; }

/* Vertical Gutters */
.ui.ui-gutter-y-none { row-gap: 0; }
.ui.ui-gutter-y-xs { row-gap: 4px; }
.ui.ui-gutter-y-sm { row-gap: 8px; }
.ui.ui-gutter-y-md { row-gap: 16px; }
.ui.ui-gutter-y-lg { row-gap: 24px; }
.ui.ui-gutter-y-xl { row-gap: 32px; }

.ui.ba {
  border: 1px solid #e1e1e1;
}
h1, h2, h3, h4, h5, h6,
.top-menu .ui.header { 
  margin: initial; 
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-capitalize {
  text-transform: capitalize;
}
.text-underline {
  text-decoration: underline;
}
.text-success {
  color: #2c662d;
}
.text-error {
  color: #9f3a38;
}
.ui.date {
  font-size: 12px;
  opacity: 0.8;
}
.ui.caption {
  font-size: 15px;
  opacity: 0.8;
}
.ui.menu {
  margin-bottom: 0;
}
.ui.sticky {
  position: sticky;
  top: 8px;
}
pre {
  background: #000;
  color: #fff;
  padding: 8px;
  border-radius: 8px;
}
.ui.absolute {
  position: absolute;
}
.ui.relative {
  position: relative;
}
.ui.absolute.top.right {
  top: 0;
  right: 0;
}
.ui.absolute.top.left {
  top: 0;
  left: 0;
}
.ui.absolute.bottom.right {
  bottom: 0;
  right: -10px;
}
.ui.absolute.bottom.left {
  bottom: 0;
  left: 0;
}
.ui.search .results .result {
  padding: 8px 12px !important;
}
.ui.search .results {
  max-height: 300px;
  overflow-y: scroll;
}
.ui.pagination .item.active {
  font-weight: bolder;
  font-size: 16px;
}
.ui.full-width {
  width: 100%;
}
.ui.card {
  width: 100%;
}
.wrapper {
  padding: 48px 32px;
  min-height: 500px;
}
#home.wrapper  {
  padding: 0 32px 48px;
}
.ui.items>.item .meta {
  margin: 0.25rem 0 0.5rem 0;
}
.username {
  font-size: 14px;
  color: #555;
}
.left-menu.menu .item.active {
  font-weight: 900;
}
.ui.d-flex {
  display: flex;
}
.ui.d-flex.align-items {
  align-items: center;
}
.ui.form .field>label {
  text-align: left;
}
.avatar {
  border: 1px solid #e1e1e1;
  border-radius: 4px;
}
.ui.breadcrumb {
  line-height: 1.5em;
}

.main-menu .menu .item {
  font-size: 18px;
  font-weight: 600!important;
  padding: 4px 16px!important;
}
.ui.menu .item:before {
  content: none;
}
.social-share{
  display: flex;
  gap: 10px;
}
.ui.tabular .item {
  font-size: 18px;
  cursor: pointer;
}
.ui.tabular.menu .active.item {
  color: #a60500;
}
.ui.fluid-bg {
  background-color: #e1e1e1!important;
}
.floating-bottom {
  position:absolute;
  bottom:0;
  width:100%;
  color:#fff;
  line-height: 1.8rem;
  font-weight:900;
  font-size:20px;
  background: rgba(0,0,0,1);
  display:flex;
  align-items:center;
  justify-content: center;
}
ul.footer-menu li {
  padding-bottom: 12px;
}
.footer-menu a {
  color: #fff;
  font-size: 16px;
  border-bottom: 1px solid;
  line-height: 1rem;
}
.hero-slider .ui.slide-item {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  min-height: calc(100vh - 100px);
}

.slide-item > div {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 10%;
  max-width: 350px;
  bottom: auto!important;
}

.slick-prev:before, .slick-next:before{
  background: #000;
  padding: 5px;
}
.customer-review .slick-slide {
  margin-left: 10px;
  margin-right: 10px;
}
.slick-prev.slick-arrow {
  padding: 4px;
}
.slick-next.slick-arrow {
  padding: calc(4px + 30px);
}

.ui.menu.top.secondary {
  background-color: #a47e18;
}
.menu.top.secondary p.item a {
  color: #fff;
}
.ui.top-menu.main-menu {
  display: flex;
  justify-content: space-between;
}

/* overrides */
.ui.grid>[class*="five wide widescreen"].column, 
.ui.grid>[class*="five wide computer"].column {
  width: 33.33%!important;
}
.ui.card.product .image {
  background-color: #000;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Hide mobile.only on tablet & computer */
@media only screen and (min-width: 768px) {
  .mobile.only {
    display: none !important;
  }
}
/* responsive */
@media only screen and (max-width: 767px) {
  .computer.only,
  .tablet.only {
    display: none !important;
  }
  .ui.grid>[class*="sixteen wide mobile"].column {
    width: 100%!important;
  }
  #home.wrapper, .wrapper {
    padding: 0;
    min-height: 400px;
  } 
  .wrapper {
    padding: 16px 0;
  } 
  .ui.ui-px-xxl {
    padding: 0 16px;
  }
  .ui.social-share .ui.bottom.right {
    display: grid;
    bottom: -75px;
    gap: 4px;
  }
  .right.menu {
    position: absolute;
    right: 0;
  }
  .right.menu .item.social {
    padding: 4px!important;
  }
  .hero-slider .ui.slide-item {
    min-height: auto;
    background-position: left;
  }
  .slide-item > div {
    bottom: 0 !important;
    max-width: initial;
    width: 100%;
    left: 0;
    top: auto;
    transform: translateY(0);
  }
  .ui.tabular.menu .item {
    font-size: 14px;
    font-weight: 900;
  }
}