body {
 font-size: 16px;
 font-family: "Tahoma";
 background-image: linear-gradient(darkblue, lightblue);
 color: yellow;
}

#intro {
background-image: linear-gradient(darkblue, lightblue);
 z-index: 3;
 position: fixed;
 top: 0px;
 left: 0px;
 padding: 0px;
 width: 100%;
 height: 100%;
 color: yellow;
 font-family: "Tahoma";
 display: block;
}

#intro2 {
  width: 480px;
  padding: 10px;
}

#resultaten {
 font-size: 18px;
 font-family: "Tahoma";
 height:490px;
 width:485px;
 border:1px solid #ccc;
 overflow:auto;
 display: none;  /* die moet uiteindelijk weer naar none */
}

#hoofdsel {/* die mag uiteindelijk weg */
color: yellow;
}

#groepsel {/* die mag uiteindelijk weg */
color: white;
}

.va {
padding: 1px;
 width: 23px; 
 height: 20px; 
}

.rx {
 padding: 5px;
 font-size: 14px;
 vertical-align: middle;
}


#caps {
 width: 23px; 
 height: 20px; 
}

#voedinggroep, #voedinggroep2 {
 width: 280px !important;
 height: 35px;
 font-size: 16px;
}

#fname {
 font-size: 16px;
  border-radius: 5px;
 width: 200px;
}

li {
 font-size: 12px;
 color: black;
 padding: 0px;
 margin: 0px;
 font-family: "Tahoma";
}

.vak {
 font-size: 12px;
}

#accordion {
 margin-top: 10px;
 width: 500px;
 font-family: "Tahoma";
 font-size: 16px;
border 10px solid yellow !important;
}

.tooltip {
 position: relative;
 border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
 visibility: hidden;
 width: auto;
 font-size: 10px;
 background-color: black;
 color: #fff;
 text-align: left;
 border-radius: 6px;
 padding: 5px 0;

  /* Position the tooltip */
 position: absolute;
 left: 0px;
 z-index: 1;
}

.tooltip:hover .tooltiptext {
 visibility: visible;
}

table,td {
 padding: 0px;
 margin: 0px;
}
th {
 border: 0px solid red;
 padding: 6px;
 text-align: right;
}
td {
 border: 1px solid blue;
 text-align: center;
width:50px;
 font-size: 12px;
}

#pop {
 width: 474px;
height: 1000px;
 background-color: blue;
 border: 2px solid black;
 z-index: 2;
 position: fixed;
 top: 10px;
 left: 10px;
 padding: 10px;
 opacity: 1; /*was 0.92, om een heel klein beetje doorzichtig te zijn */
 display: none;
}

#pophuidig {
color: yellow;
}

#poplijst {
color: white;
}

.grijs {
color: blue;
};

#popsort, #popnumber {
 font-size: 12px;
}

#popelt {
 color: white;
}

.popbutton {
height: 28px;
width: 50px;
 font-size: 14px;
}

#dummy {
display: none;
}

.rad {
  padding: 5px;
  margin: 3px;
}

.tabel1 table,.tabel1 tr,.tabel1 th {
 border: 1px solid gray;
 font-family: "Tahoma";
 font-size: 10px;
text-align: center;
}

.tabel1 td {
 color: blue;
 border: 1px solid gray;
 font-family: "Tahoma";
 font-size: 10px;
 width: 30px;
}

#sluit {
position: absolute;
right: 0px;
top: 0px;
 width: 20px;
}

#meer {
color: yellow !important;
}

.ui-collapsible-content{
    border: solid 10px red;
}

.pop2 {
 width: 100px;
 height: 100px;
 background-color: lightblue;
 color: darkblue;
position: absolute;
left: 200px;
 z-index: 4;
display: none;
 font-size: 14px;
 font-family: "Tahoma";
border: 2px solid black;
}

#super {
border: 1px solid red;
border-style: dashed;
padding: 5px;
padding-bottom 15px !important;
width: 494px;
}

#help {
color: lightgreen;
 z-index: 2;
 position: fixed;
 top: 10px;
 left: 460px;
 font-size: 12px;
}

#pophelp {
 width: 474px;
color: black;
 font-size: 14px;
height: 850px;
 background-color: lightblue;
 border: 2px solid black;
 z-index: 2;
 position: fixed;
 top: 10px;
 left: 10px;
 padding: 10px;
 text-align: left;
 opacity: 1; /*was 0.92, om een heel klein beetje doorzichtig te zijn */
display: none;
}

#hulptext {
border: 1px solid red;
width: 400px;
 color: black;
 font-size: 14px;
}

p {
padding-left: 20px;
}
