.container-out:first-child {padding-bottom: 0;}
@media only screen and (max-width:411px){.container-out:first-child h1{font-size: 7.79vw;}} 








/*Media Queries für Slideshow Galerie Mobile*/
@media only screen and (max-width: 600px) and (orientation:portrait){
.mobile{display:block;}
.desktop{display:none;}
    
/* Slideshow container */
.slideshow-container {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
}

.mySlides {
display: none;
}

/* Aktives Slide sichtbar machen */
.mySlides.active {
display: block;
background-color: white;
}
    
 #dotbox {margin: 10px 25px 10px 0;}

.dot {
    cursor: pointer;
    height: 5px;
    width: 5px;
    margin: 0 2px;
    background-color: rgb(255, 255, 255);
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.2s ease;
    border: solid 1px rgb(205, 205, 205);

}

 #dotbox .active, .dot:hover {
    background-color: #f2961a;
    border: solid 2px #f2961a;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 8s;
}

@keyframes fade {
  from {opacity: 0.8} 
  to {opacity: 1}
  
}


.slideshow-container img{
  border: solid 8px rgba(248, 248, 248, 1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
}
    

}


/*Media Queries für Grid Galerie Desktop*/
@media only screen and (orientation: landscape), (min-width: 601px) and (orientation:portrait){
.mobile{display:none;}
.desktop{display:block;}
    
.row{margin: 5% 0;}
.grid{float: left; width:29%; margin: 1% 2%;}

        /* Masonry-ähnliches Layout mit unterschiedlichen Größen */
        .galerie-item {
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        /* Hochformatfotos (Portrait) */
        .galerie-item.portrait {
            grid-column: span 1;
            grid-row: span 1;
        }

        /* Querformatfotos (Landscape) */
        .galerie-item.landscape {
            grid-column: span 2;
        }

        .galerie-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.3s ease;
            border: solid 8px rgba(248, 248, 248, 1);
            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
        }

        .galerie-item:hover {
            transform: scale(1.05);
            box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
        }

        .galerie-item:hover img {
            transform: scale(1.1);
        }


        /* Modal für Lightbox */
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(255, 255, 255);
            animation: fadeIn 0.3s;
        }
    

        .modal-content {
            margin:0 auto;
            display: block;
            width: 90%;
            max-width: 100vh;
            margin-top: 10vh;
        }
    

        .modal-content img {
            width: 96%;
            height: auto;
            border: solid 10px rgba(248, 248, 248, 1);
            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
        }

        .close {
            position: absolute;
            top: 1.5vh;
            right: 33px;
            color: #f2961a;
            font-size: 40px;
            font-weight:lighter;
            cursor: pointer;
            transition: color 0.3s;
        }
  
        .close:hover {
            color: #bbb;
        }

        @keyframes fadeIn {
            from { opacity: 0;}
            to { opacity: 1;}
        }
    
    }

@media only screen and (orientation: landscape) and (min-width: 1024px), (orientation: portrait) and (min-width: 768px){ 
.modal-content img {border: solid 20px rgba(248, 248, 248, 1);}
.modal {background-color: rgb(245, 245, 245);}
}



@media only screen and (orientation: landscape) and (max-width: 1279px){
.container-out:nth-child(2) {width:80vw;}
}

@media only screen and (orientation: landscape) and (min-width: 1280px){
.container-out:nth-child(2), .container-out:nth-child(4) {width:60vw;}
}




.container-out:nth-child(4) .container-in{padding: 0 5vw 0 0;}
.container-out:nth-child(4) {z-index: 1; text-align: right; padding-bottom: 15vh;}
.container-out:nth-child(4) h2 {padding-top: 0; font-weight: 500;}
.container-out:nth-child(4) p {line-height:1; font-weight: 400;}
.container-out:nth-child(4) p span{font-family: 'Crimson Pro', serif; font-style: italic; font-weight: 100; color:rgb(25, 25, 25); }

.container-out:nth-child(5) .container-in{padding-bottom: 20vh;}
.container-out:nth-child(5) span, .container-out:nth-child(6) span{display: inline-block; margin: 25px 0;}


.container-out:nth-child(5) p:first-child, .container-out:nth-child(6) p:first-child{font-family: 'Crimson Pro', serif; font-style: italic; font-weight: 400; font-size: 120%; line-height:0;}