.mimo-desktop { display: none }

@media (max-width: 1000px) {
  #main { width: 100%; }
  #hlavicka { background-size: cover }
  #hlavicka .tabule { font-size: 1.2vw }
  #hledani-strom #slovo { font-size: 1.12vw }
  #hledani { font-size: 1.4vw }
  #footer { width: 100vw }
  #footer a { white-space: nowrap }
  
  .titulka .darek-fotka img { width: 100%; height: auto }
  .darky-skupina .tlacitko { white-space: normal }
  
  .nastenky .nastenka-tema { opacity: 0.75 }
  
  .hry-vyjezd .hra-vstup { font-size: 1.6vw }

  html.titulka { background: url('layout/duha-mobilni.jpg') no-repeat 50% 50% fixed; background-size: cover }
  .titulka .content { background: url('layout/titulka.png') no-repeat; background-size: contain }
  .titulka .col-ab { width: calc(92.4vw - 322px); font-size: calc(1.2vw) }
  .titulka .col-c { width: calc(300px) }
  
	.nastenka-text .normafont { font-size: 5.84vw }
	.clanek-text>.normafont { font-size: 6.4vw }
	.sekce-a .nastenka-text .normafont { font-size: 5.2vw }
	.soutez .normafont { font-size: 5.9vw }
	.normafont { font-size: 5.6vw }
  
  .sekce-v .content { background-size: 122vw auto; }
  .sekce-p .col-c { width: 275px; margin-left: 35px; margin-left: calc(19.741vw - 162.41px) }
}
@media (max-width: 942px) {
  .sekce-p .col-c { width: 29.193%; margin-left: 2.5% } /* 23.55 */
  .darky-skupina .darek-fotka { width: 21.231vw; height: 15.926vw; display: block }
  .darky-skupina .darek-fotka img { max-width: 100%; max-height: 100%; width: auto; height: auto }
}

@media (max-width: 768px) {
  img[src$="alik-send.png"] { width: 11.4167em; height: auto; }
  img[src$="alik-pridat.png"] { width: 11.4167em; height: auto; }
  img[src$="alik-search.png"] { width: 9.667em; height: auto; }

  .trvalink i:before, .trvalink i:after { opacity: 0.333 }
  .trvalink i:before { width: 2em; height: 2px }
  .trvalink i:after { margin-left: 2em; height: 2px; width: 2px; transform: rotate(225deg) }
  
  .nav-n4 a.ico-left, .nav-n4 a.ico-right { height: 10.9375vw; background-size: contain }
  .nav-n4 a.ico-left { width: 19.401vw }
  .nav-n4 a.ico-right { width: 17.447vw }
  
  .sekce-a .col-ab, .sekce-a .col-c, .sekce-h .col-a, .sekce-h .col-bc, .sekce-n .col-a, .sekce-n .col-bc, .sekce-s .col-ab, .sekce-s .col-c, .sekce-p .col-ab, .sekce-p .col-c, .sekce-o .col-a, .sekce-o .col-bc, .sekce-u .col-a, .sekce-u .col-bc, .sekce-u .col-ab, .sekce-u .col-c, .sekce-d .col-a, .sekce-d .col-bc, .titulka .col-ab, .titulka .col-c { float: none; width: auto; clear: both }
  
  .sekce-a .col-ab { margin: 0 1.5% }
  .sekce-a .col-c { margin: 3em 2% 0 }
  .sekce-a .clanky-temata ul { -webkit-columns: 2; columns: 2; -webkit-column-gap: 0; column-gap: 0 }
  .sekce-a .alikoviny-logo { max-width: 55% }
  .sekce-a .col-c .alikoviny-logo { margin-top: 4.5em }

  .sekce-n .col-a, .sekce-n .col-bc { margin: 0 2.5% }
  .sekce-n .col-a h1:after { content: none; }
  .sekce-n .col-a h1 { text-align: left; border-radius: 0.5em }
  .sekce-n .col-bc h1 { border-radius: 0.5em }
  .prispevek-hlas { background-size: contain; }
  .prispevek-hlas-diky { background-size: auto 100%, 1.0833em auto }
  .nastenky .nastenka-prvni { display: none }
  .nastenky .nastenka-tema { opacity: 1 }

  .sekce-d .col-a, .sekce-d .col-bc { margin: 0 2.5% }

  .vtipy-vyjezd { -webkit-columns: 1; -moz-columns: 1; columns: 1; }
  .vtip { margin-bottom: 1em }
  .vtip-vysvetlivka .vtip-text { line-height: 0 }
  .vtipy-na-web { display: none }
  .vtip-editace { width: auto; float: none }
  .vtip-editace .vstup { margin: 2.5em 0 0 0 }
  
  .sekce-v h1.tit br { display: none }
  .sekce-v .ilustrace-pobaveny { clear: both }
  .vtipy-temata { width: auto; padding-right: 2.667em; max-width: calc(100vw - 8em) }
  
  .sekce-p .col-ab, .sekce-p .col-c { margin: 0 2.5% }
  .poradna-info div { padding: 1em 1.5em 0; max-height: 50vw; overflow: auto }
  .odpoved-text .boxik-vlevo { margin-left: calc(-5em - 2.5vw); width: 47%; margin-top: -0.25em; border: 0; box-shadow: 0 0 0 0.25em #FFF }
  .odpoved-text .boxik-vpravo { margin-right: calc(-1em - 2.25vw); width: 47%; box-shadow: 0 0 0 0.25em #FFF }
  
  .sekce-h .col-a, .sekce-h .col-bc { margin: 0 3.5% }
  .sekce-h .col-bc { padding-bottom: 1.5em }
  .hry-vyjezd { margin-left: -2.15vw; margin-right: 0 }
  .hry-vyjezd .hra-vstup { font-size: 2.15vw; margin-left: 2.15vw; margin-right: 0 }

  .sekce-s .col-ab, .sekce-s .col-c { margin: 0 3% }
  .sekce-s .col-c { padding-top: 1em }
  .sekce-s .col-c .zdvojene { display: none }
  .sekce-s .col-c h2 span[data-mobil]:after { content: attr(data-mobil); }
  .sekce-s .darek-fotka { height: auto }
  
  .sekce-o .col-a  { margin: 0 1% }
  .sekce-o .col-bc { margin: 0 2.5% }
  .sekce-o .col-bc h1, .sekce-o .col-bc h2 { border-radius: 0.5em 0.5em 50% 0.5em/0.5em 0.5em 100% 0.5em; }
  .sekce-o .bocni-menu ul { -webkit-columns: 2; columns: 2; -webkit-column-gap: 0; column-gap: 0 }
  .sekce-o .bocni-menu .prelom:before { margin: 0; background: linear-gradient(90deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.333), rgba(0, 0, 0, 0)) }
  
  .sekce-u .col-a { margin: 0 1% }
  .sekce-u .col-bc { margin: 0 3.1% }
  .sekce-u .col-ab { margin: 0 2%; padding-bottom: 2em }
  .sekce-u .col-c { margin: 0 2%; border-top: 2px dotted #C9ED48 }

  .titulka .col-ab { margin: 0 2.5% 2em; font-size: 100% }
  .titulka .col-c { margin: 0 2.5% }
  .titulka .clanek-vstup { padding: 0 1em; width: auto }
  .titulka .prostor-v:before, .titulka .prostor-h:before, .titulka .prostor-s:before { content: none }
  .titulka .vtip { font-size: 116.667%; }
  .titulka .prostor-s { margin: 1em }
  .titulka .darek-vstup { width: 270px; margin: auto }
  .titulka .col-c + .col-ab .clanek-vstup:first-child h3 { text-shadow: none }

  .darky-skupina .darek-bunka { width: 33.333% }
  .darky-skupina .darek-fotka { width: 26.042vw; height: 19.531vw }
  .darky-skupina .darky-uvod { width: 66.667%; padding: 1em; box-sizing: border-box }
  
  .col-a .makrela-svisla, .col-c .makrela-svisla { display: none }
  .col-a .makrela-kostka, .col-c .makrela-kostka { display: block }
  
  .mimo-desktop { display: block }
  span.mimo-desktop { display: inline }
  .mimo-mobil { display: none }
  
	.nastenka-text .normafont { font-size: 7.73vw }
	.sekce-a .nastenka-text .normafont { font-size: 7.73vw }
	.clanek-text>.normafont { font-size: 9.42vw }
	.soutez .normafont { font-size: 8.9vw }
	.normafont { font-size: 7.5vw }
}

@media (max-width: 640px) {
  .clanek-text>p, .clanek-text>ol, .clanek-text>ul, .clanek-text>.kviz, .clanek-souvisejici { padding: 0 1.5625em 0 3.125em }
  .clanek-text>h2 { padding: 0 1.25em 0 2.5em }
  .clanek-text>h3 { padding: 0 1.3889em 0 2.778em }
  .clanek-text>hr, .clanek-text .boxik-siroky { margin: 0 0.5625em 0.5em 2.125em }
  .clanek-text>p>.link-youtube, .clanek-text>p>.video-youtube { margin: 0 -1.5625em 0 -3.125em }
  
  .nastenka-prispevek .boxik-vpravo { margin-right: -1.25em; width: 45%; box-shadow: 0.25em 0.25em 0 0.25em #FFF, 0.25em -0.25em 0 0.25em #FFF }
  .nastenka-prispevek .boxik-vlevo { margin-left: -1.25em; width: 45%; box-shadow: -0.25em 0.25em 0 0.25em #FFF, -0.25em -0.25em 0 0.25em #FFF }
}

@media (max-width: 580px) {
  #hlavicka menu { font-size: 1.32vw; }
  #hlavicka h1 img { margin-top: 38%; width: 110% }

  .hry-vyjezd { margin-left: -2.9vw }
  .hry-vyjezd .hra-vstup { font-size: 2.9vw; margin-left: 1em }

  .soutez-hodnoceni { font-size: 24px }
  .soutez-hlas:nth-child(5):after { left: 0; right: auto; transform-origin: 0% 100% }
  .soutez-hlas:nth-child(5):hover:after { transform: rotate(-10deg); transform: rotate(-10deg) translate3d(0px,0px,1px) }

  .darky-skupina .darek-bunka { width: 50% }
  .darky-skupina .darek-fotka { width: 34.483vw; height: 25.862vw }
  .darky-skupina .darky-uvod { width: auto; padding: 1em 0 }
}
@media (min-width: 581px) {
  #hlavicka menu { font-size: 1.2vw; width: 85.5%; left: 14%; }
  #hlavicka h1 a:before { opacity: 1 }
  #hlavicka menu #cedule-a .cedule { box-shadow: 0 -0.2em 0.5em -0.75em #000 }
}
@media (max-width: 1120px) and (min-width: 1000px) {
  #hlavicka menu { font-size: 12px }
}

@media (max-width: 560px) {
  html { font-size: 83.333% }
  .bocni-menu ul { font-size: 100% }
  .nastenka-uvod { font-size: 120% }
  .blok-souvisejici { font-size: 135%; line-height: 1.35 }
  .soutez .blok-souvisejici, .darek .blok-souvisejici { font-size: 125% }

  .clanek-text { font-size: 110% }
  .clanek-text>p, .clanek-text>ol, .clanek-text>ul, .clanek-text>.kviz, .clanek-text>h2, .clanek-text>h3, .clanek-souvisejici { padding: 0 }
  .clanek-text>.kviz ol { margin-left: 2em }
  .clanek-text .boxik-vpravo { width: 45%; font-size: 90%; line-height: 1.6em }
  .clanek-text>hr, .clanek-text .boxik-siroky { margin: 0 0 0.5em 0 }
  .clanek-text>p>.link-youtube, .clanek-text>p>.video-youtube { margin: 0 }

  #hledani-strom #slovo { top: 0.25em; padding: 0.2em 0.6em; line-height: 1.5em; height: 1.5em; border-radius: 0.5em; box-shadow: 0.14rem 0.14rem 0.35rem rgba(0,0,0,0.125) inset; }
  .tabule-konto span { font-size: 200%; margin: 0.3em 0 0 0 }
  .tabule-konto i { display: none }
  .tabule-konto b:after { content: ' ' attr(data-jednotky) }

  .smiley { height: 17.5px; margin: 0 1.667px }
  .clanek-vstup h3 { font-size: 192% }
  .clanek-vstup { min-height: 0 }
  .clanek-vstup .clanek-fotka { width: 35.714vw; height: 26.786vw; position: static; float: left }
  .clanek-vstup>a { margin-left: -1.25em }
  .clanek-vstup .clanek-perex { clear: none }
  .clanek-vstup .clanek-perex, .clanek-vstup .clanek-cas { margin-left: 35.714vw; }
  .clanek-vstup .clanek-cas:first-child { text-align: right }

  .soutez-vstup-fotka .soutez-fotka { width: 35.714vw; height: 26.786vw }
  .soutez-vstup-fotka { min-height: 26.786vw }
  .soutez-vstup-fotka>a, .soutez-vstup-fotka .obsah-text { margin-right: 35.714vw }

  .odpoved-autor img { width: 3.571em; height: 4.286em; }

  .sekce-o .col-bc { margin: 0 2%; padding: 0.01em 1em 1em 1em; border-radius: 1.5em }
  
  .sekce-n .mimoblok .ilustrace { display: none }
  .nastenka-nazev a { font-size: 108.333% }
  .titulka .clanek-vstup { min-height: 0; margin: 0 0 1.5em 0 }
  .titulka .clanek-vstup>a { margin-left: -1em }
  .titulka .clanek-vstup .clanek-perex { margin-bottom: 0.5em }
  .titulka .soutez { margin: 0 0 1.5em }
  
  #platno .col-o, #platno .col-p { width: auto; display: block; clear: both }
  #platno .col-p { border-top: 2px dotted rgba(255,255,255,0.4); padding-top: 1.5em }
  #platno .bocni-menu { width: auto }
  #platno .obrazky-vyjezd .obrazek-bunka, #platno .obrazek-nahled, #platno .obrazek-upravy { width: 160px }
  #platno .obrazek-nahled > span { width: 160px; height: 120px }
  #platno .obrazek-nahled img { max-width: 160px }
  .obrazek-mista { width: calc(100vw - 8em) }
}

@media (max-width: 480px) {
  html { font-size: 75% }
  .bocni-menu { font-size: 177.777% }
  .smiley { height: 15.75px; margin: 0 1.5px }
  .nastenka-uvod { font-size: 133.333% }
  .blok-souvisejici { font-size: 150% }
  
  #hlavicka { background: url("layout/strom-spodek-500.png") 50% 0 no-repeat, linear-gradient(#23A1E0 25%, #76C0F0 75%); background-size: cover }
  .content .trava { background-image: url("layout/strom-spodek.png") }

  #hlavicka menu { font-size: 1.4vw; bottom: 0.8em; }
  #hlavicka menu li:before, #hlavicka menu li:after { bottom: -0.8em }
  .prihlasit-moznosti a { font-size: 116.666%; line-height: 2em }
  .cedule { filter: none }
  .cedule .cedule-text { font-size: 140% }
  
  .nastenky { border-spacing: 0; font-size: 100%; border-radius: 0.8em 0.8em 0 0 }
  .nastenky a { position: relative; z-index: 2; }
  .nastenky, .nastenky tbody, .nastenky tr, .nastenky th, .nastenky td { display: block }
  .nastenky tr { display: block; position: relative; width: 100%; float: left; padding: 0; margin: 0; border: 0; border-bottom: 1px dotted #38D; overflow: hidden; background: rgba(255,255,255,0.667); background: linear-gradient(0deg, rgba(255,255,255,0.3), rgba(255,255,255,0.35), rgba(255,255,255,0.8)); }
  .nastenky th { padding: 0 }
  .nastenky tr td, .nastenky tr th { display: inline; background: 0 !important; border: 0 }
  .nastenky tr:first-child { background: #38D; border-radius: 0.8em 0.8em 0 0 }
  .nastenky th>a, .nastenky th>span { margin-top: 0; margin-left: 0; line-height: 1.33 }
  .nastenky th.nastenka-pocet { display: none }
  .nastenky th.nastenka-posledni { position: absolute; top: 0; right: 0.75em; }
  .nastenka-oblibena { display: block !important }
  .nastenka-oblibena .nastenka-pocet { margin-right: 0px }
  .nastenka-oblibena .nastenka-pocet span:before { float: right; margin-left: 0.25em; width: 1.5em; height: 1.5em; background-size: cover }
  .nastenky .nastenka-nazev { position: static }
  .nastenka-nazev a { padding: 0.5em 0.75em; font-size: 100% }
  .nastenka-nazev span a { font-size: 133.333%; padding: 0.5625em 6.8em 0.1875em 0.5625em; line-height: 1.40625em; }
  .nastenka-nazev span a:after { content: ""; position: absolute; left: -100px; right: -200px; bottom: -100px; top: -100px; z-index: 1 }
  .nastenky .nastenka-nazev { border-radius: 0 }
  .nastenka-jmeno > a, .nastenka-jmeno > span { float: right; padding: 0.5em 0; line-height: 1.5em; overflow: visible; position: relative }
  .nastenky .nastenka-posledni u, .nastenky .nastenka-posledni small { display: inline; float: right; }
  .nastenky .nastenka-posledni small:after { content: ","; margin: 0 0.5em 0.5em 0 }
  .nastenky .nastenka-jmeno small { font-size: 100%; margin: 0 }
  .nastenky .nastenka-posledni u { margin-right: 4.25em; font-weight: bold }
  .nastenky .nastenka-posledni br { display: none }
  .nastenky .nastenka-tema { right: auto; left: 0; bottom: 0; white-space: nowrap; z-index: 3; padding: 0.25em 0.75em 0.5em 0.75em }
  .nastenky .nastenka-pocet { position: absolute; top: 0.75em; right: 4.25em; text-align: right; padding-right: 0 }
  .nastenky .nastenka-pocet span:after { content: " " attr(data-slovo); display: block; font-size: 75%; line-height: 1em }
  .nastenky .nastenka-posledni img { position: absolute; right: 0.416em; top: -1.75em; width: 3.333em; height: 4em }
  .nastenky:after { content: ""; clear: both; display: block; height: 0.5em; background: rgba(255,255,255,0.3); border-bottom: 1px dotted #38D }
  .nastenky tr:last-child { border-bottom-style: none; }

  .konto { border-spacing: 0 }
  .konto tr { display: block; width: 100%; background: rgba(255,255,255,0.667); border-radius: 0.75em; margin: 0 0 0.5em 0; clear: both; overflow: hidden }
  .konto td { display: block; background: 0; border: 0 }
  .konto .konto-hlavicka { display: none }
  .konto .konto-soucet { background: #FFF }
  .konto-soucet td:first-child { float: left }
  .konto .konto-cas { float: left; }
  .konto .konto-cas b:first-child { display: inline }
  .konto .konto-autor { float: left }
  .konto .konto-autor-prazdny { display: none }
  .konto .konto-cas+.konto-autor { float: right }
  .konto .konto-autor[data-slovo]:before { content: attr(data-slovo) }
  .konto .konto-pocet { float: right }
  .konto .konto-popis { clear: both; border: 1px solid rgba(0,0,0,0.25); border-width: 1px 0; padding: 0.5em 0; margin: 0 0.75em }
  
  .titulka .nastenky th { padding: 0.5em 0.75em; display: block }
  .titulka .nastenky th+th { display: none }
  .titulka .nastenky { background: #CFE1FF; overflow: hidden }
  .titulka .nastenka-jmeno a { overflow: visible }
  .titulka .nastenka-jmeno span { margin-right: 4.25em }
  
  .maluje #main { transform: translateY(-50vh) }
  .maluje #platno { left: 0; top: 3.5em; height: auto; bottom: 0 }
  #platno-zpet { width: auto; left: 0; right: 0; bottom: 100%; top: auto; height: 3.5em; background: linear-gradient(180deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.75) 3em, rgba(0, 0, 0, 1) 3em); }
  .obrazek-mista { width: calc(100vw - 4.5em) }

  .sekce-o .bocni-menu ul { -webkit-columns: 1; columns: 1 }
}
@media (max-width: 395px) {
  html { font-size: 66.667% }
  .bocni-menu { font-size: 200% }
  .blok-souvisejici { font-size: 175% }
  .smiley { height: 14px; margin: 0 1.333px }
  
  #cedule-a .cedule { -webkit-transform: translateY(0.53em) rotate(-1.00deg); -ms-transform: translateY(0.53em) rotate(-1.00deg); transform: translateY(0.53em) rotate(-1.00deg) }
  #cedule-k .cedule { -webkit-transform: translateY(0.13em) rotate(0.75deg); -ms-transform: translateY(0.13em) rotate(0.75deg); transform: translateY(0.13em) rotate(0.75deg); }
  #cedule-h .cedule { -webkit-transform: translateY(-0.20em) rotate(-1.25deg); -ms-transform: translateY(-0.20em) rotate(-1.25deg); transform: translateY(-0.20em) rotate(-1.25deg); }
  #cedule-n .cedule { -webkit-transform: translateY(-0.13em) rotate(0.75deg); -ms-transform: translateY(-0.13em) rotate(0.75deg); transform: translateY(-0.13em) rotate(0.75deg); }
  #cedule-s .cedule { -webkit-transform: rotate(-0.50deg); -ms-transform: rotate(-0.50deg); transform: rotate(-0.50deg); }
  #cedule-v .cedule { -webkit-transform: rotate(0.75deg); -ms-transform: rotate(0.75deg); transform: rotate(0.75deg); }
  #cedule-p .cedule { -webkit-transform: translateY(0.53em) rotate(1.50deg); -ms-transform: translateY(0.53em) rotate(1.50deg); transform: translateY(0.53em) rotate(1.50deg); }
  #cedule-u .cedule { -webkit-transform: translateY(0.33em) rotate(0.75deg); -ms-transform: translateY(0.33em) rotate(0.75deg); transform: translateY(0.33em) rotate(0.75deg); }

  .hry-vyjezd { margin-left: -3.9vw }
  .hry-vyjezd .hra-vstup { font-size: 4.4vw; margin-left: 3.9vw; margin-right: 0 }

  .nastenka-nazev span a { font-size: 150%; padding: 0.5em 7em 0.1667em 0.5em; line-height: 1.25em }
  .mimo-mobil-mini { display: none }
}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
  .darek-cenovka { text-shadow: 1px 1px 0 #806300, -1px -1px 0 #806300, -1px 1px 0 #806300, 1px -1px 0 #806300, 1px 0 0 #806300, -1px 0 0 #806300, 0 1px 0 #806300, 0 -1px 0 #806300, 0.5px 1px 0 #806300, -0.5px -1px 0 #806300, -0.5px 1px 0 #806300, 0.5px -1px 0 #806300, 0.5px 0 0 #806300, -0.5px 0 0 #806300, 0 1px 0 #806300, 0 -1px 0 #806300, 1px 0.5px 0 #806300, -1px -0.5px 0 #806300, -1px 0.5px 0 #806300, 1px -0.5px 0 #806300, 1px 0 0 #806300, -1px 0 0 #806300, 0 0.5px 0 #806300, 0 -0.5px 0 #806300, 0 0.125em 0.25em rgba(0, 0, 0, 0.5); }
}