/*
	DkBlog Template
	CSS StyleSheet by David Herreman
	http://www.free-css-templates.com
*/

body {
padding : 0;
margin : 0;
font : 0.74em Arial, sans-serif;
line-height : 1.5em;
background : #393939;
color : #fff;
}
a {
	
/*color : #0078ff;*/
color : #d0eb55;
background : inherit;
text-decoration : none;
}
a:hover {
color : #d0eb55;
background : inherit;
text-decoration : underline;
}
p {
margin : 5px 0;
}
h1 {
font : bold 1.8em Arial, Sans-Serif;
padding : 8px 0 4px 0;
margin : 0;
letter-spacing : -1px;
}
h2 {
font : bold 1.6em Arial, Sans-Serif;
letter-spacing : -1px;
}
h3 {
padding : 4px 0;
margin : 0;
}
ul {
margin : 0;
padding : 0;
list-style : none;
}
img {
border : 0;
}
video { 
   -webkit-background-size:cover; 
   -moz-background-size:cover; 
   -o-background-size:cover; 
   background-size:cover; 
}

hr {
height : 1px;
border-style : none;
color : #d0d0d0;
background-color : #c0c0c0;
margin : 10px 0;
}
ol {
padding : 0;
margin : 0;
}
.code {
padding : 3px 5px 3px 35px;
border : 1px solid #666;
list-style-type : decimal-leading-zero;
font-family : Courier;
}
.code code {
font-family : Monaco, "Courier New", Tahoma;
font-size : 1.2em;
}
.code li {
margin : 2px 0;
padding : 0 5px;
background : #333;
}
.code li.t1 {
padding-left : 4ex;
}
.code li.t2 {
padding-left : 8ex;
}
.code li.t3 {
padding-left : 12ex;
}
.code li.t4 {
padding-left : 16ex;
}
.code li.t5 {
padding-left : 20ex;
}
.code li.t6 {
padding-left : 24ex;
}
.code li.t7 {
padding-left : 28ex;
}
.code li.t8 {
padding-left : 32ex;
}

.content {
margin : 0 auto;
/* width : 1000px; */
min-width: 1000px;
width: 95%;
max-width: 1920px;
}
.content2 {
margin : 0 auto;
/* width : 1000px; */
min-width: 1000px;
width: 100%;
max-width: 1920px;
}
#topbar {
height : 35px;
background : #212121;
width : 100%;
}
#topbar #icons {
float : right;
margin : 10px 0 0;
padding : 0;
}
#topbar #icons img {
padding-right : 4px;
border : 0;
}
.url {
padding : 10px 0;

}
.url a {
color : #454545;
text-decoration : none;

}
.url a:hover {
color : #fff;
}
#top {
padding-top : 0;
background : #3d3d3b url(images/topbg.gif) repeat-x;
height : 85px;
margin-bottom : 25px;
}
#top h1 {
font : bold 2.6em Arial, Sans-Serif;
padding : 20px 0 0 0;
margin : 0;
letter-spacing : 1px;
color : #d0eb55;
}
#top a:hover {
text-decoration : none;
}
#top h2 {
font : 0.9em Arial, Sans-Serif;
letter-spacing : 0;
color : #868686;
margin : 0;
padding : 0;
}
#menu {
float : right;
height : 23px;
margin-top : 35px;
}
#menu a {
color : #fff;
background : inherit;
text-decoration : none;
padding-left : 10px;
line-height : 23px;
font-weight : bold;
}
#menu a span {
padding-right : 10px;
}
#menu a, #menu a span {
display : block;
float : left;
}
#menu a:hover, #menu .current {
color : #fff;
background : #a9bc52 url(images/tabl.gif) no-repeat left top;
padding-left : 10px;
height : 23px;
}
#menu a:hover span, #menu .current span {
background : url(images/tabr.gif) no-repeat right top;
padding-right : 10px;
height : 23px;
cursor : pointer;
}
#menu ul {
list-style : none;
padding : 0;
margin : 0;
}
#menu li {
float : left;
margin : 0 0 0 5px;
}
#main {
/* width : 1000px; */
min-width: 1000px;
width: 95%;
/* max-width: 1920px; */
margin : 0;
padding : 0;
}
#main2 {
/* width : 1000px; */
min-width: 1000px;
width: 100%;
/* max-width: 1920px; */
margin : 0;
padding : 0;
}
#plandraw {
overflow: hidden;
position: relative;
float:center;
padding-left: 1%;
width : 98%;
height: auto;
margin : 0 0 0 0px;

}
.background-plandraw { z-index: -1; }
.overlay-text-Altan { position: absolute; top: 8%; left: 3%; }
.overlay-text-Outside { position: absolute; bottom: 24%; top: 58.5%; left: 1.3%; }
.overlay-text-AltanArduino { position: absolute; top: 135px; left: 110px; }
.overlay-text-AltanPlant { position: absolute; top: 28%; left: 13%; right: 74%;}

.overlay-text-Stue { position: absolute; top: 8%; left: 22%; }
.overlay-text-StueVindueAltan { position: absolute; top: 15%; bottom: 65%; left: 16.5%; right: 74%; }
.overlay-text-StueDoorAltan { position: absolute; bottom: 50%; top: 45%; left: 16.5%; right: 74%; }
.overlay-text-StueVindueUd { position: absolute; bottom: 20%; top: 70%; left: 16.5%; right: 74%; }
.overlay-text-StueWifi { position: absolute; top: 55%; left: 33%; }
.overlay-text-StueSmokeSensor { position: absolute; top: 22%; left: 32.4%; }
.overlay-text-StueLys { position: absolute; top: 35%; left: 50.4%; right: 39%; }
.overlay-text-DoorCam { position: absolute; top: 2%; left: 62%; right: 27%; }

.overlay-text-KitchenCam { position: absolute; top: 27%; right: -9.5%; left: 95.6%; }
.overlay-text-KitchenVindue { position: absolute; top: 14%; right: -5.5%; left: 96.5%; }
.overlay-text-Entre { position: absolute; top: 18%; right: 32%; left: 56%; }
.overlay-text-EntreServer { position: absolute; top: 2%; right: 40%; left: 54%; }
.overlay-text-EntreLys { position: absolute; top: 27%; left: 68%; right: 21.5%; }
.overlay-text-EntreSecurity { position: absolute; top: 2%; left: 67.5%; right: 19%; }
.overlay-text-EntreArduino { position: absolute; top: 165px; left: 540px; }
.overlay-text-Kitchen { position: absolute; top: 8%; right: 12%; }
.overlay-text-Room { position: absolute; bottom: 45%; top: 50%; right: 12%; }
.overlay-text-RoomVindue { position: absolute; bottom: 36%; right: -5.5%; left: 96.5%; }
.overlay-text-Bad { position: absolute; bottom: 23%; top: 65%; right: 34.5%; left: 55%; }

/* Nedeståender er til Altan Siden*/
.overlay-text-Altan-Text { position: absolute; top: 50px; left: 60px; }
.overlay-text-Altan-Arduino { position: absolute; top: 490px; left: 330px; }
.overlay-text-Altan-GoTo-Stue { position: absolute; top: 500px; left: 125px; }

/* Nedeståender er til Køkken Siden*/
.overlay-text-Kitchen-Text { position: absolute; top: 50px; left: 525px; }
.overlay-text-Kitchen-Arduino { position: absolute; top: 175px; left: 500px; }
.overlay-text-Kitchen-GoTo-Entre { position: absolute; top: 230px; left: 10px; }
.overlay-text-Kitchen-Left-Vindue { position: absolute; top: 200px; left: 935px; }
.overlay-text-Kitchen-Right-Vindue { position: absolute; top: 335px; left: 935px; }

/* Nedeståender er til Kontor Siden*/
.overlay-text-Office-Text { position: absolute; top: 50px; left: 500px; }
.overlay-text-Office-Arduino { position: absolute; top: 175px; left: 500px; }
.overlay-text-Office-GoTo-Entre { position: absolute; top: 60px; left: 10px; }
.overlay-text-Office-Left-Vindue { position: absolute; top: 170px; left: 900px; }
.overlay-text-Office-Right-Vindue { position: absolute; top: 275px; left: 900px; }

/* Nedeståender er til Stue Siden*/
.overlay-text-Stue-Text { position: absolute; top: 50px; left: 480px; }
.overlay-text-Stue-Arduino { position: absolute; top: 175px; left: 500px; }
.overlay-text-Stue-Wifi { position: absolute; top: 280px; left: 330px; }
.overlay-text-Stue-SmokeSensor { position: absolute; top: 280px; left: 680px; }
.overlay-text-Stue-Lys { position: absolute; top: 550px; left: 680px; }
.overlay-text-Stue-GoTo-Entre { position: absolute; top: 600px; left: 830px; }
.overlay-text-Stue-GoTo-Altan { position: absolute; top: 10px; left: 380px; }
.overlay-text-Stue-Door-Altan { position: absolute; top: 40px; left: 370px; }
.overlay-text-Stue-Left-Left-Vindue { position: absolute; top: 35px; left: 100px; }
.overlay-text-Stue-Left-Right-Vindue { position: absolute; top: 35px; left: 250px; }
.overlay-text-Stue-Right-Left-Vindue { position: absolute; top: 15px; left: 640px; }
.overlay-text-Stue-Right-Right-Vindue { position: absolute; top: 15px; left: 800px; }

/* Nedeståender er til Entre Siden*/
.overlay-text-Entre-Text { position: absolute; top: 50px; left: 450px; }
.overlay-text-Entre-Arduino { position: absolute; top: 175px; left: 500px; }
.overlay-text-Entre-GoTo-Stue { position: absolute; top: 15px; left: 690px; }
.overlay-text-Entre-GoTo-Bad { position: absolute; top: 175px; left: 10px; }
.overlay-text-Entre-GoTo-Office { position: absolute; top: 430px; left: 125px; }
.overlay-text-Entre-GoTo-Kitchen { position: absolute; top: 630px; left: 750px; }
.overlay-text-Entre-Lys { position: absolute; top: 600px; left: 350px; }
.overlay-text-Entre-DoorCam { position: absolute; top: 250px; left: 915px; }
.overlay-text-Entre-Server { position: absolute; top: 20px; left: 915px; }

/* Nedeståender er til Bad Siden*/
.overlay-text-Bad-Text { position: absolute; top: 150px; left: 75px; }
.overlay-text-Bad-Arduino { position: absolute; top: 175px; left: 500px; }
.overlay-text-Bad-GoTo-Entre { position: absolute; top: 300px; left: 700px; }

.wraptocenter {
  /*display: table-cell;*/
  text-align: center;
  vertical-align: middle;
}
.wraptocenter * {
  vertical-align: middle;
}

.right_side {
float : right;
width : 202px;
background : inherit;
overflow : hidden;
}
.right_side .pad {
padding : 0 0 10px 17px;
}
.right_side p {
padding : 0 0 5px 5px;
}
.right_side ul {
padding : 3px 0 12px 5px;
}
.right_side li {
line-height : 18px;
background : inherit;
list-style : square;
padding-left : 0px;
margin-left : 17px;
color : #b4e04a;
}
.right_side a {
background : inherit;
text-decoration : none;
}
.right_side a:hover {
text-decoration : underline;
}
.right_side h3 {
color : #eee;
font : bold 1.2em Arial, Sans-Serif;
background : url(images/rmenuhead.gif) no-repeat top;
width : 202px;
height : 30px;
padding-top : 7px;
text-indent : 10px;
}
#login {
background : inherit;
align-items: center;
display: flex;
justify-content: center;
}
#left_side_index {
background : inherit;
margin-bottom : 10px;
margin-left : 20px;
/* width : 800px; */
min-width: 800px;
width: 85%;
max-width: 1920px;
}
#left_side2 {
background : inherit;
margin-bottom : 10px;
/* width : 800px; */
min-width: 800px;
width: 85%;
max-width: 1920px;
}
#left_side {
background : inherit;
margin-bottom : 10px;
/* width : 800px; */
min-width: 800px;
width: 95%;
max-width: 1920px;
}
#left_side .intro {
background : #414141;
color : #fff;
}
#left_side .intro .pad {
padding : 10px;
}
#left_side .intro a {
color : #b4e04a;
text-decoration : none;
}
#left_side .intro a:hover {
color : #cdff56;
text-decoration : underline;
}
#left_side .mpart {
padding : 20px 0 0 0;
}
#left_side h2 {
background : inherit;
padding : 0;
margin : 0;
font : 1.8em verdana, Arial, Sans-Serif;
}
#left_side .mpart h3 {
background : inherit;
padding : 0;
margin : 0 0 15px 0;
font : 0.9em verdana, Arial, Sans-Serif;
color : #a5a5a5;
}
#left_side p {
color : #e7e7e7;
padding : 0;
text-align : justify;
}
#left_side img {
float : left;
padding : 0 10px 5px 0;
}
#left_side blockquote {
padding-left : 10px;
border-left : 3px solid #a7cc44;
margin : 10px 0 10px 25px;
}
.date {
padding : 7px 35px 0 0;
margin : 10px 0 25px 0;
text-align : right;
background : url(images/commentb.gif) no-repeat top right;
height : 32px;
}
.date a {
font : bold 1.2em Arial, Sans-Serif;
color : #a9bc52;
background : transparent;
}
#left_side .rs {
float : right;
margin : 0 0 0 10px;
border : 1px solid #888;
padding : 5px;
background : inherit;
}
#left_side ul {
list-style-position : inside;
margin-left : 2px;
}
#left_side ul li {
list-style-type : square;
margin-left : 15px;
}
#left_side ul ul li {
list-style : none;
margin-left : 10px;
list-style-type : lower-alpha;
list-style-position : inside;
}
#left_side .greybox {
border : 1px solid #ccc;
background : #f5f5f5;
width : 628px;
padding : 10px;
}
#parent {
    /* width : 1000px; */
min-width: 1000px;
width: 95%;
max-width: 1920px;
	text-align:center;
    
   /* border:1px solid #666; */
}
#parent2 {
    width: 1000px;
	text-align:center;
    
   /* border:1px solid #666; */
}

.image {
   display:inline-block;
    margin:1px 1px;
    padding:2px;
/*  border:1px solid Black; */ 
	width: 145px;
    height: auto;

/*
    float: left;

	border:1px solid black;
*/
	}
.image2 {
   display:inline-block;
    margin:1px 1px;
    padding:10px;
  border:1px solid Black;  
	width: 145px;
    height: auto;


    float: center;

	border:1px solid black;

	}
.image3 {
   display:inline-block;
    margin:1px 1px;

	width: 400px;
    height: auto;

    float: center;
	}
	
.CollapsibleList {
padding : 3px 5px 3px 35px;
border : 1px solid #666;
list-style-type : decimal-leading-zero;
font-family : Courier;
cursor:auto;
}
.CollapsibleList code {
font-family : Monaco, "Courier New", Tahoma;
font-size : 1.2em;
}
.CollapsibleList li {
margin : 2px 0;
padding : 0 5px;
background : #333;
list-style-image:url('button.png');
cursor:auto;
}
.CollapsibleList li.t1 {
padding-left : 4ex;
}
.CollapsibleList li.t2 {
padding-left : 8ex;
}
.CollapsibleList li.t3 {
padding-left : 12ex;
}
.CollapsibleList li.t4 {
padding-left : 16ex;
}
.CollapsibleList li.t5 {
padding-left : 20ex;
}
.CollapsibleList li.t6 {
padding-left : 24ex;
}
.CollapsibleList li.t7 {
padding-left : 28ex;
}
.CollapsibleList li.t8 {
padding-left : 32ex;
}

li.collapsibleListOpen{
  list-style-image:url('images/button-open.png');
  cursor:pointer;
}

li.collapsibleListClosed{
  list-style-image:url('images/button-closed.png');
  cursor:pointer;
}	
/* CSS Tree menu styles */
ol.tree
{
	padding: 0 0 0 30px;
	width: 600px;
}
	li 
	{ 
		position: relative; 
		margin-left: -15px;
		list-style: none;
	}
	li.file
	{
		margin-left: -1px !important;
	}
		li.file a
		{
			background: url(images/document.png) 0 0 no-repeat;
			color: #fff;
			padding-left: 21px;
			text-decoration: none;
			display: inline-block;
		}
		li.file a[href *= '.pdf']	{ background: url(document.png) 0 0 no-repeat; }
		li.file a[href *= '.html']	{ background: url(document.png) 0 0 no-repeat; }
		li.file a[href $= '.css']	{ background: url(document.png) 0 0 no-repeat; }
		li.file a[href $= '.js']		{ background: url(document.png) 0 0 no-repeat; }
		li.file2 a
		{
			background: url(images/document_NotSeen.png) 0 0 no-repeat;
			color: #fff;
			padding-left: 21px;
			text-decoration: none;
			display: inline-block;
		}
	li.file2
	{
		margin-left: -1px !important;
	}
		li.file2 a[href *= '.pdf']	{ background: url(document.png) 0 0 no-repeat; }
		li.file2 a[href *= '.html']	{ background: url(document.png) 0 0 no-repeat; }
		li.file2 a[href $= '.css']	{ background: url(document.png) 0 0 no-repeat; }
		li.file2 a[href $= '.js']		{ background: url(document.png) 0 0 no-repeat; }
	li input
	{
		position: absolute;
		left: 0;
		margin-left: 0;
		opacity: 0;
		z-index: 2;
		cursor: pointer;
		height: 1em;
		width: 1em;
		top: 0;
	}
		li input + ol
		{
			background: url(toggle-small-expand.png) 40px 0 no-repeat;
			margin: -0.938em 0 0 -44px; /* 15px */
			height: 1em;
		}
		li input + ol > li { display: none; margin-left: -14px !important; padding-left: 1px; }
	li label
	{
		background: url(images/folder-horizontal.png) 15px 1px no-repeat;
		cursor: pointer;
		display: block;
		padding-left: 37px;
	}

	li input:checked + ol
	{
		background: url(toggle-small.png) 40px 5px no-repeat;
		margin: -1.25em 0 0 -44px; /* 20px */
		padding: 1.563em 0 0 80px;
		height: auto;
	}
		li input:checked + ol > li { display: block; margin: 0 0 0.125em;  /* 2px */}
		li input:checked + ol > li:last-child { margin: 0 0 0.063em; /* 1px */ }	
	
#footer {
clear : both;
/* width : 1000px; */
min-width: 1000px;
width: 100%;
max-width: 1920px;
margin : 0 0 6em 0;
padding-top : 5px;
color : #777;
border-top : 1px solid #444;
background : inherit;
}
#footer .right {
float : right;
}
#footer .center {
text-align-last: center; 
}
#footer a {
text-decoration : none;
background : inherit;
}

table {
    width:95%;
}
table th { 
    border-collapse: collapse;
	padding: 5px;
    text-align: center;
}

table td {
    border-collapse: collapse;
	   padding: 5px;
    text-align: center;
}

table.style2 {
    width:95%;
}
table.style2 th {
    border: 1px solid black; 
    border-collapse: collapse;
	padding: 5px;
    text-align: center;
}

table.style2 td {
    border: 1px solid black; 
    border-collapse: collapse;
	   padding: 5px;
    text-align: center;
}

table.style2#t01 tr:nth-child(even) {
    background-color: #eee;
}
table.style2#t01 tr:nth-child(odd) {
   background-color:#fff;
}
table.style2#t01 th {
    background-color: black;
    color: white;
}
table.style3 {
    width:65%;
}
table.style3 th {
    border: 1px solid black; 
    border-collapse: collapse;
	padding: 5px;
    text-align: center;
}

table.style3 td {
    border: 1px solid black; 
    border-collapse: collapse;
	   padding: 5px;
    text-align: center;
}

table.style3#t01 tr:nth-child(even) {
    background-color: #eee;
}
table.style3#t01 tr:nth-child(odd) {
   background-color:#fff;
}
table.style3#t01 th {
    background-color: black;
    color: white;
}

#myProgressOuter {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

#myProgress {
  width: 100%;
  background-color: grey;
  margin-bottom: 5px;
}

#myBarKulhydrat {
  width: 55%;
  height: 20px;
  background-color: #4CAF50;
  text-align: center; /* To center it horizontally (if you want) */
  line-height: 20px; /* To center it vertically */
  color: black;
}
#myBarProtein {
  width: 20%;
  height: 20px;
  background-color: #2196F3;
  text-align: center; /* To center it horizontally (if you want) */
  line-height: 20px; /* To center it vertically */
  color: black;
}
#myBarFedt {
  width: 25%;
  height: 20px;
  background-color: #f44336;
  text-align: center; /* To center it horizontally (if you want) */
  line-height: 20px; /* To center it vertically */
  color: black;
}

div#fg{
    position: absolute;
    top: 0px;
    z-index: -1;
    height: 1000px;
    left: 100%;
    width: 100%;
}

div#bg{
position: absolute;
top: 0px;
left: 0px;
z-index: -1;
width: 100%;
height: 100%;
}