body
{
	background-color:	#fff;
	color:            black;
	font-size:        11px;
	color:            black;
	font-family:      arial;
  padding:          0;
  margin:           0;
}

body.webuser
{
	margin: 0;
}

.webuser
{
	background-color:	#ffffff;
}

.footer
{
	font-family:    arial;
	font-size:      11px;
	text-align:     right;
	padding-right:  5px;
  background-color:#ededee;
  padding:         2px 0 2px 0px;
  color:           white;

}

.footer A
{
	color: #3C4764;
}

.footer A:hover
{
	color: #3C4764;
}

.topmenu
{
	font-family:    arial;
	font-size:      11px;
	padding-right:  20px;
	text-align:     right;
	background:     #ededee;
  padding-top:    4px;
  padding-bottom: 4px;
  color:          #555;
}

.topmenu A
{
color:#555;
font-weight:bold;
}

button.normal,
INPUT.normal
{
	border:       1px solid black;
	font-size:    11px;
	font-family:  arial;
	margin:       0px;
}

INPUT.button.normal
{
	width: 100px;
}

INPUT.webuserbtn
{
	border:       1px solid black;
	font-size:    9px;
	font-family:  arial;
	margin:       0px;
}

INPUT.button.webuserbtn
{
	width: 150px;
}

INPUT.searchfield
{
	border:       1px solid black;
	font-size:    11px;
	font-family:  arial;
	margin:       0px;
	width:        200px;
}

H1
{
	background-color: #808080;
	width:            100%;
	font-size:        9px;
	font-weight:      bold;
	color:            white;
	padding:          1px;
	padding-left:     5px;
	margin-bottom:    4px;

}

H2
{
	color:            white;
	background-color: #db1120;
	width:            100%;
	font-size:        14px;
	font-weight:      bold;
	padding:          2px;
	padding-left:     5px;
	margin-bottom:    4px;

	font-family:      arial;
}

H2.webuser
{
	background-color: #1b365d;
}

table
{
	font-family:  arial;
	color:        #000000;
	font-size:    11px;
}

td
{
	font-size:  11px;
}

font.note
{
	color:        #0000ff;
	font-size:    9px;
	font-family:  arial;
}

.arial
{
	color:        black;
	font-size:    9px;
	color:        black;
	font-family:  arial;
}

.arialbold
{
	color:          black;
	font-size:      9px;
	font-weight:    bold;
	color:          black;
	text-transform:	uppercase;
	font-family:    arial;
}

.login
{
	width:            150px;
	height:           19px;
	font-size:        10px;
	color:            white;
	border:           2px solid #c0c0c0;
	background-color:	#c0c0c0;
	font-weight:      bold
}

.toplogin
{
	width:       600px;
	height:      550px;
	position:    absolute;
  top:         15px;
  left:        50%;
	margin-left: -300px;
}

.loginInputField
{
	width:       150px;
	height:      19px;
	font-size:   10px;
	color:       #c0c0ff;
	border:      2px solid #c0c0c0;
	font-weight: bold
}

.content
{
	padding: 10px;	
}
.content TABLE
{
  background-color:     #959595;
  font-size:            13px;
}
.content FIELDSET TABLE 
{
  background-color:#fff;
}

.content TABLE TD
{
  padding:    3px;
}

.menuleft
{
	font-family:    arial;

	color:          black;
	background:     #ededee;
	padding-left:	  0px;
	width:          232px;
	line-height:    6px;
	padding-top:    -10px;
	letter-spacing:	1px;
}

.menuleft A
{
	color:           #000;
  font-family:     arial,sans-serif;
	text-decoration: none;
	padding:         0px;
  display:         block;
  background-color:#ffffff;
  font-size:       14px;
  padding:         6px 0 6px 25px;

}

.menuleft A:hover,
.menuleft A.menuitemfocus

{
	color:            #1b365d;
  text-decoration:  underline;
}

.menuleft HR
{
	color:      #FCA311; 
	height:     0px; 
	text-align:	left;
	width:      150px;
	border-top:	1px solid	#FCA311;
}

.menuright
{
	font-family:  arial;
	font-size:    9px;
	color:        black;
	background:   #fff;
	padding-left:	15px;
	width:        2px;
	line-height:  127%;
	text-align:   left;
}

.menuright A
{
	color:           black;
	text-decoration: none;
	padding:         2px;
	padding-left:    0px;


}

.menuright A:hover
{
	background-color:	#CDE5F9;
	color:            #3C4764;
	border:           1px solid #3C4764;
}

.menuright HR
{
	color:      #3C4764;
	height:     1px;
	text-align:	left;
	width:      150px;
	border:     1px dotted #3C4764;
}

.pccijfers
{
	border:      1px solid black;
	width:       35px;
	font-size:   11px;
	font-family: arial;
	margin:      0px;
}

.pcletters
{
	border:       1px solid black;
	width:        22px;
	font-size:    9px;
	font-family:  arial;
	margin:       0px;
}

.subscribertextfield
{
	width:       200px;
	border:      1px solid black;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.daymonth
{
	width:       20px;
	border:      1px solid black;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.year
{
	width:       35px;
	border:      1px solid black;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.resultclass
{
	background: #ffffff;
	border:     1px solid;
	position:   relative;
	top:        -2px;
	left:       0px;
	width:      200px;
	z-index:    4;
}

.pdfurl
{
	border:      1px solid black;
	width:       300px;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.klantcode
{
	border:      1px solid black;
	width:       300px;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.pdfnaam
{
	border:      1px solid black;
	width:       200px;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

.addtodb
{
	border:      1px solid black;
	width:       150px;
	font-size:   9px;
	font-family: arial;
	margin:      0px;
}

#selectDiv A.menuitemfocus
{
  font-weight:bold;
}

.content A
{

color:    #000;
}

H3
{
background-color:#000 !important;
color:white;
padding:5px;
margin:0;
}

.webuser-vibs-header {
	text-align: left;
	color:white;
	position: sticky; 
	top: 0;
	background-color: #959595;
	font-weight: normal;
	font-size: 11px;
}

.tooltip {
	position: relative;
	display: inline-block;
  }

  .tooltip .tooltiptext {
	visibility: hidden;
	width: fit-content;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	bottom: 150%;
	left: 50%;
	margin-left: -75px;
	opacity: 0;
	transition: opacity 0.3s;
  }

  .tooltip .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
  }

  .tooltip:hover .tooltiptext {
	visibility: visible;
	opacity: 1;
  }
  
  .overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.7);
	transition: opacity 500ms;
	visibility: visible;
	opacity: 1;
  }
  .popup {
	margin: 70px auto;
	padding: 20px;
	background: #fff;
	border-radius: 5px;
	width: 70%;
	position: relative;
	transition: all 5s ease-in-out;
  }

  .popup h2 {
	margin-top: 0;
	color: #333;
	font-family: Tahoma, Arial, sans-serif;
  }
  .popup #close-button {
	position: absolute;
	top: 20px;
	right: 30px;
	transition: all 200ms;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #333;
  }
  .popup #close-button:hover {
	color: #06D85F;
  }
  .popup .content {
	max-height: 70%;
	overflow: auto;
	margin-top: 25px;
  }

  button#select-button {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    position: fixed;
    top: 75%;
    left: 75%;
}