@font-face {
  font-family: "Mulish";
  src: url("/assets/fonts/Mulish-Regular.woff") format("woff");
  font-weight: 400;
}
@font-face {
  font-family: "Mulish";
  src: url("/assets/fonts/Mulish-SemiBold.woff") format("woff");
  font-weight: 600;
}
@font-face {
  font-family: "Mulish";
  src: url("/assets/fonts/Mulish-Bold.woff") format("woff");
  font-weight: 700;
}
.club-details-banner {
  max-width: 1170px;
  width: 100%;
  height: 316px;
  padding: 96px 48px;
  gap: 48px;
  border-radius: 8px;
  background-image: url(../assets/images/clubcardbg.png);
  background-size: cover;
  background-color: #0058ad;
  background-position: center;
  position: relative;
}
.club-details-banner .club-details-banner-texts {
  width: 100%;
  height: 110px;
  gap: 30px;
}
.club-details-banner .club-details-banner-texts .club-details-banner-titles {
  width: 522px;
  height: 84px;
  gap: 4px;
}
.club-details-banner .club-details-banner-texts .club-details-banner-titles * {
  margin: 0;
}
.club-details-banner .club-details-banner-texts .club-details-banner-titles .club-details-banner-titles-location {
  width: 100%;
  height: 50px;
  color: #ffffff;
  font-family: "Mulish", sans-serif !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  line-height: 50px !important;
}
.club-details-banner .club-details-banner-texts .club-details-banner-titles .club-details-banner-titles-name {
  width: 100%;
  height: 30px;
  color: #ffffff;
  font-family: "Mulish", sans-serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  line-height: 30px !important;
  text-transform: uppercase;
}
.club-details-banner .club-details-banner-texts .club-details-banner-text {
  width: 100%;
  max-width: 522px;
  height: 110px;
  opacity: 0.75;
  font-family: "Mulish", sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  color: #ffffff;
  margin: 0;
}
.club-details-banner .club-details-banner-tabs {
  position: absolute;
  width: 100%;
  height: 62px;
  padding: 0px 42px 0px 42px;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1019607843);
}
.club-details-banner .club-details-banner-tabs .club-details-banner-tab {
  width: -moz-fit-content;
  width: fit-content;
  height: 62px;
  padding: 16px 16px 0px 16px;
  color: #ffffff;
  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  position: relative;
  cursor: pointer;
  white-space: nowrap;
}
.club-details-banner .club-details-banner-tabs .club-details-banner-tab.active {
  font-family: "Mulish", sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
}
.club-details-banner .club-details-banner-tabs .club-details-banner-tab.active::before {
  content: "";
  position: absolute;
  width: 120px;
  height: 8px;
  border-radius: 8px 8px 0px 0px;
  background: #ffffff;
  bottom: 0;
}

.club-details-branches {
  max-width: 1170px;
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  gap: 30px;
}
.club-details-branches .club-details-branch-card {
  text-decoration: none;
  width: 270px;
  height: 200px;
  padding: 24px;
  gap: 16px;
  border-radius: 8px 30px 8px 30px;
  background: #ffffff;
  cursor: pointer;
}
.club-details-branches .club-details-branch-card * {
  margin: 0;
}
.club-details-branches .club-details-branch-card .club-details-branch-card-top {
  width: 222px;
  height: 118px;
}
.club-details-branches .club-details-branch-card .club-details-branch-card-top .club-details-branch-card-img {
  width: 50px;
  height: 50px;
  border-radius: 8px;
  border: 1px solid #dee3ed;
}
.club-details-branches .club-details-branch-card .club-details-branch-card-top .club-details-branch-card-title {
  width: 222px;
  height: 68px;
  color: #222943;
  font-family: "Mulish", sans-serif !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  line-height: 34px !important;
}
.club-details-branches .club-details-branch-card .club-details-branch-card-bot {
  width: 222px;
  height: 18px;
  gap: 8px;
}
.club-details-branches .club-details-branch-card .club-details-branch-card-bot .club-details-branch-card-playercount {
  width: -moz-fit-content;
  width: fit-content;
  height: 18px;
  gap: 0px;
  color: #222943;
  font-family: "Mulish", sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
}

.club-details-informations {
  max-width: 1170px;
  width: 100%;
  row-gap: 24px;
  -moz-column-gap: 30px;
       column-gap: 30px;
}
.club-details-informations .club-details-informations-contact {
  width: 370px;
  min-width: 351px;
  height: 148px;
  padding: 24px;
  gap: 16px;
  border-radius: 8px;
  background: #ffffff;
}
.club-details-informations .club-details-informations-contact .club-details-informations-contact-element {
  width: 322px;
  height: 22px;
  font-family: "Mulish", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  color: #222943;
}
.club-details-informations .club-details-informations-contact .club-details-informations-contact-element.title {
  font-family: "Mulish", sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  font-weight: 400px !important;
}
.club-details-informations .club-details-informations-members {
  max-width: 1170px;
  width: 100%;
  padding: 0px 0px 24px 0px;
  gap: 30px;
}
.club-details-informations .club-details-informations-members .club-details-informations-member-card {
  width: 370px;
  min-width: 351px;
  height: 96px;
  padding: 24px;
  gap: 16px;
  border-radius: 8px;
  background: #ffffff;
}
.club-details-informations .club-details-informations-members .club-details-informations-member-card .club-details-informations-member-card-title {
  width: 322px;
  height: 22px;
  font-family: "Mulish", sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  color: #222943;
}
.club-details-informations .club-details-informations-members .club-details-informations-member-card .club-details-informations-member-card-name {
  width: 322px;
  height: 22px;
  font-family: "Mulish", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  color: #222943;
}

@media (max-width: 1024px) {
  .club-details-branches {
    justify-content: center !important;
  }
}
@media (max-width: 480px) {
  .club-details-branches {
    justify-content: center;
  }
  .club-details-branches .club-details-branch-card {
    width: 100% !important;
  }
  .club-details-banner {
    height: 310px;
    padding: 36px 0px 0px 0px;
    gap: 48px;
    border-radius: 8px;
    justify-content: flex-start !important;
  }
  .club-details-banner .club-details-banner-texts {
    flex-direction: column !important;
    height: auto;
    align-items: center;
    padding: 0px 24px 0px 24px;
    gap: 30px;
  }
  .club-details-banner .club-details-banner-texts .club-details-banner-titles {
    width: -moz-fit-content;
    width: fit-content;
    height: auto;
  }
  .club-details-banner .club-details-banner-texts .club-details-banner-titles * {
    height: auto !important;
  }
  .club-details-banner .club-details-banner-texts .club-details-banner-text {
    height: auto;
  }
  .club-details-informations {
    justify-content: center !important;
  }
  .club-details-informations .club-details-informations-members {
    justify-content: center !important;
  }
}/*# sourceMappingURL=clubdetails.css.map */