/* pmplus style sheet 
	Tool: HTML Kit. It is simple, and enables one to practise the basic skills, learning by doing. 
	Content management excellent larger organisations.
	The visibility of special effects is limited, then use a browser like Chrome and Explorer for testing. 
	Also the Google analytics scripts are timeconsuming in the Kit viewer, you must exclude them.
	The browsers perform better. 
  Comments: Thanks to Wybe Websters van http://sceneone.nl/ 
	Through his clear guidance i was able to realise the structure of this site and acquire Html and CSS fundamentals.
	Also Thanks to Hans de Jong. His http://www.handleidinghtml.nl/ is extremely helpful in many cases. 
	Furthermore a lot of boards are available for specific problems, with a little help from a search engine. 
*/

body{
background-color: #fff;/*#CEE3F6;/*#CED8F6;/*#81BEF7;/*#BDBDBD;/*#A9A9F5;/*#BFCFFE;/*#A9F5F2;/*#CCFFFF;*/
font-family: Helvetica, sans-serif;/*, arial, helvetica, sans-serif;*/
font-size: 1.1em;
text-align:left;
}
/****************************/
/*fotoachtergrond body type*/
.fotoachtergrond { 
background-color: transparent; 
margin: 0px 0px 0px 0px; 
padding: 0px; 
padding-bottom: 30px; 
height: 100%; 
background-attachment: fixed; 
background-repeat: no-repeat; 
/*font-size: 12px;*/
}
img#background { 
z-index: -1; 
position:absolute; 
color:transparent;
}
#bgimage {width: 100%; height: 100%; z-index: 1; position: absolute;}
#bgimage img {width: 100%; height: 100%;}
/****************************/
#main {
width:100%;
height:100%;
background-color: #fff;/*#A9F5F2;/*#F5FAFA;*/
margin-top: 2.7em;/* 11% 0% 11%;/*229px 10% 0% 10% boven rechts onder links */
}

/******************************************/
/*MAIN MET RUIMTE VOOR FOTO IN absolute BLOK*/
#main2 {
background-color:  #fff;/*#A9F5F2;/*#F5FAFA;*/
margin: 20px 11% 0% 11%;/* 329px 10% 0% 10% boven rechts onder links */
align="middle";
}
/******************************************/
/***tradebox blok****/
/*MAIN Tradebox met los smaller fixed Blok*/
#main3 {
background-color:  #fff;/*#A9F5F2;/*#F5FAFA;*/
margin: 20px 11% 0% 11%;/* 179px 10% 0% 10% boven rechts onder links */
align="middle";
}
#main4 {
background-color: #fff;/*#A9F5F2;/*#F5FAFA;*/
margin: 0px 0px 0px 0px;/*229px 10% 0% 10% boven rechts onder links */
align="middle";
}

div#boxtop{
position:fixed;
width:100%;
top:0px;
z-index:999;
/*margin: 0 11% 0 11%*/
overflow:visible;
}
div#boxtopc{
width:62em;
top:0px;
z-index:999;
/*margin: 0 11% 0 11%*/
overflow:visible;
}

/*achtergrond float blok*/
div#agfloat{
background-color: transparant;/* was: #F5FAFA;*/
/*clear: left;
float: left;*/
margin-left:auto;
margin-right:auto;
text-align:left;
width: 62em;
overflow:visible;
/*padding: 0px 0% 0px 0%; /* boven rechts onder links */
}
div#box5ztapet{
background-color: transparent;
clear: left;
float: left;
width: 90%;
height: 1.4em;
padding: 0% 5% 0% 5%; /* boven rechts onder links */
}
div#box5ztapetc{
background-color: transparent;
margin-left:auto;
margin-right:auto;
width: 62em;
height: 1.4em;
padding: 0% 5% 0% 5%; /* boven rechts onder links */
}

/* footer transparant*/
div#box6ft{
background-color:transparent;
clear: left;
float: left;
width: 90%;
height: 6.25em;
padding: 0px 5% 0px 5%; /* boven rechts onder links */
/* -moz-border-radius: 0px 0px 0px 0px;
   -webkit-border-radius: 0px 0px 0px 0px;
   border-radius: 0px 0px 0px 0px;*/
}
/****EIND TRADEBOX BLOK****/
/****************************************************/

div#toptitel{
/*background-color: #fff;/*#BFCFFE;*/
background: -webkit-linear-gradient(#fff,#fff,#d6e4de,#0099ff);/*#adcabd); /* For Safari */
background: -o-linear-gradient(#fff,#fff,#d6e4de,#0099ff);/*#adcabd)/* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#fff,#fff,#d6e4de,#0099ff);/*#adcabd) /* For Firefox 3.6 to 15 */
background: linear-gradient(#fff,#fff,#d6e4de,#0099ff);/*#adcabd) /* Standard syntax (must be last) */
opacity:0.95;
z-index:120;
clear: left;
width: 100%;
height: 7.5em;
Overflow:hidden;
/*white-space: nowrap;*/
max-height:20%;
border-bottom:0.32em solid #0099ff;/*#adcabd;*/
/*border-top:4px dotted red;*/
}
div#toptitelc {
clear:left;
position:relative;
top:0ems;
margin-left:auto;
margin-right:auto;
background-color:transparent;
z-index:122;
width: 62em;
max-width:100%;
height: 100%;
Overflow:hidden;
text-align:left;
}

/* /* relatief nested in absolute box0; pagina header licht blauw*/
div#box1titelbreed{
background-color: #fff;/*#BFCFFE;*/
clear: left;
float: left;
width: 95%;
height: 6.25em;
padding: 0px 0% 0px 5%; /* boven rechts onder links */
 -moz-border-radius: 1.25em 1.25em 0px 0px;
   -webkit-border-radius: 1.25em 1.25em 0px 0px;
   border-radius: 1.25em 1.25em 0px 0px;
}
/* test nested relatief in absolute absolute box0*/
div#box1titelbreed80px{
color:#0099ff;
background-color: #fff;/*#BFCFFE;*/
float:left;
width: 100%;
height: 3.75em;
padding: 0px 0% 0px 0%; /* boven rechts onder links */
margin: 0 0 0 0;
}
div#topline{
background-color:0099ff;/*#0099ff;/*#adcabd;*/*/ /*#0000FF;*/
clear: left;
float: left
width: 100%;
height: 0.2em;
}
div#toplinec{
background-color:transparent;/*#0099ff;/*#adcabd;*/*/ /*#0000FF;*/
width: 62em;
height: 100%;
}

div#breadcrumb{
background-color: #0099FF;
clear: left;
float: left
width: 90%;
height: 0.25em;
padding: 0% 5% 0% 5%; /* boven rechts onder links */
/*button
appearance:button;
-moz-appearance:button; /* Firefox
-webkit-appearance:button;Safari and Chrome */
}

div#box2breadcrumb{
background-color: #0099FF;
clear: left;
float: left
width: 90%;
height: 1.34em;
padding: 0% 5% 0% 5%; /* boven rechts onder links */
/*button
appearance:button;
-moz-appearance:button; /* Firefox
-webkit-appearance:button;Safari and Chrome */
}
div#box3breadcrumb{
/*background-color: #0099FF;*/
clear: left;
float: left
width: 1px;
height: 1px;
margin: 0% 0% 0% -20px; /* boven rechts onder links */
/*button
appearance:button;
-moz-appearance:button; /* Firefox
-webkit-appearance:button;Safari and Chrome */
}
div#box2rand{
color:#0099ff;
background-color:#d3f0e3;/*#BFCFFE;adcabd;*//*#0000ff;/*00099FF;*/
clear: left;
float: left
width: 62em;
height: 2.6em;
/*padding: 0% 5em 0% 5em; /* boven rechts onder links */
}
div#box2randc{
/*color:#fff;
background-color: #0099ff;/*#adcabd;*//*#0000ff;/*00099FF;*/
clear: left;
float: left
width: 48em;
height: 1.6em;
Margin-left: auto;
Margin-right:auto;
padding-top:0.2em;
padding-bottom:0.2em;
/*padding: 0% 5em 0% 5em; /* boven rechts onder links */
}

div#box2randje{
background-color: #fff;/*#0099ff;/*#adcabd;*//*#0000ff;/*00099FF;*/
clear: left;
float: left
width: 62em;
height: 0.32em;
/*padding: 0% 5em 0% 5em; /* boven rechts onder links */
}

/* regelbox hele breedte*/
div#regel{
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 100%;
/*padding: 0% 0% 0% 0%; /* boven rechts onder links */
}
div#regelc{
clear:left;
position:relative;
top:0px;
margin-left:auto;
margin-right:auto;
background-color:transparent;
z-index:122;
width: 62em;
height: 100%;
text-align:left;
/*border-top:0px dotted transparent;*/
}

/* relatieve box over de hele breedte 20ems*/
div#kolom{
background-color: transparent;/*#fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
z-index:99;
width: 20em;
/*max-height:201px;
overflow:auto;*/
padding: 0.4em 0.2em 0.4em 0.2em; /* boven rechts onder links */
}
div#x05kolom{
background-color: transparent;/*#fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
z-index:99;
width: 9.5em;
/*max-height:201px;
overflow:auto;*/
padding:0.2em 0.2em 0.2em 0.2em; /* boven rechts onder links */
}

div#x15kolom{
background-color: transparent;/*#fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
z-index:99;
width: 30em;
/*max-height:201px;
overflow:auto;*/
padding:0.2em 0.2em 0.2em 0.2em; /* boven rechts onder links */
}

div#cover{
float: left;
width: 20em;
color:black;
padding:0.2em 0.2em 0.2em 0.2em; /* boven rechts onder links */
}

div#kolomc{
float: left;
z-index:99;
width: 100%;
height: 100%;
}

/* relatieve box over de hele breedte 20ems*/
div#x2kolom{
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 41em;
/*max-height:201px;
overflow:auto;*/
padding: 0.2em 0.2em 0.2em 0.2em; /* boven rechts onder links */
}
div#kolom2{
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 20em;
/*max-height:22em;
/*max-height:301px;
overflow:auto;*/
padding:0.2em 0.2em 0.2em 0.2em; /* boven rechts onder links */
}

/* regelbox plaatje in het midden*/
div#regelp{
float:left;
width:100%;
height:100%;
max-height:12.5em;
/*display: flex;*/
align-items:center;

background-color:#fff;/*#BFCFFE;/* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
/*margin-left: auto;
margin-right: auto;
margin-top: auto;
margin-bottom: auto;*/
}
/* relatieve box over de hele breedte 20ems*/
div#box4overdehelebreedte{
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 100%;
padding: 0% 0% 0% 0%; /* boven rechts onder links */
}
/*relatieve plaatsing onder absolute box3, zodat box4 aansluit*/
div#box4overdehelebreedte40{
overflow:visible;
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 90%;
padding: 10px 5% 0% 5%; /* boven rechts onder links */
}

/* box4 over de hele breedte contact*/
div#box4helebreedtecontact{
overflow:visible;
background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 90%;
padding: 10px 5% 0% 5%; /* boven rechts onder links */
}
div#box4nested30pct{
/* geen background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 32%;
padding: 0% 0% 0% 0%; /* boven rechts onder links */
/*border:2px solid black*/
}
div#box4nested30pctr{
/* geen background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: right;
width: 32%;
padding: 0% 0% 0% 0%; /* boven rechts onder links */
/*border:2px solid black;*/
}

div#box4nested60pctr{
/* geen background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: right;
width: 64%;
padding: 0% 0% 0% 0%; /* boven rechts onder links */
/*border:2px solid black;*/
}
div#box4nested60pct{
/* geen background-color: #fff;/*#BFCFFE;*//* kleur gelijk getrokken zodat foto's niet over het hele vlak hoeven te vallen */
float: left;
width: 64%;
padding: 0% 0% 0% 0%; /* boven rechts onder links */
/*border:2px solid black;*/
}
/* banner tickertape gevuld */
div#box5tape{
background-color: #0099ff;/*#adcabd;*//*#0099FF;*/
clear: left;
float: left;
width: 90%;
height: 2em;
padding: 1% 5% 0% 5%; /* boven rechts onder links */
}
div#box5tapec{
background-color: transparent;/*#0099ff;/*#adcabd;*//*#0099FF;*/
margin-left:auto;
margin-right:auto;
width: 68em;
height: 100%;
}

div#box5ztape{
background-color: #0099ff;/*#adcabd;*//*#0099FF;*/
clear: left;
float: left;
width: 100%;
height: 1.5em;
}
div#box5ztapec{
background-color: transparent;/*#0099ff;/*#adcabd;*//*#0099FF;*/
margin-left:auto;
margin-right:auto;
width: 68em;
height: 100%;
}

/* footer */
div#box6f{
background-color:#fff;/*#BFCFFE;*/
clear: left;
float: left;
width: 90%;
height: 100px;
padding: 0px 5% 0px 5%; /* boven rechts onder links */
 -moz-border-radius: 0px 0px 0px 0px;
   -webkit-border-radius: 0px 0px 0px 0px;
   border-radius: 0px 0px 0px 0px;
}
/* footer rond van onder lichtblauw*/
div#box6fr{
background-color:#fff;/*#BFCFFE;*/
/*clear: left;
float: left;*/
width: 90%;
height: 60px;
padding: 0px 5% 0px 5%; /* boven rechts onder links */
 -moz-border-radius: 0px 0px 20px 20px;
   -webkit-border-radius: 0px 0px 20px 20px;
   border-radius: 0px 0px 20px 20px;
/* schaduw 
 -webkit-box-shadow: 5px 7px 7px 5px #0099ff;
  -moz-box-shadow: 5px 7px 7px 5px #0099ff;
  box-shadow: 5px 7px 7px 5px  #0099ff;*/
}

/*blockquote{
color: #B36B00;
border: 20px dotted #FFE6BF;
background: #FFE6BF;
margin: 15px 75px 15px 75px;
padding: 5px;
}*/
blockquote.cover{
opacity:0;
z-index:101;
/*font-family: helvetica;/*, arial, helvetica, sans-serif;*/
/*font-size: 1.00em; /* = 20px */
overflow: visible;
float: left;
/*margin: -18px 0px -0px -20px;/* boven rechts onder links */
/*padding: 2px 10px 14px 23px; /* boven rechts onder links */
background: #0099ff;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}
blockquote.cover:hover{
opacity:1;
}



blockquote.menu{
opacity:0;
z-index:10100;
font-family: helvetica;/*, arial, helvetica, sans-serif;*/
/*font-size: 1.00em; /* = 20px */
overflow: visible;
float: right;
text-align:left;
margin: -18px 0px -0px -20px;/* boven rechts onder links */
padding: 2px 10px 14px 23px; /* boven rechts onder links */
background: transparent;
-webkit-border-radius: 10px 10px 10px 10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}
blockquote.menu:hover{
opacity:1;
position:absolute;
background: -webkit-linear-gradient(#0000ff, #0099ff); /* For Safari */
background: -o-linear-gradient(#0000ff, #0099ff); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#0000ff, #0099ff); /* For Firefox 3.6 to 15 */
background: linear-gradient(#0000ff, #0099ff); /* Standard syntax (must be last) */
/* schaduw */
 -webkit-box-shadow: 3px 3px 3px 3px #0099ff;
  -moz-box-shadow: 3px 3px 3px 3px #0099ff;
  box-shadow: 3px 3px 3px 3px #0099ff;
/* ease in 
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-webkit-transition-timing-function: linear, ease-in;
	-moz-transition-timing-function: linear, ease-in;*/
}

blockquote.cv{
font-size:1.2em;
top:20px;
margin: -44px -0px -0px 200px;/* boven rechts onder links */
border: 1px #0000ff;
color:#fff;
padding: 5px 5px 5px 5px; /* boven rechts onder links */
color:#0099ff;
background: #0099FF;
overflow:auto;
width:400px;
/* Ronde hoeken */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
/*enige blockquote in gebruik bij contact pagina*/
blockquote.contact22{
font-size:1.2em;
/*top:20px;*/
text-align: left;
margin-left:0px;
padding: 0.5em 1em 0.5em 1em;/* boven rechts onder links */
color:#fff;
background: #0099FF;*/
overflow:visable;
width:15em;
/* Ronde hoeken */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
 -webkit-box-shadow: 2px 3px 3px 2px #0000ff;
  -moz-box-shadow: 2px 3px 3px 2px #0000ff;
  box-shadow: 2px 3px 3px 2px #0000ff;
}

blockquote.contactc{
font-size:1.2em;
top:20px;
margin-left:auto;
margin-right:auto;
margin-top: 2%;/* boven rechts onder links */
margin-bottom:5%;
border: 1px #fff;
color:#fff;
padding: 5px 5px 5px 5px; /* boven rechts onder links */
background: #0099FF;
overflow:auto;
width:100%; 
/* Ronde hoeken */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
blockquote.alg{
font-size:1.2em;
margin-left:auto;
margin-right:auto;
margin-top: 50px;/* boven rechts onder links */
margin-bottom:5%;
border: 1px #fff;
color:#fff;
padding: 5px 5px 5px 15px; /* boven rechts onder links */
background: #0099FF;
overflow:auto;
width:100%; 
/* Ronde hoeken */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}


blockquote.contact40b{
float: left;
margin: 2% 0% 5% 0%;/* boven rechts onder links */
border: 1px #fff;
color:#fff;
padding: 5px 5px 5px 5px; /* boven rechts onder links */
background: #0099FF;
overflow:auto;
width:40em; 
/* Ronde hoeken */
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}