body {
background-image: url('swiss.jpg');
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
padding: 0;
margin: 0;
min-height: 100vh;
position: relative;
}
body::before {
content: "";
background: rgba(255, 255, 255, 0.2); /* Transparente Farbe für das Hintergrundbild */
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1; /* Hinter das Hintergrundbild legen */
}
.container {
padding-top: 20px;
}
.kachel {
text-align: center;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4); /* Leichter Schatten */
margin-bottom: 20px;
width: 150px; /* Breite der Kacheln */
height: 150px; /* Höhe der Kacheln */
padding: 20px;
transition: background-color 0.3s, color 0.3s;
}
.kachel1 { transition: background-color 0.3s, color 0.3s; }
.custom-container {
max-width: 980px; /* Maximalbreite des Containers */
margin: 0 auto; /* Zentriert den Container auf der Seite */
}
.kachel2 {
text-align: center;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4); /* Leichter Schatten */
margin-bottom: 10px;
width: 250px; /* Breite der Kacheln */
height: 50px; /* Höhe der Kacheln */
padding: 12px;
transition: background-color 0.3s, color 0.3s;.
}


.footer {
background-color: rgba(51, 51, 51, 0.8); /* Transparenter Footer-Hintergrund */
color: #fff;
text-align: center;
padding: 10px 0;
position: absolute;
bottom: 0;
width: 100%;
}
.search-box {
text-align: center;
margin-bottom: 200px; /* Abstand von 200px nach unten */
}
.kachel:hover {
background-color: darkgreen; /* Dunkelgrüner Hintergrund */
color: white; /* Weiße Textfarbe */
}


.kachel2:hover {
background-color: orange; /* Dunkelgrüner Hintergrund */
color: white; /* Weiße Textfarbe */
}


.custom-navbar {
height: 80px;
}

/* Custom CSS to move the logo */
.custom-logo {
position: absolute;
top: 20px; /* Adjust this value to move the logo up or down */
}

/* Custom CSS to align navigation links to the right */
.custom-navbar .navbar-nav {
#justify-content: flex-end;
}

/* Custom CSS for the links */
.custom-navbar .navbar-nav .nav-item {
margin-left: 35px; /* Adjust this value to add space between links */
}

/* Stile für das FontAwesome-Icon */
.kachel i {
font-size: 36px; /* Größe des Icons anpassen */

}

/* Stile für den Text unter dem Icon */
.kachel span {
display: block; /* Text unter dem Icon anzeigen */
}
.zeilenumbruch {
height: 150px; /* Höhe der Zeile in Pixeln */
}
.zeilenumbruch1 {
height: 50px; /* Höhe der Zeile in Pixeln */
}
.sticky-header {
position: sticky;
top: 0;
background-color: #ffffff; /* Hintergrundfarbe anpassen */
z-index: 100; /* Z-Index anpassen, um sicherzustellen, dass der Header vor anderen Elementen liegt */
/* Fügen Sie hier weitere gewünschte Stile hinzu, wie Schriftart, Abstand, Schatten usw. */
}


.footer {
background-color: white;
height: 40px;
#position: fixed;
    bottom: 0;
        width: 100%;
    }
.price-innerdetail p {
font-size: 50px;
}
.detail-pricing {
border-bottom: 1px solid;
padding: 30px 0 30px 0;
}

.detail-pricing .float-left {
padding: 0 0 0 40px;
}

.detail-pricing .float-left i {
position: absolute;
left: 0;
font-size: 20px;
}

.detail-pricing span {
display: inline-block;
position: relative;
font-weight: 400;
}

.wrap-price {
background: rgba(32, 33, 36, .1);
padding: 50px 20px 50px;
border-radius: 10px;
}

.center-wrap {
background: white;
color: black;
}

/* Stile für das FontAwesome-Icon */
.kachel i {
font-size: 36px; /* Größe des Icons anpassen */

}

/* Stile für den Text unter dem Icon */
.kachel span {
display: block; /* Text unter dem Icon anzeigen */
}
.zeilenumbruch {
height: 100px; /* Höhe der Zeile in Pixeln */
}
.zeilenumbruch1 {
height: 50px; /* Höhe der Zeile in Pixeln */
}
.sticky-header {
position: sticky;
top: 0;
background-color: #ffffff; /* Hintergrundfarbe anpassen */
z-index: 100; /* Z-Index anpassen, um sicherzustellen, dass der Header vor anderen Elementen liegt */