/* Start of CMSMS style sheet 'Modelstaal - stijl' */
/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
margin:0;
padding:0;
}

/*
Set initial font styles
*/
body {
   text-align: left;
   background: transparent url(/images/bg.png) repeat-x;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: 75.01%;
   line-height: 140%;
   color: #333;
}

/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
   border: 0;
}

/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link 
a:active {
   text-decoration: underline;
   background-color: inherit; 
   color: #18507C; 
}

/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   color: #385C72;
}

/*****************
basic layout 
*****************/
/* center wrapper, min max width */
div#pagewrapper {
   border: 0px solid black;
   margin: 0 auto;     /* this centers wrapper */
   width: 960px;
   background-color: transparent;
   color: black;
}

div#header {
   height: 287px; /* adjust according your image size */
}

div#main {
   margin: 0 30px 0 260px; 
   color: #668e9e;
   font-size: 90%;
}

div#sidebar {
   float: left;  /* set sidebar on the left side. Change to right to float it right instead. */
   width: 240px;    /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX ie doublemargin bug */
   margin-left: 0;
}

.movimg:hover {
   cursor: pointer;
}

div#contactgegevens {
  background-color: #006eab;
  padding: 10px 0 10px 50px;
  margin-bottom: 10px; 
}

div#contactgegevens p,
div#contactgegevens h2,
div#contactgegevens a {
  color: #ffffff;
}

div#front-image {
  height: 292px;
  width: 664px;
  overflow-x: hidden;
}

div#rechtercontent {
  float: right;
  margin-top: 20px;
}

div#rechtercontent ul li,
div#rechtercontent ol li {
   margin: 0 0 0.25em 3em;
   list-style-image: url(/images/bullet.png);
}

div#rechtercontent ul li a{
  text-decoration: none;
}

div#middencontent {
  width: 500px;
  margin-top: 20px;
}

div#footer {
   clear:both;       /* keep footer below content and menu */
}

div#footer p {
   font-size: 0.8em;
   padding: 1.5em;      /* some air for footer */
   text-align: center; /* centered text */
   margin:0;
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   margin: 1em;
   border-bottom: 1px dotted black;
}


/********************
CONTENT STYLING
*********************/
div#content {

}

/* HEADINGS */
h1 {
   color: #006eab; 
   font-size: 1.5em; 
   text-align: left; 
/* some air around the text */
   padding-bottom: 1px;
/* set borders around header */
   line-height: 1.5em;
/* and some air under the border */
   margin: 0 0 0.5em 0;
}
h2 {
   color: #294B5F; 
   font-size: 1.3em;
   line-height: 1.3em;
   margin: 0 0 0.5em 0;
}
h3 {
   color: #294B5F; 
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h4 {
   font-size: 1.1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h5 {
   font-size: 1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
/* END HEADINGS */

/* TEXT */
p {
   font-size: 1em;
   margin: 0 0 1.5em 0;  /* some air around p elements */
   padding: 0;
}
blockquote {
   border-left: 10px solid #ddd;
   margin-left: 10px;
}
pre {
   font-family: monospace;
   font-size: 1.0em;
}
strong, b {
/* explicit setting for these */
   font-weight: bold;
}
em, i {
/* explicit setting for these */
   font-style:italic;
}


/* END TEXT */

/* LISTS */
div#main ul,
div#main ol,
div#main dl {
  font-size: 1.0em;
   line-height:1.4em;
   margin: 0 0 1.5em 0;
}
div#main ul li,
div#main ol li {
   margin: 0 0 0.25em 3em;
}

div#dl dt {
   font-weight: bold;
   margin: 0 0 0.25em 3em;
}
div#dl dd {
   margin: 0 0 0 3em;
}
/* END LISTS */

input[type=text], textarea {
  background: #668e9e;
  border: 1px solid;
  color: #fff;
  padding: 3px;
}

input[type=submit] {
  border: 1px solid #668e9e;
  padding: 3px;
  background: #fff;
  color: #000;
}


/* OVERLAY */

/* the overlayed element */
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */
	background-color:#333;
	
	width:480px;	
	min-height:200px;
	border:1px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(http://www.modelstaal.nl/uploads/images/close.png);
	position:absolute;
	right:0x;
	top:-35px;
	cursor:pointer;
	height:35px;
	width:35px;
}

/* styling for elements inside overlay */
	.details {
		position:absolute;
		top:15px;
		right:15px;
		font-size:11px;
		color:#fff;
		width:150px;
	}
	
	.details h3 {
		color:#aba;
		font-size:15px;
		margin:0 0 -10px 0;
	}

/*********************** COOKIEBANNER *****************/

.cookiebanner {
    background: rgba(245, 245, 245, 0.9);
    bottom: 0;
    left: 0;
    padding: 1em 2em;
    position: fixed;
    text-align: center;
    right: 0;
    z-index: 9999;
}



.cookiebanner_buttons {
    margin: 0 0 1em 0;
}

.cookiebanner_button {
    background: #006eab;
    color: #fff !important;
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
}

.cookiebanner_button:hover {
    color: #000;
}

.no-cookiebanner-present {
    background: #006eab;
    color: #ffffff;
    padding: 10px 10px 10px 10px;
    margin: 0 auto;
    width: 560px;
    font-family: OpenSans, Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-style: italic;
}

.no-cookiebanner-present a {
    color: #ffffff;
    text-decoration: underline;
}

/**************STYLING CHECKBOX PS*****************/

.privacy {
  overflow: hidden;
  margin: 0 0 30px 0;
}

.privacy input {
  float: left;
  display: inline-block;
  width: 20px;
  margin: 0;
  -webkit-appearance: checkbox;
}

.privacy label {
  float: left;
  display: inline-block;
  width: 85%;
  margin: 0 0 0 10px;
}

/* End of 'Modelstaal - stijl' */

