:root {
  --zelena: #00ea29;
  --oranzova: #ff6e00;
  --svetla: #f5f5f5;
  --region: #000;
  --modra: #0074BA;
}

@font-face { font-family: featuredeck; src: url('../webfonts/FeatureDeck-Regular-Web.woff2'); }
@font-face { font-family: featuredeckbold; src: url('../webfonts/FeatureDeck-Bold-Web.woff2'); font-weight: bold; }
@font-face { font-family: nationalCB; src: url('../webfonts/national-2-compressed-bold.woff2'); }

html { scroll-behavior: smooth; }
body { background-color: var(--svetla); font-family: "featuredeck", sans-serif; }
nav, .blok, .ui-tooltip { font-size:16px; }
a { transition: color 0.2s; text-decoration:underline; }
a:hover { color:#444; text-decoration:none; }
.show-small { display:none; } /* ve w3 to není */
.none { display:none; }

.zeleny { background-color: var(--zelena); }
.zelena { color: var(--zelena); }
.oranzovy { background-color: var(--oranzova); }
.oranzova { color: var(--oranzova); }
.svetly { background-color: var(--svetla); }
.svetla { color: var(--svetla); }
.modra { color: var(--modra); }
.vnitroblok { width:75%; margin-left:auto; margin-right:auto; padding:24px 0 30px; }

nav { margin-bottom:4px; }
nav .vnitroblok { padding:6px 0; }
nav .logo { width:100%; }
nav .menu { font-family: "nationalCB", sans-serif; font-size: 2.4vw; padding-left:1.6%; padding-top:1.5%; }
nav .menu a { display:inline-block; text-decoration:none; padding:0 1%; margin:0 0.27%; transition: background-color 0.3s, color 0.3s;  }
nav .menu a:hover { background-color:#000; color:var(--svetla); }
nav .menu a.hrozi:hover { background-color:#f00; color:var(--svetla); }
nav .ikona { font-size:6.7vw; }

.pf { width:100%; }
.slogan { padding:1.5% 2.5%; position:relative; }
.slogan h1 { font-family: "nationalCB", sans-serif; font-size:5.5vw; line-height:95%; }
.slogan h2 { font-family: "featuredeck", sans-serif; font-size:2.2vw; line-height:110%; margin-top:1em; margin-bottom:5.5em; }
.slogan .logo { position:absolute; right:10%; bottom:5%; width:18%; }

.slogan2 { padding:2% 4%; position:relative; }
.slogan2 h1 { font-family: "nationalCB", sans-serif; font-size:10vw; line-height:95%; }
.slogan2 .logo { display:inline-block; height:0.9em; position:relative; top:-0.07em; }

.vnitroblok h2 { font-family: "nationalCB", sans-serif; font-size:52px; line-height:95%; }
a.socsit { display:inline-block; width:54px; height:54px; background-color:#000; border-radius:12px; padding:11px 7px; margin:0 10px 4%; transition: background-color 0.2s; }
a.socsit:hover { background-color:var(--oranzova); }

.topakce .ikona img { width:90%; border:1px solid #000; }
.topakce .termin { font-family: "nationalCB", sans-serif; font-size:24px; margin:0; padding:0; }
.topakce .termin a { text-decoration:none; }
.topakce .termin a:hover { text-decoration:underline; }
.topakce .nazev { margin:0; padding:0; }

a.velky { font-family: "nationalCB", sans-serif; font-size:46px; text-decoration:underline; line-height:95%; }

.kraje { padding:0 0 0 1em; }
.kraje a { display:block; padding:0.55em 0; text-align:center; border-bottom:1px solid #777; background-color:var(--zelena); transition: background-color 0.2s; text-decoration:none; }
.kraje a:hover, .kraje a.aktivni { background-color:var(--oranzova); }
.map-wrapper path { transition: fill 0.3s; }
.map-wrapper path:hover, .map-wrapper path.active { fill: var(--oranzova)!important; }

input.email, button.email { font-size:16px; border-radius:20px; margin-top:12px; }
input.email { background-color:#fff; padding:8px 16px; border:1px solid #444; width:20em; margin-right:1.5em; }
button.email { background-color:var(--zelena); padding:8px 32px; border:1px solid #444; cursor:pointer; transition: background-color 0.2s; }
button.email:hover { background-color:var(--svetla); }

.loga { padding-top:2.8em; }
.loga img { width:20%; }

.kandidatka .top3 { margin:18px 0 48px; }
.kandidatka .cislo p { font-family: "nationalCB", sans-serif; font-size:24px; color:#000; margin:0; padding:0; }
.kandidatka .foto img { width:100%; border-radius:50%; }
.kandidatka .jmeno { font-family: "nationalCB", sans-serif; font-size:2.2vw; margin:0.5em 0 0.1em; line-height:90%; }
.kandidatka .povolani { font-size:1vw; margin:0 0 0.5em; }
.kandidatka .top3 a { display:block; transition: background-color 0.4s; }
.kandidatka .top3 a:hover { background-color:#fff; }

.kandidatka a.od4 { display:block; margin:0 0 24px; }
.kandidatka .od4 .foto img { width:100%; border-radius:50%; }
.kandidatka .od4 .udaje { padding-left:1.7em;  }
.kandidatka .od4 .jmeno { margin:0.2em 0 0em; }
.kandidatka .od4 .povolani {  }

.kandidat p.poradi { font-family: "nationalCB", sans-serif; font-size:24px; color:#000; margin:0; padding:0; }
.kandidat .foto { position:relative; padding:1em 2.5em 0 0; }
.kandidat .foto img { width:100%; border-radius:50%; position:relative; top:-1.5em; }
.kandidat h2 { margin:0.4em 0 0.3em; line-height:90%; }
.kandidat h3 { font-family: "featuredeck", sans-serif; font-size:16px; margin:0 0 0.2em; padding:0; font-weight:bold; }
.kandidat h4 { font-family: "featuredeck", sans-serif; font-size:16px; margin:0 0 1.6em; padding:0; }
.kandidat .socsite { margin-top:2em; }
.kandidat a.socsit { color:#fff; margin:0.5em 2%; }
.kandidat a.socsit:hover { background-color:var(--oranzova); }
.kandidatimini h3 { font-family: "featuredeck", sans-serif; font-size:20px; margin:0 0 0.2em; padding:0; font-weight:bold; }
.kandidatimini img.foto { width:7%; border-radius:50%; position:relative; margin:0.2%; border:2px solid var(--oranzova); transition: border-color 0.3s;  }
.kandidatimini a { text-decoration:none; }
.kandidatimini img.foto:hover, .kandidatimini img.aktivni { border-color:var(--zelena); }

.akcedetail .ikona img { width:90%; border:1px solid #000; }
.akcedetail .nazev { font-family: "nationalCB", sans-serif; font-size:3vw; margin:0 0 0.5em; padding:0; line-height:0.8em; }
.akcedetail .termin { font-size:1vw; margin:0 0 0.4em; padding:0; }

.pazderkova { text-align:center; }
.pazderkova a { display:block; font-family: "nationalCB", sans-serif; font-size:1.7vw; margin:0 0 0.1em; padding:0; line-height:1em; text-decoration:none; }
.pazderkova a:hover { color:var(--oranzova); text-decoration:underline; }
.dalsiakce .kraj { border-top:1px solid #000; padding:1.5em 0 2em; }
.dalsiakce.bezcary .kraj { border-top:none; }
.dalsiakce .lidr { padding:2% 2%; text-align:center; }
.dalsiakce .lidr img { width:100%; border-radius:50%; }
.dalsiakce .jmeno { font-family: "nationalCB", sans-serif; font-size:1.5vw; margin:0.5em 0 0.1em; line-height:90%; }
.dalsiakce h3, .snidane h3 { font-family: "nationalCB", sans-serif; font-size:2vw; text-transform:uppercase; }
.dalsiakce p { margin:0; padding:0; }
.dalsiakce a { text-decoration:none; }
.dalsiakce a:hover { text-decoration:underline; }
.snidane h4 { font-family: "featuredeck", sans-serif; font-size:18px; margin:1em 0 0 0; padding:0; font-weight:bold; }
.snidane p { margin:0 0 0 0; padding:0; }

.program p, .program li { font-size:120%; }
.program h2 { margin-bottom:0.7em; }
.program h2 span { display:inline-block; background-color: var(--zelena); padding: 5px 0.2em; }
.program h3 { font-family: "nationalCB", sans-serif; font-size:28px; text-transform:uppercase; margin-top:32px; line-height:100%; }
.program ul { margin:0.5em 0; }
.program li { padding:0.2em 0; }
.program a.smery { display:inline-block; background:var(--oranzova); padding:0.1em 0.5em; margin:0.5em auto; color:var(--svetla); font-size:18px; text-decoration:none; transition: background-color 0.2s, color 0.2s; }
.program a.smery:hover { background:var(--zelena); color:#000; }

.programyTitul { padding:16px; text-align:center; }
.programyTitul div.vize { padding-bottom:20px; position:relative; }
a.buttonVice { display:inline-block; background:var(--oranzova); padding:0.1em 0.5em; margin:0.5em auto; color:var(--svetla); font-size:18px; text-decoration:none; }
a.buttonVice:hover { color:#fff; }
.programyTitul p.vize { width:70%; font-size:18px; text-align:center; margin:0.4em auto; }
.programyTitul div.vize a.buttonVice { position:relative; right:-33%; }

.programyTitul .sekce { padding:0.2em; font-size:1.8vw; }
.programyTitul .sekce a.sekceTema { display:block; padding:0.1em; text-decoration:none; background:var(--zelena); transition: background-color 0.2s, color 0.2s; }
@media (hover: hover) { /* hack na mobily */
  .programyTitul .sekce a.sekceTema:hover { background:var(--oranzova); color:var(--svetla); }
}
.programyTitul .sekce a.sekceTema.aktivni { background:var(--oranzova); color:var(--svetla); }
.programyTitul .sekce h2 { font-size:1.8vw; }
.programyTitul .temata { background:var(--svetla); background:#fff; display:none; font-size:18px; padding:6px 16px; text-align:left; }
.programyTitul .temata ul { margin:0; padding:0.5em 0 0.5em 1.2em;  }
.programyTitul .temata li.tema { margin:0.4em 0 0.6em; padding:0; line-height:110%; }

.program .programyTitul h2 { margin-bottom:0.4em; }

.programyTop { padding:16px; text-align:center; }
.oranzovy.programyTop { margin-bottom:40px; }
.programyTop h2 { font-size:2vw; }
.programyTop h2 span { display:inline-block; background-color: var(--zelena); padding: 5px 0.2em; }
.programyTop a h2 span { transition: background-color 0.2s; }
.programyTop a h2:hover span, .programyTop a.aktivni h2 span { background:#fff; color:#000; }

.hrozba { background:red; color:#fff; }
.hrozba p { font-size:18px; }
.uzbyla { color:#777; }
.uzbyla a { color:var(--oranzova); }

.e404 { font-size:50px; }

.retezak h2 { font-family: "nationalCB", sans-serif; font-size:11vw; text-align:left; color:var(--zelena); text-transform:uppercase; line-height:100%; }
.retezak h3 { font-family: "nationalCB", sans-serif; font-size:7vw; text-align:left; color:#000; text-transform:uppercase; line-height:100%; }
.retezak .ruka { width:100%; }
.retezak .texty p { font-size:20px; }
.zeleneOkno { background:var(--zelena); padding:20px; margin-top:40px; }
.zeleneOkno p { margin:0; padding:0; }
.zkopiruj { padding:5px 15px; background:#fff; color:#000; font-family: "nationalCB", sans-serif; font-size:36px; border:none; margin:20px 0 0; text-transform:uppercase; transition: background-color 0.2s, color 0.2s; }
.zkopiruj:hover { color:#fff; background:#000; }
.sdileni { padding:16px 0; display:none; }
.sdileni p { text-align:center; margin:8px 0; }
.sdileni a { display: inline-block; padding:8px 12px; background:#000; color:var(--zelena); border-radius:8px; margin:4px; transition: background-color 0.2s, color 0.2s; }
.sdileni a:hover { background:#444; }
.duvody { padding-bottom:20px; }
.duvody h3 { margin-bottom:20px; }
.duvody h3 span { color:var(--zelena); }
.duvody p { font-size:18px; margin:4px 0; padding:0; }
.duvody p.duvod { font-family: "nationalCB", sans-serif; font-size:32px; margin-top:16px; line-height:100%; }

.stazeni a { font-size:18px; }
.stazeni a img { width:100%; margin-top:20px; margin-bottom:20px; border:1px solid #666; }

@media screen and (max-width:1205px) {
  .kandidatimini img.foto { width:15%; }
}

@media screen and (max-width:992px) {
  .programyTitul .sekce h2 { font-size:3.3vw; }
  .programyTop h2 { font-size:3.3vw; }
  .retezak .ruka { width:60%; margin:0 auto; text-align:center; }
  .duvody h3 { font-size:62px; }
  .retezak h2 { font-size:72px!important; }
  .retezak h3 { font-size:48px!important; }
}

@media screen and (max-width:768px) {

}

@media screen and (max-width:600px) {
  .vnitroblok { width:90%; }
  .vnitroblok h2 { font-size:32px; }
  .slogan h1 { font-size:10vw; }
  .slogan2 h1 { font-size:15vw; }
  .slogan h2 { font-size:5vw; }
  .show-small { display:block; }
  nav { padding:3% 0; }
  nav .menu { padding-top:0.5%; }
  nav .menu a { line-height:0%; margin-left:1em; }
  .loga img { width:32%; }

  .kandidatka h2 { font-size:9vw; }
  .kandidatka .jmeno { font-size:7vw; margin:0.5em 0 0.1em; }
  .kandidatka .povolani { font-size:3.5vw; margin:0 0 0.5em; }
  .kandidatka .top3 a { margin-bottom:18px; }
  .kandidatka .od4 .udaje { padding-left:1em;  }
  .kandidatka .od4 .jmeno { margin:0.0em 0 0em; }

  .kandidat h2 { font-size:42px; }
  .kandidat h3 { font-size:18px; }
  .kandidatimini img.foto { width:19%; }

  .akcedetail .nazev { font-size:24px; margin:0 0 0.5em; padding:0; line-height:0.8em; }
  .akcedetail .termin { font-size:14px; margin:0 0 0.4em; padding:0; }
  .akcedetail .ikona { padding:0 0 1.5em; }
  .akcedetail .ikona img { width:30%; }

  .pazderkova a { font-size:5vw; line-height:1em; margin-bottom:0.2em;  }
  .dalsiakce p { margin:0 0 0.6em; padding:0; }
  .dalsiakce h3 { font-size:6vw; }
  .dalsiakce .jmeno { font-size:6vw; margin-bottom:0.7em; }
  .dalsiakce .lidr img { width:70%; }

  .programyTitul div.vize a.buttonVice { right:0; }
  .programyTitul .sekce h2 { font-size:28px; }


}
