body {
    margin: 0;
    overflow-x: hidden;
    font-family: lato, sans-serif;
}
/*
Navbar
*/
a {
    color: black;
    text-decoration: none;
}
a:hover {
    color: rgb(174, 32, 32);
}
.nav {
    display: grid;
    grid-template-columns: 2fr repeat(7, 3fr) 1fr 1fr 2fr;
    grid-template-rows: 4rem;
    justify-items: center;
    align-items: center;
    border-bottom: 2px solid rgb(174, 32, 32);
    padding-bottom: 10px;
    padding-top: 5px;
    width: 100%;
}
.nav1 {
    grid-column-start: 3;
    margin-right: 50px;
}
@media screen and (max-width: 1230px) {
    .nav1 {
        display: none;
    }
    .nav {
        grid-template-columns: repeat(5, 3fr);
    }
    .navtext {
        padding: 0 15px 0 15px;
        font-size: 20px;
    }
    .nav input {
        margin-right: 5px;
    }
}
.altnav {
    display: none;
    border-bottom: 2px solid rgb(174, 32, 32);
}
#hdnav {
    display: none;
}
#hdnav a {
    all: revert;
    font-family: lato;
    font-size: 16px;
    color: rgb(128, 128, 128);
    line-height: 45px;
    border: 1px solid rgb(174, 32, 32);
    padding: 10px;
    text-decoration: none;
    background-color: rgba(128, 128, 128, 0.1);
}
#hdnav a:hover {
    color: rgb(174, 32, 32);
}
@media screen and (max-width: 890px) {
    .nav {
        display: none;
    }
    .altnav {
        overflow: hidden;
        display: block;
        position: relative;
    }
    .altnav a.icon {
        display: block;
        float: right;
        position: absolute;
        top: 15px;
        right: 15px;
    }
    .altcontent {
        display: block;
    }

}
.navtext {
    font-size: 25px;
    align-self: stretch;
    align-content: center;
    padding: 0px 30px 0px 30px;
    font-weight: 600;
    font-family: lato;
}
.smallfont {
    font-size: 15px;
}
.dropdown {
    position: relative;
}
.dropdown-content {
    line-height: 30px;
    display: none;
    position: absolute;
    padding: 16px;
    background-color: white;
    border: 2px solid rgb(174, 32, 32);
    font-size: 20px;
}

.dropdown:hover .dropdown-content {
    display: block;
}
.nav input {
    padding: 8px 0px 8px 5px;
    vertical-align: center;
    margin-top: 3px;
}
/*
footer
*/
.footer {
    background-color: white;
}
.footerkontakt {
    display: grid;
    grid-template-columns: repeat(6, 5fr);
    gap: 10px;
    padding: 0 0 30px 0;

}
.footerk {
    grid-area: 1/2/2/3;
}
.footer h1 {
    all: revert;
    font-family: lato;
    font-size: 22px;
    color: rgb(174, 32, 32);
}
.footer p {
    all: revert;
    font-family: lato;
    font-size: 16px;
    color: rgba(128, 128, 128, 0.9);
    line-height: 28px;
}
.footer a {
    all: revert;
    font-family: lato;
    font-size: 16px;
    color: rgba(128, 128, 128, 0.9);
    line-height: 45px;
    border: 1px solid rgb(174, 32, 32);
    padding: 10px;
    text-decoration: none;
}
.footer a:hover {
    color: rgb(174, 32, 32);
}
.footerlinks {
    grid-area: 1/3/2/4;
}
.footerhotline {
    grid-area: 1/4/2/5;
}
.footersocials {
    grid-area: 1/5/2/6;
}
.footer2 {
    background-color: rgb(174, 32, 32);
    padding: 2px 15% 2px 15%;
    display: flex;
    justify-content: space-between; /* Distribute space between elements */
    flex-wrap: wrap; /* Allow wrapping on smaller screens */
    min-height: 64px;
    align-content: center;
}
.footer2 p {
    color: lightgray;
    margin: 0; /* Reset default margin */
}

/*
Home
*/
.homeimg {
    width: 100%;
    min-height: 100%;
    opacity: 80%;
    position: absolute;
    z-index: -1;
    top: 1;
    left: 0;
    border-bottom: 10px solid rgb(174, 32, 32); 
    overflow: hidden;
    object-fit: fill;
}
.start {
    display: grid;
    grid-template-columns: 2fr 2fr minmax(369px, 30vw) 2fr 2fr;
    grid-template-rows: 250px 300px 350px;
    border-bottom: 10px solid rgb(174, 32, 32); 
}
.homebox {
    grid-area: 2/3/3/4;
    align-self: center;
    background-color: rgba(255, 255, 255, 0.632);
    border: 1px solid rgb(174, 32, 32);
    border-radius: 6px;
    text-align: center;
    font-size: 25px;
    font-family: lato;
    padding-bottom: 40px;
}
.btnhome {
    grid-area: 3/3/4/4;
    align-self: flex-start;
    justify-self: center;
    margin-bottom: 10vh;
    font-size: 30px;
    font-weight: 300;
    opacity: 100%;
    background-color: rgba(174, 32, 32, 0.879);
    border-radius: 8px;
}
a#colorwhite:hover {
    color: white;
}
h1 {
    font-size: 40px;
    text-align: center;
    font-family: lato;
    font-weight: 500;
    color: black;
}

.willkommen {
    text-align: center;
    font-size: 20px;
    font-family: lato;
    margin-bottom: 5%;
    background-color: rgb(245, 245, 245);
    padding-top: 1%;
    padding-bottom: 2%;
    width: 100%;
    color: gray;
    font-weight: 350;
}
/* Objekte mit bester Bewertung */
.topratedtext {
    grid-area: 1/3/2/7;
    font-size: 30px;
    text-align: center;
    font-family: lato;
    font-weight: 500;
}
.objgrid {
    margin: 40px auto 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 12fr);
    grid-template-rows: fit-content(46vh);
    gap: 20px;
    padding-bottom: 100px;
    border-bottom: 2px solid rgb(174, 32, 32); 
    width: 80%;
}

@media screen and (max-width: 1623px) {
    .objgrid {
        width: 100%;
    }
}
@media screen and (max-width: 1080px) {
    .objgrid {
        grid-template-columns: 12fr;
        grid-template-rows: repeat(3, fit-content(46vh));
    }
}
.objplaceholder {
    border: 1px solid rgb(174, 32, 32);
}
.objplaceholder a {
    all: revert;
    color: white;
    text-decoration: none;
}
.objtitel {
    background-color: rgba(176, 18, 18, 0.817);
    font-family: lato;
    font-size: 25px;
    overflow: hidden;
    padding: 5px 0px 5px 5px;
    color: white;
}
.objimg img {
    width: 100%;
    height: 40vh;
}
.objtxt {
    font-family: lato;
    font-size: 20px;
    padding-bottom: 5px;
    padding-left: 5px;
    display: inline-block;
    width: 50%;
}
.bewertung {
    float: right;
    text-align: right;
    width: 30%;
    margin-right: 20px;
    display: inline-block;
    font-size: 15px;
}
.bewertung.objtxt::first-line {
    font-size: 18px;
}
.btnstyle {
    display: inline-block;
    font-size: 15px;
    color: white;
    background-color: rgba(176, 18, 18, 0.817);
    border-radius: 2px;
    border: none;
    padding: 15px;
    font-family: lato;
}
.detailbtn {
    float: right;
    margin: 0 20px 20px 0;
    line-height: 50%;
    padding: 15px 10px 15px 10px;
}
/* Warum Mustermann? */
.unservicetitle {
    display: inline-block;
    text-align: center;
    width: 100%;
    background-color: rgb(245, 245, 245);
    padding-top: 4vh;
    padding-bottom: 4vh;
}
.unservicegrid {
    display: grid;
    grid-template-columns: repeat(3, 7fr);
    grid-template-rows: 10fr;
    background-color: rgb(245, 245, 245);
    gap: 15px;
    padding-bottom: 6vh;
    width: 100%;
    margin: 0 auto 0 auto;
}
.unserviceitem {
    font-family: lato;
    font-size: 18px;
    margin: 0 20px 80px 20px;
    text-align: center;
    color: rgb(84, 84, 84);
}


@media screen and (max-width: 1450px) {
    .unservicegrid {
        grid-template-columns: repeat(3, 5fr);
        grid-template-rows: 15fr;
    
    }
/* Für eckige Bilder border-radius verringern/entfernen */


}

.unserviceitem img {
    display: block;
    width: 60%;
    margin: 0 auto 15px auto;
    border-radius: 50%;
}

.homeimgbottom {
    position: absolute;
    float: bottom;
    left: 0px;
    min-width: 100%;
    z-index: -1;
    overflow-x: hidden;
    object-fit: fill;
}
/* Kontakt/Support */
.kontakt {
    display: flex;
    min-height: 459.5px;
    width: 100%;
    background: rgba(255, 255, 255, 0.618);


}
.kontakttxt {
    background-color: white;
    height: 35vh;
    width: 50%;
    display: block;
    margin: auto;
    align-self: center;

}
@media only screen and (max-width: 1291px) {
    .kontakttxt {
        width: 100%;
    }
}
.kontakttxt img {
    float: left;

}
.kontakttxt h2 {
    margin-left: 100px;
    margin-right: 50px;
}
.kontakttxt p {
    margin-left: 100px;
    margin-right: 50px;
}
h2 {
    font-family: lato;
    font-size: 30px;
    font-weight: 400;
}
p {
    font-family: lato;
    font-size: 18px;
    font-weight: 400;
}
/*
Ferienunterkünfte
*/
.pagetitle {
    width: 75%;
    margin: auto;
    text-align: left;
}
.container {
    width: 75%;
    margin: auto;
    display: flex;
    justify-content: space-between;
}
.fkleft {
    width: 25%;
}
.fkright {
    width: 70%;
}
.container {
    height: 100%;
}
/* Filter */
.filtertitle1 {
    background-color: rgb(174, 32, 32);
    color: white;
    font-size: 20px;
    font-family: lato, sans-serif;
    padding: 0 1rem 0 1rem;
    font-weight: 400;
    display: flex;
    align-items: center;
    height: 40px;
}

.kriterienblock {
    border: 2px solid rgb(174, 32, 32);
    padding: 1rem;
    margin-bottom: 1.25rem;
}

.formwrapper {
    margin-bottom: 1.25rem;
}

.label {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.6);
    font-weight: 600;
    font-family: lato, sans-serif;
    margin-bottom: 0.25rem;
    margin-top: 1rem;
}

.kriterienblock input {
    box-sizing: border-box;
    padding: 0.5rem;
    font-family: lato, sans-serif;
    font-size: 18px;
    margin-right: 8px;
}

.kriterienblock select {
    box-sizing: border-box;
    width: 100%;
    padding: 0.5rem;
    font-size: 18px;
    font-family: lato, sans-serif;
    color: rgba(0, 0, 0, 0.6);
}
.placeholder {
    height: 40px;
    width: 30%;
    background-color: gray;
    border-radius: 6px;
}

.check {
    display: flex;
    position: relative;
    margin: 0.25rem 0 0.25rem 2rem;
    align-self: center;
    align-items: center;
}
.box {
    all: revert;
    position: absolute;
    left: -30px;
}
#resetfilter {
    padding: 10px;
    background-color: rgb(174, 32, 32);
    border: 2px solid rgb(174, 32, 32);
    color: lightgrey;
    border-radius: 2px;
}
/*
Objektliste
*/
.listenfilter .form-inputs, .checkies.dropdown {
    display: inline-block;
    margin-bottom: 10px;
    width: 100%;
}
.listenfilter .check_element {
    position: relative;
    padding-left: 25px;
}
.suchewrapper {
    border: 2px solid rgb(174, 32, 32);
}
.filtertitle {
    background-color: rgb(174, 32, 32);
    color: white;
    font-size: 20px;
    font-family: lato, sans-serif;
    padding: 0.1rem 1rem 0 1rem;
    font-weight: 400;
    height: fit-content;
    display: flex;
    justify-content: space-between;
}

.sortparent {
    margin-left: auto;
}
.gparent {
    width: auto;
}

.fewo-item {
    display: flex;
    margin: 1rem 0.5rem 1rem 0.5rem;   
    border: 2px solid grey;
}
.fewo_image {
    justify-self: flex-start;
    width: 380px;
    height: 300px;
    margin: 0 1rem 0 0;
}
.fewo_image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    
}
.fewo_item_inhalt {
    font-family: lato, sans-serif;
    justify-self: flex-end;
    width: auto;
    flex-grow: 5;
}

.fewo_titel {
    font-size: 22px;
    margin-bottom: 8px;
    display: block;
}
.fewo_infos {
    font-weight: 600;
    margin: 1rem 0 1rem 0;
    font-size: 18px;
}
.fewo_abpreis {
    font-size: 18px;
}
.detailbtn a {
    color: white;
}

/* Angebote */

.angebot {
    width: 75%;
    background-color: rgb(242, 242, 242);
    display: flex;
    height: 280px;
    margin: 30px 0 30px 0;
    padding: 0 12.5% 0 12.5%;
}
.angebot img {
    height: 100%;
    width: 30%;
}
.angebotinhalt {
    margin-left: 5%;
    width: 40%;
    padding: 5px 0 5px 0;
    font-size: 18px;
}
.angebotinhalt .fewo_titel {
    font-weight: bold;
    margin-bottom: 20px;
}
.vonbis {
    margin-bottom: 8px;
    display: block;
}
/* Detailseite */
.detailcontainer {
    margin: 40px auto 0 auto;
    width: 60%;
    padding: 4px 0 4px 0;
    overflow: hidden;
}
.objtitel .detail {
    align-self: center;
}
.detailbox {
    height: 650px;
    width: 100%;
    display: flex;
    background-color: rgb(229, 229, 229);
    margin-bottom: 2rem;
    border: 2px solid rgb(174, 32, 32);
}
.objimgs {
    height: 50%;
    width: 55%;
    background-color: rgb(230, 230, 230);
}
.kurztext {
    margin-bottom: 16px;
}
.detailtext {
    margin: 18px auto 0 auto;
    width: 40%;
}
.dtdefault {
    background-color: rgb(240, 240, 240);
    text-align: center;
    font-size: 18px;
    align-content: center;
    border-radius: 2px;
    line-height: 30px;
}
.big {
    font-weight: bold;
    font-size: 26px;
}
.preis {
    height: 100px;
}
.personenm2 {
    display: flex;
    justify-content: space-between;
    padding: 8px 24px 8px 24px;
    margin: 16px 0 0 0;
    font-weight: bold;

}
.dtbetten {
    display: block;
    margin: 0 0 32px 0;
    font-weight: bold;
    padding: 0 24px 8px 24px;
}
.dtbuttonparent {
    margin: auto;
    text-align: center;
}
.btnstyle .top {
    padding: 0 0 0 0;
}
#top {
    display: block;
    font-size: 26px;
    width: 100%;
    padding: 0 0 0 0;
    text-align: center;
}
.white {
    color: white;
}
.btnstyle .top {
    margin: 16px 16px 32px 16px;
}

.bottom {
    display: flex;
    justify-content: space-between;
    width: 70%;
    margin: 16px auto 0 auto;
}
#ausstc {
    padding: 200px;
}
.ausst-border {
    margin: 0.5rem 0rem 1rem 1rem;
    font-size: 18px;
    line-height: 30px;
    border-bottom: 2px solid rgb(174, 32, 32);
}
#ausstc:last-child .ausst-border {
    border-bottom: none;
}
.fewo-ausst-title {
    font-size: 24px;
    line-height: 20px;
}
.fewo-saisonzeiten {
    margin: 3rem auto 3rem auto;
    width: fit-content;
    border: 2px solid rgb(176, 32 ,32);
    line-height: 30px;
    font-size: 22px;
}
.fewo-saisonzeiten td {
    border-bottom: 2px solid rgb(174, 32, 32);
    padding: 0 8px 0 8px;
}
.fewo-saisonzeiten h2 {
    background-color: rgba(176, 18, 18, 0.817);
    font-family: lato;
    font-size: 25px;
    overflow: hidden;
    margin: 0 0 0 0;
    padding: 5px 0px 5px 5px;
    color: white;
}
.personen {

}
.ausstattung {
    width: 70%;
    margin: auto;
    border: 2px solid rgb(174, 32, 32);
}
.leistungen {
    width: 40%;
    margin: 0 auto 0 auto;
    border: 2px solid rgb(174, 32 ,32);
    border-bottom: 1px solid rgb(174, 32 ,32);
}

.leistungen h2 {
    background-color: rgba(176, 18, 18, 0.817);
    font-family: lato;
    font-size: 25px;
    overflow: hidden;
    margin: 0 0 0 0;
    padding: 5px 0px 5px 5px;
    color: white;
}

.bewertungen {
    width: 40%;
    margin: 100px auto 0 auto;
    border: 2px solid rgb(174, 32 ,32);
    border-bottom: 1px solid rgb(174, 32 ,32);
    padding: 1%;

}
.fewo-leistungen {
    font-size: 18px;
}
.leistung_titel {
    font-weight: bold;
}
.zeile_leistung_odd {
    padding: 0.5rem 0 1rem .5rem;
    border-bottom: 2px solid rgb(174, 32 ,32);
}
.zeile_leistung_even {
    border-bottom: 2px solid rgb(174, 32 ,32);
    padding: 0.5rem 0 1rem .5rem;
}
/** Copied Intselector **/
.weniger_waehlen {
    background-color: rgb(174, 32 ,32);
    border-radius: 10px 0px 0px 10px;
    color: #fff;
    cursor: pointer;
    font-weight: bold;
    line-height: 26px;
}

.intselector, .listwert {
    height: 28px;
    text-align: center;
    line-height: 30px;
    width: 32px;
}
.listwert {
    background-color: #fff;
    border-bottom: 1px solid rgb(174, 32 ,32);
    border-top: 1px solid rgb(174, 32 ,32);
    line-height: 28px;
}

.intselector, .listwert {
    height: 30px;
    text-align: center;
    line-height: 30px;
    width: 32px;
    display: inline-block;
}
.mehr_waehlen {
    background-color: rgb(174, 32 ,32);
    border-radius: 0px 10px 10px 0px;
    color: #fff;
    cursor: pointer;
    font-weight: bold;
}
.intselector, .listwert {
    height: 30px;
    text-align: center;
    line-height: 30px;
    width: 32px;
}
#objart option {
    line-height: 50px;
}
    /*
        if($('#preis') !== undefined) {
        $('#preis').slider({
        from: minpreis, to: maxpreis, heterogeneity: ['20/100', '75/250'], step: 10, dimension: '&nbsp;€', skin: "blue",
        callback: function (value){
        $('#preis').request('onDataChange');
        }
        });
    }
    */
/* Über uns */
.uuimg img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    
}
.uuflex {
    display: flex;
    margin: 1% auto 2% auto;
    width: 50%;
    justify-content: space-between;
}
.uu {
    text-align: left; 
    font-size: 16px;
    line-height: 25px;
}
.imgflexend {
    height: 250px;
    width: 250px;
}
.imgflexend img {
    height: 250px;
    width: 250px;
}
/* Kontakt */
.kt {
    width: 100%;
    text-align: center;
    font-size: 32px;
    display: inline-block;
    margin: auto 20px 50px 20px;
    font-weight: bold;
    border-radius: 2px;
}
.kt .kttxt {
    padding: 20px;
    font-size: 18px;
    margin: 0 auto 0 auto;
    width: 50%;
    background-color: rgb(240, 240, 240);
}
.form-group {
    min-width: 300px;
    max-width: 80%;
    display: block;
    justify-content: space-between;
    margin: 10px auto 10px auto;
}
.formlabel {
    text-align: left;
    width: 100%;
    display: block;
    font-weight: normal;
    margin-bottom: 10px;
}
.form-control {
    width: 100%;
    height: fit-content;
    margin-bottom: 15px;
}
#contactForm-nachricht {
    height: 80px;
}
/* AGB */
.mcontainer {
    width: 60%;
    text-align: left;
    margin: 30px auto 5% auto;
    font-size: 20px;
}
/* Angebotdetail */
.ang-title {
    background-color: rgb(174, 32 ,32);
    padding: 1rem 0 1rem 2rem;
    font-size: 28px;
    color: white;
}
.angholder {
    display: flex;
    border: 2px solid rgb(174, 32 ,32);
}
.angholder img {
    width: 420px;
    height: 320px;
}
.angtext {
    margin: 3% 0 0 3%;
    line-height: 30px;
    font-size: 22px;
}
.fewo-titel {
    font-size: 24px;
}
.post.fewo-item.fewo-titel {
    background-color: rgb(174, 32 ,32);
    padding: 1rem 0 1rem 2rem;
    color: white;
}