/***************************************************************************************************
****************************************************************************************************
****************************************************************************************************
GENERAL COMPONENTS
****************************************************************************************************
****************************************************************************************************
***************************************************************************************************/
html,
body {
  margin: 0;
  padding: 0;
  font-family: "Lato", sans-serif;
  font-size: 13px; }

.h-100-vh {
  height: 100vh !important; }

.ui-page {
  height: 100%; }

.img-background .container {
  z-index: 10; }

.main-color {
  color: #000000; }

#install-banner {
  position: fixed;
  top: 3.25rem;
  z-index: 1;
  width: 100%;
  height: auto;
  padding: 0.25rem;
  background-color: #000000;
  color: #FFFFFF;
  display: none; }

#install-banner .dismiss {
  font-size: 2rem;
  margin-bottom: 0.3rem; }

#install-banner .btn {
  height: 2.5rem;
  background-color: #000000;
  color: #FFFFFF !important; }

/***************************************************************************************************
LINKS
***************************************************************************************************/
a.link-club {
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.75;
  letter-spacing: normal;
  color: #000000 !important;
  text-transform: uppercase;
  font-family: "Lato", sans-serif; }

a.link-club img {
  height: 1.125rem; }

/* Link to static pages in bottom */
.link-bottom-static {
  position: relative;
  bottom: 1.3rem; }

/***************************************************************************************************
BUTTONS
***************************************************************************************************/
.btn.btn-club,
.btn.btn-club-collapse-partial {
  background-color: #000000;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.84;
  letter-spacing: normal;
  text-align: center;
  color: #FFFFFF !important;
  border-radius: 50px; }
  .btn.btn-club:hover,
  .btn.btn-club-collapse-partial:hover {
    background-color: #000000;
    color: #FFFFFF; }

.btn-club-login-proccess {
  margin-top: 4rem; }

.btn.btn-club-collapse-partial {
  box-shadow: unset;
  min-width: 8rem; }

.btn.btn-club:disabled {
  background-color: #cbcbcb;
  color: #fff !important;
  opacity: 1; }

.btn.btn-club-profile {
  background-color: #00000010;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.84;
  letter-spacing: normal;
  text-align: center;
  color: black;
  border-radius: 5px;
  font-family: "Lato", sans-serif;
  width: 8rem;
  min-width: 8rem;
  font-size: 0.8rem; }

.btn.btn-club-profile-empty {
  width: 8rem; }

#btn-cancel.btn {
  background-color: #e12222;
  color: #fff !important; }

.btn.btn-cancel {
  background-color: #e12222;
  color: #fff !important; }

/***************************************************************************************************
RADIO BUTTONS
***************************************************************************************************/
/* Create a custom checkbox */
.form-radio {
  display: block;
  position: relative;
  padding-left: 2rem;
  margin-bottom: 0.6rem !important;
  cursor: pointer;
  font-size: 0.9rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-weight: bold; }

/* Hide the browser's default radio button */
.form-radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer; }

/* Create a custom radio button */
.radio-club {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.25rem;
  width: 1.25rem;
  background-color: #000000;
  border-radius: 50%; }

/* When the radio button is checked, add a blue background */
.form-radio input:checked ~ .radio-club {
  background-color: #000000; }

/* Create the indicator (the dot/circle - hidden when not checked) */
.radio-club:after {
  content: "";
  position: absolute;
  display: none; }

/* Show the indicator (dot/circle) when checked */
.form-radio input:checked ~ .radio-club:after {
  display: block; }

/* Style the indicator (dot/circle) */
.form-radio .radio-club:after {
  top: 0.325rem;
  left: 0.325rem;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background: #FFFFFF; }

/***************************************************************************************************
IMAGES BACKGROUND
***************************************************************************************************/
.img-background {
  background: #000000;
  background: -moz-linear-gradient(top, #000000 51%, #000 114%);
  background: -webkit-linear-gradient(top, #000000 51%, #000 114%);
  background: linear-gradient(#000000 51%, #000 114%);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end; }

.img-background img.background-img {
  position: absolute;
  object-fit: cover;
  height: 100%;
  object-position: center;
  opacity: 0.65; }

/***************************************************************************************************
FORMS
***************************************************************************************************/
.club-form {
  position: absolute;
  top: 35%;
  left: 0%;
  width: 100%; }

/***************************************************************************************************
FORM ELEMENTS
***************************************************************************************************/
.input-club {
  border: none;
  border-bottom: solid 1px #6f757a;
  border-radius: 0;
  background: transparent !important;
  padding: 10px 0;
  color: #fff !important;
  width: 100%;
  font-size: 1.2rem;
  transition: all 0.3s ease;
  margin: 1rem 0; }

.input-club::placeholder {
  color: #fff; }

.input-club:focus {
  background: transparent;
  outline: 0;
  box-shadow: none;
  border-color: #fff;
  color: #fff;
  border-bottom: solid 1px #cfdbe6; }

.error-input-message {
  font-size: 0.9rem;
  color: #e12222;
  margin-top: 0.5rem; }

/***************************************************************************************************
HEADER
***************************************************************************************************/
header {
  z-index: 1;
  padding: 5rem 4rem 0 4rem; }

header .header-icon i {
  font-size: 1.5rem;
  color: #fff; }

/***************************************************************************************************
LOGGED HEADER
***************************************************************************************************/
header.logged-header {
  background: #000000;
  height: 90px !important;
  overflow: hidden;
  padding: 0.8rem 1.125rem 0 1.125rem; }

header.logged-header .menu {
  height: 100% !important;
  display: flex;
  justify-content: space-between;
  padding: 25px 25px 0 25px !important;
  align-items: center; }

header.logged-header .menu i {
  cursor: pointer; }

header.logged-header .menu img.logo {
  max-height: 30px;
  max-width: 180px;
  width: auto; }

header.logged-header .days-header,
header.logged-header .empty-title-menu {
  font-size: 1rem;
  text-transform: uppercase;
  font-weight: 900;
  color: #FFFFFF; }

header.logged-header #header-section-phone-number {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer; }

header.logged-header #header-phone-number {
  margin-top: 1rem;
  margin-bottom: 1rem;
  margin-left: 0.5rem;
  font-size: 0.7rem;
  color: #FFFFFF;
  -webkit-text-fill-color: #FFFFFF;
  /* For Safari */
  font-weight: bold; }

/***************************************************************************************************
FOOTER
***************************************************************************************************/
footer {
  z-index: 1;
  bottom: 0;
  background: #000000;
  height: 3.25rem;
  color: #FFFFFF;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 0.75rem; }

footer .footer-menu {
  height: 100%; }

footer .footer-menu-item {
  color: #FFFFFF;
  text-decoration: none; }

footer .footer-menu-item > div {
  position: relative;
  height: 80%;
  top: 10%; }

footer .footer-menu-item img {
  height: 1.25rem;
  margin-bottom: 0.125rem; }

footer .footer-menu-item i {
  font-size: 20px; }

footer .footer-menu-item.active {
  color: #000000;
  background: #FFFFFF; }

footer .footer-menu-item:not(.active):not(:first-child) > div {
  border-left: 1px solid #FFFFFF; }

footer .footer-menu-item.active + .footer-menu-item > div {
  border-left: 0; }

/***************************************************************************************************
MENU
***************************************************************************************************/
.menu-container {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: auto; }

.menu-container .menu-header {
  z-index: 20;
  background: #000000;
  height: 3rem;
  overflow: hidden;
  padding: 0.5rem 1.125rem 0 1.125rem;
  position: fixed; }

.menu-container .menu-header i {
  font-size: 23px;
  color: #fff; }

.menu-container .floating-card {
  width: 80%;
  margin-top: 10rem;
  margin-left: 10%;
  border-radius: 20px;
  padding: 1rem 2rem 3rem 2rem;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 3px 4px 10px 0 rgba(0, 0, 0, 0.1);
  color: #000000;
  backdrop-filter: blur(10px); }

.menu-container .profile-container {
  text-align: center; }

.profile-container i {
  color: #000000;
  font-size: 80px;
  padding-top: 2rem;
  padding-bottom: 2rem; }

.menu-container .btn-club {
  margin-top: 1rem; }

.menu-container .menu-item {
  border-bottom: solid 1px #000000;
  padding: 0.75rem 0;
  font-weight: bold;
  color: #000000;
  text-decoration: none; }

.menu-item span {
  font-size: 15px; }

.menu-container .menu-item i {
  font-size: 12px;
  color: #000000; }

.menu-container .floating-card + div {
  height: 1rem;
  color: #000000;
  margin-bottom: 2rem; }

.menu-container .floating-card + div img {
  height: 1rem; }

.menu-link,
.menu-link:active,
.menu-link:hover {
  text-transform: uppercase;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1rem;
  text-decoration: none; }

/***************************************************************************************************
DESKTOP
***************************************************************************************************/
html.desktop-version {
  background: #000000;
  background: -moz-linear-gradient(top, #000000 51%, #000 114%);
  background: -webkit-linear-gradient(top, #000000 51%, #000 114%);
  background: linear-gradient(#000000 51%, #000 114%);
  font-size: 13px; }

html.desktop-version body.ui-pagecontainer {
  max-width: 246px;
  position: relative;
  margin-bottom: 0 !important;
  height: calc(100% - 70px);
  background-color: #fff;
  overflow: auto;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */ }

html.desktop-version body.ui-pagecontainer::-webkit-scrollbar,
html.desktop-version body.ui-pagecontainer .ui-page::-webkit-scrollbar {
  display: none; }

html.desktop-version .mobile-shell {
  position: absolute;
  /* top: -10px;
    left: -5px; */
  height: calc(100vh - 30px);
  width: auto;
  z-index: 100;
  pointer-events: none;
  box-shadow: 0 0 8px 2px black, 0 0 8px 2px black inset; }

html.desktop-version .img-background {
  border-radius: 12px; }

html.desktop-version .dashboard-container {
  padding-top: 4.25rem; }

html.desktop-version .ui-pagecontainer .ui-page {
  overflow: auto;
  min-height: unset !important;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */ }

html.desktop-version .ui-pagecontainer footer {
  overflow: hidden; }

html.desktop-version .ui-pagecontainer .logged-header,
html.desktop-version .ui-pagecontainer .menu-header {
  height: unset;
  padding: 0 17px;
  min-height: 4.25rem; }

html.desktop-version .ui-pagecontainer .menu {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  display: flex;
  align-items: center; }

html.desktop-version .flatpickr-rContainer,
.flatpickr-months {
  width: 100% !important;
  margin: auto; }

html.desktop-version .static-container .floating-card {
  width: 90%;
  margin-left: 5%;
  padding: 1rem 1rem 1.5rem 1rem; }

html.desktop-version .ui-pagecontainer .list-boats-container {
  padding-top: 100px; }

/*
LOADER
*/
.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px; }

.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px; }

.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #000000;
  margin: -4px 0 0 -4px; }

.lds-roller div:nth-child(1) {
  animation-delay: -0.036s; }

.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px; }

.lds-roller div:nth-child(2) {
  animation-delay: -0.072s; }

.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px; }

.lds-roller div:nth-child(3) {
  animation-delay: -0.108s; }

.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px; }

.lds-roller div:nth-child(4) {
  animation-delay: -0.144s; }

.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px; }

.lds-roller div:nth-child(5) {
  animation-delay: -0.18s; }

.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px; }

.lds-roller div:nth-child(6) {
  animation-delay: -0.216s; }

.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px; }

.lds-roller div:nth-child(7) {
  animation-delay: -0.252s; }

.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px; }

.lds-roller div:nth-child(8) {
  animation-delay: -0.288s; }

.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px; }

@keyframes lds-roller {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

/***************************************************************************************************
****************************************************************************************************
****************************************************************************************************
PAGES
****************************************************************************************************
****************************************************************************************************
***************************************************************************************************/
/***************************************************************************************************
SPLASH
***************************************************************************************************/
#splash-index {
  background: #000000;
  background: -moz-linear-gradient(top, #000000 51%, #000 114%);
  background: -webkit-linear-gradient(top, #000000 51%, #000 114%);
  background: linear-gradient(#000000 51%, #000 114%); }

#splash-index img {
  max-height: 250px; }

/***************************************************************************************************
INITIAL SLIDES // WELCOME SLIDES
***************************************************************************************************/
#initial-slides .carousel-inner::after {
  position: absolute;
  background-color: #00000040;
  width: 100%;
  height: 100%; }

.logo-welcome {
  position: absolute;
  top: 8rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; }
  .logo-welcome img {
    max-width: 250px; }

/* Carousel */
.carousel .link-bottom-static {
  position: absolute;
  bottom: 1.3rem; }

.carousel .carousel-item {
  background: #000000;
  background: -moz-linear-gradient(top, #000000 51%, #000 114%);
  background: -webkit-linear-gradient(top, #000000 51%, #000 114%);
  background: linear-gradient(#000000 51%, #000 114%);
  height: 94dvh; }

.carousel .carousel-item img {
  object-fit: cover;
  height: 100%; }

.carousel .carousel-caption {
  top: 45%;
  bottom: 50%;
  padding: unset;
  height: fit-content; }

.carousel .carousel-caption h4 {
  text-transform: uppercase;
  font-weight: bold; }

.carousel .carousel-indicators {
  bottom: 3.7rem; }

.carousel .carousel-indicators li {
  width: 0.9375rem;
  height: 0.9375rem;
  border-radius: 50%;
  background-color: transparent;
  border: 2px solid #000000;
  opacity: 1; }

.carousel .carousel-indicators li.active {
  background-color: #000000;
  width: 1.1875rem;
  height: 1.1875rem;
  border: 0; }

/***************************************************************************************************
LOGIN
***************************************************************************************************/
#login-form #login-submit {
  margin-top: 2.5rem; }

#input-login-email {
  margin-top: 2rem; }

/*
LOGIN PASSWORD
*/
#login-password #login-password-submit {
  margin-top: 2.5rem; }

#input-login-password {
  margin-top: 2rem; }

.show-password i {
  position: absolute;
  bottom: 1.9rem;
  right: 1rem;
  font-size: 15px;
  color: #fff; }

/***************************************************************************************************
REGISTER
***************************************************************************************************/
/*
REGISTER PASSWORD
*/
#register-form #register-submit {
  margin-top: 2.5rem; }

#input-register-password1 {
  margin-top: 2rem; }

#input-register-password2 {
  margin-top: 1rem; }

.show-password1 i {
  position: absolute;
  bottom: 10.5rem;
  right: 3.2rem;
  font-size: 15px;
  color: #fff; }

.show-password1-eye {
  position: absolute;
  top: 35%; }

.show-password2 i {
  position: absolute;
  bottom: 6.5rem;
  right: 3.2rem;
  font-size: 15px;
  color: #fff; }

.show-password2-eye {
  position: absolute;
  top: 57%; }

/*
REGISTER INFO
*/
#register-phone-form #register-phone-submit {
  margin-top: 2.5rem; }

#input-register-name {
  margin-top: 2rem; }

#input-register-surname {
  margin-top: 1rem; }

/*
REGISTER PHONE
*/
#register-info-form #register-info-submit {
  margin-top: 2.5rem; }

#input-register-phone {
  margin-top: 2rem; }

/***************************************************************************************************
DASHBOARD
***************************************************************************************************/
#loader-container {
  top: 0;
  z-index: 100; }

.loader-dashboard {
  position: absolute;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 100; }

.dashboard-container {
  padding-top: 3.25rem; }

.dashboard-img {
  position: relative;
  height: 230px;
  width: 100%;
  display: inline-block;
  overflow: hidden;
  margin: 0; }

.dashboard-img img {
  display: block;
  position: absolute;
  object-fit: cover;
  object-position: center;
  top: 50%;
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  transform: translate(-50%, -50%);
  width: 100%; }

.dashboard-img i {
  font-size: 10rem;
  color: #fff; }

.dashboard-container .floating-card {
  width: 86%;
  position: relative;
  bottom: 12rem;
  left: 7%;
  border-radius: 15px;
  padding: 3rem 2rem;
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 3px 4px 10px 0 rgba(0, 0, 0, 0.1);
  color: #000000; }

.dashboard-container .floating-card h4 {
  font-weight: bold;
  text-transform: uppercase;
  color: #000000;
  font-size: 1.2rem; }

.dashboard-container .floating-card .button-text {
  font-size: 1.1875rem; }

.dashboard-container .floating-card .section-dashboard {
  border-bottom: 1px solid #000000;
  padding-bottom: 0.35rem;
  margin-bottom: 0.725rem; }

.dashboard-container .floating-card .btn-club {
  position: relative;
  bottom: 0.75rem;
  height: 1.5rem;
  opacity: 0; }

.dashboard-container .booking-container {
  padding: 1rem 3rem 0 3rem;
  position: relative; }
  .dashboard-container .booking-container .booking-item-link {
    text-decoration: none;
    position: relative; }
  .dashboard-container .booking-container .booking-item {
    background: #000000;
    border-radius: 10px;
    color: white;
    height: 150px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 2fr 3fr;
    margin-bottom: 2rem; }
    .dashboard-container .booking-container .booking-item .info-col {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1rem;
      flex-direction: column; }
    .dashboard-container .booking-container .booking-item .img-col {
      overflow: hidden; }
  .dashboard-container .booking-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; }
  .dashboard-container .booking-container .btn-club.btn-details {
    position: absolute;
    padding: 7px 30px;
    font-size: 14px;
    right: 67px;
    bottom: -12px; }
  .dashboard-container .booking-container .btn-club.checkin,
  .dashboard-container .booking-container .btn-club.checkout {
    position: absolute;
    right: 30px;
    max-width: 135px;
    bottom: -21px; }
  @supports (-webkit-touch-callout: none) {
    .dashboard-container .booking-container .btn-club.checkin,
    .dashboard-container .booking-container .btn-club.checkout {
      position: absolute;
      inset-inline-start: 150px;
      min-width: 115px;
      max-width: 135px;
      bottom: -21px; } }

.dashboard-container .destinations {
  padding: 2rem 3rem 6rem 3rem; }
  .dashboard-container .destinations .destination-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem; }
    .dashboard-container .destinations .destination-container a.base-url {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center; }
      .dashboard-container .destinations .destination-container a.base-url .base-city {
        position: absolute;
        color: white;
        font-weight: 900;
        font-size: 1.3rem;
        text-align: center; }
    .dashboard-container .destinations .destination-container .btn-club {
      padding: 12px 0;
      width: 90%;
      font-size: 14px;
      margin-bottom: .5rem; }
    .dashboard-container .destinations .destination-container img {
      border-radius: 10px;
      filter: brightness(0.5); }

/***************************************************************************************************
EXPLORE
***************************************************************************************************/
.map-container {
  margin-top: 3.25rem;
  height: 100%;
  overflow-y: hidden; }

.map-container img[src*="static/img/map-icon"] {
  border-radius: 50%;
  background: #000000;
  border: 2px solid white !important; }

.map-container img[src*="png#active"] {
  border-radius: 50%;
  background: #000000;
  border: 2px solid white !important; }

.base-container {
  position: relative;
  top: -16rem;
  max-height: 3rem; }

.base-container .btn-explore {
  z-index: 10;
  position: absolute;
  width: 8rem;
  font-weight: bolder;
  text-transform: uppercase;
  background: #000000;
  color: #FFFFFF !important;
  padding: 0.3rem 0;
  font-size: 0.8rem; }

.base-container .btn-base {
  top: -1.2rem;
  left: 5rem; }

.base-container .show-boats {
  width: 80%;
  position: relative;
  left: 10%; }

.base-container .base-name {
  padding: 0 0 0 2rem;
  position: relative;
  bottom: 3.5rem;
  opacity: 0.9; }

.base-container .base-name h3 {
  margin: 0;
  font-weight: 900;
  text-transform: uppercase; }

.base-container .explore-dates {
  padding: 0 2.1rem 0 2.1rem;
  position: relative;
  bottom: 5.5rem;
  opacity: 0.9; }

.base-container .explore-dates h4,
.base-container .base-name h4 {
  font-weight: bold;
  font-size: 1.1rem;
  text-transform: uppercase;
  margin: 0; }

.base-container .explore-dates .col-date {
  padding-top: 1rem;
  padding-bottom: 0.75rem;
  color: #000000; }

.base-container .btn-pickup-date {
  top: -6.2rem;
  left: 5rem; }

.base-container .btn-return-date {
  top: -0.2rem;
  right: 4rem; }

.base-container .base-info {
  background: #000000;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  color: #FFFFFF;
  border-radius: 0 5px 5px 0;
  text-decoration: none; }

/***************************************************************************************************
BASE PROFILE
***************************************************************************************************/
.base-profile .floating-card {
  margin-bottom: -10rem; }
  .base-profile .floating-card .pdf-download {
    position: absolute;
    top: -18px;
    right: 20px;
    height: 40px;
    width: 40px;
    background: #cfcfcf;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px; }
    .base-profile .floating-card .pdf-download i {
      font-size: 20px; }
  .base-profile .floating-card .manager-base i {
    font-size: 40px; }

#opening-hours .btn {
  width: 10rem;
  color: #FFFFFF !important;
  background: #000000;
  padding: 0.3rem 0; }

#boat-list-base-profile .list-boats-container {
  padding-top: 0.25rem; }

#boat-list-base-profile .list-boats-container h4 {
  font-size: 1rem; }

#boat-list-base-profile .list-boats-container h4 strong {
  font-weight: 900; }

.collapse-partial {
  line-height: 1.5rem; }

.collapse-partial p {
  margin-bottom: 1.5rem; }

.collapse-partial:not(.show) {
  display: block;
  height: 7.5rem;
  overflow: hidden; }

.collapse-partial.collapsing {
  height: 7.5rem; }

/***************************************************************************************************
BOAT LIST
***************************************************************************************************/
.list-boats-container {
  height: 100%;
  padding-top: 8rem; }

.list-boats-container h4 {
  margin-top: 2rem;
  text-transform: uppercase;
  color: #000000;
  width: 100%;
  text-align: center;
  font-size: 1.1rem; }

.list-boats-container h4 strong {
  font-weight: 900; }

.list-boats-container a {
  text-decoration: none; }

.list-boats-container .boat-card {
  position: relative;
  left: 10%;
  width: 80%;
  border-radius: 10px; }
  .list-boats-container .boat-card .club-card-discount {
    position: absolute;
    top: 12px;
    color: white;
    right: -10px;
    background: #000000;
    padding: 5px 15px;
    border-radius: 5px 5px 0 5px;
    font-size: 0.7rem;
    margin: 0;
    font-weight: bold;
    box-shadow: 4px 3px 30px 0 rgba(0, 0, 0, 0.5);
    z-index: 1; }
    .list-boats-container .boat-card .club-card-discount::after {
      content: "";
      width: 0;
      height: 0;
      border-top: 0px solid transparent;
      border-left: 11px solid #000000;
      border-bottom: 13px solid transparent;
      position: absolute;
      right: 0px;
      bottom: -13px;
      filter: contrast(0.5); }

.list-boats-container .boat-card.boat-card-inactive {
  filter: grayscale(80%); }

.list-boats-container .boat-name {
  background: #000000;
  color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-direction: column;
  border-radius: 10px 0 0 10px; }

.list-boats-container #list-boats-unavailable .boat-name {
  background: #cbcbcb;
  color: #fff; }

.list-boats-container .boat-name h5 {
  font-weight: 900;
  font-size: 1rem;
  text-transform: uppercase;
  padding: .5rem; }

.list-boats-container .boat-name .border-top {
  border-color: #000000; }

.list-boats-container .boat-info {
  width: 75%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  bottom: 1.5rem;
  font-size: 0.9rem; }

.list-boats-container .boat-info img {
  height: 0.6rem;
  margin-right: 0.3rem; }

.list-boats-container .hour-options {
  font-size: 10px;
  color: #FFFFFF; }

/***************************************************************************************************
BOAT PROFILE
***************************************************************************************************/
.boat-profile-container .boat-info {
  width: 100%;
  left: 0;
  bottom: 1.5rem;
  font-size: 0.9rem;
  box-shadow: unset;
  background: #00000010;
  color: black;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: .6rem; }

.boat-profile-container .dashboard-img {
  aspect-ratio: 1;
  height: unset; }

.boat-profile-container .boat-info img {
  height: 0.6rem;
  margin-right: 0.3rem; }

.boat-profile-container .floating-card {
  padding: 3rem 2rem !important; }

#boat-slides img {
  opacity: 1;
  height: calc(100vw * 9 / 21);
  transform: translate(-50%, -50%) !important; }

#boat-slides .carousel-indicators li {
  width: 0.46875rem;
  height: 0.46875rem;
  border: 2px solid #000000; }

#boat-slides .carousel-indicators {
  bottom: -17rem; }

#reservation-details-boat h5 {
  font-weight: bold;
  font-size: 1.15rem; }

#reservation-details-boat .btn-club-profile {
  text-transform: uppercase; }

/* SPECS PROFILE */
.spec-profile {
  text-transform: uppercase;
  font-weight: 800;
  font-size: 1rem; }

.spec-profile.decorated-bottom {
  border-bottom: 1px solid #000000; }

/* EXPLORE DATES */
.time-table-explore-dates {
  margin: 2rem -2rem -3rem -2rem;
  padding: 2rem 2rem 3rem 2rem;
  background-color: #0000004C;
  border-top: 5px #000000 solid; }

.time-table-explore-dates h5 {
  text-transform: uppercase;
  font-weight: 900;
  font-size: 1rem; }

.disabled-time-slot {
  color: #cbcbcb; }

.disabled-time-slot .radio-club {
  background-color: #cbcbcb; }

#explore-dates.static-container .floating-card,
.floating-card.unset-floating-height {
  min-height: unset !important; }

#explore-dates .btn-clear-selection {
  top: 15px;
  right: 5px;
  padding: .5rem 1rem;
  background: #00000025;
  padding: .4rem 1rem !important;
  border-radius: 20px;
  font-weight: bold; }

/* Boat order */
#order-boats-options {
  background-color: #000000;
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 0; }

@media only screen and (min-width: 992px) {
  #order-boats-options {
    width: 500px; } }

#order-boats-options.transform {
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease; }

#order-boats-options.transform-active {
  height: 9rem;
  border-top: 3px solid #000000; }

#order-boats-options .option-order-boat {
  padding: 1rem 1.125rem 0.4rem;
  color: #000000; }

.option-order-boat .check-option img {
  max-height: 1rem; }

.option-order-boat .check-option {
  display: none; }

.option-order-boat.active {
  font-weight: bold; }

.option-order-boat.active .check-option {
  display: block; }

/***************************************************************************************************
BOAT FILTER
***************************************************************************************************/
.card-filter.active {
  background-color: #000000;
  border-radius: 10px; }

.card-filter .container-image,
.card-filter .container-image img {
  max-height: 7rem;
  min-height: 7rem; }

.filter-slider .slider.slider-horizontal .slider-track {
  height: 5px;
  margin-top: -3px; }

.filter-slider .slider-tick,
.filter-slider .slider-handle {
  width: 15px;
  height: 15px;
  margin-left: -7px;
  margin-top: 2px; }

.filter-slider .slider {
  background: transparent; }

.filter-slider .slider-track-high,
.filter-slider .slider-tick {
  background: #000000; }

.filter-slider:not(.filter-slider-unic) .slider-selection,
.filter-slider .slider-tick.in-selection {
  background: #000000; }

.filter-slider .slider.slider-horizontal {
  width: 100%; }

.filter-slider .slider-handle {
  background: #000000;
  border: 0; }

.filter-slider .tooltip.in {
  opacity: 0.8; }

.filter-slider .slider-indicator {
  font-size: 13px; }

/* CLIENT PROFILE */
.client-documents .embed-container {
  overflow: hidden;
  text-align: center; }

.client-documents .embed-container object {
  height: 70px;
  width: auto;
  max-width: 100%;
  border-radius: 6px; }

.client-documents embed {
  width: calc(100% + 17px); }

.client-documents .embed-overlay {
  position: absolute;
  top: 0;
  height: 150px;
  width: 100%;
  z-index: 2; }

.client-documents a {
  color: #000000; }

/* STATIC PAGES */
.static-container .floating-card {
  width: 80%;
  margin-top: 8rem;
  margin-left: 10%;
  border-radius: 5px;
  padding: 1rem 2rem 3rem 2rem;
  background: white;
  box-shadow: 3px 4px 10px 0 rgba(0, 0, 0, 0.1);
  color: #000000;
  min-height: 43rem;
  margin-bottom: 3.25rem; }

.static-container .title,
.static-container .subtitle {
  text-transform: uppercase;
  font-weight: bold; }

.static-container .profile-container {
  text-align: center; }

.static-container .profile-container img {
  width: 10rem;
  height: 10rem;
  background: #000000;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 1rem;
  margin-top: 1rem; }

.static-container .club-text {
  border-bottom: solid 1px #000000;
  margin-top: 0.25rem;
  margin-bottom: 1rem;
  font-size: 1.1875rem;
  color: #000000;
  text-decoration: none; }

.static-container .club-text .club-description {
  font-size: 1rem; }

.static-container .club-text img {
  height: 1.5rem; }

.static-container-with-button .btn-club {
  right: 10px;
  bottom: -20px; }

#boat-profile-container .btn-club {
  bottom: -1.5rem;
  left: 0;
  right: 0;
  width: 85%; }

#boat-profile-container .btn-club {
  opacity: 1;
  height: unset; }

/* Keyboard active */
body.keyboard-active header {
  position: absolute !important; }

/* Floater container */
.floater-card-simple {
  width: 80%;
  position: relative;
  left: 10%;
  border-radius: 5px;
  padding: 1rem 2rem;
  background: white;
  box-shadow: 3px 4px 10px 0 rgba(0, 0, 0, 0.1);
  color: #000000; }

.schedule-toggle {
  cursor: pointer;
  text-align: center;
  background-color: #ffffff;
  padding: 8px;
  border-radius: 8px;
  margin: 8px auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: -1rem;
  margin-bottom: 2rem;
  width: 80%;
  border: 1px solid #000000;
  position: relative; }

.schedule-card {
  margin-bottom: 3rem;
  margin-top: -1rem; }

.schedule-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none; }

.schedule-list a {
  padding: 6px 10px;
  margin: 0;
  border-bottom: 1px solid #eee;
  transition: background-color 0.2s;
  text-decoration: none;
  color: #353535;
  font-size: 0.9rem;
  text-align: center; }

.schedule-list a:hover {
  background-color: #f9f9f9; }

/* Switch button*/
/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 3.5rem;
  height: 2rem; }

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0; }

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: 0.4s;
  transition: 0.4s; }

.slider:before {
  position: absolute;
  content: "";
  height: 1.75rem;
  width: 1.75rem;
  left: 0.125rem;
  bottom: 0.125rem;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s; }

input:checked + .slider {
  background-color: #000000; }

input:focus + .slider {
  box-shadow: 0 0 1px #000000; }

input:checked + .slider:before {
  -webkit-transform: translateX(1.5rem);
  -ms-transform: translateX(1.5rem);
  transform: translateX(1.5rem); }

/* Rounded sliders */
.slider.round {
  border-radius: 34px; }

.slider.round:before {
  border-radius: 50%; }

/* Booking */
.booking-card {
  position: relative; }

.main-img-boat {
  height: 145px !important;
  object-fit: cover;
  border-radius: 0 10px 10px 0; }

i.cancelled {
  color: #e12222; }

.btn-dropdown {
  color: #000000 !important;
  text-transform: uppercase; }

.btn-dropdown:focus {
  box-shadow: none; }

.extras-title-section {
  background-color: #000000;
  font-weight: 800 !important;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.84;
  letter-spacing: normal;
  text-align: center;
  color: #FFFFFF !important;
  border-radius: 50rem !important;
  font-family: "Lato", sans-serif;
  width: 10rem;
  font-size: 0.9rem; }

.btn.btn-club-booking {
  background-color: #000000;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.95rem;
  letter-spacing: normal;
  text-align: center;
  color: #FFFFFF !important;
  border-radius: 5px;
  font-family: "Lato", sans-serif;
  width: 12rem;
  font-size: 0.85rem;
  text-transform: uppercase; }

.section-total .btn.btn-club-booking {
  line-height: 1.5rem;
  font-size: 1.45rem; }

#booking-section-resume .spec-profile {
  font-size: 1.05rem; }

.section-total .spec-profile {
  font-size: 1.25rem !important; }

.extra-name {
  color: #000000 !important; }

.btn-extras {
  color: #000000;
  border: 2px solid #000000;
  height: 1.3rem;
  width: 1.3rem;
  font-size: 1rem;
  cursor: pointer; }

.btn-extras.disabled {
  color: #00000073;
  border: 2px solid #00000073;
  cursor: default; }

.selector-num {
  width: 3rem;
  color: #000000 !important; }

.price-extra-total {
  color: #000000 !important; }

.extra-info {
  color: #000000; }

.text-taxes {
  color: #000000;
  font-weight: bold;
  font-size: 0.8rem; }

.location-map {
  width: 100%;
  height: auto; }

.btn-navigate {
  background-color: #000000;
  color: #FFFFFF;
  width: 100%;
  border-radius: 0; }

.btn-navigate i {
  color: #FFFFFF;
  font-size: 1.25rem;
  margin-bottom: 0.125rem; }

.btn-navigate span {
  margin-left: 0.25rem;
  text-transform: uppercase;
  font-weight: 800;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.84;
  font-size: 0.8rem;
  font-family: "Lato", sans-serif; }

.extras-table {
  width: 100%;
  margin: 4px 0; }

.extras-table thead {
  background-color: #000000;
  color: #FFFFFF; }

.extras-table tbody {
  color: #000000; }

.extras-table th,
td {
  padding: 0.375rem 0.75rem; }

.extras-table tbody td:last-child {
  text-align: right; }

/* Fuel */
.fuel-details-container {
  padding-top: 4.25rem; }

.fuel-warning {
  color: #a73030;
  background-color: #fdecec;
  padding: 5px; }

.fuel-success {
  color: #04694a;
  background-color: #e6f5f0;
  padding: 5px; }

.fuel-error {
  color: #a73030;
  background-color: #fdecec;
  padding: 5px; }

.fuel-container {
  color: #000000;
  position: relative;
  width: 80%;
  left: 10%;
  text-align: center;
  margin-bottom: 1rem; }
  .fuel-container span, .fuel-container i {
    font-size: 1.3rem; }
  .fuel-container .btn-club {
    margin: 1rem 0;
    font-size: 1.1rem;
    padding: .8rem 1.2rem; }

.fuel-table {
  width: 100%;
  margin: 4px 0; }

.fuel-table thead {
  background-color: #000000;
  color: #FFFFFF;
  text-align: center; }

.fuel-table tbody {
  color: #000000; }

.fuel-table th,
td {
  padding: 0.375rem 0.75rem;
  text-align: center; }

.recharge-form-container {
  position: relative;
  width: 80%;
  left: 10%;
  color: #000000; }

.recharge-form-container #fuel-refill {
  color: #000000;
  text-align: center;
  border: none;
  border-radius: 0;
  background: transparent !important;
  width: 100%;
  font-size: 0.875rem; }

.recharge-form-container #fuel-refill:focus,
.recharge-form-container #fuel-refill:focus-visible {
  background: transparent;
  outline: 0;
  box-shadow: none;
  border-color: #fff; }

.fuel-recharge-container,
.motor-time-recharge-container {
  margin-top: 80px;
  padding: 3rem; }
  .fuel-recharge-container label,
  .motor-time-recharge-container label {
    font-size: 1.2rem;
    padding-bottom: .5rem; }
  .fuel-recharge-container input[type="number"],
  .motor-time-recharge-container input[type="number"] {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    padding-left: 10px;
    border-radius: 12px;
    background: #e7e7e7;
    max-width: 130px; }
  .fuel-recharge-container .buttons-container,
  .motor-time-recharge-container .buttons-container {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 1rem; }
  .fuel-recharge-container .btn-club,
  .motor-time-recharge-container .btn-club {
    margin: 1rem 0;
    font-size: 1.1rem;
    padding: .8rem 1.2rem; }

/***************************************************************************************************
  FLATPICKR CALENDAR
***************************************************************************************************/
.flatpickr-calendar .flatpickr-weekdays {
  background-color: #00000010;
  height: 30px;
  border-radius: 6px; }
  .flatpickr-calendar .flatpickr-weekdays .flatpickr-weekdaycontainer {
    display: flex;
    justify-content: space-between; }
    .flatpickr-calendar .flatpickr-weekdays .flatpickr-weekdaycontainer .flatpickr-weekday {
      background-color: transparent;
      color: #505050; }

.flatpickr-calendar .flatpickr-day {
  height: 55px;
  line-height: 55px; }

.numInputWrapper {
  pointer-events: none; }

.flatpickr-calendar.inline {
  width: 100%;
  color: #000000;
  text-transform: uppercase;
  font-size: 1rem !important;
  -webkit-box-shadow: none;
  box-shadow: none; }

.flatpickr-current-month,
.flatpickr-monthDropdown-months,
.flatpickr-current-month .cur-year {
  color: #000000 !important;
  text-transform: uppercase !important;
  font-size: 1rem !important;
  font-weight: bold !important; }

select.flatpickr-monthDropdown-months {
  -webkit-appearance: none !important;
  -moz-appearance: none !important; }

.flatpickr-next-month,
.flatpickr-prev-month {
  padding-top: 1px !important; }

.flatpickr-current-month {
  left: 0 !important;
  text-align: left !important; }

.flatpickr-month {
  margin-top: 1rem; }

.flatpickr-months svg {
  width: 1rem !important;
  height: 1rem !important;
  color: #000000 !important;
  fill: #000000 !important; }

.flatpickr-rContainer,
.flatpickr-days {
  width: 100% !important; }

.dayContainer {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important; }

.flatpickr-day {
  font-weight: bold !important;
  max-width: 14.28% !important;
  width: 14.28% !important; }

#legend-flatpickr {
  font-weight: bold; }

#legend-flatpickr .dot {
  height: 10px !important;
  width: 10px !important;
  max-width: unset !important;
  pointer-events: none; }

#legend-flatpickr .dot.day-available {
  border: 1px solid #333; }

@media only screen and (min-width: 992px) {
  .flatpickr-weekdays {
    line-height: 30px !important;
    height: 30px !important; }
  .flatpickr-day {
    line-height: 37px !important;
    height: 38px !important; }
  .flatpickr-weekday {
    line-height: 30px !important;
    height: 28px !important; }
  .flatpickr-rContainer,
  .flatpickr-months {
    width: 80% !important;
    margin: auto; }
  #boat-slides img {
    height: calc(500px * 9 / 21); } }

.flatpickr-day.day-available {
  background-color: #a8ddca !important; }

.flatpickr-day.option {
  background-color: #f7bd00 !important; }

.flatpickr-day.partial_free {
  color: #fff !important;
  background-color: #2196f3 !important;
  overflow: hidden; }

.flatpickr-day.day-busy {
  background-color: #eccacc !important; }

.flatpickr-day.selected {
  background-color: #569ff7 !important;
  border-color: #569ff7 !important; }

.flatpickr-day.today {
  border-color: transparent !important; }

.hide-calendar {
  max-height: 0 !important;
  overflow: hidden;
  transition: max-height 0.3s ease-out; }

.club_subscription_main {
  margin: 2rem;
  padding-top: 4rem; }

.booking_resume_container {
  margin: 2rem;
  padding-top: 6rem; }