@font-face {
    font-family: 'Yport';
    src: url(font/Yport-RegularItalic.otf) format('opentype');
}
body
{
    font-family: 'Yport';
    padding:0;
    margin:0;
    
    background-color:rgb(210, 210, 207);
    line-height: 0;
    color:black;
    padding:0.8vw;
   
}

a:link{color: black; text-decoration: none;}
a:hover{text-decoration:underline; color: black;}
a:visited{text-decoration:none; color: black;}


body {
    -ms-overflow-style: none;  
    scrollbar-width: none;  
}

@media screen and (orientation: portrait)
{
    body
    {
        
        padding:2.2vw;
    
    }
    

}

::-webkit-scrollbar
{ 
    display: none; 
}



/*
#logo
{
    position: absolute;
    margin-top: 96vw;
    z-index: 50;
}*/

#logo
{
    position: fixed;
    top:5dvh;
    left:70vw;
    z-index: 99;
    
}

@media screen and (orientation: portrait)
{
    #logo
    {
        
        top:12dvh;
        left: 73vw;
    }
    

}



@media screen and (orientation: portrait)
{
   #logo-subpages img
    {
        height: 25vw;
        width:auto;
    }
    

}

#logo img
{
    height: 9vw;
    width:auto;
}

@media screen and (orientation: portrait)
{
   #logo img
    {
        height: 25vw;
        width:auto;
    }
    

}

#nav-wrapper
{
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    align-items: end;

    position: fixed;
    z-index: 100;
    bottom:0;
    left:0;
    width:100vw;

    font-size: 2.5vw;
    line-height: normal;
}

@media screen and (orientation: portrait)
{
    #nav-wrapper
    {
        
        justify-content: end;
        align-items: end;
        bottom:2vw;
        font-size: 5vw;
        line-height: normal;
       
    }
    
}

#nav-wrapper div
{
    margin-right:2vw;
}

@media screen and (orientation: portrait)
{
    #nav-wrapper div
    {
        margin-right:2.5vw;
    }

    
}

#nav-mindset
{
    cursor: pointer;
}

#nav-weine
{
    cursor: pointer;
}

#nav-kontakt
{
    cursor: pointer;
}

#nav-subpage
{
    text-decoration:underline;
}



#portrait-gradient
{   
    display:block;
    position:fixed;
    z-index:80;
    width:100vw;
    height: 6vw;
    bottom:0;
    left:0;
    background-image: linear-gradient(0deg, rgb(210, 210, 207), rgb(210, 210, 207), rgba(210, 210, 207, 0));
}

@media screen and (orientation: portrait)
{
#portrait-gradient
{
    display:block;
    position:fixed;
    z-index:80;
    width:100vw;
    height: 16vw;
    bottom:0;
    left:0;
    background-image: linear-gradient(0deg, rgb(210, 210, 207), rgb(210, 210, 207), rgba(210, 210, 207, 0));
    
}
}






.text_topic
{
     font-size: 2.5vw;
     text-decoration: underline;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 2vw;

}

@media screen and (orientation: portrait)
{
    .text_topic
    {
        font-size: 7vw;
        text-decoration: underline;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 2vw;
        margin-top: 10dvh;

    }

}

.text_topic_2
{
     font-size: 1.5vw;
     text-decoration: underline;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 0.7vw;

}

@media screen and (orientation: portrait)
{
    .text_topic_2
    {
        font-size: 7vw;
        text-decoration: underline;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 0.7vw;
        margin-top: 10dvh;

    }

}

.text_topic_3
{
     font-size: 1.5vw;
     text-decoration: underline;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 0.7vw;
    margin-top: 20dvh;

}

@media screen and (orientation: portrait)
{
    .text_topic_3
    {
        font-size: 7vw;
        text-decoration: underline;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 0.7vw;
        margin-top: 10dvh;

    }

}

.text_topic_4
{
     font-size: 1.5vw;
     text-decoration: underline;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 0.7vw;
    margin-top: 50dvh;

}

@media screen and (orientation: portrait)
{
    .text_topic_4
    {
        font-size: 7vw;
        text-decoration: underline;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 0.7vw;
        margin-top: 10dvh;

    }

}




.text

{
    font-size: 4.5vw;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 2vw;
    

}

@media screen and (orientation: portrait)
{
    .text

    {
        font-size: 7vw;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 10dvh;
        

    }

}

.text-subpages

{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.8vw;
    font-size: 1.5vw;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 20vw;
    

}

@media screen and (orientation: portrait)
{
    .text-subpages

    {
        grid-template-columns: 1fr;
        font-size: 4.5vw;
        line-height: 110%;
        letter-spacing: 0.3vw;
        margin-bottom: 40dvh;
        

    }

}

.text_titel

{
    font-size: 4.5vw;
    line-height: 110%;
    letter-spacing: 0.3vw;
    margin-bottom: 2vw;
    margin-top:0vw;
    

}
@media screen and (orientation: portrait)
{
    .text_titel

    {
        
        font-size: 9vw;
        line-height: 110%;

    }

}

#weine_text_1_1_1
{

    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
    font-size: 1.5vw;
    line-height: 110%;
    letter-spacing: 0.3vw;
}

@media screen and (orientation: portrait)
{
  
    #weine_text_1_1_1
    {

        display: grid;
        grid-template-columns: 1fr;
        gap: 0.8vw;
        margin-bottom: 0.8vw;
        font-size: 7vw;
        line-height: 110%;
        letter-spacing: 0.3vw;
    }

}

#footer-text
{

    display: grid;
    grid-template-columns: 2fr 2fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
    font-size: 2.5vw;
    line-height: 110%;
    letter-spacing: 0.1vw;
    text-transform: uppercase;
}

@media screen and (orientation: portrait)
{
  
    #footer-text
    {

        display: grid;
        grid-template-columns: 1fr;
        gap: 0.8vw;
        margin-bottom: 0.8vw;
        font-size: 6vw;
        line-height: 110%;
        letter-spacing: 0vw;
        text-transform: uppercase;
        margin-top:5dvh;
    }

}

.footer-logos
{

    display: grid;
    grid-template-columns: 4fr 4fr 1fr 1fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
    font-size: 2.5vw;
    line-height: 110%;
    letter-spacing: 0.1vw;
    text-transform: uppercase;
    margin-bottom: 5vw;
}

@media screen and (orientation: portrait)
{
  
    .footer-logos
    {

        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.8vw;
        margin-bottom: 0.8vw;
        font-size: 2.5vw;
        line-height: 110%;
        letter-spacing: 0.1vw;
        text-transform: uppercase;
        margin-bottom: 9dvh;
    }

}

@media screen and (orientation: portrait)
{
  
    

}


#zweiter-kontakt
{

    
    margin-top: 3vw;
}

#eu-bio
{

    width:17vw;
    height: auto;
    margin-top: 10vw;
}

@media screen and (orientation: portrait)
{
  
    #eu-bio
    {

        width:40vw;
        height: auto;
        margin-top: 10vw;
    }

}

#demeter
{

    width:8vw;
    height: auto;
    margin-top: 5vw;
}

@media screen and (orientation: portrait)
{
  
    #demeter
    {

        width:18vw;
        height: auto;
        margin-top: 5dvh;
    }

}

#bergdoll
{

    width:8vw;
    height: auto;
    margin-top: 1vw;
}

.text_1_1_1
{

    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
    font-size: 1.5vw;
    line-height: 110%;
    letter-spacing: 0.3vw;
}


.pic_wine
{

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
}



.pic_1_1_1
{

    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
}

@media screen and (orientation: portrait)
{
    .pic_1_1_1
    {

        
        grid-template-columns: 1fr;
        gap: 2.2vw;
        margin-bottom: 2.2vw;
        /*padding:30vw;*/
        
    }
    

}

.single_pic_row
{

    display: grid;
    grid-template-columns: 2fr 3fr 4fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
}


.small_pic_row
{

    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 2fr;
    gap: 0.8vw;
    margin-bottom: 0.8vw;
}

@media screen and (orientation: portrait)
{
      .small_pic_row
    {

    
        grid-template-columns: 2fr 1fr 1fr 2fr 1fr 1fr;
        gap: 2.2vw;
        margin-bottom: 2.2vw;
        
    }
    

}




.margin_pic
{
    margin-top:2vw;
}

@media screen and (orientation: portrait)
{
    .margin_pic
    {
        margin-top:0vw;
    }
    

}

.margin_2_pic
{
    margin-top:10vw;
}

@media screen and (orientation: portrait)
{
    .margin_2_pic
    {
        margin-top:0vw;
    }
    

}




