/*
// COLORS 
#003a5b | 0,58,91 | background 
*/

:root {
	--pale-blue-color: #8aadc4; /* RGB: 138,173,196 */
	--dark-blue-color: #003a5b; /* RGB: 0,58,91 */
	--dark-blue-color-rgb: 0, 58, 91;
	--rotation-speed: 12s;
}

* {
	box-sizing: border-box;
}

/* elementy  */
body {
	min-height: 100%;
	margin: 0;
	padding: 0;
	background-color: var(--dark-blue-color); 
	font-size: 12px;
	color: #FFF;
	font-weight: normal;
	text-decoration: none;
	font-family: Verdana, Tahoma, Arial, Helvetica, sans serif;
	border-color: #000;
	border : #000;
	scrollbar-Track-Color: #63879d;
	scrollbar-Shadow-Color: #63879d;
	scrollbar-Face-Color: var(--dark-blue-color);
	scrollbar-Highlight-Color: #63879d;
	scrollbar-3dLight-Color: #63879d;
	scrollbar-DarkShadow-Color: #63879d;
	scrollbar-Arrow-Color: #FFF;
}
body {
	overflow-x: hidden;
}
/* odkazy */
a {
	color: #63879d;
	font-weight: bold;
	text-decoration: none;
}
a:hover {
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
}

table {
	border-collapse: collapse;
}
.table-main {
	background: rgba(var(--dark-blue-color-rgb), 0.7);
}
.table-main > * > tr > td {
	padding: 15px 10px;
}
td {
	padding: ;
	font-size: 12px;
	color: #FFF;
}

.clearAll {
	display: block; width: 0px; height: 0px; font-size: 0px; clear: both; float: none; margin: 0; padding: 0; line-height: 0;
}



/*************************************************************/
/**************			PAGE			************************************/
/*************************************************************/

.page {
	min-height: 100dvh;
	display: grid;
	grid-template-columns: 161px 1fr;
	/*grid-template-rows: 151px 1fr;*/
	grid-template-rows: 151px minmax(0, 1fr);
}

.page-header {
	position: relative;
	height: 151px;
	grid-column: 1 / 3;
	overflow: hidden;
	background: var(--dark-blue-color) url(../img/navig-background.png) top left no-repeat;
	/*border-bottom: 1px solid red;*/
}

.page-navigation {
	position: relative;
	overflow: hidden;
	background: var(--dark-blue-color) url(../img/bg_navig_left.gif) top left no-repeat;
	/*border-right: 1px solid red;*/
}

.page-content {
	position: relative;
	min-height: 100%;
	overflow: auto;
	background: var(--dark-blue-color) url(../img/bg_hlavni.gif) top left repeat-x;
}

/*************************************************************/
/**************			TOP NAVIGATION - MENU			********************/
/*************************************************************/

.navig_lang {
	position: absolute;
	top: 100px;
	left: 72px;
	z-index: 1;
}
.navig_lang a {
	margin: 0 1px;
}


.bg_navig_top {
}
.logo-aksos {
	position: absolute;
	top: 15px;
	left: 15px;
	z-index: 1;
}

.navig_top {
	position: absolute;
	top: 89px;
	left: 240px;
	z-index: 1;
}
.navig_top ul {
	display: flex;
	/*gap: 20px;*/
	margin: 0;
	padding: 0;
	list-style: none;
}
.navig_top li {
	width: 132px;
	height: 43px;
	padding-left: 12px;
	padding-right: 10px;
	padding-bottom: 5px;
	display: flex;
	align-items: flex-end;
	/*border: 1px solid yellow;*/
}
.navig_top a {
	font-size: 11px;
	font-weight: normal;
	color: var(--pale-blue-color);
	text-decoration: none;
}
.navig_top a:hover {
	font-weight: normal;
	color: #FFF;
	text-decoration: none;
}
.navig_top .active {
	background-color: var(--pale-blue-color); 
}
.navig_top .active a {
	color: #FFF;
}


/*************************************************************/
/**************			LEFT NAVIGATION			**************************/
/*************************************************************/

.navig_left_bg {
}
.side-navigation {
	width: 142px;
	margin-top: 20px;
	background: #003a5b;
	font-family: Verdana, Tahoma, Arial, sans-serif;
}

.side-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.side-navigation li {
	position: relative;
	height: 26px;
	line-height: 26px;
	padding-right: 27px;
	text-align: right;
	white-space: nowrap;
}

.side-navigation li::after {
	position: absolute;
	top: 50%;
	right: 6px;
	width: 11px;
	height: 5px;
	background: #075b85;
	content: "";
	transform: translateY(-50%);
}

.side-navigation a {
	display: block;
	font-size: 11px;
	color: #8bafc6;
	font-weight: normal;
	text-decoration: none;
}

.side-navigation li.active a {
	color: #FFF;
	font-weight: normal;
}

.side-navigation a:hover {
	color: #FFF;
}

/*************************************************************/
/**************			LEFT NAVIGATION - STARS			*******************/
/*************************************************************/

.stars-section {
	position: relative;
}
.rotating-stars {
	position: absolute;
	top: 0px;
	left: 30px;
	width: 230px;
	height: 230px;
	z-index: 0;
	pointer-events: none;
}
.rotating-stars .star {
	fill: var(--pale-blue-color);
}
.over-mask {
	position: absolute;
	top: 0px;
	left: 140px;
	width: 230px;
	height: 230px;
	background-color: var(--dark-blue-color);
}

/*************************************************************/
/**************			LEFT NAVIGATION - NAVIG			*******************/
/*************************************************************/


/*************************************************************/
/**************			CONTENT			**********************************/
/*************************************************************/

.content_bg {
}


/*************************************************************/
/**************			INTRO ARROW			*****************************/
/*************************************************************/

/* Invisible target corresponding to the arrow square in the AKSOS logo. */
#aksos-logo-arrow-target {
	position: absolute;
	top: 3.3%;
	left: 1.25%;
	width: 2.95%;
	aspect-ratio: 1 / 1;
	pointer-events: none;
}

/* Critical intro CSS should remain inline in <head>. */
#aksos-intro {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	overflow: hidden;
	background: #064764;
	opacity: 1;
	visibility: visible;
	pointer-events: all;
}

#aksos-intro.is-fading {
	animation: aksos-overlay-fade 0.9s linear forwards;
}

#aksos-intro-arrow,
.aksos-intro-arrow-trail {
	position: absolute;
	top: 0;
	left: 0;
	width: 100px;
	height: 125px;
	transform-origin: 0 0;
	will-change: transform, opacity;
}

#aksos-intro-arrow {
	z-index: 3;
}

.aksos-intro-arrow-trail {
	z-index: 2;
	opacity: 0;
}

#aksos-intro.is-running #aksos-intro-arrow {
	animation: aksos-arrow-flight 2.8s cubic-bezier(0.45, 0, 0.18, 1) forwards;
}

#aksos-intro.is-running .aksos-intro-arrow-trail-1 {
	animation: aksos-arrow-trail 2.8s 0.10s cubic-bezier(0.45, 0, 0.18, 1) forwards;
}

#aksos-intro.is-running .aksos-intro-arrow-trail-2 {
	animation: aksos-arrow-trail 2.8s 0.20s cubic-bezier(0.45, 0, 0.18, 1) forwards;
}

#aksos-intro-arrow .arrow-fill {
	animation: aksos-arrow-color 2.8s linear forwards;
}

@keyframes aksos-arrow-flight {
	0% {
		transform: translate(var(--start-x), var(--start-y)) scale(var(--start-scale));
	}
	100% {
		transform: translate(var(--end-x), var(--end-y)) scale(var(--end-scale));
	}
}

@keyframes aksos-arrow-trail {
	0% {
		opacity: 0;
		transform: translate(var(--start-x), var(--start-y)) scale(var(--start-scale));
	}
	9% {
		opacity: 0.52;
	}
	72% {
		opacity: 0.22;
	}
	100% {
		opacity: 0;
		transform: translate(var(--end-x), var(--end-y)) scale(var(--end-scale));
	}
}

@keyframes aksos-arrow-color {
	0%,
	56% {
		fill: #397b99;
	}
	100% {
		fill: #ffffff;
	}
}

@keyframes aksos-overlay-fade {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	#aksos-intro.is-running #aksos-intro-arrow,
	#aksos-intro.is-running .aksos-intro-arrow-trail,
	#aksos-intro-arrow .arrow-fill {
		animation-duration: 0.01ms;
	}

	#aksos-intro.is-fading {
		animation-duration: 0.01ms;
	}
}



/* odsazení */
.margin1	{ margin-left: 16px; }

/* formulář*/
input, textarea, select
					{	font-size: 11px; color: #000000; font-weight: normal; text-decoration: none;
						font-family:Arial,Helvetica,sans serif;	}
button		{	cursor: hand;
						font-size: 11px; color: #000000; font-weight: normal; text-decoration: none;	}
.vymaz		{	font-size: 10px; color: #990000; font-weight: bold; text-decoration: none;
						font-family:Arial,Helvetica,sans serif;	}
.uloz			{	font-size: 10px; color: #000099; font-weight: bold; text-decoration: none;
						font-family:Arial,Helvetica,sans serif;	}
.ok		{	font-size: 11px; color: #0000; font-weight: bold; text-decoration: none;cursor: hand;
						font-family:Arial,Helvetica,sans serif;
						border-left : thin solid #999999; border-top : thin solid #999999;	border-right : thin solid #990000;border-bottom : thin solid #990000;	}
.bglyell	{	background-color: #ffffcc;	}
.bglgree	{	background-color: #ddffdd;	}
.nap				{	background-color: Black;  border : 1px;  color : #111111; font-family: Verdana,Tahoma,Arial,Helvetica,sans serif;  background : #CCCCCC; 	     }
.packa 			{cursor: hand;}
.but				{  border : 0px ;  background : #990000;  color: #cccccc; font-weight: bold; }		
.but2				{  border : 0px ;  background : #990000;  color: #cccccc; font-weight: bold;  text-align : right;  }	

/* texty */
.leer			{	font-size: 1px;	}

.black8		{	font-size: 8px;color: #000000;text-decoration: none;	}
.black9		{	font-size: 9px;color: #000000;text-decoration: none;	}
.black9b	{	font-size: 9px;color: #000000;font-weight: bold;text-decoration: none;	}
.black10	{	font-size: 10px;color: #000000;	}
.black10b	{	font-size: 10px;color: #000000;font-weight: bold;text-decoration: none;	}
.black11	{	font-size: 11px;color: #000000;	}
.black12b	{	font-size: 12px;color: #000000;font-weight: bold;text-decoration: none;	}
.black17b		{ font-size: 17px; color: #000000; font-weight: bold;	}
.black18b		{ font-size: 18px; color: #000000; font-weight: bold;	}

.lblue11b		{ font-size: 11px; color: #8bafc6; font-weight: bold;	}
.lblue12b		{ font-size: 12px; color: #8bafc6; font-weight: bold;	}
.lblue14b		{ font-size: 14px; color: #8bafc6; font-weight: bold;	}
.lblue16b		{ font-size: 16px; color: #8bafc6; font-weight: bold;	}
.lblue18		{ font-size: 18px; color: #8bafc6; font-weight: normal;	}
.lblue18b		{ font-size: 18px; color: #8bafc6; font-weight: bold;	}
.lblue20b		{ font-size: 20px; color: #8bafc6; font-weight: bold;	}	

.mblue11b		{ font-size: 11px; color: #63879d; font-weight: bold;	}
.mblue12b		{ font-size: 12px; color: #63879d; font-weight: bold;	}
.mblue14b		{ font-size: 14px; color: #63879d; font-weight: bold;	}
.mblue16b		{ font-size: 16px; color: #63879d; font-weight: bold;	}
.mblue18		{ font-size: 18px; color: #63879d; font-weight: normal;	}
.mblue18b		{ font-size: 18px; color: #63879d; font-weight: bold;	}
.mblue20b		{ font-size: 20px; color: #63879d; font-weight: bold;	}	

.dblue11b		{ font-size: 11px; color: var(--dark-blue-color); font-weight: bold;	}
.dblue12b		{ font-size: 12px; color: var(--dark-blue-color); font-weight: bold;	}
.dblue14b		{ font-size: 14px; color: var(--dark-blue-color); font-weight: bold;	}
.dblue16b		{ font-size: 16px; color: var(--dark-blue-color); font-weight: bold;	}
.dblue18		{ font-size: 18px; color: var(--dark-blue-color); font-weight: normal;	}
.dblue18b		{ font-size: 18px; color: var(--dark-blue-color); font-weight: bold;	}
.dblue20b		{ font-size: 20px; color: var(--dark-blue-color); font-weight: bold;	}	


.white10		{ font-size: 10px; color: #ffffff; font-weight: normal; }
.white10b		{ font-size: 10px; color: #ffffff; font-weight: bold; }
.white11		{ font-size: 11px; color: #ffffff; font-weight: normal; }
.white11b		{ font-size: 11px; color: #ffffff; font-weight: bold; }
.white12		{ font-size: 12px; color: #ffffff; font-weight: normal; }
.white12j		{ font-size: 12px; color: #ffffff; font-weight: normal; text-align: justify;	}
.white12j1	{ font-size: 12px; color: #ffffff; font-weight: normal; text-align: justify; padding-right: 60px;	}
.white12b		{ font-size: 12px; color: #ffffff; font-weight: bold;	}
.white14		{ font-size: 14px; color: #ffffff; font-weight: normal;	}
.white14b		{ font-size: 14px; color: #ffffff; font-weight: bold;	}
.white18b		{ font-size: 18px; color: #ffffff; font-weight: bold;	}

.lyell11b		{ font-size: 11px; color: #ffffcc; font-weight: bold; }
.lgree11b		{ font-size: 11px; color: #ccffcc; font-weight: bold; }


/* obrázky */
.bgr600			{ background-image: url(../img/bg_600.gif); }
.bgrd				{ background-image: url(../img/bgr_d.gif); }