body{
	width: 100%;
  margin: 0px;
  padding: 0px;
	text-align: center;
}

.hidden{
  display: none;
}

div.bg{
  position: fixed;
	width: 100%;
	height: 100%;
	margin: 0px;
	text-align: center;
	vertical-align: middle;
	padding-top: 5%;
	z-index: -2;
}

img.bg{
	width: auto;
	height: 80%;
	opacity: 0.05;
}

div.centerpage{
	padding-top: 1px;
	margin-left: calc(50% - 200px);
	text-align: left;
	max-width: 500px;
}

div.fixedpage{
	padding-top: 5%;
}

a{
	text-decoration: none;
}

label.closeby{
  margin-left: 0px;
}

table tr td{
  border-collapse: collapse;
}

input.menu{
	font-weight: normal;
  position: fixed;
	width: 110px;
	height: 70px;
	padding: 0px;
	border: 2px solid black;
	border-radius: 50%;
	text-align: center;
}

input.menu:hover{
	font-size: 0.9em;
	font-weight: bold;
  background-image: radial-gradient(
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb1{
	margin-top:50px;
	margin-left: -350px;
  background-image: linear-gradient(135deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb2{
	margin-top: 100px;
	margin-left: -375px;
  background-image: linear-gradient(100deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb3{
	margin-top: 150px;
	margin-left: -350px;
  background-image: linear-gradient(75deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb4{
	margin-top: 200px;
	margin-left: -325px;
  background-image: linear-gradient(40deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb5{
	margin-top: 250px;
	margin-left: -350px;
  background-image: linear-gradient(75deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulb6{
	margin-top: 300px;
	margin-left: -375px;
  background-image: linear-gradient(75deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.logout{
	margin-top: 350px;
	margin-left: -350px;
  background-image: linear-gradient(75deg
	, rgb(255,255,201)   0%
	, rgb(255,225,255) 100%
	);
}

input.bulbR1{
	margin-top:80px;
	margin-left: 260px;
  background-image: linear-gradient(225deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulbR2{
	margin-top: 180px;
	margin-left: 300px;
  background-image: linear-gradient(260deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

input.bulbR3{
	margin-top: 290px;
	margin-left: 300px;
  background-image: linear-gradient(285deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

div.small{
	font-size: 0.8em;
}

div.biginputbox{
  width: 400px;
  max-width: 400px;
  margin-top: 5px;
  margin-bottom: 5px;
  border: 2px solid black;
  border-radius: 10px;
  background: none;
  background-image: linear-gradient(
      180deg
    , rgb(222,240,255)   0px
    , rgb(230,255,240)  22px
    , rgb(255,255,255)  26px
    , rgb(255,255,255) 100%
    );
}

div.biginputbox > label{
  display: block;
  padding-left: 15px;
  height: 0px;
}

div.biginputbox:focus-within{
	border: 2px solid blue;
  background-image: linear-gradient(
      180deg
    , rgb(186,225,255)   0px
    , rgb(186,255,201)  22px
    , rgb(255,255,255)  26px
    , rgb(255,255,255) 100%
    );
}

div.biginputbox:hover:not(:focus-within){
  border-color: black;
  color: black;
}

div.biginputbox > label{
  font-weight: bold;
}

.inform{
  font-size: 1.2em;
  height: 33px;
  width: 100%;
  padding-left: 10px;
  padding-right: 10px;
  background: none;
	border: none;
  border-radius: 0px 0px 10px 10px;
  resize: none;
  outline: none;
}

.txtform{
  height: 140px;
}

input[type="checkbox"].chkbox{
	padding: 0px;
	margin: 0px;
	margin-right: 10px;
	margin-bottom: 5px;
	width: 22px;
	height:22px;
	display: inline;
  border: 0px;
	outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

label.chkbox{
	margin-left: 20px;
}

input.sbmform[type="submit"]{
  font-size: 1.0em;
  border-radius: 10px 10px 10px 10px;
	border: 2px solid black;
	width: 404px;
	height: 35px;
	font-weight: bold;
  background-image: linear-gradient(90deg
	, rgb(186,255,201)   0%
	, rgb(186,225,255) 100%
	); 
}

textarea{
  height: 100px;
  padding-top: 5px;
}

table.kaart{
  margin: 3px;
  border: 2px solid black;
	width: 404px;
  border-radius: 10px;
  overflow: hidden;
}

table.kaart tr{
  padding: 0px;
  margin: 0px;
}

table.kaart td{
  padding: 0px;
  margin: 0px;
  padding-left: 10px;
}

.loopkaart{
  background-image: linear-gradient(90deg
	, rgb(230,255,240)   0%
	, rgb(222,240,255) 100%
	);
}

.kosten{
  background-image: linear-gradient(75deg
	, rgb(255,255,201)   0%
	, rgb(222,240,255) 100%
	);
}

table.loopkaart tr:first-child{
  padding-top: 10px;
}

input.loopkaartdel{
  border: none;
  padding: 5px;
  border-radius: 10px;
  width: 100px;
  height: 30px;
  background-image: linear-gradient(75deg
	, rgb(255,255,201)   0%
	, rgb(255,225,255) 100%
	);
}


input.loopkaartdel:hover{
  font-weight: bold;
}

.formerror{
  color: red;
  font-style: italic;
}

.small{
  font-size: 0.6em;
}

tr.udrln td{
  border-bottom: 1px dotted rgb(100,100,155);
  color: rgb(100,100,100);
}

div.dev{
  padding: 10px;
  color: #6C1AC9;
  border: 2px solid #6C1AC9;
  border-radius: 10px;
  padding-bottom: 25px;
}

div.dev>label{
  background-color: #6C1AC9;
  color: white;
  padding-left: 10px;
  padding-right: 10px;
  font-weight: bold;
  position: relative;
  top: -20px;
  border: 2px solid #6C1AC9;
  border-radius: 10px;
}

div.dev ul{
  margin-top: 0px;
  padding-left: 25px;
  list-style: none;
}
.red{
  color: rgb(139, 0, 0);
}

div.dev ul li:before {
  content: '✓ ';
  color: darkgreen;
  position: float;
  left: -15px;
}

div.dev ul li.q:before {
  content: 'Q:';
  color: Blue;
}

div.dev ul li.a:before {
  content: 'A:';
  color: blue;
}

div.dev ul li.o:before {
  content: '~';
  color: blue;
}

div.dev ul li.x:before {
  content: '✗';
  color: red;
}

div.dev ul li p{
  display: inline;
}