.slider-padding {
  padding: 0;
}

@include media-breakpoint-up(lg) {
  .slider-padding {
    padding: 0 120px;
  }
}



.owl-carousel {

  .owl-item {
    .item {
      padding: 4px;
    }
  }

  .owl-nav button {

    &.owl-prev.owl-prev::before,
    &.owl-next.owl-prev::before,
    &.owl-prev.owl-next::before,
    &.owl-next.owl-next::before {
      width: 60px;
      height: 60px;
      box-shadow: inset $quaternary-color 0 0 0 2px;
      background-position: center;
      content: "";
      background: url("/fileadmin/user_upload/isla_magica/background_pattern/Gruppe_119-white.svg");
      background-color: $quaternary-color;
    }

    &.owl-prev.owl-prev::before,
    &.owl-next.owl-prev::before {
      background-repeat: no-repeat;
      background-position: center;
      transform: rotate(180deg);
    }

    &.owl-prev.owl-next::before,
    &.owl-next.owl-next::before {
      background-repeat: no-repeat;
      background-position: center;
    }

    &:hover {

      &.owl-prev.owl-prev::before,
      &.owl-next.owl-next::before {
        animation: arrow2 0.5s linear 1;
        -webkit-animation-name: arrow2 0.5s linear 1;
      }
    }
  }

  &.hero-inner {
    .owl-nav button {

      &.owl-prev.owl-prev::before,
      &.owl-next.owl-prev::before,
      &.owl-prev.owl-next::before,
      &.owl-next.owl-next::before {
        content: "\f053";

      }

      &.owl-prev.owl-prev::before {
        transform: none;
      }

      &.owl-next.owl-next::before {
        transform: rotate(180deg);
      }
    }
  }
}


.owl-carousel.slider-style-0 {
  .owl-dots {
    button.owl-dot {
      background: $quaternary-color;

      &.active {
        background: $secondary-color;
      }
    }
  }

  .card.content-on-image-bottom {
    .btn-inn {
      a.btn.btn-primary {
        padding: 8px 15px;
      }
    }

    .figure {
      flex: none;
    }
  }

  .card {
    .figure {
      flex: 0 0 50%;
    }

    .content {
      .title h3 {
        padding-bottom: 20px;
      }
    }
  }

  .owl-item {
    margin-bottom: 20px;

    .card .content .btn {
      &:hover {
        color: $white !important;
      }
    }
  }

  .owl-nav button.owl-prev.owl-prev::before,
  .owl-nav button.owl-next.owl-prev::before,
  .owl-nav button.owl-prev.owl-next::before,
  .owl-nav button.owl-next.owl-next::before {
    background-color: $quaternary-color;
  }
}


.image-slider {
  margin-top: 30px;

  .owl-carousel {
    .owl-item {
      margin-bottom: 0px;

      .slide-item {
        .hero-cont {
          display: none;
        }
      }
    }

    .owl-dots {
      margin-top: 20px;
    }

    .owl-nav {

      .owl-prev,
      .owl-next {
        top: calc(50% - 30px);

        &::before,
        &::before {
          box-shadow: inset $quaternary-color 0 0 0 2px !important;
        }
      }
    }
  }
}

.f-carousel {
  &__nav {
    button.f-button {
      width: 60px;
      height: 60px;
      box-shadow: inset $secondary-color 0 0 0 2px;
      content: "";
      background: url(/fileadmin/user_upload/isla_magica/background_pattern/Gruppe_119-white.svg);
      background-color: $secondary-color;
      background-repeat: no-repeat;
      border-radius: 50%;
      background-position: center;
      right: -30px !important;

      svg {
        display: none;
      }

      &.is-prev {
        transform: translateY(-50%) rotate(180deg) !important;
        right: auto !important;
        left: -30px !important;
      }
    }
  }
}



.attraction-details {
  .row.attraction-details-slider {
    ul.f-carousel__dots {
      li {
        &:before {
          display: none;
        }
      }
    }
  }
}

.image-slider .sub-title h2 {
  text-shadow: 3px 3px 6px rgba(0, 0, 0, 2);

  @include media-breakpoint-down (md) {
    text-shadow: none !important;
  }
}