@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

*{
    box-sizing: border-box;
}
p, a{
    font-family: "urbanist", sans-serif;
}

body{
    background-color: #f0f0f0;
    margin: 0px;
    display: grid;
    grid-template-columns: 1fr 4fr 1fr;
    gap: 15px;
}
body *{
    width: 100%;
}

h1, h2, h3{
    font-family: "Dancing Script", cursive;
    color: #2e782f;
    font-weight: bold;
    text-align: center;
    margin: 0px;
}
h2{
    background-color: white;
    border-radius: 10px;
    margin: 10px 0px 20px 0px;
    padding: 20px;
    font-size: xx-large;
}
h3{
    font-size: x-large;
}


header{
    background-color: #2e782f;
    grid-column: 1/4;
}
header img{
    background-color: white;
    border-radius: 10px;
    padding: 20px 20% 10px 20%;
    margin: 20px auto 20px auto;
    width: 70%;
    display: block;
}


nav a{
    padding: 10px;
    background-color: white;
    border-radius: 8px;
    display: block;
    margin: 0px auto 20px auto;
    text-align: center;
    text-decoration-line: none;
    color: #2e782f;
    font-weight: bold;
    width: 95%;
}
.main_head{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: baseline;
}
.main_head hr{
    background-color: #2e782f;
    border:none;
    height: 4px;
    margin: 22px auto;
    width: 95%;
}

main section{
    background-color: white;
    border-radius: 10px;
    margin-bottom: 20px;
    padding: 20px;
}
main img{
    
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    height: 200px;
}

.top{
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    grid-template-rows: auto auto auto auto;
    gap: 10px;
}
.top h1{
    grid-column: 1/-1;
    margin-bottom: 10px;
    padding-bottom: 0px;
    height: 35px;
    border-bottom: #2e782f dashed 2px;
}
.img1{
    grid-column: 1/3;
}
.img4{
    grid-column: 2/-1;
}
.img5{
    grid-column: 1/-1;
}

.bottom{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}

.bottom h3{
    border-bottom: #2e782f solid 2px;
    margin-bottom: 10px;
}

nav a, main section, h2{
    box-shadow: 0px 2px 5px black;
}

.reklam_rubrik
{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

footer{
    display:grid;
    grid-template-columns: 85% auto;
    grid-column: 1/4;
    background-color: #2e782f;
    padding: 20px;
}
footer *{
    text-align: left;
    color: #f0f0f0;
    margin: 5px;
}
footer h3{
    display: inline;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    margin-bottom: 10px;
}
footer a{
    display: block;
    text-decoration-line: none;
    text-align: center;
}