@import url('https://fonts.googleapis.com/css?family=Roboto+Slab');
@import url('https://fonts.googleapis.com/css2?family=Jura:wght@700&display=swap');
body 			{ font-family: 'Roboto Slab', serif; margin: 5px 5px 5px 5px;}
.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: 10px;  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: 10px; text-align:center;}
.logo_kulate 		{  position: relative;  height:90px;  font-size: 10px;}

label 			{  padding: 12px 12px 12px 0;  display: inline-block;}
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:110%;}
.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:110%;}
.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;}
.col-25r 		{  float: left;  width: 30%;  margin-top: 0px; color:#999;font-style:italic;}
.col-75r 		{  float: left;  width: 70%;  margin-top: 0px; font-weight:bold;}
.rowbig			{  padding-bottom:10px;  }
.row h4			{  padding-top:5px; }
.rowlabel		{  position:absolute;color:#888;font-family:'Jura';font-style:italic;font-size:80%;margin:-10px 0px 0px -10px; }
/* .hrlabel		{  position:absolute;margin:-10px 10px 0px -10px;border-top:1px solid #bbb;color:#bbb; } */
.row:after 		{  content: "";  display: table;  clear: both;}
.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;}
.rowbig:after 		{  content: "";  display: table;  clear: both;}
.formnote		{  font-style:italic;font-size:90%; }
label sup, .row sup 	{  vertical-align:super; font-size:60%;color:red;}
@media screen and (max-width: 600px) {  .col-25, .col-75, input[type=submit], .krokzpet {    width: 100%;    margin-top: 10px;  }}
@media screen and (max-width: 600px) {  .col-25r, .col-75r {    width: 100%;    margin-top: 0px;  }}
@media screen and (max-width: 600px) {  .rowbig {    width: 100%;    margin-top: 10px;  }}

.vyber			{  font-family:'Jura'; border-collapse:collapse;min-width:50%; }
.vyber th		{  background:#666;color:#ddd; }
.vyber th, td 		{  padding:7px; }

.tprispevky		{  font-family:'Jura'; min-width:50%;margin-top:10px;border:1px solid #AAA;border-radius: 5px; background:#ddf0eb;}
.tprispevky thead       {  font-size:85%; border:1px solid #AAA;border-radius: 5px; }
.tprispevky tbody       {  font-size:95%; }
.tprispevky th		{  background:#DEDEDE;color:#888; padding:2px 10px 2px 10px;}
.tprispevky td		{  padding: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:99%;border-radius: 5px; bottom:0px;background-color: #444; border: 1px solid #333; color: #aaa;font-size:70%;text-align:center;height:32px;opacity: 0.8; filter:alpha (opacity=80);}
.contentFooterA  {margin-top:2px;}
.contentFooterB  {}
#contentFooter a {font-size:115%;text-decoration:none;background:black;color:lightblue;border:1px solid;padding:1px;}
#contentFooter a:hover {color:black;background:yellow;}

.info, .success, .warning, .error, .validation {
	width:calc(100% - 66px);border: 1px solid #c10000; margin: 5px 0 12px 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: #900008; background-color: #FF8787; background-image: url('/graphics/messageicons/error.png'); }
.validation{ color: #D63301;background-color: #FFCCBA;background-image: url('/graphics/messageicons/error.png'); }
