/* Yeni Slider CSS */
.banner-home-swiper .banner-home-swiper-image {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.banner-home-swiper .banner-home-swiper-image img {
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  width: 100%;
}
.banner-home-swiper .banner-home-swiper-image::before {
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    from(rgba(0, 0, 0, 0.9)),
    color-stop(15%, rgba(20, 20, 20, 0.9)),
    to(rgba(83, 100, 141, 0))
  );
  background: -webkit-linear-gradient(
    left,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(20, 20, 20, 0.9) 15%,
    rgba(83, 100, 141, 0) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(20, 20, 20, 0.9) 15%,
    rgba(83, 100, 141, 0) 100%
  );
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(20, 20, 20, 0.9) 15%,
    rgba(83, 100, 141, 0) 100%
  );
  width: 100%;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}
.banner-home-swiper p {
  width: 37.5rem;
}
.playbtn {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.5s ease;
  text-align: center;
}
.playbtn .triangle {
  transition: all 0.7s ease-in-out;
  stroke-dasharray: 240;
  stroke-dashoffset: 480;
  stroke: #fff;
  transform: translateY(0);
}
.playbtn .circle {
  stroke: #fff;
  stroke-dasharray: 650;
  stroke-dashoffset: 1300;
  transition: all 0.5s ease-in-out;
}
.playbtn span {
  color: #fff;
}
.playbtn:hover .triangle {
  stroke-dashoffset: 0;
  opacity: 1;
  stroke: #e50914;
  animation: trailorPlay 0.7s ease-in-out;
}
.playbtn:hover .circle {
  stroke-dashoffset: 0;
  stroke: #e50914;
}
.playbtn:hover span {
  color: #e50914;
}
.w-trailor {
  font-size: 1.25em;
  letter-spacing: 0.21875em;
  margin-left: 0.9375em;
  vertical-align: middle;
}
.swiper-banner-button-prev.swiper-nav {
  left: 2%;
  -webkit-transform: scaleX(-1) translateY(-50%);
  -ms-transform: scaleX(-1) translateY(-50%);
  transform: scaleX(-1) translateY(-50%);
}
.swiper-nav {
  color: #fff;
  border-color: #fff;
  width: 2.75rem;
  height: 2.75rem;
  position: absolute;
  cursor: pointer;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 999;
}
.swiper-banner-button-next.swiper-nav {
  left: auto;
  right: 2%;
}
.swiper-nav::before,
.swiper-nav::after {
  content: "";
  display: block;
  position: absolute;
  left: 0.063rem;
  right: 0.063rem;
  top: 0.063rem;
  bottom: 0.063rem;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  border: 0.063rem solid #d1d0cf;
}
.swiper-nav i {
  display: block;
  position: absolute;
  margin: -0.625rem 0 0 -0.625rem;
  width: 1.25rem;
  height: 1.25rem;
  left: 50%;
  top: 50%;
}
.swiper-nav svg {
  width: 2.75rem;
  height: 2.75rem;
  display: block;
  position: relative;
  z-index: 1;
  color: #fff;
  stroke-width: 0.125rem;
  stroke-dashoffset: 126;
  stroke-dasharray: 126 126 0;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}
.swiper-nav i::before {
  -webkit-transform: rotate(-40deg);
  -ms-transform: rotate(-40deg);
  transform: rotate(-40deg);
}
.swiper-nav i::after {
  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  transform: rotate(40deg);
}
.swiper-nav i::before,
.swiper-nav i::after {
  content: "";
  width: 0.625rem;
  height: 0.125rem;
  -webkit-border-radius: 0.063rem;
  border-radius: 0.063rem;
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  margin: -0.063rem 0 0 -0.313rem;
  display: block;
  -webkit-transform-origin: 0.563rem 50%;
  -ms-transform-origin: 0.563rem 50%;
  transform-origin: 0.563rem 50%;
}
