/*@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Display:ital,wght@0,100..900;1,100..900&display=swap');
body 			{ font-family: /*'Roboto Slab', serif;*/ "Noto Sans Display", sans-serif; margin: 5px 5px 5px 5px;}
/* Larger screens */
@media (min-width: 992px) { 
  body {font-size: 14px;} 
} 
/* Smaller tablets and mobiles */
@media (max-width: 768px) {
  body {font-size: 12px;}
}
.logo_header 		{  transition: 0.4s;  position: fixed;  top: 0px;  z-index: 99;  left: 0px;   right: 0px;  border-radius: 5px;  background-color: #f2f2f2;  margin: 5px 5px 10px 5px;  height:80px;  padding: 15px;  overflow:hidden;}
.logo_nadpis 		{  float:left;  left:0px;  height:100px;  width: 50%;  font-size: 70%;  text-align:center;}
.logo_nadpis h1 	{  border-radius: 5px;  padding:2px 2px 2px 2px;  margin: 1px 1px 3px 1px;  color:white;background:#333;}
.logo_nadpis h2 	{  border-radius: 5px;  padding:2px 2px 2px 2px;  margin: 1px 1px 3px 1px;  color:white;background:#777;}
.logo_nadpis h3 	{  border-radius: 5px;  font-size:140%;  padding:2px 2px 2px 2px;  margin: 1px 1px 3px 1px;  color:red;background:#DDD;}
.logo_logo 		{  float:right; height:100px; right:0px; width: 50%; top: 15px; font-size: 100%; text-align:center;}
.logo_kulate 		{  position: relative;  height:90px;  font-size: 100%;}

label 			{  padding: 12px 12px 12px 0;  display: inline-block; font-size:110%;}
input[type=text],input[type=number],input[type=email],input[type=tel],select,textarea {  
                           width: 100%;  padding: 12px;border: 1px solid #ccc;border-radius: 4px;box-sizing: border-box;
                           resize: vertical;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
input[type=submit] 	{  background-color: #4CAF50;  color: white;  padding: 12px 20px;  border: none;  border-radius: 4px;  cursor: pointer;  
                           float: right;  width: 50%;-webkit-appearance: none;-moz-appearance: none;appearance: none;font-size:125%;font-weight:bold;}
.krokzpet               {  padding: 12px 20px;  border: none;  border-radius: 4px;  cursor: pointer;  float: right;  width: 50%;
			   background:pink;color:#777;-webkit-appearance: none; -moz-appearance: none; appearance: none;font-size:125%;font-weight:bold;}
.container 		{  border-radius: 5px;  background-color: #f2f2f2;  padding: 20px;  padding-bottom: 40px;  margin-top: 120px;  margin-bottom: 20px;}
.col-25 		{  float: left;  width: 25%;  margin-top: 6px;}
.col-75 		{  float: left;  width: 75%;  margin-top: 6px;}
.row:after 		{  content: "";  display: table;  clear: both;}
.formnote		{  font-style:italic;font-size:95%; }
label sup, .row sup 	{  vertical-align:super; font-size:60%;color:red;}
.col-25 a		{  text-decoration:none;font-weight:bold;color:black;cursor:pointer;}
.col-75 a		{  text-decoration:underline;font-weight:bold;color:black;cursor:pointer;}
@media screen and (max-width: 600px) {  .col-25, .col-75, input[type=submit], .krokzpet {    width: 100%;    margin-top: 10px;  }}

/* Create a custom checkbox */
.lcheckbox 		{  display: block;  position: relative;  padding-left: 35px;  margin-bottom: 12px;  cursor: pointer;  
                          font-size: 22px;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;}
.lcheckbox input[type=checkbox]{  position: absolute;  opacity: 0;  cursor: pointer;  height: 0;  width: 0;}
.checkmark 					{  position: absolute;  top: 0;  left: 0;  height: 25px;  width: 25px; background:white;  border: 1px solid #ccc;  border-radius: 4px; }
.checkmark:after 				{  content: "";  position: absolute;  display: none;}
.lcheckbox:hover input ~ .checkmark 		{  background-color: #eee;}
.lcheckbox input:checked ~ .checkmark 		{  background-color: #fab500;}
.lcheckbox input:checked ~ .checkmark:after 	{  display: block;}
.lcheckbox .checkmark:after 			{  left: 9px;  top: 5px;  width: 5px;  height: 10px;  border: solid white;  border-width: 0 3px 3px 0;  -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);  transform: rotate(45deg);}

#contentFooter   {position: fixed; width:100%; bottom:0px;background-color: #444; border: 1px solid #333; color: #aaa;font-size:70%;text-align:center;height:22px;opacity: 0.7; filter:alpha (opacity=70);}
#contentFooter a {text-decoration:none;color:lightblue;}

.stavplatby 		{ color:green;font-size:130%; }
.stavplatbyerr		{ color:red;  font-size:130%; }
.hrefmailto		{ text-decoration:none; color:#4CAF50; font-weight:bold; }

.tablelinks             { width: 100%; text-align:center; border-collapse: collapse; font-family:Arial;}
.tablelinks tbody       { width: 100%; overflow-x: hidden;overflow-y: hidden; border-bottom:1px solid #ABABAB;}
.tablelinks tr 		{ display:table-row; }
.tablelinks th,td       { padding:1px 3px 10px 3px;}
.tablelinks .zaplacANO   { background: darkgreen; color:white;   text-decoration:none; padding:5px; white-space:nowrap; border-radius: 5px;}
.tablelinks .zaplacNE    { background: darkred;   color:white;   text-decoration:none; padding:5px; white-space:nowrap; border-radius: 5px;}
.tablelinks .zaplacSK    { background: orange;    color:white;   text-decoration:none; padding:7px 4px 7px 4px; font-size:80%; white-space:nowrap; border-radius: 5px;}
.tablelinks .linkfak     { background: black;     color:#00ff4c; text-decoration:none; padding:5px; white-space:nowrap; border-radius: 5px;}
.tablelinks .linkpot     { background: black;     color:#01ffff; text-decoration:none; padding:5px; white-space:nowrap; border-radius: 5px;}
.tablelinks .nadpisNavod { background: #777;    color:white;   text-decoration:none; padding:7px 4px 7px 4px; font-size:80%; white-space:nowrap; border-radius: 5px;}
.tablelinks .linkNavod   { background: orange;    color:white;   text-decoration:none; padding:7px 4px 7px 4px; font-size:80%; white-space:nowrap; border-radius: 5px;}

.info, .success, .warning, .error, .validation {
	width:calc(100% - 66px);border: 1px solid #c10000; margin: 5px auto; padding: 15px 10px 15px 50px;
	text-align:center;
	border-radius: 5px;background-repeat: no-repeat; background-position: 10px center;
}
.info 	 { color: #00529B; background-color: #BDE5F8; background-image: url('/graphics/messageicons/info.png'); }
.success { color: #4F8A10; background-color: #DFF2BF; background-image: url('/graphics/messageicons/success.png'); }
.warning { color: #9F6000; background-color: #FEEFB3; background-image: url('/graphics/messageicons/warning.png'); }
.error   { color: #7D0000; background-color: #FF8787; background-image: url('/graphics/messageicons/error.png'); }
.validation{color:#D63301; background-color: #FFCCBA; background-image: url('/graphics/messageicons/error.png'); }