body {
    font-family: 'Urbanist', sans-serif;
}
@font-face {
    font-family: 'Urbanist';
    src: url('fonts/Urbanist-VariableFont_wght.ttf');
}
@font-face {
    font-family: 'Dancing Script';
    src: url('fonts/DancingScript-VariableFont_wght.ttf');
}
.allPage {
    display: grid;
    grid-template-columns: 25% 50% 25%;
    
}
img {width: 100%;}
.logo {
    border: 4px green solid;
    border-radius: 20px;
}
h1 {
    font-family: 'Dancing Script', cursive;
    border: 3px #cdcdcd solid;
    background-color: #f5f5f5;
    font-weight: 800;
    border-radius: 20px;
    text-align: center;
    padding: 8%;
    font-size: 4vw;
    margin-top: 0;
}
.container0 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
}
.container1 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 20px;
}
.container1 img {
    height: 100%;
}
.container2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3%;
}
.container2 img{
    border-radius: 20px;
}
.container2 p{
    margin-top: 0;
}
footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
span {
    margin-left: 20px;
    font-size: 20px;
    font-family: 'Dancing Script';
}
hr {
    width: 100%;
    height: 0px;
}
.lektion {
    margin-top: 8%;
    display: grid;
    grid-template-columns: 15% 15% 70%;
}
.bildtext1 {
    border: 3px solid black;
    grid-row: 1/3;
    grid-column: 5/7;
    
    padding: 3%;
}
.long1 {
    grid-column: 1/4;
}
.long2 {
    grid-column: 2/5;
}
.upp {
    text-align: right;
}