@media only screen and (max-width:356px){
.container-out:first-child h1{font-size: 8.5vw;}
.container-out:first-child h2{font-size: 6.5vw;}
}

/*---------------------------------------------------------------------------Navigationsstern */
.navsternbox-out{
    display: none;
    position: relative; 
    background-repeat: no-repeat;
}

.navsternbox-in{position:absolute;}


#navstern-typo{    
    position: absolute;
    background-image: url(../img/navstern/navstern-typo.svg); 
    background-repeat: no-repeat;
}

#navstern-bg{
    position: absolute;
    background-image: url(../img/navstern/navstern-bg.svg);
    background-repeat: no-repeat;
    filter: drop-shadow(0px 8px 8px rgba(32, 32, 32, 0.25));
}

#navstern-outer{ 
    position: absolute;
    animation: rotating-left 50s linear infinite; 
    background-image: url(../img/navstern/navstern-outer.svg); 
    background-repeat: no-repeat;
}

#navstern-inner{

    animation: rotating-left 25s linear infinite; 
    background-image: url(../img/navstern/navstern-inner.svg); 
    background-repeat: no-repeat;
}


#navstern-psi{
    background-image: url(../img/navstern/navstern-psi.svg); 
    background-repeat: no-repeat;
}


@keyframes rotating-left{
	0% {transform: rotate(0);}
	100% {transform: rotate(1turn);}
}

    




/*---------------------------------------------------------------------------Karte & Stern Positionierung*/
img{background-repeat: no-repeat; width: 100%;}

.mobile, .mobile-landscape, .tablet, .tablet-landscape, .desktop{display:none;}


.container-out:nth-of-type(2n){width: 100vw;}



/*---------------------------------------------------------------------------Mobil - Portrait*/
    @media only screen and (max-width:666px) and (orientation: portrait){
        
            .mobile{display:block;}
            
            .container-out:first-child{padding-bottom:35vh;}
            .navsternbox-out{display: block; display: flex; justify-content: center; align-items: center;}
            .navsternbox-in{top:-150px;}
            .navstern {height:13em ;width:13em;}   
    }



/*---------------------------------------------------------------------------Tablet - Portrait*/
    @media only screen and (min-width:667px) and (orientation: portrait){
        
            .tablet{display:block;}
        
            .container-out:first-child{padding-bottom:25vh;}
            .navsternbox-out{display: block;}
            .navsternbox-in{top:-150px; right:18vw;}
            .navstern {height:18em ;width:18em;}   
    }









/*---------------------------------------------------------------------------Mobil - Landscape*/
  @media only screen and (max-width:568px) and (orientation: landscape){
      
            .mobile-landscape{display:block}
      
            .container-out:first-child{padding-bottom:35vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:-100px; right:5vw;}
            .navstern {height:10em; width:10em;}
   }

  @media only screen and (min-width:569px) and (max-width:799px) and (orientation: landscape){
      
            .mobile-landscape{display:block}
            
            .container-out:first-child{padding-bottom:15vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:-100px; right:8vw;}
            .navstern {height:10em; width:10em;}
   }


  @media only screen and (min-width:800px) and (max-width:1023px) and (orientation: landscape){
        
            .mobile-landscape{display:block}
            
            .container-out:first-child{padding-bottom:35vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:-120px; right:7vw;}
            .navstern {height:12em; width:12em;}
   }


/*---------------------------------------------------------------------------Tablet - Landscape*/

    @media only screen and (min-width:1024px) and (max-width:1279px) and (orientation: landscape){
        
            .tablet-landscape{display:block;}
                   
            .container-out:first-child{padding-bottom:5vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:-100px; right:8vw;}
            .navstern {height:16em; width:16em;}
    }



/*---------------------------------------------------------------------------Desktop - Landscape*/

    @media only screen and (min-width:1280px) and (max-width:1439px) and (orientation: landscape){
            
            .desktop{display:block;}
                   
            .container-out:first-child{padding-bottom:0vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:0px; right:8vw;}
            .navstern {height:18em; width:18em;}
    }



    @media only screen and (min-width:1440px) and (max-width:1919px) and (orientation: landscape){
            
            .desktop{display:block;}
               
            .container-out:first-child{padding-bottom:0vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:0px; right:8vw;}
            .navstern {height:20em; width:20em;}
    }



    @media only screen and (min-width:1920px) and (orientation: landscape){
            
            .desktop{display:block;}
        
            .container-out:first-child{padding-bottom:0vh;}
            .navsternbox-out{display:block;}
            .navsternbox-in{top:0px; right:8vw;}
            .navstern {height:22em; width:22em;}
    }








/*---------------------------------------------------------------------------Kontaktmöglichleikten */

.row h1, .row p{margin: 0;}


@media only screen and (orientation: portrait){
.container-out:nth-child(3){margin-top: 8vh;}
.column span{text-align: center;}
    
}


@media only screen and (orientation: portrait) and (max-width:568px){ 
.row:nth-child(2n){margin-top: 10vh; margin-bottom: 10vh} 
}


@media only screen and (orientation: portrait) and (min-width:569px){ 
.row:nth-child(2n){margin-top: 5vh; margin-bottom: 5vh} 
}





@media only screen and (orientation: landscape){ 
.container-out:nth-child(3){margin-top: 15vh; margin-bottom: 15vh;}
}




@media only screen and (orientation: landscape) and (max-width:960px){ 
.row{
            display: flex;
            flex-direction: row;      /* Elemente nebeneinander */
            justify-content: center;   /* Zentriert horizontal (in der Row) */
            align-items: center;       /* Zentriert vertikal */         /* Volle Höhe des Viewports */} 
     
.column:first-of-type{justify-content:right;}
.column:first-of-type{width:30%;}
.column:last-of-type{width:55%;}  
    
.column:nth-child(2){
            display: flex;
            flex-direction: column;    /* Inhalt vertikal anordnen */
            justify-content: center;   /* Inhalt innerhalb der Spalten vertikal zentrieren */
}
}




@media only screen and (orientation: landscape) and (min-width:961px){ 
.container-out:nth-child(3){width: 90vw; display: flex;}
.row{ width: 33%;}
.column span {text-align: center;}
.column h1 {line-height: 1.5;}
}


/*-------------------------------------------footer */
footer{margin-top: 10vh;}