textarea.box-item-textarea
{
	font-family: Lato; 
	width: 100%; 
	border-style: solid; 
	border-width: 1px; 
	border-color: #bbbbbb; 
	padding-left: 10px; 
	padding-right: 10px; 
	padding-top: 5px; 
	padding-bottom: 5px; 
	height: 200px !IMPORTANT	
}
input[type=number] {
  -moz-appearance: textfield;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.input[type=text]
{
	margin-top: 10px;
	border-radius: 4px !important;
	border-style: solid; 
	border-width: 1px; 
	border-color: #bbbbbb; 
	font-family: Roboto; 
	//font-size: 12px; 
	//font-size: 2vw;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding-left: 10px !IMPORTANT;
	box-sizing: border-box;	
}
.inputforms {
	margin-top: 10px;
	border-radius: 4px !important;
	border-style: solid; 
	border-width: 1px; 
	border-color: #bbbbbb; 
	font-family: Roboto; 
	//font-size: 12px; 
	//font-size: 2vw;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	
	box-sizing: border-box;

}
.main-container
{
	display: grid;
	font-family: Lato;
	color: black;
	width: 100%;
	background-color: #fff;
	padding-top: 10px;
}

.box-multiple-item
{
  display: flex;
  justify-content: center;
  align-items: center;
}

.box-multiple-container
{
	margin: auto;
	display: flex;
}

.box-item 
{
	padding-top: 20px; 
	padding-bottom: 20px; 
	padding-left: 25px; 
	padding-right: 25px; 
	
	background-color: #DFDFDF; 
	border-radius: 15px; 
	color: black; 
	margin: 20px; 
	font-family: Lato;
	
}



@media screen and (min-width: 1001px) 
{
  div.box-item-title, div.nav-button-item-content, textarea.box-item-textarea, input[type=button] {
    font-size: 1em !IMPORTANT;
  }
 	div.box-spacing {
  	padding-top: 10px;
  }
	input::file-selector-button {
		background-image: url( 'img/text-file-white-padding.png' );
		background-position-x: left;
		background-repeat: no-repeat;
		background-position-y: center;
		background-size: 50px;
		display: grid;
		height: 60px; 
		width: 150px; 
		color: white !IMPORTANT; 
		font-family: Roboto; 
	  font-size: 16px; 		
	  cursor: pointer; 
		border: 0 none; 
		background-color: #009BDA; 
		border-radius: 5px;
		//img/text-file-white.png
	}    
 input.navi-button {
	  text-align: center; 
	  color: white; 
	  font-family: Roboto; 
	  font-size: 12px; 
	  cursor: pointer; 
	  border: 0 none; 
	  background-color: #009BDA; 
	  border-radius: 5px; 
	  height: 60px; 
	  width: 150px;
	}  
 input.navi-button-off {
	  text-align: center; 
	  color: white; 
	  font-family: Roboto; 
	  font-size: 12px; 
	  cursor: pointer; 
	  border: 0 none; 
	  background-color: #cfcfcf; 
	  border-radius: 5px; 
	  height: 60px; 
	  width: 150px;
	}  

  input.usercode {
  	text-align: center;
  	width: 40px;
  	height: 40px; 
  	font-size: 3em;
  }  
  div.nav-button-item-image-repair {
  	height: 50px; 
  	font-size: 1em;
		padding-top: 25px; 
		padding-bottom: 15px;	  	
  }
  input.inputforms {
    font-size: 1em;
    height: 40px;
  }
}



@media screen and (max-width: 1000px) 
{
	  
  div.box-item-title, div.nav-button-item-content, textarea.box-item-textarea, input[type=button] {
    font-size: 2em;
  }
  div.box-spacing {
  	padding-bottom: 50px;
  }
  
  input.navi-button {
	  text-align: center; 
	  color: white; 
	  font-family: Roboto; 
	  font-size: 2em;
	  cursor: pointer; 
	  border: 0 none; 
	  background-color: #009BDA; 
	  border-radius: 5px; 
	  height: 200px; 
	  width: 100%;
	}
 
  input.navi-button-off {
	  text-align: center; 
	  color: white; 
	  font-family: Roboto; 
	  font-size: 2em;
	  cursor: pointer; 
	  border: 0 none; 
	  background-color: #cfcfcf; 
	  border-radius: 5px; 
	  height: 200px; 
	  width: 100%;
	}

  input.usercode {
  	text-align: center;
  	width: 70px;
  	height: 100px; 
  	font-size: 3em;
  }
  div.nav-button-item-image-repair {
  	height: 100px; 
  	font-size: 1.2em;
		padding-top: 50px; 
		padding-bottom: 25px;	  	
  }
  input.inputforms {
    font-size: 3em;
    height: 100px;
  }
  
	input::file-selector-button {
		background-image: url( 'img/text-file-white-padding.png' );
		background-position-x: left;
		background-repeat: no-repeat;
		background-position-y: center;
		background-size: 200px;
		display: grid;
		height: 200px; 
		width: 100%; 
		color: white !IMPORTANT; 
		font-family: Roboto; 
	  font-size: 2em;
		cursor: pointer; 
		border: 0 none; 
		background-color: #009BDA; 
		border-radius: 5px;
		//img/text-file-white.png
	}  
}

.box-left-spacer {
	padding-left: 10px !IMPORTANT;
}

.box-item-background-color-green
{
	background-color: #00B700;
}
.box-item-hand {
	cursor: pointer;
}
.box-item-background-color-red
{
	color: white !IMPORTANT;
	background-color: #DF0000;
}

.box-item-title
{
	color: black; 
	font-family: Lato; 
	font-weight: 400;
	width: 100%;
}

.box-item-input
{
	
	padding-top: 5px; 
	padding-bottom: 25px;	
}




.navi-button-item
{
	//height: 50px; 
	background-color: #DFDFDF; 
	border-radius: 15px; 
	padding-top: 10px; 
	padding-bottom: 15px; 
	margin: 20px;
	background-size: 40px;
	background-repeat: no-repeat;
	background-position: left 10px top 20px;
	background-position-y: center;

}

.nav-button-item-image-repair
{
	cursor: pointer;
	background-image: url( "https://hmbasen.no/lager/img/icon-tech-front.png" );
}

.nav-button-item-content
{
	font-family: Roboto;
	margin: auto;
	padding-left: 70px;
	color: black;
	font-size: 2em;
	font-weight: 400;
	padding-top: 10px;
	
}
.navi-fault-menu
{
}
.logo-item 
{
	height: 100px; 
	background-color: #DFDFDF; 
	border-radius: 15px; 
	color: black; 
	padding: 15px;
	margin: 20px;
}


#map {
  height: 100%;
}


.inputtextareaforms {
	border-radius: 4px !important;
	border-style: solid; 
	border-width: 1px; 
	border-color: #bbbbbb; 
	font-family: Roboto; 
	font-size: 12px; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding-left: 10px !IMPORTANT;
	box-sizing: border-box;
}
input {
	height: 30px;
}


.inputxx {
border-color:#0084e0 #0084e0 #005793; rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
background-repeat:repeat-x;
background-image:-moz-linear-gradient(top, #009BDA, #0082D9);
-webkit-gradient(linear, 0 0, 0 100%, from(#009BDA), to(#0084e0));
-webkit-linear-gradient(top, #009BDA, #0084e0);
-o-linear-gradient(top, #009BDA, #0084e0);
linear-gradient(to bottom, #009BDA, #0084e0);
}

.inputguest {
height: 30px;
color: black;
font-size: 12px !important;
background-color: #EDEDED !important;
border-color: #EDEDED !important; 
border-color: #EDEDED !important; 
pointer-events:none;
font-weight: 900;
}


.infoPopBoxBg
{
	padding-left: 40px; padding-top: 40px; padding-bottom: 40px; padding-right: 40px;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 500px;
	height: 200px;
	margin-left: -100px;
	margin-top: -25px;
	background: #444444;
	color: white:
}

.infoPopBox
{
	position: fixed;
	top: 50%;
	left: 50%;
	width: 200px;
	margin-left: -100px;
	height: 50px;
	margin-top: -25px;
	background: yellow;
}


span.step {
  background: red;
  border-radius: 50%;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  text-align: center;
  width: 1.6em; 
	padding: 1px;
}

span.bluestep {
  background: blue;
  border-radius: 15%;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  text-align: center;
  //width: 1.6em; 
	padding: 1px;
}



span.steplarge {
  background: red;
  border-radius: 50%;
  -moz-border-radius: 2.6em;
  -webkit-border-radius: 2.6em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  margin-right: 5px;
  text-align: center;
  line-height: 2.6em;
  width: 2.6em; 
	padding: 1px;
}

span.stepsmall {
  background: red;
  border-radius: 50%;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  text-align: center;
  width: 1.6em; 
	padding: 3px;
	font-size: 9px;
}
span.stepplus {
  background: #009BDA;
  border-radius: 50%;
  -moz-border-radius: 1.6em;
  -webkit-border-radius: 1.6em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  height: 1.6em;
  text-align: center;
  width: 1.6em; 
	padding: 3px;
	font-size: 9px;
}

span.infoaddress{
  background: #FAFAFA;
  border-radius: 50%;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: #ffffff;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  text-align: left;
  width: 100%; 
	padding: 3px;
	font-size: 9px;
}

a:link {text-decoration: none; color: white; font-family: Roboto; font-size: 12px; }
a:visited {text-decoration: none; color: white; font-family: Roboto; font-size: 12px; }
a:active {text-decoration: none; color: white; font-family: Roboto; font-size: 12px; }
a:hover {text-decoration: underline; color: white; font-family: Roboto; font-size: 12px; }

a.box:link {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.box:visited {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.box:active {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.box:hover {text-decoration: underline; color: black; font-family: Roboto; font-size: 12px; } 

a.blue:link {text-decoration: underline; color: darkblue; font-family: Roboto; font-size: 12px; }
a.blue:visited {text-decoration: underline; color: darkblue; font-family: Roboto; font-size: 12px; }
a.blue:active {text-decoration: none; color: darkblue; font-family: Roboto; font-size: 12px; }
a.blue:hover {text-decoration: underline; color: darkblue; font-family: Roboto; font-size: 12px; } 

a.blueten:link {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.blueten:visited {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.blueten:active {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.blueten:hover {text-decoration: none; color: darkblue; font-family: Roboto; font-size: 12px; } 


a.pink:link {text-decoration: underline; color: #F23DCE; font-family: Roboto; font-size: 12px; }
a.pink:visited {text-decoration: underline; color: #F23DCE; font-family: Roboto; font-size: 12px; }
a.pink:active {text-decoration: none; color: #F23DCE; font-family: Roboto; font-size: 12px; }
a.pink:hover {text-decoration: underline; color: #F23DCE; font-family: Roboto; font-size: 12px; } 

a.largeblue:link {font-weight: 900; text-decoration: none; color: black; font-family: Calibri, Roboto; font-size: 20px; }
a.largeblue:visited {font-weight: 900; text-decoration: none; color: black; font-family: Calibri, Roboto; font-size: 20px; }
a.largeblue:active {font-weight: 900; text-decoration: none; color: black; font-family: Calibri, Roboto; font-size: 20px; }
a.largeblue:hover {font-weight: 900; text-decoration: none; color: black; font-family: Calibri, Roboto; font-size: 20px; } 

a.black:link {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.black:visited {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.black:active {text-decoration: none; color: black; font-family: Roboto; font-size: 12px; }
a.black:hover {text-decoration: underline; color: black; font-family: Roboto; font-size: 12px; } 

a.grey:link {text-decoration: underline; color: #444444; font-family: Roboto; font-size: 12px; }
a.grey:visited {text-decoration: none; color: #444444; font-family: Roboto; font-size: 12px; }
a.grey:active {text-decoration: none; color: #444444; font-family: Roboto; font-size: 12px; }
a.grey:hover {text-decoration: underline; color: #444444; font-family: Roboto; font-size: 12px; } 

a.inactivegrey:link {text-decoration: underline; color: #777777; font-family: Roboto; font-size: 12px; }
a.inactivegrey:visited {text-decoration: none; color: #777777; font-family: Roboto; font-size: 12px; }
a.inactivegrey:active {text-decoration: none; color: #777777; font-family: Roboto; font-size: 12px; }
a.inactivegrey:hover {text-decoration: underline; color: #777777; font-family: Roboto; font-size: 12px; } 



a.blue-small:link {text-decoration: underline; color: grey; font-family: Roboto; font-size: 10px; }
a.blue-small:visited {text-decoration: underline; color: grey; font-family: Roboto; font-size: 10px; }
a.blue-small:active {text-decoration: none; color: grey; font-family: Roboto; font-size: 10px; }
a.blue-small:hover {text-decoration: underline; color: grey; font-family: Roboto; font-size: 10px; } 

a.white-small:link {text-decoration: none; color: white; font-family: Roboto; font-size: 10px; }
a.white-small:visited {text-decoration: none; color: white; font-family: Roboto; font-size: 10px; }
a.white-small:active {text-decoration: none; color: white; font-family: Roboto; font-size: 10px; }
a.white-small:hover {text-decoration: none; color: white; font-family: Roboto; font-size: 10px; } 

a.white-bold:link {		text-decoration: none; color: white; font-weight: none; font-family: Roboto; font-size: 12px; }
a.white-bold:visited {text-decoration: none; color: white; font-weight: none; font-family: Roboto; font-size: 12px; }
a.white-bold:active {	text-decoration: none; color: white; font-weight: none; font-family: Roboto; font-size: 12px; }
a.white-bold:hover {	text-decoration: none; color: white; font-weight: bold; font-family: Roboto; font-size: 12px; } 

a.menuwhite:link {text-decoration: none; color: white; font-family: Roboto; font-size: 11px; }
a.menuwhite:visited {text-decoration: none; color: white; font-family: Roboto; font-size: 11px; }
a.menuwhite:active {text-decoration: none; color: white; font-family: Roboto; font-size: 11px; }
a.menuwhite:hover {text-decoration: none; color: white; font-family: Roboto; font-size: 11px; } 



html, body {
	background: white;
  width: 100%;
  height: 100%;
  margin:0;
  padding:0;

}

.centerform {
left: 50%;
top: 50%;
position: absolute;
-webkit-transform: translate3d(-50%, -50%, 0);
-moz-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
}
.page {
  min-height: 100%;
  width: 100%;
}
td, textarea, select {
	-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-appearance: menu;
	font-family: Roboto; font-size: 12px;
}	

.switch {
  position: relative;
  display: inline-block;
  width: 52px;
  height: 30px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(22px);
  -ms-transform: translateX(22px);
  transform: translateX(22px);
}


/* Rounded sliders */
.slider.round {
  border-radius: 30px;
}

.slider.round:before {
  border-radius: 50%;
}




.switchtiny {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 20px;
}

/* Hide default HTML checkbox */
.switchtiny input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slidertiny {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slidertiny:before {
  position: absolute;
  content: "";
  height: 12px;
  width: 12px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slidertiny {
  background-color: #2196F3;
}

input:focus + .slidertiny {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slidertiny:before {
  -webkit-transform: translateX(15px);
  -ms-transform: translateX(15px);
  transform: translateX(15px);
}

/* Rounded sliders */
.slidertiny.round {
  border-radius: 10px;
}

.slidertiny.round:before {
  border-radius: 50%;
}






input.buttons {
height: 36px !important;
}

select.aid
{
	width: 100%; border-style: solid; border-width: 1px; border-color: #bbbbbb; padding-left: 2px; font-family: Roboto; font-size: 12px;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}

select {
height: 30px !important;
}

textarea {
//border-radius: 4px;
}		

span.center {
	margin-left: auto; 
	margin-right: auto;
}