/* CSS-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, sub, sup, tt, var, u, i, center, dl, dt, dd, aul, ali, 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 { border: 0; font-size: 100%; font: inherit; vertical-align: baseline; margin: 0; padding: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }

/* Global */
html { background: #fff; }
body { color: #4c6372;font-family: 'Open Sans', sans-serif; font-size: 13px; font-weight: 400; margin-top: 100px; background: #fff; }
.wrapper { display: block; margin: 0 auto; position: relative; max-width: 1200px; width: auto; padding: 0; margin-bottom: 0px; }
.widewrapper { max-width: 1200px; width: auto; padding: 0; background: #fff; display: block; margin: 0 auto; overflow: hidden; }
.bar { max-width: 1000px; width: 100%; margin: 0 auto; position: relative; }
.nomargin { margin-bottom: 0; }
h1 { font-size: 24px; font-weight: 800; }
h2 { font-size: 24px; font-weight: 400; line-height: 28px; margin-bottom: 10px; padding-top: 15px; font-family: 'Source Sans Pro', sans-serif }
h2.topmargin { pfadding-top:15px}
h3 { font-size: 14px; }
a {color: #bfd799}
a:hover { color: #999; }
.wrapper.lightgreen { background-color: #bfd799; }
.logo { background: url('../img/park15_logo.png') no-repeat; background-size: 196px 61px; width: 196px; height: 61px; display: block; position: absolute; left: 10px; top: 20px; }
.subtop .touch { display: none; }

/*  Header */
.topbar { background: #fff none repeat scroll 0 0; display: block; height: 100px; left: 0; overflow: visible; padding: 0; position: fixed; top: 0; width: 100%; z-index: 999; }
    .topbar .touch { display: none; }
.bar.top { top: 10px; }
.top .extralink {   border: 1px solid #527486;
    color: #527486;
    font-size: 11px;
    line-height: 20px;
    margin-top: 7px;
    padding: 0 10px;
    position: absolute;
    right: 180px;}
.lngspan { position: absolute; right: 20px; top: 5px; color: #939598; }
    .lngspan a { color: #939598; line-height: 25px; text-decoration: none; margin: 1px; text-transform: uppercase; }
        .lngspan a.current, .lngspan a:hover { color: #527486; background-position: 0 0; }

/* summary */

ul.summarylist{  list-style:none}
ul.summarylist>li{border-bottom:1px solid #999;margin-bottom:10px;padding-bottom:10px;background: url('/img/sum_bullet.png') no-repeat;padding-left:27px;font-size:14px}
ul.summarylist>li>ul{font-size:13px;list-style:none;padding-left:20px}
ul.summarylist>li>ul>li:before{content: "-";font-size:15px;padding-right:10px;margin-left:-15px}
ul.summarylist>li>ul>li{padding-left:12px}
.summaryback{background:#f1f2ea  url('/img/summaryback.png') no-repeat bottom right;max-width:1200px}
.summarybacktitle{background:#f1f2ea  url('/img/summaryback.png') no-repeat top right;max-width:1200px}
.summarybacktitle h2{margin-bottom:0;padding-bottom:20px}


/* menu bar */
.menubar { display: block; }
#nav { position: absolute; right: 0px; top: 50px; z-index: 999; font-size: 12px; }
    #nav > a { display: none; }
    #nav li { position: relative; list-style: none; text-align: left; }
        #nav li a { color: #223770; display: block; }
            #nav li a:active { color: #f4872c; }
    #nav span:after { width: 0; height: 0; border: 1px solid transparent; border-top-color: #838383; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -2px; border-width: 0.313em 0.313em medium; }

    /* first level */
    #nav > ul { height: 25px; padding: 0 10px; width: 100%;margin: 8px 0 }
        #nav > ul > li { height: 100%; float: left; padding: 0 5px; color: #575757; }
            #nav > ul > li:hover span:after, #nav > ul .active span:after { border-top-color: #f4872c; }
            #nav > ul > li > a { font-size: 15px; text-decoration: none; text-align: center; text-transform: uppercase; color: #527486; margin: 0 5px;line-height:25px;font-family: 'Source Sans Pro', sans-serif }
            #nav > ul > li.active >a { border-bottom: 2px solid #527486; }

/* content : top-header*/
.topimage { max-width: 1200px; min-height: 300px; overflow: hidden; position: relative; padding: 0; }
    .topimage img { display: block; width: 100%; }
.topbannercontainer { max-width: 1000px; width: 100%; margin: 0 auto; top: 0; text-transform: uppercase; }
.topbanner { color: #fff; display: block; margin: 0 auto; max-width: 1000px; position: absolute; top: 10%; width: 50%; left: 20px; }
    .topbanner h3, .topbanner h2 { text-align: center; overflow: hidden; padding-bottom: 15px; }
    .topbanner h2 { font-size: 40px; font-weight: 800; color: #fff; text-shadow: 1px 1px #333; text-align: left;line-height:45px }

/* content : text*/
.textbar { padding-bottom: 20px; padding-top: 0; }
.leftbar, .mainbar { display: block; padding: 0; margin: 0; }
.leftbar { width: 33%; float: left; top: 0; margin-left: 2%; margin-right: 2%; }
    .leftbar h3 { font-size: 10px; text-transform: uppercase; margin-top: 7px; }
        .leftbar h3.big { font-size: 38px; font-weight: 800; line-height: 35px; }
.mainbar { width: 65%; float: left; top: 0; }
    .mainbar img { width: 100%; margin-bottom: -10px; }
.smalcol .leftbar { width: 29%; padding: 0 2%; margin: 0; }
.smalcol .mainbar { width: 67%; }
.col2 .leftbar, .col2 .mainbar { width: 45%; }
.gevestigd { line-height: 66px; font-weight: 200; font-size: 16px; margin-top: 20px;display:block }
.bluegraphicbar, .bluerefgraphicbar, .greengraphicbar, .yellowgraphicbar { background: url("../img/park15_background.png") no-repeat; background-size: 1000px 2080px; color: #527486; padding-bottom: 0; margin-bottom: -10px; }
.bluegraphicbar { background-position: 0 -660px; background-color: #ebf2f8; }
.greengraphicbar,.yellowgraphicbar { background-position: 0 -1140px; background-color: #e9f2de; }
.aaayellowgraphicbar { background-position: 0 -1720px; background-color: #fbf7e8; }
.bluerefgraphicbar{ background-position: right -1644px; background-color: #ebf2f8; }

/* content : iamgelist */
.fancybox { display: none; }
    .fancybox.ImageLink { display: block; }

/* content : title */
.titlebar { padding-bottom: 0; padding-top: 40px; }
    .titlebar h2 , .titlebar h1{ text-align: center; overflow: hidden; padding-bottom: 15px; font-size: 24px; font-weight: 800; color: #204663; font-weight: normal; }

/* content : columns*/
.colbar { overflow: hidden;padding-bottom: 20px; }
    .colbar > div { margin: 3%; float: left; position: relative; }
        .colbar > div:last-child { display: none; }
    .colbar.col1 > div { margin: 1% 3%;width:96%}
    .colbar.col2 > div { width: 45%; }
        .colbar.col2 > div:nth-child(odd) { margin-left: 0; }
        .colbar.col2 > div:nth-child(even) { margin-right: 0; float: right; }
    .colbar.col3 > div { width: 29.3%; margin: 3%;margin-top:0}
        .colbar.col3 > div:first-child { margin-left: 0; }
        .colbar.col3 > div:nth-child(3n) { margin-right: 0; }
    .colbar.col4 > div { width: 19%; }
        .colbar.col4 > div:first-child { margin-left: 0; }
        .colbar.col4 > div:nth-child(4n) { margin-right: 0; }
 .colbar.col2.imagetop_wide > div { width: 49.84%; margin-left:0;margin-right:0 ;margin-top:-40px}
 .colbar.imagetop_wide{padding-bottom:0}
    .colbar.imagetop > div.colbar.imagetopsmall > div { width: 32%; margin: 1%; }
    .colbar.imagetop img ,  .colbar.imagetopsmall img { width: 100%; }
    .colbar.imagetop > div.colbar.newslist  > div { width: 32%; margin: 1%; }
    .colbar.imagetop img ,  .colbar.newslist  img { width: 100%; }
        .colbar.imagetop img.staticimg,   .colbar.imagetopsmall img.staticimg { position: absolute; top: 0; opacity: 0; }
            .colbar.imagetop img.staticimg:hover, .colbar.imagetopsmall img.staticimg:hover { opacity: 100; }
    .colbar h2 { font-size: 16px; border-bottom: none; padding-top:0;font-weight:400;margin-bottom:0}
    .colbar.imagetop h2  .colbar.imagetopsmall h2{ margin-top: 10px; }
  .colbar.imagetop h2  .colbar.newslist h2{ margin-top: 10px; }
    .colbar.imageleft img { width: 30%; float: left; margin-right: 5%; }
.imagetop_wide.col3 > div { width: 33%; padding: 0; margin: 0; padding-right: 0.33%; }
.imagetop_wide img { width: 100%; position: relative; }
.graphic { }
    .graphic .bottom, .graphic .top { background: url("../img/park15_background.png") no-repeat; background-size: 1000px 1580px; color: #fff; }
    .graphic img { padding-top: 80px; margin-bottom: -10px; }
    .graphic .top { position: absolute; left: 0; top: 0; width: 220px; height: 180px; color: #fff; padding: 20px; }
    .graphic .bottom { height: 100px; display: block; padding: 20px;background:none }
        .graphic .bottom ul { padding-top: 0; margin-top: 0; padding-left: 10px; }
    .graphic h2 { font-size: 24px; font-weight: 200; line-height: 25px; }
    .graphic.blue .top { background-position: 0 0; }
    .graphic.blue .bottom { background-position: 0px -400px; background-color: #187bb3; }
    .graphic.orange .top { background-position: -668px 0; }
    .graphic.orange .bottom { background-position: -668px -400px; background-color: #e0bc31; }
    .graphic.green .top { background-position: -335px 0; }
    .graphic.green .bottom { background-position: -335px -400px; background-color: #6bbd46; }
.checkmark { margin-left: -1em; }
    .checkmark li { list-style: none;line-height:18px }
        .checkmark li:before { color: #bfd799; content: '\2713'; margin-left: -1em; margin-right: .300em; font-weight:800;font-size:16px}
.titleback img{max-width:100%}
.detaillink{display:block;padding-top:10px}

.height_IDreferenties{text-align:center;height:450px;display:block;}
.colbar.col2.height_IDreferenties  > div{width:40%}
.height_IDreferenties >div{position:relative;height:100%;display:block;padding:0 3%}
.height_IDreferenties h2{border-bottom: 1px solid #ccc;    font-weight: normal;    margin-bottom: 20px;    margin-left: 10%;    padding-bottom: 10px;    text-align: center;    width: 80%;}
.height_IDreferenties img{height:50%;position:absolute;bottom:0px;left: calc(50% - 150px);}

/* footer */
.footer { background: url("../img/footer2_back.png") no-repeat; background-size: 1000px 62px; color: #fff; font-size: 10px; padding: 10px 0; }
    .footer a { color: #fff; text-decoration: none; }
    .footer .footer_left { background: rgba(0, 0, 0, 0) url("../img/spot.png") no-repeat scroll 0 0 / 60px 30px; left: 20px; line-height: 29px; padding-left: 65px; position: absolute; top: 15px; }
    .footer .footer_center { height: 42px; line-height: 14px; margin: 0 auto; position: relative; width: 282px; text-align: center; top: 5px; }
    .footer .footer_right { position: absolute; right: 20px; text-align: right; top: 15px; width: 150px; line-height: 29px; }
.hidewhenmobile { background: url("../img/back_footer.png"); background-size: 1000px 340px; height: 190px; display: block; color: #fff; }
.logos { margin-top: 20px;display:block;margin:20px 10px 0 10px;left:10px }
  .logos>img{width:100%;margin:0}




/* bedrijven map */
#mapcontrol { margin: 0 auto; width: 100%; height: 450px; border: none; max-width:1000px;}

.companylist{display: flex;flex-wrap: wrap;max-width:1000px;width:96%}
.company { fldoat: left; width: 49%; display: block; margin: 10px 0; bodrder: 1px solid #333; position:relative;padding-bottom:35px}
    .company:nth-child(odd) { margin-right: 2%; }

.company   h3 { line-height: 32px; height: 32px; padding: 10px 0 0 10px; background-color: #fff; border: 1px solid #eee; border-bottom: 1px solid #bbb; -khtml-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; }
    .company .bedrijfmain { display: block; backgrdound-color: #b26599; height: 205px; padding-top: 15px; position: relative;  border-left: 1px solid #eee; border-right: 1px solid #eee; padding-bottom:40px}
    .company .bedrijftekst { width: 65%; padding-left: 10px; display: block; }
    .company .companylogo { position: absolute; right: 0; top: 0; width: 33%; hfeight: 140px; }
    .company .bedrijflink { position: absolute; left: 15px; bottom: 10px; height: 26px; display: block; }
    .company .bedrijfclose { background-color: #f6f4ef; overflow:hidden;border-bottom: 1px solid #999; border-radius: 0 0 5px 5px; display: block; height: 36px; position: absolute; width:100%;bottom:0}

    .company .bedrijf_detail { color: #333; line-height: 36px; padding-left: 20px; z-index: 9999; }
.purplelink{text-decoration:none;padding:10px;color:#fff;background:#8e1e69}

.bedrijflink { }
    .bedrijflink a { float: left; background: url(../img/socialcompanybar.png); background-size: 172px 27px; display: block; float: right; height: 27px; margin-right: 5px; width: 25px; }
    .bedrijflink .youtube { background-position: 0 0; }
    .bedrijflink .linkedin { background-position: -49px 0; }
    .bedrijflink .twitter { background-position: -26px 0; }
    .bedrijflink .facebook { background-position: -98px 0; }
    .bedrijflink .website { background-position: -122px 0; }
.bedrijfclose .purplelink{position:absolute;right:0;bottom:0px;background:#b21880}




/* CLIENT SPECIFIC*/
.height_IDnieuws.col3 > div { height: 330px;margin-right:0.5%;width:32.4%;margin-left:0.5%!important }

.mceItemTable { width: 100%; }
    .mceItemTable input, .mceItemTable textarea { border: none; margin-top: 6px; width: 100%; }
.SubmitButton { background-color: #e0bc31; color: #fff; font-size: 14px; font-weight: 200; line-height: 25px; }
.socialbar { width: 600px; max-width: 100%; margin: 10px auto 0 }
    .socialbar a { background: rgba(0, 0, 0, 0) url("../img/socialbar.png") no-repeat scroll 0 0; display: block; float: left; height: 21px; width: 30px; margin-right: 15px; margin-top: 15px; background-size: 200px 21px}
    .socialbar .youtube { background-position: -90px 0; }
    .socialbar .vimeo { background-position: -129px 0; }
    .socialbar .linkedin { background-position: -42px 0; }
    .socialbar .googleplus { background-position: -176px 0; }


/*  SCALING RESOLUTIONS  */
/* specific for image headers - scale upto 750px and then center*/
@media only screen and (max-width: 750px) {
    .topimage img { width: 750px; display: block; left: 50%; margin-left: -375px; position: relative; }
}
/* make sure menu bar is centralized*/
@media only screen and (min-width: 1200px) {
    .topbar { left: 50%; margin-left: -600px; }
}

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

    /* menu*/
    #nav { position: absolute; width: 100%; z-index: 9999; }
        #nav .menubar { position: absolute; top: 43px; display:none}
        #nav ul { padding: 0; }
            #nav ul li { padding: 0; left: 0px; display: block; border-top: 1px solid #000; tgop: 160px; line-height: 40px; height: 40px; padding-left: 4%; width: 100%; background: #e9f2de; color: #527486; }
        #nav > ul > li.active { background-color: #bfd799; border: none; }
        #nav .touch { bagkground: #bfd799 none repeat scroll 0 0; color: #000; display: block; font-size: 13px; height: 35px; line-height: 35px; opacity: 0.7; padding-left: 10px; position: absolute; right: 20px; text-transform: uppercase; top: 0; width: 70px; }
        #nav > ul > li > a { line-height:40px}
        #nav > ul > li.active > a { border:none}
}

/* Note: Design for a width of 768px */
@media only screen and (max-width: 769px) {
    .wrapper { width: 100%; min-width: 150px; }
    /* menu*/

         .mainbar, .leftbar { width: 90%; margin-left: 2%; }
    .col2 .leftbar, .col2 .mainbar { width: 96%; }
    .mainbar img { margin-left: -10%; width: 120%; }
  .logos>img{width:100%;margin:0}
    .smalcol .mainbar, .smalcol .leftbar { width: 90%; }
    .smalcol .leftbar { padding-bottom: 10px; }
    .titlebanner { width: 90%; padding: 0 5%; }
    .colbar.col4 > div { width: 45%; }
        .colbar.col4 > div:nth-child(odd) { margin-left: 0; }
        .colbar.col4 > div:nth-child(even) { margin-right: 0; float: right; }
    .topbar .rightheader { display: none; }
    .topbar .leftheader { width: 100%; }
    .aaahidewhenmobile .mainbar { display: none; }
.hidewhenmobile{height:auto}
.company{width:100%;margin-right:0!important}
.company .bedrijfmain{height:150px}
    .colbar.col3 > div { }
        .colbar.col3 > div:nth-child(odd) { margin-left: 0; }
    .topbanner h2 { font-size: 35px; }
    .topbanner h3 { font-size: 18px; }
    .greengraphicbar, .bluegraphicbar, .yellowgraphicbar { background-image: none; }
    .graphic .top { padding-left:2%}
    .colbar.imagetop img ,  .colbar.imagetopsmall img,  .colbar.newslist img  { margin-left:-2%}
    .graphic .bottom {margin-left:-2% }
    .titlebar { padding-top:10px}
.colbar.col2.height_IDreferenties  > div{width:94%}
.height_IDreferenties{height:auto}
.height_IDreferenties img{width:50%;position:relative;bottom:0;left:0%}
}

@media only screen and (max-width: 600px) {
    .colbar.col1 > div {width:100% }
    .colbar.col3 > div { width: 40%; }
    .colbar.col2 > div, .colbar.col3 > div, .colbar.col4 > div , .colbar.col2.imagetop_wide > div { width: 100%; float: left; height: auto !important; padding-left:0}
        .colbar.col2 > div:nth-child(even), .colbar.col3 > div:nth-child(even), .colbar.col4 > div:nth-child(even) { float: left; margin-left: 0; }

.colbar.col2.imagetop_wide > div{margin-top:-13px}


    .colbar.col3.height_IDpartners > div { padding-top: 0; }
    .imagetop_wide img { position: relative; }
    .imagetop_wide img { margin: 0; padding: 0; width: 100%; }
    .graphic img { margin-bottom: -10px;margin-left:-2% }
    .graphic .bottom { background-image: none; height: auto; margin-bottom: 15px; }
    .colbar.imageleft img { width:94%}

    .titlebar h2 {text-align:left;margin-left:2% }
}

@media only screen and (max-width: 570px) {
    .extralink { display: none; }
    .topbanner {width:90% }
}

@media only screen and (max-width: 500px) {
    body { margin-top: 80px; }
    .footer_left, .footer_right, .topbar .leftheader { display: none; }
}