/* Grundinställningar som påverkar hela sidan */
* {
    box-sizing: border-box;
}

body {
    background-color: rgb(173, 117, 44);
    font-family: 'Candara';
}

/* Sidhuvudets layout och dekorativa stil */
header {
    text-align: center;
    padding: 40px;
    background-color: rgb(129, 28, 28);
    border: solid 4px;
    border-color: rgb(214, 170, 89);
    margin: 50px;
    border-radius: 10px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.508);
}

/* Utseende för huvudrubriken */
h1 {
    font-size: 40px;
    font-family: 'Segoe script';
    text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.808);
    background-image: linear-gradient(rgb(255, 221, 141), rgb(182, 157, 75));
    color: transparent;
    background-clip: text;
}

/* Navigationsfältets layout, positionering och bakgrundsstil */
nav {
    margin-top: 5px;
    position: sticky;
    top: 0px;
    margin-bottom: 20px;
    background: linear-gradient(75deg, rgb(164, 24, 24), rgb(129, 28, 28));
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.508);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border: solid 2px;
    border-color: rgb(214, 170, 89);
}

/* Huvudinnehållets tvåkolumnslayout med grid */
#content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-auto-rows: 1000px;
    gap: 30px;
    margin-left: 30px;
}

/* Utseende för sidans sektioner */
section {
    border: 2px solid;
    border-color: rgb(85, 50, 17);
    padding: 15px;
    background-color: rgb(255, 219, 156);
}

/* Utseende för sidans aside-del */
aside {
    border: 2px solid;
    border-color: rgb(85, 50, 17);
    padding: 15px;
    background-color: rgb(255, 219, 156);
    margin-right: 30px;
}

/* Sidfotens struktur och bakgrund */
footer {
    margin-top: 20px;
    margin-bottom: 0px;
    position: relative;
    bottom: 0px;
    border: 2px solid;
    border-color: rgb(85, 50, 17);
    padding: 15px;
    background-color: rgb(255, 219, 156);
}

/* Navigationslistans struktur och standardtypsättning */
nav ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    font-size: 0px;
}

/* Menyobjektens grundlayout */
nav li {
    padding: 0px;
    display: inline-block;
    font-size: 14px;
}

/* Grundstil för länkar i navigationsmenyn */
nav li a {
    color: black;
    padding: 20px;
    display: block;
    text-decoration: none;
    transition: 0.1s;
}

/* Hover-effekt för menyval */
nav li a:hover {
    background-color: rgb(231, 181, 94);
    transform: scale(1.1);
    border-radius: 3px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.168);
}

/* Aktivt klickat menyobjekt */
nav li a:active {
    background-color: rgb(241, 225, 133);
    color: rgb(255, 255, 255);
}

/* Färg för redan besökta länkar */
nav li a:visited {
    color: black;
}

/* Markering av aktuell sida i menyn */
#current {
    background-color: rgb(235, 190, 114);
}

/* Stil för bildtexter under bilder */
figcaption {
    padding: 3px;
    padding-left: 15px;
    position: relative;
    bottom: 30px;
    left: 0px;
    color: white;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    font-family: 'Candera'; 
}

/* Typsnitt för huvudinnehållets text */
.huvudtext {
    font-family: 'NK_Monotype Corsiva';
}

/* Dölj hamburgermenyn i desktop-läge */
#dropdown {
    display: none;
}