<style type="text/css">
:root {--bwd: 560px; --bc1: #700; --bc2: #070; --bc3: #007; --bc4: #fff; 
	   --co0: #000;  --co1: #000; --co2: #000; --co3: #000; --co4: #000; 
	   --cb0: #000;  --cb1: #000; --cb2: #000; --cb3: #000; --cb4: #000; }

body { margin: 0px; padding: 0px; border:0px solid; }

																					/* --- osnovna okna spletke ---	*/
#vse { position: relative; width:var(--bdw); height: 100vh;  
		margin:auto; padding: 0px; border:0px solid; 
		font-family: Arial, Helvetica, serif; font-size: 100%;}
#gor { position: relative; width:98%; height: 8%;  color: var(--co1);
		padding: 1%; border:0px solid;
		font-size: 120%;}
#med { position: relative; width:98%; height: 80%; overflow: auto; color: var(--co2);
		padding: 1%; border:0px solid;}
#dol { position: relative; width: 98%; height: 6%; overflow: hidden; color: var(--co3);
		padding: 1%;  border:0px solid; display: flex;  align-items: center;}
#gib { position: absolute; width: 64%; height: 80%; top: 9.3%; right: 0%; visibility:hidden;
		padding:1%; border: 0px dotted; overflow-x: hidden; overflow-y: auto;  color:  var(--co4);}
#gla { ; font-size: 140%; }

/* gumb */																					/* --- določitev gumba Gib ---	*/
.-bg { display: block; height: 6vh; width: 100%; font-family: sans-serif; margin: 2px; 
	   text-align: center; vertical-align: middle; line-height: 6vh;  font-size: 4vh; 
	   background: var(--bc3);color: var(--bc2);width: 90%;border-radius: 5px;border-style: outset;}
.-bg:hover 
	 { background: var(--bc4); color: var(--bc1); border-style: inset;}
._bg { display: block; height: 6vh; width: 100%; font-family: sans-serif; margin: 2px; 
	   text-align: center; vertical-align: middle; line-height: 6vh;  font-size: 4vh; 
	   background: var(--bc4);color: var(--bc1);width: 90%;border-radius: 5px;border-style: outset;}
._bg:hover 
	 { background: var(--bc3); color: var(--bc2); border-style: inset;}
																					/* --- za sklopne opise 2.0 ---	*/
.m-op { margin: 10px 0px 0px; padding: 2px 5px; width:98%; border: none; outline: none; 
		text-align: left; font-size: 100%; background-color: var(--bc4); color:  var(--co0); }
.m-op:hover { background-color: var(--bc3); }
.g-op { margin: 10px 0px 0px; padding: 2px 5px;  width:98%; border: none; text-align: left; 
		outline: none; font-size: 100%; background-color: var(--bc2); color:  var(--co0); }
.g-op:hover { background-color: var(--bc3); }
/* sklopni opisi  s funkcijo sklOP() */
.o-av
.o-po {display: none;  overflow: hidden; font-size: 100%; }
.o-qo {display: block; overflow: hidden; font-size: 100%; }
																					/* --- za sklopne opise 2.1 ---	*/
.m-op, .g-op 	{ display: flex;}
.m-op em:nth-of-type(1), .g-op em:nth-of-type(1)  {flex-grow: 7; }
.m-op em:nth-of-type(2), .g-op em:nth-of-type(2)  {flex-grow: 1;  text-align: right; padding-right:16px;}
aside  			{padding-left: 3%;}
aside>dd 		{margin: 0px; }
aside>dd>li {list-style-type: circle;}
/* sklopna navodila */
details > dd 		
		{margin: 1px;  font-size: 80%; padding-left:2vh;}
summary 
		{margin: 5px 0px 5px; padding: 2px 5px; width:98%; border: none; outline: none; 
		 text-align: left; font-size: 100%; background-color: var(--bc2); color:  var(--co0); }
summary:hover 
		{background-color: var(--bc3); }
/* --- izbor barvne palete ---	*/
.-bp {	display: flex; flex-wrap: nowrap; }
.-bp > div {
		width: 100px;margin: 0px 2px;text-align: center;line-height: 5.4vh; font-size: 5px;}
.-bp > div > div{
		margin: 0px;text-align: center;line-height: 1.7vh; font-size: 5px;}
</style>
