:root {
    --timetable-blue: #FFFFBB;
}

p.version {
    text-align: center;
    margin: 0pt;
    padding: 0pt;
}

body > h2,
body > p.version {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 90px;
    box-sizing: border-box;
}

body:has(.elective-controls) > h2,
body:has(.elective-controls) > p.version {
    width: calc(100% - 270px);
    max-width: 1100px;
    margin-left: 0;
    margin-right: 0;
}

body:has(.elective-controls) div.table {
    margin-left: 0;
    margin-right: 0;
}

h2 {
    text-align: center;
    margin: 3pt;
}

body {
    font-family : Arial;
    margin-top : 0pt;
    font-size : 10pt;
    max-width: 100%;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

a:link{
        text-decoration : none;
        color : #444444; 
}

a:visited{
        text-decoration : none;
        color : #666666; 
}


a:hover   {text-decoration: underline;}

table.evenodd {
        border-collapse : colapse;
        border : 1px #A5D5D5 dashed;
}

table.evenodd tbody.programme-section td,
table.evenodd tbody.list-section td {
        text-align : center;
        font-size : 10pt;
        padding : 0px;
}

table.evenodd tbody.programme-section tr:nth-child(even) td,
table.evenodd tbody.list-section tr:nth-child(even) td {
        background : #E8E8E8;
}

table.timetable {
    border-collapse : collapse;
    width: 100%;
    min-width: 0;
    table-layout: fixed;    
}

div.table {
    margin-left: auto;
    margin-right: auto;
}

div.table.room-occupancy-tables {
    max-width: none;
}

.table-zoom-controls {
    display: none;
}

.table > .print-link {
    width: calc(100% - 90px);
    margin: 10px 0 0 90px;
    box-sizing: border-box;
    text-align: center;
}

th.timetable {
	background : var(--timetable-blue);
	border : 1px solid black;
	font-size : 10pt;
        text-align: center;
	width: auto;
}

td.timetable {
        height: 70px;
	font-size : 9pt; 
	vertical-align : middle; 
	text-align : center; 
	background : #ffffff;
	border : 1px solid black;
	padding : 5px;
	
	/* dozvoljava prelamanje teksta */
	white-space: normal;
	word-wrap: break-word;
}

th.daily {
	background : var(--timetable-blue);
}

td.year {
	font-size : 10pt;
	background : var(--timetable-blue);
}

td.programme {
	font-size : 10pt;
	background : #AAAAAA;
}

span.p {
    color: blue;
    font-weight: bold;
}

span.v {
    color: red;
}

span.k {
    color: green;
}

span.o {
    color: black;
}

div.daily {
    display: table;
    margin-left: 0;
    margin-right: auto;
    margin-bottom: 20px;
    padding: 10px;
}

table.timetable tr > th:first-child {
    width: 90px;
}

@media (max-width: 700px) {
    html, body {
        max-width: 100%;
        overflow-x: hidden;
    }

    div.table {
        margin-left: 0;
        margin-right: 0;
    }

    .touch-device .table-zoom-controls {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        margin-bottom: 5px;
    }

    .touch-device .table-zoom-controls button {
        width: 26px;
        height: 24px;
        padding: 0;
        border: 1px solid #aaa;
        border-radius: 3px;
        background: #f5f5f5;
        color: #222;
        font-size: 16px;
        line-height: 1;
    }

    .touch-device .table-zoom-controls .zoom-level {
        min-width: 42px;
        text-align: center;
        font-size: 11px;
    }

    body:has(.elective-controls) > h2,
    body:has(.elective-controls) > p.version {
        width: 100%;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    h2 {
        font-size: 1.15em;
    }

    td.timetable {
        padding: 4px;
    }

    table.timetable {
        width: 1200px;
        min-width: 1200px;
    }
}

@media (min-width: 701px) and (max-width: 900px) {
    table.timetable {
        min-width: 1050px;
    }
}