header.masthead {
    background-image: url(/assets/sporthotel/main-hp.webp);
    padding-bottom: 21rem;
    padding-top: 20rem;
}
.hotel.subpage header.masthead {
    background-image: url(/assets/sporthotel/hotelsubpage.webp);
    padding-bottom: 21rem;
    padding-top: 20rem;
}
.unterkunft.subpage header.masthead {
    background-image: url(/assets/sporthotel/accomodation.webp);
}
.infrastruktur.subpage header.masthead {
    background-image: url(/assets/sporthotel/infracstrucutre.webp?v=2);
}
.feiertage.subpage header.masthead {
    background-image: url(/assets/sporthotel/holidays.webp);
}
header.masthead::before {display: none;}
.fotoslide.hp {margin-top: 2rem;}
.fs60 {font-size: 3.5rem;}
.text-gray {color: var(--bs-gray);}
.hpfotos::before {
    content: "";
    background: rgba(0, 185, 242, 0.05);
    display: block;
    width: 100%;
    height: 80%;
    position: absolute;
    bottom: -30%;
    z-index: -1;
}
.paddingcenter {
    padding: 0 8%;
}
.banner .pcimg {
    bottom: 90px;
    max-width: 700px;
    right: 10%;
}

footer {background: var(--bs-primary);}

.accbox {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50%;
}

.holidays h2 {
    font-size: 4rem;
}

.fwpadding {
    padding: 0 6rem;
}

@media (max-width: 1400px) {
.fwpadding {
    padding: 0 5rem;
}
}


@media (max-width: 1199px) {
    .banner .pcimg {
        max-width: 560px;
    }
    .holidays h2 {
    font-size: 3rem;
}
.infrastruktur h2 , .hotel.subpage h2 {
    font-size: 3rem;
}

}

@media (max-width: 992px) {
 .fs60 {font-size: calc(2rem + 0.6vw);}
 .hpfotos::before {
         height: 120%;
        bottom: -80%;
 }
 .accbox {position: relative;width: 100%;}
 .fwpadding {
    padding: 0 2rem;
}
.infrastruktur .fwpadding, .hotel.subpage .fwpadding {
    padding: 0 4rem;
}
}

@media (max-width: 768px) {
    .rooms .fotoslide-img {
        width: 100%;
        height: auto;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        position: relative;
    }
    .rooms .fotoslide .swiper-slide {
        height: 280px;
        overflow: hidden;
    }
   .infrastruktur .fotoslide-img {
    width: 100%;
        height: auto;
    }
}

@media (max-width: 450px) {
     .rooms .fotoslide .swiper-slide {
        height: 250px;
        overflow: hidden;
    }
}
