@font-face{
    font-family:"OverpassMono";
    src:url('fonts/OverpassMono-Light.ttf') format('truetype');
    font-weight:normal;
    font-style:normal;
}
@font-face{
    font-family:"OverpassMono";
    src:url('fonts/OverpassMono-SemiBold.ttf') format('truetype');
    font-weight:600;
    font-style:normal;
}
body{
    background-color:#181818;
    font-family:"OverpassMono",monospace;
}
.grid-item{
    background-color:#000000;
    text-align:center;
}
.header{
    grid-area:header;
    text-align:left;
    font-size:4vw;
    font-weight:600;
    padding-top:4%;
    padding-bottom:2%;
    padding-left:12%;
}
.lefty{
    grid-area:lefty;
    text-align:center;
    padding:auto;
    font-size: 1.2vw;
}
ul{
    list-style-type:none;
    margin:0;
    padding:0;
}
li a{
    display:block;
    color:#ffffff;
    text-decoration:none;
    width:auto;
    margin:20px;
    padding-top:10px;
    padding-bottom:10px;
}
li a.aktiv{
    background-color:#131313
}
.main{
    grid-area:main;
    padding-top:20px;
    font-size:2.2vw;
}
.info{
    font-size:1vw;
    color:#ffffff;
}
h3 a{
    text-decoration:none;
    color:#ffffff;
}
img {
  width: 70%;
  height: auto;
}

.grid-container{
    display:grid;
    grid-template-areas:'main main main main main main main' 'lefty lefty lefty lefty lefty lefty lefty';
    grid-gap:20px;
    padding:20px;
}
@media screen and (max-width:1400px){
    .grid-container{display:grid;grid-template-areas:'main main main main main' 'lefty lefty lefty lefty lefty';
        grid-gap:15px;
        padding:15px;
    }
}
@media screen and (max-width:1100px){
    .grid-container{display:grid;grid-template-areas:'main main main main main' 'lefty lefty lefty lefty lefty';
        grid-gap:10px;
        padding:10px;
    }
}
@media screen and (max-width:800px){
    .grid-container{display:grid;grid-template-areas:'main main' 'lefty lefty';
        grid-gap:5px;
        padding:5px;
    }
    .info{
        font-size:2.2vw;
    }
    .main{
        font-size:2.2vw;
    }
    .header{
        font-size:4vw;
        font-weight:600;
    }
    .lefty{
        font-size: 1.8vw;
    }
}
