@font-face {
  font-family: "AmazonEmberDisplay_Bd";
  src: url("../fonts/AmazonEmberDisplay_Bd.ttf") format("truetype");
}
@font-face {
  font-family: "AmazonEmberDisplay_He";
  src: url("../fonts/AmazonEmberDisplay_He.ttf") format("truetype");
}

@font-face {
  font-family: "AmazonEmberDisplay_Lt";
  src: url("../fonts/AmazonEmberDisplay_Lt.ttf") format("truetype");
}

@font-face {
  font-family: "AmazonEmberDisplay_Md";
  src: url("../fonts/AmazonEmberDisplay_Md.ttf") format("truetype");
}

@font-face {
  font-family: "AmazonEmberDisplay_Rg";
  src: url("../fonts/AmazonEmberDisplay_Rg.ttf") format("truetype");
}

html,
body {
  padding: 0;
  margin: 0;
  font-family: AmazonEmberDisplay_Rg !important;
  height: 100%;
}

html {
  scroll-padding-top: 67px;
}

//   .btn-xl {
//     text-transform: uppercase;
//     padding: 1.5rem 3rem;
//     font-size: 0.9rem;
//     font-weight: 700;
//     letter-spacing: 0.1rem;
//   }

.navbar-custom {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: #191919;
}
.navbar-custom .navbar-brand {
  text-transform: uppercase;
  font-size: 1rem;
  letter-spacing: 0.1rem;
  font-weight: 700;
}
.navbar-custom .navbar-nav .nav-item .nav-link {
  text-transform: uppercase;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1rem;
}

header.masthead {
  position: relative;
  overflow: hidden;
  //   padding-top: calc(7rem + 72px);
  padding-bottom: 7rem;
  //   background: linear-gradient(0deg, #ff6a00 0%, #ee0979 100%);
  background: url(../images/band-background.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: scroll;
  background-size: cover;
  border-bottom: 15px solid;
  border-image: linear-gradient(
      to right,
      #59caf4 33.33%,
      #f38d9a 33.33%,
      #f38d9a 66.66%,
      #fcc375 66.66%
    )
    5;
  //   -webkit-filter: brightness(50%);
  //   filter:brightness(50%);
}
header.masthead::after {
  content: ""; // ::before and ::after both require content
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(120deg, #252525, #252525);
  opacity: 0.7;
}

header.masthead .masthead-content {
  z-index: 1;
  position: relative;
}
header.masthead .masthead-content .masthead-heading {
  font-size: 4rem !important;
  font-family: AmazonEmberDisplay_He;
  font-weight: bold;
}
header.masthead .masthead-content .masthead-subheading {
  font-size: 3rem !important;
  font-family: AmazonEmberDisplay_He;
  font-weight: bold;
}
header.masthead .bg-circle {
  z-index: 0;
  position: absolute;
  border-radius: 100%;
  background: linear-gradient(0deg, #ee0979 0%, #ff6a00 100%);
}
header.masthead .bg-circle-1 {
  height: 90rem;
  width: 90rem;
  bottom: -55rem;
  left: -55rem;
}
header.masthead .bg-circle-2 {
  height: 50rem;
  width: 50rem;
  top: -25rem;
  right: -25rem;
}
header.masthead .bg-circle-3 {
  height: 20rem;
  width: 20rem;
  bottom: -10rem;
  right: 5%;
}
header.masthead .bg-circle-4 {
  height: 30rem;
  width: 30rem;
  top: -5rem;
  right: 35%;
}

@media (min-width: 992px) {
  header.masthead {
    padding-top: calc(10rem + 55px);
    padding-bottom: 10rem;
  }
  header.masthead .masthead-content .masthead-heading {
    font-size: 6rem;
  }
  header.masthead .masthead-content .masthead-subheading {
    font-size: 4rem;
  }
}

section.industries {
  padding-top: 5rem;
  padding-bottom: calc(10rem - 4.5rem);
  text-align: center;
}

section.services, section.contact-us {
  padding-top: 5rem;
  padding-bottom: calc(10rem - 4.5rem);
  text-align: center;
}

section {
  h3 {
    font-family: AmazonEmberDisplay_Bd;
    font-size: 2.5rem;
    font-weight: bold;
  }
}

/* Remove default list styles */
ul.horizontal-list {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center; /* Center items horizontally on small screens */
  display: flex;
  justify-content: center;
  gap: 60px;
}

/* Style each list item */
ul.horizontal-list li {
  width: 115px;
  display: inline-block; /* Display items horizontally */
  //   margin-right: 50px; /* Add space between items (adjust as needed) */

  p {
    font-size: 0.8rem;
  }
}

/* Style the images within list items */
ul.horizontal-list li img {
  max-width: 100%; /* Make images responsive */
  height: auto; /* Maintain the aspect ratio of the images */
  vertical-align: middle; /* Align images vertically within the list item */
  height: 115px;
}

/* Style the text content (if needed) */
ul.horizontal-list li span {
  display: block; /* Ensure text is on a new line */
  text-align: center; /* Center text horizontally within each list item */
  font-family: AmazonEmberDisplay_He;
  width: 115px;
}

/* Media query for smaller screens */
@media (max-width: 768px) {
  ul.horizontal-list li {
    display: block; /* Stack items vertically on smaller screens */
    margin-right: 0; /* Remove margin between items */
    margin-bottom: 10px; /* Add space between items vertically */
  }
}

section.parallax-section {
  padding-top: 10rem;
  padding-bottom: calc(10rem - 4.5rem);
  background: url("../images/fabric\ printer.png") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  color: #ffffff;
  height: 500px;
  -webkit-filter: brightness(40%);
  filter: brightness(40%);
}

section.section-right-img {
  background-color: #191919;
  color: #fff;

  h2 {
    font-family: AmazonEmberDisplay_Bd;
    font-size: 2.5rem;
  }

  .section-content {
    padding-left: 50px;
    margin-top: 20px;
  }

  .uniforms-image {
    background: url("../images/custom-team-wear.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }

  .spiritwear-image {
    background: url("../images/spiritwear.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }
  .streetwear-image {
    background: url("../images/streetwear.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }

  
}

section.section-left-img {
  background-color: #fff;
  color: #191919;

  h2 {
    font-family: AmazonEmberDisplay_Bd;
    font-size: 2.5rem;
  }

  .section-content {
    padding-left: 50px;
    margin-top: 20px;
  }

  .corportate-image {
    background: url("../images/corporatewear.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }

  .influencer-image {
    background: url("../images/influencers.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }

  .band-image {
    background: url("../images/bandmerch.jpg") no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 550px;
  }
}

.icon {
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;

  &.size-21 {
    width: 21px !important;
    height: 21px !important;
  }

  &.icon-sign-up {
    background-image: url("../images/icons/SIGN\ UP.svg");
    width: 25px !important;
    height: 18px !important;
  }

  &.icon-sign-in {
    background-image: url("../images/icons/SIGN\ IN.svg");
    width: 25px !important;
    height: 18px !important;
  }

  &.icon-cart {
    background-image: url("../images/icons/CART.svg");
    width: 25px !important;
    height: 18px !important;
  }

  &.icon-catalog {
    background-image: url("../images/icons/CATALOG\ ICON.svg");
    width: 25px !important;
    height: 18px !important;
  }

  &.industries-team-uniform {
    background-image: url("../images/icons/INDUSTRIES\ 1.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.industries-band {
    background-image: url("../images/icons/INDUSTRIES\ 2.svg");
    width: 100px !important;
    height: 100px !important;
  }
  &.industries-school {
    background-image: url("../images/icons/INDUSTRIES\ 3.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.industries-influencer {
    background-image: url("../images/icons/INDUSTRIES\ 4.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.industries-streetwear {
    background-image: url("../images/icons/INDUSTRIES\ 5.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.industries-corporate {
    background-image: url("../images/icons/INDUSTRIES\ 6.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-sublimation {
    background-image: url("../images/icons/SERVICES\ 1.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-dtf {
    background-image: url("../images/icons/SERVICES\ 2.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-screen-print {
    background-image: url("../images/icons/SERVICES\ 3.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-embroidery {
    background-image: url("../images/icons/SERVICES\ 4.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-cutsaw {
    background-image: url("../images/icons/SERVICES\ 5.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.services-fulfillment {
    background-image: url("../images/icons/SERVICES\ 6.svg");
    width: 100px !important;
    height: 100px !important;
  }

  &.merchbay-icon {
    background-image: url("../images/icons/MERCHBAY\ LOGO\ ICON.svg");
    width: 150px !important;
    height: 125px !important;
  }
}

.horizontal-divider {
  width: 150px;
  height: 7px;
  background-color: #59caf4;
  text-align: center;
  margin: 0px auto;

  &.bg-red {
    background-color: #f38d9a !important;
  }

  &.bg-yellow {
    background-color: #fcc375 !important;
  }
}

.gap-100 {
  gap: 100px !important;
}

.contact-input-custom {
  border-radius: 0px !important;
  border: 8px solid #c4d2d7 !important;
}

.contact-input-custom::-webkit-input-placeholder {
  color: #c4d2d7;
  font-size: 16px;
}

input {
  color: #434445;
}

.btn-contact {
  border-radius: 0;
  background-color: #59caf4;
  border: 1px solid #59caf4;
  color: #ececec;
}


.btn-contact:hover {
  border-radius: 0;
  background-color: #4db2d7;
  border: 1px solid #4db2d7;
  color: #ececec;
}


footer {
  background-color: #171717;
  text-align: center;
  padding: 1rem 0px;
  border-bottom: 15px solid;
  border-image: linear-gradient(
      to right,
      #59caf4 33.33%,
      #f38d9a 33.33%,
      #f38d9a 66.66%,
      #fcc375 66.66%
    )
    5;
  p {
    color: #fff;
  }
}

.login-page-right {
  background: url("../images/bb.jpg") no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 100vh;
}


section.login {
  padding-top: 5rem;
  // padding-bottom: calc(10rem - 4.5rem);
  text-align: center;
}