/*
 * Custom CSS by Digital Deer
 *
 *
 * Fonts
 * Colors
 * Header / breadcrumbs
 * Thema blocks
 * Regio Map
 * News / Agenda
 *
 *
 *
 * --------------------------- */

/* IE 10 bug fixes
 * --------------------------- */

@media all and (-ms-high-contrast: none) {

    /* icons link uitlijnen */
    .svg-inline--fa.fa-pull-left{
        width: 1.125em;
    }

    /* search fix */
    .col{

        -ms-flex-preferred-size: 100%;
    }

    input.form-control.border.border-orange{

        width:100%;
    }

}



/* --------------------------- */

/* algemeen
 * --------------------------- */

.fa-ul{
    line-height: 2em;
}

/* 
 * Fonts
 * --------------------------- */

body{
	font-family: Arial,Helvetica Neue,Helvetica,sans-serif; 
}

h1,h2,h3,h4,h5,h6{
	font-family: 'Slabo 13px', serif;
	color: #093489;
}

.text-slabo{
    font-family: 'Slabo 13px', serif;
}

/* 
 * Colors
 * --------------------------- */
.bg-rb {
    background-color: #093489;
}

.border-orange {
    border-color: #eb690b!important;
}

.bg-orange {
    background: #eb690b!important;
}

.text-orange {
    color: #eb690b!important;
}

.text-rb {
    color: #093489;
}

.text-rb.active {
    color: #009ee0;
    text-decoration: underline;
}

.text-rb-light {
    color: #009ee0;
}

a.text-rb:hover{
    color: #009ee0;
}

a.text-rb-light:hover{
    color: #093489;
}



/* 
 * header / breadcrumbs
 * --------------------------- */
.fa-ul{
    margin-left: 1.5em;
}
.carousel-caption{
    right:0;
    left:0;
    text-align: center;
    background-color: rgba(233, 236, 239, 0.8);
    bottom: 0;
    padding: 0;

}

.breadcrumb-item+.breadcrumb-item::before{
    content: "»";
}

.breadcrumb{
	margin-bottom: 0;
	background-color: inherit;
}

/* homepage header 
 * --------------------------- */

@media screen and (min-width: 1024px){
    .home-header{
        position: relative;
        background: url(/data/images/headers/big_home2.jpg); 
        min-height: 600px; 
        background-size: cover; 
        background-position: center center; 
        background-repeat: no-repeat;
    }

    .header-cards{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        margin: 0 auto;
        width: 100%;
    }

}

@media screen and (max-width: 1024px){
    .home-header{
        position: relative;
        background: url(/data/images/headers/small_home2.jpg); 
        background-size: cover; 
        background-position: center center; 
        background-repeat: no-repeat;
    }

    .header-cards{

        padding: 3em 0;
    }
}

/* thema blocks 
 * --------------------------- */

.thema-title{
    top: 50%;
    transform: translateY(-50%);
    position: relative;
}

.thema-img-overlay {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0.15rem 0.5rem;
    background: rgba(9, 52, 137, 0.8);
    font-family: 'Slabo 13px', serif;
    font-size: 14px;
    text-align: center;
    height: 70px;
}


.thema-img-overlay:hover { 
    background: rgba(0, 158, 224, 0.8);
    cursor: pointer;
}

/* Regio map 
 * --------------------------- */

path:hover {
    fill: #009ee0;
    cursor: pointer;
}

/* CSS Class 'disable_regio' overrides <path> tag */
path.disable_regio, path.disable_regio:hover {
    fill:#172983; 
    cursor: default;
}

/* CSS Class 'disable_nr' overrides the <path> tag */
path.disable_nr, path.disable_nr:hover {
    fill: #fff;
    cursor: default;
}

/* CSS Class 'normal_regio' overrides the <path> tag */
path.normal_regio, path.normal_regio:hover {
    fill: #009ee0;
    cursor: default;
}

/* CSS Class 'normal_nr' overrides the <path> tag */
path.normal_nr, path.normal_nr:hover {
    fill: #fff;
    cursor: default;
}

area:hover {
    fill: #009ee0;
    cursor: pointer;
}

.regiolink {
    color: #093489;
}

.regiolink:hover {
    color: #009ee0;
    cursor: pointer;
}

.regiolink.checked {
    color: #dddddd;
    text-decoration: underline;
}

.regio_desc{
    display:none;
}

.regio_show{
    display:block !important;
    background:#009ee0;
    color: #fff;
}

.regio_map:hover{
    fill:#009ee0;
}

.active_map{
    fill:#009ee0 !important;
}


/* Sub Regio Footer
 * --------------------------- */

@media screen and (min-width: 1024px){
    /*.regio-footer{
        position: relative;   
        min-height: 500px; 
    }*/

    /*.regio-cards{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        margin: 0 auto;
        width: 100%;
    }*/

    .regio-cards {
        padding: 3em 0;
    }

}

@media screen and (max-width: 1024px){
/*    .regio-footer{
        position: relative;
        background: url(/static/images/amsterdam.jpg);
        background-size: cover; 
        background-position: center center; 
        background-repeat: no-repeat;
    }*/

    .regio-cards{

        padding: 3em 0;
    }
}



/* 
 * News / Agenda
 * --------------------------- */

.news-item, .agenda-item {
    margin-bottom: 3em;
}


.about:hover {
    color: #009ee0;
    cursor: pointer;
}

.about.checked {
    color: #009ee0;
    text-decoration: underline;
}

.contact, .bureau, .organisatie{
    display: none;
}

.contact.show, .bureau.show, .organisatie.show{
    display: block;
}

.medewerker{
    margin-bottom: 0.5em;
}

.agenda{
    display: flex;
    position: relative;
    width: 100%;
}
.agenda .highlight{
    background: #eb690b;
    min-width: 2rem; 
    margin-left:2rem
}
.agenda .icon{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #093489;
    color: #ffffff;
    width: 4rem; 
    height:4rem;
}

.agenda .body{
    width: 100%;;
    background-color: #dae1ed;
}

.agenda .body .title{
    width: 100%;
    background-color: #ffffff;
    padding: 0 1rem;
    color:#eb690b;
    font-family: 'Slabo 13px', serif;
    font-size: 1.75rem;
}

.agenda .body .content{
    padding: 1rem;
    font-size: 0.875rem;
}
.agenda .body .content strong{
    display:block;
    color: #093489;
    font-size: 1rem;
}

.agenda-nested{
    padding-right: 2rem; 
    padding-bottom: 2rem; 
    margin-left:2rem;
    background-color: #dae1ed;
}
.agenda-nested .agenda .body {
    margin-top: 2rem;
    background-color: #fff1e8;
}

.agenda-nested .agenda .body ol{
    margin-left: -1rem;
    padding-inline-start: 1rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
}
.agenda-nested .agenda .body .content ol strong{
    display:inline;
    color: #093489;
    font-size: 0.75rem;
    line-height: 1.25rem;
}

.agenda-nested .agenda .body .title{
    width: 100%;
    background-color: #eb690b;
    height: 2rem;
    display: flex;
    align-items: center;
    color:#ffffff;
    font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
    font-size: 0.875rem;
}
.agenda-nested .agenda .highlight{
    background-color: #fff1e8;
}
/*rgba(235, 105, 11, 1)*/