/* Standart topp meny med fixered plassering: --------------------------------------------------*/
.background_top {
	height: 80px;
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 5;
	background: #7d7e7d; /* Old browsers */
	background: linear-gradient(black, #003768);
}
.container_top{
	max-width: 1200px;
	/*min-height:715px;*/
	margin: 0 auto 0 auto;
	z-index: 10;
	top: 0;
	font-family: arial, helvetica, sans-serif;
	font-size: 16px;
}

.container_top div.topp {
	color: #fff;
	font-size: 16px;
	font-style: italic;
	padding-bottom: 0.2em;
	padding-left: 0.5em;
	display: block; /*kommer i bruk ved bredde under 48em*/
}
.container_top div.topp em.tittel {
	font-size: 1.5em;
}
.container_top em.tittel_top {
	color: #fff;
	font-style: italic;
	display: none; /*kommer i bruk ved bredde under 48em*/
}
/* header */

.header {
	float: left;
	padding-top: 0.5em;
}

.header ul.menu li a:hover {
	background: gray; /* I tilfelle background-image ikke fungerer)*/
	background: linear-gradient(gray, black);
    color: #fff;
	content: '';
}

.header ul.menu li a.aktuell_meny{
	/*background:url(pic_kode/meny_1.gif) no-repeat center center; */
	background: #1e5799; /* Old browsers */
	background: linear-gradient(#293667, #5176fc);
}

.header .menu_icon:hover {
	background: gray; /* I tilfelle linear-gradient ikke fungerer)*/
	background: linear-gradient(gray, blue);
    color: #fff;
	content: '';
}
.header .logo {
  display: block;
  float: left;
  font-size: 2em;
  padding: 10px 20px;
  text-decoration: none;
}

/* menu */

.header ul.menu {
	clear: both; /*viktig, kommer i bruk ved bredde under 48em*/
	max-height: 0; /*viktig, kommer i bruk ved bredde under 48em*/
	transition: max-height .2s ease-out; /* viktig, kommer i bruk ved bredde under 48em */
	padding: 0;
    margin: 0.5em; /* gir en bedre lodrett meny plassering enn padding-top: 0.5em */
	list-style: none;
    list-style-type: none;
    /*float: left;*/
    width: 100%;
    color: #fff;
	overflow: hidden;
	/*border: solid; /* test */
	/*border-width: 2px; /* test */
	/*border-color: red; /* test */
}
                     
.header ul.menu li a{
    float: left;
    width: 6em;
    color: #fff;
	padding-left: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
	margin: 0;
    background: black; /* I tilfelle linear-gradient ikke fungerer)*/
	background: linear-gradient(#003768, black);
    text-decoration: none;
	display: block;
	/*border: solid; /* test */
	/*border-width: 1px; /* test */
	/*border-color: #fff; /* test */
}


/* menu icon */

.header .menu_icon {
  cursor: pointer;
  display: inline-block;
  padding: 15.68px 11.2px;
  position: relative;
  user-select: none;
  background: gray;
  background: linear-gradient(#fff, gray)
}

.header .menu_icon .navicon {
  background: #333;
  display: block;
  height: 2px;
  position: relative;
  transition: background .2s ease-out;
  width: 18px;
}

.header .menu_icon .navicon:before,
.header .menu_icon .navicon:after {
  background: #333;
  content: '';
  display: block;
  height: 100%;
  position: absolute;
  transition: all .2s ease-out;
  width: 100%;
}

.header .menu_icon .navicon:before {
  top: 5px;
}

.header .menu_icon .navicon:after {
  top: -5px;
}

/* menu btn */

.header .menu_btn {
  display: none;
}

.header .menu_btn:checked ~ ul.menu {  /*~ viser den lodrette menyen når "hamburger" knappen klikkes (bredden redusert, vannrette meny vekke) */
  max-height: 300px; /* 240 det må være en minimum høyde for å vise den lodrette meny */
}

.header .menu_btn:checked ~ .menu_icon .navicon {  /* endre grafikken til "hamburger" knappen */
  background: transparent;
}

.header .menu_btn:checked ~ .menu_icon .navicon:before { /* endre grafikken til "hamburger" knappen */
  transform: rotate(-45deg);
}

.header .menu_btn:checked ~ .menu_icon .navicon:after { /* endre grafikken til "hamburger" knappen */
  transform: rotate(45deg);
}

.header .menu_btn:checked ~ .menu_icon:not(.steps) .navicon:before,
.header .menu_btn:checked ~ .menu_icon:not(.steps) .navicon:after {
  top: 0;
}

/* avstand mellom fiksert topp meny og body delen under */
.spacer_meny{
	width: 100%;
	height: 5em;
}

/* 48em = 768px */

@media screen and (min-width: 48em) {   /* når bredden er over 47em */
  .header ul.menu li {
    float: left;
  }
  .header ul.menu li a {
   /* padding: 20px 30px; /*  */
  }
 .header ul.menu { /*Dette bruke for at overkjøre enkelte tidliger egenskaper for menu som kommer i bruk ved bredde under 48em */
    clear: none;
   /*float: right;*/
    max-height: none;
  }
  .header .menu_icon {
    display: none;
  }
}
@media screen and (max-width: 48em) {
	.container_top div.topp {
		color: #fff;
		font-size: 16px;
		font-style: italic;
		padding-bottom: 0.2em;
		padding-left: 0.5em;
		display: none; /*kommer i bruk ved bredde under 48em*/
	}
	.container_top div.topp em.tittel {
		font-size: 1.5em;
	}
	.container_top em.tittel_top {
		color: #fff;
		font-style: italic;
		display: block; /*kommer i bruk ved bredde under 48em*/
	}	
	
	.header ul.menu li a{
	margin-top: 0.5em;
	padding-top: 8px;
	padding-bottom: 8px;
	}
}