/* .page-id-43106 #wpadminbar {
    display: none;
} */

.page-id-43817 #footer,
.page-id-43106 #footer {
    display: none;
}

#year-slider-container{
    background:#000;
    height:calc(100vh - 100px);
    width:100vw;
    font-family: DINPro;
    font-weight: normal;
    font-style: normal;
}

/* Style for the navigation bar */
#navbar {
    width: 100%;
    overflow-x: auto; /* Enable horizontal scrolling */
    overflow-y: hidden;
    white-space: nowrap; /* Prevent line breaks in the navigation */
    height:55px;
    position: relative;
    z-index:10;
}

#navbar #scroll-left,
#navbar #scroll-right{
    width:80px;
    height:40px;
    position:fixed;
    top:105px;
    left:0;
    z-index:1;
    font-size:40px;
    line-height:30px;
    color:#e60074;
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0.5) 100%);
    padding-left:15px;
    display:none;
    cursor:pointer;
}

.logged-in #navbar #scroll-left,
.logged-in #navbar #scroll-right{
    top:137px;
}

@media screen and (max-height: 850px) {
    .logged-in #navbar #scroll-left,
    .logged-in #navbar #scroll-right{
        top:137px;
    }
}

@media screen and (max-width: 850px) {
    .logged-in #navbar #scroll-left,
    .logged-in #navbar #scroll-right{
        top:105px;
    }
}

@media screen and (max-width: 550px) {

    #navbar #scroll-left,
    #navbar #scroll-right,
    .logged-in #navbar #scroll-left,
    .logged-in #navbar #scroll-right{
        top:60px;
    }
}

#navbar #scroll-right{
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,1) 50%);
    text-align: right;
    padding-right:15px;
    right:0;
    left:auto;
}

@media screen and (max-height: 800px) {
    #navbar {
        background:#dfdfdf;
    }
}

#navbar ul {
    padding: 0;
    list-style: none;
    margin: 0;
    height:55px;
}

#navbar li {
    display: inline-block;
    height:40px;
    margin:5px 10px 5px 10px;
    line-height:35px;
    font-weight:bold;
}

#navbar a {
    text-decoration: none;
    color: white;
    border:2px solid #fff;
    height:100%;
    display:block;
    padding:0 30px;
    font-size:20px;
}

#navbar a.active {
    color:#e60074;
    font-weight:bold;
    background:rgba(255,255,255,1);
}

#navbar a:hover {
    color:#e60074;
    font-weight:bold;
    background:rgba(255,255,255,1);
}

 /* Custom scrollbar style for webkit-based browsers */
#navbar::-webkit-scrollbar {
    width: 6px; /* Adjust the width of the scrollbar */
    height:5px;
    visibility:hidden;
    display:none;
}

#navbar::-webkit-scrollbar-thumb {
    background: #888; /* Scrollbar thumb color */
    border-radius: 6px; /* Round the thumb */
}

#navbar::-webkit-scrollbar-track {
    background: #333; /* Scrollbar track color */
}        

#slider-content{
    width:100vw;    
    height:calc(100vh - 100px);
    margin-top:-55px;
    background:#333;
}

@media screen and (max-height: 800px) {
    #slider-content{
        margin-top:0px;
    }
}

#slider-content #left{
    width:25%;
    height:100%;
    background:#333;
    float:left;
    z-index:3;
    position: relative;
    /* background:url('https://picsum.photos/300/800/?grayscale=1'); */
    background-size: cover;
    background-repeat: no-repeat;
}

@media screen and (max-width: 992px) {
    #slider-content #left {
        float:none;
        width:100%;
        height:200px;
    }

    #slider-content #left #description_label{
        float:none;
        width:100%;
        height:50px;
        display:none;
    }
}


#slider-content #left #gradient{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(to bottom,rgba(0,0,0,0.3) 25%,#e68a00 75%); */
    z-index: 1;
    opacity: 1;
    transform: translate3d(0,0,0) translateY(0);
    transition: opacity 1s ease, transform 1s ease 0.25s;
}

#slider-content #left #timelineInfo{
    width:70%;
    height:auto;
    margin: 0 15%;			
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    color:#fff;
    z-index:3;
}

#slider-content #right{
    width:75%;
    height:100%;
    background:url('assets/tijdlijn/bg2.png') #dfdfdf;
    background-size:cover !important;
    float:left;
    overflow:hidden;
    white-space: nowrap;
}

@media screen and (max-width: 992px) {
    #slider-content #right {
        float:none;
        width:100%;
        padding-top:0px;
        margin-bottom:0;
        padding-bottom:30px;
        min-height:700px;
    }
}

#slider-content #right ul {
    padding: 0;
    list-style: none;
    height:100%;
    width:100%;
    position:relative;
    overflow-x:auto;
    overflow-y:hidden;
    display:inline-block;
    float:left;
}

#slider-content #right ul::-webkit-scrollbar {
    width: 6px; /* Adjust the width of the scrollbar */
    height:15px;
    background-color: #e60073c9;
    display:none
}

#slider-content #right ul::-webkit-scrollbar-thumb {
    background: #e60074;
}

#slider-content #right li{
    position: relative;
    height:100%;
    width:320px;
    margin:0 50px;
    padding:0;
    z-index:2;
    display: inline-block;
}

#slider-content #right li:first-child{
    margin-left:200px;
}

#slider-content #right li:first-child:before{
    width: calc(100% + 300px);
    left:-200px;
}

@media screen and (max-width: 992px) {
    #slider-content #right li:first-child{
        margin-left:50px;
    }
    
    #slider-content #right li:first-child:before{
        width: calc(100% + 100px);
        left:-50px;
    }
}

#slider-content #right li:last-child{
    margin-right:200px;
}

#slider-content #right li:last-child:before{
    width: calc(100% + 400px);
    right:-300px;
}

#slider-content #right li:before{
    content:'';
    height:5px;
    width:calc(100% + 100px);
    background:#fff;
    position:absolute;
    top:calc(50% - 2.5px);
    left:-50px;
}

#slider-content #right li .inner-content,
#slider-content #right li .inner-image{
    height:50%;
    width:100%;
    /* background:green; */
    word-wrap: break-word;
    white-space:pre-wrap;
    position:relative;
}


#slider-content #right li .inner-image .inner-image-wrapper{
    min-height:250px;
    width:100%;
    background:#fff;
    position:absolute;
    top:0;
    box-shadow: inset 0 0 0 15px #fff;
    background-position: center center !important;
    background-size:contain !important;
    background-repeat: no-repeat !important;
}

@media screen and (max-width: 992px) {
    #slider-content #right,
    #slider-content #right li{
        height:auto;
    }
    #slider-content #right li .inner-content,
    #slider-content #right li .inner-image{
        height:300px;
    }
}

#slider-content #right li .inner-content .inner-content-wrapper{
    text-align:center;
    min-height:300px;
    width:100%;
    background:#fff;
    position:absolute;
    top:0;
    padding:10px 20px;
    padding-top:30px;
}

  

@media screen and (max-height: 992px) {
    #slider-content #right li .inner-content .inner-content-wrapper{
        min-height:auto;
        padding-top:15px;
    }
}

@media screen and (max-width: 992px) {
    #slider-content #right li .inner-content .inner-content-wrapper{
        top:auto;
        bottom:0;
    }
} 

#slider-content #right li .inner-content .inner-content-wrapper p{
    max-width:90%;
    margin:0px auto 20px auto;
}

#slider-content #right li:nth-child(odd) .inner-content .inner-content-wrapper{
    text-align:center;
    background:#fff;
    bottom:0;
    top:auto;
    padding:10px;
    padding-top:30px;
}

@media screen and (max-height: 992px)  and (min-width: 992px) {
    #slider-content #right li:nth-child(odd) .inner-content .inner-content-wrapper{
        min-height:auto;
        padding-top:15px;
    }
}

#slider-content #right li:nth-child(odd) .inner-content .inner-content-wrapper .dot{
    content:'';
    position:absolute;
    width:50px;
    height:50px;
    background:#ccc;
    bottom:-25px;
    left:calc(50% - 25px);
    z-index:9;
    border-radius:50%;
    border:5px solid white;
}

#slider-content #right li .inner-content .inner-content-wrapper .dot i{
    font-size:30px;
    height:30px;
    width:30px;
    line-height:40px;
    color:#fff;
}

#slider-content #right .empty{
    margin-right:0;
}

#slider-content #right li:nth-child(odd) .inner-content .inner-content-wrapper .line{
    content:'';
    position:absolute;
    width:100%;
    height:5px;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, #ccc 50%, rgba(255,255,255,1) 100%);
    z-index:8;
    bottom:-2.5px;
    left:0;
}


#slider-content #right li:nth-child(even) .inner-content .inner-content-wrapper .dot{
    content:'';
    position:absolute;
    width:50px;
    height:50px;
    background:#ccc;
    top:-25px;
    left:calc(50% - 25px);
    z-index:9;
    border-radius:50%;
    border:5px solid white;
}


#slider-content #right li:nth-child(even) .inner-content .inner-content-wrapper .line{
    content:'';
    position:absolute;
    width:100%;
    height:5px;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, #ccc 50%, rgba(255,255,255,1) 100%);
    z-index:8;
    top:-2.5px;
    left:0;
}

@media screen and (max-width: 992px) {
    #slider-content #right li:nth-child(even) .inner-content .inner-content-wrapper .line{
        bottom:-2.5px;
        top:auto;
    }
    #slider-content #right li:nth-child(even) .inner-content .inner-content-wrapper .dot{
        bottom:-25px;
        top:auto;
    }
}


#slider-content #right li:nth-child(even) .inner-image .inner-image-wrapper{
    /* background:orange; */
    top:auto;
    bottom:0;
    background-position: center center !important;
    background-size: contain !important;
}

@media screen and (max-width: 992px) {
    #slider-content #right li:nth-child(even) .inner-image .inner-image-wrapper{
        top:0;
        bottom:auto;
    }
}   

.category_label{
    height:20px;
    font-size:12px;
    line-height:15px;
    width:auto;
    background:#e60074;
    color:#fff;
    padding:2px 10px;
    display:inline-block;
    text-transform: uppercase;
    font-weight: bold;
}

#year_label{
    padding-top:50px;
    font-size:50px;
    color:#fff;
}

#description_label{
    font-weight:bold;
}

#item_popup{
    width:100vw;
    height:calc(100vh - 100px);
    background:rgba(0,0,0,.7);
    position:absolute;
    z-index:10;
    position: relative;
    display:none;
}

@media screen and (max-width: 992px) {
    #item_popup{
        height:calc(100vh - 0px);
        top:0;
        z-index:99999;
        position:fixed;
    }
}

#item_popup_close{
    width:50px;
    height:50px;
    background:#e60074;
    position: absolute;
    right:0;
    top:0;
    color:#fff;
    font-size:40px;
    line-height: 50px;
    text-align: center;
    cursor:pointer;
}

#item_popup_content{
    position: absolute;
    background:#fff;
    width:70vw;
    left:50%;
    top: 50%;
    padding:30px;
    transform: translateY(-50%) translateX(-50%);
    overflow-y:scroll;
    max-height:calc(100vh - 200px);
}


#item_popup_content::-webkit-scrollbar {
    width: 6px; /* Adjust the width of the scrollbar */
    height:5px;
    background-color: #20969071;
}

#item_popup_content::-webkit-scrollbar-thumb {
    background: #209690;
  }

#item_popup_image{
    width: 300px;
    height:200px;
    display: block;
    float: right;
    margin: 0 30px 30px 30px;
    background-size:contain !important;
    background-repeat:no-repeat !important;
    background-position: center center !important;
}

@media screen and (max-width: 992px) {
    #item_popup_image{
        display:inline-block;
        width:100%;
        margin:30px 0px;
    }
}

#item_popup_date{
    display:inline-block;
    margin-bottom:10px;
}


#item_filter{
    height:50px;
    display:inline-block;
    position:absolute;
    bottom:10px;
    left:10px;
    z-index:9;
    padding:0 10px;
    border:2px solid #fff;
    cursor:pointer;
}

#item_filter_mobile{
    height:50px;
    display:none;
    position:absolute;
    bottom:10px;
    left:10px;
    z-index:9;
    padding:0 10px;
    border:2px solid #fff;
    cursor:pointer;
}

@media screen and (max-width: 992px) {
    #item_filter{
        display:none;
    }
    #item_filter_mobile{
        display:block;
        position:absolute;
        right:0;
        top:60px;
        width:50px;
        left:auto;
        bottom:auto;
    }
}

#item_filter_button,
#item_filter_close_button,
#item_filter_mobile_button,
#item_filter_mobile_close_button{
    font-size:30px;
    color:#fff;
    line-height:50px;
}

#item_filter:hover,
#item_filter_mobile:hover{
    background:#fff;
}

#item_filter:hover #item_filter_button,
#item_filter:hover #item_filter_close_button{
    color:#209690;
}

#item_filter_button span,
#item_filter_close_button span,
#item_filter_mobile_button span,
#item_filter_mobile_close_button span,
#item_filter_mobile_search_button span
{
    display:block;
    height:50px;
    font-size:20px;
    line-height:47px;
    margin:0 0 0 10px;
    float:right;
    font-family: DINPro;
    font-weight: normal;
    font-style: normal;
    text-transform: uppercase;
    font-weight:bold;
}


#filter_popup{
    width:100%;
    height:100%;
    background:#209690;
    position:absolute;
    z-index:10;
    position: relative;
    display:none;
}

#filter_popup_mobile{
    width:100%;
    height:100vh;
    background:#209690;
    position:fixed;
    z-index:10;
    display:none;
    top:0;
}

#item_filter_mobile_search_button{
    background:#fff;
    color:#209690;
}

#filter_popup_mobile #item_filter_mobile_search_button,
#filter_popup_mobile #item_filter_mobile_close_button{
    border:2px solid #fff;
    margin-top:30px;
    padding:0px 10px;
}

#filter_popup_mobile #item_filter_mobile_search_button span,
#filter_popup_mobile #item_filter_mobile_close_button span
{
    margin:0;
}

#filter_popup_mobile #search_label{
    padding-top:0 !important;
}

#item_filter_content{
    width:100%;
    height:auto;	
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    color:#fff;
    z-index:3;
    overflow-y:scroll;
    max-height:80%;
}


 /* Custom scrollbar style for webkit-based browsers */
 #item_filter_content::-webkit-scrollbar {
    width: 6px; /* Adjust the width of the scrollbar */
    height:5px;
    visibility:hidden;
}

#item_filter_content::-webkit-scrollbar-thumb {
    background: #e60074; /* Scrollbar thumb color */
    border-radius: 6px; /* Round the thumb */
}

#item_filter_content_inner{
    width:70%;
    margin:0 15%;
}

#item_filter_content label{
    display:inline-block;
    border:2px solid #fff;
    height:30px;
    font-size:20px;
    line-height:25px;
    padding:0 10px;
    color:#fff;
    font-weight:normal;
    text-transform:uppercase;
    margin-right:5px;
    cursor:pointer;
}

#item_filter_content input[type="checkbox"]{
    display:none;
}

#item_filter_content input[type="checkbox"]:checked + label {
    background-color: #fff;
    color: #209690;
}

#item_filter_content #search_label{
    padding-top:30px;
    font-size:30px;
    color:#fff;
}

#item_filter_content #tags_label{
    padding-top:30px;
    font-size:20px;
    color:#fff;
}

#filter_popup_mobile #tags_label{
    padding-top:10px;
}

@media screen and (max-width: 1200px){	
    #item_popup_content{
        width:80vw;
    }
}

#coverflow{
    height:100%;
}
#coverflow .flipster__item a{
    height:100%;
    display:block;
}

#coverflow .flipster__item img{
    max-height:300px;
    min-height:300px;
    max-width:300px;
    min-width:300px;
}

#coverflow .inner-data{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:5;
    width:100%;
    height:100%;
    text-align:center;
    background:rgba(0,0,0,0.3);
}

#coverflow .inner-data.start{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:5;
    width:100%;
    height:100%;
    text-align:center;
    background:transparent;
}

#coverflow .inner-data img{
    max-height:300px;
    max-width:300px;
}

#coverflow .inner-data h1{
    margin-top:20px;
    color:#fff;
    font-size:40px;
}

#coverflow .inner-data .post-title{    
    color:#fff;
    display:inline-block;
    top:50%;
    left:0;
    width:100%;
    position:absolute;
    padding:30px;
    font-weight:bold;
}


#coverflow .inner-data .dot{
    content:'';
    position:absolute;
    width:50px;
    height:50px;
    background:#ccc;
    top:50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left:calc(50% - 25px);
    z-index:9;
    border-radius:50%;
    border:5px solid white;
}

#coverflow .inner-data .line{
    content:'';
    position:absolute;
    width:100%;
    height:5px;
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, #ccc 50%, rgba(255,255,255,1) 100%);
    z-index:8;
    top:50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left:0;
}


.mobile-search{
    display:none !important;
}

@media screen and (max-width: 992px) {
    .mobile-search{
        display:block !important;
    }
}

.mobile-search input{
    display:inline-block;
    width:50% !important;
    margin:0 !important;
    padding:0 !important;    
}

.mobile-search input[type="text"]{
    width:70% !important;
    padding:0 10px !important;
}

.mobile-search input[type="submit"]{
    width:30% !important;
}

@media screen and (max-width: 400px){	
    .mobile-search input[type="text"]{
        width:60% !important;
    }
    
    .mobile-search input[type="submit"]{
        width:40% !important;
    }
}