@charset "utf-8";
/* Stylesheets */

p {
	font-family: Verdana, Tahoma, sans serif;
	font-size: 14px;
}
p10 {
	font-family: Verdana, Tahoma, sans serif;
	font-size: 10px;
}
p12 {
	font-family: Verdana, Tahoma, sans serif;
	font-size: 12px;
}

wrapper {
	width:1000px; 
	margin-left:auto; 
	margin-right:auto;
}

gr {
	color: #00CC00;
	font-weight: bold;
}

h1 {
	color: #49AA9F;
	font-size: 180%;
	font-weight: 400;
	font-style: italic;
	font-family: lobster-two;
}

h2 {
	color: #49AA9F;
	font-size: 160%;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}

h3 {
	color: #000000;	
	font-size: 160%;
	font-family: century;
	font-weight: 400;
	font-style: italic;	
}

h6 {
	color: #000000;	
	font-size: 140%;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;	
}

h4 {
	color: #000000;
	font-size: 120%;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}

h5 {
	color: #000000;
	font-size: 100%;
	font-family: arimo,veranda,sans-serif;
	font-weight: 400;
	font-style: normal;
}
L10  {color: #000000;	
	font-size: 10px;
	font-family: verdana, tahoma, sans-serif;
}
L11  {color: #000000;	
	font-size: 11px;
	font-family: verdana, tahoma, sans-serif;
}
L12  {color: #000000;	
	font-size: 12px;
	font-family: verdana, tahoma, sans-serif;
}
L13  {color: #000000;	
	font-size: 13px;
	font-family: verdana, tahoma, sans-serif;
}
L14  {color: #000000;	
	font-size: 14px;
	font-family: lobster-two, aladin, arimo, sans-serif;
}
L14rB {color: #FF0000;	
	font-size: 14px;
	font-family: verdana, tahoma, sans-serif;
	font-weight: 600;
}
L14r {color: #FF0000;	
	font-size: 14px;
	font-family: verdana, tahoma, sans-serif;
	
}
L15  {color: #000000;	
	font-size: 15px;
	font-family: verdana, tahoma, sans-serif;
}
L15L  {color: #000000;	
	font-size: 15px;
	font-align: left;
	font-style: italic;
	font-family: verdana, tahoma, sans-serif;
}
L16  {color: #000000;	
	font-size: 16px;
	font-family: verdana, tahoma, sans-serif;
}

L16p {color: #90c;	
	font-size: 16px;
	font-family: Lucida Calligraphy;
}

L16L  {color: #000000;	
	font-size: 16px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}

L18  {color: #000000;	
	font-size: 18px;
	font-family: verdana, tahoma, sans-serif;
}

L18L  {color: #000000;	
	font-size: 18px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}
L20  {color: #000000;	
	font-size: 20px;
	font-family: Lucida Calligraphy;
	font-weight: 200;
	font-style: italic;	
}
L20L  {color: #000000;	
	font-size: 20px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}
L20p  {color: #90C;	
	font-size: 18px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 100;
	font-style: italic;	
}
L22L  {color: #000000;	
	font-size: 22px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}
L24L  {color: #000000;	
	font-size: 24px;
	font-family: lobster-two, aladin, arimo, sans-serif;
	font-weight: 400;
	font-style: italic;
}
ul{
	font-family: verdana, tahoma, sans-serif;
	coclor: #000000;
	padding-bottom: 0px;
}
ulR {
    text-align: right; /*RIGHT TO LEFT DIRECTION*/
}
li{
	display: inline;
	background-color:#FFFFFF
	cell-padding: 5px;
	margin-top: 3px;
	margin-bottom: 3px;
	margin-left: 35px;
	margin-right: 35px
	border: 0px;
	font-size: 100%;
	color: #000000
	font-family: verdana, tahoma, sans-serif;
	font-style: normal;
	font-weight: 400;
}
li1{
	display:list-item;
	font-family: verdana, tahoma, sans-serif;
	font-style: italic;
	font-size: 14px;
}
	
#tekst1 {
display: none;
width: 440px;
border: 0px solid black;
background-color: #FFFFFF;
padding: 0px;
font-family: verdana, tahoma, sans-serif;
font-size: 14px;
}
#tekst2 {
display: none;
width: 440px;
border: 0px solid black;
background-color: #FFFFFF;
padding: 0px;
font-family: verdana, tahoma, sans-serif;
font-size: 14px;
}
#tekst3 {
font-family: verdana, tahoma, sans-serif;
font-size: 10px;
}

.radio{
	background-image:url(../images/vinkenkruis1.jpg);
}
.radioSelected{
	background-image:url(../images/vinkenkruis2.jpg);
}
 
	
	

a{
	text-decoration: none;
	
}

a:hover{
	text-decoration: bold;
	text-color:#0033CC ;
	font-weight: 400;
	
	
}

BODY { 
	color: #000000; 
	background:url(../../Images/Achtergrond7c.jpg)fixed; 
}
BODY(oud) { 
	color: #000000; 
	background:url(../../Images/Achtergrond%204.jpg)fixed; 
}


.adbox1{
	width: 150px;
	height: 200px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}

.adbox2{
	width: 150px;
	height: 150px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}
.adbox3{
	width: 400px;
	height: 50px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}

.adbox4{
	width: 80px;
	height: 200px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}

.adbox5{
	width: 218px;
	height: 200px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}
.adbox6{
	width: 210px;
	height: 200px;
	margin-right:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}

.box1{
	width: 400px;
	height: 400px;
	margin-left:5px;
	margin-top:5px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:0px;
}
.box2{
	width: 350px;
	height: 300px;
	margin-left:10px;
	margin-top:10px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:5px;
}
.box3{
	width: 448px;
	height: 335px;
	margin-left:5px;
	margin-top:5px;
	border: 1px solid #EAEEEA;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    background-color:#FFFFFF;
    padding:0px;
}

.countdown{
	$datum1 = '19811205'; // Mijn geboorte datum (YYYYMMDD)
    $datum2 = date("Ymd"); // Huidige datum (YYYYMMDD)

    $aantal_dagen_in_datum1 = daysInDate($datum1);
    $aantal_dagen_in_datum2 = daysInDate($datum2);

    $verschil = $aantal_dagen_in_datum2 - $aantal_dagen_in_datum1;

    echo 'Ik ben nu ' . $verschil . ' dagen oud';
}

.mytext {
    width: 50px;
}
.mytext1 {
    width: 100px;
}
.mytext2 {
    width: 200px;
}
.mytext10 {
    width: 200px;font-family: verdana, tahoma, sans-serif;
font-size: 10px;
}
.mytext12 {
	font-family: verdana, tahoma, sans-serif;
font-size: 12px;
}
.dropt{
	span.dropt {border-bottom: thin dotted; background: #ffeedd;}
span.dropt:hover {text-decoration: none; background: #ffffff; z-index: 6; }
span.dropt span {position: absolute; left: -9999px;
  margin: 20px 0 0 0px; padding: 3px 3px 3px 3px;
  border-style:solid; border-color:black; border-width:1px; z-index: 6;}
span.dropt:hover span {left: 2%; background: #ffffff;} 
span.dropt span {position: absolute; left: -9999px;
  margin: 4px 0 0 0px; padding: 3px 3px 3px 3px; 
  border-style:solid; border-color:black; border-width:1px;}
span.dropt:hover span {margin: 20px 0 0 170px; background: #ffffff; z-index:6;} 
}

body {font-family: Arial, Helvetica, sans-serif;}
* {box-sizing: border-box;}

input[type=text], select, textarea {
  width: 100%;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 6px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 8px 8px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 10px;
}

/*footer en paginanummer:*/
footer {
  font-size: 9px;
  color: #f00;
  text-align: center;
}

@page {
  size: A4;
  margin: 10mm;
}

@media print {
  footer {
    position: fixed;
    bottom: 0; }


  .page-break {
	   page-break-after: auto; }
  .content-block, p {
    page-break-after: auto; }

  .html, body {
    width: 210mm;
    height: 297mm; }
}

.header, .header-space,
.footer, .footer-space {
  height: 100px;
}
.header {
  position: fixed;
  top: 0;
}
.footer {
  position: fixed;
  bottom: 0;
}

@page:center {
  @bottom-center {
    content: counter(page) " of " counter(pages);
  }
}
#content {
    display: block;
    page: table-of-contents;
    counter-reset: page 1
}

#pageFooter {
    display: table-footer-group;
	align: center;
}
#pageFooter:after {
    counter-increment: page;
    content: counter(page) " van " counter(pages);
	align: center; }
/* voor offertes */
O1{ 
	color: #000000;	
	font-size: 14px;
	font-family: verdana, tahoma, sans-serif;
}
O1v{ 
	color: #000000;	
	font-size: 14px;
	font-weight: bold;
	font-family: verdana, tahoma, sans-serif;
}
O2{ 
	color: #000000;	
	font-size: 15px;
	font-family: verdana, tahoma, sans-serif;
}
O2v{ 
	color: #000000;	
	font-size: 15px;
	font-weight: bold;
	font-family: verdana, tahoma, sans-serif;
}
O3{ 
	color: #000000;	
	font-size: 16px;
	font-family: verdana, tahoma, sans-serif;
}
O3v{ 
	color: #000000;	
	font-size: 16px;
	font-weight: bold;
	font-family: verdana, tahoma, sans-serif;
}
O4{ 
	color: #000000;	
	font-size: 17px;
	font-family: verdana, tahoma, sans-serif;
}
O4v{ 
	color: #000000;	
	font-size: 17px;
	font-weight: bold;
	font-family: verdana, tahoma, sans-serif;
}
O5{ 
	color: #000000;	
	font-size: 18px;
	font-family: verdana, tahoma, sans-serif;
}
O5v{ 
	color: #000000;	
	font-size: 18px;
	font-weight: bold;
	font-family: verdana, tahoma, sans-serif;
}

<!--pagteller-->
#content {
    display: table;
}

#pageFooter {
    display: table-footer-group;
}

#pageFooter:after {
    counter-increment: page;
    content: counter(page);
}
.watermark{
color:green;
background-color:rgba(255, 0, 0, 0.5);
height:30px;
width:100px;
display:flex;
opacity: 30%;
align-items:center;
justify-content:center;
position:fixed;
bottom:5px;
right:5px;
}

/* Popup container */
.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}