@import url("klimaatfamilies_base.css");
@import url("klimaatfamilies_collapsible_content.css");

/* Top */
#top .columns.four a {
    margin-left: 0;
}

#top .logo {
    padding: 10px 0;
    margin: 0;
}

/* Fonts */
h2,
h3,
h4 {
    font-weight: 700;
}

h1 {
    font-weight: 300;
    font-size: 62px;
}

/* Home */
.uitgelicht .itemTitle a {
    font-size: 32px !important;
    line-height: 43px !important;
    text-decoration: none !important;
    font-weight: 700;
}

.uitgelicht .widget .description p {
    display: none !important;
}

.uitgelicht .carousel:not(.widget-users) .updateImage .nailthumb-container {
    height: 350px !important;
}

.updateVideo.twelve.columns {
    margin-bottom: 0;
}

.updateVideo {
    min-height: 215px !important;
}
.widget.carousel:not(.widget-users) .updateImage,
.carousel:not(.widget-users) .updateImage .nailthumb-container {
    min-height: 215px;
}
.carousel:not(.widget-users) .updateImage img.nailthumb-image {
    min-height: 215px;
    top: 0 !important;
}

/* Widgets */
.widget:not(.widget-users).carousel .carouselSlide .itemContentLeft > .row {
    background: transparent;
}

.widget.carousel .carouselSlide .contentBlock {
    margin-top: 8px;
    transition: 0.5s ease;
}

.widget.carousel .carouselSlide .contentBlock:hover {
    transform: translateY(-8px);
}

#content .row .carousel h2.itemTitle a,
#content .row .carousel h3.itemTitle a {
    font-weight: 400;
    text-decoration: none !important;
}

.widget-npres .widget .mettCarousel {
    margin: 0;
}

.widget-npres .widget .carouselSlide {
    padding: 0;
}

.videos h2.widgetTitle {
    margin-bottom: -1% !important;
}

/* Agenda-widget */
.widget .shortDate {
    margin: 1px 15px 0 0;
    padding-top: 9px;
    width: 60px;
    height: 60px;
    background-color: #203b5a;
}

.widget .shortDate .day {
    font-weight: 700;
    font-size: 23px;
}

.widget .eventTitle a,
.widget .row > a {
    color: #203b5a;
    font-weight: 700;
    text-decoration: none !important;
}

.editorButton {
    line-height: 32px;
}

#mainMenu > .row {
    height: 100%;
}

.home #right .widget.widget-events li a {
    word-break: break-word;
}

#top .row .four.columns {
    width: 28%;
}
#top .row .eight.columns {
    margin-left: 0;
    width: 72%;
}

.desktop a.new-search.shortcut {
    height: 46px;
    line-height: 22px;
}
.desktop a.new-search.shortcut::after,
.mobile a.new-search.shortcut::before {
    content: "\e803";
    font-family: "entypo";
    font-size: 22px;
}
.desktop a.new-search.shortcut::after {
    margin-left: 8px;
    position: relative;
    top: 3px;
}
.mobile a.new-search.shortcut::before {
    display: block;
}

#eParticipation.section .item .button.register {
    background: #91d2d3;
    border: 1px solid #91d2d3;
    float: left;
    margin-right: 5px;
    text-align: left;
}
#eParticipation.section .item .button.register:hover {
    background: #007b9b;
    border-color: #007b9b;
}
#eParticipation.section .item .button.register::before {
    content: "";
}
#eParticipation.section .item .button.register input {
    color: #fff;
    padding: 0 16px 0 30px;
}

#eParticipation.item .itemContentRight {
    display: none;
}

#eParticipation .itemVideo iframe[src*="vimeo.com"] {
    background-color: #fff;
}

blockquote p:first-of-type::before {
    content: "";
    height: 0;
}
.webGuidelines blockquote p {
    color: #007b9b;
    font-weight: 700;
}
.webGuidelines blockquote {
    border-top: 7px solid #007b9b;
    border-bottom: 3px solid #007b9b;
    padding: 30px 0;
}

/* Boxes */
.box.wide {
    position: relative;
    z-index: 2;
}
.box.wide:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    right: 50%;
    width: 100vw !important;
    height: 100%;
    z-index: -1;
}
.box.wide.light:before {
    background-color: rgba(159, 208, 210, 0.15);
}
.box.wide.blue:before {
    background-color: #91d2d3;
}
.box.wide.darkblue:before {
    background-color: #007b9b;
}
.box.wide.lightblue:before {
    background-color: #f1f8f8;
}
.box.blue a,
.box.blue h1,
.box.blue h2,
.box.blue h3,
.box.blue h4,
.box.blue h5,
.box.blue h6,
.box.darkblue a,
.box.darkblue h1,
.box.darkblue h2,
.box.darkblue h3,
.box.darkblue h4,
.box.darkblue h5,
.box.darkblue h6 {
    color: #fff;
}

/* Buttons */
#eParticipation.section .item .button.register,
.volksvertegenwoordiger #eParticipation.section .item .button.register,
.editorButton:not(.secondary):not(.outline),
.webGuidelines .customButton:not(.secondary):not(.outline),
.newhome .widget-type-65.carousel .carouselSlide a.readMore,
.volksvertegenwoordiger .items .item a.readMore {
    border: 1px solid #233c5a;
    border-radius: 50px;
}
.newhome .widget-type-65.carousel .carouselSlide a.readMore,
.volksvertegenwoordiger .items .item a.readMore,
html.volksvertegenwoordiger #eParticipation.section .item .button.register input {
    color: #233d5a;
    font-size: 16px;
    font-weight: 600;
    line-height: 28px;
    padding: 0 16px 4px 16px;
    text-decoration: none;
}
html.volksvertegenwoordiger #eParticipation.section .item .button.register input {
    line-height: 32px;
    margin-left: 0;
    padding: 0 0 2px 16px;
}
#eParticipation.section .item .button.register:hover,
.volksvertegenwoordiger #eParticipation.section .item .button.register:hover,
.editorButton:not(.secondary):not(.outline):hover,
.webGuidelines .customButton:hover {
    border-color: #233c5a;
}
.editorButton:not(.secondary):not(.outline):hover a,
.webGuidelines .customButton a,
.webGuidelines .customButton:hover a,
#eParticipation.section .item .button.register:hover input,
#eParticipation.section .item .button.register input,
.volksvertegenwoordiger #eParticipation.section .item .button.register input,
.volksvertegenwoordiger #eParticipation.section .item .button.register:hover input {
    color: #233d5a;
}
#eParticipation.section .item .button.register input {
    text-transform: none;
}
#eParticipation.section .item .button.register,
.editorButton:not(.secondary):not(.outline):not(.customButton),
.webGuidelines .editorButton:not(.secondary):not(.outline).customButton:hover,
.webGuidelines .customButton:not(.secondary):not(.outline):hover {
    background-color: #fff;
}
.editorButton:not(.secondary):not(.outline):hover,
.webGuidelines .customButton:not(.secondary):not(.outline),
.newhome .widget-type-65.carousel .carouselSlide a.readMore:hover,
.volksvertegenwoordiger .items .item a.readMore:hover,
#eParticipation.section .item .button.register:hover {
    background-color: #81cac9;
}
.webGuidelines .customButton {
    min-height: 36px;
}
.webGuidelines .customButton a {
    font-weight: 600;
    line-height: 32px;
    text-decoration: none;
}

.volksvertegenwoordiger #eParticipation.section .item .button.register::before {
    display: none;
}
.newhome .widget-type-65.carousel .carouselSlide a.readMore::after,
.volksvertegenwoordiger .items .item a.readMore::after,
.volksvertegenwoordiger #eParticipation.section .item .button.register::after {
    content: "";
    display: none;
}
.volksvertegenwoordiger #eParticipation.section .item .button.register::after {
    padding-right: 0;
}
.newhome .widget-type-65.carousel .carouselSlide a.readMore {
    margin-top: 20px;
}
.volksvertegenwoordiger #eParticipation.section .item .button.register {
    padding-right: 15px;
    position: relative;
}
html.volksvertegenwoordiger #eParticipation.section .item .button.register {
    top: inherit;
}
.customButton:not(.editorButton) {
    display: inline-block;
    padding: 0 15px;
}

.volksvertegenwoordiger .items .item .itemDescription {
    border-bottom: 2px solid #78b8c8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 20px;
}
.desktop.volksvertegenwoordiger .items .item .itemTitle {
    min-height: 80px;
    padding-bottom: 10px;
}
.desktop.volksvertegenwoordiger .items .item .itemDescription {
    min-height: 230px;
}
.volksvertegenwoordiger .items .item .itemDescription p {
    border-bottom: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-bottom: 20px;
    position: relative;
}

.newhome .divTableResponsive .eight.columns .widget-type-3.carousel:not(.widget-users) .updateImage,
.newhome
    .divTableResponsive
    .eight.columns
    .widget-type-3.carousel:not(.widget-users)
    .updateImage
    .nailthumb-container {
    height: 300px !important;
    max-width: 700px;
}

.newhome .eight.columns .widget.carousel.widget-type-3 h2.itemTitle a {
    font-size: 32px;
}

.newhome .widget-type-65.carousel h2.widgetTitle,
.newhome .widget-type-65.carousel h2.widgetTitle a {
    color: #203b5a;
    font-size: 27px;
    font-weight: 800;
    text-align: center;
}

.newhome .widget.carousel h3.itemTitle,
.newhome .widget.carousel h3.itemTitle a {
    margin-bottom: 20px;
}

.newhome .columns.eight .widget-type-3.carousel .nailthumb-image {
    left: 0 !important;
}

.desktop.newhome .divTableResponsive.sameHeight > .row,
.newhome .verhalen .widget-type-65.carousel .carouselContainer,
.newhome .uitlegvideos .widget-type-65.carousel .carouselContainer {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
}
.desktop.newhome .divTableResponsive.sameHeight > .row {
    gap: 20px;
}
.newhome .divTableResponsive.sameHeight > .row::before,
.newhome .divTableResponsive.sameHeight > .row::after {
    display: none;
}
.newhome .divTableResponsive.sameHeight > .row .columns.four {
    width: 100%;
}
.newhome .divTableResponsive.sameHeight .columns.four.handige-links {
    padding: 10px;
}
.newhome .divTableResponsive.sameHeight .updateImage {
    height: 200px;
    margin-bottom: 20px;
}
.newhome .divTableResponsive.sameHeight > .row .columns.four,
.newhome .divTableResponsive.sameHeight > .row .columns.four .mettWidget {
    height: 100%;
    position: relative;
}
.newhome .divTableResponsive.sameHeight > .row .columns.four .readMore {
    bottom: 0;
    position: relative;
}
.newhome .verhalen .widget-type-65.carousel .carouselSlide .contentBlock,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .contentBlock {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
}
.newhome .verhalen .widget-type-65.carousel .carouselSlide .itemContentRight,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .itemContentRight {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.newhome .verhalen .widget-type-65.carousel .carouselSlide .itemContentRight > .row,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .itemContentRight > .row,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .updateDescription,
.newhome .verhalen .widget-type-65.carousel .carouselSlide .description,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .description {
    height: 100%;
}

.newhome .widget-type-65.carousel .carouselSlide a.readMore {
    position: absolute;
}

.newhome .verhalen .widget-type-65.carousel .carouselSlide .updateDescription {
    min-height: 240px;
}

.newhome .verhalen .widget-type-65.carousel .carouselSlide .description,
.newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .description {
    padding-bottom: 40px;
    position: relative;
}

.desktop.newhome .verhalen .widget-type-65.carousel h3.itemTitle {
    min-height: 100px;
}

.handige-links img {
    margin-bottom: 20px;
}
.newhome .widget h2:not(.widgetTitle),
.newhome .widget h2:not(.widgetTitle) a,
.newhome .widget-events h2.widgetTitle,
.newhome .widget-events h2.widgetTitle a,
.newhome .widget h3 a,
.handige-links h2,
.handige-links h2 a,
.volksvertegenwoordiger .itemTitle a {
    color: #007b9b;
    font-size: 20px;
    font-weight: 800;
}
.volksvertegenwoordiger .handige-links h2,
.volksvertegenwoordiger .handige-links h2 a {
    border-bottom: none;
}
.newhome .widget-events h2 {
    padding-bottom: 0;
}
.handige-links ul {
    list-style: none;
    margin: 0;
}

.handige-links li a {
    padding: 0;
}

.handige-links li,
.newhome .widget-events ul li,
.widget-events ul li,
.widget ul li {
    transition: 0.5s ease;
}

.handige-links li:hover,
.newhome .widget-events ul li:hover,
.widget-events ul li:hover,
.widget ul li:hover {
    transform: translateX(4px);
}

.newhome .widget-events li,
.handige-links li {
    border-bottom: 2px solid #c7e3e4;
}

.handige-links li:last-child,
.newhome .widget-events ul li:last-child {
    border: none;
}

.volksvertegenwoordiger .handige-links li:last-child {
    border-bottom: 0;
}
.newhome .widget-events li a,
.handige-links li a {
    color: #203b5a;
    display: block;
    font-weight: 700;
    margin: 12px 0;
    padding-right: 15px;
}
.newhome .widget h2:not(.widgetTitle) a,
.newhome .widget h3.itemTitle a,
.newhome .widget-events li a,
.webGuidelines .handige-links li a {
    text-decoration: none;
}
.newhome .widget-events .shortDate {
    background-color: #203b5a;
    border-color: #203b5a;
    margin-top: 15px;
}
.newhome .widget-events {
    height: calc(100% - 80px);
    margin-bottom: 30px;
}
.mobile.newhome .widget-events {
    margin-top: 30px;
}

.newhome .widget-events ul.eventsList {
    height: 100%;
    margin-bottom: 0;
}
.newhome .widget-events ul li {
    height: 25%;
}

#content .row .carousel h2.itemTitle,
.newhome .widget-events h2.widgetTitle,
.handige-links h2 {
    font-size: 20px;
}

.editorContent .box.wide {
    background-color: transparent !important;
}

.editorContent a.after.icon-awesome-link-ext:after {
    content: "⤴";
    font-size: 18px;
}

.volksvertegenwoordiger h1,
.volksvertegenwoordiger h1 a,
.volksvertegenwoordiger .editorContent h1 a {
    font-size: 62px;
    font-weight: 300;
}
.volksvertegenwoordiger .sectionHeader .editorContent .divTableResponsive .columns.eight {
    border-right: 2px solid #7fbccc;
    padding-right: 20px;
}
.volksvertegenwoordiger .sectionHeader .editorContent .divTableResponsive .columns.eight h2 {
    font-size: 20px;
    padding-bottom: 5px;
}

.volksvertegenwoordiger .sectionHeader .widget-users .contentBlock {
    text-align: center;
}
.volksvertegenwoordiger .widget-users h2.widgetTitle {
    font-size: 18px;
    font-weight: 300;
    margin-top: 20px;
    padding-bottom: 0;
}
.volksvertegenwoordiger .widget-users .itemTitle {
    padding-top: 0;
}
.volksvertegenwoordiger .widget-users .itemTitle a {
    color: #000;
    font-size: 28px;
    font-weight: 600;
    text-decoration: none;
}
.volksvertegenwoordiger .widget-users .itemMemo h3 {
    color: #000;
}
.volksvertegenwoordiger .widget-users .icon-phone.before::before {
    background-image: url("/communities/common/images/regionale energiestrategie/phone.png");
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 18px;
    left: 4px;
    margin-right: 20px;
    position: relative;
    top: 3px;
    width: 12px;
}

.webGuidelines .mettWidget > .readMore {
    color: #203b5a;
    text-decoration: none;
}

.volksvertegenwoordiger .widget-users .carouselControls .icon-left.before::before {
    background-image: url("/communities/common/images/regionale energiestrategie/icon-left.png");
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 8px;
    width: 38px;
}
.volksvertegenwoordiger .widget-users .carouselControls .icon-right.before::before,
.webGuidelines .mettWidget > .readMore::after {
    background-image: url("/communities/common/images/regionale energiestrategie/icon-right.png");
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    height: 8px;
    width: 38px;
}
.webGuidelines .mettWidget > .readMore::after {
    margin-left: 10px;
}
.webGuidelines .mettWidget > .readMore:hover {
    text-decoration: underline;
}
.volksvertegenwoordiger .widget-users .carouselSlide {
    padding: 10px 10px 10px 30px;
}

.volksvertegenwoordiger .six.columns > #left .sectionContent .maps {
    margin-bottom: 100px;
}

.volksvertegenwoordiger .items.itemsWithTags .item .tags {
    margin-bottom: 10px;
    min-height: 30px;
}
.desktop.volksvertegenwoordiger .items.itemsWithTags .item .itemDescription {
    min-height: 250px;
}
.desktop.volksvertegenwoordiger .items .item .itemTitle {
    min-height: 70px;
}
.volksvertegenwoordiger .item .toolbar {
    display: block;
}
.volksvertegenwoordiger .items .item .itemDescription {
    margin-bottom: 50px;
}
.volksvertegenwoordiger .items.itemsWithTags .item .itemDescription {
    margin-bottom: 20px;
}
.volksvertegenwoordiger .items.itemsWithTags .item .itemDescription.multiLineTags {
    margin-bottom: 20px;
}

html.volksvertegenwoordiger #eParticipation.section .items:not(.itemsWithTags) .item .button.register {
    top: -30px;
}

#footer a {
    font-size: 14px;
}

.mobile.newhome .divTableResponsive.sameHeight > .row,
.mobile.newhome .verhalen .widget-type-65.carousel .carouselContainer {
    display: block;
}

.itemVideo iframe[src*="vimeo.com"] {
    background-color: #f1f8f8;
}

.section-243940 #top,
.section-243940 #spacerTop,
.section-243940 #bottom,
.section-243940 #spacerBottom,
.section-215779 #top,
.section-215779 #spacerTop,
.section-215779 #bottom,
.section-215779 #spacerBottom,
.section-244470 .markerSearch {
    display: none;
}

.markerContentLeft .markerTitle {
    padding: 12px;
}

/* Gespreksassistent subsection styling */
.gespreksassistent #royalSlider,
.gespreksassistent h1.sectionTitle,
.gespreksassistent #mainMenu,
.gespreksassistent #shortcuts,
.gespreksassistent #mobileShortcuts {
    display: none !important;
}
.gespreksassistent #top > .row {
    max-width: 100%;
    text-align: center;
}
.gespreksassistent #subMenu.horizontal ul {
    justify-content: center;
}
.gespreksassistent #top .hamburger {
    position: absolute;
    right: 0;
}
.gespreksassistent .webGuidelines .customButton a {
    background-color: #233d5a !important;
    color: #fff !important;
}
.gespreksassistent .webGuidelines .customButton a:hover {
    background-color: #00aced !important;
    color: #fff !important;
}

/* Footer */
#bottom .editorContent {
    padding-top: 0;
}

#bottom > .row,
#footer > .row {
    padding-left: 0;
}

#bottom a.after.icon-awesome-link-ext:after {
    content: "⤴";
}

#footer {
    padding: 15px;
}

@media only screen and (max-width: 1220px) {
    .newhome .divTableResponsive .eight.columns .widget-type-3.carousel:not(.widget-users) .updateImage,
    .newhome
        .divTableResponsive
        .eight.columns
        .widget-type-3.carousel:not(.widget-users)
        .updateImage
        .nailthumb-container {
        height: 100% !important;
        max-width: 100%;
    }
    .newhome .columns.eight .widget-type-3.carousel .nailthumb-image {
        max-width: 100%;
        height: auto !important;
    }
}

@media only screen and (min-width: 769px) {
    .newhome .verhalen .widget-type-65.carousel .carouselSlide a.readMore,
    .newhome .uitlegvideos .widget-type-65.carousel .carouselSlide a.readMore {
        bottom: 0;
        position: absolute;
    }
}

@media only screen and (max-width: 600px) {
    #homegespreksassistent.columns.three {
        display: none;
    }
}

@media only screen and (max-width: 480px) {
    .newhome .verhalen .widget-type-65.carousel .carouselSlide .itemContentLeft,
    .newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .itemContentLeft,
    .newhome .verhalen .widget-type-65.carousel .carouselSlide .itemContentRight,
    .newhome .uitlegvideos .widget-type-65.carousel .carouselSlide .itemContentRight {
        margin-left: 15px;
        max-width: calc(100% - 30px);
    }
}