@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Lato');
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@600&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Cardo&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Alegreya+Sans+SC:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Overpass:wght@600&display=swap');

:root {
  --nav-bg: hsl(44, 65%, 77%);
  --nav-bg: hsl(90, 70%, 96%); 
  --nav-bg: hsl(22, 90%, 63%);
  --bg: white;
  --her: white;
}

.border { border: thin solid black }

html, body, nav, article, h1, h2, h3, p, ul, li {
  margin: 0;
  padding: 0;
}

ul { margin-left: 2em }


html {
  background: var(--bg);
  font: 18px/1.5 Lato, sans-serif;
}




h1 { 
  font: italic 3vw/1.3 Bodoni Moda, serif; 
  font-size: calc(20px + 2vw);
  font-weight: 600;
  text-align: left;
  margin: 40x 0 15px 0;
  padding: 0 0 0.3em 0;
}

h1 { 
  font: 600 6vw/1.2 Bodoni Moda, serif; 
  font-size: calc(20px + 3vw);
  font-weight: 600;
  text-align: center;
  padding: 0 0 0.1em 0;
}

h2 { 
  font: italic 1.6vw/1.2 Bodoni Moda, serif; 
  font-size: calc(18px + 1.6vw);
  margin: 40px 0 15px 0;
  padding: 0;
}

h2 span.kilde {
  font: bold 18px/3 Lato, sans-serif;
  display: block;
  color: #555;
}

h3 { 
  font: 24px/1.2 Bodoni Moda, serif; 
  margin: 40px 0 15px 0;
  font-size: calc(18px + 0.4vw);
  padding: 0;
}

h3.bro { margin-bottom: 0 }

h4, label { 
  font: bold 24px/1.2 Bodoni Moda, serif;
/*   font-size: calc(18px + 1.2vw); */
  text-align: left;
  padding: 0 0 0 0;
  margin: 0.8em 0 0.2em 0;
}

p { margin: 0.6rem 0 0.8rem }

pre {
    font: 18px/1.5 Lato, sans-serif;
}

blockquote { margin: 0.4rem 0; font-style: italic }

/* article */

article {
  margin: 1em 10vw;
}

article.bred {
  margin: 1em 2vw;
}

article a { color: hsl(22, 90%, 40%); text-decoration: none;  }

/* a { text-decoration: none; color: black; font-style: italic } */

article hr { 
  margin: 1em 20%;
  padding: 1em;
  height: 1px;
  border: none; 
  border-bottom: 1px solid #ccc;
  clear: both;
}

article figure { 
   float: right;
   width: 35%;
   margin: 0.9rem 0 0.6rem 1em;
   padding: 0;
}

article figure img {
  width: 100%;
}

article .dato {
  font-family: Overpass, sans-serif;
  color: gray;
  font-size: 0.7em;
}

/* footer */

footer img {
  height: 2em;
}


footer {
  text-align: center;
  margin: 1em 0 1em;
}

footer li { 
  display: inline;
  list-style-type: none;
}
  

p { text-align: justify }

p.ny { background: #dfd }
p.gammel { background: #fdd }
p.ingress { font-size: 1.2em; margin: 1em 2em }


.s { text-align: center }
.d { display: none }
.v { text-align: left }
.h { text-align: right }

header {
  background: #2b2b2b;
  overflow: auto; /* clearfix */
  xpadding-bottom: 20px;
}


/* 
header img { float: left; box-sizing: border-box; width: 20vw } 
header img#medalje { width: 18vw }
header img#medalje { padding-top: 1vw }
header #logo { padding: 2vw 2vw 0 2vw }
*/

header img { width: 100% } 

header h1 {
  font: 4.3vw Overpass, sans-serif; 
  color: white;
  padding-top: 2vw;
  text-align: left;
  margin-left: 2vw;
  float: left;
}

/* navigasjon  */

nav { 
  font: 24px 'Alegreya Sans SC', sans-serif;
  color black;
  background: var(--nav-bg);
  box-shadow: 0px 3px 5px gray;
  clear: both;
  margin: 0 0 2em;
  padding: 0.3em;
}

nav a {
  transition: 0.2s;
  font-style: normal;
}

nav a:visited, nav a:link {
  color: black;
}

nav a:hover {
  color: var(--her);
}

/* HORIZONTAL MENU ITEMS */

#hamitems { text-align: left }
#hamitems a {
  padding: 0.3em 0.8em;
  text-decoration: none;
}
#hamitems a:hover { color: var(--her) }

/* HIDE HAMBURGER */
nav label, #hamburger { display: none; }

/* små skjermer */

@media screen and (max-width: 800px) {
/*
  header img { float: left; height: auto; width: 15% }

  header h1 { font: 7vw Overpass, sans-serif }
*/
  p { text-align: left }

  article figure { 
    float: none;
    width: 100%;
    margin: 0;
  }

/* menyer */

  #hamitems a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border-top: 1px solid #333;
    background: #aaa;
    background: black;
    color: white;
  }

  /* (B) SHOW HAMBURGER ICON */
  nav label {
    display: inline-block;
    text-align: right;
    color: white;
    background: #a02620;
    background: #F99F61;
    font-style: normal;
    font-size: 1.2em;
    padding: 10px;
    float: right;
    position: absolute;
    top: 0; 
    right: 0;
  }

  /* (C) TOGGLE SHOW/HIDE MENU */
  #hamitems { display: none; }
  nav input:checked ~ #hamitems { display: block; position: fixed; top: 10px; right: 30px; z-index: 2 }

  nav {
    box-shadow: none;
    float: right;
    padding: 0;
    margin: 0;
  }
}