html {
    font-family: "Roboto", sans-serif;
}

input[type="checkbox"] + span:not(.lever) {
    padding-left: 25px;
}
input::placeholder {
    color: #999;
}

.container {
    margin-bottom: 20px;
}

.padded {
    padding: 5px;
}

.collapsible .collapsible-body{
  padding:0;
}
.vertical-space {
    height: 2000px; /* allows zoom out on mobile */
}

.nobr { white-space: nowrap }

.pagination li.active {
    background-color: #26a69a;
    cursor: pointer;
}

.pagination li:not(.disabled):not(.active):hover {
    background-color: #eee;
}

.switch a:not(.btn) {
    margin: 0 !important;
}

hr.separator {
    border: 0;
    border-top: 1px solid rgba(160,160,160,0.4);
    height: 0;
}

.disclaimer {
    color: #999;
    font-size: 0.8em;
    line-height: 1.3em;
    margin-top: -5px;
}

code {
    background: #e0e0e0;
    display: inline-block;
    padding: 2px;
    border-radius: 2px;
}
span.tripple-icon {
    position: relative;
    height: 48px;
    line-height: 48px;
    width: 24px;
}
span.tripple-icon i {
    position: absolute;
    background: white;
    border-radius: 3px;
    border: 1px solid;
}
span.tripple-icon i:nth-child(1) {
    left: 3px;
    bottom: calc(50% + 6px - 16px);
    /*color: rgba(0,255,0,0.5);*/
}
span.tripple-icon i:nth-child(2) {
    left: 0px;
    bottom: calc(50% + 3px - 16px);
    /*color: rgba(255,0,0,0.5);*/
}
span.tripple-icon i:nth-child(3) {
    left: -3px;
    bottom: calc(50% - 16px);
    /*color: rgba(0,0,255,0.5);*/
}

dt {
    font-weight: bold;
    margin-top: 10px;
}

/* navigation and such */
nav {
    background-color: #555;
}
nav.old-semester {
    background: repeating-linear-gradient( -45deg, #555, #555 10px, #666 10px, #666 20px);
    color: #000;
}
.global-note {
    position: fixed;
    padding: 5px 10px;
    top: 65px;
    right: 6px;
    width: 150px;
    z-index: 2;
}
.card i.close-icon {
    position: absolute;
    cursor: pointer;
    font-size: 12pt;
    top: 5px;
    right: 5px;
}
@media only screen and (max-width: 600px) { .global-note { top: 57px; } }
#weird-week-note { width: 250px; }

#urnik-logo {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform: none;
    left: 250px;
    right: 150px;
}
@media only screen and (max-width: 992px) {
    #urnik-logo {
        left: 150px;
        right: 150px;
    }
}
@media only screen and (max-width: 600px) {
    #urnik-logo {
        left: 108px;
        right: 75px;
        text-align: left;
    }
}
#urnik-logo i {
    display: inline;
    float: none;
    margin-right: 5px;
}
#menu-button {
    display: block;
}
#menu-button span {
    vertical-align: middle;
    font-size: 20pt;
    height: 64px;
    line-height: 64px;
    display: block;
    float: right;
    margin-left: 16px;
    margin-right: 16px;
}
#menu-button i {
    display: inline-block;
}
.side-icon {
    margin: 0 32px 0 0;
    color: rgba(0, 0, 0, 0.54);
    float: left;
}

.sidenav, .sidenav-overlay {
    top: 64px;
}
@media only screen and (max-width: 600px) {
    .sidenav, .sidenav-overlay {
        top: 56px;
    }
}

.dropdown-content li > a {
    color: #039be5;
}

.dropdown-content li.disabled, .dropdown-content li.disabled > a {
    color: #5e5e5e;
    cursor: default;
}

#search-wrapper {
    padding: 0px 0px 5px 5px;
    overflow: hidden;
}
#search-wrapper input[type="search"] {
    padding-left: 2.5rem;
    width: calc(100% - 2.5rem);
    height: 64px;
    color: #fff;
    margin-bottom: 0px;
}

#search-wrapper input[type="search"]:focus {
    border-bottom: 1px solid #039be5;
    color: #333;
    box-shadow: 0 1px 0 0 #039be5;
}
@media only screen and (max-width: 600px) {
    #search-wrapper input[type="search"]::placeholder {
        color: transparent;
    }
    #search-wrapper input[type="search"] {
        height: 56px;
    }
}
#search-wrapper form label {
    margin-top: -12px;
}

#search-wrapper form label i {
    font-size: 28px;
    color: #fff;
}

#search-wrapper ul.autocomplete-content {
    margin-bottom: 0px;
    position: initial;
}

#search-wrapper ul.autocomplete-content li {
    min-height: 0px;
    padding: 5px;
}
#search-wrapper ul.autocomplete-content li > span {
    font-weight: normal;
    padding: 3px 5px;
    font-size: 14px;
    color: rgba(0,0,0,0.87);
}
#search-wrapper ul.autocomplete-content li > span > span.highlight {
    color: #039be5;
}
#admin-dropdown .dropdown-button {
    display: inline-block;
    padding: 0 10px;
}
#admin-dropdown .dropdown-button #user-name {
    margin-right: 15px;
}
#admin-dropdown .dropdown-button #dropdown-arrow {
    margin-left: 5px;
}
#admin-dropdown .dropdown-button #mode-indicator {
    margin-left: 0px;
}

/* urnik */
.urnik-wrapper {
    position: absolute;
    min-width: 1024px;
    min-height: 600px;
    top: 64px;
    bottom: 0px;
    width: 100%;
}

#urnik {
    position: absolute;
    left: 2.5%;
    top: 5.5%;
    width: 78%;
    height: 92%;
    background: white;
}

#urnik.cel {
    width: 95%;
}

.right-panel {
    position: absolute;
    left: 81.4%;
    top: 0%;
    width: 18%;
    height: 100%;
}

#informacije {
    background: #fff;
    overflow-y: auto;
    overflow-x: hidden;
}

#informacije .collapsible-header {
    white-space: nowrap;
}

#informacije .collapsible-body {
    padding: 5px 20px;
}

#informacije .collapsible-body .collection-item {
    padding: 5px 0px;
}

#dnevi {
    position: absolute;
    left: 3%;
    top: 0%;
    width: 97%;
    height: 100%;
    color: #333;
}

#ure {
    position: absolute;
    left: 0%;
    top: 5%;
    width: 100%;
    height: 95%;
    color: #333;
}

.poravnaj-na-termine {
    position: absolute;
    left: 3%;
    top: 5%;
    width: 97%;
    height: 95%;
}

.ura {
    position: absolute;
    border-bottom: solid 2px #ccc;
    width: 100%;
}

.ura-dashed {
    position: absolute;
    border-bottom: dashed 1px #ddd;
    width: 97%;
    left: 3.00%;
}

.ura span {
    width: 3%;
    text-align: right;
    position: relative;
    display: block;
    bottom: -1.5em;
    padding-right: 0.25em;
}

.dan {
    position: absolute;
    text-align: center;
    top: 0;
    bottom: 0;
    border-left: solid 1px #ddd;
    border-right: solid 1px #ddd;
    width: 20%;
}

.dan-lih {
    background-color: #f2f2f2;
}

/* pozicioniranje srečanj */
.srecanje-absolute-box {
    position: absolute;   /* spodaj je pixel perfect pozicioniranje boxov */
    padding-top: 3px;     /* izberi si koliko želiš margin od roba "dneva" */
    padding-bottom: 4px;  /* = top + 1, ker imamo spodaj 1px borderr */
    padding-left: 3px;    /* izberi si spacing med srecanji */
    padding-right: 0px;   /* vazna je samo vsota left + right, zato right = 0  */
}

#informacije .srecanje-absolute-box {
    position: relative;
    height: 70px;
}

.srecanje-absolute-box.leftmost {
    padding-left: 4px;  /* postavi levi rob od dneva na top + 1 = right + 1, ker imamo 1px borderja */
}

.srecanje-absolute-box.rightmost {
    padding-right: 3px;  /* postavi desni rob od dneva na top */
}

.srecanje-absolute-box .srecanje {  /* absolutno, da mamo proste roke pri ostalem */
    background: #eee;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 2px;
}

.srecanje-absolute-box .srecanje .ucitelj,
.srecanje-absolute-box .srecanje .ucilnica {  /* ucilnica in ucitelj sta spodaj levo in desno */
    position: absolute;
    bottom: 0px;
    line-height: 17px;
    height: 17px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.srecanje-absolute-box .srecanje .ucitelj {
    left: 3px;
    width: calc(95% - 30px);
}

.srecanje-absolute-box .srecanje .ucilnica {
    right: 3px;
    width: 30px;
    text-align: right;
}

.srecanje-absolute-box .srecanje .main-box {  /* glavni box je vse razen zadnje vrstice */
    position: absolute;
    top: 0px;
    left: 3px;
    bottom: 17px;
    right: 3px;
    line-height: 16px;
    overflow: hidden;
    /*word-break: break-all;*/
}

.srecanje-absolute-box .srecanje .main-box .info-box {
    float: right;
    /*position: absolute;*/
    right: 0px;
    width: 15px;
    height: 15px;
    margin-top: 2px;
    cursor: pointer;
    /*border: 1px red solid;*/
}

/* pisave & barve v srecanju */
.srecanje-absolute-box .srecanje .ucitelj,
.srecanje-absolute-box .srecanje .ucilnica,
.srecanje-absolute-box .srecanje .main-box .letniki {
    font-size: 0.8em;
}

.srecanje-absolute-box .srecanje .ucitelj,
.srecanje-absolute-box .srecanje .ucilnica,
.srecanje-absolute-box .srecanje .main-box .predmet .tip {
    color: #555;
    font-weight: normal;
}

.srecanje-absolute-box .srecanje .predmet {
    font-size: 0.9em;
    font-weight: bold;
}

.srecanje-absolute-box .srecanje a {
    color: #333;
}

.srecanje-absolute-box .srecanje a:hover, .urejanje a {
    color: #039be5;
}

.urejanje button {
    cursor: pointer;
}

.srecanje-absolute-box .srecanje .main-box .info-box i {
    font-size: 12pt;
    color: #555;
}

.termin {
    position: absolute;
    /*opacity: 0.6;*/
}

.legenda {
    text-align: center;
}

.termin button {
    border-style: none;
    width: 100%;
    height: 100%;
}


.zaseden {
    background: rgba(255, 0, 0, 0.5);
}

.prosto {
    background: rgba(0, 128, 0, 0.5);
}

.proste_alternative {
    background: rgba(255, 165, 0, 0.5);
}

.deloma {
    background: repeating-linear-gradient(
      -45deg,
      rgba(0, 128, 0, 0.5),
      rgba(0, 128, 0, 0.5) 50%,
      rgba(255, 0, 0, 0.5) 50%,
      rgba(255, 0, 0, 0.5) 100%
    );
}
.proste_le_alternative {
    background: repeating-linear-gradient(
      -45deg,
      rgba(255, 165, 0, 0.5),
      rgba(255, 165, 0, 0.5) 50%,
      rgba(0, 128, 0, 0.5) 50%,
      rgba(0, 128, 0, 0.5) 100%
    );
}
.deloma_proste_alternative {
    background: repeating-linear-gradient(
      -45deg,
      rgba(255, 165, 0, 0.5),
      rgba(255, 165, 0, 0.5) 50%,
      rgba(255, 0, 0, 0.5) 50%,
      rgba(255, 0, 0, 0.5) 100%
    );
}
.vse_mogoce {
    background: repeating-linear-gradient(
      -45deg,
      rgba(255, 165, 0, 0.5),
      rgba(255, 165, 0, 0.5) 33%,
      rgba(255, 0, 0, 0.5) 33%,
      rgba(255, 0, 0, 0.5) 66%,
      rgba(0, 128, 0, 0.5) 100%,
      rgba(0, 128, 0, 0.5) 100%
    );
}
.mozne_ucilnice {
    visibility: hidden;
    position: absolute;
    left: 20px;
    /*height: 0;*/
    background: white;
    z-index: 100;
    width: 200px;
}
.premakni_srecanje:hover .mozne_ucilnice {
    visibility: visible;
}
.urejanje {
    position: absolute;
    visibility: hidden;
    /*top: 100%;*/
    left: 100%;
    width: 100px;
    top: 0;
    background: white;
    /*height: 100%;*/
    z-index: 100;
}
.urejanje a {
    display: block;
}
#informacije .urejanje {
    left: 0;
    width: 100px;
    top: 100%;
    background: white;
    /*height: 100%;*/
    z-index: 100;
}
.srecanje:hover {
/*            width: 20% !important;
    z-index: 100;
    background: #ddd;
*/        }
.srecanje:hover .urejanje {
    visibility: visible;
}
.urejanje form {
    /*display: inline;*/
}
.urejanje button {
    border-style: none;
    display: inline;
    background: none;
    padding: 0;
    color: rgb(3, 155, 229);
}
.termin:hover .izbira_ucilnice {
    position: relative;
    visibility: visible;
    z-index: 1000000 !important;
}
.izbira_ucilnice {
    position: absolute;
    visibility: hidden;
}
.izbrana_ucilnica {
    float: left;
    width: 25%;
}
.ustrezna.deloma_prosta button, .ustrezna.deloma_prosta {
    background: repeating-linear-gradient(
      -45deg,
      rgba(0, 128, 0, 1),
      rgba(0, 128, 0, 1) 50%,
      rgba(255, 0, 0, 1) 50%,
      rgba(255, 0, 0, 1) 100%
    );
}
.ustrezna.zasedena button, .ustrezna.zasedena {
    background: red;
}
.ustrezna.prosta button, .ustrezna.prosta {
    background: green;
}
.alternativa.deloma_prosta button, .alternativa.deloma_prosta {
    background: repeating-linear-gradient(
      -45deg,
      orange,
      orange 50%,
      rgba(255, 0, 0, 1) 50%,
      rgba(255, 0, 0, 1) 100%
    );
}
.alternativa.zasedena button, .alternativa.zasedena {
    background: red;
}

.alternativa.prosta button, .alternativa.prosta {
    background: orange;
}

.proste-ucilnice-wrapper {
    padding-left: 1px;
    padding-bottom: 1px;
}

.proste-ucilnice-container {
    width: 100%;
    height: 100%;
    position: relative;
    font-size: 8pt;
    line-height: 10pt;
    padding: 2px 4px;
}

.proste-ucilnice-container .ucilnice-list {
    margin: 0;
}

.proste-ucilnice-container .ucilnice-list .ucilnica {
    position: relative;
    display: inline-block;
}

.proste-ucilnice-container .proste-ucilnice-list .ucilnica-stanje-rezervirana,
.proste-ucilnice-container .proste-ucilnice-list .ucilnica-stanje-zasedena {
    color: #999;
}

.proste-ucilnice-container .ucilnice-list .ucilnica a {
    color: inherit;
}

.proste-ucilnice-container .ucilnice-list .ucilnica .ucilnica-tooltip {
    display: none;
    position: absolute;
    width: 200px;
    left: -200%;
    background: #fff;
    border-radius: 1px;
    bottom: 20px;
    font-size: 12px;
    padding: 10px;
    color: #333;

    /* shadow box */
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    transition: box-shadow .25s, -webkit-box-shadow .25s;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2);
    z-index: 998; /* navbar fized = 997 */
}

.proste-ucilnice-container .ucilnice-list .ucilnica .hover-area {
    display: none;
    position: absolute;
    width: 125px;
    left: -160%;
    height: 50px;
    bottom: 10px;
    background: transparent;
}

.proste-ucilnice-container .ucilnice-list .ucilnica .ucilnica-ime {
    border-radius: 2px;
}

.proste-ucilnice-container .ucilnice-list .ucilnica:hover .ucilnica-ime {
    background-color: #e0e0e0;
}

.proste-ucilnice-container .ucilnice-list .ucilnica:hover .ucilnica-tooltip {
    display: block;
}

.proste-ucilnice-container .ucilnice-list .ucilnica:hover .hover-area {
    display: block;
}

.proste-ucilnice-container .ucilnice-list .ucilnica .ucilnica-tooltip a:hover {
    text-decoration: underline;
}
.proste-ucilnice-container .ucilnice-list .ucilnica .ucilnica-tooltip i {
    font-size: 12pt;
    margin-bottom: 1px;
    display: inline-block;
    vertical-align: middle;
}

#proste-ucilnice-panel {
    padding-top: 12px;
    width: 17.3%;
}

#proste-ucilnice-panel .card {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
}

#proste-ucilnice-panel .card label {
    color: #333;
}

#proste-ucilnice-panel .card .card-action {
    border-top: 1px solid rgba(160, 160, 160, 0.4);
}

#proste-ucilnice-panel .card .card-action,
#proste-ucilnice-panel .card .card-content {
    padding: 12px;
}

#proste-ucilnice-panel .card .card-action .input-field {
    margin-top: 0;
}

#proste-ucilnice-panel .card .card-action .btn {
    width: 100%;
}

#proste-ucilnice-panel .card .card-action #teden-dropdown-btn {
    padding: 0 1rem;
    width: 100%;
}
#proste-ucilnice-panel .card .card-action #teden-dropdown-btn i {
    margin-left: 5px;
    margin-right: -5px;
}
#proste-ucilnice-panel .card .card-action #teden-dropdown-btn span {
    width: 83%;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#teden-dropdown > li {
    min-height: 30px;
    overflow: hidden;
    white-space: nowrap;
}

#teden-dropdown > li > a {
    padding: 6px 15px 6px 15px;
    margin: 0;
    color: #333;
    font-size: 11pt;
    text-align: right;
    text-transform: none;
}

#proste-ucilnice-panel input[type="range"] {
    margin-bottom: -5px;
    margin-left: 10px;
}

#proste-ucilnice-panel .switch-option {
    margin: 10px 0px;
}

#proste-ucilnice-panel .switch-option .switch {
    margin-left: 15px;
}

#proste-ucilnice-panel label input[type="checkbox"] + span {
    padding-left: 25px;
    margin-right: 12px;
}

/* front page */
.oznaci-vec {
    position: relative;
    float: right;
    font-weight: normal;
}

.oznaci-vec > a, .oznaci-vec > button {
    position: absolute;
    right: 0px;
    top: 6px;
    white-space: nowrap;
}

.oznaci-vec > a > i.material-icons, .oznaci-vec > button > i.material-icons {
    margin-right: 5px;
}

/* front page */
#firstpage-menu tbody tr,
table.highlight tbody tr {
    border-bottom: none;
}

#firstpage-menu tr th,
table.highlight tr th {
    padding-bottom: 3px;
}

#firstpage-menu tbody tr td ul {
    list-style-type: none;
    margin: 0px;
}
#firstpage-menu tbody tr td ul li {
    display: block;
    height: 55px;
}
#firstpage-menu tbody tr td ul li a i {
    color: inherit;
}

/* kombiniran pogled */
#kombiniran-pogled-text input {
    margin-right: 10px;
    margin-bottom: 10px;
}
#kombiniran-pogled-form div.container {
    width: 95%;
}
#kombiniran-pogled-form div.row {
    margin-bottom: 0px;
}
#kombiniran-pogled-form table td {
    padding: 0px 2px;
}
#kombiniran-pogled-form table th {
    padding: 4px 2px 0px;
}
#kombiniran-pogled-form table tbody tr:first-child td {
    padding-top: 4px;
}
#kombiniran-pogled-form table.select tbody tr td .select-wrapper > ul > li {
    min-height: 30px;
}
#kombiniran-pogled-form table.select tbody tr td .select-wrapper > ul > li > span {
    padding: 5px 10px;
}

/* printall */
.printall-table {
    width: auto;
}
.printall-table th, .printall-table td {
    padding: 20px 30px;
}
.printall-table th, .printall-table td:first-child {
    text-transform: capitalize;
    font-weight: bold;
    font-size: 1.2em;
}

.printall-table td:first-child, .printall-table th:first-child {
    border-right: 1px solid #d0d0d0;
}

.printall-table a {
    display: block;
    line-height: 44px;
}
.printall-table a span.tripple-icon {
    margin-right: 15px;
}

/* rezervacije */
.errorlist {
    overflow: hidden;
}
.errorlist li {
    background-color: #ffdfe3;
    color: #860b12;
    border: 1px solid #860b12;
    padding: 5px 10px;
    margin: 3px 0px;
}

#rezervacije-list .collapsible-body {
    padding-top: 0;
}
#rezervacije-list li.collection-item {
    position: relative;
}
#rezervacije-list span.anchor {  /* offset fot anchors to work correctly due to fixed header */
    position: absolute;
    top: -68px;
}

.rezervacije-form > li {
    margin-right: 30px;
    margin-top: 30px;
}

.rezervacije-form > li > label {
    font-size: 1rem;
    font-weight: bold;
    color: #333;
}
.rezervacije-form #id_ucilnice {
    margin-top: 10px;
}
.rezervacije-form #field-id_ucilnice #id_ucilnice li {
    display: inline;
}

.rezervacije-form #field-id_ucilnice #id_ucilnice li label {
    color: #333;
}

.rezervacije-form #field-id_ucilnice #id_ucilnice li label input[type="checkbox"] + span {
    padding-left: 25px;
    margin-right: 12px;
}
.rezervacije-form > li > .select-wrapper > ul > li {
    min-height: 30px;
}
.rezervacije-form > li > .select-wrapper > ul > li > span {
    padding: 3px 10px 2px 10px;
}
.rezervacije-form > li > .select-wrapper > ul > li > span > label > input[type=checkbox] + span {
    padding-left: 25px;
    color: #333;
}
.rezervacije-form #field-id_do,
.rezervacije-form #field-id_od,
.rezervacije-form #field-id_dan,
.rezervacije-form #field-id_dan_konca {
    float: left;
}
.rezervacije-form #field-id_opomba,
.rezervacije-form #field-id_od {
    clear: both;
}
.rezervacije-form #field-id_opomba {
    display: inline-block;
    width: 100%;
}
#nepotrjene-rezervacije tr td {
    padding-top: 5px;
    padding-bottom: 5px;
}
#nepotrjene-rezervacije tr td a i {
    vertical-align: middle;
}
#nepotrjene-rezervacije tr td span.st-konfliktov {
    vertical-align: super;
}
#nepotrjene-rezervacije tbody tr {
    border-bottom: none;
    border-top: 1px solid rgba(0,0,0,0.12);
}

#nepotrjene-rezervacije tr.konflikti {
    border-top: none;
}
.cancel.btn {
    background-color: #c62828;
    white-space: nowrap;
}
.cancel.btn i.left {
    margin-left: -10px;
    margin-right: 5px;
}
.cancel.btn:hover,
.cancel.btn:active {
    background-color: #f44336;
}

.tedenski-pogled {
    margin-top: 5px;
    text-align: center;
    z-index: 1;
    position: relative;
    white-space: nowrap;
}
.tedenski-pogled .btn {
    height: 28px;
    line-height: 28px;
}
.tedenski-pogled #teden-dropdown-btn {
    min-width: 300px;
    margin: 0px 10px;
}
.tedenski-pogled #teden-dropdown > li.izbran > a {
    color: #999;
}
.oddelki{
    padding: 15px 5px;
	display: table-cell;
	text-align: left;
	vertical-align: middle;
}
.inline-icon {
   vertical-align: top;
   font-size: 15px !important;
}