/* GENERELLE STILER */
body {
    font-family: Arial, sans-serif;
    margin: 0; /* Fjern default marg */
    padding: 0;
}

/* NAVIGASJON OG TOPP-BAR */
nav {
    position: relative;
}

.top-bar {
    background-color: #333;
    color: white;
    padding: 10px;
    text-align: left;
    position: relative;
}

/* Hindrer floating-issues hvis du bruker float: right */
.top-bar::after {
    content: "";
    display: table;
    clear: both;
}

/* HAMBURGER-KNAPP */
.hamburger {
    float: right;
    font-size: 24px;
    background: none;
    border: none;
    color: white;
    cursor: pointer;
}

.hamburger:focus {
    outline: none; /* Estetikk: fjerner fokusramme. Vurder å beholde for tilgjengelighet. */
}

/* MENYEN I MOBILVISNING
   - Skjules som standard
   - Vises med "display: block" når man trykker på hamburger 
*/
.menu {
    display: none;
    background-color: #444;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    position: absolute; /* Plasserer menyen "flytende" under top-baren */
    top: 100%;
    left: 0;
    z-index: 100; /* Ligger over annet innhold */
}

.menu a {
    color: white;
    text-decoration: none;
    padding: 8px;
    display: block;
}

/* VIS MENY HORISONTALT PÅ STØRRE SKJERMER */
@media (min-width: 768px) {
    .hamburger {
        display: none; /* Skjul hamburger */
    }
    .menu {
        display: block; /* Vis meny */
        position: static; /* Fjern absolutt posisjonering */
        background-color: #333;
    }
    .menu a {
        display: inline-block; 
    }
}

/* SEKSJONSINNHOLD (topics osv.) */
.topic {
    margin-bottom: 10px;
}

/* DROPDOWN-INNHOLD (horisontal scrolling) */
.topic-header {
    padding: 10px;
    background-color: #f5f5f5;
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
    cursor: pointer;
    display: flex;
    justify-content: space-between; /* Pil til høyre */
    align-items: center;
}

.arrow {
    transition: transform 0.3s ease; 
    /* Du kan rotere pilen ved dropdown i scriptet om du vil */
}

.dropdown {
    display: none;
    overflow-x: auto;   /* Horisontal rulling */
    white-space: nowrap; 
    background-color: #f9f9f9;
}

/* Hver lenke i dropdown ligger inline (for å rulle horisontalt) */
.dropdown a {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin: 10px;
    padding: 5px;
    color: inherit; /* Arver tekstfarge (evt. endre til black/blue) */
}

.dropdown img {
    width: 250px; 
    height: auto;
}

/* EKSTRA: RESPONSIV IFRAME (hvis du har videoinnhold) */
.responsive-iframe {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9-forhold */
    overflow: hidden;
}
.responsive-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}