/* ==font family== */
@font-face {
    font-family: "Reg";
    src: url("/PLEX_SANS/IBMPlexSans-Regular.woff2") format("woff2");
    font-display: swap;

}
@font-face {
    font-family: "Medium";
    src: url("/PLEX_SANS/IBMPlexSans-Medium.woff2") format("woff2");
    font-display: swap;
}
@font-face {
    font-family: "Hover";
    src: url("/PLEX_SANS/IBMPlexSans-Bold.woff2") format("woff2");
    font-display: swap;
}


/* ==body== */
body {
    font-family: Reg;
    color: #e4284c;
    background-color: #fffbf3;
    padding: 0.5em;
    margin: 0em;
    scroll-behavior: smooth;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* ==header== */
#header-lg {
    display: block;
}
#header-sm {
    display: none;
}
#header-lg {
    display: flex;
    top: 0;
    padding-bottom: 0.5em;
    background-color: #fffbf3;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 2em;
}
.nav_link, .nav_link a, .home a{
    text-decoration: none;
    color: #e4284c;
    font-size: 1.7vw;
}
.nav_link a:hover, .home a:hover {
    font-family: Hover;
}


/* ==impressum== */
#impressum-lg {
    display: block;
}
#impressum-sm {
    display: none;
}
.impressum {
    text-decoration: none;
    color: #e4284c;
    font-size: 1vw;
}
.impressum a {
    text-decoration: underline;
    color: #e4284c;
}
.impressum a:hover{
    text-decoration: none;
    font-family: Hover;
}

/* ==about== */
.about {
    display: block;
    display: flex;
    gap: 2vw;
    font-size: 1.5em;
    color: #e4284c;
    padding-bottom: 3em;
    padding-top: 1em;
}
.about_sm {
    display: none;
}
.about span:hover, .about a:hover {
    font-family: Hover;
}
.about span, .about a {
    text-decoration: underline;
    color: #e4284c;
}
.about_text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.about_sm {
    display: none;
}
.red_gallery {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 3em;
    padding-bottom: 3em;
}
.red_gallery img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}
.red:hover {
    font-family: hover;
}

/* ==projects== */
.project-preview {
    display: flex;
    justify-content: space-between;
    gap: 3em;
    font-size: 4vw;
    align-items: center;
}
.project-preview a{
    color: #e4284c;
    text-decoration: none;
}
.project-preview a:hover {
    font-family: Hover;
    color: #e4284c;
}
#project-preview-bg {
    display: block;
}
#project-preview-sm {
    display: none;
}
hr {
    color: #e4284c;
    border: solid 1px;
}

/* ==more== */
.more a {
    font-size: 5vw;
    text-decoration: none;
    color: #e4284c;
}
.more a:hover {
    font-family: Hover;
}

/* ==gallery== */
.gallery {
    display: flex;
    justify-content: space-between;
    gap: 1em;
    flex-wrap: wrap;
}
.column_photo {
    display: flex;
    flex-direction: column;
    gap: 1em;
    flex: 1;
    min-width: 200px;
}
.column_photo img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.column {
    display: flex;
    flex-direction: column;
    gap: 1em;
    flex: 1;
    min-width: 200px;
}
.column img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.next{
    display: flex;
    justify-content: space-between;
    font-size: 1.7em;
    text-decoration: none;
    color: #e4284c;
    padding-bottom: 1em;
    padding-top: 0.5em;
}
.next a {
    text-decoration: none;
    color: #e4284c;
}
.next a:hover {
    font-family: hover;
}

/* ==sure== */
.sure, .sure_answer {
    display: flex;
    justify-content: center;
    gap: 5em;
}
.sure a, .sure_yes a, .sure_no a{
    font-size: 5em;
    text-decoration: none;
    color: #e4284c;
}
.sure_yes a:hover{
    font-family: hover;
    color: blue;
}
.sure_no a:hover{
    font-family: hover;
    color: #e4284c;
}

/* ==footer== */
#footer-lg {
    display: block;
    display: flex;
    bottom: 0;
    background-color: #fffbf3;
    justify-content: space-between;
    align-items: center;
    padding-top: 3em;
}
#footer-sm {
    display: none;
}

/* ==media== */
@media (max-width: 1024px) {
    body {
        padding: 0.5em;
    }
    #header-lg {
        display: none;
    }
    #header-sm {
        display: block;
        bottom: 0;
        padding-bottom: 1em;
    }
    #footer-lg {
    display: none;
    }
    #footer-sm {
        display: block;
        bottom: 0;
        padding-top: 1.5em;
    }
    .item-left, .item-middle, .item-right {
        flex: 1;
    }
    .item-middle {
        text-align: center;
    }
    .item-right {
        text-align: right;
    }
    .nav_link-sm {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .nav_link-sm, .nav_link-sm a, .home a {
        font-size: 4vw;
        text-decoration: none;
        color: #e4284c;
    }
    .nav_link-sm a:hover, .home a:hover {
        font-family: Hover;
    }
    .about {
        display: none;
    }
    .about_sm {
        display: block;
        display: flex;
        flex-direction: column;
        gap: 1em;
        margin-bottom: 2em;
    }
    .about_sm a { 
        text-decoration: underline;
        color: #e4284c;
    }
    .red_gallery {
        grid-template-columns: repeat(3, 1fr);
        gap: 1em;
    }
    #project-preview-bg {
        display: none;
    }
    #project-preview-sm {
        display: block;
    }
    .project-preview {
        font-size: 8vw;
        gap: 1em;
    }
    .more a {
        font-size: 8vw;
    }
    .sure a, .sure_yes a, .sure_no a {
        font-size: 3em;
        gap: 2em;
    }
    #impressum-sm {
        display: block;
    }
    #impressum-lg {
        display: none;
    }
    .impressum-sm {
        font-size: 4vw;
    }
}

/* ==
                                                  
                                                  
                         6444444446               
                      44444444444444              
                     4444444464444444             
                    444444      444444            
                   444444        44444            
                   444445        44444            
                   44444         44444            
         444444444 44444         44444            
      444444444444444444         44444 444        
    54444444444444444444        4444444444444     
    4444444444444444444444444444444444444444445   
    44444        44444444454444444544444  44444   
    44444         544444444444444444       44445  
    444445         44444444444444          6444   
    444444         545555444444444         4444   
     444444        4445444444444444444   44444    
      4444444      445544  444444444444444444     
      44444444444454444444544444444444444444      
        444444444544444444444444  4444444         
         4444444444444444544444    544444         
           4444444 44444554445       44444        
          4444445   4444444444       44444        
          44444         44444444      4444        
          44446         444444446    54444        
         64444         444444444444644464         
         64444        444444 44444444446          
         544444     6444444   64444446            
          446464444444444                         
           444644444446                           
            4444445                               
                                                  
                                                  
== */