body,h1,h2,h3,h4,h5,h6 {font-family: "gotham", sans-serif}
p{margin:16px}
body{margin: 0px}
.ma-green{
        background-color:#507c6d}

.grey{
        color: dimgrey}

.white{
        color: white}

.container{
        width: 100vw;}

.center{
        text-align:center;
        display:inline-block;
        width:100vw;}

.content {padding: 0px 40px}

.center-text{
        text-align: center;}

.margin{
        margin:16px;}

.padding-bot{
        padding-bottom:80px;}

.padding-64{
        padding-top:64px;
        padding-bottom:64px}

.medium {
        font-size: 18px;
        font-weight: lighter;}

.large {
        font-size: 24px}

.xlarge{
        font-size:36px}

.jumbo{
        font-size:64px}

.section{
        padding-bottom: 80px;}

.icon-img {
        width: 150px;
        padding-top: 80px;}

.visitenkarte {
        display: flex;
        flex-direction: row;
        padding-bottom: 40px;
        padding-top: 80px;
        width: 100vw;}

.v-image {
        flex: 2;
        background-size: cover;
        background-position: center;
        height: auto; /* Keeps the aspect ratio */}
.v-text {
        flex: 2.5;
        padding: 50px;
        background-color: #507c6d;
        text-align: center;
        color: white;
        position: center;}

.gallery-wrapper {
        width: 100vw;
        overflow: hidden;
        position: relative;
        margin: 0 auto ;}

.gallery {
        display: flex;
        transition: transform 0.5s ease; /* Animation beim Wechsel der Bilder */
        width: 600vw;}

.gallery img {
        width: 100vw;
        height: auto;
        object-fit: contain;}

.custom-list {
        list-style-position: inside;
        padding-left: 0;
        margin-bottom: 40px;}

.custom-list li {
        margin-bottom: 10px;
}

.column{
        columns: 2 300px;
        column-gap: 40px;
        text-align: left;
        padding: 0px 20px;}

.preise-karte {
        display: flex;
        flex-direction: row;
        width: 100vw;}

.preise-image {
        flex: 2;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        min-height: 400px;}

.preise-text {
        flex: 2;
        padding: 80px 50px;
        background-color: #507c6d; /* Hintergrund nur hinter Text */
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;}

.footer {
        background-color: #507c6d;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100vw;}

.footer-links {
        display: flex;
        gap: 50px;}

.footer-links a {
        text-decoration: none;
        color: white;
        font-weight: bold;
        font-size: 16px;}

.footer-links a:hover {
        text-decoration: underline;}

a{
        text-decoration: none;
        color:#507c6d }


.social-icons {
        display: flex;
        justify-content: center;
        gap: 30px;
        margin: 20px 0;
}

.social-icons img {
        width: 32px;
        height: 32px;
        filter: grayscale(100%);
        transition: filter 0.3s ease;
}

.social-icons img:hover {
        filter: grayscale(0%);
}