html,body {
	width:98%;
	height:98%;
}



/*#content {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-template-rows: repeat(5, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;

}*/

#content {
  display: grid;

  grid-template-areas: "topbar topbar"
  						"sidebar tid";
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}

/*#topbar { grid-area: 1 / 1 / 2 / 6; }
#sidebar { grid-area: 2 / 1 / 6 / 2; }
#tid { grid-area: 2 / 2 / 6 / 6; }*/



#topbar {
	grid-area: topbar;
	border:2px solid red;
	height:10vh;
	width:98vw;
}

#sidebar {
	grid-area: sidebar;
	border:2px solid blue;
	width:10vw;
	height:85vh;

}

#tid {
	grid-area: tid;
	border:2px solid green;
	width:88vw;
	height:85vh;
}



/*************TID************/

#innertid {
	display: grid;
	grid-template-areas: "space dage"
  						"klokke tidtid";
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}

#klokke {
	grid-area: klokke;
	padding-top:2vh;
	padding-left:1vh;
	display: grid;
	width:2.5vw;
	height:80vh;
	border-right:1px solid rgb(204, 04, 204);
	box-shadow: rgba(0, 255, 0, 0.1) 0px 4px 5px;
}

#dage {
	grid-area: dage;
	display: grid;
	grid-auto-flow: column;
	width:86vw;
	height:3vh;
	border:0px solid black;
}

.dagenavne {
	padding-left:1.3vw;
	border-right:1px solid rgb(100, 100, 255);
}

#tidtid {
	grid-area: tidtid;
	padding-top:1.5vh;
	width:86vw;
	height:80vh;
	border:0px solid pink;
	 display: block;
}

#lines {
	display: grid;	
	grid-template-columns:repeat(5, 1fr);
	grid-template-rows:repeat(24, 1fr);
	grid-auto-flow: column;
	border:0px solid black;
	width:86vw;
	height:80vh;
}

.del1 {
	/*border-top:2px dotted grey;*/
	border-top:1px solid rgb(100, 100, 255);
	padding-left:1.5vw;
	border-right:1px solid rgb(100, 100, 255);
}

.del2 {
	/*border-top:2px dotted grey;*/
	border-top:1px dashed rgb(55, 100, 55);
	padding-left:1.5vw;
	border-right:1px solid rgb(100, 100, 255);
	/*background: linear-gradient(to bottom, black 50%, white 50%);*/
}