/* Theme Name: UwVerzuimregisseur-v2 Author: Blitskikker Author URI: http://blitskikker.nl Description: Op maat thema voor UwVerzuimregisseur -- ontwikkeld door Blitskikker Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: starter This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. Starter is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Grid # Normalize # Typography # Elements # Forms # Navigation ## Links ## Menus # Accessibility # Alignments # Clearings # Widgets # Content ## Posts and pages ## Comments # Infinite scroll # Media ## Captions ## Galleries /*-------------------------------------------------------------- # Fonts --------------------------------------------------------------*/ @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM45Regular-Italic.eot'); src: local('Core Slab'), local('CoreSlabM45Regular-Italic'), url('fonts/coreslab/CoreSlabM45Regular-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM45Regular-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM45Regular-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM45Regular-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM45Regular-Italic.svg#CoreSlabM45Regular-Italic') format('svg'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM65Bold.eot'); src: local('Core Slab'), local('CoreSlabM65Bold'), url('fonts/coreslab/CoreSlabM65Bold.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM65Bold.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM65Bold.woff') format('woff'), url('fonts/coreslab/CoreSlabM65Bold.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM65Bold.svg#CoreSlabM65Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM35Light.eot'); src: local('Core Slab'), local('CoreSlabM35Light'), url('fonts/coreslab/CoreSlabM35Light.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM35Light.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM35Light.woff') format('woff'), url('fonts/coreslab/CoreSlabM35Light.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM35Light.svg#CoreSlabM35Light') format('svg'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM55Medium-Italic.eot'); src: local('Core Slab'), local('CoreSlabM55Medium-Italic'), url('fonts/coreslab/CoreSlabM55Medium-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM55Medium-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM55Medium-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM55Medium-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM55Medium-Italic.svg#CoreSlabM55Medium-Italic') format('svg'); font-weight: 500; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM65Bold-Italic.eot'); src: local('Core Slab'), local('CoreSlabM65Bold-Italic'), url('fonts/coreslab/CoreSlabM65Bold-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM65Bold-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM65Bold-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM65Bold-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM65Bold-Italic.svg#CoreSlabM65Bold-Italic') format('svg'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.eot'); src: local('Core Slab'), local('CoreSlabM75ExtraBold-Italic'), url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM75ExtraBold-Italic.svg#CoreSlabM75ExtraBold-Italic') format('svg'); font-weight: 800; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM55Medium.eot'); src: local('Core Slab'), local('CoreSlabM55Medium'), url('fonts/coreslab/CoreSlabM55Medium.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM55Medium.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM55Medium.woff') format('woff'), url('fonts/coreslab/CoreSlabM55Medium.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM55Medium.svg#CoreSlabM55Medium') format('svg'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM85Heavy-Italic.eot'); src: local('Core Slab'), local('CoreSlabM85Heavy-Italic'), url('fonts/coreslab/CoreSlabM85Heavy-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM85Heavy-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM85Heavy-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM85Heavy-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM85Heavy-Italic.svg#CoreSlabM85Heavy-Italic') format('svg'); font-weight: 900; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM75ExtraBold.eot'); src: local('Core Slab'), local('CoreSlabM75ExtraBold'), url('fonts/coreslab/CoreSlabM75ExtraBold.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM75ExtraBold.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM75ExtraBold.woff') format('woff'), url('fonts/coreslab/CoreSlabM75ExtraBold.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM75ExtraBold.svg#CoreSlabM75ExtraBold') format('svg'); font-weight: 800; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.eot'); src: local('Core Slab'), local('CoreSlabM25ExtraLight-Italic'), url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM25ExtraLight-Italic.svg#CoreSlabM25ExtraLight-Italic') format('svg'); font-weight: 200; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM85Heavy.eot'); src: local('Core Slab'), local('CoreSlabM85Heavy'), url('fonts/coreslab/CoreSlabM85Heavy.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM85Heavy.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM85Heavy.woff') format('woff'), url('fonts/coreslab/CoreSlabM85Heavy.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM85Heavy.svg#CoreSlabM85Heavy') format('svg'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab5'; src: url('fonts/coreslab/CoreSlabM45Regular.eot'); src: local('Core Slab'), local('CoreSlabM45Regular'), url('fonts/coreslab/CoreSlabM45Regular.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM45Regular.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM45Regular.woff') format('woff'), url('fonts/coreslab/CoreSlabM45Regular.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM45Regular.svg#CoreSlabM45Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM35Light-Italic.eot'); src: local('Core Slab'), local('CoreSlabM35Light-Italic'), url('fonts/coreslab/CoreSlabM35Light-Italic.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM35Light-Italic.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM35Light-Italic.woff') format('woff'), url('fonts/coreslab/CoreSlabM35Light-Italic.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM35Light-Italic.svg#CoreSlabM35Light-Italic') format('svg'); font-weight: 300; font-style: italic; font-display: swap; } @font-face { font-family: 'Core Slab'; src: url('fonts/coreslab/CoreSlabM25ExtraLight.eot'); src: local('Core Slab'), local('CoreSlabM25ExtraLight'), url('fonts/coreslab/CoreSlabM25ExtraLight.eot?#iefix') format('embedded-opentype'), url('fonts/coreslab/CoreSlabM25ExtraLight.woff2') format('woff2'), url('fonts/coreslab/CoreSlabM25ExtraLight.woff') format('woff'), url('fonts/coreslab/CoreSlabM25ExtraLight.ttf') format('truetype'), url('fonts/coreslab/CoreSlabM25ExtraLight.svg#CoreSlabM25ExtraLight') format('svg'); font-weight: 200; font-style: normal; font-display: swap; } * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /*-------------------------------------------------------------- # Grid --------------------------------------------------------------*/ .row,.row.reverse{-webkit-box-orient:horizontal}.container-fluid{margin-right:auto;margin-left:auto;padding-right:2rem;padding-left:2rem}.row{box-sizing:border-box;display:-webkit-flex;display:-ms-flexbox;display:-webkit-box;display:flex;-webkit-flex:0 1 auto;-ms-flex:0 1 auto;-webkit-box-flex:0;flex:0 1 auto;-webkit-flex-direction:row;-ms-flex-direction:row;-webkit-box-direction:normal;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.col.reverse,.row.reverse{-webkit-box-direction:reverse}.row.reverse{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.col.reverse{-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;-webkit-box-orient:vertical;flex-direction:column-reverse}.col-xs,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9{box-sizing:border-box;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;-webkit-box-flex:0;flex:0 0 auto}.col-xs{-webkit-flex-grow:1;-ms-flex-positive:1;-webkit-box-flex:1;flex-grow:1;-ms-flex-preferred-size:0;-webkit-flex-basis:0;flex-basis:0;max-width:100%}.col-xs-1{-ms-flex-preferred-size:8.333%;-webkit-flex-basis:8.333%;flex-basis:8.333%;max-width:8.333%}.col-xs-2{-ms-flex-preferred-size:16.667%;-webkit-flex-basis:16.667%;flex-basis:16.667%;max-width:16.667%}.col-xs-3{-ms-flex-preferred-size:25%;-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.col-xs-4{-ms-flex-preferred-size:33.333%;-webkit-flex-basis:33.333%;flex-basis:33.333%;max-width:33.333%}.col-xs-5{-ms-flex-preferred-size:41.667%;-webkit-flex-basis:41.667%;flex-basis:41.667%;max-width:41.667%}.col-xs-6{-ms-flex-preferred-size:50%;-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.col-xs-7{-ms-flex-preferred-size:58.333%;-webkit-flex-basis:58.333%;flex-basis:58.333%;max-width:58.333%}.col-xs-8{-ms-flex-preferred-size:66.667%;-webkit-flex-basis:66.667%;flex-basis:66.667%;max-width:66.667%}.col-xs-9{-ms-flex-preferred-size:75%;-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.col-xs-10{-ms-flex-preferred-size:83.333%;-webkit-flex-basis:83.333%;flex-basis:83.333%;max-width:83.333%}.col-xs-11{-ms-flex-preferred-size:91.667%;-webkit-flex-basis:91.667%;flex-basis:91.667%;max-width:91.667%}.col-xs-12{-ms-flex-preferred-size:100%;-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}.col-xs-offset-1{margin-left:8.333%}.col-xs-offset-2{margin-left:16.667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.333%}.col-xs-offset-5{margin-left:41.667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.333%}.col-xs-offset-8{margin-left:66.667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.333%}.col-xs-offset-11{margin-left:91.667%}.start-xs{-webkit-justify-content:flex-start;-ms-flex-pack:start;-webkit-box-pack:start;justify-content:flex-start;text-align:start}.center-xs{-webkit-justify-content:center;-ms-flex-pack:center;-webkit-box-pack:center;justify-content:center;text-align:center}.end-xs{-webkit-justify-content:flex-end;-ms-flex-pack:end;-webkit-box-pack:end;justify-content:flex-end;text-align:end}.top-xs{-webkit-align-items:flex-start;-ms-flex-align:start;-webkit-box-align:start;align-items:flex-start}.middle-xs{-webkit-align-items:center;-ms-flex-align:center;-webkit-box-align:center;align-items:center}.bottom-xs{-webkit-align-items:flex-end;-ms-flex-align:end;-webkit-box-align:end;align-items:flex-end}.around-xs{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.between-xs{-webkit-justify-content:space-between;-ms-flex-pack:justify;-webkit-box-pack:justify;justify-content:space-between}.first-xs{-webkit-order:-1;-ms-flex-order:-1;-webkit-box-ordinal-group:0;order:-1}.last-xs{-webkit-order:1;-ms-flex-order:1;-webkit-box-ordinal-group:2;order:1}@media only screen and (min-width:48em){.container{width:46rem}.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9{box-sizing:border-box;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;-webkit-box-flex:0;flex:0 0 auto}.col-sm{-webkit-flex-grow:1;-ms-flex-positive:1;-webkit-box-flex:1;flex-grow:1;-ms-flex-preferred-size:0;-webkit-flex-basis:0;flex-basis:0;max-width:100%}.col-sm-1{-ms-flex-preferred-size:8.333%;-webkit-flex-basis:8.333%;flex-basis:8.333%;max-width:8.333%}.col-sm-2{-ms-flex-preferred-size:16.667%;-webkit-flex-basis:16.667%;flex-basis:16.667%;max-width:16.667%}.col-sm-3{-ms-flex-preferred-size:25%;-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.col-sm-4{-ms-flex-preferred-size:33.333%;-webkit-flex-basis:33.333%;flex-basis:33.333%;max-width:33.333%}.col-sm-5{-ms-flex-preferred-size:41.667%;-webkit-flex-basis:41.667%;flex-basis:41.667%;max-width:41.667%}.col-sm-6{-ms-flex-preferred-size:50%;-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.col-sm-7{-ms-flex-preferred-size:58.333%;-webkit-flex-basis:58.333%;flex-basis:58.333%;max-width:58.333%}.col-sm-8{-ms-flex-preferred-size:66.667%;-webkit-flex-basis:66.667%;flex-basis:66.667%;max-width:66.667%}.col-sm-9{-ms-flex-preferred-size:75%;-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.col-sm-10{-ms-flex-preferred-size:83.333%;-webkit-flex-basis:83.333%;flex-basis:83.333%;max-width:83.333%}.col-sm-11{-ms-flex-preferred-size:91.667%;-webkit-flex-basis:91.667%;flex-basis:91.667%;max-width:91.667%}.col-sm-12{-ms-flex-preferred-size:100%;-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}.col-sm-offset-1{margin-left:8.333%}.col-sm-offset-2{margin-left:16.667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.333%}.col-sm-offset-5{margin-left:41.667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.333%}.col-sm-offset-8{margin-left:66.667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.333%}.col-sm-offset-11{margin-left:91.667%}.start-sm{-webkit-justify-content:flex-start;-ms-flex-pack:start;-webkit-box-pack:start;justify-content:flex-start;text-align:start}.center-sm{-webkit-justify-content:center;-ms-flex-pack:center;-webkit-box-pack:center;justify-content:center;text-align:center}.end-sm{-webkit-justify-content:flex-end;-ms-flex-pack:end;-webkit-box-pack:end;justify-content:flex-end;text-align:end}.top-sm{-webkit-align-items:flex-start;-ms-flex-align:start;-webkit-box-align:start;align-items:flex-start}.middle-sm{-webkit-align-items:center;-ms-flex-align:center;-webkit-box-align:center;align-items:center}.bottom-sm{-webkit-align-items:flex-end;-ms-flex-align:end;-webkit-box-align:end;align-items:flex-end}.around-sm{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.between-sm{-webkit-justify-content:space-between;-ms-flex-pack:justify;-webkit-box-pack:justify;justify-content:space-between}.first-sm{-webkit-order:-1;-ms-flex-order:-1;-webkit-box-ordinal-group:0;order:-1}.last-sm{-webkit-order:1;-ms-flex-order:1;-webkit-box-ordinal-group:2;order:1}}@media only screen and (min-width:62em){.container{width:61rem}.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9{box-sizing:border-box;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;-webkit-box-flex:0;flex:0 0 auto}.col-md{-webkit-flex-grow:1;-ms-flex-positive:1;-webkit-box-flex:1;flex-grow:1;-ms-flex-preferred-size:0;-webkit-flex-basis:0;flex-basis:0;max-width:100%}.col-md-1{-ms-flex-preferred-size:8.333%;-webkit-flex-basis:8.333%;flex-basis:8.333%;max-width:8.333%}.col-md-2{-ms-flex-preferred-size:16.667%;-webkit-flex-basis:16.667%;flex-basis:16.667%;max-width:16.667%}.col-md-3{-ms-flex-preferred-size:25%;-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.col-md-4{-ms-flex-preferred-size:33.333%;-webkit-flex-basis:33.333%;flex-basis:33.333%;max-width:33.333%}.col-md-5{-ms-flex-preferred-size:41.667%;-webkit-flex-basis:41.667%;flex-basis:41.667%;max-width:41.667%}.col-md-6{-ms-flex-preferred-size:50%;-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.col-md-7{-ms-flex-preferred-size:58.333%;-webkit-flex-basis:58.333%;flex-basis:58.333%;max-width:58.333%}.col-md-8{-ms-flex-preferred-size:66.667%;-webkit-flex-basis:66.667%;flex-basis:66.667%;max-width:66.667%}.col-md-9{-ms-flex-preferred-size:75%;-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.col-md-10{-ms-flex-preferred-size:83.333%;-webkit-flex-basis:83.333%;flex-basis:83.333%;max-width:83.333%}.col-md-11{-ms-flex-preferred-size:91.667%;-webkit-flex-basis:91.667%;flex-basis:91.667%;max-width:91.667%}.col-md-12{-ms-flex-preferred-size:100%;-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}.col-md-offset-1{margin-left:8.333%}.col-md-offset-2{margin-left:16.667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.333%}.col-md-offset-5{margin-left:41.667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.333%}.col-md-offset-8{margin-left:66.667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.333%}.col-md-offset-11{margin-left:91.667%}.start-md{-webkit-justify-content:flex-start;-ms-flex-pack:start;-webkit-box-pack:start;justify-content:flex-start;text-align:start}.center-md{-webkit-justify-content:center;-ms-flex-pack:center;-webkit-box-pack:center;justify-content:center;text-align:center}.end-md{-webkit-justify-content:flex-end;-ms-flex-pack:end;-webkit-box-pack:end;justify-content:flex-end;text-align:end}.top-md{-webkit-align-items:flex-start;-ms-flex-align:start;-webkit-box-align:start;align-items:flex-start}.middle-md{-webkit-align-items:center;-ms-flex-align:center;-webkit-box-align:center;align-items:center}.bottom-md{-webkit-align-items:flex-end;-ms-flex-align:end;-webkit-box-align:end;align-items:flex-end}.around-md{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.between-md{-webkit-justify-content:space-between;-ms-flex-pack:justify;-webkit-box-pack:justify;justify-content:space-between}.first-md{-webkit-order:-1;-ms-flex-order:-1;-webkit-box-ordinal-group:0;order:-1}.last-md{-webkit-order:1;-ms-flex-order:1;-webkit-box-ordinal-group:2;order:1}}@media only screen and (min-width:75em){.container{width:71rem}.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9{box-sizing:border-box;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;-webkit-box-flex:0;flex:0 0 auto}.col-lg{-webkit-flex-grow:1;-ms-flex-positive:1;-webkit-box-flex:1;flex-grow:1;-ms-flex-preferred-size:0;-webkit-flex-basis:0;flex-basis:0;max-width:100%}.col-lg-1{-ms-flex-preferred-size:8.333%;-webkit-flex-basis:8.333%;flex-basis:8.333%;max-width:8.333%}.col-lg-2{-ms-flex-preferred-size:16.667%;-webkit-flex-basis:16.667%;flex-basis:16.667%;max-width:16.667%}.col-lg-3{-ms-flex-preferred-size:25%;-webkit-flex-basis:25%;flex-basis:25%;max-width:25%}.col-lg-4{-ms-flex-preferred-size:33.333%;-webkit-flex-basis:33.333%;flex-basis:33.333%;max-width:33.333%}.col-lg-5{-ms-flex-preferred-size:41.667%;-webkit-flex-basis:41.667%;flex-basis:41.667%;max-width:41.667%}.col-lg-6{-ms-flex-preferred-size:50%;-webkit-flex-basis:50%;flex-basis:50%;max-width:50%}.col-lg-7{-ms-flex-preferred-size:58.333%;-webkit-flex-basis:58.333%;flex-basis:58.333%;max-width:58.333%}.col-lg-8{-ms-flex-preferred-size:66.667%;-webkit-flex-basis:66.667%;flex-basis:66.667%;max-width:66.667%}.col-lg-9{-ms-flex-preferred-size:75%;-webkit-flex-basis:75%;flex-basis:75%;max-width:75%}.col-lg-10{-ms-flex-preferred-size:83.333%;-webkit-flex-basis:83.333%;flex-basis:83.333%;max-width:83.333%}.col-lg-11{-ms-flex-preferred-size:91.667%;-webkit-flex-basis:91.667%;flex-basis:91.667%;max-width:91.667%}.col-lg-12{-ms-flex-preferred-size:100%;-webkit-flex-basis:100%;flex-basis:100%;max-width:100%}.col-lg-offset-1{margin-left:8.333%}.col-lg-offset-2{margin-left:16.667%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.333%}.col-lg-offset-5{margin-left:41.667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.333%}.col-lg-offset-8{margin-left:66.667%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.333%}.col-lg-offset-11{margin-left:91.667%}.start-lg{-webkit-justify-content:flex-start;-ms-flex-pack:start;-webkit-box-pack:start;justify-content:flex-start;text-align:start}.center-lg{-webkit-justify-content:center;-ms-flex-pack:center;-webkit-box-pack:center;justify-content:center;text-align:center}.end-lg{-webkit-justify-content:flex-end;-ms-flex-pack:end;-webkit-box-pack:end;justify-content:flex-end;text-align:end}.top-lg{-webkit-align-items:flex-start;-ms-flex-align:start;-webkit-box-align:start;align-items:flex-start}.middle-lg{-webkit-align-items:center;-ms-flex-align:center;-webkit-box-align:center;align-items:center}.bottom-lg{-webkit-align-items:flex-end;-ms-flex-align:end;-webkit-box-align:end;align-items:flex-end}.around-lg{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.between-lg{-webkit-justify-content:space-between;-ms-flex-pack:justify;-webkit-box-pack:justify;justify-content:space-between}.first-lg{-webkit-order:-1;-ms-flex-order:-1;-webkit-box-ordinal-group:0;order:-1}.last-lg{-webkit-order:1;-ms-flex-order:1;-webkit-box-ordinal-group:2;order:1}} @media screen and (min-width: 75em) { .col-lg-offset-0 { margin-left: 0; } } /*-------------------------------------------------------------- # Normalize --------------------------------------------------------------*/ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body { margin: 0; } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background-color: transparent; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: 600; } dfn { font-style: italic; } h1 { font-size: 2.6em; margin: 0; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; vertical-align: sub; } figure { margin: 1em 40px; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ body, button, input, select, textarea { color: #000000; font-family: 'quatro', sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; } @media (max-width: 47.999em) { body, button, input, select, textarea { font-size: 1.1rem; line-height: 1.3; } } h1, h2, h3, h4, h5, h6 { clear: both; margin: 0; font-weight: normal; } h2 { font-size: 2em; } h3 { font-size: 1.4em; } h4 { font-size: 1em; } h1 + h2 { line-height: 1; } :target:before { content:""; display:block; height:70px; /* fixed header height*/ margin:-70px 0 0; /* negative fixed header height */ } .quatro-extralight { font-family: 'quatro'; font-weight: 100; } .quatro-light { font-family: 'quatro'; font-weight: 200; } .quatro-book { font-family: 'quatro'; font-weight: 300; } .quatro-reg { font-family: 'quatro'; font-weight: 400; } .quatro-med { font-family: 'quatro'; font-weight: 500; } .quatro-semi { font-family: 'quatro'; font-weight: 600; } .quatro-bold { font-family: 'quatro'; font-weight: 700; } .quatro-black { font-family: 'quatro'; font-weight: 800; } .quatro-ultrablack { font-family: 'quatro'; font-weight: 900; } .bitter-italic { font-family: 'Bitter'; font-style: italic; font-weight: 400; } .bitter-bold { font-family: 'Core Slab', sans-serif; font-weight: 700; } .tit-light, .core-light { font-family: 'Core Slab', sans-serif; font-weight: 300; } .tit-reg, .core-reg { font-family: 'Core Slab', sans-serif; font-weight: 400; } .tit-semi, .core-semi { font-family: 'Core Slab', sans-serif; font-weight: 600; } .tit-med, .core-med { font-family: 'Core Slab', sans-serif; font-weight: 500; } .tit-bold, .core-bold { font-family: 'Core Slab', sans-serif; font-weight: 700; } .tit-black, .core-black { font-family: 'Core Slab', sans-serif; letter-spacing: 1px; font-weight: 900; } .coreslab { font-family: 'Core Slab'; } .robotoslab { font-family: 'Roboto Slab', serif; } .font-semibold { font-weight: 600; } .font-bold { font-weight: 700; } .font-black { font-weight: 900; } .uppercase { text-transform: uppercase; } @media screen and (max-width: 47.999em) { h1 { font-size: 1.6em; } h2 { font-size: 1.4em; } } @media screen and (max-width: 31.999em) { h1 { font-size: 1.5em; } h2 { font-size: 1.3em; } } /* p { margin-bottom: 1.5em; } */ dfn, cite, em, i, { font-style: italic; } blockquote { margin: 0 1.5em; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; scroll-behavior: smooth; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { background: #fff; /* Fallback for when there is no custom background color defined. */ } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } ul, ol { margin: 0 0 1.5em 0; } ul { list-style: disc; list-style-type: square; } ul li { } aside ul, .footer-blocks ul { list-style: none; margin-left: 0; padding: 0; } .footer-blocks .row > div { padding-right: 1rem; } aside ul li:before, .footer-blocks ul li:before { content: ''; background-color: white; display: inline-block; height: .6em; width: .6em; float: left; vertical-align: middle; position: relative; top: .45em; margin-right: .5rem; } aside ul li:before { background-color: #488ea2; } ol { list-style: decimal; } article ol, article ul { padding-left: 1em; font-size: 1.1em; font-weight: 300; } article ul { padding-left: 1.4em; } li > ul, li > ol { margin-bottom: 0; margin-left: 0; } dt { font-weight: bold; } dd { margin: 0 1.5em 1.5em; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } figure { margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */ } table { margin: 0 0 1.5em; width: 100%; } /*-------------------------------------------------------------- ## Links --------------------------------------------------------------*/ a { color: inherit; outline: 0; text-decoration: none; } a[name].anchor-offset { display: block; position: relative; top: -60px; visibility: hidden; } article a, .underline { text-decoration: underline; line-height: 1.2em; display: inline-block; } .dank-aan-logos a { border: none; } .sidebar--item.links a, .triangle-link { text-transform: uppercase; font-size: 0.9em; font-family: 'quatro', sans-serif; font-weight: 600; } .download-link { position: relative; margin-left: 2rem; display: flex; align-items: center; } .download-link:before { position: absolute; background-image: url('img/icon-download.svg'); background-repeat: no-repeat; background-size: contain; left: -2rem; content: ''; width: 2em; height: 2em; } .triangle-link { font-size: 0.95em; } .sidebar--item h4 { text-transform: uppercase; } .sidebar--item.links a:before, .icon-link:after, .triangle-link:before { content: "► "; font-size: 0.8em; margin-right: 0.25em; } .icon-link:after { margin-left: 0.5em; } .no-style { text-decoration: none; } a:visited { color: inherit; } a:hover, a:focus, a:active { color: grey; } /*-------------------------------------------------------------- ## Menus --------------------------------------------------------------*/ .main-navigation { clear: both; display: block; float: left; width: 100%; } .main-navigation ul { display: none; list-style: none; margin: 0; padding-left: 0; float: right; } .main-navigation li { float: left; position: relative; } .main-navigation a { display: block; text-decoration: none; padding: 0 0.75em; text-transform: uppercase; font-size: 0.95em; /*font-weight: bold;*/ -webkit-font-smoothing: antialiased; } @media (min-width: 48em) and (max-width: 76.999em) { .main-navigation a { padding: 0 0.5em; font-size: 0.8em; } } .main-navigation ul ul { box-shadow: 0 3px 7px 1px rgba(168, 176, 186, .3); float: left; position: absolute; top: 2.8em; left: -999em; z-index: 99999; margin-left: 0.9em; text-align: left; padding: .5rem 0; } .main-navigation ul li:last-child ul { left: auto; right: -999em; } .main-navigation ul ul ul { left: -999em; top: 0; } .main-navigation ul ul a { min-width: 215px; } .main-navigation ul ul li { background-color: white; } .main-navigation ul ul li a { padding: 0.5em 0; margin: 0 1em; line-height: 1; } .main-navigation li:hover > a, .main-navigation li.focus > a {} .main-navigation ul ul :hover > a, .main-navigation ul ul .focus > a {} .main-navigation ul ul a:hover, .main-navigation ul ul a.focus {} .main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul { left: 0; } .main-navigation ul li:last-child:hover > ul, .main-navigation ul li:last-child.focus > ul { right: 0; left: auto; } .main-navigation ul li:last-child .sub-menu:after, .main-navigation ul li:last-child .sub-menu:before { left: 80%; } .main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul { left: 100%; } .nav-menu > .current_page_item > a, .nav-menu > .current-menu-item > a, .nav-menu > .current_page_ancestor > a, .nav-menu > :not(.menu-item-2117).current-menu-ancestor > a { font-weight: 700; color: #498ea3; } .nav-menu > li { margin-right: 1rem; } @media screen and (min-width: 62em) { .nav-menu > li > a { font-size: 1.1em; } .nav-menu > li { margin-right: .2rem; } } @media screen and (max-width: 800px) { .nav-menu > li > a { font-size: 1em; } .nav-menu > li { margin-right: .2rem; } } @media screen and (max-width: 48em) { .nav-menu > li > a { font-size: .8em; } } /* Small menu. */ .menu-toggle, .main-navigation.toggled ul { display: block; } .menu-toggle { position: absolute; top: 0.9em; right: 2.5em; background: transparent; border: none; box-shadow: none !important; } /* Hamburger toggle effect */ #nav-toggle { position: absolute; left: 50%; top: 50%; } #nav-toggle { cursor: pointer; padding: 10px 35px 16px 0px; } #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after { cursor: pointer; border-radius: 1px; height: 4px; width: 28px; background: #484f50; position: absolute; display: block; content: ''; } #nav-toggle span:before { top: -8px; } #nav-toggle span:after { bottom: -8px; } #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after { transition: all 0.2s ease-in-out; } #nav-toggle.active span { background-color: transparent; } #nav-toggle.active span:before, #nav-toggle.active span:after { top: 0; } #nav-toggle.active span:before { transform: rotate(45deg); } #nav-toggle.active span:after { transform: rotate(-45deg); } @media screen and (min-width: 47.999em) { .menu-toggle { display: none; } .main-navigation ul { display: block; } .main-navigation ul ul li:not(:last-child) a { border-bottom: 2px dotted; } .nav-menu > li { padding-bottom: 2em; margin-bottom: -2em; } .sub-menu { border: 1px solid #e7e7e7; } .sub-menu:after, .sub-menu:before { bottom: 100%; left: 20%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .sub-menu:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 15px; margin-left: -15px; } .sub-menu:before { border-color: rgba(231, 231, 231, 0); border-bottom-color: #e7e7e7; border-width: 16px; margin-left: -16px; } .menu-item-371 .sub-menu, .menu-item-371 .sub-menu li { width: 18em; } } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 1.5em; overflow: hidden; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { float: left; width: 50%; } .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { float: right; text-align: right; width: 50%; } .sub-menu { position: relative; border: 1px solid #e7e7e7; background-color: white; } @media screen and (max-width: 47.999em) { .menu-menu-container { margin-top: 4em; } .main-navigation ul { width: 100%; } .main-navigation li { width: 100%; text-align: left; text-decoration: none; border-bottom: 1px solid #eaeaea; } .nav-menu > li:last-child { border-bottom: none; padding-bottom: 0.5em; } .focus .sub-menu { position: initial!important; display: block!important; } .main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul { left: 0; position: static; } .main-navigation ul ul li { background-color: transparent; } .main-navigation ul ul a { min-width: 215px; width: 100%; } .sub-menu > li:last-child, .sub-menu { border-bottom: none; } .main-navigation li a { padding: 0.75em 0; margin: 0; } .main-navigation .current_page_item > a, .main-navigation .current-menu-item > a, .main-navigation .current_page_ancestor > a, .main-navigation .current-menu-ancestor > a { border-bottom: none; font-weight: bold; } .sub-menu { margin-left: 0 !important; box-shadow: none !important; border-left: none; border-right: none; background: transparent; } } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /*-------------------------------------------------------------- # Widgets --------------------------------------------------------------*/ .widget { margin: 0 0 1.5em; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ /*-------------------------------------------------------------- ## Buttons and links --------------------------------------------------------------*/ .btn { text-transform: uppercase; } .btn.--simple { border-bottom: 1px solid black; } .btn.--small { font-size: .8em; } /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ .sticky { display: block; } .hentry { margin: 0 0 1.5em; } .byline, .updated:not(.published) { display: none; } .single .byline, .group-blog .byline { display: inline; } .page-content, .entry-content, .entry-summary { margin: 1.5em 0 0; } .page-links { clear: both; margin: 0 0 1.5em; } /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } /*-------------------------------------------------------------- # Infinite scroll --------------------------------------------------------------*/ /* Globally hidden elements when Infinite Scroll is supported and in use. */ .infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */ .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; } /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */ .infinity-end.neverending .site-footer { display: block; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } /*-------------------------------------------------------------- # Flexslider --------------------------------------------------------------*/ .flex-container a:hover, .flex-slider a:hover { outline: none; } .slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } .flex-pauseplay span { text-transform: capitalize; } .flexslider { margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } .flexslider .slides img { width: 100%; display: block; } .flexslider .slides:after { content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .flexslider .slides { display: block; } * html .flexslider .slides { height: 1%; } .no-js .flexslider .slides > li:first-child { display: block; } .flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; zoom: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2); -moz-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2); -o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2); } .flexslider .slides { zoom: 1; } .flexslider .slides img { height: auto; -moz-user-select: none; } .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .loading .flex-viewport { max-height: 300px; } .carousel li { margin-right: 5px; } .flex-direction-nav { * height: 0; } .flex-direction-nav a { text-decoration: none; display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0, 0, 0, 0.8); text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .flex-direction-nav a:before { font-family: "flexslider-icon"; font-size: 40px; display: inline-block; content: '\f001'; color: rgba(0, 0, 0, 0.8); text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); } .flex-direction-nav a.flex-next:before { content: '\f002'; } .flex-direction-nav .flex-prev { left: -50px; } .flex-direction-nav .flex-next { right: -50px; text-align: right; } .flexslider:hover .flex-direction-nav .flex-prev { opacity: 0.7; left: 10px; } .flexslider:hover .flex-direction-nav .flex-prev:hover { opacity: 1; } .flexslider:hover .flex-direction-nav .flex-next { opacity: 0.7; right: 10px; } .flexslider:hover .flex-direction-nav .flex-next:hover { opacity: 1; } .flex-direction-nav .flex-disabled { opacity: 0 !important; filter: alpha(opacity=0); cursor: default; z-index: -1; } .flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; } .flex-pauseplay a:before { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; } .flex-pauseplay a:hover { opacity: 1; } .flex-pauseplay a.flex-play:before { content: '\f003'; } .flex-control-nav { margin: 0 0 1em; } .testimonials--slider .flex-control-nav { right: 51%; bottom: 0.5em; } .flex-control-nav li { margin: 0 6px; display: inline-block; zoom: 1; * display: inline; } .flex-control-paging li a { width: 15px; height: 15px; display: block; background: #666; background: rgb(231, 231, 231); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; outline: none; } .flex-control-paging li a:hover { background: #dfdf6b; } .flex-control-paging li a.flex-active { background: #dfdf6b; cursor: default; } .flex-control-thumbs { margin: 5px 0 0; position: static; overflow: hidden; } .flex-control-thumbs li { width: 25%; float: left; margin: 0; } .flex-control-thumbs img { width: 100%; height: auto; display: block; opacity: .7; cursor: pointer; -moz-user-select: none; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .flex-control-thumbs img:hover { opacity: 1; } .flex-control-thumbs .flex-active { opacity: 1; cursor: default; } @media screen and (max-width: 47.999) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px; } .flex-direction-nav .flex-next { opacity: 1; right: 10px; } } /*-------------------------------------------------------------------------------------------------------------- # Eigen CSS # --- # # Bevat een aantal classes die ik veel gebruik. # Indien niet gewenst kunnen deze verwijderd worden ;) --------------------------------------------------------------------------------------------------------------*/ .container { width: 94%; max-width: 1200px; margin: 0 auto; } @media (min-width: 48em) { .container { /*width: 80%;*/ } .header--nav > .container { width: 95%; max-width: 1400px; } .header--nav > .container .nav--container { margin-bottom: 2.1rem; transition: margin .5s .2s; } .header--nav.sticky > .container .nav--container { margin-bottom: 0; } .header--title > .container { width: 90%; max-width: 1400px; } .klanten > .container, footer .container { width: 99%; max-width: 1400px; } } .vr { border-right: 1px solid #f6f6f7; margin: 0 1em; font-size: 0.6em; } footer .vr { border-color: #404040; } /* Padding & Margin */ .pad-xs { padding: 1em 0; } .pad-s { padding: 1.5em 0; } .pad-m { padding: 3em 0; } .pad-t-m { padding-top: 3em; } .pad-b-m { padding-bottom: 3em; } .pad-sides-m { padding-left: 3em; padding-right: 3em; } @media screen and (max-width: 47.999em) { .pad-m { padding: 2em 0; } .pad-s { padding: 0 0; } .pad-sides-m { padding-left: 0; padding-right: 0; } .pad-b-m { padding-bottom: 2rem; } } .no-margin { margin: 0; } .no-margin-bottom { margin-bottom: 0; } .no-border { border: none; border-bottom: none !important; } /* Object positions */ .rel { position: relative; } .abs { position: absolute; } /* Kleuren */ .green-bg { background-color: #6bb2a0; } .green-2-bg { background-color: #a0c9d1; } .green-3-bg { background-color: #04847f; } .green-4-bg { background-color: #3b949d; } .alt-green-bg { background-color: #e9e585; } .grey-bg { background-color: #f6f6f7; } .blue-bg { background-color: #2d3b3e; } .blue-2-bg { background-color: #e7f0f3; } .alt-blue-bg { background-color: #233233; } .white-bg { background-color: white; } .white-text { color: white !important; } .black-text { color: black; } .green-text { color: #48ab9b; } .green-2-text { color: #a0c9d1; } .green-3-text { color: #04847f; } .green-4-text { color: #3b949d; } .dark-text { color: #2b3c3e; } /* Mobile / Desktop view */ @media (min-width: 48em) { .only-mobile { display: none; } } @media (min-width: 73em) { .soft { display: none; } } @media (max-width: 47.999em) { .only-desktop { display: none; } } /*-------------------------------------------------------------- ## Header --------------------------------------------------------------*/ .site-header { position: relative; background-position: center; background-size: cover; height: 20em; } .site-header:after { content: ''; display: block; background-image: radial-gradient( farthest-corner at 20% 40px, rgba(255,255,255,0.4) 20%, rgba(255,255,255,0) 50% ); width: 100%; height: 100%; top: 0; left: 0; } @media (min-width: 48em) { .site-header { height: 25vw; min-height: 450px; background-position: center bottom; } } /* Logo */ .header-logo-link { display: block; margin: 1em 0 1em 0; transition: .25s; } .header-logo-sub { transition: .25s .25s opacity, .5s 0s margin-top; display: block; line-height: 1.1; font-size: 1.3em; } @media (max-width: 72.999em) { .header-logo-sub { font-size: .9em; } } @media (max-width: 47.999em) { .header-logo-sub { /* display: none; */ } } img.logo { height: 2.5em; display: block; } @media (min-width: 48em) { .sticky .header-logo-sub { transition: .25s opacity, .5s .1s margin-top; margin-top: -48px; opacity: 0; } .header-logo-link { margin: 1em 0em; } .sticky .header-logo-link { margin: 1em 0em 0 0; } .sticky .header-logo-link .header-logo-sub{ margin-top: -32px; } img.logo { height: 2.5em; display: block; } } @media (min-width: 73em) { .sticky .header-logo-link img { position: relative; top: 6px; } } @media (max-width: 47.999em) { .header-logo-link { margin: .5em 0; } .sticky .header-logo-link { height: 2.5rem; } .site-header { background-position: center bottom !important; background-repeat: no-repeat; } } /* Page intro */ .page-intro { text-align: center; margin-bottom: 4rem; } .page-intro h1 { line-height: 1.2; } .page-intro h3 { font-size: 1.9em; line-height: 1.3; } .page-intro p { font-size: 1.3em; line-height: 1.3; } @media (max-width: 47.999em) { .page-intro h1 { line-height: 1; margin-bottom: 0; } .page-intro p { font-size: 1.1em; } .page-intro { margin-bottom: 1rem; } } /* Nav */ .header--nav { width: 100%; /*background-color: rgba(255, 255, 255, 0.925);*/ z-index: 1; position: fixed; transition: .25s; } .sticky.header--nav { background-color: rgba(255, 255, 255, 0.925); } .header--title, .header--title.rechtsboven { width: 100%; text-align: right; top: 24%; } .header--title.linksonder { text-align: left; bottom: 6.5%; top: auto; } .page-id-200 .header--title.linksonder { /* Het dpo2-verhaal */ bottom: 9.75%; } .page-id-194 .header--title.linksonder { /* Onze regisseurs */ bottom: 12.5%; } .header--title.rechtsonder { text-align: right; bottom: 10%; top: auto; } .header--title.linksboven { text-align: left; } .header--cta { right: 0; width: 11em; bottom: 2em; } .header--cta > div > div { padding: 0.5em 0; } @media (min-width: 48em) { .header--cta > div > div { padding: 0.85em 0; } .header--cta { bottom: 7%; width: 13em; } .header--title h2 { font-size: 2.4em; letter-spacing: -0.01em; } .home .header--title h2 { font-size: 2.95em; } .nav--container { padding: .5em 0 .5em; } } @media (max-width: 47.999em) { .site-header { height: 14em; } .header--nav { background-color: rgba(255, 255, 255, 0.975) } .header--title.linksonder, .header--title.rechtsonder { bottom: 25%; } } /* Pijl */ .arrow { display: none; } @media (min-width: 1800px) { .arrow { display: block; bottom: 0.25%; left: 48.1%; } .bounce { -moz-animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } 40% { -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -webkit-transform: translateY(-15px); transform: translateY(-15px); } } } /* Cirlce call-to-action */ .header--circle { width: 100%; bottom: -3rem; } .header--circle > .container { position: relative; max-width: 1440px; width: 90%; } .header--circle-inner { position: absolute; right: 0; bottom: 0; width: 18em; height: 18em; background: #cfd349; border-radius: 50%; padding: 1em; text-align: center; color: white; display: flex; align-items: center; box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.2); } .header--circle-image { position: absolute; right: 0; bottom: 0; width: 22em; height: 22em; } .cta-big { font-size: 1.75em !important; } .header--circle-inner > div { width: 100%; } .header--circle h4 { margin-top: 1.5rem; font-size: 1.35em; line-height: 1.1; color: #000000; } .header--circle p { margin: .5rem 0 0.25rem; line-height: 1.15; font-size: 1.35rem; color: #000000; } .header--circle a { border-bottom: 1px solid; font-size: 0.9rem; color: black; line-height: 1.4; display: inline-block; } .header--circle a:hover { color: #333); } .header--circle a[href$="aanmeldingsformulier"] { text-decoration: none; border-bottom: 0; } hr.dotted { /*border-bottom: 6px dotted #488ea2;*/ border: none; height: 6px; background-color: transparent; max-width: 420px; margin: 4rem auto 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAWCAYAAAC7ZX7KAAAB4UlEQVRIicWXSy9DQRiG355qi97iWqolEiQS951EsCCxlPgB+A0WtrYWfoPLXmIpYYEQOxQhoUnjVlq3tNrSVnvkOyFpzKI+08Oz/ObMM+8k55z5xqCqqgpJQtEEjq5D2Lu8weVjBE/xN01Ybi1GfYUTPfV1aPe44HKUyi4FqcDxVBobZwEsbB0glkwK47nYLBZM9HdhsKURVrNJGNc98F0khrnVXRxeB2FUFOSTGABksll0eNyYGulFjdMmPKNb4IeXBKaX1xB8jnxG4aDCXebE7NgwKu38V0QRKnl4Tb9jZmUDwefoL8JCm0NzyUEu3QOvnfhxHr4X6lzIsX7q1zdw+OUVSzs+GI3sfQqQY3Hbpzk5sFb2Xd0inkxB/kcIzUEucuoWeO/iRqjJwnWyAl89RYWaLFwnK/DXCVZIuE75r+ePYQWm3qDQcJ2swN5yh1CThetkBe5pqBNqsnCdrMCd3lpYLWYYfnMif4Mc5CInB1bgansJxvs6kclkhTEu5CAXOXULTAy1NqG5ukqocyEHubiwA5eYijAzOgh3mUNrFfmo2lxykItLQRp4RfnZvrP/1cB/QVekzbMA5rf2EUumhPFcbBYzJvu7MfBfV6Rc7qIJHOe5hLZ5XKiRvYQC+ADaQMkKttfRawAAAABJRU5ErkJggg=='); background-size: 12px 6px; background-repeat: round; } hr.dotted.dotted-intro { margin-bottom: 1.5rem; } @media (max-width: 47.999em) { hr.dotted { margin-top: 1.5rem; margin-bottom: 1.5rem; } hr.dotted.bigger { margin-top: 2rem; margin-bottom: 2rem; } } /*-------------------------------------------------------------- ## Header Search --------------------------------------------------------------*/ .header-search { position: relative; height: 100%; display: flex; } .search-toggle { top: 0.9em; right: 2.8em; background: transparent; border: none; box-shadow: none !important; } .search-toggle svg { width: 24px; height: 24px; } .search-toggle svg path { fill: #3d4d50; } .header-search .search-bar { position: relative; transition: .25s; /*background-color: white;*/ display: flex; align-items: center; justify-content: flex-end; } .header-search .search-bar::-webkit-input-placeholder { /* Edge */ color: #3d4d50; } .header-search .search-bar:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #3d4d50; } .header-search .search-bar::placeholder { color: #3d4d50; } .header-search .search-bar input#search-bar-input { appearance: none; background-color: transparent; border: none; width: 3rem; line-height: 2.1; padding-left: 1rem; outline: none; transition: all 0.25s; color: #3d4d50; flex: 1; height: 100%; opacity: 0; } .header-search .search-bar.focused input#search-bar-input, .header-search .search-bar input#search-bar-input:focus { opacity: 1; width: 10rem; background-color: white; } @media (min-width: 48em) { .header-search .search-bar input#search-bar-input:focus { width: 10rem; } } .header-search .search-bar-results { position: absolute; right: 0; width: 30rem; top: 100%; max-width: 100vw; max-height: 30rem; z-index: 999; overflow: auto; box-shadow: 0 0 35px rgba(0,0,0,.2); } .header-search .search-bar-results__item { display: flex; flex-wrap: wrap; justify-content: flex-start; padding: 1rem; border-bottom: 1px solid #3d4d50; background: white; text-decoration: none; } .header-search .search-bar-results__item:hover, .header-search .search-bar-results__item:focus { background: whitesmoke; color: black; } .header-search .search-bar-results__item span { width: 100%; font-size: 1rem; } .header-search .search-bar-results__item span:nth-child(1) { line-height: 1.3; } .header-search .search-bar-results__item span:nth-child(2) { color: #3d4d50; font-size: .9rem; margin: 0; font-weight: 300; line-height: 1; } .header-search .search-bar.focused { background-color: white; } .header-search .search-bar.focused .search-bar-results { display: block; } .header-search .search-bar:not(.focused) .search-bar-results { display: none; } .header-search .search-bar-toggle { display: inline-block; text-decoration: none; padding: .5rem; margin: 0; } .header-search .search-bar-toggle svg { width: 22px; height: 22px; vertical-align: sub; fill: #3d4d50; } .header-search .search-bar-toggle svg path { fill: #3d4d50; } @media (max-width: 47.99em) { .header-search { display: none; } .header-search.open { display: block; } .header-search .search-bar { width: 100%; margin: 1rem 0; border: 1px solid #3d4d50; } .header-search .search-bar-toggle svg path { fill: whitesmoke; } .header-search .search-bar { line-height: 3; } .header-search .search-bar-results { width: 100%; } } @media (min-width: 48em) { .header-search .search-bar { /*width: 10rem;*/ } .search-toggle { display: none; } .main-navigation { display: flex; justify-content: flex-end; align-items: center; } } /*-------------------------------------------------------------- ## Home --------------------------------------------------------------*/ section, footer, .site-main { margin-top: 15px; } .intro { margin-top: 0; padding-bottom: } .intro h1 { line-height: 1.2; } @media (max-width: 47.999em) { .intro { padding-top: 0; padding-bottom: 0; } .intro h1, .page-intro h1 { margin-bottom: 0; line-height: 1; } .site-main { padding: 0 1rem; margin-top: 0; } } .intro h2 { } @media (max-width: 47.999em) { .page-intro h3 { font-size: 1.2em; } } /* Diensten */ .diensten--item { padding: 1em; margin: 0 1rem; text-align: center; height: 100%; } .diensten--item h3 { font-size: 1.7em; line-height: 1.1; } .diensten--item a:hover { color: whitesmoke; } .diensten--item > a { /*border-bottom: 1px solid black;*/ font-weight: 300; } .diensten--item p { font-weight: 300; } .diensten--item .dienst-link-titel { font-size: 1em; margin-top: 1rem; display: block; text-transform: uppercase; } .diensten--intro p:first-of-type { margin-top: .5rem; } @media (min-width: 48em) { .intro p { font-size: 1.6em; } .diensten--item p { font-size: 1.1em; margin-top: 0.26em; } .diensten--intro { margin-bottom: 3.5em; } .diensten--intro p, .klanten p, .dna--intro p { font-size: 1.4em; line-height: 1.3em; } } @media (max-width: 47.999em) { .diensten--container > div { margin-bottom: 1rem; } .diensten--item { /* border-bottom: 2px dotted;*/ margin: 0.5em 0rem; padding: 2rem 1rem; } .diensten--intro { margin-bottom: 1.25em; } .dna { padding-top: .5rem; padding-bottom: .5rem; } } @media (min-width: 48em) and. (max-width: 61.999em) { .diensten--item { margin-bottom: 2em; } } @media (min-width: 62em) { .diensten--item { border: none; padding: 2.5rem 1.25em; margin: 0em 1rem; } .diensten--item h3 { /*margin-top: -0.35em;*/ } } /* Dpo2 DNA */ .dna { /*background: #bcd9d3;*/ } .dna--item img { width: 3.5em; } /* DNA items op algmene page */ article .dna--item img { width: 3.5em; margin-bottom: 1em; } article .dna--item h3 { font-size: 1.1em; } article .dna--item li { font-size: 0.96em; line-height: 1.4em; } .dna--item h3 { font-size: 1.4em; margin-top: -0.35em; margin-bottom: .5rem; } .dna--intro { margin-bottom: 2rem; } .dna--intro h2 { margin-top: 3rem; font-size: 2.4rem; line-height: 1.2; } @media (max-width: 47.999em) { .dna--intro { margin-bottom: 0; } .dna--intro h2 { font-size: 1.8rem; margin-top: 1rem; } .dna--item h3 { font-size: 1.2em; } } .dna--intro p:first-of-type { margin-top: .5em; } .dna--intro p > strong:first-child { display: block; margin-bottom: .5rem; margin-top: 2rem; } .dna--container p { margin-top: 0.26em; line-height: 1.4em; font-size: 1.15em; } .dna--item ul { padding: 0 0 0 1.4em; margin-bottom: 0; } span.dna-span { position: relative; left: -0.4em; } .dna--item-prefix { width: 40px; height: 40px; display: inline-block; border-radius: 50%; background-color: #3c9fae; color: white; font-family: 'Core Slab', sans-serif; font-size: 1.5em; font-weight: 900; line-height: 38px; margin-bottom: 1rem; } @media (max-width: 61.999em) { .dna--item img { margin-top: 0.75em } .dna--item p { margin-top: 0; margin-bottom: 1.5em; } } .dna--item { background: white; padding: 1.5rem 3rem; border-radius: 10px; /*margin: 0 1% 2%;*/ text-align: center; } .dna--item h3 { line-height: 1.1; } @media (min-width: 62em) { .dna--item { align-self: stretch; align-content: flex-start; font-size: 0.9em; } } @media (max-width: 47.999em) { .dna--container p { font-size: inherit; } .dna--item-prefix { font-size: 1.2em; } .dna--item { padding: .5rem 1rem; } .dna--item p { font-weight: 200; } .dna--item p:last-of-type { margin-bottom: .5rem; } } .dna--more { border: 2px solid #87c4b4; background: transparent; } @media (min-width: 62em) { .page-id-20 .dna--item-text.schaalbaar { border: none; } .pad-xs.row.top-xs > div:first-child > .dna--item-text { border-left: none; } .dna--item-text.no-border{ border-left: none; } article .dna--item-text { height: 65%; } } .dna-footer { text-align: center; } .dna-footer h3 { letter-spacing: 1px; } .dna-footer a { border-bottom: 1px solid black; } /*About us*/ .aboutus { } .aboutus-content { font-size: 1.4em; } .aboutus-content h3 { } .aboutus-content p:first-of-type { margin-top: 2rem; } /* Partners */ .partners { background: #bcd9d3; } /* Klanten */ @media (min-width: 48em) { .klanten p { padding: 0 10%; } } @media (max-width: 47.999em) { .aboutus { padding-top: 0; padding-bottom: .5rem; } .aboutus-content { font-size: 1.1em; } .aboutus-content p:first-of-type { margin-top: .5rem; } .dna-footer h3 { font-size: 1.2em; } } /* Anderen */ .anderen h4:not(:first-child):not(:last-child) { padding-bottom: 2em; margin-bottom: 2em; border-bottom: 1px dashed; } .anderen--content p { font-size: 1.4em; } .anderen--content p:first-of-type { margin-top: 2rem; } @media (max-width: 47.999em) { .anderen { padding-top: .5rem; padding-bottom: .5rem; } .anderen--content p { font-size: 1.1em; } .anderen--content p:first-of-type { margin-top: .5rem; } } /*-------------------------------------------------------------- ## Algemene pagina --------------------------------------------------------------*/ article p { font-size: 1.1em; margin-bottom: 1.5rem; } .site-main article > *:first-child { margin-top: 0; } .site-main article > h2:first-child { margin-top: -.6rem; } .main-content .row strong { text-transform: uppercase; font-family: 'Core Slab', sans-serif; font-weight: 700; font-size: 0.95em; color: #488ea2; } .main-content > .row > [class*="col-"] p { font-size: 0.95em; } @media (min-width: 48em) { .main-content > .row > [class*="col-"] { padding-right: 1rem; } } /* Producten & Diensten */ .diensten--page { margin: 0; padding: 0; border: 0; } .diensten--page h2 { font-size: 1.25em; margin: 0; } /* DPO2 DNA */ .dpo2-dna-item h2 { margin-top: 0; } .dpo2-dna-item { padding-top: 1em; } .dpo2-dna-item img, .mar-top-small { margin-top: 0.75em; } .dpo2-dna-item > div:first-child { margin-right: 1.5em; } .dpo2-dna-item > div:nth-child(2) { padding: 0em 0 0.5em; border-bottom: 2px dotted black; } /* Sidebar */ aside { min-width: 100px; /*hyphens: auto;*/ } aside > div { /*padding: 1em 1.25em;*/ } @media (max-width: 47.999em) { aside > div { padding: 0; } } img.icon { width: 1.25em; display: inline-block; vertical-align: middle; margin: 0.25em 0.5em 0.25em 0; } aside blockquote { margin: 0; font-size: .8em; line-height: 1.5; } .sidebar--item p { margin-top: 0; font-size: 1.05em; } aside h3 { font-size: 1.2em; font-family: 'quatro', sans-serif; font-weight: 700; line-height: 1.2; } .sidebar--download p { margin-left: 1.1em; font-size: 0.95em; } /* Page content - article */ article h1 { font-size: 1.5em; text-transform: uppercase; color: #6bb2a0; } article h2 { margin: 1.5em 0 0.75em; font-size: 1.9em; text-transform: uppercase; font-family: 'quatro', sans-serif; font-weight: 600; color: #488ea2; } @media (max-width: 47.999em) { article h2 { font-size: 1.2em; margin: 1.5rem 0 1rem; } } article h3 { font-size: 1.1em; margin: 1.6em 0 0 line-height: 1.4em; font-family: 'quatro', sans-serif; font-weight: 500; } article h3 + p { margin-top: 0; } article p { font-family: 'quatro', sans-serif; font-weight: 300; } article blockquote { padding: .5rem 0; margin: 0; } article blockquote, article blockquote p { font-family: 'Core Slab', sans-serif; font-weight: 600; font-size: 1.3em; color: #488ea2; line-height: 1.2; } @media (max-width: 47.999em) { article p, article ul, article ol { font-weight: 200; } article blockquote, article blockquote p { font-size: 1.1em; } } article hr { border: none; background-color: transparent; max-width: 420px; margin: 1rem 0 2rem; height: 6px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAWCAYAAAC7ZX7KAAAB4UlEQVRIicWXSy9DQRiG355qi97iWqolEiQS951EsCCxlPgB+A0WtrYWfoPLXmIpYYEQOxQhoUnjVlq3tNrSVnvkOyFpzKI+08Oz/ObMM+8k55z5xqCqqgpJQtEEjq5D2Lu8weVjBE/xN01Ybi1GfYUTPfV1aPe44HKUyi4FqcDxVBobZwEsbB0glkwK47nYLBZM9HdhsKURVrNJGNc98F0khrnVXRxeB2FUFOSTGABksll0eNyYGulFjdMmPKNb4IeXBKaX1xB8jnxG4aDCXebE7NgwKu38V0QRKnl4Tb9jZmUDwefoL8JCm0NzyUEu3QOvnfhxHr4X6lzIsX7q1zdw+OUVSzs+GI3sfQqQY3Hbpzk5sFb2Xd0inkxB/kcIzUEucuoWeO/iRqjJwnWyAl89RYWaLFwnK/DXCVZIuE75r+ePYQWm3qDQcJ2swN5yh1CThetkBe5pqBNqsnCdrMCd3lpYLWYYfnMif4Mc5CInB1bgansJxvs6kclkhTEu5CAXOXULTAy1NqG5ukqocyEHubiwA5eYijAzOgh3mUNrFfmo2lxykItLQRp4RfnZvrP/1cB/QVekzbMA5rf2EUumhPFcbBYzJvu7MfBfV6Rc7qIJHOe5hLZ5XKiRvYQC+ADaQMkKttfRawAAAABJRU5ErkJggg=='); background-size: 12px 6px; background-repeat: round; } article p > a, aside p > a, .event-data-button a { text-transform: uppercase; border-bottom: 1px solid rgba(0,0,0,.5); font-size: .79em; text-decoration: none; } @media (min-width: 48em) { aside > div { padding: 0; margin-right: 1em; /*border: 1px solid #6bb2a0;*/ border-radius: 10px; } article { margin-left: 1em; border-left: 1px solid black; padding-left: 2.3em; } } @media (max-width: 47.999em) { aside { order: 2; } } /* Vacatures */ .page-id-8 iframe { /* Vacaturse iFrame */ width: 100%; height: 20em; border: 1px solid #ffa410; padding: 2em 1em; transition: all 1s; } .page-id-8 article p { position: relative; } .page-id-8 iframe.large { height: 63em; } .maximize--icon svg { left: 46%; position: absolute; width: 3em; height: 3em; cursor: pointer; transition: all 0.3s; bottom: -1em;} .maximize--icon.alt svg { transform: rotate(180deg); } @media (max-width: 47.999em) { .maximize--icon svg { left: 42.75%; } } /* Klanten en Partners */ .page-id-329 a.uppercase, .page-id-335 a.uppercase { font-size: 0.9em; } /* Contact */ div#map { /* Google maps */ height: 20em; } .gm-style-iw { /* Google maps */ padding: 0.4em 0 0.1em; } .gform_wrapper input[type=text], .gform_wrapper textarea { /*border: 1px solid #cccccc;*/ border: none; outline: none; /*background: #f6f6f7*/ background: transparent; } .gform_wrapper input:focus, .gform_wrapper textarea:focus { /*background-color: rgba(0,0,0,.1);*/ } .gfield_label { font-weight: normal !important; white-space: nowrap; text-overflow: ellipsis; width: 110px; overflow: hidden; } .gform_button { background-color: #a0c9d1; border: 0px !important; text-transform: uppercase; font-size: 0.95em !important; padding: 0.6em 1em; color: white; } h2.form-header { border-top: 2px dotted black; margin-bottom: 1em; padding-top: 1.25em; margin-top: 1.75em; } .gform_wrapper ul.gfield_checkbox li label { margin-left: 1rem; } @media (min-width: 48em) { .page-id-28 label.gfield_label, .page-id-1726 label.gfield_label { width: 20%; text-transform: uppercase; font-weight: normal !important; } .page-id-1726 label.gfield_label { vertical-align: middle; } .page-id-1726 .ginput_container.ginput_container_text { margin-top: 0 !important; } .page-id-28 .ginput_container { width: 80%; display: inline-block; vertical-align: top; } body .gform_wrapper ul #field_4_12 { margin-top: 0 !important; } .page-id-1726 .ginput_container { width: 70%; display: inline-block; vertical-align: middle; margin-bottom: 0 !important; /*border-left: 1px solid rgba(0,0,0,.05) !important;*/ } .page-id-1726 #input_4_4, .page-id-1726 #input_4_6, .page-id-1726 #input_4_7, .page-id-1726 #input_4_8, .page-id-1726 #input_4_17, .page-id-28 #input_2_1, .page-id-28 #input_2_3, .page-id-28 #input_2_6, .page-id-28 #input_2_4, .page-id-28 #input_2_5 { border-left: 1px solid rgba(0,0,0,.05) !important; } .page-id-1726 #field_4_10 .gfield_description { font-weight: 500; font-size: 1em; margin-top: 2rem; } .page-id-1726 #label_4_10_1, .page-id-1726 #label_4_12_1, .page-id-1726 #label_4_3_1{ font-size: .8em; } .page-id-1726 #field_4_10 .ginput_container.ginput_container_checkbox, .page-id-1726 #field_4_12 .ginput_container.ginput_container_checkbox { width: 100%; } #field_4_10 .ginput_container .ginput_container_checkbox{ margin-bottom: 0 !important; } .page-id-1726 label.gfield_label { width: 30%; padding-right: 1rem; font-size: .8em !important; } .page-id-1726 #field_1_5 .gfield_label, .page-id-28 #field_1_5 .gfield_label { vertical-align: top; margin-top: 1em; } .contact--info img { padding-right: 1em; } .gform_footer.top_label { margin-top: 0 !important; } .gform_button { width: 20% !important; margin-left: 80% !important; font-weight: 500; } #gfield_description_4_12 { /*margin-left: 40%;*/ /*width: 60%;*/ } .gform_wrapper ul.gfield_checkbox li label, .gform_wrapper ul.gfield_radio li label { line-height: 1.4; font-size: .7em; } .gform_wrapper.gf_browser_chrome .gfield_checkbox li input, .gform_wrapper.gf_browser_chrome .gfield_checkbox li input[type=checkbox], .gform_wrapper.gf_browser_chrome .gfield_radio li input[type=radio] { margin-top: 0 !important; } } .gform_wrapper ul.gform_fields li.gfield { border: 1px solid rgba(0,0,0,.4); padding-right: 0 !important; } body .gform_wrapper .top_label div.ginput_container { margin-top: 0 !important; } .gform_wrapper textarea.medium { display: block; } .gform_wrapper .top_label .gfield_label, .gform_wrapper legend.gfield_label { padding: .5rem !important; font-size: .8em; } @media (min-width: 48em) { .contact--info h2 { margin-top: 1em; } } @media (max-width: 47.999em) { .gform_wrapper .top_label .gfield_label, .gform_wrapper legend.gfield_label { font-size: .8em; text-transform: uppercase; opacity: .9; } .gform_wrapper input[type=text], .gform_wrapper textarea { padding: 0 .5rem !important; } } #field_4_3, #field_4_10, #field_4_12 { border: 0 !important; } /*-------------------------------------------------------------- ## Smoelenboek --------------------------------------------------------------*/ .collapse--container { border-top: 2px dotted black; } .collapse--container h2 { margin: 0 0 0.5em; font-size: 1.2em; cursor: pointer; } .smoelenboek--item { padding: 0.5em; margin: 0.75em 0; } .triangle--icon { height: 1.2em; width: 1.1em; margin-right: 0.25em; vertical-align: -webkit-baseline-middle; transition: all 0.2s; fill: #404040; } h2.toggled .triangle--icon { transform: rotate(-90deg); } @media (min-width: 63em) { .smoelenboek--item { flex-basis: 20%; max-width: 20%; } } .smoelenboek--img-container > img { display: block; } .smoelenboek--item h3 { text-transform: uppercase; font-size: 0.95em; margin: 0.3em 0 0; } p.functie { font-size: 0.95em; line-height: 1.25em; } .smoelenboek--item-details a { text-decoration: none; } img.plus { right: 0; bottom: 0; padding: 0.5em; width: 2.5em; opacity: 0.5; transition: all 0.4s; opacity: 1; } img.plus.active { transform: rotate(125deg); opacity: 0; } /* Hover effect */ .smoelenboek--item-details { opacity: 0; transition: all 0.4s; font-size: 0.95em; top: 0; right: 0; left: 0; bottom: 0; padding-left: 10%; background-color: rgba(61, 77, 80, 0.86); color: white; } .smoelenboek--item-details.active { opacity: 1; } /*-------------------------------------------------------------- ## News --------------------------------------------------------------*/ .news-item { display: flex; flex-wrap: wrap; padding: 3rem 0 0; } .news-item:not(:last-of-type) { border-bottom: 1px solid; padding-bottom: 3rem; } .news-item__img { width: 100%; } @media (min-width: 62em) { .news-item__img { width: 15rem; } } .news-item__img a { display: block; height: 100%; } .news-item__img img { object-fit: cover; width: 100%; height: 100%; } .news-item__content { flex: 1; } @media (min-width: 62em) { .news-item__content { margin-left: 1rem; } } .news-item__title { margin: 0; font-size: 1.25rem; text-transform: uppercase; } .news-item__date { color: grey; margin: 0 0 0.5rem; font-size: 0.9rem; } .news-item__excerpt { font-size: 1rem; margin: 0.5rem 0; } .news-item a { color: inherit; text-decoration: none; } /*-------------------------------------------------------------- ## sidebar blocks --------------------------------------------------------------*/ .text-link { text-transform: uppercase; border-bottom: 1px solid rgba(0,0,0,.5); font-size: .79em; } .sidebar-blocks { word-break: break-word; } .sidebar-blocks hr.dotted { margin: 2rem auto; } .sidebar-blocks hr.dotted:last-child { display: none; } .sidebar-block { font-weight: 300; } .sidebar-block h3 { font-weight: 500; } .sidebar-block h3 + p { margin-top: 0; } .sidebar-block > *:last-child { margin-bottom: 0; } .sidebar-block.block-highlight { background-color: #e7f0f3; padding: 1.5rem 1rem; } .sidebar-block.block-highlight h3 { color: #488ea2; } .sidebar-block-links { margin: .5rem 0; } .sidebar-block-link { display: inline-block; margin-bottom: .5rem; } @media (max-width: 47.999em) { .sidebar-block-link { margin-right: .5rem; } } /*-------------------------------------------------------------- ## Footer --------------------------------------------------------------*/ footer { font-size: 0.925em; line-height: 1.4em; } @media (max-width: 74.999em) { .footer-blocks > .container > div { margin-bottom: 1rem; } } @media (min-width: 75em) { .footer-blocks > .container > div:nth-child(2){ margin-left: 5%; } } @media (max-width: 1400px) and (min-width: 75em) { .footer-blocks > .container > div:nth-child(2){ margin-left: 5%; } } footer .logo-social { } footer .social-links { } @media (max-width: 47.999em) { footer .logo-social { display: flex; flex-direction: column-reverse; } footer .social-links { padding: 1rem 0; } } .copyright { padding: 0.25em 0; text-transform: uppercase; font-size: 0.95em; } .copyright .footer_colophon { color: #2b3c3e; text-align: center; padding: 1.5rem 0; } .copyright .footer_colophon span { display: inline-block; } .copyright .footer_colophon ul { list-style: none; display: inline-block; margin: 0; padding: 0; } .copyright .footer_colophon ul li { display: inline-block; } .copyright .footer_colophon a { position: relative; display: inline-block; margin: 0; color: #2b3c3e; padding: 0 1rem; overflow: visible; } .copyright .footer_colophon li:not(:first-child) a:before { content: ''; position: absolute; left: -1px; height: 12px; top: 4px; width: 1px; border-left: 1px solid #999; } .footer-top { margin-top: 1.5em; } footer h3 { text-transform: uppercase; font-family: 'Core Slab', sans-serif; font-weight: 700; font-size: 0.95em; color: #A0C9D2; } footer ul { margin: 0 0 1rem 0; padding: 0 0 0; } footer ul:last-child { margin-bottom: 0; } footer a { text-decoration: none; } footer img.footer-logo { height: 4em; margin: 0 1.5em 0.75em 0; } svg.social--icon { fill: white; width: 25px; height: 25px; margin: 0 0 0.25em 0.2em; } footer .container > div { padding-left: 1%; } footer ul li a { display: block; text-overflow: ellipsis; overflow: hidden; } @media (min-width: 63em) { footer .container > .col-lg-2 { /* flex-basis: 17.5%; max-width: 17.5%;*/ margin-bottom: 1rem; } footer .container > div:not(:first-child) { border-left: 2px dotted white; } } @media (min-width: 48em) and (max-width: 61.999em) { footer > .container > div:nth-child(5) { margin-left: 33.33%; } } @media only screen and (max-width: 61.999em) { footer .only-desktop { display: none; } footer > .container > div:nth-child(5), footer > .container > div:nth-child(6) { margin-top: -9em; } .page-id-28 label.gfield_label, .page-id-1726 label.gfield_label { width: 30%; } .page-id-28 .ginput_container { width: 70%; } } @media (max-width: 47.999em) { footer .container > div:not(:last-child) { margin: 0 0 1rem; } .page-id-28 label.gfield_label, .page-id-1726 label.gfield_label { width: 100%; } footer ul { display: flex; flex-direction: column; align-items: center; } footer ul > li { display: inline-block; } footer h3 { text-align: center; } .copyright .footer_colophon { padding: .5rem 0; } .copyright .footer_colophon a { padding: 0 .5rem; } footer img.footer-logo { margin-bottom: 0; } } @media (min-width: 62em) { .footer--diensten { max-width: 20%; flex-basis: 20%; } .footer--typisch { flex-basis: 14.5%; max-width: 14.5%; } } .card { display: flex; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; } .card img { width: 100%; } .card picture { display: flex; } .card a { text-decoration: none; } .card h3 { font-family: 'Core Slab', sans-serif; font-weight: 700; font-size: .95em; text-transform: uppercase; color: #488ea2; margin-top: 0.5rem; } .card__team-role { font-style: italic; } .card__team-area { font-weight: 500; font-style: normal; font-size: .9rem; text-transform: uppercase; padding: .2rem 0; } .card__team-email { font-style: italic; font-size: .95em; } .card__team-email:hover { color: grey; text-decoration: underline; } .card__footer { border-bottom: 2px dotted; margin: 0 0 1rem; padding: 0.5rem 0 1rem 0; } .card__social { padding: 0.5rem 0 0 0; } .card__social svg { width: 25px; height: 25px; margin: 0 0.2em 0.25em 0; } .overons__footer { display: flex; background: white; width: 100%; min-height: 2rem; position: relative; top: calc(-1rem - 2px); padding-top: 2rem; } .faq { margin: 2rem 0; } .faq h3 { font-size: 1.4rem; } .faq a { text-decoration: none; } .faq__items { padding: 0 1rem; border-left: 2px dotted #498ea2; margin: 1rem 0; } .faq__question { cursor: pointer; display: flex; align-items: center; justify-content: space-between; } .faq__question svg { transition: 0.25s; } .faq__question svg.active { transform: rotate(45deg); padding:0; } .faq__question h4 { font-weight: 500; font-size: 1.1rem; } .faq__item { padding: 1rem 1rem 1rem 0; } .faq__item p { font-size: 1rem; padding: 0; } .faq__item p:first-of-type { margin-top:0; } .faq__item p:last-of-type { margin-bottom:0; } .faq__item ul { font-size: 1rem; padding: 0 2rem; margin: 0; } .faq__answer { display: none; } .faq__item .active { display: block; padding: 1rem 0 0 0; } .faq__icon { width: 1rem; height: 1rem; } .entry-meta { font-weight: 500; } .type-podcasts, .type-event, .type-post { padding: 0; border: none; } .type-podcasts .size-post-thumbnail img, .type-event .size-post-thumbnail img, .type-post .size-post-thumbnail img { width: 100%; } .type-podcasts .entry-content, .type-event .entry-content, .type-post .entry-content { margin: 0; } .type-podcasts h2, .type-event h2, .type-post h2 { margin: 0; padding: 0; font-size: 1.5rem; } .type-podcasts h2 a, .type-event h2 a, .type-post h2 a { text-decoration: none; } .filter-controls { text-align: center; padding: 0 0 1rem 0; } .filter-control { padding: 0.5rem 1rem; border: none; background: #9ed1c8; color: white !important; font-weight: 500; margin: 0 0 5px 0; display: inline-flex; } .mixitup-control-active { background: #46ab9b; } .pagination { padding: 1rem 0; border-top: 1px solid #e9f1f4; } .nav-next a, .nav-prev a { text-transform: uppercase; border-bottom: 1px solid rgba(0, 0, 0, .5); font-size: 1rem; text-decoration: none; } .nav-links { display: flex; align-items: center; justify-content: space-between; } a.page-numbers { display: inline-flex; background: #e9f1f4; color: #498ea2; align-items: center; justify-content: center; padding: 1rem; font-weight: 700; border-radius: 50%; text-decoration: none; width: 1.5rem; height: 1.5rem; } .page-numbers.current { display: inline-flex; background: #498ea2; color: #ffffff; align-items: center; justify-content: center; padding: 1rem; font-weight: 700; border-radius: 50%; text-decoration: none; width: 1.5rem; height: 1.5rem; } @keyframes move-left { 0% { transform: translate(0) } to { transform: translate(-50%) } } @keyframes move-right { 0% { transform: translate(-50%) } to { transform: translate(0) } } .clients { background: linear-gradient(180deg, #e7f0f3, transparent); padding: 5rem 0; overflow: hidden; } .clients h2 { color: #1e3a5c; margin: 0; padding: 0 0 .5rem; font-size: 2rem; text-align: center; } .clients__text { color: #2393c5; margin: 0; padding: 0; font-size: 2rem; font-weight: 200; line-height: 2.5rem } .clients__header { text-align: center; padding: 2rem } .clients__slider { overflow: hidden; } .clients-slide { width: 10vw; display: flex; align-items: center; justify-content: center; margin: 1rem; padding: 1.5rem; background: white; box-shadow: 0px 0px 15px -3px rgba(0,0,0,0.1); } .clients-slide-img { display: flex; } .clients-slide-img img { max-height: 5rem; height: 100%; width: auto; } .clients__slider h2 { color: #1e3a5c; margin: 0; padding: 0 0 .5rem; font-size: 3rem; line-height: 3rem } .clients__slider-rows { width: 700vw; flex-direction: column; display: flex; position: relative; padding: 2rem 0 0 0; } @media (max-width: 47.999em) { .clients__slider-rows { width: 3000vw; } .clients-slide { width: 100vw; } .clients__slider-row2 { display: none !important; } } @media (min-width: 48em) and (max-width: 76.999em) { .clients__slider-rows { width: 1200vw; } .clients-slide { width: 15vw; } } .clients__slider-row1 { animation: 100s linear infinite alternate-reverse move-left } .clients__slider-row2 { animation: 100s linear infinite alternate-reverse move-right } .clients__slider-row1, .clients__slider-row2 { flex-direction: row; display: flex } .card__client { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 2rem; } .card__client-img { display: flex; } .card__client-img img { max-height: 5rem; height: 100%; width: auto; } .card__partner { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 2rem; } .card__partner-wrapper { border-bottom: 1px dotted #498ea2; margin: 0 0 1.5rem 0; padding-bottom: 1.5rem; } .card__partner-img { display: flex; align-items: center; justify-content: center; } .card__partner-img img { height: 100%; width: auto; } .no-border { border: none; } .full-content { margin: 0; border: none; padding: 0; } section.reviews { background: linear-gradient(180deg, #e7f0f3, transparent); padding: 5rem 0; overflow: hidden; } .date-block { display: inline-flex; background: #48ab9c; color: white; padding: 1rem; flex-direction: column; text-align: center; color: white; } .archive-date-block { background: #498ea2; } .date-block strong { color: white !important; font-size: 2rem !important; line-height: 1; } .date-block span { color: #ffffff6e; font-size: .8rem; } .event-container { display: flex; width: 100%; } .event-content { margin: 0 1rem; width: 100%; } .event-data { padding: 2rem; font-weight: 400; font-size: 1.2rem; border: 3px dotted #498ea2; } .event-data strong { font-weight: 600; font-size: 1.2rem; } .event-location { text-transform: uppercase; display: flex; font-size: .8rem; margin: -.5rem 0 0 0; justify-content: flex-end; } .event-location svg { width: 1rem; height: auto; margin-right: 5px; } .event-location svg path{ fill: #48ab9c; }