@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap');

#main {
	background-color:#000;
	background: url('images/space.webp') center center fixed repeat;
	background-size: cover;
	height:100%;
	width:100%;
	}

body {
    font-family: 'Roboto', sans-serif !important;
	font-weight: 900 !important;
	color: #fff;
}


#tasklist {
	width: 40vh;
}


#task {
	width: 38vh;
	background-color: #ddd;
	border: 0.5vh solid #888;
	border-radius: 1vh;
	margin: 1vh;
	padding: 0.5vh;
	vertical-align: center;
	font-size: 2vh;
	font-weight: 900;
}

#sabotage {
	display: block;
	width: 38vh;
	box-sizing: border-box;
	background-color: #ddd;
	border: 0.5vh solid #888;
	border-radius: 1vh;
	margin: 1vh;
	padding: 0.5vh;
	vertical-align: center;
	font-size: 2vh;
	text-align: center;
}

#taskstatus {
	text-align: right;
}

.status-0 {
	font-weight: 900;
}

.status-1 {
	font-weight: 900;
	Background-color: #6f6 !important;
}

.status-2 {
	font-weight: 900;
	Background-color: #f66 !important;
}

#netwerk {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
/*a{
	display:inline-block;
	height: 6vh;
	width: 6vh;
	margin:0.5vh;
}

.a{
	height: 6vh;
	width: 6vh;
	transition: filter 0.1s;
}
.a:hover {
	filter: brightness(75%);
}*/

#sub{
	width: 40vh ;
	margin: 3vh auto;
	background-color:#bbb;
	Padding: 1vh;
	Border-radius:1vh;
	box-shadow: 0 0 5px black;
	border: 0.8vh solid #666;
	-webkit-text-stroke-color: #000;
	-webkit-text-fill-color: #fff;
	-webkit-text-stroke-width: 0.1vh;
	font-weight: 900;
}

label{font-size:2vh;}

/*.cont{
	background-color:#ffecbb;
	padding:1vh;
	border-radius:1vh;
	margin:1vh;
	font-size:2vh;
}*/

input[type=checkbox]{
	width:1.5vh;
	height:1.5vh;
}

/*.cont2{
	background-color:#3F250B;
	padding:1vh;
	border-radius:1vh;
	margin: 1vh auto;
	color: white;
	border-spacing:0.5vh;
}*/

/*#reg{
	display:inline-block;
	width: 100%;
	text-align:center;
	color:White;
	font-size:2vh;
}*/

h1{font-size: 4vh; text-align: center; -webkit-text-stroke: 0.2vh #000;}
h2{font-size: 3vh; text-align: center; -webkit-text-stroke: 0.15vh #000;}
h3{font-size: 2.5vh;}
p{font-size: 2vh;}
li{font-size: 2vh;}

/*#table2{
	width:75%;
	margin: 1vh auto;
	vertical-align:middle;
}*/



button {
	background-color:#6F553B;
	border-radius:1vh;
	border: 0px;
	color:white;
	padding:0.5vh;
	width: 10vh;
	display:block;
	font-size:1.8vh;
	transition:all 0.1s;
	margin:0.5vh auto;
}
#button:hover{
	background-color:#8F755B;
}

/*.number{
	font-size:1.8vh;
	width:10vh;
}*/
/*.select{
	font-size:1.8vh;
	width:15vh;
}*/

#bar{
	height: 3vh;
	Background-color: #2E402E;
	border: 0.5vh solid #ddd;
	Margin: 0 auto;
	margin-top: 3vh;
	Width:40vh;
}

#progress{
	font-size: 2vh;
	height: 3vh;
	line-height: 3vh;
	padding-left: 1vh;
	border-radius: 0;
	Background-color: #43D844;
	vertical-align: center;
	-webkit-text-stroke-color: #000;
	-webkit-text-fill-color: #fff;
	-webkit-text-stroke-width: 0.1vh;
	box-sizing: border-box;
}

#name{
	font-size:2.5vh;
	text-shadow: 0 0 15px #5A2D00, 0 0 5px black;
}

#login{
	height:80vh;
	width:45vh;
	margin: 10vh auto;
	}

#form{
	display: table;
	margin:0 auto;
	width: 100%;
	}

#logo{
	width:45vh;
	margin:auto;
	}

#input{
	background-color: #222;
	margin: 1vh auto;
	border-radius: 2vh;
	border: 0.8vh solid white;
	height: 6vh;
	width: 100%;
	text-align: center;
	font-size: 2vh;
	color: #fff;
	}
	
#button{
	margin: 1vh auto;
	border-radius: 2vh;
	border: 0.8vh solid #666;
	height: 6vh;
	width: 100%;
	text-align: center;
	font-size: 2vh;
	background-color: #bbb;
	color: #000;
	transition: background-color 0.3s;
	transition: color 0.3s;
}

#button:hover{
	background-color: #fff;
	}
td{font-size:1.8vh;}
th{font-size:1.8vh;}

.wcont {
	overflow: auto;
	height: 75vh;
}