/*
Theme Name:   Civic Tools
Theme URI:    https://www.civictools.nl/
Description:  Description
Version:      1.0
Author:       Control
Author        URI: https://controldigital.nl/
Tags:         
*/






/* ==============================================================================
	INDEX
============================================================================= 



	1. 	CSS RESET
	2. 	GENERAL
	3. 	FONTS
	6.	NAVIGATION
	8.	SEARCH
	9.	HERO
	10. HOME
	22. FOOTER
	23. BUTTONS
	24. FORMS
	25. RESPONSIVE
	
	


 ==============================================================================
	1. 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, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody ,tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	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;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* ==============================================================================
	2. GENERAL
============================================================================= */

*, *::before, *::after {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

html {
	width: 100%;
	height: 100%;
}

body {
	font-size: 16px;
	font-family: 'Poppins', sans-serif;
	color:#000000;
	font-weight:400;
	line-height:1.875rem;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	height:100%;
	-webkit-text-size-adjust: none;
	padding-top: 7.375rem;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	display: block;
	-webkit-transition: all 0.25s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.25s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.25s cubic-bezier(0.67, 0, 0.34, 1);
	outline:none;
}

a:hover,
a:focus {
	color:#3779ED;
}

p > img {
  display: inline-block;
}

main {
	display:block;
}




/* ==============================================================================
	3. FONTS
============================================================================= */
h1,
h2,
h3,
h4,
h5,
h6 {
	position:relative;
	font-family: 'Poppins', sans-serif;
	font-weight:700;
}

h1 {
	font-size:4.25rem;
	line-height:5rem;
	color:#ffffff;
	text-align: center;
}

h2 {
	font-size:1.5rem;
	line-height:2.375rem;
}


h3 {
	font-size:1.25rem;
	line-height:1.875rem;
}

h4 {
	font-size:1rem;
	line-height:1.625rem;
}

.divider {
	margin-bottom:3rem;
}

p {
	font-size: 0.875rem;
	line-height: 1.5rem;
	margin: 1rem 0;
}

p > a {
	display: inline;
	color: #009DE5;
	text-decoration: none;
}

p > a:hover {
	color:#000000;
}

ul li a {
	display:inline;
}

ul,
ol {
	margin: 1rem 0;
	padding: 0 0 0 2rem;
}

ul {
	list-style:disc;
}

ol {
	list-style: decimal;
}

li {
	font-size: .875rem;
	line-height: 1.375rem;
	color: #848484;
}

li a {
	text-decoration: none;
	color:#009DE5;
}

li a:hover {
	color:#000000;
}

strong {
	font-weight:700;
}

em, i {
	font-style:italic;
}

blockquote {
	padding: 2rem 3.125rem;
}

blockquote p {
	font-size:1.5rem;
	line-height:2rem;
	font-style:italic;
	color:#009DE5;
	text-align:center;
}

blockquote p:last-of-type {
	margin-bottom:2rem;
}

.center {
	text-align:center;
}

.caps {
	text-transform: uppercase;
}

.padding-60 {
	padding:3.75rem 0;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
p:first-child,
ul:first-child,
ol:first-child {
	margin-top: 0;
}

h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
p:last-child,
ul:last-child,
ol:last-child {
	margin-bottom: 0;
}



/* ==============================================================================
	6. NAVIGATION
============================================================================= */
#navigation .logo {
	width:17.6875rem;
	height:4.25rem;
}

#navigation {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	padding:1rem 0;
	background:#ffffff;
	z-index:999;
	-webkit-box-shadow:0 0 .125rem rgba(0,0,0,.15);
	        box-shadow:0 0 .125rem rgba(0,0,0,.15);
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

#navigation .navigation-inner {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.navbar-toggle {
	display:none;
}

.navigation-left {
	position:relative;
	-webkit-box-flex:0;
	    -ms-flex:0 0 33.3333%;
	        flex:0 0 33.3333%;
}

.navigation-center {
	position:relative;
	-webkit-box-flex:0;
	    -ms-flex:0 0 33.3333%;
	        flex:0 0 33.3333%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;	
	-webkit-box-pack: center;	
	    -ms-flex-pack: center;	
	        justify-content: center;
}

.navigation-right {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-flex:0;
	    -ms-flex:0 0 33.3333%;
	        flex:0 0 33.3333%;
}

.navigation-right .navigation__search {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-right:1rem;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
}

nav.language ul,
nav.language ul li,
nav.language ul li span {
	margin:0;
	padding:0;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
}

nav.language span {
	font-family: 'Poppins', sans-serif;
	font-weight:700;
	text-transform: lowercase;
	color:#55c0dd;
}

nav.language li a {
	font-family: 'Poppins', sans-serif;
	font-weight:700;	
	color:#55c0dd;
	text-transform: lowercase;
}

nav.language li a::before {
	content:"/";
	font-family: 'Poppins', sans-serif;
	color:#55c0dd;
	text-transform: lowercase;
	margin-left:.25rem;
	margin-right:.25rem;
}




/* MAIN NAVIGATION - FIRST LEVEL*/
nav.header-nav ul {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	list-style: none;
	padding: 0;
}

nav.header-nav ul li {
	position:relative;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -ms-flex-line-pack: center;
        align-content: center;
}


nav.header-nav ul li a {
	font-family: 'Poppins', sans-serif;
	font-size:1.125rem;
	font-weight:700;
	color:#55c0dd;
	text-decoration:none;
	position:relative;
	overflow: hidden;
	padding:2rem 1rem;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

nav.header-nav li a:hover,
nav.header-nav li:hover a,
nav.header-nav li.current-menu-item a,
nav.header-nav li.current-page-ancestor a {
	color:#000000;
}


/* MAIN NAVIGATION - SECOND LEVEL*/
nav.header-nav ul li > ul {
	position:absolute;
	visibility:hidden;
	opacity:0;
    -webkit-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    background:#ffffff;
	-webkit-box-shadow: 0 5px 7px 5px rgba(0,0,0,0.07);
	        box-shadow: 0 5px 7px 5px rgba(0,0,0,0.07);
    width:15rem;
    padding:0;
    margin-top:1.125rem;
    left:0;
    top:80%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    list-style: none;
}

nav.header-nav ul li:hover > ul {
	visibility:visible;
	opacity:1;
}

nav.header-nav ul li ul li {
	display:block;
	width:100%;
	position:relative;
	margin:0;
}

nav.header-nav ul li:hover > ul li a,
nav.header-nav ul li > ul li a {
	color:#606060;
	font-size:.875rem;
	padding:1rem 2rem;
	width:100%;
	display: block;
	line-height:1.25rem;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}

nav.header-nav ul li >	ul li:hover,
nav.header-nav ul li > ul li a:hover,
nav.header-nav ul li > ul li.current-menu-item a {
	background:#f9f9f9;
	color:#55c0dd;
}

nav.header-nav li.current-menu-item li a,
nav.header-nav li.current-page-ancestor li a,
nav.header-nav li.current-menu-ancestor li a {
	background:#f9f9f9;
	color:#55c0dd;
}

nav.header-nav ul li:hover > ul li a::before,
nav.header-nav ul li > ul li a::before {
	display:none;
}



/* ==============================================================================
	9. HERO
============================================================================== */
header {
	position:relative;
	height:35rem;
	overflow:hidden;
}

.filter {
	display: block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:2;
	background:rgba(0,0,0,.5);
}

.dots {
	display: block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:3;
	background:url(media/images/dots.png) no-repeat center center / cover;
}

header .container,
header  .row,
header .box-md-5 {
	height:100%;
}

.header__content {
	position: relative;
	z-index:9;
	height:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	width:100%;
}


.header__content-inner {
    width:100%;
}

header p {
	font-size:2rem;
	color:#ffffff;
	font-weight:700;
	padding:0 15%;
	line-height:2.75rem;
	text-align: center;
}

header a {
	margin-top:2rem;
	color:#ffffff;
	border-bottom:.125rem solid #ffffff;
	font-size:1.5rem;
}

header a:hover {
	color:#ffffff;
	padding-bottom:.5rem;
	border-bottom:.25rem solid #ffffff;
}




/* ==============================================================================
	10. BLOCKS
============================================================================== */
.block-grid .box-md-6 {
	width:50% !important;
	max-width:50% !important;
	flex:0 0 50% !important;
}

.block {
	width:100%;
	margin-top:2rem;
}

h2.green {
	color:#33ab91;
	font-size:3.125rem;
	text-align:center;
}

h2.blue {
	color:#55c0dd;
	font-size:3.125rem;
	text-align:center;
}

.block.green {
	background:#33ab91;
}

.block.blue {
	background:#55c0dd;
}

.block.default .featured__item-content {
	background:#ffffff;
	border-bottom:0;
}

.block__inner {
	padding:2rem;
}

.block__inner h3 {
	font-size:2rem;
	color:#ffffff;
	font-weight:700;
}

.block__inner p {
	margin:2rem 0;
	font-size:1.125rem;
	line-height:1.875rem;
}

.block__inner a {
	text-decoration: none;
	display:inline-block;
	color:#000000;
	font-weight:400;
	border-bottom:.125rem solid #000000;
	font-size:1rem;
}

.block__inner a:hover {
	color:#ffffff;
	border-color:#ffffff;	
}

.featured__item {
	position:relative;
}

.featured__item-image {
	position: relative;
	width:100%;
	height:20rem;
	overflow:hidden;
}

.featured__item-image::before {
	content:"";
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:6rem;
	z-index:9; 
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.65)),to(rgba(0,0,0,0))); 
	background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); 
	background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
}

.featured__item-image--inner {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	-webkit-transition: all 0.75s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.75s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.75s cubic-bezier(0.67, 0, 0.34, 1);
}

.featured__item-image:hover .featured__item-image--inner {
	-webkit-transform:scale(1.25);
	    -ms-transform:scale(1.25);
	        transform:scale(1.25);
}

.featured__image-title {
	color:#ffffff;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:auto;
	padding:1.5rem;
	z-index:9;
}

.featured__item-title h3 {
	font-size:1.875rem;
}

.featured__item-content {
	padding:2rem;
	background:#f4f4f4;
	border-bottom:.3125rem solid #33ab91;
}

.featured__item-content p {
	font-size:1.125rem;
	line-height:1.875rem;
}

.featured__item-content a {
	text-decoration: none;
	display:inline-block;
	color:#000000;
	font-weight:700;
	border-bottom:.125rem solid #000000;
	font-size:1rem;
}

.green .featured__item-content a:hover {
	color:#33ab91;
	border-color:#33ab91;	
}

.blue .featured__item-content a:hover {
	color:#55c0dd;
	border-color:#55c0dd;
}




/* ==============================================================================
	9. CONTENT
============================================================================= */

.page-template-page-best-practices,
.page-template-page-tools {
	background:#33ab91;
}

.page-template-page-monitors,
.page-template-page-artikelen {
	background:#55c0dd;
}


/* INTRO */
.intro {
	display:block;
	margin-bottom:5rem;
}

.intro p {
	font-size:1.375rem;
	font-weight:700;
	line-height:2.125rem;
	color:#55c0dd;
}

.intro p a {
	color:#55c0dd;
	text-decoration: underline;
}

.intro p a:hover {
	color:#222222;
}


/* ALINEA */
.alinea {
	display:block;
	margin-bottom:3.125rem;
}

.alinea strong {
	font-weight:700;
}

.alinea h2 {
	font-size:2rem;
	line-height:2.75rem;
	margin-bottom:.5rem;
}

.alinea h3 {
	font-size:1.5rem;
	line-height:2.25rem;
	margin-bottom:.5rem;
}

.alinea h4 {
	font-size:1.25rem;
	line-height:2rem;
	margin-bottom:.5rem;
}

.alinea p,
.alinea li {
	font-size:1.125rem;
	font-weight:400;
	line-height:1.875rem;
	color:#282828;
}

.alinea ul {
	margin:1rem 1.5rem 1rem 1.5rem;
	padding:0;
}


/* AFBEELDING */
.afbeelding {
	width:100%;
	height:auto;
	display:block;
	margin-bottom:3.125rem;
}

.onderschrift {
	display:block;
	width:100%;
	padding:.75rem;
	font-size:.75rem;
	color:#999999;
	font-style: italic;
	text-align: center;
}


/* VIDEO */
.video {
	width:100%;
	height:auto;
	display:block;
	margin-bottom:3.125rem;
}

.video iframe {
	width:100%;
}


/* GROTE BLOKKEN */
.grote__blokken {
	display:block;
	width:100%;
	margin-bottom:3.125rem;
}

.grote__blokken ul {
	width:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	margin:0;
	padding:0;
	list-style:none;
}

.grote__blokken ul li {
	width:48.5%;
	height:18.75rem;
	background-color:#55c0dd;
	margin-top:1rem;
	margin-bottom:1rem;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
	padding:2rem;
}

.grote__blokken ul li:hover {
	-webkit-transform:scale(1.05) rotate(-1deg);
	    -ms-transform:scale(1.05) rotate(-1deg);
	        transform:scale(1.05) rotate(-1deg);
}

.grote__blokken ul li a {
	width:100%;
	height:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}

.grote__blokken ul li h2 {
	color:#ffffff;
	font-weight:700;
	font-size:2.5rem;
	line-height:3.25rem;
	text-aligen:center;
	width:100%;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
}

.grote__blokken ul li:hover h2 {
	color:#000000;
}


/* KLEINE BLOKKEN */
.kleine__blokken {
	display:block;
	width:100%;
	margin-bottom:3.125rem;
}

.kleine__blokken ul {
	width:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	margin:0;
	padding:0;
	list-style:none;
}

.kleine__blokken ul li {
	padding:2rem;
	width:32%;
	height:12.5rem;
	background:#55c0dd;
	margin-top:1rem;
	margin-bottom:1rem;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
}

.kleine__blokken ul li a {
	position: relative;
	width:100%;
	height:100%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
}

.kleine__blokken ul li h2 {
	font-size:10rem;
	color:#ffffff;
	position:absolute;
	left:-1rem;
	top:-2rem;
	line-height:1;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
}

.kleine__blokken ul li:hover h2 {
	left:-2rem;
	top:-3rem;
}

.kleine__blokken ul li h3 {
	font-size:1.25rem;
	line-height:2rem;
	color:#ffffff;
	margin-left:5rem;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

.kleine__blokken ul li:hover h3 {
	color:#000000;
}

.kleine__blokken ul li:hover {
	-webkit-transform:scale(1.05) rotate(-1deg);
	    -ms-transform:scale(1.05) rotate(-1deg);
	        transform:scale(1.05) rotate(-1deg);
}

/* GALLERY */
.galerij {
	display:block;
	width:100%;
	margin-bottom:3.125rem;
}

.galerij ul {
	margin:0;
	padding:0;
	list-style: none;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.galerij ul li {
	position: relative;
	overflow:hidden;
	height:15rem;
	-webkit-box-flex:0;
	    -ms-flex:0 0 18%;
	        flex:0 0 18%;	
	margin:2%;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	background:#f9f9f9;
}

.galerij ul li a {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.galerij ul li:hover a {
	-webkit-transform:scale(1.1);
	    -ms-transform:scale(1.1);
	        transform:scale(1.1);
}


/* QUOTE */
.quote {
	display:block;
	margin-bottom: 5rem;
}

.quote p {
	position: relative;
	font-size:2.25rem;
	font-weight:700;
	line-height:3rem;
	color:#55c0dd;
	padding:3.125rem 1rem;
}

.quote p::before {
	content:"";
	width:100%;
	height:.75rem;
	background:#55c0dd;
	position:absolute;
	top:0;
	left:0;
	transform:rotate(-3deg);
}

.quote p::after {
	content:"";
	width:100%;
	height:.75rem;
	background:#55c0dd;
	position:absolute;
	bottom:0;
	left:0;
	transform:rotate(-3deg);
}

.container {
	position: relative;
}

.auteur {
	position:absolute;
	right:0;
	top:0;
	width:10rem;
}

.auteur__image {
	width:3.75rem;
	height:3.75rem;
	border-radius:3.75rem;
	overflow: hidden;
	margin-bottom:.5rem;
}

.auteur span {
	display:inline-block;
	font-size:.875rem;
	line-height:1rem;
	color:#706f6f;
}

.auteur span.meta {
	color:#282828;
}




/* ==============================================================================
	9. COOKIE NOTICE
============================================================================= */
.cookie-notice-container {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	padding:1rem 0;
	-webkit-box-shadow:0 0 .125rem 0 rgba(0,0,0,.125);
	        box-shadow:0 0 .125rem 0 rgba(0,0,0,.125);
}

.cookie-notice-container .button:last-child {
	border:none;
	padding:0;
	color:#606060;
	font-weight:400;
	margin-left:1rem !important;
}

.cookie-notice-container .button:last-child::before {
	display:none;
}

.cookie-notice-container .button:last-child:hover {
	color:#000000;
}



/* ==============================================================================
	FOOTER
============================================================================= */
.cta {
	margin-top:6.25rem;
	padding:5rem;
	background:#f89aa1;
}

.cta h2 {
	color:#000000;
	margin-bottom:1rem;
	text-align:center;
	font-size:2rem;
}

.cta p {
	color:#000000;
	font-size:1.125rem;
	line-height:1.875rem;
	font-weight:400;
}


footer {
	padding:5rem 0;
	background:#878787;
}

footer h3 {
	display:block;
	font-size:3.125rem;
	color:#ffffff;
}

footer .center img {
	display:block;
	margin:0 auto 6.25rem auto;
}

footer ul.partners {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	-ms-flex-wrap:wrap;
	    flex-wrap:wrap;
	max-width:80%;
}

footer ul.partners li.partner {
	-webkit-box-flex:0;
	    -ms-flex:0 0 33.3333%;
	        flex:0 0 33.3333%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
	margin-top:3.125rem;
}

footer ul.partners li.partner img {
	max-height:4rem;
	width:auto;
	-webkit-filter: grayscale(1);
	filter: grayscale(1);	
}

footer ul.partners li.partner img:hover {
	-webkit-filter: grayscale(0);
	filter: grayscale(0);	
}

footer .newsletter-wrapper {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align:center;
	    -ms-flex-align:center;
	        align-items:center;
}

footer .newsletter-wrapper input {
	height:3.125rem;
	background:#ffffff;
	border-radius:0;
	border:none;
	font-size:1.125rem;
	color:#000000;
}

footer .newsletter-wrapper input::-webkit-input-placeholder,
footer .newsletter-wrapper textarea::-webkit-input-placeholder {
	font-size:1.125rem;
	color:#000000;
}

footer .newsletter-wrapper input:-ms-input-placeholder,
footer .newsletter-wrapper textarea:-ms-input-placeholder {
	font-size:1.125rem;
	color:#000000;
}

footer .newsletter-wrapper input::-ms-input-placeholder,
footer .newsletter-wrapper textarea::-ms-input-placeholder {
	font-size:1.125rem;
	color:#000000;
}

footer .newsletter-wrapper input::placeholder,
footer .newsletter-wrapper textarea::placeholder {
	font-size:1.125rem;
	color:#000000;
}

footer .newsletter-wrapper input.button {
	height:3.125rem;
	background:#3c3c3b;
	color:#ffffff;
	font-size:1.125rem;
	line-height:3rem;
}

footer p {
	font-size:1.125rem;
	line-height: 1.875rem;
	color:#282828;
	display: block;
	padding:1rem 0;
}

footer .contact {
	margin-top:6.25rem;
}


/* ==============================================================================
	BUTTONS
============================================================================= */
button {
	outline:none;
}

.button {
	position:relative;
	display:inline-block;
	height:3.75rem;
	padding:0 2rem;
	font-size:2rem;
	line-height:3.75rem;
	font-weight:700;
	text-decoration: none;
	cursor:pointer;
	background:transparent;
	color:transparent;
	border:.125rem solid transparent;
	overflow:hidden;
	z-index:1;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

.button:hover {
}

.button.white {
	background:transparent;
	border-color:#ffffff;
	color:#ffffff;
}

.button.white:hover {
	background:#ffffff;
	color:#000000;
}




/* ==============================================================================
	24. FORMS
============================================================================= */

input:focus,
textarea:focus,
select:focus {
	outline:none;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
	font-family:'Lato', sans-serif;
	font-size:.75rem;
	color:#7F7CA0;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
	font-family:'Lato', sans-serif;
	font-size:.75rem;
	color:#7F7CA0;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
	font-family:'Lato', sans-serif;
	font-size:.75rem;
	color:#7F7CA0;
}

input::placeholder,
textarea::placeholder {
	font-family:'Lato', sans-serif;
	font-size:.75rem;
	color:#7F7CA0;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="date"],
input[type="time"],
textarea,
select {
	width:100%;
	margin:0;
	padding:.5rem;
	background:#ffffff;
	border:1px solid #D5D9E1;
	font-family:'Lato', sans-serif;
	font-size:.75rem;
	color:#7F7CA0;
	border-radius:.25rem;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

textarea {
	height: 10rem;
	resize: vertical;
}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

input[type="submit"],
input[type="button"] {
	-webkit-appearance: none;
}

.gform_wrapper {

}

.gform_heading {

}

.gform_body {

}

.gform_footer {

}

.gform_title {

}

.gform_fields {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	list-style:none;
	margin: 0 -0.5rem;
	padding: 0;
}

.gform_fields .gfield {
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 auto;
	        flex: 1 1 auto;
	max-width: 100%;
	padding: 0 0.5rem;
	margin: 0 0 1rem;
}

.gform_fields .gfield.form-full {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 100%;
	flex: 1 1 100%;
}

.gform_fields .gfield.form-half {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	max-width: 50%;
}

.gform_fields .gfield.form-third {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 33.3%;
	flex: 1 1 33.3%;
	max-width: 33.4%;
}

.gform_fields .gfield.form-quarter {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 25%;
	flex: 1 1 25%;
	max-width: 25%;
}

.gform_fields .gfield.gfield_html {
	position: relative;
}

.gform_fields .gfield.gfield_html h3 {
	margin: 2.5rem 0 0.5rem;
}

.gform_fields .gfield.gfield_html:first-child h3 {
	margin-top: 0;
}

.gform_fields .gfield.gfield_html:last-child h3 {
	margin-bottom: 0;
}

.gform_fields .gfield.gfield_error {

}

.gform_fields .gfield .gfield_label {
	font-family: 'Lato', sans-serif;
	font-size: 0.75rem;
	font-weight: 400;
	color: #7F7CA0;
	padding: 0;
	margin: 0 0 0.25rem 0;
}

.gform_fields .gfield .gfield_label.gfield_label--focus {
	
}

.gform_fields .gfield .ginput_container {

}

.gform_fields .gfield .ginput_container input,
.gform_fields .gfield .ginput_container textarea {

}

.gform_fields .gfield .ginput_container .gform_fileupload_multifile {

}

.gform_fields .gfield .ginput_container .gform_fileupload_multifile .gform_drop_area {

}


.gform_fields .gfield .ginput_container .gfield_checkbox,
.gform_fields .gfield .ginput_container .gfield_radio {
	display: -webkit-box;
	display: -ms-flex;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	list-style: none;
	padding: 0;
	margin: 0 -0.5rem;
}

.gform_fields .gfield .ginput_container .gfield_checkbox > li,
.gform_fields .gfield .ginput_container .gfield_radio > li {
	padding: 0 0.5rem;
	margin: 0 0 1rem 0;
	
}

.gform_fields .gfield .ginput_container .gfield_checkbox > li label,
.gform_fields .gfield .ginput_container .gfield_radio > li label {
    font-family: 'Lato', sans-serif;
	font-size: 0.75rem;
	font-weight: 400;
	color: #7F7CA0;
	padding: 0;
	margin: 0 0 0 0.25rem;
}

.gform_fields .gfield .ginput_container .gfield_checkbox > li input,
.gform_fields .gfield .ginput_container .gfield_radio > li input {
    
}

.gform_fields .gfield .gfield_description {
	
}

.gform_footer .gform_button {
	position: relative;
	font-family: 'Lato', sans-serif;
	display: inline-block;
	height: 2.75rem;
	padding: 0 2rem;
	font-size: .875rem;
	line-height: 2.75rem;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	background: #ffffff;
	color: #009DE5;
	border: 1px solid #009DE5;
	overflow: hidden;
	z-index: 1;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

.gform_footer .gform_button::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: -1;
	background: #009DE5;
	-webkit-transform: translate(0, 100%);
	    -ms-transform: translate(0, 100%);
	        transform: translate(0, 100%);
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

.gform_footer .gform_button:hover,
.gform_footer .gform_button:focus {
	color:#ffffff;
}

.gform_footer .gform_button:hover::before,
.gform_footer .gform_button:focus::before {
	-webkit-transform: translate(0, 0);
	    -ms-transform: translate(0, 0);
	        transform: translate(0, 0);
}

.gform_wrapper .validation_error {
	font-size:.75rem;
	margin-bottom:1rem;
}

.gform_wrapper .validation_message {
	font-size:.625rem;
	margin-bottom:-1rem;
	color:#f53434;
}

.gform_hidden {
	display: none;
}

.gform_wrapper .gpnf-nested-entries {
	width: 100%;
}



/* ==============================================================================
	8. SEARCH
============================================================================== */
#navigation .search-button {
	position:relative;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-line-pack: center;
	    align-content: center;
	cursor:pointer;
	width:1.125rem;
	height:1.0625rem;
	background:url(media/images/icon-search.png) no-repeat center center;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

#search-close * {
	cursor:pointer;
}

.search-divider {
	position:relative;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	width:1px;
	height:1rem;
	background:#87C7F7;
	margin:0 1.25rem;
}

.search-button:hover {
	opacity:.5;
}

#search-close {
	position: absolute;
	top: 1em;
	right: 1em;
	width: 30px;
	height: 30px;
	margin: 0;
	color: #2B2661;
	z-index: 999;
	cursor:pointer;
}

#search-close .link-icon {
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	        transform-style: preserve-3d;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
}

#search-close span:first-child {
	width:30px;
	height:2px;
	top:50%;
	left:50%;	
	background:#2B2661;
	position:absolute;
	-webkit-transform: translate(-50%, -50%) rotate(45deg); 
	-ms-transform: translate(-50%, -50%) rotate(45deg); 
	    transform: translate(-50%, -50%) rotate(45deg);
}

#search-close span:last-child {
	width:30px;
	height:2px;
	background:#2B2661;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translate(-50%, -50%) rotate(-45deg); 
	-ms-transform: translate(-50%, -50%) rotate(-45deg); 
	    transform: translate(-50%, -50%) rotate(-45deg);
}

#search-close:hover .link-icon {
	-webkit-transform: rotate(90deg); 
	-ms-transform: rotate(90deg); 
	    transform: rotate(90deg);
}

#search-modal {
	display: block;
	position: fixed;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	z-index: 9999;
	-webkit-transition: all 1s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 1s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 1s cubic-bezier(0.67, 0, 0.34, 1);
}

#search-area {
	position:fixed;
	opacity:0;
	right:0;
	top:0;
	width:100%;
	height:100%;
	background:#ffffff;
	z-index:99999;
	-webkit-transform: scale(.75);
	    -ms-transform: scale(.75);
	        transform: scale(.75);
	-webkit-transition: all .5s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all .5s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all .5s cubic-bezier(0.67, 0, 0.34, 1);
}

body.search-open {
	overflow:hidden;
}

body.search-open #search-area {
	opacity:1;
	-webkit-transform: scale(1);
	    -ms-transform: scale(1);
	        transform: scale(1);
	overflow-y: auto;
}

body.search-open #search-modal {
	opacity: 1;
	visibility: visible;
}

.search-container {
    position: relative;
    padding: 0 1em;
    height: 100%;
	width:50%;
	margin:1em auto;
}

#search-modal form {
	background:#ffffff;
	border:1px solid #DCDCDC;
	overflow:hidden;
	padding:1.5rem;
}

.search-fields {
	font-size:1.250em;
}

.search-fields ::-webkit-placeholder,
.search-fields ::-webkit-input-placeholder {
	color:#555555;
	font-style:italic;
	font-size: 1.125em;
}

.search-fields ::-webkit-placeholder,
.search-fields ::placeholder {
	color:#555555;
	font-style:italic;
	font-size: 1.125em;
}

.search-fields-inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	width: 100%;
	height: auto;
}

.search-fields button {
	font-size: 1em;
	line-height:auto;
	background:transparent;
	color:#555555;
	border:0;
	display:none;
}

.search-fields input {
	font-family: 'Poppins', sans-serif;
	font-size: 1.125em;
	font-weight:700;
	color:#55c0dd;
	width: 100%;
	border: 0;
	padding:0;
	background: transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
	     appearance: none;
}

.search-fields input:focus {
	outline: 0;
}

.search-fields input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

#search-results {
	color: #ffffff;
	list-style: none;
	padding:0;
}

#search-results li {
	position:relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	opacity: 0;
	-webkit-transform: translate(0, 50%);
	        -ms-transform: translate(0, 50%);
	    transform: translate(0, 50%);
	border-bottom:1px solid #eeeeee;
	padding:2rem;
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
    transform: translateZ(0);
    z-index:2;
}

#search-results li::before {
	z-index:1;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:1px;
	background:#55c0dd;
	-webkit-transform: translate(-102%, 0);
	    -ms-transform: translate(-102%, 0);
	        transform: translate(-102%, 0);
	content:"";
	-webkit-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	-o-transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);
	transition: all 0.35s cubic-bezier(0.67, 0, 0.34, 1);	
}

#search-results li:hover::before {
	-webkit-transform:translate(0, 0);
	    -ms-transform:translate(0, 0);
	        transform:translate(0, 0);
}

#search-results p {
    font-size: .875rem;
    margin-top: .5rem;
    color:#999999;
}

#search-results a {
	text-decoration:none;
}

.search-container {
    width: 50vw;
    height: auto;
    padding-top:10rem;
    
}

.search-output {
	max-height: 100%;
    overflow-y: auto;
}

.ui-autocomplete {
	display:none;
}


@-webkit-keyframes flyIn {
	from {
		opacity: 0;
		-webkit-transform: translate(0, 100%);
		        transform: translate(0, 100%);
	}
	to {
		opacity: 1;
		-webkit-transform: translate(0, 0);
		        transform: translate(0, 0);
	}
} 

@keyframes flyIn {
	from {
		opacity: 0;
		-webkit-transform: translate(0, 100%);
		        transform: translate(0, 100%);
	}
	to {
		opacity: 1;
		-webkit-transform: translate(0, 0);
		        transform: translate(0, 0);
	}
}




/* ==============================================================================
	25. RESPONSIVE
============================================================================= */

@media all and (max-width: 64em) {
	
	.navigation-right .navigation__search {
		width: 10rem;
	}
	
	.search-container {
    	width: 90vw;
    }
    
}



@media all and (max-width: 48em) {	
	
	body {
		padding-top: 3.5rem;
	}
	
	.navigation-left {
		-webkit-box-flex:0;
		    -ms-flex:none;
		        flex:none;
	}
	
	.navigation-center {
		-webkit-box-flex:0;
		    -ms-flex:0 0 80%;
		        flex:0 0 80%;
		-webkit-box-align: flex-start;
	    -ms-flex-align: flex-start;
	    align-items: flex-start;
	    -webkit-box-pack: start;
	        -ms-flex-pack: start;
	            justify-content: flex-start;
	}
	
	.navigation-right {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 auto;
		        flex: 0 0 auto;
	}
	
	#navigation {
		height: 3.5rem;
	    display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -webkit-box-align: center;
	        -ms-flex-align: center;
	            align-items: center;
	}
	
	.navigation-right .navigation__search {
	    height: auto;
	    width:auto;
	    border-left: none;
	    padding-left: 0;
	    margin-left: 0;
	}

	#navigation .logo {
		width:7.8125rem;
		height:1.875rem;
	}
	
	nav.header-nav {
		opacity:0;
		visibility:hidden;
		-webkit-transition: .5s ease-in-out;
	    -o-transition: .5s ease-in-out;
	    transition: .5s ease-in-out;
	    -webkit-transform: translate(100%, 0);
	        -ms-transform: translate(100%, 0);
	            transform: translate(100%, 0);
	    background: #ffffff;
		width:100%;
		height:100%;
		position:fixed;
		height:100%);
		top: 0;
		left: 0;
		z-index:-1;
		-webkit-backface-visibility: hidden;
		        backface-visibility: hidden;
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		-webkit-box-align:flex-start;
		    -ms-flex-align:flex-start;
		        align-items:flex-start;
		overflow-y:auto;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: -ms-hide-scrollbar;
		display: flex;
	    -webkit-box-align: center;
	        -ms-flex-align: center;
	            align-items: center;
	    -webkit-box-pack: center;
	        -ms-flex-pack: center;
	            justify-content: center;
	    -ms-flex-line-pack: center;
	        align-content: center;
	}
		
	.nav-open nav.header-nav {
		opacity:1;
		visibility:visible;
		-webkit-transform: translate(0, 0);
		    -ms-transform: translate(0, 0);
		        transform: translate(0, 0);
		-webkit-backface-visibility: hidden;
		        backface-visibility: hidden;
	}
	
	nav.header-nav ul {
		width:100%;
		max-width:90%;
		margin:0 auto;
		padding-top:3.125rem;
		padding-bottom:3.125rem;
		background:transparent;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	    -webkit-box-orient: vertical;
	    -webkit-box-direction: normal;
	        -ms-flex-direction: column;
	            flex-direction: column;
	    -webkit-box-align: center;
	        -ms-flex-align: center;
	            align-items: center;
	    -webkit-box-pack: center;
	        -ms-flex-pack: center;
	            justify-content: center;
	    -ms-flex-line-pack: center;
	        align-content: center;
	}
	
	nav.header-nav ul::before {
		display:none;
	}
	
	nav.header-nav ul li {
		display:block;
		margin-right:0;
		margin-left:0;
		text-align:center; 
	}
	
	nav.header-nav ul li a:after {
		display:none;
	}
	
	.navbar-toggle {
		display:block;
		position:relative;
		height:1rem;
		width:1.875rem;
		margin-left:2rem;
		outline:none;
		-webkit-appearance: none;
		border:0;
		padding:0;
		background:transparent;
		z-index:999;
	}
	
	.navbar-toggle:focus,
	.navbar-toggle:active {
		outline:none;
		background:transparent;
	}
	
	.navbar-toggle .icon-bar {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
		position:absolute;
		width:1.875rem;
		height:.125rem;
		background:#55c0dd;
	    -webkit-transform-origin: center center;
	    -ms-transform-origin: center center;
	        transform-origin: center center;
	    -webkit-transition: all 0.3s 0s cubic-bezier(0.76, 0.17, 0.27, 0.88);
	    -o-transition: all 0.3s 0s cubic-bezier(0.76, 0.17, 0.27, 0.88);
	    transition: all 0.3s 0s cubic-bezier(0.76, 0.17, 0.27, 0.88);
	    outline:none;
    }
    
    .navbar-toggle .icon-bar { 
	    background:#55c0dd;
    }
    
    .navbar-toggle.active .icon-bar {
	    -webkit-transition: all 0.3s 0.3s cubic-bezier(0.76, 0.17, 0.27, 0.88);
	    -o-transition: all 0.3s 0.3s cubic-bezier(0.76, 0.17, 0.27, 0.88);
	    transition: all 0.3s 0.3s cubic-bezier(0.76, 0.17, 0.27, 0.88);
    }
    
    .nav-open .navbar-toggle .icon-bar {
	    background:#55c0dd;
    }
	
	.navbar-toggle span:nth-child(1) {
		top:0;
	}
	
	.navbar-toggle span:nth-child(2) {
		top:7px;
	}
	
	.navbar-toggle span:nth-child(3) {
		top:14px;
	}
		
	.navbar-toggle.active span:nth-of-type(1) { 
		-webkit-transform: translate(0, 9px) rotate(45deg); 
		-ms-transform: translate(0, 8px) rotate(45deg); 
		    transform: translate(0, 8px) rotate(45deg);
		-webkit-transition-delay:;
		     -o-transition-delay:;
		        transition-delay: 
	}
	
	.navbar-toggle.active span:nth-of-type(2) { 
		-webkit-transform: translate(9px, 0); 
		-ms-transform: translate(100px, 0); 
		    transform: translate(100px, 0); 
		opacity: 0;
	}
	
	.navbar-toggle.active span:nth-of-type(3) { 
		-webkit-transform: translate(0, -6px) rotate(-45deg); 
		-ms-transform: translate(0, -6px) rotate(-45deg); 
		    transform: translate(0, -6px) rotate(-45deg); 
	}
	
	
	/* MAIN NAVIGATION - FIRST LEVEL*/
	nav.header-nav ul li.menu-item-has-children a::after {
		display:none;
	}
	
	nav.header-nav ul li {
		text-align:left;
		margin-bottom: 2rem;
	}
	
	nav.header-nav ul li a {
		font-size:2rem;
		font-weight:700;
		padding:0;
		border:none;
		color:#55c0dd;
		line-height:2.75rem;
	}
	
	nav.header-nav li a:hover, 
	nav.header-nav li:hover a, 
	nav.header-nav li.current-menu-item a, 
	nav.header-nav li.current-page-ancestor a {
		color:#55c0dd;
		border:none;
		background:transparent;
	}


	/* MAIN NAVIGATION - SECOND LEVEL*/
	nav.header-nav ul li > ul {
		position:relative;
		visibility:visible;
		opacity:1;
	    background:transparent;
		-webkit-box-shadow: none;
		        box-shadow: none;
	    border-radius:none;
	    width:100%;
	    padding:0;
	    margin-top: 0;
		margin-left:0;
		margin-right:auto;
	    top:auto;
	    left:auto;
	    max-width:100%;
	}
	
	nav.header-nav ul li > ul:before {
		display:none;
	}

	nav.header-nav ul li ul li {
		margin:0;
		width:100%;
	}
	
	nav.header-nav ul li:hover > ul li a,
	nav.header-nav ul li > ul li a {
		color:#606060;
		font-weight:400;
		font-size:1.5rem;
		padding:0;
		width:100%;
		text-align:center;
		border-left:none;
		line-height:2rem;
	}
	
	nav.header-nav ul li >	ul li:hover,
	nav.header-nav ul li > ul li a:hover,
	nav.header-nav ul li > ul li.current-menu-item a,
	nav.header-nav ul li.current_page_ancestor a {
		background:transparent;
		color:#00BBEC;
	}
	
	h1 {
	    font-size: 3.125rem;
	    line-height: 3.875rem;
    }
    
    header p {
	    font-size: 1.22rem;
	    font-weight: 400;
	    padding: 0px 5%;
	    line-height: 2rem;
	    text-align: center;
	}
    
    header a {
    	font-weight: 700;
    }
    
    h2.green,
    h2.blue {
	    font-size:2.25rem;
    }
    
    .block__inner h3 {
    	font-size: 1.5rem;
    }
    
	.featured__item-image {
		height:12.5rem;
	}
	
	footer {
		padding-left:3.125rem;
		padding-right:3.125rem;
	}
	
	footer .box-md-6 {
		text-align:center;
	}
	
	footer ul.partners {
	    -webkit-box-pack: center;
	        -ms-flex-pack: center;
	            justify-content: center;
	    max-width: 100%;
	    margin-bottom:6.25rem;
	}

	header {
		height:20rem;
	}
	
	.home header {
		height:30rem;
	}
	
	.content {
		padding-left:2rem;
		padding-right:2rem;
	}
	
	.grote__blokken ul li h2 {
	    font-size: 1.5rem;
	    line-height: 2.25rem;
	}
	
	.grote__blokken ul li {
		height:15rem;
	}
	
	.kleine__blokken ul {
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-ms-flex-line-pack: center;
		    align-content: center;
	}
	
	.kleine__blokken ul li {
	    width: 60%;
	    height: 12.5rem;
	}
	
	.galerij ul li {
		-webkit-box-flex:0;
		    -ms-flex:0 0 28%;
		        flex:0 0 28%;	
		margin:2%;
		height:12.5rem;
	}
	
	.auteur {
	    position: relative;
	    right: auto;
	    top: auto;
	    width: 100%;
	    text-align: center;
	    margin-bottom:2rem;
	}
	
	.auteur__image {
		display:block;
		margin:0 auto;
	}

}




@media all and (max-width: 30em) {
		
	.content {
		padding-left:1rem;
		padding-right:1rem;
	}
	
	h1 {
		font-size:2rem;
		line-height:2.75rem;
	}
	
	.quote {
		margin-bottom:3.125rem;
	}

	.navigation-center {
    	-webkit-box-flex: 1;
    	    -ms-flex: 1;
    	        flex: 1;
    }
	
	header a {
		font-size:1.25rem;
	}
	
	.featured__item-content p,
	.block__inner p,
	p {
		font-size:.875rem;
		line-height:1.625rem;
	}
	
	.cta {
		padding:3.125rem 0;
    	margin-top: 0; 
    }
    
    footer h3 {
    	font-size: 2rem;
    	line-height:2.75rem;
    }
    
    .grote__blokken ul li {
    	width: 100%;
    }
    
    .kleine__blokken ul li {
	    width: 100%;
	    height: 12.5rem;
	}
	
	.kleine__blokken ul li h2 {
		font-size: 4rem;
		top:-1rem;
		left:-1rem;
	}
	
	.kleine__blokken ul li h3 {
	    font-size: 1rem;
	    line-height: 1.5rem;
	    margin-left: 2rem;
	}
	
	.galerij ul li {
	    -webkit-box-flex: 0;
	        -ms-flex: 0 0 46%;
	            flex: 0 0 46%;
	    margin: 2%;
	    height: 8rem;
	}
	
	footer ul.partners li.partner {
	    -webkit-box-flex: 0;
	        -ms-flex: 0 0 100%;
	            flex: 0 0 100%;
	    -webkit-box-pack: center;
	        -ms-flex-pack: center;
	            justify-content: center;
	}
	
	.block-grid .box-md-6 {
		width:100% !important;
		max-width:100% !important;
		flex:0 0 100% !important;
	}
		
}