.container{
    display: grid;
    grid-template-columns: 10% 80% 10%;
    font-family: "urbanist", sans-serif;
}

.logo{
    border: solid green 5px;
    border-radius: 15px;
    width: 100%;
    box-sizing: border-box;
}

.ptext{
    
    font-size: 17px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
}

.pixabay{
    font-size: 90px;
    width: 100%;
    padding: 80px 0px;
    margin-top: 10px;
    text-align: center;
    background-color: lightgray;
    border: solid grey 3px;
    border-radius: 10px;
    box-sizing: border-box;
    margin-bottom: 60px;
    font-family: "Dancing Script", cursive;
    font-weight: bold;
}

.separator hr {
    position: absolute;
    width: 79%;
}

.separator p {
    margin-top: -5px;
    position: absolute;
    padding: 2px 20px;
    background-color: white;
    margin-left: 100px;
    font-family: "Dancing Script", cursive;
}

.lektext{
    margin-top: 100px;
}

.lektext2{
    margin-top: 40px;
}

.fotos{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    column-gap: 15px;   
}

.fotos img, .fotos2 img{
    width: 100%;
    height: 90%;
    margin-bottom: 15px;
}

.fotos2 img{
    border-radius: 15px;
}

.textbox{
    margin-top: 0px;
    border: solid black 3px;
    padding: 3%;
    grid-column: 4/5;
    grid-row: 1/3;
}

.ff1{
    grid-column: 1/3;
}

.ff2{
    grid-column: 3/4;
}

.ff3{
    grid-column: 1/2;
}

.ff4{
    grid-column: 2/4;
}

.fotos2{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;   
}

li{
    list-style: none;
}

li:before{
    content: "\27A4";
}

ul{
    margin-left: -25px;
    margin-top: -15px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.bottom{
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

a{
    text-decoration: none;
}

a:visited, a, a:link{
    color: black;
}

#upp{
    text-align: right;
}