*{margin:0 auto;
  padding:0px;
  font-family: 'helvetica neue',helvetica,'Segoe UI','verdana','arial','Geneva';
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

input[type=numeric] {
  display:block;
  width: 100px;
  margin: 5px;
  font-size:12px;
  border: 1px solid #ccc;
  box-sizing: border-box;
}
input[type=text] {
  display:block;
  width: 290px;
  margin: 0px;
  font-size:12px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  overflow:hidden;
}
input[type=checkbox] {
  display:block;
  width: 25px;
  margin: 10px;
  font-size:12px;
}

.pagecontainer {
    display: grid;
    grid-template-areas:
    'header header'
    'menu content'
    'footer footer';
	grid-gap: 0px;
	grid-template-rows: auto 1fr auto;
	grid-template-columns: 140px auto ;
    background-color:#fff8c2;
	padding: 0px;
	min-height: 100vh;
}	

.header { 
    grid-area: header;
	margin:0px;
    margin-top:0px;
	height:45px;
	width:1024px;
	max-width:100%;
    min-width:100%;
    border: 0px solid silver;
    background-image: linear-gradient(45deg, orange,yellow);
    border-radius: 0px;
	color:black;
}

#clockbox {
	position:fixed;
	font-size:12px;
    font-weight:600;
	top:25px;
	left:calc(100vw - 52px);
}
#datebox {
	position:fixed;
	font-size:12px;
    font-weight:600;
	top:5px;
	left:calc(100vw - 65px);
}

.header h3 { 
    margin:0px;
    margin-left:2px;
    margin-top:11px;
	display:inline-block;
    font-weight:500;
}

.footer {
    grid-area: footer;
    min-width:480px;
	height:28px;
    margin:0px;
    margin-right:0px;
    font-size: 0.70em;
    padding: 8px;
    border: 0px solid silver;
    background-image: linear-gradient(45deg,orange,yellow);
    border-radius: 0px;
}

.hamburger {
	width:30px;
	height:30px;
	margin:6px;
	border:0px solid silver;
	position:fixed;
	left:5px;
}

.imghome {
	width:36px;
	height:36px;
	margin:2px;
	padding:0px;
}

.img {
	width:30px;
	height:30px;
	margin:2px;
}

.menuheader { 
    margin:2px;
    margin-top:2px;
    font-weight:600;
    font-size:12px;
    color:black;
}

.menu { 
    grid-area: menu;
    margin:0px;
	height:auto;
    border: 0px solid red;
    background-color:#EBECC9;
    border-radius: 0px;
    color:black;
}

.menucontainer {
	margin-top:10px;
	display: grid;
	grid-template-areas:
    'menu';
	grid-gap: 3px;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
	padding: 0px;
}	

.menubutton {
	width:calc(100% - 8px);
	height:30px;
	margin:0px;
	margin-left:4px;
	text-decoration: none;
	text-align:left;
	font-size:12px;
    font-weight:400;
	padding:5px;
	padding-top:7px;
    border: 1px solid silver;
    background-color:yellow;
    border-radius: 3px;
    color:black;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);	
}
.menubutton2 {
	width:calc(100% - 8px);
	height:30px;
	margin:0px;
	margin-left:4px;
	text-decoration: none;
	text-align:left;
	font-size:12px;
    font-weight:500;
	padding:5px;
	padding-top:7px;
    border: 1px solid silver;
	background:#4B77C8;
	color:white;
    border-radius: 3px;
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,0.4);
}

.menubutton:hover {
    box-shadow: 0 10px 14px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
   	background-color:#F4F2D9;
}
.menubutton2:hover {
   	background-color:#9EC3EC;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);	
}

.striped-line {
    border: 1px dashed grey;
	width:calc(100% - 4px);
	margin:2px;
	padding:0px;
    }

.content {
   grid-area: content;
   width:100%;
   height:auto;
   padding: 0px;
   margin: 0px;
   opacity: 1.0;
   background-color:#fff8c2;
   border: 0px solid red;
   border-radius: 5px;
   overflow-x: hidden;
   overflow-y: scroll;
   overflow: hidden;
}

.content h4 { 
    margin:6px;
    font-weight:700;
    color:#c4b8b8;
}

.tableoptions {
	width:500px;
	height:80px;
	margin:0px;
	margin-top:5px;
	margin-left:2px;
	font-size:11px;
    border: 0px;
	color:black;
	padding:0px;
    font-weight:600;
}

.optionsbutton {
	display: inline-block;
	height:23px;
	width:80px;
	border: 1px solid grey;
	background:lightblue;
	border-radius: 3px;
	color:black;
	padding: 0px;
	padding-top: 5px;
	text-align: center;
	text-decoration: none;
	font-size:10px;
	margin: 3px;
	margin-top: 2px;
	margin-right: 0px;
	margin-bottom: 0px;
	cursor: pointer;
    font-weight:600;
}

.optionsbutton2 {
	display: inline-block;
	height:23px;
	width:80px;
	border: 1px solid grey;
	background:blue;
	border-radius: 3px;
	color:white;
	padding: 0px;
	padding-top: 5px;
	text-align: center;
	text-decoration: none;
	font-size:10px;
	margin: 3px;
	margin-top: 2px;
	margin-right: 0px;
	margin-bottom: 0px;
	cursor: pointer;
    font-weight:600;
}

.optionsbutton:hover {
  color:black;
  background-color:#62A9C4;
  border: 1px solid white;
}

.contentheader {
	display:grid;
	height:26px;
	width:480px;
	margin:5px;
	margin-bottom:0px;
	grid-auto-rows: 30px; 	
	background-color:#009879;
    border: 0px;
    border-bottom: 1px solid grey;
	align-items: stretch;	
}

.contentheader2 {
	display:grid;
	height:26px;
	width:480px;
	margin:0px;
	margin-bottom:0px;
	grid-auto-rows: 30px; 	
	background-color:#009879;
    border: 0px solid grey;
	align-items: stretch;	
}

.label {
    display: inline-block;
	font-size:14px;
	color:black;
	padding:3px;
	margin-top:2px;
    font-weight:600;
}

.headerrecord {
	display:flex;
	width:480px;
	height:26px;
	font-size:12px;
	margin:0px;
	align-items: stretch;	
	background-color:#72EB43;
	color:black;
    font-weight:600;
    border: 0px solid yellow;
	padding-top:0px;
}

.record {
	display:flex;
	height:26px;
	max-height:24px;
	width:480px;
	font-size:12px;
	align-items: stretch;	
	background-color:#e8c381;
    font-weight:600;	
    border: 0px solid black;
    border-top: 0px solid black;
}

.contenttable {
	width:505px;
	height:auto;
	margin:0px;
	padding:0px;
	background-color: transparent;
	min-height:calc(100vh - 195px);
	max-height:calc(100vh - 195px);
    border: 0px solid black;
    border-top: 0px solid black;
    overflow-y: scroll;
    overflow-x: hidden;
}

.contenttable2 {
	width:505px;
	height:auto;
	margin:0px;
	padding:0px;
	background-color: transparent;
	min-height:calc(100vh - 110px);
	max-height:calc(100vh - 110px);
    border: 0px solid black;
    border-top: 0px solid black;
    overflow-y: scroll;
    overflow-x: hidden;
}

.contentdata {
	width:480px;
	height:auto;
	margin:5px;
	margin-top:0px;
	margin-bottom:5px;
	grid-template-rows: minmax(24px,24px);
	grid-row-gap: 0px;
	background-color:transparent;
    border: 0px solid black;
    border-top: 0px solid black;
}
.contentdatabs {
	display:grid;
	width:auto;
    min-width:250px;
    max-width:calc(100vw - 120px);
	height:auto;
	margin:10px;
	margin-top:0px;
	margin-bottom:5px;
	grid-template-rows: minmax(24px,24px);
	grid-row-gap: 0px;
	background-color: #c4b8b8;
	max-height:calc(100vh - 130px);
    border: 0px solid black;
    border-top: 0px solid black;
    overflow-x:hidden;
    overflow-y:scroll;
}

.savebtn {
	display:inline-block;
	float:right;
	width:32px;
	height:32px;
	padding:0px;
}


.editbox {
	display:grid;
	height:250px;
	margin:5px;
	background-color: #c4b8b8;
    background-image: linear-gradient(orange,yellow);
	min-width:320px;
	max-width:500px;
    border: 1px solid black;
}

.varebox {
	display:grid;
	width:auto;
	height:auto;
	margin:5px;
	margin-top:0px;
	margin-bottom:5px;
	background-color: #c4b8b8;
	max-height:calc(100vh - 300px);
	min-width:320px;
	max-width:500px;
    border: 1px solid black;
	align-items: stretch;	
    overflow-x:hidden;
    overflow-y:scroll;
}

.nr {
	width:10%;
    border: 1px solid grey;
    padding:5px;
}
.navn {
	width:65%;
    border: 1px solid grey;
    padding:5px;
}
.levering {
	width:15%;
    border: 1px solid grey;
    padding:5px;
	font-family:"Courier New", Courier, monospace;
}

.edit {
	display:inline-block;
	width:10%;
    border: 1px solid grey;
    text-align: left;
    padding:4px;
	margin:0px;
	min-width:50px;
	max-width:70px;
}
.varegrpnr {
	display:inline-block;
	width:60px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:60px;
	max-width:60px;
}
.varegrpnavn {
	display:inline-block;
	width:200px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:250px;
	max-width:250px;
}
.lokationnr {
	display:inline-block;
	width:80px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
}
.lokationnavn {
	display:inline-block;
	width:300px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
}


.varegrpfra {
	display:inline-block;
	width:60px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:60px;
	max-width:60px;
}
.varegrptil {
	display:inline-block;
	width:60px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:60px;
	max-width:60px;
}

.varenr {
	display:inline-block;
	width:60px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:50px;
	max-width:70px;
}
.lokation {
	display:inline-block;
	width:5%;
    border: 1px solid grey;
    text-align: left;
	overflow:hidden;
    padding:5px;
}
.varetekst {
	display:inline-block;
	width:60%;
    border: 1px solid grey;
    text-align: left;
	overflow:hidden;
    padding:5px;
}
.varepris {
	display:inline-block;
	width:15%;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
    font-weight:600;
	min-width:60px;
	max-width:80px;
	font-family:"Courier New", Courier, monospace;
}
.kundetype {
	display:inline-block;
	width:10%;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
    font-weight:600;
	min-width:35px;
	max-width:35px;
	font-family:"Courier New", Courier, monospace;
}

.delete {
	display:inline-block;
	width:10%;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
	min-width:50px;
	max-width:50px;
}

.datarecord {
	display:flex;
	width:calc(100% - 8px);
	height:28px;
	margin:2px;
	margin-left:2px;
	text-decoration: none;
	text-align:left;
	font-size:12px;
    border: 1px solid silver;
	background-color:khaki;
}

.editbtn {
	border-radius: 2px;
    border: solid 1px #20538D;
    color:#000;
    font-weight:400;
    font-size:9px;
    text-align:center;
    text-decoration: none;
    background:lightgoldenrodyellow;
    height:28px;
	margin:1px;
	padding:2px;
	width:50px;
	min-width:50px;
}
.editbtn:hover {
    background: #e4b5b5;
    border: solid 1px #2A4E77;
}

.editvarebox {
	display:grid;
	height:440px;
	height:auto;
	width:450px;
	margin:10px;
	background-color: #c4b8b8;
    background-image: linear-gradient(orange,yellow);
	min-width:280px;
	max-width:500px;
    border: 1px solid black;
}

.varebembox {
	display:grid;
	height:auto;
	width:450px;
	margin:10px;
	background-color: #c4b8b8;
    background-image: linear-gradient(orange,yellow);
	min-width:280px;
	max-width:500px;
    border: 1px solid black;
}

.editinfobox {
	display:grid;
	height:520px;
	width:450px;
	margin:10px;
	background-color: #c4b8b8;
    background-image: linear-gradient(orange,yellow);
	min-width:280px;
	max-width:500px;
    border: 1px solid black;
}

.editcontainer {
  display:block;
  width:100%;
  height:100%;
  line-height: 25px;
  font-size: 0.8em;
  border: none;
}

.editheader {
	width:100%;
	padding:2px;
	background-color:transparent;
    border-bottom: 1px solid black;
	height:40px;
	color:black;
    font-weight:700;	
}

.editheader h4 {
	display:inline-block;
	margin:0px;
	padding:5px;
	color:black;
    font-weight:700;	
	text-align:left;
}

.editline {
	width:100%;
	padding:0px;
	margin:0px;
	background-color:transparent;
    border:0px solid black;
	height:40px;
	color:black;
    font-weight:700;	
}

.editinfoline {
	width:100%;
	padding:0px;
	margin:0px;
	background-color:transparent;
    border:0px solid black;
	height:30px;
	color:black;
    font-weight:700;	
}

.txtinput {
    display:inline-block;
    width:200px;
    border: 1px solid grey;
    text-align: left;
    padding:5px;
    min-width:250px;
    max-width:250px;
}

.navnlabel {
  clear:both;
  float:left;
  display: block;
  width: 60px;
  line-height: 20px;
  font-size:12px;
  margin: 5px;
  margin-top: 8px;
  padding: 2px 2px;
  display: inline-block;
}
.navninput {
  float:left;
  width: 150px;
  font-size:12px;
  margin: 0px;
  padding: 0px;
  line-height: 20px;
  display: inline-block;
  border: 1px solid #ccc;
}

.daglabel {
  clear:both;
  float:left;
  display: block;
  width: 60px;
  line-height: 15px;
  font-size:11px;
  margin: 0px;
  margin-top: 10px;
  margin-left: 6px;
  display: inline-block;
}
.daginput {
  float:left;
  width: 250px;
  font-size:11px;
  margin: 0px;
  margin-top: 0px;
  margin-left: 6px;
  padding: 0px;
  line-height: 15px;
  display: inline-block;
  border: 1px solid #ccc;
}

.varelabel {
  clear:both;
  float:left;
  display: inline-block;
  width:90px;
  line-height: 20px;
  font-size:12px;
  margin: 5px;
  padding: 2px 2px;
  display: inline-block;
}

.txtlabel {
  clear:both;
  float:left;
  display: block;
  width:90px;
  line-height: 30px;
  font-size:12px;
  margin: 8px;
}

.editlabel {
  clear:both;
  float:left;
  display: block;
  width:110px;
  line-height: 30px;
  font-size:12px;
  margin: 5px;
  padding: 0px;
  font-weight:800;	
}

.editdag {
  float:left;
  display: inline-block;
  width:200px;
  line-height: 30px;
  font-size:12px;
  margin: 5px;
  padding: 0px;
  font-weight:800;	
}

.editinfolabel {
  clear:both;
  float:left;
  display: block;
  width:140px;
  line-height: 25px;
  font-size:11px;
  margin: 0px;
  margin-left: 5px;
  padding: 0px;
  font-weight:800;	
}
.varenrinput {
  float:left;
  width: 120px;
  font-size:12px;
  margin: 5px;
  padding: 0px;
  padding-left: 2px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
}

.varetekstinput {
  float:left;
  font-size:12px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
  width: 290px;
  margin: 5px;
  padding: 0px;
  padding-left: 2px;
  overflow:hidden;
}

.infotekstinput {
  float:left;
  font-size:12px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
  width: 180px;
  margin: 0px;
  padding: 0px;
  padding-left: 2px;
  overflow:hidden;
}

.editinput {
  float:left;
  width: 50px;
  font-size:12px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
  margin: 5px;
  padding: 0px;
  padding-left: 2px;
  overflow:hidden;
}

.lokationinput {
  float:left;
  width: 30px;
  font-size:12px;
  margin: 5px;
  padding: 0px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
}

.dateinput {
  float:left;
  width: 150px;
  font-size:12px;
  margin: 5px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
}

.daginput {
  float:left;
  width: 40px;
  font-size:12px;
  margin: 5px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
}

.maxinput {
  float:left;
  width: 50px;
  font-size:12px;
  margin: 5px;
  padding: 0px;
  padding-left: 2px;
  line-height: 25px;
  display: inline-block;
  border: 1px solid #ccc;
}

.iframe_box1 {
    position:absolute;
    left:251px;
    top:1px;
    float:left;   
    width:calc(100% - 252px);
    height:calc(100% - 2px);
}

.mapiframe {
    width:100%;
    height:calc(100% - 0px);
    border: 0px solid #ccc;

}

.mapheader {
height:24px;
margin:5px;
}