

/* Larger than desktop */ 

    /*hier komt uw CSS-code*/
  	body {
 	background-color: black;
  	font-family: verdana;
	}

	#header {
		 position: fixed;
		 top:1%;
	 	 width:98%;
	     height: 3%;
	     color: white;
 	  	 font-size: 10px;
 	

	}	

	
	#headmenu {
		 position: fixed;
		 top:3%;
	 	 width:100%;
	 	 height: 4%;
 	 	 margin-left:0%;
		 padding: 1%;
		 padding-top: 1%;
 	  	 font-size: 12px;
 	     color: black;
 
 	     i-align: left;
         background-color:white;   
 	   

	}
	
	
	#melding {
  	    position: absolute;
	    top:100px;
	    width: 30%; 
		margin-left:18%;
		color:red;
	
		
	}

	
	#colofon {
		/* position: absolute;
	     top:10%;
	     margin-top: auto;
  	     padding-left: 3%;
  	     padding-right: 3%;
	     padding-top: 2%;
	 	 margin-left:79%;
	 	 width:8%;
  	     padding-left: 3%;
  	     padding-right: 3%;
	     padding-top: 2%;
	 	 margin-top: auto;
	 	 color: black ;
	     height: 85%;
    	 font-size: 14px;
	     background-color: white;
	     align-content: left;
	     */
	}
	
	.logo {
		align-items: center;
		width:10%; 		 
	}

	#mainwindow {
	    position: fixed;
	    top:8%;
		margin-top: auto;
		padding: 1%;
		width :100%;
		height: 85%;
		text-align: left;
 		font-size: 14px;
        overflow: auto;
        color: #0066ff;
        
        background-color:white;
    

	}
	#mainwindowleft {
   	    position: fixed;
		margin-top: auto;
	 	margin-left:5%;
		width :30%;
		top:30%;
		height: 60%;
		text-align: left;
 		font-size: 12px;
 	    overflow: auto;
 	    background-color:white;
		
	}
	
	
	#maincenter {
   	    position: fixed;
		margin-top: auto;
	 	margin-left:35%;
		width :30%;
		top:30%;
		height: 60%;
		text-align: left;
 		font-size: 12px;
 	    overflow: auto;
 	    background-color:white;
		
	}
	
	
	#mainwindowright {
  	    position: fixed;
		margin-top: auto;
		top:30%;
		width :50%;
		height: 60%;
		margin-left: 36%; 
		text-align: left;
 		font-size: 12px;
 	    overflow: auto;
 	    background-color: white;
		
	}
	#mainwindowfooter {
   	    position: fixed;
		margin-top: auto;
		width :73%;
		top:90%;
		height: 5%;
		text-align: left;
		 margin-left:5%;
 		font-size: 12px;
 	    overflow: auto;
 	    background-color: white;
		
	}	
	
	#mainwindowleft h1 {
		font-size: 18px;
		color: #0066ff;
		text-align: left;
		
	}
	#mainwindowleft h2 {
		font-size: 18px;
		color: #0066ff;
		text-align: left;
	
	}


	#mainwindow h1 {
		top:5%;
		font-size: 18px;
		color: #0066ff;
		text-align: left;
		margin-left: 1%;
	}

	#mainwindow h2 {
		font-size: 12px;
		text-align: left;
		color: #0066ff;
	    margin-left:0%;
	}
	
	#footer {
	   position: fixed;
	   bottom: 3%;
	   margin-left:0%;
	   height: 3%;
	   width: 100%;
	   color: grey;
	   text-align: center;
	   font-size: 12px;
	   background-color: white;
	} 

.button{
	width: 180px;
	color: white;
	background: #0066ff;
	padding: 1em 1.5em;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	
	
	
}
.knop{
	width: 180px;
	background-color: #0066ff;
	color: white;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;
	
}

.aanmeldknop{
	width: 180px;
	background-color: #d7e5ff;
	color: #0066ff;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;

	text-align: center;
	
}
.knopvergeet{
	width: 180px;
	color: #d7e5ff;
	background-color: #0066ff;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;

	text-align: center;
}

.debetknop{
	width: 180px;
	background-color: green;
	color: white;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;
	
}
.creditknop{
	width: 180px;
	background-color: red;
	color: white;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;
	
}

.priveknop{
	width: 180px;
	background-color: black;
	color: white;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;
	
}


.knopje{
	width: 100px;
	background-color: #0066ff;
	color: #d7e5ff;
	border-radius:5px; 
	text-decoration: none;
	text-align: center;

	
}


.knopactief{
	width: 200px;
	background-color: #d7e5ff;
	color: #0066ff;
	padding: 5px;
	border-radius:5px; 
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;
	
}
.balkknop{
	width: 180px;
	background-color: #0066ff;
	color: white;
	padding: 5px;
	border-radius:5px; 
	margin-left: 15px;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	float: left;

}




#headmenu a {
  background-color: #d7e5ff;
  color: #0066ff;
  border-color: #0066ff;
  text-decoration: none;
  text-transform: uppercase;
  padding: 10px;
  border-radius:5px;

  width: 180px;
}

#headmenu a:hover {
  color: white;
  background-color: #0066ff;
}

#headmenu a:active {
  background-color: #e8e8e8;
}





#mainwindow a {
  text-decoration: none;
   color: white;

	
}

#colofon a {
  background-color: white;
  color: black;
  text-transform: uppercase;
  text-decoration: none;
}

#colofon a:hover {
  background-color: white;
}

#colofon a:active {
  background-color: #55ff7f;
}

[code:1:ac2c5e3bec]input{background-color:#d7e5ff; color:#0066ff;}[/code:1:ac2c5e3bec]

input[type=text] {
  padding:2px;
  margin:2px 0; // add top and bottom margin
  width: 210px;
  border-color: #0066ff; 
  background-color: #d7e5ff;
  color: #0066ff; 
}

input[type=email] {
  padding:2px;
  margin:2px 0; // add top and bottom margin
	width: 210px;
  border-color: #0066ff;
  background-color: #d7e5ff;
    color: #0066ff; 
}

input[type=password] {
  padding:2px;
  margin:2px 0; // add top and bottom margin
	width: 210px; 
  border-color: #0066ff;
  background-color: #d7e5ff;
    color: #0066ff; 
}

input[type=number] {
  padding:2px;
  margin:2px 0; // add top and bottom margin
	width: 210px; 
  border-color: #0066ff;
   background-color: #d7e5ff;
     color: #0066ff; 
}
input[type=date] {
  padding:2px;
  margin:2px 0; // add top and bottom margin
	width: 210px; 
  border-color: #0066ff;
  background-color: #d7e5ff;
  
}


select {
  padding:2px;
  margin:2px 0; // add top and bottom margin
	width: 210px; 
  border-color: #0066ff;
  background-color: #d7e5ff;
  
}



table.balken tr:nth-child(even) {
  background:  white;
}

table.balkjes tr {
  background:  white;
}
table.balkjes tr {
  width:  80%;
}  
table.balkjes td {
  width:  15%;
} 


 
table.balken tr {
  width:  80%;
}  
table.balken td {
  width:  20%;
} 

#sjabloon{
	position: absolute;
	top: 220px;
	left: 440px;
	width: 210px;
	height: 297px;
	background:#d7e5ff;
	color: black;
	font-size: 8px;

}
#sjabloon1{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: left;

}

#sjabloon2{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: center;

}
#sjabloon3{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: right;
}

#sjabloon4{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: left;

}

#sjabloon5{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: center;

}
#sjabloon6{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: right;
}

#sjabloon7{

	margin-top:5px;
	margin-left: 5px;
	width: 193px;
	height: 30px;
	background:white;
	border-width: thin;
	float: left;
	text-align:left;
}
#sjabloon8{

	margin-top:5px;
	margin-left: 5px;
	width: 193px;
	height: 85px;
	background:white;
	border-width: thin;
	float: left;
	text-align: center;
}

#sjabloon9{

	margin-top:5px;
	margin-left: 5px;
	width: 193px;
	height: 30px;
	background:white;
	border-width: thin;
	float: left;
	text-align: center;
}
#sjabloon10{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: left;
 	 vertical-align: bottom;

}

#sjabloon11{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: center;
 vertical-align: bottom;


}
#sjabloon12{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 40px;
	background:white;
	border-width: thin;
	float: left;
	text-align: right;
	
 


}

#sjabloonbottom10{

  vertical-align: bottom;
 
  
}

#sjabloonbottom11{
 
  vertical-align: bottom;
 
  
}
#sjabloonbottom12{

  vertical-align: bottom;

  
}


#sjabloonopties{
	position: absolute;
	margin-top: 5px;
	margin-left: 5px;
	width: 400px;
	height: 70%;

}


#sjabloonopties1{

	margin-top:5px;
	margin-left: 5px;
	width: 61px;
	height: 30px;
	background:white;
	border-width: thin;

	text-align: center;

}


#sjabloonmenu{
	
	 position: fixed;
     bottom: 12%;
	 margin-left:1%;
	 height: 1em;
	 width: 50%;
	height: 100px;

	
}
