/*### ### ### ### ### ### --- Algemeen --- ### ### ### ### ### ###*/


/*@font-face {*/


/*font-family: 'OpenSans';*/


/*font-style: normal;*/


/*font-weight: normal;*/


/*font-display: swap;*/


/*src: local("OpenSans Regular"), url("https://content.rijnmond.nl/software/lea-inc/general/font/OpenSans-Regular.woff") format("woff");*/


/*}*/


/*@font-face {*/


/*font-family: 'OpenSans';*/


/*font-style: normal;*/


/*font-weight: bold;*/


/*font-display: swap;*/


/*src: local("OpenSans Bold"), url("https://content.rijnmond.nl/software/lea-inc/general/font/OpenSans-Bold.woff") format("woff");*/


/*}*/

.font {
    font-family: 'OpenSans';
}

.null_height {
    max-height: 0;
}

hr.default {
    border: 0;
    border-top: 1px solid #f2f2f2;
}

img {
    image-rendering: -moz-crisp-edges;
    /* Firefox */
    image-rendering: -o-crisp-edges;
    /* Opera */
    image-rendering: -webkit-optimize-contrast;
    /* Webkit (non-standard naming) */
    image-rendering: crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;
    /* IE (non-standard property) */
}


/*### ### ### ### ### ### --- Iframe --- ### ### ### ### ### ###*/

.corner-wrapper {
    /* Cornors added */
    overflow: hidden;
    border-radius: 7px;
    transform: translateZ(0px);
}


/*### ### ### ### ### ### --- Sidebar --- ### ### ### ### ### ###*/

.groei-wa-slider .groei-wa-thumb a .title {
    font-size: 1.9em !important;
}


/*### ### ### ### ### ### --- Menu Topbar --- ### ### ### ### ### ###*/


/*
.groei-wa-navigation-sub-menu-items {
    background-color: var(--primary-color) !important;
    margin-bottom: -0.1em !important;
}



.groei-wa-navigation .groei-menu-sub-item a {
    color: hsla(0, 0%, 100%, .5)!important;
    font-weight: 700 !important;
    background-color: var(--primary-color) !important;
    border: .05em solid var(--primary-color) !important;
}

.groei-wa-navigation .groei-menu-sub-item a:hover,
.groei-wa-navigation .groei-menu-sub-item a.nuxt-link-active {
    color: #fff !important;
}*/


/*
.groei-wa-header {*/


/* border-bottom: .1em solid rgb(8 106 179) !important; */


/*box-shadow: 0em 0.5em 0.75em rgb(0 106 172 / 20%) !important;
    margin-top: -1px;
}
*/


/*### ### ### ### ### ### --- Weer --- ### ### ### ### ### ###*/

@media screen and (min-width: 600px) {
    .groei-wa-weather-summary .col-xs-12.col-sm-6 {
        flex-basis: 100% !important;
        max-width: 100% !important;
    }
    .groei-wa-wf-columns .weather-forecast {
        min-width: auto !important;
    }
    .component .groei-wa-wf.groei-wa-wf-days-6 {
        max-width: inherit !important;
    }
    .weather-page .tab-controls {
        margin: auto !important;
        margin-bottom: 0.5vh !important;
        text-align: center !important;
    }
    .weather-page .tab-controls label {
        background-color: #458BB7 !important;
        padding: 0.7vh 1vw !important;
        margin: auto !important;
        margin-bottom: 0.5vh !important;
        border-radius: 6px !important;
        transition: 0.4s !important;
        color: #fff !important;
    }
    .weather-page .tab-controls label:hover {
        background-color: #1B7AB5 !important;
        color: #fff !important;
    }
}


/* Weer Kaart Buttons */

.special-header_content {
    bottom: -40px !important;
}

.special-header_content-text {
    display: none;
}

.special-header_image:after {
    background: transparent !important;
}

.special-header {
    margin-bottom: 30px;
}

.special-header .special-header_image .image,
.special-header .special-header_image .special-header_content .special-header_content-tabs {
    box-shadow: 0em 0.2em 0.75em rgb(0 106 172 / 20%) !important;
}


/*### ### ### ### ### ### --- Footer --- ### ### ### ### ### ###*/

.footer-list h4.title {
    margin-bottom: 0.15em !important;
    margin-top: 0.6em !important;
    line-height: 1em !important;
}

.social-links.footer-list h4.title {
    border-bottom: 0 !important;
}

.social-links.footer-list a.navigation-link {
    padding-left: 0em !important;
}

.footer-message h4.title,
.footer-message .navigation-link.link {
    margin: auto;
    margin-bottom: 0;
    text-align: center;
}

.footer-message .inner.container-fluid {
    /* Zorgt dat Tips de Redactie blok niet te groot is. */
    padding-bottom: 2.5em;
}


/*### ### ### ### ### ### --- EPG Pagina --- ### ### ### ### ### ###*/

@media screen and (min-width: 1000px) {
    .episodePage .singlecolumn .col-lg-6 {
        -ms-flex-preferred-size: 83.333%;
        flex-basis: 83.333%;
        max-width: 83.333%;
    }
}

.vertical-program-list {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: stretch;
    flex-direction: row;
    margin-bottom: 1em !important;
}

.vertical-program-list .program-list-item {
    min-width: 100%;
    /*max-width: 50%;*/
    flex: 0 1 auto;
    /* padding: 2em 0 2em 0 !important; */
    padding: 0 1em !important;
    margin-top: 2em;
    border-bottom: 0 !important;
}

.vertical-program-list .program-list-item .program-list-item_info .responsive-image.overflow-border-radius {
    margin-right: 0.6em;
}

.program-list-item .program-list-item_container {
    /* padding-bottom: 0 !important; */
    align-items: center;
    background: rgb(0 106 172 / 0.04);
    border-radius: 6px;
    padding: 0.6em 0.4em 0 0.4em;
}

@media screen and (max-width: 1000px) {
    .vertical-program-list .program-list-item {
        max-width: 100%;
        padding: 0;
    }
}

.vertical-program-list .program-list-item .program-list-item_content .program-list-day {
    font-size: 1.2em;
    width: fit-content;
    margin-bottom: 0.2em;
}

.vertical-program-list .program-list-item .program-list-item_content .item-title {
    width: fit-content;
    margin-bottom: 0.2em;
}

.vertical-program-list .program-list-item .program-list-item_content .item-desc {
    font-size: 1.4em !important;
}

.episodePage .tab-controls {
    padding: 0.3em 0.5em !important;
    background: rgb(0 106 172 / 1) !important;
    border-radius: 6px !important;
}

.episodePage .tab-controls label {
    padding: 0.5em !important;
    color: #fff !important;
}


/*### ### ### ### ### ### --- EPG Pagina Description XML --- ### ### ### ### ### ###*/

.btn-group-flex {
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 1em;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: center;
    flex-direction: row;
    row-gap: 1vh;
    column-gap: 1vw;
}

.button_base_1 {
    flex: 0 1 auto;
}

.button_base_1 button {
    background-color: #006bac;
    color: #fff;
    font-size: 1em;
    font-weight: 700;
    cursor: pointer;
    padding: 1vh 1.4vw;
    min-width: max-content;
    width: 100%;
    text-align: center;
    outline: none;
    transition: 0.4s;
    border-radius: 6px;
    border: 2px solid #05659f;
    position: relative;
}

@media screen and (max-width: 1000px) {
    .button_base_1 button {
        padding: 10px 20px;
    }
}


/*### ### ### ### ### ### --- EPG Gids / Guide Pagina --- ### ### ### ### ### ###*/

@media screen and (min-width: 600px) {
    .groei-wa-epg-page .col-xs-12.col-lg-6 {
        flex-basis: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
    }
}

.guide-content-container .guide-content {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: stretch;
    flex-direction: row;
    margin-bottom: 1em !important;
    margin-top: 5em !important;
}

.guide-content-container .guide-content .guide-content-item {
    min-width: 100%;
    max-width: 100%;
    flex: 0 1 auto;
    /*padding: 2em 0 2em 0 !important;*/
    padding: 0 1em !important;
    margin-top: 2em;
    border-bottom: 0 !important;
}

.guide-content-container .guide-content .guide-content-item .guide-content-itemwrap {
    /*padding-bottom: 0 !important;*/
    /*align-items: center;*/
    background: rgb(0 106 172 / 0.04);
    border-radius: 6px;
    padding: 0.6em 0.4em 0 0.4em;
}

@media screen and (max-width: 1000px) {
    .guide-content-container .guide-content .guide-content-item {
        max-width: 100%;
        padding: 0;
    }
}

.guide-content-container .guide-content .guide-content-item .guide-content-itemwrap {
    width: 100%;
    display: flex;
    justify-content: flex-start;
}

.guide-content-container .guide-content .guide-content-item .guide-content-itemwrap .guide-content-item-info {
    flex: 0 0 20%;
    margin-bottom: 1em !important;
}


/* Als not-available werkt kan deze css line zorgen dat het net iets anders kleurt.
.guide-content-container .guide-content .guide-content-item.not-available .guide-content-itemwrap {
    background: rgb(79 79 79 / 4%);
} */


/*### ### ### ### ### ### --- Artikel Pagina --- ### ### ### ### ### ###*/


/*.groei-wa-article ul.avatars {
    display: none !important;
}*/


/*### ### ### ### ### ### --- Dropdown / Accordion --- ### ### ### ### ### ###*/

.dropdown_vraag {
    background-color: #458BB7;
    color: #fff;
    font-family: 'OpenSans';
    font-weight: 700;
    cursor: pointer;
    padding: 1vh 1vw;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    border-radius: 6px;
    margin-top: 20px;
}

.dropdown_active,
.dropdown_vraag:hover {
    background-color: #1B7AB5;
}

.dropdown_vraag:after {
    content: '\002B';
    color: #fff;
    font-weight: 700;
    float: right;
    margin-left: 5px;
}

.dropdown_active:after {
    content: "\2212";
}

.dropdown_antwoord {
    padding: 0;
    margin: 0px 15px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    background-color: #dce9f1;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    font-family: 'OpenSans';
    font-size: 0.9em;
}

.dropdown_antwoord .dropdown_antwoord_context {
    margin: 0px;
    margin-top: 1em;
    padding: 0 1em;
}

@media screen and (min-width: 500px) {
    .dropdown_vraag {
        padding: 10px;
        font-size: 0.9em;
        font-weight: 100;
    }
}