body {
    max-width: 100ch;
    /* maks bredde på teksten */
    margin: 0 auto;
    /* sentrerer blokken horisontalt */
    text-align: left;
    /* venstrejusterer teksten inne i blokken */
}

.publish {
  font-size: 0.75rem; /* tilsvarer liten tekst, ca size="1" */
  font-weight: bold; /* gjør teksten bold uten <strong> */
  color: #333;         /* valgfritt */
  margin: 0;           /* fjern ekstra margin hvis ønskelig */
}

a {
  color: darkgreen;
  text-decoration: none;
}

a:hover {
  color: green;
}
a.translation-link { color: black; 
  font-style: italic;
  text-decoration: none;
 }
a.translation-link:hover { color: gray; }

p {
    font-size: 20px;
    line-height: 30px;
}

ul {
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 8px;       /* avstand mellom punktene */
}
ul ul {
  margin-top: 4px;       /* avstand over innerste ul */
  margin-bottom: 6px;      /* juster etter behov */
  padding-left: 20px;    /* innrykk for nested */
}
ul ul li {
  margin-bottom: 10px;    /* avstand mellom punktene på nested nivå */
  font-size: 19px;
}

.flag-link {
  display: block;
  text-align: right;
  text-decoration: none;  /* fjerner understrek */
  font-size: 20px;        /* gjør flagget større hvis du vil */
}

.boom-link {
  display: block;
  text-align: center;
  text-decoration: none;  /* fjerner understrek */
  font-size: 40px;        /* gjør flagget større hvis du vil */
}

.bilde { display: block; margin: 0 auto; }
.w30 { width: 30%; }
.w40 { width: 40%; }
.w50 { width: 50%; }

span.skill {
  display: inline-block;
  background-color: lightgreen;
  color: black;
  padding: 5px;
  border-radius: 5px;
  border: 1px solid green;
  font-size: 14px;
}
span.date {
  color: green;
  font-style: italic;
  text-align: right;
}
span.bread-text {
  display: inline-block;
  width: 320px;
  word-wrap: break-word; /* Bryter ord til neste linje hvis nødvendig */
}

h6.cv {
  margin-bottom: 5px;
  margin-top: 5px;
  font-size: 30px;
}
body.cv {
  width: 800px;         /* ca. A4-bredde på skjerm */
  margin: 0 auto;       /* sentrerer horisontalt */
  background: white;    /* hvit bakgrunn (som et ark) */
  padding: 20px;        /* luft innenfor kantene */
  font-family: Arial, sans-serif; /* pen standard font */
}

body.cv ul {
  font-size: 17;
  line-height: 22px;
}
  
/* Desktop og nettbrett */
@media (min-width: 768px) {
  .menu-toggle {
    display: none;   /* skjul hamburgerknappen på desktop */
  }
  .menu {
    display: block;  /* menyen er alltid synlig */
  }
  .sidebar {
    height: 100%;
    width: 150px;
    position: fixed;
    left: 0;
    top: 0;
    padding-top: 40px;
    background-color: rgb(149, 231, 149);
    overflow-y: auto;  /* fint å beholde scrollebar hvis sidebar blir lang */
  }

  .sidebar a {
    padding: 8px;
    font-size: 24px;
    display: block;
  }

  .body-text {
    margin-left: 150px;
    font-size: 18px;
  }
}

/* Mobil: stack sidebar over innhold */
@media (max-width: 767px) {
  body {
    max-width: 95ch; /* gjør teksten smalere på mobil */
    margin: 0 auto;  /* fortsatt sentrert */
    padding: 0 10px; /* litt luft på sidene */
  }

  .body-text {
    margin-top: 10px; /* eller litt mer hvis du vil ha mer luft */
  }

  .menu {
    display: none;   /* skjul menyen til å begynne med */
  }
  .menu-toggle {
    top: 10px;          /* litt luft fra toppen */   
    display: block;            /* vis knappen */
    background-color: #95e79f; /* lys grønn bakgrunn */
    color: black;              /* tekst/farge på ☰ */
    border: none;              /* fjern ramme */
    padding: 10px 15px;        /* litt luft rundt ikonet */
    font-size: 24px;           /* størrelse på ☰ */
    cursor: pointer;           /* pekeren blir hånd */
    border-radius: 5px;        /* valgfritt, rundede hjørner */
  }
 
  .menu.open {
    display: block;  /* vises når JS legger til klassen "open" */
  }
  .sidebar {
    position: relative;   /*fast*/
    width: 100%;          /* tar hele bredden på toppen */
    height: auto;         /* ikke låst til skjermhøyde */
    padding-top: 0;       /* fjerner ekstra topppadding */
    /* z-index: 2; */
  }

  .sidebar div {
    font-size: 18px;      /* mindre tekst på mobil */
    padding: 5px;         /* litt trangere */
  }

  .body-text {
    margin-left: 0;       /* fyller hele bredden under menyen */
  }
}
