@charset "ISO-8859-1";

.calendar.year .scrollcontainer {
    float:left;
    height:100%; 
}

.calendar.year h1 {
    display:none;
    width:100%;
    margin-top:2em;
}

.calendar.year h2 {
    display:block;
    width:100%;
    margin-top:1.5em;
}

.calendar.year h2 span.leapyear{	
    margin-left:0.5em;
    color:#999;
}

.calendar.year ul.headerlist,  
.calendar.year ul.daylist {
    list-style: none;
    list-style-position: inside;
    margin: 0;
    padding: 0;    
}

@media screen and (max-width: 600px) {
    .calendar.year ul.daylist {
        /* scrolls the days left/right only if screen is small */    	
        overflow-x: auto; /* only show x-axis scrollbar */
        overflow-y: hidden; 
        /* popups and co will be visible because of padding, overflow does not scale for floating divs */
        padding-right: 100px;
        padding-bottom: 100px; 
    }	
}



@supports(display:grid) {
    .calendar.year ul.headerlist,
    .calendar.year ul.daylist {
        display: grid;
        grid-auto-flow: column;
        grid-gap: 2px;
        grid-template-rows: repeat(8, auto);
    }

    .calendar.year ul.headerlist {
        grid-template-columns: 50px;		
        float: left;
    }

    .calendar.year ul.daylist {		
        /*grid-template-columns: repeat(auto, 15px);*/	
        grid-template-columns: repeat(54, minmax(15px, max-content));    		
    }
}


@supports not (display:grid) {
    .calendar.year ul.headerlist,
    .calendar.year ul.daylist {
        display: none;		
    }
}

.calendar.year ul.daylist li.noday, 
.calendar.year ul.daylist li.header,
.calendar.year ul.headerlist li.header {
    background-color: #e5e5e5;
    overflow: hidden;
    height: auto;
    padding: 0.1em;
}

.calendar.year ul.daylist li.header {

}
.calendar.year ul.daylist li.header.cw,
.calendar.year ul.headerlist li.header.cw {
    font-size: x-small;
    text-align: center;
}





.calendar.year ul.daylist li.day,
.calendar.year ul.daylist li.noday {
    padding: 0.1em;
}
.calendar.year ul.daylist li.noday.lastnoday {
    width: 200px;
    background: transparent;
}


.calendar.year ul.daylist li.day:hover {
    background-color: #48A4D2;
}

.calendar.year ul.daylist li.day div {

}

.calendar.year ul.daylist li.saturday {
    background-color: #eee;
}

.calendar.year ul.daylist li.sunday {
    background-color: #eee;
}

.calendar.year ul.daylist li.holiday {
    background-color: #60ff60!important; 
}

.calendar.year ul.headerlist li.header.SATURDAY,
.calendar.year ul.headerlist li.header.SUNDAY,
.calendar.year ul.daylist li.day.SATURDAY, 
.calendar.year ul.daylist li.day.SUNDAY {
    border: 1px solid #ccc;
    border-left: none;
    border-right: none;
}

