/*
Theme Name: Oosterstate
Theme URI:
Description: 
Version: 1.0
Author: Bens
Author URI: www.bens.nl
Tags:
*/

/*
    \__     __/
     /_/ /\ \_\
    __ \ \/ / __
    \_\_\/\/_/_/
__/\___\_\/_/___/\__
  \/ __/_/\_\__ \/
    /_/ /\/\ \_\
     __/ /\ \__
     \_\ \/ /_/
     /        \ 
*/


@font-face {
  font-family: 'FuturaStd-Bold';
  src: url('fonts/FuturaStd-Bold.eot?#iefix') format('embedded-opentype'),  url('fonts/FuturaStd-Bold.otf')  format('opentype'),
	     url('fonts/FuturaStd-Bold.woff') format('woff'), url('fonts/FuturaStd-Bold.ttf')  format('truetype'), url('fonts/FuturaStd-Bold.svg#FuturaStd-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}


/* ========================================================================= 
////	RESET
=========================================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{margin: 0;	padding: 0;	border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

/* HTML5 display-role reset voor oude browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none; margin:0; padding:0;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}


/* ========================================================================= 
////	ALGEMENE LAY-OUT en ELEMENTEN
=========================================================================== */
html {margin: 0; padding: 0; overflow-x:hidden; height:100%;}
body {margin:0; padding:0; width:100%; font-family: 'Roboto', Arial, Helvetica, sans-serif; font-size: 13px; color:#555555; line-height: 20px; margin: 0; padding: 0; font-weight: 300; height:100%;}
#wrapper-buiten {margin:0 auto; width:100%; height:auto;}
.content-container {margin:0 auto; width: 1120px; height:auto; padding:0; clear:both; position:relative;}
img {border-style:none; max-width:100%; vertical-align:top; height:auto;}
.mobiel-spacing {margin:15px 0;}


/* ========================================================================= 
////	TEKSTEN (basis)
=========================================================================== */
h1, h2, h3, h4, h5, h6 {text-transform: uppercase;}
h1 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 34px; color:#685f5b; font-weight: normal; line-height: 1.10; margin: 0; padding: 0; letter-spacing: -0.01em;}
h2 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 32px; color:#685f5b; font-weight: normal; line-height: 1.15; margin: 0; padding: 0; letter-spacing: -0.01em;}
h3 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 28px; color:#685f5b; font-weight: normal; line-height: 1.15; margin: 0; padding: 0; letter-spacing: -0.01em;}
h4 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 24px; color:#685f5b; font-weight: normal; line-height: 1.25; margin: 0; padding: 0; letter-spacing: -0.01em;}
h5 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 22px; color:#685f5b; font-weight: normal; line-height: 1.25; margin: 0; padding: 0; letter-spacing: -0.01em;}
h6 {font-family: 'FuturaStd-Bold', Georgia, Times, serif; font-size: 18px; color:#685f5b; font-weight: normal; line-height: 1.25; margin: 0; padding: 0; letter-spacing: -0.01em;}
p  {font-family:  'Roboto', Arial, Helvetica, sams-serif; font-size: 16px; color:#aaa; line-height: 28px; margin: 0; padding: 0; font-weight: 300;}
p.intro {font-family: 'Roboto', Arial, Helvetica, sams-serif; margin:20px auto; font-size:56px; width:auto; display: inline-block; color:#fff; background-color:#f4951f; padding:20px; text-align: center;}
p.subkop {color:#f4951f; font-size:22px; font-weight: 300;}
blockquote, q {font-family: 'Roboto Condensed', Arial, Helvetica, Verdana, sans-serif; font-size: 20px; line-height: 28px; font-weight: 300; margin:0; padding:0; color:#da8a15;}
b, strong {font-weight:700; color:#cd1719!important;}
hr {border:0; border-top:1px solid rgba(175,165,122,0.3); margin:0; clear:both;}
small {font-size:12px; font-weight: 300; line-height:12px!important;}
a {color:#0088c3;}
a:hover {text-decoration:none;}

.intro {padding:0 25%;}


/* ========================================================================= 
////	ELEMENT SUFFIX
=========================================================================== */
.clear {clear:both;}
.clear-left {clear:left;}
.clear-right {clear:right;}
.spacer {width:100%; display: block; clear:both; padding:1px 0;}
.off {display:none;}
.overflow {overflow:hidden;}
.relative {position: relative;}
.absolute {position: absolute;}
.center {text-align:center; margin:0 auto;}
.left {text-align:left; margin:0 auto;}
.right {text-align:right; margin:0 auto;}
.float-left {float:left;}
.float-right {float:right;}
.underline {text-decoration:underline;}
.list > * {list-style: disc;}
.margin-10 {margin:10px;}
.margin-20 {margin:20px;}
.margin-30 {margin:30px;}
.margin-40 {margin:40px;}
.margin-50 {margin:50px;}
.margin-60 {margin:60px;}
.margin-70 {margin:70px;}
.margin-80 {margin:80px;}
.margin-90 {margin:90px;}
.margin-100 {margin:100px;}
.margin-5-0 {margin:5px auto;}
.margin-10-0 {margin:10px auto;}
.margin-20-0 {margin:20px auto;}
.margin-30-0 {margin:30px auto;}
.margin-40-0 {margin:40px auto;}
.margin-50-0 {margin:50px auto;}
.margin-60-0 {margin:60px auto;}
.margin-70-0 {margin:70px auto;}
.margin-80-0 {margin:80px auto;}
.margin-90-0 {margin:90px auto;}
.margin-100-0 {margin:100px auto;}
.padding-10 {padding:10px;}
.padding-20 {padding:20px;}
.padding-30 {padding:30px;}
.padding-40 {padding:40px;}
.padding-50 {padding:50px;}
.padding-60 {padding:60px;}
.padding-80 {padding:80px;}
.padding-100 {padding:100px;}
.padding-10-0 {padding:10px auto;}
.padding-20-0 {padding:20px auto;}
.padding-30-0 {padding:30px auto;}
.padding-40-0 {padding:40px auto;}
.padding-50-0 {padding:50px auto;}
.padding-0-10 {padding:0 10px;}
.padding-0-20 {padding:0 20px;}
.padding-0-30 {padding:0 30px;}
.padding-0-40 {padding:0 40px;}
.padding-0-50 {padding:0 50px;}
.margin-min-0-30 {margin:0 -30px;}
.width-50 {width:50%;}
.width-60 {width:60%;}
.width-70 {width:70%;}
.width-80 {width:80%;}
.width-90 {width:90%;}
.width-100 {width:100%;}
.tekst-bold {font-weight:600!important;}
.tekst-wit {color: #fff!important;}
.tekst-zwart * {color: #000;}
.tekst-groen {color: #b7c83a!important;}
.achtergrond-wit {background-color:#fff;}
.achtergrond-grijs {background-color:#ececec;}
.achtergrond-rood {background-color:#cd1719;}
.achtergrond-zand {background-color:#f0e5db;}
.achtergrond-zwart {background-color:#000;}
.z-index-9999 {z-index:9999;}

.button {text-align: center; display:inline-block; background: rgba(255,255,255,0.2); border: 1px solid #fff; color:#fff; padding:35px 10px; font-size:16px; font-weight: 700;  text-shadow: 1px 1px 1px #000;}
.button:hover {background: #fff; color:#333; text-shadow: 1px 1px 1px #fff;}

.button-info-container {position:absolute; bottom:80px; left:0; width:100%; text-align:center; margin:0 auto; text-transform: uppercase; }
/* =========================================================================
////	RESPONSIVE GRID X12
=========================================================================== */
.section {clear: both;	padding: 0px; margin: 0px;}
/*  COLUMN SETUP  */
.col {display: block; float:left; margin: 1% 0 1% 1.6%;}
.col:first-child {margin-left: 0;}
/*  GROUPING  */
.group:before, .group:after { content:""; display:table; }
.group:after { clear:both;}
.group {zoom:1; /* For IE 6/7 */}
/*  GRID OF TWELVE  */
.span_12_of_12 {width: 100%;}
.span_11_of_12 {width: 91.53%;}
.span_10_of_12 {width: 83.06%;}
.span_9_of_12 {width: 74.6%;}
.span_8_of_12 {width: 66.13%;}
.span_7_of_12 {width: 57.66%;}
.span_6_of_12 {width: 49.2%;}
.span_5_of_12 {width: 40.73%;}
.span_4_of_12 {width: 32.26%;}
.span_3_of_12 {width: 23.8%;}
.span_2_of_12 {width: 15.33%;}
.span_1_of_12 {width: 6.866%;}
/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 780px) {
	.col {  margin: 1% 0 1% 0%; }
    .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12 {
	width: 100%; 
	}
}


/* =========================================================================
////	HEADER, HEADER HOME
=========================================================================== */
.header {margin:0 auto ; max-width:1120px; height:90px; z-index: 9999; background:#fff;}
.nav-height {height:60px; position: relative;}
.nav-groot {position: relative; top:9px; z-index: 9999;}
.header-logo {max-height: 200px; position: absolute; margin: auto; top: 0; left: 0; right: 0;  bottom: 0;}
.logo-sticky {position:absolute; top:40px; left:0; z-index:9999; width:100%; max-height:200px;}
.logo-sticky2 {position:absolute; top:0px; left:-15px; z-index:9999; width:250px; max-height:160px;}


/* =========================================================================
////	HOME
=========================================================================== */
.header-afbeelding {max-width:1680px; margin:40px auto 80px;}
.header-achtergrond {width:100%; display: inline-block; height:auto; background-size: cover;}
.scroll-down {position:absolute; top:55%; left:0; font-size:82px; text-align:center; width:100%; display:block;}
#header-container {background:url(images/header-achtergrond.jpg) center center fixed; -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover; position:relative;}
.header-achtergrond.home {height:100%; background-position: center center; background-repeat: no-repeat;}
.header-achtergrond.page {height:600px; background-position: center center; background-repeat: no-repeat;}
.column-container {width:90%; padding:5%;}
a.sfeer-home-link {width:100%; height:100%; display:inline-block; background-position: center center; background-repeat: no-repeat; background-size:cover; text-align:center; position:relative; transition: all 0.5s ease-in-out; }
a.sfeer-home-link:hover { transition: all 0.5s ease-in-out; -ms-transform: scale(1.4); -webkit-transform: scale(1.4); transform: scale(1.4);}
a.sfeer-home-link > p {position: absolute; margin: auto; top: 50%; left: 0; right: 0;  bottom: 0; text-align:center; color:#fff; font-size:20px; display:none;}
a.sfeer-home-link:hover > p {display:initial;}

li.gevelbeeld {width:100%; height:250px; margin-bottom:10px; background-position: center center; background-repeat: no-repeat; background-size:contain;}
li.gevelnaam {width:100%; text-align: center; margin-bottom:40px;}

.map {height:500px;}
.gm-style-iw {display:none;}

.form-home {background: rgba(255,255,255,0.9); padding:50px 30px; width:70%;}
.achtergrond-form {background:url(images/Roemerhuys-inschrijven-home.jpg) center center no-repeat; background-size:cover;}

/* ========================================================================= 
////	APPARTEMENTEN
=========================================================================== */
ul.appartementen > li {width:48%; display: inline-block; margin-right:2%; float:left; margin-bottom:40px; border-bottom:1px solid #afa57a; padding-bottom:40px;}
ul.appartementen > li:nth-child(2) {width:48%; display: inline-block; margin-right:0; float:right;}
ul.appartementen > li > * > span {color:#afa57a!important;}
a.panorama-link {padding:5px 0 5px 40px; font-size:16px; color:#000; background: url(images/panorama-icon.png) center left no-repeat;  background-size:contain;}
.impressie {width:100%; height:350px; background-position: center center; background-repeat: no-repeat; background-size:cover; margin-bottom:50px;}
.impressie > a {display: block; height:100%; background: url(images/magnify.png) 95% 95% no-repeat;}
.plattegrond {width:100%; height:600px; margin-bottom:30px; background-position: center center; background-repeat: no-repeat; background-size:contain;}
.list > ul > li {margin-left:15px; font-size:16px; margin-bottom:3px; color:#afa57a;}
ul.verdiepingen {list-style: none;}
ul.verdiepingen > li {width:50%; margin:0 0 20px 0; height:140px; float: left; background-position: center bottom; background-repeat: no-repeat;  background-size:contain;}

/* ========================================================================= 
////	CALENDAR CSS OVERRIDES
=========================================================================== */
.booking_form_div {margin:5px auto; width:288px;}
.wpbc_structure_form, .wpbc_structure_calendar {margin-bottom:60px;}
input[type="text"] {width:100%;}
.btn-group-vertical {
    display: none !important;
}


/* ========================================================================= 
////	PAGE
=========================================================================== */
.main-content * {color:#fff!important;}
.main-content p {margin:15px 0; display: block;}
.main-content h1 {margin:60px 0;}
.header-achtergrond.page {height:600px; background-position: center center; background-repeat: no-repeat;}
.symple-tabs > p {margin:0;}

span.embed-youtube {
position: relative;
padding-bottom: 56.25%;
padding-top: 18px; height: 0; overflow: hidden;
}

span.embed-youtube iframe,
span.embed-youtube object,
span.embed-youtube embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* Gallerij */
#gallery-1 img {border:none!important;}
#gallery-1 .gallery-item {width:30%!important; margin-right:3%!important; margin-top:30px!important;}

/* ========================================================================= 
////	SHOW HIDE NAV
=========================================================================== */
.cd-auto-hide-header {
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  background-color: #ffffff;
  /* Force Hardware Acceleration */
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  will-change: transform;
  -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s;
  transition: transform .5s;
  transition: transform .5s, -webkit-transform .5s;
  -webkit-box-shadow: 0px 3px 5px -3px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 3px 5px -3px rgba(0,0,0,0.75);
box-shadow: 0px 3px 5px -3px rgba(0,0,0,0.75);
}
.cd-auto-hide-header::after {
  clear: both;
  content: "";
  display: block;
}
.cd-auto-hide-header.is-hidden {
  -webkit-transform: translateY(-250%);
      -ms-transform: translateY(-250%);
          transform: translateY(-250%);
}


/* ========================================================================= 
////	FOOTER EN SUB CONTENT
=========================================================================== */
/* PARTIJEN */
.sfeerbeelden-blok {width:100%; margin:0 auto; overflow: auto; clear:both; overflow: auto;}
.sfeerbeeld-container {margin:0 auto; width:100%;}
.sfeerbeeld-container > ul > li {width:25%; margin:0 auto; height:600px; overflow: hidden; display:inline-block; float:left; background: no-repeat center center; background-size: cover;}

/* SHOUTBOX OP HOME */
.interesse-container {width:100%; margin:0 auto; clear:both;}
.interesse-blok {max-width:100%; margin:0 auto; background-color:#555; color:#fff!important; padding:40px;}
.interesse-blok h1, .interesse-blok h2, .interesse-blok h3, .interesse-blok h4, .interesse-blok h5, .interesse-blok h6, .interesse-blok p, .interesse-blok strong, .interesse-blok span, .interesse-blok quote {color:#fff!important; margin:0!important;}
.interesse-blok a { text-decoration: underline; color:#fff!important;}

/* INFORMATIE */
.informatie-container {width:100%; margin:0 auto; clear:both;}
.informatie-blok {max-width:1600px; margin:0 auto; background-color:#c0ba9b; color:#fff!important; padding:40px;}

/* GOOGLE MAP */
.map-blok {width:100%; margin:0 auto; text-align:center;}
.blok-groen {width:100%; text-align:center; padding:100px 0; background-color:#91a13a;}
#wpgmza_map {float:initial!important;}

/* PARTIJEN */
.partij-blok {width:100%; margin:0 auto; overflow:auto;}
.partij-container {max-width:1680px; margin:0 auto; padding:40px 0 80px 0; overflow:auto; }
.partij-container > ul {width:1120px; margin:0 auto;}
.partij-container > ul > li {width:31%; float:left; padding:20px 1%;}
.partij-container > ul > li > .logo-container {width:100%; height:100px; margin: 0 0 20px 0; position: relative;}
.partij-container > ul > li > .logo-container img {max-height:100%; max-width:100%; object-fit:cover; position: absolute; margin: auto; top: 0; left: 0;  bottom: 0;}

/* FOOTER COLUMNS */
ul.footer-columns {width:940px; padding:40px 20px 20px 20px; overflow:auto;}
ul.footer-columns > li {width:24%; margin-right:1%; display:inline-block; float:left;}
ul.footer-columns > li:last-child {width:25%; margin-right:0; display:inline-block; float:right; clear:right;}
ul.footer-columns > li > h6 {margin-bottom:20px; color: #009ee3;}
ul.footer-columns > li > p {color:#333; font-weight: 400; line-height: 20px;}
ul.footer-columns > li > p > a {color:#004783;}
ul.footer-columns > li > p > a:hover {color:#004783;}
ul.footer-columns > li > p > span {width:40%; display: inline-block;}

/* ========================================================================= 
////	CONTACT COMMENTS ZOEKEN
=========================================================================== */

/* Contact */
form.wpcf7-form {width:50%; margin:0 auto; display:block; border: none; text-align: center;}
form.wpcf7-form p {width: 100%; padding:0;text-align: center; margin: 0;}
.wpcf7-form-control {width:100%; padding:20px 0; margin:5px 0 20px 0; background:#fff; text-align: center; font-size:16px;}
.wpcf7-text, wpcf7-select {border:1px solid #ddd; position: relative;}
.wpcf7-acceptance {width:20px; position:relative; top:2.8px;}
span.wpcf7-checkbox {padding:10px; display:block; background:#fff; width:84%; border:1px solid #ddd;}
span.wpcf7-list-item {display:block;}
input {border:1px solid #ddd; padding:5px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
input:hover {border:1px solid #ccc}
input:focus {border:1px solid #685f5b}
textarea {border:1px solid #ccc;}
textarea:hover {border:1px solid #ccc;}
textarea:focus {border:1px solid #685f5b}
select {position:relative; border:1px solid #eee; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); cursor: pointer; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(http://www.houtbouwparadyske.nl/wp-content/uploads/2016/09/arrow-down-01-128.png) 98% / 15px no-repeat;}
select::after { content: '';  position: absolute; z-index: 1; right: 16px; top: 50%; margin-top: -8px; display: block; width: 16px; height: 16px; background: url("images/cd-icon-arrow.svg") no-repeat center center; pointer-events: none;}
select::-ms-expand {display: none;}
.wpcf7-response-output.wpcf7-display-none.wpcf7-validation-errors {border:none; background-color:#ff0000; color:#fff; text-align:center; font-family:Georgia, Times, Serif; font-size: 14px; font-weight: 700; letter-spacing:-0.03em; margin: 10px 0;}
span.wpcf7-not-valid-tip {color: #f00; font-size: 1em; text-align: center; display: block; width: 100%; margin-top:-15px; display:none;}
input.wpcf7-not-valid {border:1px solid #ff0000; background:#ffeeee; -webkit-box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 1); -moz-box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 1); box-shadow: 0px 0px 5px 0px rgba(255, 0, 0, 1);}
input.wpcf7-submit {padding:20px; margin:5px 0 0 0; display:inline-block; background:#cd1719; color:#fff; font-weight:700; cursor:pointer; width:auto;}
div.wpcf7-mail-sent-ok {background-color: #398F14; color:#fff; padding:15px;}
#wpcf7-f1555-p1551-o1 > form.wpcf7-form > p > input.wpcf7-submit {top:-10px;}
.ajax-loader {display: block!important;}

/* Contact Input fix */
::placeholder {color:#ccc; opacity: 1;}
:-ms-input-placeholder {color:#ccc;}
::-ms-input-placeholder {color:#ccc;}

/* Zoeken */
form.zoekbalk {height:30px; width:200px; z-index:2;}
form.zoekbalk > label {float:right; width:200px;}
form.zoekbalk > label > input {height:30px; border:0; position:relative;}
form.zoekbalk > label > input.zoekveld {height:30px; width:140px; margin:0 auto; padding-left:8px; border:1px solid #eee; background:#fff; position:absolute; bottom:-8px; right:0; z-index:3;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out}
form.zoekbalk > label > input:focus {height:30px; width:300px; border:1px solid #004783; -webkit-box-shadow: -200px 0px 10px 0px rgba(255,255,255,0.9); -moz-box-shadow: -200px 0px 10px 0px rgba(255,255,255,0.9); box-shadow: -200px 0px 10px 0px rgba(255,255,255,0.9);
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;}
form.zoekbalk > label > input.zoeken-afbeelding {position:absolute; bottom:-3px; right:10px; height:20px; width:20px; z-index:4;}

/* ========================================================================= 
////	NAVIGATIE - DESKTOP
=========================================================================== */
#cssmenu { margin:0; z-index:1; font-family: 'FuturaStd-Bold', Times, Georgia, serif; font-size: 16px; font-weight: 400; text-align: right;}
#cssmenu > ul {margin: 0; padding: 0; position: relative;}
#cssmenu > ul > li { position: relative; display:inline-block;}
#cssmenu > ul > li > a {padding:20px 5px; display: inline-block; color: #000; text-decoration: none; line-height: 18px;}
#cssmenu > ul > li:hover > a {color:#aaa; }
#cssmenu > ul > li.active > a {}
#cssmenu > ul > li.menu-item-has-children.has-sub > a:after {font-family: FontAwesome; content: "\f107"; margin-left:5px;}
	/*  ==== DROPDOWN ===== */
#cssmenu > ul ul {opacity: 0; visibility: hidden; position: absolute; top: 40px; left: 0%; background:rgba(255,255,255,0.85); margin: 0; padding: 15px; border-top:3px solid #fff; transition: all .1s ease-in-out; z-index:9999;
	-webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.3);}
#cssmenu > ul li:hover > ul {opacity: 1; top: 60px; visibility: visible; margin: 0; color: #aaa; z-index: 2; transition: all .3s ease-in-out; border-top:3px solid #aaa;}
#cssmenu > ul ul li {text-align: left; list-style: none; padding: 0; margin: 0; width: 100%; position:relative;}
#cssmenu > ul ul li a {font-family: Arial, Helvetica, sans-serif; padding: 10px; border-bottom:1px solid #eee; display: block; color: #555; font-size: 14px; text-decoration: none; font-weight:300; width: 200px;}
#cssmenu > ul ul li:last-child a {border:0;}
#cssmenu > ul ul li a:hover {font-weight:400; color:#aaa;}

/* ========================================================================= 
////	NAVIGATIE - MOBIEL
=========================================================================== */
.kleinscherm {display:none;} 
.slidingDiv {height:auto; background-color: #f5f5f5; padding:0; margin-top:0px;}
.show_hide {display:none; cursor:pointer;}
.menu-knop-klein {display:block; text-align: right; padding:10px 0; border-top:1px solid #eee; border-bottom:1px solid #eee;}
.menu-knop-klein > h6:before {font-family: FontAwesome; content: "\f0c9"; margin-right:15px; color:#aaa!important;}
#mobiel {z-index:9999;}
#mobiel > ul > li {text-align:center;}
#mobiel > ul > li > a {font-family:'Roboto', Arial; font-size: 14px; color:#444; font-weight: 700; display:block; padding:20px 0; border-bottom:1px solid #ddd;}
#mobiel > ul > li > a:hover {background-color:#777; color:#fff;}
#mobiel > ul > li.current_page_item > a {background-color:#333; color:#fff;}
#mobiel > ul > li:last-child > a {border-bottom:none;}
#mobiel > ul > li > ul.sub-menu {background-color:#eee;}
#mobiel > ul > li > ul.sub-menu > li {}
#mobiel > ul > li > ul.sub-menu > li > a {display:block; padding:10px; color:#444;}
#mobiel > ul > li > ul.sub-menu > li.current_page_item > a {background-color:#ccc;}


/* ========================================================================= 
////	FORMATEN
=========================================================================== */

@media only screen and (max-width: 1200px) {
	.header, .content-container {width:95%;}
	.sfeerbeeld-container, .map-blok, .header-afbeelding, .partij-blok, partij-container {width:100%;}
	.partij-container > ul {width:95%;}
	.interesse-blok {width:95%; padding:2.5%;}
	.grootscherm {margin:0 auto; width:100%;}

}


@media only screen and (max-width: 980px) {
	.sidebar {padding-top:20px;}
	.sfeerbeeld-container > ul > li {height:350px;}
	ul.woningtype-lijst > li {width:100%;}
	ul.woningtype-lijst {width:45%;}
}



@media only screen and (max-width: 780px) {	

	.grootscherm, .header-naw, .nav-groot {display:none;}
	.kleinscherm {display:initial; z-index:9999; width:95%;}

	.sfeerbeeld-container > ul > li {width:50%; height:250px;}

	form.wpcf7-form p {padding:0 5%;}
	ul.woningtype-lijst > li {width:95.5%;}
	ul.woningtype-lijst {width:90%; float:left;}
	a.sfeer-home-link > p {display:initial;}
	ul.appartementen > li, ul.appartementen > li:nth-child(2) {width:100%; margin:0; float: inherit; margin-bottom:40px; border-bottom:1px solid #afa57a; padding-bottom:40px;}
	form.wpcf7-form {width:90%; margin:0!important;}
  
  #gallery-1 .gallery-item {margin-top:25px!important;}
	.intro {padding:0 5%;}
	 .mobiel-spacing {margin:30px 0;}
}


 @media screen and (max-width: 640px) {
	 .plattegrond {height:400px;}
	 .header-logo {height:140px;}
	 #gallery-1 .gallery-item {margin-top:20px!important;}
	 
}

 @media screen and (max-width: 480px) {
	.footer-container {width:95%;}
	.sfeerbeeld-container > ul > li {width:50%; height:150px;}
	h1 {font-size:26px;}
	.partij-container > ul > li {width:100%; float:left; padding:20px 1%;}
	a.gallery_image img {width:50%; display:block; text-align:center; float:left;}
    #gallery-1 .gallery-item {margin-top:15px!important;}
	
}

 @media screen and (max-width: 360px) {
    #gallery-1 .gallery-item {margin-top:10px!important;}
}

/* Google maps */
.maps-element {
    line-height: 0;
}

.maps-element iframe {
	width: 100%;
	height: 400px;
}