@import url("topnav.css");
/* -----------------------
Base styles
------------------------*/

html, body {
    background-image: url(../img/background2.jpg);
    height:100%;
    margin:0;
    padding:0;
    font-family: 'Open Sans', sans-serif;
    font-weight: normal;    
    font-size: 0.95em;
    line-height: 1.4em;
}

.container  {
    max-width: 66em;
    margin-top: 2em;
    margin-right: auto;
    margin-left: auto;
    background-color: #A6C5FE;
}

.header {
    color: #fff;
    background: #2D64B0;
    padding: 10px 0px 8px 28px;
   
}

.header-heading { 
    margin: 0; 
}

.header-kolom {
	max-width:66em;
	margin: 0em 0em;
}

.main {

    padding-top: 1em;
    margin-top: 1em;
    margin-left: 4.5em;
    margin-right: 4em;    
    min-height: 100%;
  /* equal to footer height */
     
  
} 

.footer-text {
    font-size: 0.85em;
    margin-right:3em;
}

.footer-greytext {
    font-size: 0.85em;
    color:#B8B2B2;
    margin-right:3em;
}

.footer {
    background: #2D64B0;
    height: 4em;
    width: 66em;
    left: auto;
    bottom: 0;
    color: white;
    text-align: right;
    padding: 1em;    
    
}

article {
  -webkit-columns: 2 200px;
     -moz-columns: 2 200px;
          columns: 2 200px;
  -webkit-column-gap: 2em;
     -moz-column-gap: 2em;
          column-gap: 2em; 
}


p {  
    break-after: column;
}

p.hangingIndent { 
    text-indent: -20px;
    padding-left: 20px;
    margin:4px;
}

sup
{
    font-size: 70%;
    baseline-shift: 0.1px;
}

intro
{
    line-height: 1.6em;			
    font-size: 1.2em;			
    font-family: 'Open Sans', sans-serif;
}
rood
{
	color: #B8B2B2;
	font-weight: normal;
}

grijs
{
	color: #B00303;
	font-weight: normal;
}

groen {
  color: #000000;  
  font-weight: bold; 
}

h1,h2,h3,h4,h5,h6
{
	margin: 0 0 .5em;
	font-weight: 400;
	line-height: 1.1;
    color: rgba(250,1,5,1.00);
}

h1 { font-size: 2.25em; } /* 36px */
h2 { font-size: 1.75em; } /* 28px */
h3 {font-size: 1.375em;} /* 22px */
h4 { font-size: 1.125em; } /* 18px */
h5 {  font-size: 0.95em; } /* 16px */
h6 { font-size: .875em; } /* 14px */

hr
{
    margin-top: 1em;
    margin-bottom: 1em;
    border-color: #FD0004;
    border-bottom-style: solid;
    border-bottom-width: thin;
    width: 80%;
    margin-left: 0;
}

table
{
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
    text-align: right;
    line-height: 1em;
}

td
{   font-size: 0.85em;
    line-height: 1;
    vertical-align: middle;
    text-align: left;    
    border-top: 1px solid #B00303;
    border-bottom: 1px solid #B00303;
    padding-top: 8px;
    padding-right: 2px;
    padding-bottom: 8px;
    padding-left: 0px;
}

.rl
{
	text-align: right;
}

a:link { color: #FF0004; text-decoration: none;}
a:visited { color: #FF0004; text-decoration: none;}
a:focus { color: black; text-decoration: none;}
a:hover { color: rgba(0,89,255,1.00); text-decoration: none;}
a:active { color: #FF0004; text-decoration: none;}



/* -----------------------
Single styles
------------------------*/

.img-responsive {
    max-width: 100%;
    float: inherit;
    width: 400px;
}


.btn
{
	color: #000000 !important;
	background-color: #E4E2E2;
	border-color: #E4E2E2;
	display: inline-block;
	padding: 0em 0.5em;
	margin-bottom: 0.4em;
	font-size: 0.8em;
	line-height: 1.6;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	border: 1px solid; 
	text-decoration: none;
}

.btn:hover
{
	color: #000000 !important;
	background-color: #FFFFFF;
}

.btn:focus
{
	color: #fff !important;
	background-color: black;
}

.btn:active
{
    color: #FFFFFF !important;
    background-color: #BAB8B8;
}

.list-unstyled
{
	padding-left: 0;
	list-style: none;
}

.list-inline
{
	padding-left: 0;
	margin-left: -5px;
	list-style: none;
}

.list-inline > li
{
	display: inline-block;
	padding-right: 5px;
	padding-left: 5px;
}

table
{
    background-color: transparent;
    border-spacing: 0;
    border-collapse: collapse;
    border-top: 0px solid #ddd;
    text-align: right;
    padding-top: 2px;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 0px;
    line-height: 1em;
}



/* -----------------------
Wide styles
------------------------*/

@media (min-width: 42em)
{
	.header {
    padding-top: 1em;
    padding-right: 2em;
    padding-left: 2em;
    padding-bottom: 0.5em;
}
	.nav-bar { padding: 1em 3em; }
	.content {
    top: 2em;
}
	
	
	.nav li
	{
		display: inline;
		margin: 0 1em 0 0;
	}
	
	.nav a
	{
		display: inline;
		padding: 0;
		border-bottom: 0;
	}
}