html, body
{
  padding:0;
  margin:0;
}

body.mobile
{
  background:#003399;
  background-image:url('/background/bla_noter_136x82.png');
}

body.widescreen
{
  background:#003399;
  background-image:url('/background/bla_noter_136x82.png');
}
/*
body.widescreen
{
  background:#99ccff;
  background-image:url('/background/background_kornbla.png');
}
*/

.mobile .nav label.togglemenu 
{
  color:#ffffff;
}

.widescreen .nav label.togglemenu 
{
  color:#ffffff; /* ccdaff */
}

/*
	.widescreen .darkgrey
	{
      background-image:url('/background/lenalila_200x100.png') !important;
	}
*/
	.mobile .almostbluegrey
	{
      background-image:url('/background/background_10proc.png') !important;
	}

	.mobile .bluegrey
	{
      background-image:url('/background/background_20proc.png') !important;
	}

	.mobile .middlegrey
	{
      background-image:url('/background/background_30proc.png') !important;
	}

	.mobile .darkgrey
	{
      background-image:url('/background/background_40proc.png') !important;
	}

	.widescreen .darkgrey
	{
       background-image:url('/background/background_50proc.png') !important;
	}

	.widescreen .darkgrey_index
	{
       background-image:url('/background/background_50proc_43639e.png') !important;
	}

	.widescreen .darkgrey_kar
	{
       background-image:url('/background/background_50proc_333300.png') !important;
	}

	/* background_50proc_0000ff_000000.png */
	.mobile .neutralgrey
	{
       background-image:url('/background/background_50proc.png') !important;
	}
/*
	.widescreen .neutralgrey
	{
      background-image:url('/background/lenalila_200x100.png') !important;
	}
*/
	.widescreen .neutralgrey
	{
       background-image:url('/background/background_50proc.png') !important;
	}

	ul li ul li span.bla_0099ff
       {
	  color:#0099ff;
	}

	ul li ul li span.ff99ff
       {
	  color:#ff99ff;
	}
	
	ul li ul li.ff00ff
       {
	  color:#ff00ff;
	}

.widescreen ul li label span.big
{
  font-size:1.1em;
  color:#ffffff; /* #ccdaff */
  font:bold;
}

.mobile	ul li label span.big
{
  font-size:1.1em;
  color:#ffffff; /* #ffe5d9 FFE5D9 (#F7E9E1) */
  font:bold;
}

.nav input,
#togglemenu 
{
  position:absolute;
  left:-9999px;
  display:none;
}

.nav {width:100%; max-width:100%; margin:0 auto 0 auto;}  /* var 1400px */

.nav ul li label.openmenu 
{
background:#000000 !important; 
transition:0.25s; 
-webkit-transition:0.25s;
}

.nav ul li label a {background:rgba(217,210,204,0);  /* 217 */
 transition:0.5s; 
 -webkit-transition:0.5s; 
color:#ffffff !important; /* ej valda lankar huvudmeny och mobilmeny */
}

.nav ul li label a:hover {background:rgba(217,210,204,0); 
 transition:0.5s; 
 -webkit-transition:0.5s; 
color:#0000ff !important; /* hover over ffffff lank blir 0000ff */
}

.nav #closemenu {display:none; position:fixed; top:0; left:0; height:100%; width:100%; z-index:80;}

.nav #val1:checked ~ ul > li:nth-of-type(1) .closetop, 
.nav #val2:checked ~ ul > li:nth-of-type(2) .closetop, 
.nav #val3:checked ~ ul > li:nth-of-type(3) .closetop, 
.nav #val4:checked ~ ul > li:nth-of-type(4) .closetop,
.nav #val5:checked ~ ul > li:nth-of-type(5) .closetop, 
.nav #val6:checked ~ ul > li:nth-of-type(6) .closetop, 
.nav #val7:checked ~ ul > li:nth-of-type(7) .closetop, 
.nav #val1:checked ~ #closemenu, 
.nav #val2:checked ~ #closemenu, 
.nav #val3:checked ~ #closemenu, 
.nav #val4:checked ~ #closemenu, 
.nav #val5:checked ~ #closemenu, 
.nav #val6:checked ~ #closemenu, 
.nav #val7:checked ~ #closemenu {display:block;}


/* mobil finns .nav > ul */ .nav  ul {position:relative; margin:0; padding:0; list-style:none; z-index:100;}

/* bada */ .nav label.togglemenu {display:none;}
/* bada */ .nav > ul > li {float:left; margin:0 0 0 0;}

/* bada */ .nav ul > li > div ul {display:inline-block; width:30%; margin:0 0 0 2%; padding:6px 0 6px 0; vertical-align:top;} /* flik i datormenyn undermeny, datorversion */

/* min extra bred av undermenu */ .nav ul > li > div ul.twentyproc {display:inline-block; width:20%; margin:0 0 0 2%; padding:6px 0 6px 0; vertical-align:top;}


/* bada */ .nav ul li label.opentop {background:rgba(217,210,204,0)
 transition:0.5s;
 -webkit-transition:0.5s;
color:#ffffff; /* hamburger huvudmeny */
}

/* bada */ .nav ul li label.closetop {width:100%; padding:0; height:75px; margin-top:-75px; display:none;}

/* bada */ .nav ul ul li {padding:1px 0 1px 0; border-top:1px solid #aaaaaa;}
/* bada */ .nav ul ul li:last-child {border-bottom:1px solid #aaaaaa;}


.nav ul ul li a img {display:block; margin:0 auto; border:0;}
/* bada */ .nav ul ul li a:hover {color:#0000ff !important; background:rgb(167,160,154) !important;} /* bakgrund undermeny, color avser hover over lank i undermenyn, bade dator och mobil */




/* bada */ .nav ul > li > div {display:block; position:absolute; left:0; max-height:0; width:100%; overflow:hidden; background:rgba(0,0,0,0.7) !important; z-index:0; /* background:rgba(237,230,224,0.9) *//* top: hur langt under huvudmenyn liggerundermeny */
transition:0.25s; 
-webkit-transition:0.25s;
}


/* detta ar default, samma som default i mobilmenyn */
/* bada */ .nav ul li label {display:block; font:normal 24px/24px verdana, sans-serif; color:#ffffff !important; padding:8px 12px 8px 12px; cursor:pointer; position:relative; height:36px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:40px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 24px/24px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas font och farg undermeny datormeny */


@media only screen and (min-width: 1335px) and (max-width: 1680px) /* Torbjorn, Elisabeth dator */
/* bada */ {
.nav ul li label {display:block; font:normal 24px/24px verdana, sans-serif; color:#ffffff !important; padding:8px 12px 8px 12px; cursor:pointer; position:relative; height:30px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:40px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 24px/24px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}

@media only screen and (min-width: 1137px) and (max-width: 1334px)
/* bada */ {
.nav ul li label {display:block; font:normal 24px/24px verdana, sans-serif; color:#ffffff !important; padding:8px 8px 8px 8px; cursor:pointer; position:relative; height:24px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:40px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 18px/18px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}

@media only screen and (min-width: 1081px) and (max-width: 1136px) /* Elisabeth iPhone landscape */
/* bada */ {
.nav ul li label {display:block; font:normal 24px/24px verdana, sans-serif; color:#ffffff !important; padding:8px 8px 8px 8px; cursor:pointer; position:relative; height:24px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:40px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 18px/18px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}

@media only screen and (min-width: 941px) and (max-width: 1080px) /* Jana */
/* bada */ {
.nav ul li label {display:block; font:normal 18px/18px verdana, sans-serif; color:#ffffff !important; padding:8px 8px 8px 8px; cursor:pointer; position:relative; height:18px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:34px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 16px/16px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}

@media only screen and (min-width: 861px) and (max-width: 940px) /* under Jana */
/* bada */ {
.nav ul li label {display:block; font:normal 16px/16px verdana, sans-serif; color:#ffffff !important; padding:8px 8px 8px 8px; cursor:pointer; position:relative; height:16px; } /* border-radius:10px 10px 0 0; */
/* bada */ .nav ul > li > div {top:32px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 14px/14px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}

@media only screen and (min-width: 781px) and (max-width: 860px)
/* bada */ {
.nav ul li label {display:block; font:normal 14px/14px verdana, sans-serif; color:#ffffff !important; padding:8px 8px 8px 8px; cursor:pointer; position:relative; height:14px; } /* border-radius:10px 10px 0 0; */ /* top:30px = font 14 + padding upp 8 + padding ner 8 = 30 */
/* bada */ .nav ul > li > div {top:30px;} /* top: hur langt under huvudmenyn liggerundermeny */
/* bada */ .nav ul ul li a {display:block; font:normal 14px/14px verdana, arial, sans-serif; padding:0 10px 0 10px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
}


/* bada */ .nav #val1:checked ~ ul > li:nth-of-type(1) > div,
/* bada */ .nav #val2:checked ~ ul > li:nth-of-type(2) > div, 
/* bada */ .nav #val3:checked ~ ul > li:nth-of-type(3) > div, 
/* bada */ .nav #val4:checked ~ ul > li:nth-of-type(4) > div,
/* bada */ .nav #val5:checked ~ ul > li:nth-of-type(5) > div, 
/* bada */ .nav #val3:checked ~ ul > li:nth-of-type(3) > div, 
/* bada */ .nav #val6:checked ~ ul > li:nth-of-type(6) > div,
/* bada */ .nav #val7:checked ~ ul > li:nth-of-type(7) > div {max-height:700px; z-index:1; box-shadow:0 10px 8px -8px rgba(0,0,0,0.3); /* 500px */
transition:0.25s 0.25s;
-webkit-transition:0.25s 0.25s;}


/* bada */ .nav #val1:checked ~ ul > li:nth-of-type(1) > label.opentop, 
/* bada */ .nav #val2:checked ~ ul > li:nth-of-type(2) > label.opentop, 
/* bada */ .nav #val3:checked ~ ul > li:nth-of-type(3) > label.opentop, 
/* bada */ .nav #val4:checked ~ ul > li:nth-of-type(4) > label.opentop, 
/* bada */ .nav #val5:checked ~ ul > li:nth-of-type(5) > label.opentop, 
/* bada */ .nav #val6:checked ~ ul > li:nth-of-type(6) > label.opentop, 
/* bada */ .nav #val7:checked ~ ul > li:nth-of-type(7) > label.opentop {background:rgba(0,0,0,0.3); color:#0000ff !important;} /* rgba(217,210,204,0.9) markerar fliken i huvudmenyn som har undermenyn oppen */


/**************************************************************************/

/* @media only screen and (max-width: 768px) */
@media only screen and (max-width: 780px)
{

.nav label {display:block; cursor:pointer;}
/* bada */ .nav ul li label {height:auto; border-radius:0;}
/* bada */ .nav ul li label {display:block; font:normal 24px/24px verdana, sans-serif; color:#ffffff !important; padding:8px 12px 8px 16px; cursor:pointer; position:relative; height:24px; } /* border-radius:10px 10px 0 0; */

/* bada */ .nav label.togglemenu {float:left; display:block; cursor:pointer; position:relative; z-index:100; font:normal 24px/24px verdana, arial, sans-serif; margin:8px 12px 8px 16px;} /* #ccdaff #F7E9E1 toggle MENY och hamburger, samma farg */


/* dator finns .nav ul */ .nav > ul {max-height:0; overflow:hidden; width:100%; background:#555555; padding:0; clear:both; /* bakgrund mobilmeny */
 transition:0.5s;
 -webkit-transition:0.5s;
}




/* bada */ .nav ul li label.closetop {height:48px; margin-top:-48px;}
/* bada */ .nav ul li label.opentop {color:#ffffff; border-top:1px solid #ffffff; text-align:left;}  /* hamburger mobilmeny */
/* bada */ .nav > ul > li {width:100%; max-width:100%; text-align:center;}
/* bada */ .nav ul > li > div {position:static; padding:0;}
/* bada */ .nav ul > li > div ul {width:100%; max-width:100%; display:block; padding:0 0 0 16px; margin:0; background: #333333;} /* vanstermarginal mobil undermeny */
.nav #togglemenu:checked ~ ul {max-height:1024px;} /* 700px */


/* bada */ .nav #val1:checked ~ ul > li:nth-of-type(1) > label.opentop, 
/* bada */ .nav #val2:checked ~ ul > li:nth-of-type(2) > label.opentop, 
/* bada */ .nav #val3:checked ~ ul > li:nth-of-type(3) > label.opentop, 
/* bada */ .nav #val4:checked ~ ul > li:nth-of-type(4) > label.opentop, 
/* bada */ .nav #val5:checked ~ ul > li:nth-of-type(5) > label.opentop, 
/* bada */ .nav #val6:checked ~ ul > li:nth-of-type(6) > label.opentop, 
/* bada */ .nav #val7:checked ~ ul > li:nth-of-type(7) > label.opentop {background: #333333;}


/* bada */ .nav ul ul li {border:0; padding:0; text-align:left;}
/* bada */ .nav ul ul li:last-child {border:0;}
/* bada */ .nav ul ul li a {display:block; font:normal 18px/24px verdana, arial, sans-serif; padding:8px 12px 8px 16px; color:#ffffff !important; text-decoration:none;} /* lankarnas farg undermeny datormeny */
/* bada */ .nav ul ul li a {background:#555555 !important; border-top:1px solid #cccccc;} /* color:#fff farg undermeny mobil */
/* bada */ .nav ul ul li a:hover {background:#333333 !important; color:#0000ff !important;} /* mobilundermeny */


.nav ul > li:nth-of-type(1) > div, 
.nav ul > li:nth-of-type(2) > div, 
.nav ul > li:nth-of-type(3) > div, 
.nav ul > li:nth-of-type(4) > div, 
.nav ul > li:nth-of-type(5) > div, 
.nav ul > li:nth-of-type(6) > div, 
.nav ul > li:nth-of-type(7) > div {
transition:0.4s;
-webkit-transition:0.4s;
}


/* bada */ .nav #val1:checked ~ ul > li:nth-of-type(1) > div, 
/* bada */ .nav #val2:checked ~ ul > li:nth-of-type(2) > div, 
/* bada */ .nav #val3:checked ~ ul > li:nth-of-type(3) > div, 
/* bada */ .nav #val4:checked ~ ul > li:nth-of-type(4) > div, 
/* bada */ .nav #val5:checked ~ ul > li:nth-of-type(5) > div, 
/* bada */ .nav #val6:checked ~ ul > li:nth-of-type(6) > div, 
/* bada */ .nav #val7:checked ~ ul > li:nth-of-type(7) > div {box-shadow:none;
 transition:1.5s;
 -webkit-transition:1.5s;
}
}
