/* file grgrstyle.css */
/* gebruikt voor alle webpagina's onder www.jpdg.nl/grootsgrut */

html * 		{
			font-family: verdana, helvetica, arial, sans-serif; font-size: 1.2vw; 
			 padding: 0; margin: 0; letter-spacing:0.04em; line-height:115%;
			 box-sizing: border-box;
			 }
body 		{
			background-color : #e0e0f0;
			padding:10px;			
			font-size: 100%; 
			overflow: auto;
			}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 10px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.3); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin-left: 10px;
  float:left;
  padding: 10px;
  border: 1px solid #333;
  border-radius: 12px;  
  width: 80%;
}

#modaltekst {
	max-width: 90%;
	margin: auto;
	}

/* The Close Button */
.close {
  color: #ff7777;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.col-0 {width: 4.16%;}
.col-1 {width: 8.33%;}
.col-125 {width: 12.5%;}
.col-2 {width: 16.66%;}
.col-20 {width: 19.9%;}
.col-3 {width: 25%; overflow: auto;}
.col-4 {width: 33.33%; overflow: auto;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

[class*="col-"] {
  float: left; 
  padding: 0px 8px 0px 8px;
  margin-bottom: 2em;
  border: 0px solid red;
  overflow:visible;
/*  height:22em; */
}
[class*="col-"] img {
	margin-bottom: 0.5em;
	margin-top: 0.5em;
}

.rood {background-color: #ffcccc; }
.omlijnd {border: 4px solid #ffffaa;
	border-radius: 20px;}

.rij::after {
  content: "";
  clear: both;
  display: table;
}

.separator	{
		 	width: 100%;
		 	height: auto;
			margin: 2em 0 2em 0;
		 	padding: 5px 20px 5px 22px;
		 	border-top:2px solid;
			overflow: hidden;
			background-color : #cce;
			color: #840000;
			}
.separator2	{
		 	width: 100%;
		 	height: auto;
			margin: 2em 0 2em 0;
		 	padding: 5px 20px 5px 22px;
		 	border-bottom:2px solid;
			overflow: hidden;
			background-color : #cce;
			color: #840000;
			}
.linktile	{
			background-color: #ffcccc;
			height:18em;
			}
.linktile img	{
			border: 0;
			padding:4px 0;
			}
#bovenste p {
			font-size: 1.8em;
			}
#bovenste p a {
			font-size: 1em;
			color: #840000;
			font-weight: bold;
			text-decoration: none;
			}		
			
#bovenste img	{			
			margin-right: 1em;
			float:left;
			border:1px solid #cce;
			}
#bovenste img:hover		{
			border: 1px solid #840084; 
			}
div.menu_div	{
			background-color : #ffffaa;
			border: 0px solid red;
			padding:1em;
			}
div.menu_div li {margin-bottom: 1px;
			}
div.menu_div ul {margin-bottom: 1px; margin-top: 1px;}
ul.nivo1	{
			font-weight: bold;
			}
ul.nivo2	{
			list-style-type: none;
			font-weight: normal;
			margin-left: 1em;
			}
ul.nivo3	{
			list-style-type: none;
			font-weight: normal;
			margin-left: 1.5em;
			}
ul.nivo3 li {margin-bottom: -1px;} 

#main  {			
		 	width: 100%;
		 	height: auto;
			border: 0px solid #840084; 
			background-color : #e0e0f0;
		}
.introtekst {
			width:80%;
			height:auto;
			padding: 10px;
			margin:auto;
			background-color: #ddf;
			}
.tegel		{
			height:auto;
			width:auto;
			float:left;
			margin: 20px;
			padding: 0px;
			}
.tegel p	{
			text-align:left;
			}
			
table {
			width: 100%;
			}
td {
			width:33%;
			padding: 10px 10px 10px 10px;
			}
td > .toelicht {
			text-align: center;
			font-style: italic;
/*			background-color: #ffffef; */
			}
/* td img		{margin-bottom:8px;} */

a:link     {color:#530084; text-decoration: underline; }
a:visited  {color:#530084; text-decoration: none; }
a:hover    {color:#ff0000; text-decoration: none; }
a:active   {color:#00ff00; text-decoration: underline; }

a > img		{
			border: 1px solid #e0e0f0; 
			}
a > img:hover		{
/*			border: 1px solid #840084; */
			}