.swiper {
    padding: 1em 0;
}


.swiper-slide img {
    width:100%;
}

#header-slider{
    margin-top:1em;
}
#header-slider .swiper-slide{
    margin:auto;
}

@media only screen and (min-width: 767px){
#header-slider .swiper-slide {
    aspect-ratio: 16 / 4;
    overflow: hidden;
    position: relative;
}
#header-slider .swiper-slide img {
    position: absolute;
    object-position: center;
    object-fit: contain;
    top:50%;
    transform:translateY(-50%);
}
}

.text-box div{
    padding: 3%;
}

.text-box div:after {
    content: '';
    backdrop-filter: blur(10px);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    border-radius: 1em;
    overflow: hidden;
    box-shadow: 0.2em 0.2em 0.5em rgb(0, 0, 0, 0.1);
    background: linear-gradient(130deg,rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255,0.5) 100%);
}

.swiper-pagination-bullet{
    color: #fff;
    opacity:1;
}

.swiper-carousel .swiper-slide a {
    position:relative;
    top:50%;
    transform:translateY(-50%);
}

.swiper-carousel .swiper-slide img{
    object-position: center;
    top:50%;
    transform:translateY(-50%);
}


.coverflow {
  padding-top: 20px;
  padding-bottom: 20px;
  overflow: hidden;
}

.coverflow .swiper-slide{
  width: 25%;
  min-width: 300px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  box-shadow: 0.2em 0.2em 0.5em rgb(0,0,0,0.2);
  border-radius: 1em;
  padding:1%;
  text-align: center;
  border:1px solid #fff;
}

.coverflow .swiper-slide .content-box{
    background-color:#fff;
    border-radius: 1em;
    padding:10%;
    box-shadow: 0.1em 0.1em 0.1em rgb(0,0,0,0.1);
}

.coverflow .swiper-slide{
    opacity:0;
}


.coverflow .swiper-slide-prev, .coverflow .swiper-slide-next{
    filter: blur(1px);
    opacity:0.7;
}

.coverflow .swiper-slide-duplicate-prev, .coverflow .swiper-slide-duplicate-next{
    filter: blur(5px);
   opacity:0.5; 
}

.coverflow .swiper-slide-active{
    opacity:1;
}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: -5px!important;
}


.swiper-button-next, .swiper-button-prev{
    color:var(--primary-colour)!important;
}