body {
   touch-action: none;
}

:root {
  --size: 64px;
}
table {
   margin-left:auto;
   margin-right:auto;
}
#tblAll {
   text-align:center;
}
h3 {
   background-color:lightblue;
   color:blue;
   margin-top:3px;
   margin-bottom:3px;
   border-radius:7px;
   text-align:center;
}

.svgKnop {
   width: var(--size);
   cursor: pointer;
}
.svgKnopBG1 {
   stroke:blue;
   stroke-width:2;
   fill:lightblue;
   rx:25%;
}
.svgKnopBG2 {
   stroke:green;
   stroke-width:2;
   fill:lightgreen;
   rx:25%;
}
.svgKnopFig1 {
   stroke:black;
   stroke-width:2;
   fill:skyblue;
}
.svgKnopFig2 {
   stroke:darkgreen;
   stroke-width:2;
   fill:lightseagreen;
}

#tblProgress td{
   font-family:arial;
   font-size:1.5em;
   text-align:center;
   vertical-align:middle;
}
#tdPosition {
   width:40px;
}

#tblKnoppen td{
   font-family:arial;
   font-size:x-small;
   text-align:center;
   vertical-align:top;
}
#spLoopStart, #spLoopEnd {cursor:pointer;}

#scherm {
   position: absolute;
   left: 0; top: 0;
   background-color: white;
   width: 100%;
   height: 100%;
   opacity: 0.5;
   visibility: hidden;
}
#divSettings {
   position: absolute;
   overflow: auto;
   border: 1px solid gray;
   border-radius: 15px;
   box-shadow:5px 10px 10px #888888;
   background-color: white;
   font-size: 1em;
   display: none;
   padding: 10px;
   text-align:center;
}

#txtVideoID{
   font-size: 1.2em;
   width:250px;
}
#spPasteUrl {
   cursor:pointer;
}
#txtLoopPoints{
   font-size: 1.2em;  
}
#tblSettings td:nth-child(1){
   text-align:right;
}

.knop {
   background-color: silver;
   border:1px solid gray;
   border-radius: 5px;
   padding: 1px 10px 1px 10px;
   text-align:center;
   cursor: pointer;
   display:inline-block;
   min-width:60px;
   font-size: 1.33em;
   cursor:pointer;
}

/* sluitknop class */
.sluitknop{
    background: -ms-linear-gradient(white, red); /* For IE */
    background: -webkit-linear-gradient(white, red); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(white, red); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(white, red); /* For Firefox 3.6 to 15 */
    background: linear-gradient(white, red); /* Standard syntax (must be last) */
    border:1px solid #888888;
   border-radius:15px;
   -moz-border-radius:15px;
   -webkit-border-radius:15px;
   text-align: center;
   vertical-align: middle;
   cursor: pointer;
   font-family:arial;
   font-size:60%;
   padding: 2px 1px 0px 1px;
   margin-top:1.2px;
   margin-right:5px;
   width:18px; height:15px;
   float:right;
}
.sluitknop:hover{
    background: -webkit-linear-gradient(white, lightblue); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(white, lightblue); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(white, lightblue); /* For Firefox 3.6 to 15 */
    background: linear-gradient(white, lightblue); /* Standard syntax (must be last) */
}


.numTable {
   -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; 
   /*pointer-events: none;*/
}
.numTable td{
   font-size:1.7em;
   border: 1px solid darkgray;
   border-radius: 2px;
   padding: 2px 6px 0px 6px;
   text-align:center;
}
.numTable td:nth-child(2){
   width:70px;
}
.numTable td:nth-child(2n-1){
   background-color:silver;   
   width:30px;
   cursor:pointer;
}

#divInpLoopPts {
   position: absolute;
   overflow: auto;
   border: 1px solid gray;
   border-radius: 15px;
   box-shadow:5px 10px 10px #888888;
   background-color: white;
   font-size: 1em;
   /*display: none;*/
   padding: 10px;
   text-align:center;
}
#tblILP td{vertical-align:top;}
#tblInpLPts, #tblLPts {
   -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; 
}
#tblInpLPts td  {
   border: 1px solid gray;
   border-radius: 5px;
   padding: 5px;
   width: 40px;
   font-size: 1.8em;
   cursor:pointer;
   background-color:whitesmoke;
}
#tblLPts {width:80px;}
#tblLPts td {
   border: 1px solid gray;
   border-radius: 5px;
   padding: 3px;
   min-width: 40px;
   font-size: 1em;
   cursor:pointer;
   background-color:whitesmoke;
   vertical-align:middle;
}
#tblLPts td img{
   vertical-align:text-top;
   pointer-events: none;
}

#divInpLPtsW{
   display:inline-block;
   font-size: 1.8em; 
   vertical-align:top;
   padding: 5px;
}
#divInpLPts {
   border: 1px solid gray;
   border-radius: 5px;
   padding: 5px;
   margin-left:auto;margin-right:auto;
   width: 70px;
   height:30px;
   font-size: 1.8em; 
   display:inline-block;   
}