/*////////////*/
/* TYPOGRAPHY */
/*////////////*/

@font-face {
    font-family: 'Futura';
    font-weight: normal;
    src: url("../fonts/FuturaBC.ttf");
}
@font-face {
    font-family: 'Futura';
    font-weight: bold;
    src: url("../fonts/FuturaXBC.ttf");
}

@font-face {
    font-family: 'Barlow';
    font-weight: normal;
    src: url("../fonts/Barlow/Barlow-Regular.ttf");
}

@font-face {
    font-family: 'Barlow';
    font-weight: bold;
    src: url("../fonts/Barlow/Barlow-Bold.ttf");
}

@font-face {
    font-family: 'Barlow';
    font-weight: normal;
    font-style: oblique;
    src: url("../fonts/Barlow/Barlow-Italic.ttf");
}

@font-face {
    font-family: 'Barlow';
    font-weight: bold;
    font-style: oblique;
    src: url("../fonts/Barlow/Barlow-BoldItalic.ttf");
}

@font-face {
    font-family: 'Barlow_Condensed';
    font-weight: normal;
    src: url("../fonts/Barlow_Condensed/BarlowCondensed-Regular.ttf");
}

@font-face {
    font-family: 'Barlow_Condensed';
    font-weight: bold;
    src: url("../fonts/Barlow_Condensed/BarlowCondensed-Bold.ttf");
}

@font-face {
    font-family: 'Barlow_Condensed';
    font-weight: normal;
    font-style: oblique;
    src: url("../fonts/Barlow_Condensed/BarlowCondensed-Italic.ttf");
}

@font-face {
    font-family: 'Barlow_Condensed';
    font-weight: bold;
    font-style: oblique;
    src: url("../fonts/Barlow_Condensed/BarlowCondensed-BoldItalic.ttf");
}

@font-face {
    font-family: 'Passion_One';
    font-weight: normal;
    src: url("../fonts/passion_one/PassionOne-Regular.ttf");
}

@font-face {
    font-family: 'Passion_One';
    font-weight: bold;
    src: url("../fonts/passion_one/PassionOne-Bold.ttf");
}









/*/////////*/
/* BACKEND */
/*/////////*/

body.user-logged-in .page {
    position: relative;
}
body.user-logged-in .page #block-vredesactie-local-tasks {
    z-index: 100;
}









/*////////////////*/
/* GENERAL LAYOUT */
/*////////////////*/

html {
    box-sizing: border-box;
    font-weight: normal;
    scroll-behavior: smooth;
    scroll-padding-top: 4rem;
}

/* mobile: make offset for top menu bar */
@media (max-width: 850px) {
    html {
        scroll-padding-top: calc(4rem + 80px);
    }
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

body {
    padding-top: 0px !important;
    font-family: 'Barlow', sans-serif;
    font-size: 1.2rem;
    max-width: 100vw;
    background-color: #f7f6f2;
    overflow-x: hidden;
}

h1, h2 {
    font-family: Passion_One;
}
h3, h4 {
    font-family: Barlow_Condensed;
}
h1 {
    font-size: 4rem;
    line-height: 100%;
    font-weight: normal;
}
h2 {
    font-size: 3rem;
    font-weight: normal;
}
h3 {
    font-size: 2.5rem;
    font-weight: bold;
}
h4 {
    font-size: 2rem;
    font-weight: normal;
}
h1 a, h2 a, h3 a, h4 a {
    text-decoration: none;
}
h1 strong, h2 strong {
    font-weight: normal !important;
}

@media (max-width: 850px) {
    h1, h2, h3, .field--name-title  {
        hyphens: auto;
    }
    h1 {
        font-size: 3.5rem;
        line-height: 100%;
    }
    h2, .field--name-title, .field--name-field-inleiding h2, .views-field-title {
        font-size: 2.5rem;
    }
    h3, h4, .field--name-field-inleiding h3 {
        font-size: 1.5rem;
    }
}

#header-top {
    display: none;
}

#site-header .outer-wrapper {
    max-width: 1290px;
    margin: auto;
    /*padding: 0 15px;*/
    width: 90%;
}

#block-logo {
    position: absolute;
    left: 32px;
    top: 41px;
    z-index: 99;
}

#site-header {
    display: block;
}

section#content {
    margin: auto;
    padding-bottom: 7em;
    overflow-x: hidden;
}

body:not(.page-civicrm) #block-vredesactie-content {
    max-width: 1290px;
    margin: auto;
    width: 90%;
}


/* custom classes for tweaks */

.tiny {
    font-size: 0.8rem;
    line-height: 1em;
}
.hidden {
    display: none;
}

/* modal overlays */
.ui-widget {
    font-family: 'Barlow', serif;
}

.alert-warning {
    display: block;
    margin: 0.5rem 0 !important;
    padding: 0.5rem !important; 
    border: 2px solid darkred !important;
    background-color: #ff2200 !important;
    color: white !important;
}

.ui-dialog-title {
    font-family: 'Barlow', sans-serif;
    font-weight: normal;
    color: #3a3a3a;
    font-size: 2rem;
}

.messages {
    padding-left: 2.5rem !important;
    color: #3a3a3a !important;
}

.data-drupal-messages .messages--error {

}

.data-drupal-messages .messages--status {

}

/* HEADER*/

#header-top {
    background: gainsboro;
}








/******************/
/* INPUT ELEMENTS */
/******************/

input[type=text],
input[type=email],
form details,
select {
    border-radius: 0;
    border: 3px solid white;
    padding: 0 0.6rem;
    background: #00c47c;
    height: 3rem;
    width: 100%;
}

form .form-type-checkbox {
    display: block;
    position: relative;
    padding-left: 2rem !important;
    cursor: pointer;
}

form input[type=checkbox]+label:before {
    margin: 0 1rem 0 -2rem;
    content: '';
    position: absolute;
    background: #fff;
    width: 1.5rem;
    height: 1.5rem;
    text-align: center;
}
form input[type=checkbox]:checked+label:before {
    content: "\25FC";
    color: #00c47c;
    font-size: 1.2rem;
    line-height: 1.2rem;
}

body:not(.page-civicrm-contribute) form input[type=checkbox] {
    display: none;
}










/*/////////*/
/* BUTTONS */
/*/////////*/

.button a,
a.button,
.field--name-field-buttons a,
.field--name-field-button a,
.webform-button--submit,
.article_context a.button,
.crm-submit-buttons a,
.views-field-field-button a,
input[type=submit],
.more-link a,
.node-readmore a {
    display: inline-block;
    margin: 0.5em 0 0 0em;
    background: #00c47c;
    color: white;
    border: 0.2rem solid white;
    text-decoration: none;
    padding: 0.8rem 1rem;
    text-transform: uppercase;
    font-family: Barlow_Condensed, sans-serif;
    font-weight: bold;
    font-size: 1.5rem;
    transition: background-color 0.2s, color 0.2s, border 0.6s;
    align-self: flex-end;
}

.button a:hover,
a.button:hover,
.field--name-field-buttons a:hover,
.webform-button--submit:hover,
.article_context a.button:hover,
.crm-submit-buttons a:hover,
.views-field-field-button a:hover,
input[type=submit]:hover,
.more-link a:hover,
.node-readmore a:hover {
    background-color: white;
    color: #00c47c;
    border: 0.2rem solid #00c47c;
}
.field--name-field-buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
}




/*/////////////*/
/* PAGE TITLES */
/*/////////////*/

#block-vredesactie-page-title {
    position: absolute;
    min-height: calc(30vh - 7rem);
    height: calc(35vw - 28px - 7rem);
    width: 75vw;
    top: 5rem;
    left: 10vw;
    z-index: 40;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
 }

#block-vredesactie-page-title h1 {
    display: inline;
    margin: 0;
    font-family: 'Passion_One', sans-serif;
    font-size: 2.5rem;
    line-height: 1.6em;
    font-weight: normal;
}

#block-vredesactie-page-title h1 span {
    padding: 0.1em 0.2em 0.1em;
    box-shadow: 10px 0 0 #00c47c, -10px 0 0 #00c47c;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    color: #f7f6f2;
    background: #00c47c;
}

/* override for non-node pages (usually pages created from views) */
body:not(.path-node) #block-vredesactie-page-title h1 {
    padding: 0.1em 0.2em 0.1em;
    box-shadow: 10px 0 0 #00c47c, -10px 0 0 #00c47c;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    color: #f7f6f2;
    background: #00c47c;
}

@media (max-width: 850px) {
    #block-vredesactie-page-title {
        top: calc(1rem + 80px);
        left: 1rem;
        width: 90vw;
        height: calc(40vh - 2rem);
    }

    #block-vredesactie-page-title h1 {
        font-size: 8vw;
        line-height: 1.3em;
        margin: 1rem 0 0 1rem;
        padding: 0.1em 0.1em 0;
    }
}
@media (min-width: 1100px) {
    #block-vredesactie-page-title h1 {
        font-size: 3.5vw;
        line-height: 1.5em;
    }
}
@media (min-width: 1920px) {
    #block-vredesactie-page-title {
        height: calc(30vh - 2rem);
    }
}









/*///////////*/
/* MAIN MENU */
/*///////////*/

#block-zijmenu {
    float: right;
    height: 100%;
    background: white;
}

#block-zijmenu .field--name-body {
    position: relative;
    height: 100%;
}

#block-vredesactie-main-menu ul.menu {
    padding: 0 9vw 0 9vw;
    width: 100%;
}

#block-vredesactie-main-menu ul.menu li {
    float: left;
    clear: both;
    width: 100%;
    margin-right: 2em;
}

#block-hoofdnavigatie ul.menu li a,
#block-vredesactie-main-menu ul.menu li a {
    font-size: 2.4vw;
    text-transform: uppercase;
    text-decoration: none;
    font-family: 'Barlow', sans-serif;
    font-weight: bold;
    color: #1d1d1b;
    line-height: 1em;
}

#block-vredesactie-main-menu ul.menu li a.mobile-only {
    display: none;
}

#block-hoofdnavigatie .menu-item--collapsed,
#block-vredesactie-main-menu .menu-item--collapsed {
    list-style-type: none;
    list-style-image: unset;
}

#block-hoofdnavigatie ul.menu li.yellow a,
#block-vredesactie-main-menu ul.menu li.yellow a {
    display: inline-block;
    padding: 0.7rem;
    margin-left: -0.7rem;
    background-color: #27da98;
}
#breadcrumb {
    clear: both;
}

.status-messages {
    clear: both;
    padding-top: 2em;
}

#block-vredesactie-main-menu ul.menu li a:hover,
#block-vredesactie-main-menu ul.menu li a.active {
    color: #00c47c;
}

#block-vredesactie-main-menu {
    float: left;
    padding-top: 30%;
    width: 0;
}

.menu-buttons-top img,
.menu-buttons-bottom img {
    display: block;
    margin: auto;
    cursor: pointer;
    max-width: 80px;
    object-fit: cover;
    object-position: center;
}

.menu-buttons-bottom img {
    margin-top: 1em;
}

.menu-buttons-bottom {
    position: absolute;
    bottom: 2em;
    right: 34%;
}

/* MAIN MENU */
#sidebar-second {
    float: right;
    position: fixed;
    right: 0;
    top: 0;
    background: #f7f6f2;
    height: 100%;
    z-index: 150;
}

#sidebar-second>div:first-child {
    height: 100%;
}

/* mobile main menu */
#header-top {
    background: #1d1d1b;
    position: fixed;
    width: 100%;
    z-index: 150;
    top: 0;
}

#block-mobielmenu {
    min-width: 300px;
    background: #1d1d1b;
}

#block-mobielmenu p {
    padding: 0;
    margin: 0;
}

#block-mobielmenu img.logo {
    margin-left: 1em;
    margin-top: 1.5em;
}

#block-mobielmenu img.hamburger {
    float: right;
    height: 80px;
    width: 80px;
}

#block-hoofdnavigatie,
#block-mobielenavigatieextra {
    background: #f7f6f2;
    position: relative;
    z-index: 150;
    width: 100%;
    overflow: hidden;
}

#block-hoofdnavigatie {
    height: 0;
    transition: height 0.2s;
}

#block-hoofdnavigatie.showMenu {
    height: auto;
}

#block-vredesactie-main-menu.showMenu {
    width: auto;
}

#block-mobielenavigatieextra {
    display: none;
}

#block-hoofdnavigatie ul li {
    padding-bottom: 0.5em;
}

#block-hoofdnavigatie ul.menu li a {
    font-size: 2.4vw;
    text-transform: uppercase;
    text-decoration: none;
    font-family: 'Barlow', sans-serif;
    color: #1d1d1b;
    line-height: 1em;
}

#block-mobielenavigatieextra ul.menu li a.mobile-only,
#block-mobielenavigatieextra ul.menu li a.mobile-only:hover {
    color: transparent;
    float: left;
    margin-right: 1em;
}

#block-mobielenavigatieextra ul.menu li a.mobile-only.facebook {
    background: url('/sites/default/files/facebook.svg');
    background-repeat: no-repeat;
    width: 14px;
    height: 26px;
}

#block-mobielenavigatieextra ul.menu li a.mobile-only.twitter {
    background: url('/sites/default/files/twitter.svg');
    background-repeat: no-repeat;
    width: 27px;
    height: 20px;
}

#block-mobielenavigatieextra ul.menu li a.mobile-only.flickr {
    background: url('/sites/default/files/flickr.svg');
    background-repeat: no-repeat;
    width: 20px;
    height: 10px;
}

#block-hoofdnavigatie ul.menu li a:hover,
#block-hoofdnavigatie ul.menu li a:active {
    color: #00c47c;
}

#block-hoofdnavigatie ul.menu,
#block-mobielenavigatieextra ul.menu {
    margin: 0;
    padding: 21px 0 21px 21px;
    overflow: auto;
}

/* /mobile main menu */











/* FRONTPAGE FLEXBOX */

.frontpage-flexbox {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 2rem;
    width: 100%;
    padding: 0;
    align-items: flex-start;
}

.frontpage-flexbox > li {
    background-color: white;
    color: #3a3a3a;
    max-width: min(1000px 30vw);
    display: flex;
    gap: 1rem;
    flex-direction: column;
    flex-basis: 30%;
    flex-grow: 1;
    max-width: 70%;
    align-items: flex-start;
    overflow: hidden;
}

.frontpage-flexbox > li > article.column > .text {
    width: 100%;
    display: flex;
    gap: 0.5rem;
    flex-direction: column;
    align-items: flex-start;
}
.frontpage-flexbox > li > article.column > .image {
    background-color: #fff;
    min-height: 1rem;
}


.frontpage-flexbox .text .info .datum,
.frontpage-flexbox .text .info .labels {
    display: inline-block;
}

.frontpage-flexbox .text .info .datum {
    font-family: Barlow;
    font-size: 2rem;
    color: #555;
    font-weight: normal;
    margin: 0rem 1rem 0.8rem 0;
    padding: 0;
    line-height: 1em;
    text-transform: uppercase;
}

.frontpage-flexbox div,
.frontpage-flexbox p,
.frontpage-flexbox h1,
.frontpage-flexbox h2,
.frontpage-flexbox h3,
.frontpage-flexbox h4 {
    padding: 0;
    margin: 0;
    max-width: 100%;
}
.frontpage-flexbox h1,
.frontpage-flexbox h2,
.frontpage-flexbox h3,
.frontpage-flexbox h4 {
    line-height: 0.9em;
}

.frontpage-flexbox .media--type-image {
    max-width: 100%;
}

.frontpage-flexbox > li:first-child {
    flex-basis: 50%;
}

.frontpage-flexbox > li > article > .text {
    padding: 0 1rem 1rem;
}

@media (max-width: 1100px) {
    .frontpage-flexbox > li {
        flex-basis: 35%;
        max-width: 45vw;
    }
}

@media (max-width: 850px) {
    .frontpage-flexbox > li {
        flex-basis: 100%;
        max-width: 100%;
    }
    .frontpage-flexbox li .views-field-title {
        hyphens: auto;
        font-size: 8vw;
    }
    .frontpage-flexbox .text .inleiding {
        max-width: 100%;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        line-clamp: 3;
    }
}

/* wrapper div for grouping text fields in a view */
.frontpage-flexbox .views-field-nothing {
    padding: 0 1rem 1rem 1rem;
    width: 100%;
}

.frontpage-flexbox li h1,
.frontpage-flexbox li h2 {
    font-family: Passion_One;
    font-size: 2.5rem;
    line-height: 0.9em;
    hyphens: auto;
    hyphenate-limit-chars: 10 4 4;
}

.frontpage-flexbox li .views-field-title > span > a {
    color: #3a3a3a;
    text-decoration: none;
}

.frontpage-flexbox li > div.views-field-field-tags {
    align-self: flex-start;
    margin-top: 0.7rem;
    display: block;
}

/* BUTTONS in flexbox */
.frontpage-flexbox a.button,
.frontpage-flexbox .field--name-field-button a,
.frontpage-flexbox .webform-button--submit,
.frontpage-flexbox .views-field-field-button a {
    align-self: flex-end;
    padding: 0.8rem 1rem;
/*    border-bottom-right-radius: 1rem;*/
}












/*///////*/
/* MEDIA */
/*///////*/

.paragraph.paragraph--type--media {
    max-width: unset;
}

.media .field--name-field-copyright-info {
    font-family: Barlow_Condensed;
    font-weight: normal;
    font-size: 1rem;
    text-transform: uppercase;
    z-index: 2;
    padding: 0.5rem 0.8rem 0.5rem;
    margin: 0 0 0 0;
    float: right;
    color: #333;
    transition: background-color 0.5s, border 0.5s;
}
.media .field--name-field-copyright-info:hover,
.media .field--name-field-copyright-info:active {
    background-color: #ccc;
}

.media .field--name-field-copyright-info > p,
.media .field--name-field-copyright-info > p > a {
    text-decoration: none;
    color: #333;
    padding: 0;
    margin: 0;
}

.field--name-field-image img,
.field--name-field-media-image img,
.views-field-field-image img,
.image-style-afbeelding-freeform-fill {
    /*max-width: 100%;*/
    width: 100%;
    object-fit: cover;
    object-position: center;
    height: auto;
    vertical-align: top;
}

/* images laten aansluiten op omliggende paragraphs */
.paragraph--type--media .field--name-field-media-image,
.paragraph--type--afbeelding-volledige-breedte {
    margin-top: -2rem;
    margin-bottom: 0;
}

/* kleine images laten fitten met breedte omliggende paragraphs */
.paragraph--type--media .media--view-mode-max-1600-x-1600,
.paragraph--type--media .media--view-mode-horizontaal-gemiddeld-1000-x-500 {
    width: 59vw;
    max-width: 100%;
}


/* grote images groot laten zijn */
.paragraph .media--view-mode-max-2600-x-2600 {
    max-width: 100%;
    width: 100%;
}
.paragraph.paragraph--type--afbeelding-galerij {
    max-width: unset;
}

.paragraph--type--afbeelding-galerij > .field--name-field-media {
    width: calc(100vw - 80px - 2rem);
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: calc(-50vw + 40px + 1rem);
    margin-right: calc(-50vw + 40px + 1rem);
    clear: both;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 1rem;
}

.paragraph--type--afbeelding-galerij > .field--name-field-media > .field__item {
    flex-grow: 1;
    position: relative;
}

.paragraph--type--afbeelding-galerij > .field--name-field-media .field--name-field-media-image {
    height: 30vh;
}

.paragraph--type--afbeelding-galerij > .field--name-field-media .field__item img {
    height: 100%;
    /*min-height: 100%;*/
    /*min-width: 100%;*/
    object-fit: cover;
    vertical-align: bottom;
}

.paragraph--type--afbeelding-galerij .media .field--name-field-copyright-info {
    position: absolute;
    right: 0;
    bottom: 0;
    display: none;
}

.paragraph--type--afbeelding-galerij .media--view-mode-galerij:hover img {
    filter: brightness(70%);
}
.paragraph--type--afbeelding-galerij .media.media--view-mode-galerij:hover .field--name-field-copyright-info {
    display: block !important;
    background-color: #ccc;
}

@media (max-width: 850px) {
    .paragraph--type--afbeelding-galerij > .field--name-field-media,
    .media--view-mode-letterbox-2000-x-500 img,
    .media--view-mode-max-2600-x-2600 img {
        margin-left: -50vw;
        margin-right: -50vw;
        width: 100vw;
        max-width: unset;
    }
    .paragraph--type--media .media--view-mode-max-1600-x-1600,
    .paragraph--type--media .media--view-mode-horizontaal-gemiddeld-1000-x-500 {
        max-width: unset;
        min-width: unset;
        width: unset;
    }
}
@media (max-aspect-ratio: 1/1) {
    .paragraph--type--afbeelding-galerij > .field--name-field-media .field--name-field-media-image {
        height: 15vh;
    }
    .paragraph--type--afbeelding-galerij > .field--name-field-media {
        gap: 0.5rem;
    }
    .paragraph--type--afbeelding-galerij .field--name-field-copyright-info {
        font-size: 0.8rem;
    }

}













/*///////////////*/
/* CONTENT TYPES */
/*///////////////*/

/* ARTICLE */

@media (max-width: 850px) {
    .media--view-mode-banner-blur-2000-x-700 img,
    .va-spacer, {
        min-height: 50vh;
    }
    body.page-node-type-pagina {
        max-width: 100vw;
        overflow-x: hidden;
    }
}

/* ARTICLE: CONTEXT */
.article_context {
    float: left;
    position: relative;
    background-color: #00c47c;
    color: white;
    width: 60%;
    max-width: 25rem;
    padding: 2rem;
    margin: 1rem 2rem 2rem 0;
}
.article_context h1, .article_context h2, .article_context h3, .article_context p {
    margin: 0 0 1rem 0;
    max-width: 100%;
}
.article_context h1, .article_context h2, .article_context h3 {
    line-height: 1em;
}
@media (max-width: 850px) {
    .article_context {
        padding: 1rem;
    }
    .article_context h2 {
        hyphens: auto;
        font-size: 3rem;
    }
}




/* CONTENT TYPE: DOSSIERPAGINA */
body.page-node-type-longread {
    background-color: #aaa;
}
.page-node-type-longread .va-spacer {
    margin-bottom: 0;
}
.page-node-type-longread #block-vredesactie-hoofdnavigatie {
    position: sticky;
    top: 0;
    z-index: 100;
}   

.paragraph--type--body-text table p {
    margin: 0;
    padding: 0;
}
.paragraph--type--body-text table td {
    padding: 0.3rem;
}
.paragraph--type--body-text table {
    overflow-x: scroll;
    max-width: 100%;
    display: block;
}

.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu {
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: calc(100vw - 80px);
    position: relative;
    left: 50%;
    right: 50%;
    margin: 0 calc(-50vw + 40px) 0;
    clear: both;
    padding: 0;
    background-color: #333;
}
.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu > li.menu-item {
    font-family: Barlow_Condensed;
    background-color: #333;
}
.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu > li.menu-item:hover {
    background-color: #444;
}
.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu > li.menu-item a {
    display: block;
    padding: 1rem 2rem;
    font-size: 1.5rem;
    text-transform: uppercase;
    text-decoration: none;
    color: #eee;
}
.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu > li.menu-item--active-trail,
.page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu > li.menu-item--active-trail:hover {
    font-weight: bold;
    background-color: #00c47c;
    color: #fff;
}

.page-node-type-longread .field--name-field-inleiding {
    width: calc(100vw - 80px);
    position: relative;
    left: 50%;
    right: 50%;
    margin: 0 calc(-50vw + 40px) 0;
    clear: both;
    background: white;
    padding: 3rem;
}
.page-node-type-longread .field--name-field-inleiding p {
    max-width: 59vw;
    font-size: 1.2em;
}
.page-node-type-longread .paragraph--type--body-text {
    background-color: white;
    line-height: 150%;
    font-size: 1.3rem;
    padding: 3rem 3rem 6rem;
    min-width: 700px;
    width: 59vw;
    background-color: #fff;    
}
.page-node-type-longread .paragraph--type--body-text p {
    margin-left: 20%;
}
.page-node-type-longread .paragraph--type--body-text h1,
.page-node-type-longread .paragraph--type--body-text h2,
.page-node-type-longread .paragraph--type--body-text h3 {
    line-height: 0.9em;
}
.page-node-type-longread .paragraph--type--body-text .section-table {
    display: flex;
    padding-bottom: 0;
    flex-direction: row;
}
.page-node-type-longread .paragraph--type--body-text .section-table table.stemgedrag {
    min-width: 50%;
}
.page-node-type-longread .stemgedrag tr svg {
    height: 1.5rem;
    width: 1.5rem;
}
.page-node-type-longread .stemgedrag tr:nth-child(odd), .stemgedrag tr:last-child {
    background-color: #eee;
}

.page-node-type-longread .paragraph--type--media,
.page-node-type-longread .paragraph--type--afbeelding-volledige-breedte {
    margin-bottom: 0;
}

/*.page-node-type-longread .paragraph--type--afbeelding-volledige-breedte .field--name-field-afbeelding {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin: 0;
    top: -6rem;
    margin-bottom: -9rem;
    z-index: -1;
}

.page-node-type-longread .paragraph--type--afbeelding-beperkte-breedte .field--name-field-afbeelding {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin: 0;
}
.page-node-type-longread .paragraph--type--afbeelding-volledige-breedte img, .paragraph--type--afbeelding-beperkte-breedte img {
    position: relative;
    object-fit: cover;
    object-position: 50% 50%;
}
*/.page-node-type-longread .paragraph--type--body-text.kader {
    background-color: #3a3a3a;
    font-size: 1rem;
    color: #ccc;
}
.page-node-type-longread .paragraph--type--body-text.kader li {
    margin-bottom: 0.5rem;
}

.page-node-type-longread .paragraph--type--body-text.kader a {
    color: #fff;
    text-decoration: none;
    font-family: Barlow_Condensed;
    text-transform: lowercase;
    letter-spacing: 0.1em;
}

@media (max-width: 850px) {
    .page-node-type-longread #block-vredesactie-hoofdnavigatie {
        top: 80px;
    }
    .page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu {
        flex-direction: column;
        width: 100vw;
        margin: 0 -50vw 0 -50vw;
    }
    .page-node-type-longread #block-vredesactie-hoofdnavigatie ul.menu a {
        max-width: 100%;
        text-wrap: nowrap;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .page-node-type-longread .field--name-field-inleiding {
        width: 100vw;
        margin: 0 calc(-50vw) 6rem;
        padding: 2rem;
    }
    .page-node-type-longread .field--name-field-inleiding p,
    .page-node-type-longread .paragraph--type--body-text,
    .page-node-type-longread .paragraph--type--body-text p {
        min-width: unset;
        width: 100%;
        max-width: unset;
        margin-left: 0; 
        margin-right: 0;
    }
    .page-node-type-longread .paragraph--type--body-text {
        padding: 2rem;
    }

}







/*////////////*/
/* PARAGRAPHS */
/*////////////*/

body.page-node-type-pagina .field--name-field-paragraphs > .field__item .field--name-field-titel {
    font-family: Passion_One;
    font-size: 3.5rem;
    font-weight: normal;
    position: relative;
    padding: 1.3rem 1.6rem;
    line-height: 1em;
    margin: 2rem;
    margin-left: 0;
    z-index: 20;
}

body.page-node-type-pagina .field--name-field-paragraphs > .field__item:nth-child(odd) .field--name-field-titel {
    padding-left: 2000px;
    margin-left: -2000px;
}
body.page-node-type-pagina .field--name-field-paragraphs > .field__item:nth-child(even) .field--name-field-titel {
    padding-right: 2000px;
    margin-right: -2000px;
}
.paragraph {
    /*margin: 4rem 1rem;*/
    max-width: 59vw;
    margin-bottom: 2rem;
}
@media (max-width: 850px) {
    .paragraph {
        min-width: unset;
        max-width: unset;
        width: 100%;
    }
}
/*
@media (min-width: 1100px) {
    .paragraph {
        margin: 4rem 10vw;
    }
}
@media (min-width: 1920px) {
    .paragraph {
        margin: 4rem 15vw;
    }
}
@media (min-width: 850px) {
    .paragraph {
        margin: 1rem 0;
    }
}*/

body.page-node-type-pagina .field--name-field-paragraphs .field--name-field-titel {
    display: inline-block;
    margin: 0 1rem;
    padding: 0.1em 0.2em 0.1em;
    font-size: 3rem;
    line-height: 1.6em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    color: #f7f6f2;
    background: #00c47c;
    font-weight: normal;
}
@media (max-width: 850px) {
    body.page-node-type-pagina .field--name-field-paragraphs .field--name-field-titel {
        line-height: 0.9em;
        padding: 0.4em;
        font-size: 2.5rem;
    }
}












/*/////////////////*/
/* PARAGRAPH TYPES */
/*/////////////////*/

/* PARAGRAPH TYPE: QUOTE */
.paragraph.paragraph--type--quote {
    padding: 2rem;
    margin: 3rem 0 0 2rem;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
    font-size: 2rem;
    color: #00c47c;
    width: 40%;
    min-width: unset;
    float: right;
}
@media (max-width: 850px) {
    .paragraph.paragraph--type--quote {
        hyphens: auto;
        width: 50%;
    }
}
.paragraph--type--quote p {
    text-align: right;
    margin: 0;
}
body.page-node-type-longread .paragraph--type--quote p {
    background-color: #fff;
}





/* PARAGRAPH TYPE: GELINKTE INHOUD */

.paragraph--type--link-inhoud .field--name-field-referentie {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.paragraph--type--link-inhoud .field--name-field-titel {
    font-size: 2.5rem;
    color: #3a3a3a;
    font-weight: bold;
}
.paragraph--type--link-inhoud .field--name-field-referentie .field__item .article {
    display: flex;
    flex-direction: row;
    align-content: stretch;
}
.paragraph--type--link-inhoud .field--name-field-copyright-info {
    display: none;
}

.paragraph--type--link-inhoud {
    display: flex;
    gap: 2rem;
    flex-direction: column;
}

article.link-inhoud {
    background-color: #fff;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    align-items: stretch;
}

article.link-inhoud .image {
    flex-shrink: 0;
    flex-grow: 0;
    width: 20rem;
    overflow: hidden;
}

article.link-inhoud .image div,
article.link-inhoud .image article {
    height: 100%;
}


article.link-inhoud .image img {
    object-fit: cover;
    min-width: 100%;
    min-height: 100%;
}

article.link-inhoud .text {
    padding: 1rem;
    display: flex;
    flex-direction: column;
}

article.link-inhoud .text h2 {
    margin: 0 0 0.5rem 0;
    font-size: 2.5rem;
    color: #3a3a3a;
    line-height: 1em;
}
article.link-inhoud .text p {
    max-width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    line-clamp: 3;
}    

@media (max-width: 850px) {
    .paragraph--type--link-inhoud {
        max-width: 100%;
    }
    article.link-inhoud {
        flex-direction: column;
    }
    article.link-inhoud .image {
        height: unset;
        max-height: 20vh;
        width: 100%;
    }
    article.link-inhoud .image img {
        max-height: unset;
        width: 100%;

    }
    article.link-inhoud .text {
        padding-top: 0;
    }
}




/* PARAGRAPH TYPE: RECENTE INHOUD (VIEW) */

.paragraph.paragraph--type--recente-inhoud {
    max-width: unset;
}

.paragraph--type--recente-inhoud .more-link {
    display: inline-block;
    margin-top: 1rem;
}







/* PARAGRAPH TYPE: SPOTLIGHT */

.paragraph--type--spotlight {
    max-width: unset;
    background-color: #9ef4d5;
    color: #3a3a3a;
    display: flex;
    gap: 1rem;
    flex-direction: column;
    align-items: stretch;
    border: 0.5rem solid #00c47c;
    overflow: hidden;
}

.paragraph--type--spotlight .text {
    padding: 2rem;
    font-size: 1em;
}

.paragraph--type--spotlight .field--name-field-media-image img {
    object-fit: cover;
    height: 100%;
}
.paragraph--type--spotlight .media--view-mode-banner-blur-2000-x-700 {
    width: 100%;
    position: relative;
    left: 0;
    right: 0;
    margin: 0;
    clear: both;
}

.paragraph--type--spotlight h2 {
    margin: 0 auto 1rem;
}
.paragraph--type--spotlight a {
    color: white;
    text-align: center;
}






/* PARAGRAPH TYPE: FORMULIER */

.paragraph--type--formulier {
    max-width: unset;
    width: 100%;
    float: left;
    color: white;
    background-color: #00c47c;
    font-size: 1.2rem;
    padding: 1rem;
    margin: 1rem 0;
}

.form-item-contactinfo p {
    font-size: 0.8rem;
}

.form-item-contactinfo p a {
    color: white;
    text-decoration: underline;
}

.form-item h1, .form-item h2, .form-item h3, .form-item h4 {
    margin: 0 !important;
}

details.form-wrapper {
    height: auto;
}

details summary {
    margin-bottom: 0.2em;
}

.webform-signature-pad .button {
    padding: 0.3rem 0.5rem !important;
    margin-right: 0.5em;
}

.webform-submission-form > .form-wrapper.webform-actions {
    flex-direction: row;
    margin-bottom: 0 !important;
}

.webform-flexbox {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
}

.webform-flexbox .webform-flex {
    min-width: 8rem;
}

.webform details {
    min-width: 8rem;
}







/* PARAGRAPH TYPE: BODY TEXT */

.paragraph--type--body-text {
    padding-top: 1rem;
    padding-bottom: 2rem;
}

.paragraph--type--body-text > div > *:first-child {
    margin-top: 0;
}

.paragraph--type--body-text.kader {
    background-color: #00c47c;
    padding: 2rem;
    color: #fff;
}

.paragraph--type--body-text > .field--type-text-long {
    line-height: 1.7em;
}

.paragraph--type--body-text > .field--type-text-long > p > a {
    color: inherit;
    font-weight: bold;
    /* margin: 0 0.3em; */
    text-decoration: underline;
}





/* PARAGRAPH TYPE: TEKSTBOX MET BACKGROUND IMAGE (HERO) */

.paragraph--type--tekstbox-met-background-image {
    max-width: unset;
    background-size: cover;
    background-position: center;
    height: auto;
    min-height: 50vh;
    height: 100%;
    padding: 0;
} 

.paragraph--type--tekstbox-met-background-image .text {
    padding: 8rem 4rem 4rem;
    color: white;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
@media (min-width: 1100px) {
    .paragraph--type--tekstbox-met-background-image .text {
        padding: 8rem 0 4rem 10vw;
    }
    .paragraph--type--tekstbox-met-background-image {
        min-height: 40vh;
    }
}
@media (min-width: 1920px) {
    .paragraph--type--tekstbox-met-background-image .text {
        padding: 8rem 0 4rem 15vw;
    }
    .paragraph--type--tekstbox-met-background-image {
        min-height: 30vh;
    }
}
.paragraph--type--tekstbox-met-background-image .field--name-field-titel {
    font-family: Passion_One;
    font-size: 3rem;
    line-height: 0.9;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0;
    color: white !important;
    display: inline-block;
    padding: 1.5rem;
    box-shadow: 0 0 0 0 #00c47c;
    background-color: #00c47c;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

.paragraph--type--tekstbox-met-background-image .field--name-field-tekst {
    margin: 0;
    font-size: 1.5rem;
    color: white;
    text-shadow: black 0 0 3px;
    padding: 1rem 0;
    min-width: 10em;
    max-width: 50rem;
}





/* PARAGRAPH TYPE: AGENDA */

.view-agenda ul {
    list-style-type: none;
    display: flex;
    flex-direction: column;
    width: 50vw;
    padding: 0;
    margin: 0;
}

.view-agenda li {
    border-top: solid 2px #ccc;
    background-color: initial;
    color: #aaa;
    font-weight: normal;
}

.view-agenda ul.agenda-list > li:first-of-type {
    border-top: none;
}

.view-agenda .verleden ul.agenda-list > li:first-of-type {
    border-top: solid 2px #ccc;
}

.view-agenda li a,
.view-agenda .view-empty li {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 1rem;
    font-family: Barlow_Condensed;
    font-size: 1.6rem;
    line-height: 120%;
    color: #3a3a3a;
    text-decoration: none;
}
.view-agenda li a:hover {
    background: linear-gradient(90deg, rgba(255,255,255,0), #fff 20%, rgba(255,255,255,0));
}

.view-agenda li .datum {
    flex-shrink: 0;
    width: 6rem;
}


.view-agenda.verleden li a {
    color: #aaa;
}

.view-agenda.verleden li a .titel {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media (max-width: 850px) {
    .view-agenda ul {
        width: 100%;
    }
    .view-agenda li .titel {
        gap: 1rem;
        hyphens: auto;
    }
}






/* PARAGRAPH TYPE: VIDEO */






/* PARAGRAPH TYPE: SPECIAL CASES */

.nieuws-lijst .frontpage-flexbox li {
    max-width: 1000px;
}

.nieuws-lijst .frontpage-flexbox li .views-field-title {
    font-size: 1.8rem;
    font-weight: normal;
}

.nieuws-lijst .frontpage-flexbox li .views-field-field-image {
    margin-top: -1rem;
}

.nieuws-lijst .frontpage-flexbox li .inleiding {
    max-width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    line-clamp: 5;
}

body.path-frontpage .view-doe-mee {
    background-color: #3a3a3a;
    padding: 5rem 30vw 4rem;
    margin: -5rem -30vw -6rem;
}
.view-doe-mee .frontpage-flexbox {
    align-items: flex-start;
}

.view-doe-mee li article {
    background-color: #00c47c;
    color: white;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 1rem;
}

.field--name-field-overzicht .frontpage-flexbox li:nth-child(1),
.field--name-field-overzicht .frontpage-flexbox li:nth-child(2) {
    align-self: flex-end;
}

.view-doe-mee .frontpage-flexbox li h2 a {
    color: white;
}

.view-doe-mee .frontpage-flexbox li .views-field-title > span > a {
    color: white;
}

.frontpage-flexbox .paragraph--type--body-text {
    width: 100%;
}

.frontpage-flexbox .paragraph--type--formulier {
    width: 100%;
}


.view-doe-mee a.button a {
    position: relative;
    margin: 1rem -1rem -1rem 0;
}

.view-doe-mee .field--name-field-button a:hover,
.view-doe-mee .webform-button--submit:hover {
    color: #00c47c;
    background-color: white;
}







/**************/
/* TEXT TYPES */
/**************/

/* DATUMS */
body.page-node-type-article .info-date-tags {
    margin: 2rem 0;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    align-items: center;
    width: 100%;
}
body.page-node-type-agenda-item .field--name-field-datum,
body.page-node-type-article .datum-article {
    font-size: 2.3rem;
    font-family: Barlow_Condensed;
    font-weight: normal;
    color: #3a3a3a;
    text-wrap: nowrap;
    line-height: 1em;
    padding-bottom: 0.1em;
}
body.page-node-type-article .datum-article {
    display: inline;
}
body.page-node-type-agenda-item .field--name-field-datum {
    margin: 2rem 0 1rem;
}
body.page-node-type-article .labels {
    display: inline-flex;
    flex-direction: row;
    gap: 1rem;
    align-items: center;
}


/*************/
/* FOOTNOTES */
/*************/

ul.footnotes {
    border-color: inherit;
    padding-top: 0.5em;
    font-family: Barlow_Condensed;
    line-height: 120%;
}

ul.footnotes p {
    margin: 0.4em 0;
}

ul.footnotes li.footnotes__item-wrapper {
    margin: 1em 0;
}

a.footnote__citation {
    font-weight: bold;
    color: inherit;
    text-decoration: none;
    padding: 0.1em 0.4em 0.3em;
    margin: -0.2em 0em -0.2em -0.3em;
    background-color: rgba(100, 100, 100, 0.3);
    border-radius: 1em;
}

a.footnotes__item-backlink {
    font-weight: bold;
    text-decoration: none;
}

.footnote__citation a,
.paragraph--type--body-text .field--type-text-long a {
    color: inherit;
}


/******************/
/* EXTERNAL LINKS */
/******************/
@media (max-width: 850px) {
    .extlink-nobreak {
        white-space: wrap;
    }
}



/* BODY TEXT - SIDENOTE */
.sidenote {
    position: relative;
    top: -1.3rem;
    float: right;
    clear: both;
    color: #fff;
    width: 20vw;
    margin-right: calc(-20vw - 3rem);
    margin-bottom: 1rem;
    display: inline;
    font-size: 1rem;
    font-style: italic;
    line-height: 1.25;
    -webkit-text-decoration-line: none;
    text-decoration-line: none
}
.sidenote svg {
    line-height: 0;
}
.sidenote > .box {
    position: relative;
    margin: 0;
    text-decoration: none;
    transition: margin 0.3s;
}
.sidenote .arrow {
    position: absolute;
    left: -2rem;
    width: 2rem;
    height: 100%;
}
.sidenote .arrow svg {
    width: 2rem;
    height: 100%;
    fill: #aaa;
}
.sidenote .icon {
    position: absolute;
    left: -1rem;
    width: 1.5rem;
    height: 100%;
    z-index: 1;
}
.sidenote .icon svg {
    width: 1.5rem;
    height: 100%;
    fill: #fff;
}
.sidenote .content {
    position: relative;
    width: 100%;
    min-height: 4rem;
    padding: 1rem;
    background-image: linear-gradient(to right, #aaa, #aaa);
    left: 0;
}
.sidenote .content .text {
    color: #fff;
}
.sidenote-link {
        position: static;
}
.dropdown-label {
    color: #00c47c;
    text-decoration: none;
    background-color: none;
    padding: 0 0.3em 0.2em;
    margin: 0 -0.2em -0.2em;
    border: 0px solid;
/*    border-radius: 1em;*/
    transition: background-color 0.3s;
    border-radius: 1em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.sidenote-link:hover .dropdown-label {
    color: #267F5F;
    background-color: rgba(100, 100, 100, 0.1);
}
.sidenote-link:hover .sidenote .box {
    margin-left: -1rem;
    margin-right: 1rem;
    text-decoration: underline;
}

.dropdown, .sidenote-link input[type=checkbox], .dropdown-text, .dropdown-arrow {
    display: none;
    transition: border 0.3s;
}
.dropdown-text {
    height: 0;
    padding: 0.5rem 2rem;
    margin: 1rem;
    background-color: #eee;
    font-style: italic;
    border: 0px solid #ddd;
/*    border-radius: 1rem;*/
    transition: height 0.3s;
    color: #267F5F;
}
.section-table .dropdown-text, .section-table .sidenote-link:hover .dropdown-arrow, .section-table .sidenote-link:active .dropdown-label, section-table .sidenote-link:active .dropdown-arrow {
    background-color: #fff;
}






/* DOSSIERS */

.dossier-lijst .frontpage-flexbox li {
    background-color: #3a3a3a;
    color: white;
}

.dossier-lijst .frontpage-flexbox .views-field-nothing {
    padding: 0 2rem 2rem 2rem;
}

.dossier-lijst .views-field-field-button a {
    margin-right: -1rem;
    margin-bottom: -1rem;
}


/* /DOSSIERS */






/*////////////*/
/* TAXONOMIES */
/*////////////*/

.views-field-field-tags .field-content {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.views-field-field-tags .field-content a,
.field--name-field-tags a {
    display: block;
    background: #3a3a3a;
    color: white;
    text-decoration: none;
    padding: 0.2rem 0.5rem;
    text-transform: uppercase;
    font-family: 'Barlow_Condensed', sans-serif;
    font-weight: bold;
    font-size: 1.2rem;
}



/*///////////////*/
/* SPECIAL NODES */
/*///////////////*/

/* FRONTPAGE */

body.path-frontpage .frontpage-flexbox .datum .year {
    display: none;
}

/*///////////*/
/* OLD STUFF */
/*///////////*/

ul.pager a {
    text-indent: -99999px;
    background-image: url('/sites/default/files/laad_meer.svg');
    background-repeat: no-repeat;
    width: 107px;
    height: 81px;
    margin: auto !important;
    display: block;
}

nav.pager {
    margin-top: 4rem;
}


/* ARTICLE PAGE CONTENT */

body.page-node-type-article .field--name-body,
body.page-node-type-article .field--name-field-tags,
body.page-node-type-artikel-vorige-site .field--name-field-d7tags,
#block-voeterblok,
body.page-node-type-article .field--name-field-introductiezin {
    max-width: 1290px;
    margin: auto;
    clear: left;
}

.field--name-field-tags,
.field--name-field-d7tags {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1rem auto;
    width: 100%;
}

body.page-node-type-pagina .field--name-field-titel {
    display: inline-block;
}

body.page-node-type-agenda-item .va-spacer,
body.page-node-type-article .va-spacer,
body.page-node-type-longread .va-spacer,
body.page-node-type-pagina .va-spacer,
body.page-civicrm .va-spacer {
    display: none;
}

.va-spacer {
    margin-bottom: 3em;
}

body.page-node-type-article .field--name-field-introductiezin {
    color: #00c47c;
}

body.page-node-type-article .field--name-field-introductiezin {
    padding-top: 2em;
    border-top: 3px solid black;
    margin-top: 9em;
}

body.page-node-type-artikel-vorige-site article .field--name-body {
    padding-top: 2em;
    border-top: 3px solid black;
    margin-top: 3em;
}

/* with paragraphs */
body.path-articles #block-vredesactie-content .view-content {
    max-width: 1290px;
    margin: auto;
    padding-right: 90px;
    width: 90%;
}


.va-spacer {
    height: 30vw;
}

.va-spacer,
.image-style-article-banner,
.paragraph--type--afbeelding-volledige-breedte img {
    background: #1d1d1b;
    object-fit: cover;
    object-position: center;
    width: 100%;
    vertical-align: top;
}

.paragraph--type--afbeelding-volledige-breedte,
.media--view-mode-letterbox-2000-x-500,
.media--view-mode-banner-blur-2000-x-700,
.paragraph--type--tekstbox-met-background-image,
.va-spacer {
    width: calc(100vw - 80px);
    max-width: unset;
    min-width: unset;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: calc(-50vw + 40px);
    margin-right: calc(-50vw + 40px);
    clear: both;
}


@media (max-width: 850px) {
    .paragraph--type--afbeelding-volledige-breedte,
    .media--view-mode-letterbox-2000-x-500,
    .media--view-mode-banner-blur-2000-x-700,
    .paragraph--type--tekstbox-met-background-image,
    .va-spacer {
        width: calc(100vw);
        margin-left: calc(-50vw);
        margin-right: calc(-50vw);
    }
    .va-spacer,
    .image-style-article-banner {
        min-height: 40vh;
        /*margin-top: 80px;*/
    }
    .media--view-mode-letterbox-2000-x-500 .field--name-field-media-image {
        /*min-height: 30vh;*/
     }

}


body.page-node-type-article .paragraph--type--afbeelding-volledige-breedte img {
    margin: 3em 0 3em 0;
}

body.page-node-type-article .field--name-field-image img,
body.page-node-type-article .paragraph--type--afbeelding-volledige-breedte img {
    width: 100%;
    height: auto;
}

body.page-node-type-article .field--name-field-inleiding,
body.page-node-type-pagina .field--name-field-inleiding {
    font-family: 'Barlow', sans-serif;
    font-size: 2rem;
}

body.page-node-type-article .field--name-field-gepubliceerd-in {
    color: #00c47c;
}



body.page-node-type-article article h2,
body.page-node-type-artikel-vorige-site article h2,
body.page-node-type-agenda-item article h2 {
    font-family: 'Passion_One', sans-serif;
}



/* /with paragraphs */

/* /ARTICLE PAGE CONTENT */




/* SEARCH PAGE */
body.path-articles .view-empty {
    /* display: none; */
    max-width: 1290px;
    margin: auto;
    font-size: 1.2rem;
    width: 90%;
}

body.path-articles form {
    width: 75vw;
    margin: auto;
}

body.path-articles #block-vredesactie-page-title {
    display: none;
}

body.path-articles .form--inline .form-item {
    margin: auto;
    float: none;
}

body.path-articles .view-filters {
    padding-bottom: 30vh;
    background: #1d1d1b;
    padding-top: 30vh;
    margin-bottom: 5em;
}

#views-exposed-form-artikels-page-4 input[type=text] {
    border-radius: 0;
    border: none;
    padding: 10px;
    background: #f7f6f2;
    height: 65px;
    width: 100%;
}

#views-exposed-form-artikels-page-4 label {
    display: none;
}

#views-exposed-form-artikels-page-4 .form--inline {
    position: relative;
}

#views-exposed-form-artikels-page-4 .form-actions {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    padding: 0;
    margin: 0;
}

#views-exposed-form-artikels-page-4 .form-actions input {
    height: 100%;
    background: #00c47c;
    color: white;
    text-transform: uppercase;
    font-family: 'Passion_One', sans-serif;
    padding: 1em 2em;
    border: none;
}

/* /SEARCH PAGE */

/* NON-FRONT, NON-ARTICLE, NON-SEARCH PAGES */
body:not(.page-node-type-article):not(.path-articles):not(.path-frontpage):not(.page-node-type-artikel-vorige-site):not(.page-node-type-pagina):not(.page-node-type-longread):not(.page-civicrm) section#content {
    /* padding-top: 8em; */
    /*max-width: 1290px;
    margin: auto;*/
    /* width: 90%; */
}

body:not(.page-node-type-article):not(.path-articles):not(.path-frontpage):not(.page-node-type-pagina):not(.page-civicrm):not(.page-node-type-agenda-item) .va-spacer {
    display: block;
}

/* /NON-FRONT, NON-ARTICLE, NON-SEARCH PAGES */

/* FORMS */

input[type=text],
input[type=email],
textarea {
    /* font-size: 1.4em; */
}



/* Contacteer ons */
#form_contact {
    background: #f7f6f2;
}

#form_contact div.form-item,
#en_form_contact div.form-item {
    margin-bottom: 2em;
}

#form_contact input[type=text],
#form_contact input[type=email],
#form_contact textarea,
#en_form_contact input[type=text],
#en_form_contact input[type=email],
#en_form_contact textarea {
    border-radius: 0;
    border: 2px solid #9b9b9b;
    padding: 10px;
    background: #f7f6f2;
    height: 65px;
    width: 100%;
}

#form_contact textarea,
#en_form_contact textarea {
    height: 200px;
}

#form_contact input[type=submit],
#en_form_contact input[type=submit] {
    background: #1d1d1b;
    border: none;
    color: white;
    padding: 16px;
    text-transform: uppercase;
}

fieldset[id*="edit-knop-en-markup"] {
    border: none;
    text-transform: uppercase;
    font-family: 'Barlow', sans-serif;
}

fieldset[id*="edit-formuliervelden"] {
    border: none;
    padding-left: 0;
}

#edit-kantoorgegevens {
    color: #1d1d1b;
}

/* /Contacteer ons */

/* ezine actiekrant */


div[id*="edit-tekstvelden"] {
    /* #edit-tekstvelden { */
    /* float: left;
  width: 50%; */
    margin-top: 0.45em;
}

/* #edit-rechterkant {
  float: right;
  width: 50%;
} */

@media (min-width: 850px) {
    body.page-node-type-article .field--name-field-inleiding,
    body.page-node-type-pagina .field--name-field-inleiding {
        width: 59vw;
    }

    /* #edit-tekstvelden {
  float: left;
  width: 50%;
  margin-top: 0.45em;
  } */
    div[id*="edit-tekstvelden"] {
        float: left;
        width: 50%;
        margin-top: 0.45em;
    }

    /* #edit-rechterkant {
  float: right;
  width: 50%;
  } */
    div[id*="edit-rechterkant"] {
        float: right;
        width: 50%;
    }

    fieldset[id*="edit-knop-en-markup"] {
        width: 30%;
        float: left;
    }

    fieldset[id*="edit-formuliervelden"] {
        width: 67%;
        float: left;
    }
}

fieldset#edit-nieuwsbrief-actiekrant--wrapper {
    float: left;

}

#edit-actions {
    clear: left;
}

div[id*="edit-adresvelden"] {
    /* #edit-adresvelden { */
    border-top: 2px solid white;
    padding-top: 17px;
}

#blijf-op-de-hoogte div.form-item,
#en_stay-tuned div.form-item {
    margin-bottom: 1em;
}

#blijf-op-de-hoogte div.form-type-email,
#en_stay-tuned div.form-type-email {
    margin-bottom: 2em;
}

div.form-item-straat {
    width: 66%;
    float: left;
}

div.form-item-huisnummer {
    width: 30%;
    float: right;
}

div.form-item-postcode {
    width: 30%;
    float: left;
    clear: left;
}

div.form-item-gemeente {
    width: 66%;
    float: right;
}

#werk-mee-0,
#en_join-us {
    clear: both;
}

.mailto {
    margin-top: 3em;
}

.mailto a {
    float: left;
}

.mailto span {
    margin-top: 1.2em;
    display: block;
    float: left;
    margin-left: 2em;
}

/* /ezine actiekrant */

/* /FORMS */



/* FOOTER */
footer {
    margin: 0;
    padding: 6rem 4rem;
    background-color: white;
    font-family: 'Barlow_Condensed', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.8em;
    clear: both;
    text-align: center;
}

#block-voeterblok > div {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 4rem;
    align-items: center;
    justify-content: center;
}

footer img {
    max-width: 100%;
}

.vlogo {
    position: relative;
}

.footer-logos {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
}

@media (max-width: 850px) {
    .footer-logos {
    }

    .footer-copyright {
    }


}

@media (min-width: 850px) {
    body:not(.page-node-type-article):not(.path-articles):not(.path-frontpage) #block-vredesactie-page-title h1 span {
        line-height: 1.8em;
    }

    footer {
        text-align: left;
    }

    #agenda-items .views-field,
    #en_agenda-items .views-field {
        font-size: 2vw;
    }
}

/* /FOOTER */

/* VARIOUS */
.big_text {
    font-size: 3vw;
    text-transform: uppercase;
    font-family: 'Passion_One', sans-serif;
}


/* /VARIOUS */

@media (min-width: 1400px) {
    .recent_articles_body {
        margin-top: 2em;
        margin-bottom: 2em;
    }
}

@media (min-width: 850px) {
    body.path-articles form {
        width: 45vw;
    }

    section#content,
    footer {
        padding-right: 80px;
    }

    #blijf-op-de-hoogte div.form-type-email,
    #en_stay-tuned div.form-type-email {
        margin-right: 5em;
    }

    div[id*="edit-adresvelden"] {
        /* #edit-adresvelden { */
        margin-right: 5em;
    }

    h1.single-page-title {
        font-size: 3vw;
        font-weight: normal;
    }

    .recent_articles_created {
        font-size: 1.2em;
    }
}

@media (max-width: 850px) {
    #block-hoofdnavigatie ul.menu li a {
        font-size: 1.6em;
    }

    section#content,
    footer {
        margin-right: none;
    }

    #sidebar-second {
        display: none;
    }

    #header-top {
        display: block;
    }

    #block-logo {
        display: none;
    }

    section#content {
        /* #block-vredesactie-content { */
        margin-top: 79px;
    }

}













/*/////////////////////*/
/* CIVI PAGINAS */
/*/////////////////////*/


.page-civicrm-event #crm-container {
    background-color: #ccc;
}
.page-civicrm-event .crm-event-register-form-block {
    margin-top: 4rem;
}



body.page-civicrm-contribute {
    margin: 0;
    font-family: Barlow;
}
.page-civicrm-contribute .tiny {
    width: calc(70% - 20px);
    margin-left: calc(30% + 20px);
    display: block;
    color: #696969;
}

.page-civicrm-contribute #printer-friendly {
    display: none;
}
.page-civicrm-contribute main.outer-wrapper { 
    background-image: url("/sites/default/files/civicrm/persist/contribute/images/uploads/istopthearmstrade.jpg");
    background-position: 10% 50%;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;
    min-height: 100%;
    height: auto;
    margin: 0;
    padding: 6rem 4rem 4rem;
}

/* OVERRIDES */
.page-civicrm #block-vredesactie-page-title {
    display: none;
}
.page-civicrm-contribute #pricesetTotal {
    display: none;
}
.crm-container .crm-section .content {
    margin: 0;
}
.crm-public-footer {
    width: unset;
}

.page-civicrm-contribute #content {
    padding: 3rem;
    margin: 2rem auto 10% auto;
    width: 60vw;
    max-width: 850px;
    background-color: #e8eef0;
    border-radius: 12px;
}

.page-civicrm-contribute #intro_text h1 {
    font-size: 3rem;
    line-height: 100%;
    display: block;
    font-family: Passion_One;
    text-transform: uppercase;
    color: #3a3a3a;
    font-weight: normal;
    margin: 0;
}
.page-civicrm-contribute #crm-main-content-wrapper {
    background-color: none;
}

.page-civicrm-contribute #intro_text {
    padding: 1rem 2rem 2rem 130px;
}


/*.page-civicrm-contribute #priceset-div .label {
    font-size: large;
    width: 120px;
}*/

@media (min-width: 480px) {
    .page-civicrm-contribute .crm-container.crm-public .crm-section .label {
        float: left !important;
        margin-right: 1rem !important;
    }
}
.page-civicrm-contribute .crm-container.crm-public fieldset:not(.collapsed, .crm-inactive-dashlet-fieldset, .af-container-style-pane) {
    box-shadow: none;
}
.page-civicrm-contribute .crm-container table.form-layout-compressed {
    box-shadow: none;
}
.page-civicrm-contribute .crm-container table:not(.crm-inline-edit-form, .crm-table-group-summary) {
    box-shadow: none;
    background-color: unset;
    border: none;
}
.page-civicrm-contribute .crm-container table:not(thead) tr {
    border-bottom: none;
}

.page-civicrm-contribute .price-set-row .crm-form-radio{
    display: none;
}
.page-civicrm-contribute input.crm-form-radio + label,
.page-civicrm-contribute input.crm-form-checkbox + label {
    margin-left: 0;
}


.page-civicrm-contribute #crm-container.crm-public .contribution_amount-content {
    display: flex;
    gap: 1rem;
    justify-content: flex-start;
    align-content: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0;
}

.page-civicrm-contribute #crm-container.crm-public .price-set-row {
    margin: 0;
}


.page-civicrm-contribute #crm-container.crm-public .price-set-row .crm-price-amount-amount,
.page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child label{
/*    float:left;*/
    font-weight: normal;
    font-size: large;
    font-family: Barlow;
    text-transform: uppercase;
    text-align:center;
    line-height: 100%;
    width: 6rem;
    background-color:#ffffff;
    border: 1px solid #00c47c;
    color: #00c47c;
    overflow:auto;
    padding:18px 5px;
    display:block;
}
.page-civicrm-contribute #crm-container.crm-public .price-set-row .highlight .crm-price-amount-amount,
.page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child .highlight label{
background-color:#00c47c;
font-weight: normal;
color: #ffffff;
}
.page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child {
    clear: both;
}

.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group legend {
    margin: none;
}
.page-civicrm-contribute .crm-profile.crm-profile-id-16.crm-profile-name-Naam_en_adres_16 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 2rem 0 0 0;
    margin: 2rem 0 0;
    border-top: 1px solid #9494a5;
}

.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item {
    display: block;
    height: auto;
    margin: 0;
}
.page-civicrm-contribute #priceset-div .label,
.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label {
    text-align: right;
    display: inline-block;
    width: 30%;
}

.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label .crm-marker::before{
    content:'';
    padding: 2px;
}
.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label .crm-marker{
    position: absolute;
    float: right;
    color: gray;
}

.page-civicrm-contribute .contribution_amount-content,
.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .content {
    margin: 0;
    width: 50%;
    float: left;
}
.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .content input {
    max-width: 100%;
}

.page-civicrm-contribute #select2-chosen-1 {
    color: #9494a5;
}

.page-civicrm-contribute .crm-container .huge, input.crm-form-entityref {
    width: 20em;
}
.page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .clear {
    height: 0.5rem;
}
.page-civicrm-contribute .crm-container #crm-submit-buttons button {
    background-color: #00c47c;
    font-size: 1.5rem;
    font-family: Barlow;
    text-transform: uppercase;
    padding: 0.5rem;
    color: white;
    text-shadow: none;
    border-radius: 0;
    border: none;
}
.page-civicrm-contribute #crm-submit-buttons i {
    display: none;
}

@media (min-width: 1600px) {
    .page-civicrm-contribute #content {
        width: 50vw;
    }
    .page-civicrm-contribute #content::before {
        width: 50vw;
    }
}

@media (max-width: 900px) {
    .page-civicrm-contribute #content {
        margin: 0;
        width: 100%;
        padding: 1rem 0;
        border-radius: 0;
    }

    .page-civicrm-contribute main.outer-wrapper {
        padding: 50vh 0 0 0;
    }

    .page-civicrm-contribute #crm-main-content-wrapper {
        padding: 1rem;
    }
    .page-civicrm-contribute #intro_text {
        padding: 0;
    }
    .page-civicrm-contribute #priceset-div {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    .page-civicrm-contribute #priceset span.crm-price-amount-amount {
        width: 120px;
    }
    .page-civicrm-contribute .price-set-row {
        float:left;
    }
    .page-civicrm-contribute .price-set-row .crm-form-radio {
        display: none;
    }
    .page-civicrm-contribute input.crm-form-radio + label,
    .page-civicrm-contribute input.crm-form-checkbox + label {
        margin-left: 0;
    }
    .page-civicrm-contribute #crm-container.crm-public .price-set-row .crm-price-amount-amount,
    .page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child label{
        float: left;
        font-weight: normal;
        font-size: 20px;
        text-align: center;
        width: 120px;
        border: 1px solid #00c47c;
        margin: 0 10px 10px 0;
        background-color: #fff;
        color: #00c47c;
        overflow: auto;
        padding: 18px 5px;
        display: block;
    }
    .page-civicrm-contribute #crm-container.crm-public .price-set-row .highlight .crm-price-amount-amount,
    .page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child .highlight label{
    background-color:#00c47c;
    font-weight: normal;
    color: #fff;
    }
    .page-civicrm-contribute #crm-container.crm-public .price-set-row:last-child {
        clear: both;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group legend {
        display: none;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label {
        display: block;
        margin-right: 20px;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label .crm-marker::before{
        content:'';
        padding: 2px;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label .crm-marker{
        position: absolute;
        float: right;
        color: gray;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .content {
        margin: 0;
        width: auto;
        display: inline;
    }
    .page-civicrm-contribute .crm-container .select2-container .select2-choice {
        line-height: 18px;
        color: #9494a5;
    }
    .page-civicrm-contribute .crm-container .huge, input.crm-form-entityref {
        width: 20em;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .clear {
        height: 0.5rem;
    }
    .page-civicrm-contribute .crm-container #crm-submit-buttons input.crm-form-submit:not(.cancel) {
        background-color: #00c47c;
        font-size: 1.5rem;
        font-family: Barlow;
        text-transform: uppercase;
        padding: 0.5rem;
        color: white;
    }
    .page-civicrm-contribute #crm-submit-buttons {
        width: auto;
    }
    .page-civicrm-contribute #crm-submit-buttons i {
        display: none;
    }
}

@media (max-width: 700px) {
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .content {
        width: 90%;
        display: block;
    }
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .content .crm-form-text {
        width: 100%;
    }
    .page-civicrm-contribute #priceset-div .label,
    .page-civicrm-contribute .crm-public-form-item.crm-group.custom_pre_profile-group .form-item .label {
        text-align: left;
    }
    .page-civicrm-contribute .tiny {
        margin: 0;
    }
    .page-civicrm-contribute .contribution_amount-content {
        width: 100%;
    }

}