html {
width: 100%;
height: 100%;
}

body {
padding: 0px;
margin:0px;
font-family: Helvetica, Verdana, Arial, sans-serif;
line-height: 1.2em;
font-size:100%;
background: #1bb524;
onload="noBack();"  onpageshow="if (event.persisted) noBack();" onunload="" ;
}


.logo {
position: absolute; 
top: 20px;
width: 100%;
margin-left: auto;
margin-right: auto;
line-height: 1.2em;
font-size:250%;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}
.logo1 {
position: absolute; 
top: 20px;
width: 100%;
margin-left: auto;
margin-right: auto;
line-height: 1.2em;
font-size:250%;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}
.header {
height: 128px;
font-size:100%;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
position: relative; 
border-bottom: 1px solid #000000;
background-color: #1303d2; 
display:block;
width:100%;	
padding: 5px 0px 5px 0px;
z-index:3;
}
.loginbc {
float: left;
position: relative; 
line-height: 1.2em;
font-size:150%;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration:none;
}

.abc {
position: relative; 
float: right;
}
.midden {
top: 10px;
float: left;
position: relative; 
clear: both;
width: 100%;

} 

.scherm {
width: 100%;
}
.box {
height: 100%;
}
.geel {
top: 100px;
line-height: 1.2em;
background-color:#FFFF00;
border-width: 0px; 
height:100%;
width:100%;
position:fixed;
left:0;
top:0;
z-index:1;

}
.rood {
top: 100px;
line-height: 1.2em;
background-color:#FF0000;
border-width: 0px; 
height:100%;
width:100%;
position:fixed;
left:0;
top:0;
z-index:1;

}


.namen {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
height: 125px;
line-height: 125px;
vertical-align: middle;
width: 48%;
min-width: 130px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
border-bottom-left-radius: 30px;
border-bottom-right-radius: 30px;
border-color: #000000;
border-style: inside;
text-decoration:none;


}
.namen2 {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
height: 400px;
line-height: 125px;
vertical-align: middle;
width: 48%;
min-width: 130px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
border-bottom-left-radius: 30px;
border-bottom-right-radius: 30px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}
.nummers {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
height: 125px;
line-height: 125px;
vertical-align: middle;
width: 31%;
min-width: 130px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 30px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 30px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}
.letters {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
height: 110px;
line-height: 110px;
vertical-align: middle;
width: 23%;
min-width: 110px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}
.saldo {
padding: 3px 0px 3px 0px;
border-bottom: 1px solid #000000;
background-color:#D5EFF6;
color: #000000;

}
.transacties {
padding: 3px 0px 0px 0px;
}
.bestellingtotaal {
font-size:200%;
padding: 50px 0px 0px 0px;
}
.ok {
padding: 50px 0px 0px 0px;
}
.kleur{
width: 180px; 
background-color: #1FADCF; 
top: 0px; 
float: right; 
font-size: 36px;
border-width: 0px; 
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;

}
.kleur2{
color: #000000;
font-weight: bold;
line-height: 40px;
width: 230px; 
background-color: red; 
top: 0px; 
float: right; 
font-size: 48px;
border-width: 0px; 
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;

}
.kleur3{
top: 10px;
background-color:#D5EFF6;
color: #000000;
font-weight: bold;
line-height: 40px;
width: 230px; 
top: 0px; 
float: right; 
font-size: 24px;
border-width: 0px; 
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;

}
.footer {
font-size:250%;
line-height:120%;
position: fixed;
bottom: 0;
left: 0;
clear:both;
padding: 3px 0px 3px 0px;
color: #000000;
font-family: Helvetica, Verdana, Arial, sans-serif;
text-decoration:none;
border-top: 3px solid #000000;
background-color: #FFFF00; 
display:block;
width:100%;	
z-index:2;
}





.keypad {
width: 100%;
}
.keypadnaam {
margin: 1% 1% 1% 1%;
height:110px; 
width: 70%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
line-height: 110px;
vertical-align: middle;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}

.keypaddisplay {
margin: 1% 1% 1% 1%;
height:50px; 
width: 70%;
font-size:150%;
}

    .Table
    {
margin: 1% 1% 1% 1%;
clear:both;
display: table;
width: 98%;
    }
.Title
    {
display: table-caption;
    }
.Heading
    {
background-color:#1FADCF;
display: table-row;
font-weight: bold;
text-align: center;
color: #ffffff;
font-size: 150%;
    }
.Row
    {
display: table-row;

    }
.Cell
    {
display: table-cell;

    }

.beheer {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 130%;
background: #d6f9ff;
height: 100px;
line-height: 100px;
vertical-align: middle;
width: 98%;
min-width: 130px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}

.saldoselect {
clear:both;
display: block;
margin: 1% 1% 1% 1%;
height:110px; 
width: 70%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 170%;
background: #d6f9ff;
line-height: 110px;
vertical-align: middle;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}

.saldoselect1 {

display: block;
margin: 1% 1% 1% 1%;
height:125px; 
width: 47.5%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
position: relative;
float: left;
font-size: 170%;
background: #d6f9ff;
line-height: 125px;
vertical-align: middle;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;
}

.productoverzichttitel {
width: 70%;
background-color:#1FADCF;
color: #ffffff;
clear: both;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

.productoverzichttitel2 {
width: 95%;
background-color:#1FADCF;
color: #ffffff;
clear: both;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}

.productoverzicht {
background-color:#D5EFF6;
margin: 3px 5px 3px 5px;
color: #000000;
font-size: 130%;
line-height: 130%;

}
.productoverzichtinhoud {
margin: 0% 0% 0% 10%;
}
.adminlayout {
background: white; 
width: 50%; 
color: black; 
line-height: 150%;
}
.adminlayout2 {
background: white; 
width: 95%; 
color: black; 
line-height: 140%;
}

.modern {
margin: 1% 1% 1% 1%;
text-align: center;
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
background: #d6f9ff;
vertical-align: middle;
width: 48%;
min-width: 130px;
position: relative;
display: block;
float: left;
border-width: 0px; 
border-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-color: #000000;
border-style: inside;
text-decoration:none;


}

.modernheader{
width: 100%; 
background-color: #1FADCF; 
top: 0px; 
font-size: 18px;
line-height: 24px;
border-width: 0px; 
border-top-right-radius: 10px;
border-top-left-radius: 10px;

}

.modernfooter{
width: 100%; 
background-color: #1FADCF; 
line-height: 24px;
bottom: 0px; 
font-size: 16px;
border-width: 0px; 
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}

.modernmidden{
width: 100%; 
bottom: 0px; 
border-width: 0px; 
color: #000000;
font-weight: bold;
background-color:#D5EFF6;
font-size: 150%;
background: #d6f9ff;
height: 120px;
line-height: 120px;
}

.modernok{
display: block;
background-color: green;
color: #000000;
font-weight: bold;
width: 80px; 
top: 0px; 
float: right; 
font-size: 24px;
border-width: 0px; 
text-decoration:none;
}

.modernok a:link {
text-decoration:none;
  color: white;
}
.modernnaam{
margin: 1% 1% 1% 1%;
color: #000000;
top: 0px; 
border-width: 0px; 
display: block;
float: left;

}
.modernbedrag{
background-color:#FFFF00;
color: #000000;
top: 0px; 
float: right;
border-width: 0px; 
display: block;
width: 100px; 

}

@media handheld,screen and (max-width: 300px),
screen and (max-device-width: 300px) {

.loginbc {
display:none;
}

.footer {
display:none;
}

.logo {
display:none;
}

}