header {
  box-sizing: border-box; /* Padding og border regnes inn i elementets totale bredde */
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}



h1{
  margin: 0px;
}

header {
  background-color: #4a72b8; /* Setter bakgrunnsfarge på headeren */
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; /* Skrifttype */
  font-size: 17px;
  color: white; /* Setter tekstfarge til hvit */
  min-height: 100px; /* Minimum høyde på headeren */
  height: auto; /* Høyden tilpasses innholdet */
  padding: 0 20px; /* Horisontal padding på 20px, ingen vertikal padding */
  width: 100%; /* Headeren fyller hele bredden */
  display: flex; /* Gjør headeren til en flex-container for enkel layout */
  align-items: center; /* Sentrerer elementene vertikalt i headeren */
  justify-content: flex-start; /* Plasserer elementene mot starten (venstre) horisontalt */
  position: relative; /* Gjør det mulig å posisjonere menyen absolutt i forhold til headeren */
}

.Logo {
  margin-left: auto; /* Flytter logo til høyre i headeren */
  display: flex; /* Gjør logo-containeren til flex-container */
  align-items: center; /* Sentrerer logoen vertikalt */
}





.Logo img {
  height: 100px; /* Setter høyde på logo */
  width: auto; /* Bredden justeres proporsjonalt */
}

body {
  margin: 0; /* Fjerner standard margin */
  padding: 0; /* Fjerner standard padding */
}
.meny {
  background-color: #4a72b8; /* Bakgrunnsfarge på menyen */
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; /* Skrifttype */
}


.meny ul {
  list-style: none; /* Fjerner punktmerking på listen */
  margin: 0; /* Fjerner margin */
  padding: 0; /* Fjerner padding */
  display: flex; /* Gjør listen til horisontal flex-container */
}

.meny li {
  margin-left: 10px; /* Avstand mellom meny-elementene */
}

.meny a {
  display: block; /* Gjør lenkene til blokk-elementer */
  padding: 15px 20px; /* Legger padding inni lenkene */
  color: white; /* Tekstfarge */
  text-decoration: none; /* Fjerner understrek */
}

.meny a:hover {
  background-color: #819db8; /* Endrer bakgrunn når musen hovrer over lenken */
}




.hamburger {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  margin-left: 15px;
}

.hamburger span {
  display: block;
  width: 28px;
  height: 3px;
  margin: 6px 0;
  background-color: white;
}




@media (max-width: 768px) {

  /* Vis hamburger */
  .hamburger {
    display: block;
  }

  /* Skjul vanlig meny */
    .meny {
    display: none;
    width: 100%;
    background-color: #4a72b8;
    position: absolute;
    top: 100%;          /* rett under header */
    left: 0;
    width: 100%;
    background-color: #4a72b8;
    z-index: 9999;

    display: none;      /* fjernes fra layout */
  
  }

  /* Når menyen er aktiv */
  .meny.active {
    display: block;
  }

  .meny ul {
    flex-direction: column;
  }

  .meny li {
    margin: 0;
    border-top: 1px solid rgba(255,255,255,0.2);
  }

  .meny a {
    padding: 15px;
    text-align: center;
  }

  /* Gjør header mer kompakt */
  header {
    flex-wrap: wrap;
  }

  .Logo {
    margin-left: auto;
  }

}




@media (max-width: 768px) {

  @media (max-width: 768px) {

  .Logo {
    display: none;
  }

  #bunnlogo {
    display: none !important;
  }

}}






.omoss {
  max-width: 70%; /* Maksimal bredde på seksjonen */
  margin: 40px auto; /* Sentrerer seksjonen horisontalt og gir vertikal margin */
  padding: 30px; /* Padding inni seksjonen */
  border: 4px solid #4a72b8; /* Ramme rundt seksjonen */
  background-color: #c6c6c6; /* Bakgrunnsfarge */
  font-size: 25px; /* Tekststørrelse */
  line-height: 1.6; /* Linjeavstand */
}

.omoss img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  border: 6px solid #4a72b8;
}


html, body {
  height: 100%; /* Setter full høyde på html og body */
}

body {
  margin: 0; /* Fjerner margin */
  display: flex; /* Gjør body til flex-container */
  flex-direction: column; /* Ordner innholdet vertikalt */
  min-height: 100vh; /* Minimum høyde lik viewport */
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; /* Skrifttype */
}

.team {
    display: grid;
    /* Use auto-fit or auto-fill so it adapts automatically */
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem;
    text-align: center;
    padding: 1rem; /* optional: gives some breathing room */
    box-sizing: border-box;
}

.person img {
    width: 100%;
    max-width: 200px;
    height: auto;
    border-radius: 50%; /* optional, for circular images */
}

.text {
    margin-top: 0.5rem;
}

.name {
    font-weight: bold;
}

.role {
    font-size: 1.6rem;
    color: #666;
}



/* FOOTER GENERELL STYLING */
footer {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-size: 17px;
  margin-top: 50px;
  background-color: #819db8;
  color: #ffffff;

  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;

  padding: 30px 30px;
  gap: 0px;

  text-align: center;
}

/* Lister */
footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* VENSTRE */
.bunnvenstre {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

#bunnlogo {
  display: flex;
  justify-content: center; /* holder logoen sentrert */
  align-items: center;
}

#bunnlogo img {
  height: 100px;   /* større, men fortsatt kontrollert */
  width: auto;
  display: block;
}

/* HØYRE */
.bunnhøyre {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}