/* Own additions to W3.CSS - not to be used standalone  */

/* H 192° S 28% B 79% = #91bec9 Underline for menu
   H 192° S 45% B 88% = #7bcce0 Lighter turquoise (logo gradient)
   H 192° S 55% B 88% = #65c8e0 Light turquoise (background gradient)
   H 192° S 75% B 68% = #2b93ae Medium turquoise
   H 192° S 80% B 63% = #2087a1 Dark turquoise
   H 192° S 80% B 53% = #1b7287 Darker turquoise (background gradident)

   Erik L suggested hues 84°, 194°, 55°, 120°, 176°, 205°

   H  84° S 28% B 79% = #b3c991 Underline for menu
   H  84° S 39% B 88% = #bde089 Lighter green (logo gradient)
   H  84° S 49% B 78% = #a0c765 Light green (background gradient)
   H  84° S 59% B 64% = #7da343 Medium green
   H  84° S 65% B 60% = #719936 Dark green
   H  84° S 70% B 53% = #618729 Darker green (background graident)

   SmartDriving 145 degrees

   H 145° S 70% B 70% = #36b36a Underline for menu
   H 145° S 65% B 80% = #47cc70 Lighter green (logo gradient)
   H 145° S 80% B 75% = #26bf66 Light green (background gradient)
   H 145° S 93% B 64% = #0ba34b Medium green
   H 145° S 85% B 49% = #127c3e Dark green
   H 145° S 90% B 40% = #0a6630 Darker green (background graident)

 */   

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap');

/*
@import url(//db.onlinewebfonts.com/c/0b9856633d4311a19df074ea509d8390?family=Constantia);
*/

/* Different types of font formats:

   .eot        = IE9 Compatibility
   .eot?#iefix = IE6 - IE8
   .woff2      = Super modern browsers
   .woff       = Modern browsers
   .ttf        = Safari, Android, modern iOS
   .svg        = Legacy iOS
*/

@font-face {
    font-family: 'robotobold';
    src: url('inc/roboto-bold.eot');
    src: url('inc/roboto-bold.eot?#iefix') format('embedded-opentype'),
         url('inc/roboto-bold.woff2') format('woff2'),
         url('inc/roboto-bold.woff') format('woff'),
         url('inc/roboto-bold.ttf') format('truetype'),
         url('inc/roboto-bold.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'robotoregular';
    src: url('inc/roboto-regular.eot');
    src: url('inc/roboto-regular.eot?#iefix') format('embedded-opentype'),
         url('inc/roboto-regular.woff2') format('woff2'),
         url('inc/roboto-regular.woff') format('woff'),
         url('inc/roboto-regular.ttf') format('truetype'),
         url('inc/roboto-regular.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'montserratregular';
    src: url('inc/Montserrat-Regular.woff2') format('woff2'),
         url('inc/Montserrat-Regular.woff') format('woff'),
         url('inc/Montserrat-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bebas Neue';
    font-style: normal;
    font-weight: normal;

    src: url('inc/bebas-neue-v2-latin-regular.eot');
    src: url('inc/bebas-neue-v2-latin-regular.eot?#iefix') format('embedded-opentype'),
         url('inc/bebas-neue-v2-latin-regular.woff2') format('woff2'),
         url('inc/bebas-neue-v2-latin-regular.woff') format('woff'),
		     url('inc/bebas-neue-v2-latin-regular.ttf') format('truetype'),
         url('inc/bebas-neue-v2-latin-regular.svg#BebasNeue') format('svg');
}


/*
@font-face {font-family: "Constantia"; src: url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.eot"); src: url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.woff") format("woff"), url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/0b9856633d4311a19df074ea509d8390.svg#Constantia") format("svg"); } 
*/

.content-outer-c1 {
 background: #0ba34b; /* medium hue */
/*
 padding-top: 30px;
 padding-bottom: 100px;
*/
 height: 100px;
}

.content-outer-c2 {
 background: #127c3e; /* darker hue */
/*
 padding-top: 30px;
 padding-bottom: 100px;
*/
 height: 100px; 
}


/* used for the first page only? */
.content-outer-first {
 background-image: linear-gradient(#26bf66, #0a6630);

/*
 background: #1c5089;
 border-top: 4px solid #0ba34b;
*/
/* padding-top: 25px; */
/* padding-bottom: 15px; */
/* height: 195px; */ /* ?? */
}

.content-outer-main {
 height: auto;
 min-height: 40vw; /* 45vw 15vw */
}

.content-outer-first .Standard {
 color: #ffffff;
 text-shadow: 2px 2px #000000;
}


.content {
  width: 100%;
  max-width: 1200px; /* 1920px, 900px */
  height: auto;
	min-height: 100%;
	margin: 0px auto 0;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: min(61px,5vw); /* OBS! Adjust for responsible design! */
  padding-right: min(61px,5vw); /* 5vw, 90px */
  clear: both;  
	border: 1px dashed transparent;
}

.content#wider {
  max-width: 1920px;
}

.content#toppbild {
  max-width: 100% !important;
  min-height: 40vw; /* 45vw */
  display: flex;
  align-items: center;
  justify-content: center;
}

.content p:first-child, .content h1:first-child {
   margin-top: 0;
   padding-top: 10px;
}

.target::before {
  content: "";
  display: block;
  height: 160px; /* 99, 83 adjust for fixed header, was 190 */
  margin: -160px 0 0;
}

.allrights::before {
  content: "| ";
}

.blankbefore:before {
  content: "";
  display: block;
  height: 160px;
  margin: -160px 0 0;
}

.clr {
  clear: both;
}

.bold {
  font-weight: bold;
}

#footer {
  background: #0ba34b;
	color: #ffffff; /* #404040 */
  clear: both;
  margin-top: 0px; /* 20px */
  padding-bottom: 30px;
  padding-top: 10px;

/*
  font-family: robotoregular, Helvetica, Sans-Serif;
	font-size: 12px;
  width: 730px; 
  margin-left: 220px; 
  padding-left: 16px;
  padding-right: 16px;
  border-top: 1px solid #cccccc; 
  border: 1px solid #ff0000;
 */
}

#footer.printable {
  margin-left: 0px;
}

#wrapper {
  background: #ffffff;
/*   border: 1px solid #ffffff; */

		/* responsive design repeated below */
  max-width: 1200px;  /* 900px, 1170px */

  margin: 0px auto 0;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-top: 0;
  padding-left: min(61px, 5vw);
  padding-right: min(61px, 5vw);
  padding-bottom: 0;

	/*  padding: 0 5vw 0; */ /* before 0 14px 0; */
}

a:hover, .mid_table td a:hover {
	text-decoration: underline;
}	

.top_td, .top_tds, .top_td2, .top_tds2, .flik, .fliks {
	vertical-align: center;

  font-family: Bebas Neue, Arial, Sans Serif;
/*  font-family: montserratregular, Arial, Sans Serif; */
/*  font-family: robotoregular, Arial, sans-serif; */

	font-size: 20px; /* Montserrat: 14px; */
	background: transparent; 
	padding-top: 0px;

  /* Instead of setting width of the top_td span,
     set margin of the parent li */
  /* width: 80px; */
  /* min-width: 80px; */ 
  /* height: 55px;  */
	/* padding-bottom: 2px; */
  /* text-align: center; */
	/* background-color: #808080; */ /* #f28003; */

	text-transform: uppercase;
}

a:link .top_td:hover, a:visited .top_td:hover,
a:link .top_td2:hover, a:visited .top_td2:hover,
a:link .top_tds:hover, a:visited .top_tds:hover,
a:link .top_tds2:hover, a:visited .top_tds2:hover {
  color: #ffffff;
  text-decoration: none !important;
/*  border-bottom: 2px solid #36b36a; */
}


a.no:link, a.no:visited {
	color: #000000;
	text-decoration: none;
	font-weight: normal;
}

.top_td,
a:link .top_tds, a:visited .top_tds, a:link .top_td, a:visited .top_td,
a:link .top_tds2, a:visited .top_tds2, a:link .top_td2, a:visited .top_td2 {
	font-weight: 300; /* bold, 400 */
}

.top_td, a:link .top_td, a:visited .top_td,
.top_td2, a:link .top_td2, a:visited .top_td2 {
	color: #000000; /* #f28003; */
/*
  font-size: min(3.5vw, 18px);
  line-height: 22px;
*/
}

.top_tds, a:link .top_tds, a:visited .top_tds,
.top_tds2, a:link .top_tds2, a:visited .top_tds2,
.cygreen, a.cygreen {
  color: #000000;
  text-decoration: none;
/*
  font-size: min(3.5vw, 18px);
  line-height: 22px;
*/
  border-bottom: 2px solid #36b36a;
}

.navbar {
	/* height: 130px; */
  background: #ffffff !important;
}

.w3-button, .w3-bar-item {
  padding: 8px 6px !important;
}

div#navMenu div {
  background: #ffffff;
}

.menu-float .w3-button:hover {
/*  color: #ffffff !important; */
  background-color: #0ba34b !important;
  text-decoration: none !important;
}

.menu-float .w3-button:hover > span,
.menu-float .w3-button:hover div#dwmchoose span.top_td,
.menu-float ul.sprak:hover li a span {
 color: #ffffff !important;
}

.menu-float {
/*  float: right; */
}

.navmenu-container {
/*  position: relative;  */
  display: inline-block;
/*  margin-top: 20px; */


/*  margin-right: 120px;  */
/*  font-family: montserratregular, Arial, Sans Serif; */
}

.navmenu-dropdown {
  display: block; /* none */
	position: absolute; 
  visibility: hidden;
  opacity: 1; /* 0 */

/*	right: 0; */
  left: 1200px; /* will be changed by adjustTop() */

  margin-top: 30px;
/*	min-width: 160px; */

  background: #ffffff;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.navmenu-dropdown div a {
  display: block;
}

.navmenu-container:hover > .navmenu-dropdown,
.navmenu-container:focus-within > .navmenu-dropdown,
.navmenu-dropdown:hover {
  visibility: visible;
  opacity: 1;
  display: block;
}



.langmenu-container {
/*  position: relative;  */
  display: inline-block; 
  float: right;
  margin-top: 20px;
  margin-right: 120px; 
  font-family: montserratregular, Arial, Sans Serif;
}

.langmenu-dropdown {
  visibility: hidden;
  opacity: 0;
  display: none;

	position: absolute;

/*
	right: 0;
  margin-right: 10px;
*/

  background: #ffffff;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Style from Smdr */

/* language selector */

/* Was width 143px */

#dwm-sprak, #abictmenu {
  /* width: 120px; */ /* was auto, 143px */

/*
  font-family: montserratregular, Arial, Sans Serif;
  font-size: min(3.5vw, 18px);
  height: 27px; 
*/
/*
  padding-left: 10px;
  padding-right: 10px;
  margin-top: 20px;
*/
}

#dwm-sprak.dwsel {
/*  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
}

#dwm-sprak.nosel:hover {
/*  background: #0ba34b; */
  color: #ffffff !important;
}


#dwm-sprak a { text-decoration: none; }

/*
#dwmmenu, #dwmmenuutb { width: auto; height: 27px; font-size: 18px; }
*/

#dwmmenuutb { height: 32px; }

#dwmchoose, #dwmutb { 
/*
		line-height: 27px;
    height: 27px; 
*/
    vertical-align: middle; width: auto;
		background: url('/pics/country-menu4.png') right -4px no-repeat; 
		cursor: pointer; 
 /*   margin-bottom: 20px; */
 /*  padding-left: 10px; */
 /* padding-right: 30px; */
}

.menu-float .w3-button:hover #dwmchoose {
		background-image: url('/pics/country-menu4-white.png');
}

#dwmutb {
  line-height: 32px; height: 32px;
  background: url('/pics/utb-menu.png') top left no-repeat;
}

#dwmchoose span, #dwmutb span { 
		padding-right: 35px; color: Black; display: block; text-align: left;
/*		line-height: 27px; */
}

#dwm-sprak.nosel #dwmchoose:hover, #dwm-sprak.nosel #dwmchoose span:hover {
  color: #ffffff; 
}

#dwmutb span {
  padding-left: 27px;
  color: #ffffff; font-weight: bold;
}

.ddwrapper {
  padding: 0px 6px 0 6px;
/*  width: 100%; */
  position: absolute;
  margin-left: -6px;
  display: none; 
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
   background: #ffffff;

/*  z-index: 100; */
 }

.ddwrapper:hover {
  background: #0ba34b;
}

.sprak { 
	padding: 0px; margin: 0; list-style: none;
/*  margin-top: 20px; */
  width: 100%; /* 110px 135px */
/*	border-bottom: 1px solid #d5e0e6; border-left: 1px solid #d5e0e6;  */
/*  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
}

.sprak a { 
		font-weight: normal; text-decoration: none; height: 20px; padding: 8px 0px; display: block; 
}

/*
.sprak a:link, .sprak a:visited, .sprak a:active, .sprak a:hover { 
  color: #0000ff !important; 
}
*/

.sprak span { float: left; line-height: 20px; vertical-align: middle; }

.sprak li { 
    /* background-color: #ffffff; */ /* #f2ece5 */
    width: inherit !important; /* 135px */
    vertical-align: middle;
/*		border-top: 1px solid #fefefe;  */
    height: 27px;
}



.sprak li a { height: 27px; }

.sprak li a:hover {
 /* background-color: #0ba34b !important; */
 /* color: #ffff00 !important;  */
}

.sprak .flag, .sprak .utb { 
		background-image: url('/pics/country-menu2.png');
		line-height: 20px; float: left; margin: 0px 16px 0px 10px; 
		display: block; width: 19px; height: 19px; 
}

.sprak .utb {
    background: url('/pics/utb-menu.png');
}

.sprak .flag-us { background-position: -0px -95px; }
.sprak .flag-nl { background-position: -0px -37px; }
.sprak .flag-ru { background-position: -24px -37px; }
.sprak .flag-world { background-position: -0px -66px; }
.sprak .flag-fi { background-position: -0px -124px; }
.sprak .flag-tr { background-position: -0px -153px; }
.sprak .flag-uk { background-position: -0px -182px; }
.sprak .flag-sv { background-position: -0px -211px; }
.sprak .flag-pl { background-position: -0px -240px; }
.sprak .flag-phi { background-position: -0px -269px; }
.sprak .flag-nor { background-position: -0px -298px; }
.sprak .flag-nz { background-position: -0px -327px; }
.sprak .flag-de { background-position: -0px -356px; }
.sprak .flag-aus { background-position: -0px -385px; }

.sprak .utb-pb { background-position: -0px -37px; }
.sprak .utb-lb { background-position: -0px -66px; }
.sprak .utb-buss { background-position: -0px -95px; }
.sprak .utb-tb { background-position: -0px -124px; }

.mlr80 {
/*
  margin-left: 125px !important; 
  margin-right: 125px !important;
*/
}

.mtb20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

#topnavbg {
/*  background: url('/icon/menubar-20.gif') bottom left repeat-x; */
}

ul#topnavl, #topnavr ul {
/*  background: #000000; */
	margin: 0;
  margin-top: 0px;
	padding: 0;
	list-style: none;	
  float: right;
/*  margin-top: 72px; */
}

ul#topnavl.mlr80 {
  margin-right: 120px !important;
}


#topnavl li, #topnavr li {
	display: inline;
	padding: 0;
  /* height: 57px;  */
	float: left;
	margin-left: 10px;
  margin-right: 27px;
}

#topnavl li.rsp, #topnavr li.rsp {
  border-right: 2px solid #ffffff;
}

#topnavl span, #topnavr span {
	display: block;
	margin:	0;
}

#topnavl span a, #topnavr span a {
	float: none;
}

.Standard {
  font-family: montserratregular, Arial, Sans Serif !important;
/*  font-family: robotoregular, Arial, Helvetica, Sans-Serif; */
/*  font-family: Arial, sans-serif; */
  font-size: min(3.75vw, 22px) !important;
}

.Ingress {
  font-family: robotoregular, Arial, Helvetica, Sans-Serif;
  font-size: min(4.5vw, 28px);
/*	font-weight: bold; */
}

.Rubrik {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Arial, Helvetica, Sans-Serif; */
  font-size: min(4.5vw, 28px);
  font-weight: bold;
/*
  color: #ffffff;
  text-shadow: 2px 2px #000000;
*/
}

.insideshaded {
  text-align: center;
/*  background: #cccccc; */
/*		background: rgba(255,255,255, 0.4); */
}


.Slogan {
  display: inline;
  margin-left: 0px; 

  font-family: montserratregular, Arial, Sans Serif; 

  font-weight: bold;

  font-size: min(4vw, 100px);  /* 44px, 24px, 36px */
  line-height: min(9vw, 144px); /* 58px,36px, 54px */
  color: #ffffff;

/*  text-shadow: 4px 4px rgba(0,0,0,0.4);*/

	background: rgba(10, 102, 48, 0.6); /* 0.4 */

  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;

	/* Set alpha channel to 0 to extend border without colour */

  border-top: 0.5vw solid rgba(0,0,0, 0);
  border-left: 1.5vw solid rgba(0,0,0, 0);
  border-right: 1.5vw solid rgba(0,0,0, 0);
  border-bottom: 0.5vw solid rgba(0,0,0, 0);

	/* width: 90%; */
}

.Sloganbigger {
  display: inline;
  margin-left: 0px; 

  font-family: montserratregular, Arial, Sans Serif; 
  font-weight: bold;

  font-size: min(7vw, 175px);  /* 44px, 24px, 36px */
  line-height: min(11vw, 275px); /* 58px,36px, 54px */
  color: #ffffff;

/*  text-shadow: 4px 4px rgba(0,0,0,0.4);*/

	background: rgba(0,0,0, 0.4);

  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;

  border-top: 1vw solid rgba(0,0,0, 0);
  border-left: 2vw solid rgba(0,0,0, 0);
  border-right: 2vw solid rgba(0,0,0, 0);
  border-bottom: 1vw solid rgba(0,0,0, 0);

	/* width: 90%; */
}


.Topprubrik {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: 32px;
  font-weight: bold;
}

.FlikRubrik {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: 18px;
  font-weight: bold;
  color: #ffffff;
  background: #333333;
  padding-left: 10px;
}

.BelowMenu {
  background: #0a6630;
  margin-top: 130px; 
  padding-top: 10px;
  padding-bottom: 10px;
}

.BelowMenu #wrapper {
/*
  margin-left: 10px;
  margin-right: 80px;
*/
}

.shadedbox {
		width: 100%;
		padding-top: 2vw;
		padding-bottom: 2vw;
		padding-left: 20px;
		padding-right: 20px;
		/* padding: 2vw 2vw 2vw 2vw; */
		background: rgba(0,0,0, 0.4);
		color: #ffffff;

/* Additions */
		min-height: 27vw;  /* 33 - 2 - 2 */
		display: flex;
		align-items: center; /* works because we have div insideshaded later */
}

/*
.formtd {
  padding-left: 0px;
 padding-right: 10px;
 padding-top: 3px;
 padding-bottom: 3px;
 white-space: nowrap; // Doesn't work with small screens...
}
*/

.formtd, .formtdu, .formtdl {
/* padding-left: 10px; */
 padding-right: 10px;
 white-space: nowrap;
}

.formtd, .formtdu {
 padding-top: 5px;
}

.formtd, .formtdl {
  padding-top: 3px;
  padding-bottom: 5px;
}


.langflags {
		float: right;
		margin-top: 50px;
}

.top_tds {
		/* background: transparent url('/icon/box100-blagra.png') no-repeat; */
}

.top_td:hover, .top_tds:hover {
		/* background: transparent url('/icon/box100-bla.png') no-repeat; */
	/*	background-color: #6abe45; */ /* #f28003 */
}

.top_td2, .top_tds2 {
		/* background: transparent url('/icon/box200-wht.png') no-repeat; */
	width: 200px;
}

.top_td2:hover, .top_td2:hover {
 		/* background: transparent url('/icon/box200-bla.png') no-repeat; */
}

.w3-padding-0 {padding:0px 0px!important}

.w3-container,.w3-panel {
  padding: 0;
}

.w3-topnav div.top_td, .w3-topnav div.top_tds {
  display: inline;
  height: 32px; 
  padding-left: 12px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.w3-topnav div.top_td a, .w3-topnav div.top_tds a {
  padding-right: 12px;
  padding-top: 8px;
	padding-bottom: 8px;
	width: 100%;
  line-height: 32px;
}

.w3-topnav div.top_td {
  background: url('/icon/round-gl32.png') bottom left no-repeat;
}

.w3-topnav div.top_td a {
  background: url('/icon/round-gr32.png') bottom right no-repeat; 
}

.w3-topnav div.top_tds {
  background: url('/icon/round-l32.png') bottom left no-repeat;
}

.w3-topnav div.top_tds a {
  color: #ffffff;
  background: url('/icon/round-r32.png') bottom right no-repeat; 
}

#inmenu {
  display: none;
}

#outmenu {
  display: block;
}

#ffield label {
 width: 100px;
 display: inline-block;
}

.custom-messages-wrapper {
	Z-INDEX: 0; POSITION: absolute; WIDTH: 100% !important; TOP: 260px
}
.custom-messages, .brickor {
	Z-INDEX: 0; POSITION: relative; padding: 0;
  MARGIN: 0px auto; 
  OVERFLOW: hidden;

/* Works on modern browsers, not on MSIE 9/10 */
  display: flex;
  align-items: center;
  height: auto; /* 200px;  */

/*  max-width: 1000px;  */
/*  border-bottom: 1px solid #cccccc; */
}
.custom-messages-item, .brickor-item {

	list-style:none;

	border: 0; 
  padding: 0;
  BACKGROUND: transparent; 
  margin-right: 0px;
  margin-left: 0px;
 text-align: center; 
  min-width: 200px;
  FLOAT: left;
  OVERFLOW: hidden; 

 /*  WIDTH: 33%; */ /* 200px */
/*  HEIGHT: 120px; */
/*
  margin-top: 40px;
  margin-bottom: 40px;
*/

}

.custom-messages-item:first-child {
 	/* margin-left: 0px; */
  /* text-align: left; */
}

.custom-messages-item:last-child {
 	/* margin-left: 0px; */
  /* text-align: right; */
}

.custom-messages-item img {
/*  border: 1px solid #666666; */
/*  height: 20vh;*/
/*  max-width: 300px; */
/*  max-height: 114px; */
}

.custom-messages-title {
	FONT-SIZE: 1.8em
}
.custom-messages-desc {
	MARGIN: -5px 0px 5px; COLOR: #666; FONT-SIZE: 1.2em
}
.custom-message-cta {
	FONT-SIZE: 1.2em
}

.i285 {
/*  width: 279px; */
  width: 100%;
/*  max-width: 700px; */
  padding: 10px;
  box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.6);

	/*
  border-left: 1px solid #dfdfca;
  border-right: 1px solid #dfdfca;
  border-bottom: 1px solid #dfdfca;
	*/

  text-align: left;
  margin-bottom: 20px;

	/*  background: #f3f3ea; */
}

.i285 input[type=text], .i285 select {
  border-radius: 10px;
  padding: 5px;
}

.tops {
  border-top: 1px solid #dfdfca;
  padding-top: 3px;
}

.pdf {
    padding-right: 40px;
    height: 32px;
    display: block;
    background: url('/icon/icon_pdf.gif') no-repeat top right;
}

.pdfspan {
    padding-left: 40px;
    height: 32px;
    display: block;
    background: url('/icon/icon_pdf.gif') no-repeat top left;
}

.itw {
	width: 100%; /* 99% */
}

 #textwrap {
 white-space: nowrap;
}

div.videoouter {
  display: flex;
  justify-content: center;
}

div.selectvideo {
  clear: both;
  height: 90px;
}

div.selectvideo img {
  float: left;
  margin-right: 10px;
}

div.selectvideo p {
  margin-top: 0px;
}

.botmenu {
	float: left;
  width: 180px;
  /* margin-right: 10px; */
  font-weight: bold;
	text-align: left;
	list-style:none;
}

.botmenu .botsub {
  /* text-align: left; */
	margin-top: 10px;
  font-weight: normal;
}

.h500 #hero, .h500 ul#rotating-features, .h500 ul#rotating-features li,
.h500 ul#rotating-features .panel {
  height: 500px;
}

.bigcounter {
  width: 23%;
  float: left;
/*  color: #ffffff; */
  font-size: min(2.5vw, 22px);
}

.bigcounter span.counternumber {
  font-size: min(5vw, 36px);
  font-weight: bold;
}

/* Special CSS for brands table */

.brand {
  border-bottom: 1px solid #e7e7e7;
  vertical-align: middle;
  width: 200px;
  height: 200px;
  padding-left: 30px;
}

td.td1 {
  padding-left: 0px;
}

.brickbut {
		border-radius: 8px;
    border: 0;
		padding: 7px 10px 7px 7px;
    margin: 3px;
		font-size: min(3.25vw, 14px) !important;
		font-weight: bold;
		color: #ffffff;
    cursor: pointer;
}

.brickbut#enbrick {
		font-size: min(3vw, 12px) !important;
}

.butpb {
  background: linear-gradient(160deg,#e3c23d,#d98727);
  box-shadow: -2px -2px 2px 0px rgba(0,0,0,0.35) inset;
}

.butlb {
  background: linear-gradient(160deg,#4ec0ed,#2983a8);
  box-shadow: -2px -2px 2px 0px rgba(0,0,0,0.35) inset;
}

.butbu {
  background: linear-gradient(160deg,#fc7988,#be3242);
  box-shadow: -2px -2px 2px 0px rgba(0,0,0,0.35) inset;
}

.buttb {
  background: linear-gradient(160deg,#fc7ef6,#bd32b6);
  box-shadow: -2px -2px 2px 0px rgba(0,0,0,0.35) inset;
}


.blabut {
/* 	background: transparent url('/pics/box75-grey.png') no-repeat; */
/*  border: 2px solid #0a6630; */
/*  border-radius: 20px; */

  border: 0;
  background: #0ba34b; /* #0a6630 */
  color: #ffffff; /* #000000 */
  width: auto; /* 135px, 75px */
  height: auto; /* 37px; */
  padding: 15px 22px;
  /* padding-top: 0; */
	text-align: center;
	vertical-align: center;
  font-family: montserratregular, Arial, Sans Serif;
  font-weight: normal;
  font-size: min(3.5vw, 18px);
  cursor: pointer;
}

.kontaktform {
 width: 100%;
/* max-width: 1200px; */
 border: none;
 padding: 5%;
/* margin-left: calc((33% - 300px)/2);*/
}

/* .kontaktform p, */
 .pb27 {
  padding-bottom: 27px;
}

.kontaktform input[type=text], .kontaktform textarea {
  width: 100%;
  font-size: 14px;
  line-height: 24px;
  padding: 16px;
  color: #555555;
  background: #faf8f5;  /* #f2ece5, rgba(0,0,0, 0.035); */
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #cccccc; /* #e0e0e0 */
  transition: border-color 0.2s ease;
  outline: none;
/*  font-family: Constantia, Georgia, serif; */
  font-family: montserratregular, Arial, Sans Serif;
}

.kontaktform input[type=text]:focus, .kontaktform textarea:focus {
  border-bottom: 2px solid #0ba34b;
}

.mw300 {
  width: 300px;
}

.mh114 {
  height: 114px;
}

/* Used inside width limited .content */

.content-twocol {
  flex: 50%;
}

.content-twocol1 {
  flex: 48%;
  margin-right: 2%;
}

.content-twocol2 {
  flex: 48%;
  margin-left: 2%;
}


/* Used with display: flex; flex-wrap: wrap */
.twocol {
  flex: 50%;
}

.threecol1 {
  flex: 70%;
}

.threecol2 {
  flex: 30%;
}

.tc1-content {
  width: 100%; height: 100%; /* test */
  max-width: 600px;
  margin: 0px auto 0;

  padding-top: 5%;
  padding-bottom: 5%;
  padding-left: min(61px,5vw);
  padding-right: min(61px,5vw);

	/* padding: 5% 5vw 5% 5vw; */
  float: right;
}

.wtsrow {
  display: flex;
  flex-wrap: wrap;
/*
  height: 50vw;
  padding: 0;
  margin-bottom: 0;
*/
}

.wtsside {
  flex: 30%;
  padding: 0px;
}

.wtsmain {
  flex: 70%;
  padding: 0px;
}

.wtsbox {
  display: flex;
  height: 33.33%;
  align-items: center;
}

/* Layout with three boxes */

.wtshbox, .wts3box {
  display: flex;
  width: 32%;
  margin-left: 1%;
  margin-right: 1%;
  margin-top: 0;
  align-items: flex-start;
/*  background: #ff0000; */
}

/* Complementary 2/3 box */
.wts23box {
  display: flex;
  width: 66%;
  margin-left: 0%;
  margin-right: 1%;
  margin-top: 0;
  align-items: flex-start;
}

/* Layout with four boxes */

.wts4box {
  display: flex;
	align-items: flex-start;
  width: 24%;
  margin-left: 1%;
  margin-right: 1%
  margin-top: 0;
}

/* Layout with two boxes */

.wts2box {
  display: flex;
	align-items: flex-start;
  width: 49%;
  margin-left: 0%;
  margin-right: 0%
  margin-top: 0;
}

.wtsbox > div {
  margin-left: 1%;
  height: 90%;
  width: 20%;
  color: #ffffff;
}

.wtshbox > div, .wts3box > div, .wts4box > div,
.wts2box > div, .wts23box > div {
  width: 100%;
  color: #ffffff;
}

/*
.wtsbox > div p {
  margin: 5%;
  padding: 0%;
  font-family: Constantia, Georgia, serif;
  font-size: 2vw;
}
*/

.wtsbox > div p, .wtshbox > div p, .wts3box > div p, 
.wts4box > div p, .wts2box > div p, .wts23box > div p {
  margin: 5%; /* 10% */
  padding: 0%;
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: min(4.5vw, 28px);
  height: auto; /* 11vw; */ /* hack */
  /* min-height: 12vw; */ /* hack */
}

.wtshbox > div p.smaller, .wts3box > div p.smaller,
.wts4box > div p.smaller, .wts2box > div p.smaller,
.wts23box > div p.smaller, .smaller {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: min(3.75vw, 22px);
  height: auto;
}

.wtssubslogan {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: min(2.5vw, 28px);
	font-weight: bold;
  color: #ffffff;
}

.wtsboxhead {
  font-family: montserratregular, Arial, Sans Serif;
/*  font-family: robotoregular, Helvetica, Sans-Serif; */
  font-size: min(4.5vw, 28px);
	font-weight: bold;
  color: #ffffff;
}

.wtsboxcenter {
  text-align: center;
}

.wtsimg {
  text-align: center;
}

.wtsroundgreen {
  border-radius: 50px;
  border: none;
  background: transparent;
}

.wtsroundgreen:hover {
  background: rgba(102,193,43, 0.5);
}

#topimg {
/*  background-image: url('/pics/pixabay-4278629-2400x1600.jpg'); */
/*  background-image: url('/pics/unsplash-UbGYPMbMYP8-2400x1600.jpg'); */
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: left 35% !important;
}

#indexbg {
 z-index: -1;
}

#indexbg div {
  width: 100%;
  height: 100%;
  position: absolute;  top: 0px;  left: 0px; 
  color: transparent;
  opacity: 0;
  background-size: 100%;
  background-positon: left top !important;
  background-repeat: no-repeat;
  z-index: -1;
  animation: indexmove 18s linear infinite 0s; 
}

#indexbg div:nth-child(1) {
  background-image: url('/pics/valkommen-pb-2000x1092.jpg');
  animation-delay: 0s;
}

#indexbg div:nth-child(2) {
  background-image: url('/pics/valkommen-lb-2000x1092.jpg');
  animation-delay: 6s;
}

#indexbg div:nth-child(3) {
  background-image: url('/pics/valkommen-bu-2000x1092.jpg');
  animation-delay: 12s;
}

/*
#indexbg div:nth-child(4) {
  background-image: url('/pics/valkommen-tb-2000x1092.jpg');
  animation-delay: 18s;
}
*/

/* For n images, use the following formulas:

   a = presentation time for one image (e.g. 5.5 seconds)
   b = duration for cross fading (e.g. 1 second)
   t = total animation duration, (a+b)*n

   Animation delay is t/n == a+b.

   Percentages:
   1. 0%
   2. a/t*100%
   3. (a+b)/t*100% == 1/n*100%
   4. 100%-(b/t*100%)
   5. 100%

   0, 27, 33, 94, 100

   Previously used:

   0% { opacity: 0; animation-timing-function: linear; }
   8% { opacity: 1; animation-timing-function: linear; }
   17% { opacity: 1; }
   25% { opacity: 0; animation-timing-function: linear; }
   100% { opacity: 0; }
*/

@keyframes indexmove {
  0% { opacity: 1; animation-timing-function: linear; }
  27% { opacity: 1 }
  33% { opacity: 0; }
  94% { opacity: 0; }
  100% { opacity: 1; }
}

.hamburger-icon {
    margin: 0;
    display: inline-block;
/*
    padding: 19px 16px;
    position: absolute;
    top: 0;
    left: 0;
*/
}
.hamburger-icon span {
    width: 20px;
    background-color: #000;
    height: 3px;
    display: block;
    margin-bottom: 3px;
}
.hamburger-icon span:last-child {
    margin-bottom:0px;
}

.projektbricka {
  width: 100%;
  height: 0px;
  padding-bottom: 40%;
  background-repeat: no-repeat;
  background-size: cover;
}

.projektbricka  div {
  float: right;
  margin-top: 25%;
  margin-right: 5%;
  padding: 5px 10px;
  border-radius: 25px;
  color: #ffffff;
  background: #0ba34b;
}

.dropbtn {
  background-color: #4CAF50;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.dropdown {
  position: relative; 
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  right: 0;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: #3e8e41;
}

.row {
  clear: both;
  display: table-row;
}

.col {
  display: table-cell;
  padding-top: 3px;

  /* float: left; */
}

.k1 {
/*  width: 400px; */
  padding-right: 20px;
}

.k2 {
 /* text-align: right; */
 /* float: left; */
 /* width: 100%;  */
}

.kpdf {
  padding-left: 10px;
  height: 40px;
}

ul.checklist {
  list-style: none;
  padding: 0;
}

ul.checklist li::before {
  content: "\2713";
  padding-right: 8px;
}

.grid-3col {
		/* Used for starting page etc to create a grid that rearranges
			 on smaller screens */

		display: grid;
		/* width: 100%; */
		grid-template-columns: 32% 32% 32%; /* auto auto auto */
		grid-column-gap: 2%; /* may adjust */
		padding: 0%; /* may adjust */
}


.grid-2col {
		/* Used for savings, ordering form where some columns collapse
			 on smaller screens */

		display: grid;
		grid-template-columns: auto auto auto;
		/* max-width: 600px; */
}

	.g2ci {
			/*
    width: 1%;
		white-space: nowrap;
		*/
}

   #gridbesp .g2c1::after, #gridbesp .g2c4::after,
	 #gridbesp .g2c7::after, #gridbesp .g2c10::after {
       content: " -\00a0";
   }

	 .g3i1 { border-right: 1px solid #cccccc; padding-right: 5%; }
	 .g3i2 { }
	 .g3i3 { border-left: 1px solid #cccccc; padding-left: 5%; }
	 .g3r3 { padding-left: 5%; }

@media screen and (max-width:800px) {
  /* max-width:500px, 629px, 790px */
 
  .grid-3col {
			/* We want to unfold multiple columns into a single one */
     grid-template-columns: auto;
		grid-column-gap: 0; /* may adjust */
   }

	.grid-2col {
			/* This one should collapse from 3 into 2 columns */
			grid-template-columns: auto auto;
}


	/* This is hard coded for 3 columns x 2 rows */
   .g3c1 { grid-row: 1 / 2; }
   .g3c2 { grid-row: 3 / 4; }
   .g3c3 { grid-row: 5 / 6; }
   .g3c4 { grid-row: 2 / 3; }
   .g3c5 { grid-row: 4 / 5; }
   .g3c6 { grid-row: 6 / 7; }

	 .g2c1 { grid-area:   1 / 1 /  2 / 2; }
	 .g2c2 { grid-area:   2 / 1 /  3 / 2; }
	 .g2c3 { grid-area:   1 / 2 /  3 / 3; }
	 .g2c4 { grid-area:   3 / 1 /  4 / 2; }
	 .g2c5 { grid-area:   4 / 1 /  5 / 2; }
	 .g2c6 { grid-area:   3 / 2 /  5 / 3; }
	 .g2c7 { grid-area:   5 / 1 /  6 / 2; }
	 .g2c8 { grid-area:   6 / 1 /  7 / 2; }
	 .g2c9 { grid-area:   5 / 2 /  7 / 3; }
	 .g2c10 { grid-area:  7 / 1 /  8 / 2; }
	 .g2c11 { grid-area:  8 / 1 /  9 / 2; }
	 .g2c12 { grid-area:  7 / 2 /  9 / 3; }

	 .g2c13 { grid-area:  9 / 1 / 10 / 2; }
	 .g2c14 { grid-area: 10 / 1 / 11 / 2; }
	 .g2c15 { grid-area:  9 / 2 / 11 / 3; }
	 .g2c16 { grid-area: 11 / 1 / 12 / 2; }
	 .g2c17 { grid-area: 12 / 1 / 13 / 2; }
	 .g2c18 { grid-area: 11 / 2 / 13 / 3; }
	 .g2c19 { grid-area: 13 / 1 / 14 / 2; }
	 .g2c20 { grid-area: 14 / 1 / 15 / 2; }
	 .g2c21 { grid-area: 13 / 2 / 15 / 3; }
	 .g2c22 { grid-area: 15 / 1 / 16 / 2; }
	 .g2c23 { grid-area: 16 / 1 / 17 / 2; }
	 .g2c24 { grid-area: 15 / 2 / 17 / 3; }

   #gridbesp .g2c1::after, #gridbesp .g2c4::after,
	 #gridbesp .g2c7::after, #gridbesp .g2c10::after {
       content: "";
   }

	 #gridbesp .g2c2::before, #gridbesp .g2c5::before,
   #gridbesp .g2c8::before, #gridbesp .g2c11::before {
			 content: "- ";
   }

	 .g3i1, .g3i3 { border: none; padding: 0; }
	 .g3r3 { padding: 0; }

  .content-outer-main, .content#toppbild {
     min-height: 64vw; /* 72vw make it bigger on mobile */
   }

  #wrapper {
    /* max-width: 570px; */
    margin: 0px auto 0;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0 10px 0;
  }

  .w3-topnav div.top_td, .w3-topnav div.top_tds {
    display: block; padding-top: 0px; padding-bottom: 0px;
  }
  .w3-topnav div.top_td a, .w3-topnav div.top_tds a {
    padding-top: 0px; padding-bottom: 0px;
  }

  #inmenu {
    display: block;
  }

  #inmenu div.top_td,
  #inmenu div.top_tds {
		margin-left: 20px;
  }

  #outmenu {
    display: none;
  }

	#ffield input, #ffield select {
    display: block;
  }

  #ffield select {
		font-size: 13px; /* test! */
  }

.menu-float {
  float: none;
}

/* Everything about positioning of the navmenu is done in JavaScript */

  .navmenu-container {
/*    float: left;
      margin-top: 120px;
      clear: both;
      background: #ffffcc;
      margin-right: 0px;
    position: relative;
    display: inline-block;
	  right: 0;
 */
  }

  .navmenu-dropdown {
/*     right: 0; 
       margin-right: 10px;  */
  }

	.langflags {
			float: right;
			margin-top: 0px;
      margin-bottom: 10px;
	}

   .Slogan {
  margin-left: 0px;
  width: 100%;
/*
  font-size: 4vw;
  line-height: 10vw;
*/
  }


  .BelowMenu {
    margin-top: 168px; 
   }

  .BelowMenu #wrapper {
    margin-left: 10px;
    margin-right: 10px;
  }

  .content {
     width: auto;
     margin-left: 20px;
		 margin-right: 20px;
   }


.navbar {
	height: auto !important;
  text-align: left !important;
}

.mlr80 {
  margin-left: 10px !important; 
  margin-right: 10px !important;
}

ul#topnavl {
  margin-top: 10px;
  float: none;
}

ul#topnavl.mlr80 {
  margin-left: 0px !important; 
  margin-right: 0px !important;
}

#topnavl li {
  margin: 0;
  height: 24px;
  clear: both;
/*  width: 100%; */
  margin-left: 0;
  margin-right: 0;
}

#rotating-features .panel {
  background-size: contain !important;
}

#rotating-features .panel#panpb {
  background-image: url('/pics/valkommen-bg.jpg') !important;
}

#rotating-features .panel#pantb {
  background-image: url('/pics/valkommen-tb.jpg') !important;
}

#rotating-features .panel#panlb {
  background-image: url('/pics/valkommen-lb.jpg') !important;
}

#rotating-features .panel#panbu {
  background-image: url('/pics/valkommen-bu.jpg') !important;
}

.custom-messages, .brickor {
  display: block;
  WIDTH: 100%; /* 200px */
  height: auto;
  border: 0;
}

.custom-messages-item, .brickor-item {
  clear: both;
  margin: 0;
/*  MARGIN: 20px 0px 30px 0px;  */
}

.custom-messages-item:first-child, .brickor-item:first-child {
 	MARGIN: 0px 0px 10px 0px;
}

#hero {
  min-width: auto;
/*  min-width: 100%; */
/*   min-width: 200px; */
  height: 73px;
}

#hero .panel-content {
  min-width: auto;
  width: 100%;
}

#textwrap {
 white-space: normal;
}

.pdf {
    padding-right: 0px;
    height: 62px; /* 32 */
    display: block;
    background: url('/icon/icon_pdf.gif') no-repeat bottom right;
}

.botmenu {
  margin-top: 20px;
}

.kontaktform {
 width: 100%;
 margin-left: 0;
}

div.videoouter {
  display: block;
  justify-content: none;
}


.mw300 {
  max-width: 200px;
}

.mh114 {
  max-height: 114px;
}

.allrights::before {
  content: "";
  display: block;
}

.twocol, .threecol1, .threecol2 {
  display: block;
  min-height: 70vw; /* 100vw */
  flex: 100%;
}

.content-twocol, .content-twocol1, .content-twocol2 {
  display: block;
  flex: 100%;
  margin-top: 20px;
}

.tc1-content {
  padding: 5%;
  float: none;
}

.wts3box, .wts4box, .wts2box, .wts23box {
  display: block;
	width: 100%;
  margin-bottom: 20px;
}

.wtsimg {
  width: 100%;
}

/*
.wtsrow {
  height: 70vw;
}
*/

.projektbricka {
/*  top: -60px; */
}

.projektbricka  div {
/*  margin-right: 20px; */
}


.row {
  display: block;
}

.k1 {
  padding-right: 0px; 
}

.k2 {
 display: block;
/* display: table-row; */
/* width: 100%; */
}

}