@import url(https://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700|Milonga&subset=latin-ext);

html, body, #telo { height:100% }
body > #telo { height:auto; min-height:100%; }
body      	{ margin:0; color:#585230/*2F2519*/; background:#f8f6dd; font:1rem 'PT Sans Narrow'; letter-spacing:.4pt}
#telo     	{ position:relative; max-width:1020px; min-width:820px; margin:0 auto; background:#efdb92 url(/images/tcm.png) no-repeat 2em .5em; box-shadow: 0px 0px 1em 1em #efdb92; }
form     	{ padding-bottom:30px; }
#pata    	{ position:absolute; bottom:0; width:100%; text-align:center; background:#f5c968; line-height:2em }
#pata>div	{ height:1em}
#pata a		{ text-decoration:none; font-weight:bold; color:#CC0000;  margin:0 4px}
#pata a:hover  { text-decoration:underline; }
#pata a.js     { font-weight:normal }

table     { border-collapse:collapse; width:100% }
#sall table { width:100% }
tr:hover  { background:#fff3 }
td,th   { border:1px solid #eb6; padding:2px 5px; }
th      { font-weight:bold; text-align:left; background:#f5c968/*linear-gradient(to bottom, #dcb168 0%,#eebb66 50%,#dcb168 100%) */; }
.l  	{ text-align:left }
.r, .kos .r,
.zakaznik td:first-child, .zakaznik tr > :nth-child(3),
tr > :last-child, tr > :nth-last-child(2), .kos tr > :nth-last-child(3)	{ text-align:right }
td.in   { padding:0}

.fota p 	{ width:50%; float:left; padding-bottom:1em}
.fota p img { height:150px }

.prihlas		{ width:30em; margin:auto; }
.prihlas h2		{ margin-top:0 }
.prihlas label  { width:8em; float:left; text-align:right; padding:0 3px 0 0; line-height:18pt }
.prihlas input[type=submit] { width:8em; float:right; clear:right; margin-top:.6em }

.prihlas p.line	      { margin:2em 0;color:#b62d0d }
.prihlas p.line input { float:right; margin-left:2em; }

.prihlas p 		{ text-align:left }
.prihlas p:last-child { text-align:center }
.prihlas fieldset { margin-bottom:2em; }
.prihlas fieldset label { width:7em }
.prihlas fieldset legend label { width:auto; float:none }
.prihlas textarea { font:9pt "Arial CE",Arial,Helvetica; }
.prihlas .tlac { margin-left:2em }
.odbor       { margin-left:100px }
.odbor label { float:none; width:100%; display:block; text-align:left;  }
.odbor input { margin-right:4px;  }
#odbor       { margin-left:2em }
#vyrobce label { padding:0 }
.inzerat   		{ background: #b62d0d;color:#f8f6dd;padding:1em; text-align:center; border-radius:1em }
.inzerat a:link { color:#fff }


fieldset            { border:1px solid #eb6;/*ED5E1C*/ }
input,option,select { font:9pt "Arial CE",Arial,Helvetica; }
input[type=password],input[type=text],input[type=email], input[type=number],input[type=tel] { font:bold 9pt "Arial CE",Arial,Helvetica; color:#444 }
input, textarea, select { border:1px solid #eb6; margin:2px; background:#ffd }
input[type=checkbox],input[type=radio],input[type=image] { vertical-align:middle }
input[type=number]	{ text-align:center }
input[type=image] 	{ border:0; } 
input,textarea      { font-size:1em; padding:2px 4px;}
#vyrobce input, #vyrobce input:focus { vertical-align:middle; outline:none; border:0 }
table input, table textarea  { margin:0; padding:3px ; }
.ok     { background-image:url(/images/save.png); background-repeat:no-repeat;background-position:right  }

#kontakty  { width:24em; float:left }
#dotazy     { float:right; padding:0.1em 2em 1em; margin:0 0 1em 2em; width:22em; background-color:rgba(245, 201, 104, .6) }
#dotazy input,
#dotazy textarea { margin:5px 0;}
#dotazy textarea { width:calc(100% - 10px) }
button,
input[type=button],
input[type=submit],
#zpravy a,
.zakaznik .tl a { cursor:pointer; font:10pt 'PT Sans Narrow'; border:none; background-color:#ED5E1C88; color:#fff; margin-left:.3em; line-height:1.4em; padding:.5em; border-radius:.3em }
#zpravy a { text-decoration:none; }
input:disabled, input:disabled:hover  { background-color:#ccc; color:#999; cursor:not-allowed }
/*button[id=novy]:hover, button[name=upravit]:hover,button[name=smazat]:hover,#storno:hover,button[name=del]:hover,
#bobule button:hover,*/
#zpravy *:hover,
input[type=button]:hover,
input[type=submit]:hover,
button:hover,
#zpravy a:hover { background-color:#ED5E1C }
#zpravy  	{ float:left; clear:left; margin:.5em 0; width:7.2em;  }
td.focus	{ background-color:#cb6 }

p             { margin:.6em 0 .3em; text-align:justify}
a             { color:#ED5E1C; outline:none; }
a:hover       { color:#b62d0d; }
h1, h2, h4, .hlava    { font-family: Milonga, Georgia, "Times CE", Times; font-weight:normal }
h1            { font-size:1.2em; color:#b62d0d; margin:1em 0 .5em }
p.hlava      { font-size:2em; color:black; padding:1.2em 2em 2.5em 200px; margin:0 }
p.hlava span { color:#585230;}
p.hlava span.barva { color:#b62d0d;  }
h2      { font-size:1.1rem; margin-top:1.4em; color:#b62d0d; }
h2 span { _color:#b62d0d }    
h2.clr  { padding-top:2em}
h3      { font-size:100%; margin-bottom:.5em; letter-spacing:.5pt; }
ul,ol   { margin:0; padding:0 0 0 25px; text-align:left; }
li      { margin:3px 0 0 0; padding:0;  }
   
a img   { border:0; }
p img 	{ border:3px solid white; box-shadow:0 0 3px #444 }
.foto 	{ position:relative; float:right; }
div.foto::after { content:" "; position:absolute; top:0; left:0; box-shadow:0 0 .8em .8em #efdb92 inset; width:100%; height:100%}
.foto img	 { width:160px; border-radius:2em; }

div.k       { width:calc(50% - 2.8em); float:left; margin:.5em; font-size:90%; background:#f8f8c8; border-radius:6px;
              border-right:2px solid #ec8; border-bottom:2px solid #ec8; padding:.5em .8em;  }
.k h2       { color:#da5; font-size:120%; margin:0; height:1.2em; overflow:hidden; }
.cinsky     { color: #b62d0d; margin:0 0 1em; text-transform:uppercase; border-bottom:1px solid #ec8; line-height:1.5em; }
.cena       { float:right; width:8em; color:#666; text-align:right; font-weight:bold;   }
.baleni     { color:#666; border-top:1px solid #ec8;   }
.cena,.baleni { line-height:1.6em; margin-top:1em; padding-top:.2em}
.k ul       { height:10em; margin:0 0 0 100px; padding-left:15px; overflow-y:hidden; text-overflow: ellipsis;
			display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical;  }
.k li       { color:#963; margin-top:.3em; line-height:1em; }
.k a.img    { width:95px; float:left; text-align:center; cursor:zoom-in }
.img img    { height:120px; margin:0; border:0; }
.k p        { display:none }

.skl:before	{ content:"✅ "}
.skl, span.kup  { line-height:24px; }
span.kup       { float:right; padding:0 0px 0 .6em; text-decoration:none; border-radius:4px;
              color:#BCB603; letter-spacing:1pt; cursor:pointer }
span.kup::after { content:"🛒"; font-size:140%; margin-left:.5em }
span.kup:hover { background-color:#EFDB92; color:#000; }
button.kup  { background: url(/images/kos.gif); padding:0; float:right; border:0; width:23px; height:20px}

div.detail    { width:calc(100% - 3em); padding:1em; font-size:120%;border-radius:12px; }
.detail h2    { font-size:160% }
.detail .cinsky, .detail .baleni { border-width:2px }
.detail a.img { padding:5px; cursor:zoom-out }
.detail .img img { height:250px }
.detail ul    { min-height:230px; padding:1em 2em; margin-left:230px; overflow:auto;  }
.detail li { margin-top:.5em }
.detail p  { display:block }
.detail .cena { line-height:1.2em }


td.kup:before { content:"🛒"; font-size:180%; float:right; }
td.kup:hover,
td.upravy:hover  { background:#fff; outline:2px solid #585230; cursor:pointer; }
td.upravy:hover::after	{ content:"✏️"; float:right }
td img 		{ height:35px; vertical-align:middle; }
.vyr1 td:first-child { cursor:zoom-in; text-align:center; }

@keyframes vysun {
    from { height:0 }
    to { height:300px }
}
span.zoom img { height:300px; cursor:zoom-out}
span.zoom { position:fixed; z-index:10; right:0;left:0; bottom:0; padding:20px 40px;background:rgba(0,0,0,.5);animation-name:vysun; animation-duration:1s; }

.ne, .v2 .vyr1, .v1 .vyr2  { display:none }
.v1 div.vyr1, .v2 div.vyr2 { display:block }
.v1 tr.vyr1, .v2 tr.vyr2   { display:table-row }

.admin  { right:4px; position:absolute; z-index:3; }
.clr 	{ clear:right }
.cll 	{ clear:left }
.clear, #navod  { clear:both }
#navod  { padding:5px; text-align:center; border:1px solid #eb6; font-size:small;border-radius:6px;}

.fr     { float:right; margin-left:1em }
.fl     { float:left; margin-right:1em }
table.fl { width:auto; }
table.fl td:last-child { text-align:left }
label.fn { float:none }
.vlevo  { float:left; margin-right:1.5em; }
.vpravo { float:right; margin-left:1.5em; }
.c { text-align:center }
.vysvetleni img { float:left; margin:0 1em 1em 0; width:19em; clear:left }
.vysvetleni div { clear:left }
.vysvetleni p { margin-left:20em }

#hlavni  { /*margin-left:25%;*/ padding:0 2em 2em;  }

nav                 { position:absolute; top:150px; width:100%; letter-spacing:1pt;  }
nav::after 			{ content:""; display:block; height:1.6rem; background:#f5c968 }
nav > span          { height:28px; float:left; overflow:hidden; }
nav > span:last-child,
nav > span:nth-last-child(2) { float:right }            
nav > span.aktiv, 
nav > span a:first-child.aktiv,
nav > span:hover    { border-bottom:3px solid #ED5E1C; border-top:1px solid #ED5E1C; }
nav > span:hover a.aktiv	{ border:none }
@keyframes mnu {
    from { height:28px }
    to { height:auto }
}
nav > span:hover    { height:auto; background:#fff; box-shadow:0 0 8px 0 #0008/*245, 201, 104, .9;animation-name:mnu; animation-duration:.5s;*/ }

nav .aktiv          { color:#b62d0d;  }
nav a				{ text-decoration:none; color:#585230; display:block; }
nav > span a:first-child     { margin:0 1px 0 0; padding:0 10px; line-height:24px; font-weight:bold;  }     
nav > span a:nth-child(n+2)  { margin:5px 10px; padding-left:18px; background: url(/images/znackas.gif) no-repeat left; }    
                  
nav > span a:nth-child(n+2):hover, 
nav > span a:nth-child(n+2).aktiv { background-image:url(/images/znackao.gif); color:#000 }
nav > span:first-child a span 		{ width:1.1em; float:left; text-align:right; margin-right:.4em; background:#995; color:#f8f6dd; text-align:center }
nav > span:first-child a:hover span, 
nav > spa:first-child a.aktiv span { background:#333; color:#f8f6dd }
nav > span input   { margin:10px 0 10px 10px; border-radius:5px 0 0 5px; float:left; height:16px; width:12em; outline:none }
nav > span button  { background:#eb6 url(/images/lupa.png) no-repeat center;width:22px;height:22px; margin:15px 10px 0 0; border:1px solid #eb6; border-radius:0 5px 5px 0; display:block }
nav > span:nth-last-child(2) a:first-child sup { position:absolute; line-height:8px;border-radius:6px; background:#000; color:#fff; font-size:50%; padding:2px;  }
input.chyba, textarea.chyba  	{ color:red; border-color:red }

.terminy td { padding:3px 5px }
.terminy li { margin:0 }

.kos   		{ width:100% }
.kos th 	{ border:none; _border-bottom:1px dotted #bb9a69; }
.kos fieldset { border:none; padding:5px;  }
.kos fieldset label { display:block }
.kos fieldset label span { float:right }
.kos fieldset label div { margin-left:3em }
.kos label input	{ margin:0 1em }
.kos tr td:last-child::after,
.kos fieldset label span::after { content:" Kč"}
#top 		{ position:fixed; z-index:10; background:#0008; width:100%; height:100%;top:0;left:0; }
#top iframe	{ width:calc(100% - 14em); height:calc(100% - 10em);
			 background-color:#fff; padding:3em 4em; border-radius:1em; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); box-shadow:0 0 1em;}


input.ido,.close,.del,.add,.save,.search,.edit,.filtr 
            { background:url(/images/lupa.png) no-repeat; font-size:0;width:16px;height:16px; /*border:0; cursor:pointer;*/ }
button.ido::before { content:"🔎";}
a.close     { display:block; }
.close      { background-image:none /*url(/images/close.gif);*/ }
a.close::before { content:"✖️"; font-size:14px; line-height:14px }
input.del        { background:url(/images/b_drop.png) no-repeat; float:right; }
.add        { background-image:url(/images/add.png); float:right; }
.save       { background-image:url(/images/save.png); }
.filtr      { background-image:url(/images/filtr.gif); }
.edit       { background-image:url(/images/b_edit.png); }
a.edit	    { display:block }


.editzb 	{ padding:0; text-align:center; cursor:pointer }
.editzb:hover  { background:#fff url(/images/b_edit.png) no-repeat center}
.editzb:hover img { visibility:hidden }
.soucet .ed       { padding:0 }
td.ed input, 
.soucet td.ed button  { width:50px; color:#000 }
.soucet td.ed button { width:100%; border:0; margin:0; }
.ed button:hover { background:url(/images/b_drop.png) no-repeat left;  }


.tlac       { background-color:#ED5E1C; color:#eda; border:0px solid #666; padding:.3em .6em; cursor:pointer; font-size:110%; border-radius:5px }
.tlac:hover { background-color:#f82; color:white;}
a.tlac      { text-decoration:none; } 
.fr .tlac	{ margin:1em 0 0 1em }


a.doc { background:url(/data/word.gif) no-repeat left; padding:3px 2px 2px 20px;  }
.pdf { background:url(/data/pdf.gif) no-repeat left; padding:3px 2px 2px 20px;  }
/*a[href^='tel:']::before { content:'✆ ' }
a[href^='mailto:']::before { content:'✉︎ ' }
*/
.excel, .excel:hover { background-image:url(/data/excel.gif);background-repeat:no-repeat; background-position:left; padding-left:20px; line-height:20px}

.pointer  { cursor:pointer; vertical-align:top }

#editable { outline:2px dotted #ED5E1C }

address { font-style:normal }

iframe { border:0; width:100%; height:400px }

#potvrd 	{ position:fixed; z-index:10; background:rgba(0,0,0,.5); width:100%; height:100%;top:0;left:0; }
#potvrd > div,
#potvrd form { min-height:14em; background-color:#fff;padding:2em 4em; position:fixed; top: 50%; left:50%; transform: translate(-50%,-50%); border-radius:1em;  }
#potvrd img { height:130px; max-width:130px; float:left; margin-right:1em  }
#potvrd  h2 { margin:.5em 0; clear:none }
#potvrd .prihlas p label { width:5em }
input#pocet { font-size:150%; font-weight:bold; margin-right:0.5em; }
#potvrd .cl input,
#potvrd .cl button { margin:1.5em 2em 0 0; display:inline; padding:.5em 1em; font-size:100%;}
#potvrd input[type=button] { margin-right:0 }
#potvrd textarea { border:1px solid #aaa; width:calc(100% - 10em); resize:vertical; }
#potvrd form span { float:right; cursor:default }
#potvrd td input[type=number] { font-size:100%; margin:0 }

#bobule { position:absolute; bottom:5em; left:10em; width:65%; background:#fff; border:1px solid #aaa; padding:1em; box-shadow:0 0 1em #0004; border-radius:.5em }
#bobule button { margin:1px; border-radius:0 }


tr[data-ido] { cursor:pointer }
tr[data-ido] td:first-child { width:1em }
tr[data-ido]:hover td:first-child::before { content:"🔎"; }

.zakaznik 		{ min-width:34em }
.zakaznik h1    { margin:0 0 1em}
.zakaznik div   { width:16em; float:left;}
.zakaznik div label,
.zakaznik > label { width:4em; text-align:right; float:left; line-height:18px; height:18px; margin-right:3px }
.zakaznik input[type=text],
.zakaznik input[type=date] { display:block; font-size:100%; padding:.3em .5em }
.zakaznik table { margin:2em 0; clear:left; width:100%; }
.zakaznik .tl	{ width:100% }
.zakaznik .tl input  { display:inline; }
input.pdf	{ padding-left:22px; background-position:3px center }
.zakaznik td input[type=button] { padding:.1em .3em }
.vyrizeno, 
.vyrizeno tr { background:#0001; color:#666 }
tr.vybrany  { color:#b62d0d }
.vybrany 	{ background:#fea;  }

#h      { font-size:100%; line-height:140% }
#pac	{ margin:.4em 0 0 7.4em; font-weight:bold }
#pozn   { float:right }
.wm		{ width:6em; margin:0; float:left }
textarea[name=memo]	{ width:calc(100% - 9.4em); padding:1em; height:40em; margin:.4em 0}
#fdatum { width:7em; float:left; clear:left; padding:0; border:none; min-height:1em }
#fdatum input { margin-right:.5em }
#fdatum label { display:block; line-height: 1.6em; }
#fdatum input[type=date] {font:1rem 'PT Sans Narrow'; width:4em; margin:0; }
#fdatum input[type=date]:hover { width:auto; position:absolute }
/*
@media screen and (max-width:800px) {
	#telo { width:100%;  }
	p.hlava { padding-left:0;text-align:center }
	#menu { left:0; width:100% }
	#pata { width:100%;margin:0 }
}*/
