#dostopnost {
	display: block;
	position: fixed;
	top: 113px;
	left: 0;
    width: 54px;
	height: 54px;
    background-color: #96bf3d;
	border-top-right-radius: 0.15rem; 
	border-bottom-right-radius: 0.15rem;
	padding: 8px;
	z-index: 30;
}

#open-accessibility-icon {
	display: block;
	position: relative;
    width: 38px;
	height: 38px;
	font-size: 1em;
	background-color: transparent;
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	box-shadow: none; 
    cursor: pointer;
}


#open-accessibility-icon img { width: 38px; height: 38px; }
#close-accessibility { position: relative; font-family: var(--font-family-tekst); color: #ffffff; font-size: 1em; font-weight: var(--font-weight-button); background-color: #96bf3d; border: none; border-radius: 0.2rem; padding: 0.5em 1em 0.5em 1em; margin-top: 1em; margin-bottom: 1em; cursor: pointer; }

#dostopnost_toolbar {
	position: fixed;
	top: 167px;
	left: -300px;
	width: 250px;
	height: fit-content;
/*	font-size: 1.1rem;*/
	text-align: left;
	background-color: #fff;
	padding: 20px;
	border: 3px solid #96bf3d;
	overflow-x: hidden;
	box-shadow: 0px 0px 30px #00000029;
	transition: 0.5s;
	z-index: 30;

    -webkit-transition: left 0.25s ease-in-out;
    -moz-transition: left 0.25s ease-in-out;
    -ms-transition: left 0.25s ease-in-out;
    -o-transition: left 0.25s ease-in-out;
    transition: left 0.25s ease-in-out;
}
#dostopnost_toolbar a { font-size: 0.8em; }
#dostopnost_toolbar p { margin-top: 0.5em;  margin-bottom: 0; }

#dostopnost_toolbar.show { left: 0; }
#dostopnost_toolbar > div { display: flex; padding: 10px; transition: all 200ms ease-in-out; }
#dostopnost_toolbar > div.btn { }
#dostopnost_toolbar > div:hover { scale: 1.05; }
#dostopnost_toolbar > div .icon { width: 25px; height: 25px; margin-right: 10px; }


html.white-on-black {
    --background-color: #000;
	--background-color-white: #000;
    --color-tekst: #fff;
	--color-footer: #fff;
	--podlaga-zelena: #000;
	--barva-zelena: #fff;
}



.white-on-black #dostopnost_toolbar > div .icon path { stroke: #fff; }
.white-on-black #close-accessibility { background-color: black; }
.white-on-black #dostopnost { background-color: black; border: 1px solid white; }

#dostopnost_toolbar > div .icon.active path { stroke: var(--barva-logo-tekst); }
.contrast #dostopnost_toolbar > div .icon.active path { stroke: var(--barva-logo-tekst); }
.white-on-black #dostopnost_toolbar > div .icon svg { fill: #fff; }
#dostopnost_toolbar > div .icon.active-fill svg { fill: var(--barva-logo-tekst); }
.contrast #dostopnost_toolbar > div .icon.active-fill svg { fill: var(--barva-logo-tekst); }
#dostopnost_toolbar > div .icon svg { width: 100%; height: 100%; }
#dostopnost_toolbar > div span { xfont-size: 1.059rem; cursor: pointer; }
#dostopnost_toolbar > div span.active, #dostopnost_toolbar > div span.active-fill { color: var(--barva-logo-tekst); }
.contrast #dostopnost_toolbar > div span.active, .contrast #dostopnost_toolbar > div span.active-fill { color: var(--barva-logo-tekst); }

.grayscale { filter: grayscale(1);  }

:focus { box-shadow: none; outline: none; }

.keyboard-focus :focus {
  outline: auto;
  padding: 10px;
  border: solid red 2px;
}

.contrast .izpostavljeno_vsebina { background: linear-gradient(0deg, hsla(0, 0%, 50%, .9), hsla(0, 0%, 50%, .9)), rgba(0, 0, 0, .9);  }
.contrast #vsebina ul { list-style-type: disc; }
.contrast #footer ul { list-style-type: disc; } 



/*
.white-on-black { background-color: black !important; }
.white-on-black #vrstica1-wrap { background-color: black !important; }
.white-on-black #vrstica2-wrap { background-color: black !important; }
*/

.white-on-black a { color: #0ff !important; }
.white-on-black img { filter: brightness(0.9) contrast(1.1); }

.white-on-black #desno { background-image: none; background-color: var(--background-color-white); }
.white-on-black #footer-wrap { background-image: none; background-color: var(--background-color-white); border-top: 1px solid #ffffff !important; }
.white-on-black #seznam-programi .item a .slika { background-image: none !important; background-color: var(--background-color-white); border: 1px solid #ffffff !important; }
.white-on-black #dogodki .vsebina { background-image: none !important; background-color: var(--background-color-white); border: 1px solid #ffffff !important; }
.white-on-black #kviz-wrap { background-image: none !important; background-color: var(--background-color-white); border: 1px solid #ffffff !important; }
.white-on-black #kviz-wrap .opis { background-color: var(--background-color-white); }
.white-on-black button:not(#open-accessibility-icon) { color: #fff; background-color: var(--background-color-white); border: 1px solid #ffffff !important; }

.white-on-black #mobilni-wrap .trigger-icon .line { background-color: #ffffff !important; }
.white-on-black input { border: 1px solid #ffffff !important; }
.white-on-black a { color: #ffffff !important; }
.white-on-black h1, .white-on-black h2, .white-on-black h3, .white-on-black h4 { color: #ffffff !important; }
.white-on-black #dostopnost_toolbar { background-color: #000 !important; box-shadow: 0px 0px 30px #ffffff;}
.white-on-black #vrstica1-wrap { background-color: black !important; border-bottom: 1px solid #ffffff !important; }
.white-on-black #newsletter-wrap { background-color: black !important; border-top: 1px solid #ffffff !important; }
/* .white-on-black svg { fill: #ffffff; } */
.white-on-black input::placeholder { color: #ffffff; opacity: 1; }
/* .white-on-black #menu1 .opcije li.klasicen.active > a{ background-color: black !important; } */
/* .white-on-black .izpostavljeno_vsebina { background-color: black;  }
.white-on-black .kartica { background-color: black;  }
.white-on-black .kartica { border-color: #ffffff;  } */

.white-on-black table thead { background-color: black; }
.white-on-black td, th { border-bottom: 1px solid #ffffff;  }
.white-on-black tr:nth-child(even){background-color: black;}
.white-on-black tr:hover { background-color: black;}
.white-on-black thead tr:hover { background-color: black;}
.white-on-black th { background-color: black; }


@media only screen and (max-width: 1170px) {
	
	#dostopnost { top: 100px; }
	#dostopnost_toolbar { top: 157px; }
}

@media only screen and (max-width: 790px) {
	
	#dostopnost { top: 70px; }
	#dostopnost_toolbar { top: 124px; }
}