﻿/* Vložená data */
@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@300;600&family=Sansita+Swashed:wght@300;600;900&display=swap');

/* NastavenĂ­ posuvnĂ­ku */
/* width */
::-webkit-scrollbar { width: 6px;}
/* Track */
::-webkit-scrollbar-track { background: #222;}
/* Handle */
::-webkit-scrollbar-thumb { background: #fff;}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover { background: #444;}

body { width: 100%; font-family: 'League Spartan', sans-serif; margin: 0 0 0 0; font-size: 24px; font-weight: 300; color: #FFF; background: linear-gradient(100rad, #2D2C3A, #2D2C3A, #2D2C3A, #3D3C4A, #2D2C3A);}

/* Rozhraní pro notebook + PC */
@media screen and (min-width: 1180px) {
    #facebody { width: 100%; min-height: 100vh; position: relative;}

    /* Definice textu */
    .free { width:100%; height: 20px;}
    .free-big { width: 100%; height: 50px;}
    .free-mini { width: 100%; height: 12px;}
    .space { width: 100%; height: 40px;}
    .top-space { width: 100%; height: 80px;}

    h1, .nadpis { font-size: 46px; margin: 0 0 20px 0; font-weight: 300; font-family: 'Sansita Swashed', cursive;}
    h2, .classic-txt, .classic-txt-seznam, .classic-txt-special { font-size: 28px; margin: 0 0 10px 0; font-weight: 300;}
    .classic-txt-seznam { width: calc(100% - 20px); padding: 0 0 0 20px; margin: 0 0 10px 0; text-align: left; background: url('../themes/seznam.fw.png') 4px 8px no-repeat;}
    h1 span, h2 span, .classic-txt-special span, .classic-txt span, .classic-txt-seznam span, .classic-txt-special span  { font-weight: 600; color: #2467b2;}
    .nadpis span { font-weight: 900; font-size: 54px;}
    a.h1, h1 a, a.h2, h2 a, a.nadpis, a.classic-txt, .classic-txt a, .nadpis a { color: #FFF; text-decoration: none;}
    a.h1:hover, h1 a:hover, a.h2:hover, h2 a:hover, a.nadpis:hover, a.classic-txt:hover, .classic-txt a:hover, .nadpis a:hover { color: #36A4D9; text-decoration: 1px underline #FFF;}

    /* Základní nastavení */
    section { padding: 100px 0;}
    #topist { padding: 0;}

    /* Hlavička webu */
    header { width: 100%; height: 800px; text-align: left;}
    .header-radius { width: 90%; height: 790px; position: absolute; margin: 0; text-align: left; border-top-right-radius: 600px; border-top: 1px solid rgba(107,107,107,.4);}
    .header-logo { width: 367px; height: 120px; position: absolute; margin: 30px 0 0 calc(50% - 580px); background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}

    .header-topmotiv { width: 440px; height: 640px; position: absolute; margin: 60px 0 0 calc(50% - 220px);}
    .header-topmotiv-cross { width: 438px; height: 638px; position: absolute; margin: 0; border: 1px solid #6b6b6b; border-top-left-radius: 220px; border-top-right-radius: 220px; border-bottom-left-radius: 220px; border-bottom-right-radius: 220px;}
    .header-topmotiv-pict { width: 418px; height: 618px; position: absolute; margin: 10px; overflow: hidden; border: 1px solid #FFF; border-top-left-radius: 220px; border-top-right-radius: 220px; border-bottom-left-radius: 220px; border-bottom-right-radius: 220px; background: url('../themes/photo.fw.png') top left no-repeat; background-size: auto 620px;}
    .header-topmotiv-emblem { width: 200px; height: 200px; position: absolute; margin: 160px 0 0 380px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .header-topmotiv-back { width: 30px; height: 90px; position: absolute; margin: 630px 0 0 205px;}
    .header-topmotiv-back-point { width: 14px; height: 14px; position: absolute; margin: 2px 0 0 8px; border-radius: 14px; background: #FFF;}
    .header-topmotiv-back-point-obrys { width: 4px; height: 4px; position: absolute; margin: 20px 0 0 11px; border-radius: 14px; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-point-obrys { border: 2px solid #6b6b6b;}
    a.header-topmotiv-back:hover .header-topmotiv-back-point-obrys { border: 2px solid #36A4D9;}
    .header-topmotiv-back-arrow { width: 40px; height: 40px; position: absolute; background: url('../themes/dale.fw.png') top no-repeat; background-size: cover; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-arrow { margin: 30px 0 0 -5px;}
    a.header-topmotiv-back:hover .header-topmotiv-back-arrow { margin: 40px 0 0 -5px;}

    nav { width: 298px; height: 58px; position: absolute; text-align: left; margin: 30px 0 0 calc(50% + 280px); border: 1px solid #6b6b6b; border-radius: 30px;}
    .navi-maps { width: 50px; height: 50px; position: absolute; margin: 5px; border-radius: 100%; background: #2467b2;}
    .navi-maps-icon { width: 40px; height: 56px; position: absolute; margin: 5px; transition: all 0.35s ease-in-out;}
    a.navi-maps .navi-maps-icon { background: url('../themes/maps.fw.png') top no-repeat; background-size: cover;}
    a.navi-maps:hover .navi-maps-icon { background: url('../themes/maps.active.fw.png') top no-repeat; background-size: cover;}
    .navi-button { width: 123px; height: 14px; position: absolute; margin: 4px 0 0 60px; font-size: 18px; font-weight: 900; text-align: center; padding: 18px 0; border-radius: 25px; background: #2467b2;}
    .navi-facebook { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 188px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.navi-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .navi-instagram { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 243px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.navi-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}

    .header-tituls { width: 520px; height: 220px; position: absolute; margin: 250px 0 0 calc(50% - 440px); background: url('../themes/tituls.1.fw.png') left no-repeat; background-size: auto 220px;}
    .header-tituls-back { width: 232px; height: 220px; position: absolute; margin: 0; background: url('../themes/tituls.0.fw.png') left no-repeat; background-size: auto 220px;}

    .header-temp { width: 300px; height: 200px; position: absolute; margin: 360px 0 0 calc(50% + 280px);}
    .header-temp-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 70px; background: url('../themes/tempret.fw.png') top no-repeat; background-size: cover;}
    .header-temp-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 10px;}
    .header-temp-ID-min { width: 120px; height: 50px; position: absolute; margin: 0; padding: 30px 0 0 0;}
    .header-temp-ID-max { width: 120px; height: 50px; position: absolute; margin: 0 0 0 160px; padding: 30px 0 0 0;}
    .header-temp-ID-min h2, .header-temp-ID-max h2 { font-size: 50px; text-align: center;}
    .header-temp-ID-min h2 span, .header-temp-ID-max h2 span { color: #FFF; font-weight: 900;}
    .header-temp-ID-min h2 sup, .header-temp-ID-max h2 sup { font-size: 20px;}
    .header-temp-ID-before { width: 40px; height: 16px; position: absolute; margin: 45px 0 0 120px; background: url('../themes/before.fw.png') top no-repeat; background-size: cover;}
    .header-temp-error { width: 100%; height: 20px; text-align: center; position: absolute; margin: 40px 0 0 0; color: #36A4D9;}
    .header-temp-error h2 { font-size: 16px;}

    .header-swim { width: 340px; height: 200px; position: absolute; margin: 590px 0 0 calc(50% + 200px);}
    .header-swim-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 90px; background: url('../themes/swimmer.png') top no-repeat; background-size: cover;}
    .header-swim-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 30px;}
    .header-swim-ID-info { width: 120px; height: 55px; position: absolute; margin: 0; padding: 25px 0 0 0;}
    .header-swim-ID-info h2 { font-size: 18px; text-align: left; color: #FFF;}
    .header-swim-ID-info h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-info h2 sup { font-size: 12px; font-weight: 900;}
    .header-swim-ID-num { width: 150px; height: 50px; position: absolute; margin: 0 0 0 130px; padding: 22px 0 0 0;}
    .header-swim-ID-num h2 { font-size: 50px; text-align: right;}
    .header-swim-ID-num h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-popis { width: 150px; height: 20px; position: absolute; margin: 70px 0 0 130px; text-align: right; font-size: 16px;}

    .header-info { width: 400px; height: 220px; position: absolute; margin: 530px 0 0 calc(50% - 580px);}
    .header-info .nadpis span { height: 30px; font-size: 24px; margin: 0; padding: 10px 20px; font-weight: 900; font-family: 'League Spartan', sans-serif; background: #2467b2;}
    .header-info h2 { margin: 0; font-size: 28px; font-family: 'Sansita Swashed', cursive;}
    .header-info h2 span { color: #FFF;}

    .header-star-a { width: 60px; height: 60px; position: absolute; margin: 200px 0 0 calc(50% + 500px); background: url('../themes/star.blue.fw.png') top no-repeat; background-size: cover;}
    .header-star-b { width: 50px; height: 50px; position: absolute; margin: 220px 0 0 calc(50% - 520px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}
    .header-star-c { width: 40px; height: 40px; position: absolute; margin: 440px 0 0 calc(50% + 250px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}

    /* Spodní část webu */
    footer { width: 100%; height: auto; padding: 100px 0 40px 0;}
    .footer-content { width: 100%; height: 90px; text-align: left;}
    .footer-odkaz { width: 390px; height: 50px; position: absolute; margin: -15px 0 0 calc(50% - 195px);}
    .footer-odkaz-logo { width: 153px; height: 50px; position: absolute; margin: 0; background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-emblem { width: 80px; height: 80px; position: absolute; margin: -15px 0 0 170px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-facebook { width: 50px; height: 50px; position: absolute; margin: 0 0 0 270px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-instagram { width: 50px; height: 50px; position: absolute; margin: 0 0 0 340px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    .copyright { width: 250px; height: 20px; position: absolute; margin: 60px 0 0 20px;}
    .copyright h2 { font-size: 20px}
    .creative { width: 250px; height: 20px; position: absolute; margin: 60px 0 0 calc(100% - 270px);}
    .rhotechnology { width: 240px; height: 25px; position: absolute; margin: -20px 0 0 10px; transition: all 0.35s ease-in-out;}
    a.rhotechnology { background: url('../themes/creator.fw.png') left no-repeat; background-size: auto 25px;}
    a.rhotechnology:hover { background: url('../themes/creator.active.fw.png') left no-repeat; background-size: auto 25px;}
    .romandesign { width: 204px; height: 25px; position: absolute; margin: 15px 0 0 46px; transition: all 0.35s ease-in-out;}
    a.romandesign { background: url('../themes/creator.fw.png') right no-repeat; background-size: auto 25px;}
    a.romandesign:hover { background: url('../themes/creator.active.fw.png') right no-repeat; background-size: auto 25px;}

    /* Kontakt */
    #contact-face { width: 100%; height: auto; padding: 100px 0 40px 0;}
    #contact { width: calc(100% - 20px); height: auto; display: flex; justify-content: space-evenly;}
    .contact-box { width: 360px; height: auto; margin: 0;}
    .contact-box h1 { text-align: center;}
    .contact-box h2 { text-align: center;}

    /* Maps */
    #maps-back { width: 100%; height: 800px; padding: 0; background: url('../themes/mapa.fw.png') top no-repeat; background-size: auto 840px;}
    .maps-ID { width: 320px; height: 80px; position: absolute; margin: 380px 0 0 calc(50% - 140px); padding: 0 0 0 80px; text-align: left;}
    .maps-ID-icon { width: 57px; height: 80px; position: absolute; margin: 0 0 0 -80px; background: url('../themes/mapa.icon.fw.png') top no-repeat; background-size: cover;}

    /* Pravidla provozu */
    #rulers-face { width: 100%; height: auto; padding: 100px 0 0 0;}
    .rulers { width: 100%; height: auto;}
    .rulers-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .rulers h1 { text-align: center;}
    .rulers h2 { width: 80%; text-align: left;}
    .rulers-data { width: 70%;}

    /* Výzva */
    #challenge-face { width: 100%; height: auto; padding: 20px 0 40px 0;}
    .challenge { width: 100%; height: auto;}
    .challenge-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .challenge h1 { text-align: center;}
    .challenge-data { width: 1000px; height: 100px; margin: 0 0 0 0;}
    .challenge-data-left, .challenge-data-right { width: 498px; height: 100px; position: absolute; margin: 0; border-right: 1px dotted #36A4D9;}
    .challenge-data-right { width: 500px; margin: 0 0 0 500px; border: none;}
    .challenge-data-ID, .challenge-data-right .challenge-data-ID { width: 250px; height: 80px; position: absolute; margin: 0; padding: 10px 20px;}
    .challenge-data-right .challenge-data-ID { margin: 0 0 0 210px;}
    .challenge-data-popis, .challenge-data-right .challenge-data-popis { text-align: left; width: 210px; height: 30px; position: absolute; margin: 0 0 0 290px; padding: 35px 0;}
    .challenge-data-right .challenge-data-popis { margin: 0 0 0 0; padding: 35px 0;}
    .challenge-data-popis span { font-weight: 600; color: #FFF;}
    .challenge-data-ID h1 { height: 80px; text-align: right; font-size: 60px; font-weight: 900; color: #2467b2; margin: 0 0 10px 0;}
    .challenge-data-right .challenge-data-ID h1 { text-align: left;}
    .challenge-data-popis h2 { font-size: 18px;}
    .challenge-data-right .challenge-data-popis h2 { text-align: right;}

    /* Otevírací doba + Ceník služeb */
    #open-face, #prize-face { width: 100%; height: auto; padding-bottom: 50px;}

    .boxing { width: 100%; display: flex; justify-content: space-evenly;}
    .boxing-content { width: 580px; height: auto; margin: 0 0 0 0;}
    .boxing-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .boxing-content h1 { text-align: center;}
    .boxing-databox, .boxing-databox-big { width: 580px; height: 50px; margin: 0 0 5px 0; border-radius: 10px;}
    .boxing-databox-big { height: 80px;}
    .boxing-databox-left { width: 340px; height: 18px; position: absolute; margin: 0; padding: 16px 20px;}
    .boxing-databox-right { width: 180px; height: 24px; position: absolute; margin: 0 0 0 360px; text-align: right; padding: 13px 20px; font-size: 30px;}
    .boxing-databox-right sup { font-size: 16px;}
    .box-shadow-04 { background: rgba(255,255,255,.04);}
     .box-shadow-08 { background: rgba(255,255,255,.08);}

    /* Galerie */
    #gallery-face { width: 100%; height: 950px; padding: 0;}
    .gallery { width: 100%; height: auto; text-align: left;}
    .gallery-linear { width: 80px; height: 5px; margin: 0 0 0 590px; background: #2467b2;}
    .gallery h1 { text-align: center;}

    .gallery-app { width: 1200px; height: 1000px; position: absolute; margin: -50px 0 0 calc(50% - 600px); text-align: left; background: url('../themes/galerie.fw.png') top no-repeat; background: cover;}
    .gallery-app-01 { width: 300px; height: 500px; position: absolute; margin: 0;}
    .gallery-app-01-content { width: 278px; height: 478px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02 { width: 600px; height: 300px; position: absolute; margin: 200px 0 0 300px;}
    .gallery-app-02-content { width: 578px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02-content img { width: 580px;}
    .gallery-app-03 { width: 300px; height: 500px; position: absolute; margin: 75px 0 0 900px;}
    .gallery-app-03-content { width: 278px; height: 478px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-04 { width: 300px; height: 500px; position: absolute; margin: 500px 0 0 300px;}
    .gallery-app-04-content { width: 278px; height: 478px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-01-content img, .gallery-app-03-content img, .gallery-app-04-content img { height: 480px;}
    .gallery-app-05 { width: 300px; height: 300px; position: absolute; margin: 700px 0 0 0;}
    .gallery-app-05-content { width: 278px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-06 { width: 300px; height: 300px; position: absolute; margin: 500px 0 0 600px;}
    .gallery-app-06-content { width: 278px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-07 { width: 300px; height: 300px; position: absolute; margin: 700px 0 0 900px;}
    .gallery-app-07-content { width: 278px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-05-content img, .gallery-app-06-content img, .gallery-app-07-content img { height: 280px;}
}

/* iPad */
@media screen and (min-width: 1024px) and (max-width: 1179px) {
    #facebody { width: 100%; min-height: 100vh; position: relative;}

    /* Definice textu */
    .free { width:100%; height: 20px;}
    .free-big { width: 100%; height: 50px;}
    .free-mini { width: 100%; height: 12px;}
    .space { width: 100%; height: 40px;}
    .top-space { width: 100%; height: 80px;}

    h1, .nadpis { font-size: 42px; margin: 0 0 20px 0; font-weight: 300; font-family: 'Sansita Swashed', cursive;}
    h2, .classic-txt, .classic-txt-seznam, .classic-txt-special { font-size: 26px; margin: 0 0 10px 0; font-weight: 300;}
    .classic-txt-seznam { width: calc(100% - 20px); padding: 0 0 0 20px; margin: 0 0 10px 0; text-align: left; background: url('../themes/seznam.fw.png') 4px 8px no-repeat;}
    h1 span, h2 span, .classic-txt-special span, .classic-txt span, .classic-txt-seznam span, .classic-txt-special span  { font-weight: 600; color: #2467b2;}
    .nadpis span { font-weight: 900; font-size: 50px;}
    a.h1, h1 a, a.h2, h2 a, a.nadpis, a.classic-txt, .classic-txt a, .nadpis a { color: #FFF; text-decoration: none;}
    a.h1:hover, h1 a:hover, a.h2:hover, h2 a:hover, a.nadpis:hover, a.classic-txt:hover, .classic-txt a:hover, .nadpis a:hover { color: #36A4D9; text-decoration: 1px underline #FFF;}

    /* Základní nastavení */
    section { padding: 80px 0;}
    #topist { padding: 0;}

    /* Hlavička webu */
    header { width: 100%; height: 1000px; text-align: left;}
    .header-radius { width: 90%; height: 990px; position: absolute; margin: 0; text-align: left; border-top-right-radius: 600px; border-top: 1px solid rgba(107,107,107,.4);}
    .header-logo { width: 367px; height: 120px; position: absolute; margin: 30px 0 0 calc(50% - 500px); background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}

    .header-topmotiv { width: 440px; height: 640px; position: absolute; margin: 120px 0 0 calc(50% - 220px);}
    .header-topmotiv-cross { width: 438px; height: 638px; position: absolute; margin: 0; border: 1px solid #6b6b6b; border-top-left-radius: 220px; border-top-right-radius: 220px; border-bottom-left-radius: 220px; border-bottom-right-radius: 220px;}
    .header-topmotiv-pict { width: 418px; height: 618px; position: absolute; margin: 10px; overflow: hidden; border: 1px solid #FFF; border-top-left-radius: 220px; border-top-right-radius: 220px; border-bottom-left-radius: 220px; border-bottom-right-radius: 220px; background: url('../themes/photo.fw.png') top left no-repeat; background-size: auto 620px;}
    .header-topmotiv-emblem { width: 200px; height: 200px; position: absolute; margin: 200px 0 0 380px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .header-topmotiv-back { width: 30px; height: 90px; position: absolute; margin: 630px 0 0 205px;}
    .header-topmotiv-back-point { width: 14px; height: 14px; position: absolute; margin: 2px 0 0 8px; border-radius: 14px; background: #FFF;}
    .header-topmotiv-back-point-obrys { width: 4px; height: 4px; position: absolute; margin: 20px 0 0 11px; border-radius: 14px; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-point-obrys { border: 2px solid #6b6b6b;}
    a.header-topmotiv-back:hover .header-topmotiv-back-point-obrys { border: 2px solid #36A4D9;}
    .header-topmotiv-back-arrow { width: 40px; height: 40px; position: absolute; background: url('../themes/dale.fw.png') top no-repeat; background-size: cover; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-arrow { margin: 30px 0 0 -5px;}
    a.header-topmotiv-back:hover .header-topmotiv-back-arrow { margin: 40px 0 0 -5px;}

    nav { width: 298px; height: 58px; position: absolute; text-align: left; margin: 30px 0 0 calc(50% + 200px); border: 1px solid #6b6b6b; border-radius: 30px;}
    .navi-maps { width: 50px; height: 50px; position: absolute; margin: 5px; border-radius: 100%; background: #2467b2;}
    .navi-maps-icon { width: 40px; height: 56px; position: absolute; margin: 5px; background: url('../themes/maps.fw.png') top no-repeat; background-size: cover;}
    .navi-button { width: 123px; height: 14px; position: absolute; margin: 4px 0 0 60px; font-size: 18px; font-weight: 900; text-align: center; padding: 18px 0; border-radius: 25px; background: #2467b2;}
    .navi-facebook { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 188px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.navi-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .navi-instagram { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 243px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.navi-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}

    .header-tituls { width: 520px; height: 220px; position: absolute; margin: 300px 0 0 calc(50% - 440px); background: url('../themes/tituls.1.fw.png') left no-repeat; background-size: auto 220px;}
    .header-tituls-back { width: 232px; height: 220px; position: absolute; margin: 0; background: url('../themes/tituls.0.fw.png') left no-repeat; background-size: auto 220px;}

    .header-temp { width: 340px; height: 200px; position: absolute; margin: 580px 0 0 calc(50% + 200px);}
    .header-temp-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 90px; background: url('../themes/tempret.fw.png') top no-repeat; background-size: cover;}
    .header-temp-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 30px;}
    .header-temp-ID-min { width: 120px; height: 50px; position: absolute; margin: 0; padding: 30px 0 0 0;}
    .header-temp-ID-max { width: 120px; height: 50px; position: absolute; margin: 0 0 0 160px; padding: 30px 0 0 0;}
    .header-temp-ID-min h2, .header-temp-ID-max h2 { font-size: 50px; text-align: center;}
    .header-temp-ID-min h2 span, .header-temp-ID-max h2 span { color: #FFF; font-weight: 900;}
    .header-temp-ID-min h2 sup, .header-temp-ID-max h2 sup { font-size: 20px;}
    .header-temp-ID-before { width: 40px; height: 16px; position: absolute; margin: 45px 0 0 120px; background: url('../themes/before.fw.png') top no-repeat; background-size: cover;}
    .header-temp-error { width: 100%; height: 20px; text-align: center; position: absolute; margin: 40px 0 0 0; color: #36A4D9;}
    .header-temp-error h2 { font-size: 16px;}

    .header-swim { width: 340px; height: 200px; position: absolute; margin: 800px 0 0 calc(50% + 140px);}
    .header-swim-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 90px; background: url('../themes/swimmer.png') top no-repeat; background-size: cover;}
    .header-swim-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 30px;}
    .header-swim-ID-info { width: 120px; height: 55px; position: absolute; margin: 0; padding: 25px 0 0 0;}
    .header-swim-ID-info h2 { font-size: 18px; text-align: left; color: #FFF;}
    .header-swim-ID-info h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-info h2 sup { font-size: 12px; font-weight: 900;}
    .header-swim-ID-num { width: 150px; height: 50px; position: absolute; margin: 0 0 0 130px; padding: 22px 0 0 0;}
    .header-swim-ID-num h2 { font-size: 50px; text-align: right;}
    .header-swim-ID-num h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-popis { width: 150px; height: 20px; position: absolute; margin: 70px 0 0 130px; text-align: right; font-size: 16px;}

    .header-info { width: 400px; height: 220px; position: absolute; margin: 730px 0 0 calc(50% - 480px);}
    .header-info .nadpis span { height: 30px; font-size: 24px; margin: 0; padding: 10px 20px; font-weight: 900; font-family: 'League Spartan', sans-serif; background: #2467b2;}
    .header-info h2 { margin: 0; font-size: 28px; font-family: 'Sansita Swashed', cursive;}
    .header-info h2 span { color: #FFF;}

    .header-star-a { width: 60px; height: 60px; position: absolute; margin: 200px 0 0 calc(50% + 420px); background: url('../themes/star.blue.fw.png') top no-repeat; background-size: cover;}
    .header-star-b { width: 50px; height: 50px; position: absolute; margin: 220px 0 0 calc(50% - 420px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}
    .header-star-c { width: 40px; height: 40px; position: absolute; margin: 440px 0 0 calc(50% + 420px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}

    /* Spodní část webu */
    footer { width: 100%; height: auto; padding: 100px 0 40px 0;}
    .footer-content { width: 1020px; height: 90px; text-align: left;}
    .footer-odkaz { width: 390px; height: 50px; position: absolute; margin: -15px 0 0 315px;}
    .footer-odkaz-logo { width: 153px; height: 50px; position: absolute; margin: 0; background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-emblem { width: 80px; height: 80px; position: absolute; margin: -15px 0 0 170px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-facebook { width: 50px; height: 50px; position: absolute; margin: 0 0 0 270px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-instagram { width: 50px; height: 50px; position: absolute; margin: 0 0 0 340px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    .copyright { width: 250px; height: 20px; position: absolute; margin: 60px 0 0 20px;}
    .copyright h2 { font-size: 20px}
    .creative { width: 250px; height: 20px; position: absolute; margin: 60px 0 0 750px;}
    .rhotechnology { width: 240px; height: 25px; position: absolute; margin: -15px 0 0 10px; transition: all 0.35s ease-in-out;}
    a.rhotechnology { background: url('../themes/creator.fw.png') left no-repeat; background-size: auto 25px;}
    a.rhotechnology:hover { background: url('../themes/creator.active.fw.png') left no-repeat; background-size: auto 25px;}
    .romandesign { width: 204px; height: 25px; position: absolute; margin: 10px 0 0 46px; transition: all 0.35s ease-in-out;}
    a.romandesign { background: url('../themes/creator.fw.png') right no-repeat; background-size: auto 25px;}
    a.romandesign:hover { background: url('../themes/creator.active.fw.png') right no-repeat; background-size: auto 25px;}

    /* Kontakt */
    #contact-face { width: 100%; height: auto; padding: 80px 0 30px 0;}
    #contact { width: calc(100% - 20px); height: auto; display: flex; justify-content: space-evenly;}
    .contact-box { width: 330px; height: auto; margin: 0;}
    .contact-box h1 { text-align: center; font-size: 38px;}
    .contact-box h2 { text-align: center; font-size: 24px;}

    /* Maps */
    #maps-back { width: 100%; height: 600px; padding: 0; background: url('../themes/mapa.fw.png') top no-repeat; background-size: auto 620px;}
    .maps-ID { width: 250px; height: 80px; position: absolute; margin: 290px 0 0 calc(50% - 120px); padding: 0 0 0 70px; text-align: left;}
    .maps-ID-icon { width: 43px; height: 60px; position: absolute; margin: 0 0 0 -70px; background: url('../themes/mapa.icon.fw.png') top no-repeat; background-size: cover;}
    .maps-ID h1 { font-size: 36px;}
    .maps-ID h2 { font-size: 22px;}

    /* Pravidla provozu */
    #rulers-face { width: 100%; height: auto; padding: 80px 0 0 0;}
    .rulers { width: 100%; height: auto;}
    .rulers-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .rulers h1 { text-align: center;}
    .rulers h2 { width: 80%; text-align: left;}
    .rulers-data { width: 70%;}

    /* Výzva */
    #challenge-face { width: 100%; height: auto; padding: 20px 0 40px 0;}
    .challenge { width: 100%; height: auto;}
    .challenge-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .challenge h1 { text-align: center;}
    .challenge-data { width: 1000px; height: 100px; margin: 0 0 0 0;}
    .challenge-data-left, .challenge-data-right { width: 498px; height: 100px; position: absolute; margin: 0; border-right: 1px dotted #36A4D9;}
    .challenge-data-right { width: 500px; margin: 0 0 0 500px; border: none;}
    .challenge-data-ID, .challenge-data-right .challenge-data-ID { width: 250px; height: 80px; position: absolute; margin: 0; padding: 10px 20px;}
    .challenge-data-right .challenge-data-ID { margin: 0 0 0 210px;}
    .challenge-data-popis, .challenge-data-right .challenge-data-popis { text-align: left; width: 210px; height: 30px; position: absolute; margin: 0 0 0 290px; padding: 35px 0;}
    .challenge-data-right .challenge-data-popis { margin: 0 0 0 0; padding: 35px 0;}
    .challenge-data-popis span { font-weight: 600; color: #FFF;}
    .challenge-data-ID h1 { height: 80px; text-align: right; font-size: 60px; font-weight: 900; color: #2467b2; margin: 0 0 10px 0;}
    .challenge-data-right .challenge-data-ID h1 { text-align: left;}
    .challenge-data-popis h2 { font-size: 18px;}
    .challenge-data-right .challenge-data-popis h2 { text-align: right;}

    /* Otevírací doba + Ceník služeb */
    #open-face, #prize-face { width: 100%; height: auto; padding-bottom: 50px;}

    .boxing { width: 100%; display: flex; justify-content: space-evenly;}
    .boxing-content { width: 510px; height: auto; margin: 0 0 0 0;}
    .boxing-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .boxing-content h1 { text-align: center; font-size: 40px;}
    .boxing-databox, .boxing-databox-big { width: 500px; height: 50px; margin: 0 0 5px 0; border-radius: 10px;}
    .boxing-databox-big { width: 500px; height: 70px; margin: 0 0 5px 0;}
    .boxing-databox-left { width: 280px; height: 18px; position: absolute; margin: 0; padding: 16px 20px; font-size: 22px;}
    .boxing-databox-right { width: 150px; height: 24px; position: absolute; margin: 0 0 0 320px; text-align: right; padding: 13px 10px; font-size: 26px;}
    .boxing-databox-right sup { font-size: 14px;}
    .box-shadow-04 { background: rgba(255,255,255,.04);}
    .box-shadow-08 { background: rgba(255,255,255,.08);}

    /* Galerie */
    #gallery-face { width: 100%; height: 800px; padding: 0;}
    .gallery { width: 1020px; height: auto; text-align: left;}
    .gallery-linear { width: 80px; height: 5px; margin: 0 0 0 470px; background: #2467b2;}
    .gallery h1 { text-align: center;}

    .gallery-app { width: 1000px; height: 833px; position: absolute; margin: -30px 0 0 10px; text-align: left; background: url('../themes/galerie.fw.png') top no-repeat; background-size: auto 833px;}
    .gallery-app-01 { width: 250px; height: 416px; position: absolute; margin: 0;}
    .gallery-app-01-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02 { width: 500px; height: 250px; position: absolute; margin: 166px 0 0 250px;}
    .gallery-app-02-content { width: 478px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02-content img { width: 480px;}
    .gallery-app-03 { width: 250px; height: 416px; position: absolute; margin: 62px 0 0 750px;}
    .gallery-app-03-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-04 { width: 250px; height: 416px; position: absolute; margin: 416px 0 0 250px;}
    .gallery-app-04-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-01-content img, .gallery-app-03-content img, .gallery-app-04-content img { height: 400px;}
    .gallery-app-05 { width: 250px; height: 250px; position: absolute; margin: 583px 0 0 0;}
    .gallery-app-05-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-06 { width: 250px; height: 250px; position: absolute; margin: 416px 0 0 500px;}
    .gallery-app-06-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-07 { width: 250px; height: 250px; position: absolute; margin: 583px 0 0 750px;}
    .gallery-app-07-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-05-content img, .gallery-app-06-content img, .gallery-app-07-content img { height: 230px;}
}

/* Rozhraní pro tablety */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    #facebody { width: 100%; min-height: 100vh; position: relative;}

    /* Definice textu */
    .free { width:100%; height: 15px;}
    .free-big { width: 100%; height: 40px;}
    .free-mini { width: 100%; height: 9px;}
    .space { width: 100%; height: 30px;}
    .top-space { width: 100%; height: 65px;}

    h1, .nadpis { font-size: 38px; margin: 0 0 16px 0; font-weight: 300; font-family: 'Sansita Swashed', cursive;}
    h2, .classic-txt, .classic-txt-seznam, .classic-txt-special { font-size: 22px; margin: 0 0 8px 0; font-weight: 300;}
    .classic-txt-seznam { width: calc(100% - 20px); padding: 0 0 0 20px; margin: 0 0 10px 0; text-align: left; background: url('../themes/seznam.fw.png') 4px 8px no-repeat;}
    h1 span, h2 span, .classic-txt-special span, .classic-txt span, .classic-txt-seznam span, .classic-txt-special span  { font-weight: 600; color: #2467b2;}
    .nadpis span { font-weight: 900; font-size: 44px;}
    a.h1, h1 a, a.h2, h2 a, a.nadpis, a.classic-txt, .classic-txt a, .nadpis a { color: #FFF; text-decoration: none;}
    a.h1:hover, h1 a:hover, a.h2:hover, h2 a:hover, a.nadpis:hover, a.classic-txt:hover, .classic-txt a:hover, .nadpis a:hover { color: #36A4D9; text-decoration: 1px underline #FFF;}

    /* Základní nastavení */
    section { padding: 70px 0;}
    #topist { padding: 0;}

    /* Hlavička webu */
    header { width: 100%; height: 1050px; text-align: left;}
    .header-radius { width: 90%; height: 1050px; position: absolute; margin: 0; text-align: left; border-top-right-radius: 600px; border-top: 1px solid rgba(107,107,107,.4);}
    .header-logo { width: 306px; height: 100px; position: absolute; margin: 30px 0 0 calc(50% - 360px); background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}

    .header-topmotiv { width: 400px; height: 580px; position: absolute; margin: 120px 0 0 calc(50% - 180px);}
    .header-topmotiv-cross { width: 398px; height: 578px; position: absolute; margin: 0; border: 1px solid #6b6b6b; border-top-left-radius: 200px; border-top-right-radius: 200px; border-bottom-left-radius: 200px; border-bottom-right-radius: 200px;}
    .header-topmotiv-pict { width: 378px; height: 558px; position: absolute; margin: 10px; overflow: hidden; border: 1px solid #FFF; border-top-left-radius: 200px; border-top-right-radius: 200px; border-bottom-left-radius: 200px; border-bottom-right-radius: 200px; background: url('../themes/photo.fw.png') top left no-repeat; background-size: auto 560px;}
    .header-topmotiv-emblem { width: 170px; height: 170px; position: absolute; margin: 190px 0 0 360px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .header-topmotiv-back { width: 30px; height: 90px; position: absolute; margin: 570px 0 0 185px;}
    .header-topmotiv-back-point { width: 14px; height: 14px; position: absolute; margin: 2px 0 0 8px; border-radius: 14px; background: #FFF;}
    .header-topmotiv-back-point-obrys { width: 4px; height: 4px; position: absolute; margin: 20px 0 0 11px; border-radius: 14px; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-point-obrys { border: 2px solid #6b6b6b;}
    a.header-topmotiv-back:hover .header-topmotiv-back-point-obrys { border: 2px solid #36A4D9;}
    .header-topmotiv-back-arrow { width: 40px; height: 40px; position: absolute; background: url('../themes/dale.fw.png') top no-repeat; background-size: cover; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-arrow { margin: 30px 0 0 -5px;}
    a.header-topmotiv-back:hover .header-topmotiv-back-arrow { margin: 40px 0 0 -5px;}

    nav { width: 298px; height: 58px; position: absolute; text-align: left; margin: 30px 0 0 calc(50% + 60px); border: 1px solid #6b6b6b; border-radius: 30px;}
    .navi-maps { width: 50px; height: 50px; position: absolute; margin: 5px; border-radius: 100%; background: #2467b2;}
    .navi-maps-icon { width: 40px; height: 56px; position: absolute; margin: 5px; background: url('../themes/maps.fw.png') top no-repeat; background-size: cover;}
    .navi-button { width: 123px; height: 14px; position: absolute; margin: 4px 0 0 60px; font-size: 18px; font-weight: 900; text-align: center; padding: 18px 0; border-radius: 25px; background: #2467b2;}
    .navi-facebook { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 188px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.navi-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .navi-instagram { width: 50px; height: 50px; position: absolute; margin: 4px 0 0 243px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.navi-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.navi-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}

    .header-tituls { width: 440px; height: 186px; position: absolute; margin: 300px 0 0 calc(50% - 370px); background: url('../themes/tituls.1.fw.png') left no-repeat; background-size: auto 186px;}
    .header-tituls-back { width: 202px; height: 186px; position: absolute; margin: 0; background: url('../themes/tituls.0.fw.png') left no-repeat; background-size: auto 186px;}

    .header-temp { width: 320px; height: 200px; position: absolute; margin: 640px 0 0 calc(50% + 60px);}
    .header-temp-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 80px; background: url('../themes/tempret.fw.png') top no-repeat; background-size: cover;}
    .header-temp-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 20px;}
    .header-temp-ID-min { width: 120px; height: 50px; position: absolute; margin: 0; padding: 30px 0 0 0;}
    .header-temp-ID-max { width: 120px; height: 50px; position: absolute; margin: 0 0 0 160px; padding: 30px 0 0 0;}
    .header-temp-ID-min h2, .header-temp-ID-max h2 { font-size: 50px; text-align: center;}
    .header-temp-ID-min h2 span, .header-temp-ID-max h2 span { color: #FFF; font-weight: 900;}
    .header-temp-ID-min h2 sup, .header-temp-ID-max h2 sup { font-size: 20px;}
    .header-temp-ID-before { width: 40px; height: 16px; position: absolute; margin: 45px 0 0 120px; background: url('../themes/before.fw.png') top no-repeat; background-size: cover;}
    .header-temp-error { width: 100%; height: 20px; text-align: center; position: absolute; margin: 40px 0 0 0; color: #36A4D9;}
    .header-temp-error h2 { font-size: 16px;}

    .header-swim { width: 320px; height: 200px; position: absolute; margin: 640px 0 0 calc(50% - 380px);}
    .header-swim-pict { width: 160px; height: 160px; position: absolute; margin: -30px 0 0 80px; background: url('../themes/swimmer.png') top no-repeat; background-size: cover;}
    .header-swim-ID { width: 280px; height: 80px; position: absolute; margin: 100px 0 0 20px;}
    .header-swim-ID-info { width: 120px; height: 55px; position: absolute; margin: 0; padding: 25px 0 0 0;}
    .header-swim-ID-info h2 { font-size: 18px; text-align: left; color: #FFF;}
    .header-swim-ID-info h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-info h2 sup { font-size: 12px; font-weight: 900;}
    .header-swim-ID-num { width: 150px; height: 50px; position: absolute; margin: 0 0 0 130px; padding: 22px 0 0 0;}
    .header-swim-ID-num h2 { font-size: 50px; text-align: right;}
    .header-swim-ID-num h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-popis { width: 150px; height: 20px; position: absolute; margin: 70px 0 0 130px; text-align: right; font-size: 16px;}

    .header-info { width: 600px; height: 220px; position: absolute; margin: 840px 0 0 calc(50% - 300px);}
    .header-info .nadpis span { width: 200px; height: 30px; font-size: 20px; margin: 0 0 0 200px; padding: 10px 20px; font-weight: 900; font-family: 'League Spartan', sans-serif; background: #2467b2;}
    .header-info h2 { margin: 0; font-size: 28px; text-align: center; font-family: 'Sansita Swashed', cursive;}
    .header-info h2 span { color: #FFF;}

    .header-star-a { width: 60px; height: 60px; position: absolute; margin: 200px 0 0 calc(50% + 300px); background: url('../themes/star.blue.fw.png') top no-repeat; background-size: cover;}
    .header-star-b { width: 50px; height: 50px; position: absolute; margin: 220px 0 0 calc(50% - 320px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}
    .header-star-c { width: 40px; height: 40px; position: absolute; margin: 560px 0 0 calc(50% + 280px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}

    /* Spodní část webu */
    footer { width: 100%; height: auto; padding: 70px 0 40px 0;}
    .footer-content { width: 760px; height: 90px; text-align: left;}
    .footer-odkaz { width: 390px; height: 50px; position: absolute; margin: -40px 0 0 185px;}
    .footer-odkaz-logo { width: 153px; height: 50px; position: absolute; margin: 0; background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-emblem { width: 80px; height: 80px; position: absolute; margin: -15px 0 0 170px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-facebook { width: 50px; height: 50px; position: absolute; margin: 0 0 0 270px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-instagram { width: 50px; height: 50px; position: absolute; margin: 0 0 0 340px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    .copyright { width: 250px; height: 20px; position: absolute; margin: 80px 0 0 20px;}
    .copyright h2 { font-size: 20px}
    .creative { width: 250px; height: 20px; position: absolute; margin: 80px 0 0 490px;}
    .rhotechnology { width: 240px; height: 25px; position: absolute; margin: -15px 0 0 10px; transition: all 0.35s ease-in-out;}
    a.rhotechnology { background: url('../themes/creator.fw.png') left no-repeat; background-size: auto 25px;}
    a.rhotechnology:hover { background: url('../themes/creator.active.fw.png') left no-repeat; background-size: auto 25px;}
    .romandesign { width: 204px; height: 25px; position: absolute; margin: 10px 0 0 46px; transition: all 0.35s ease-in-out;}
    a.romandesign { background: url('../themes/creator.fw.png') right no-repeat; background-size: auto 25px;}
    a.romandesign:hover { background: url('../themes/creator.active.fw.png') right no-repeat; background-size: auto 25px;}

    /* Kontakt */
    #contact-face { width: 100%; height: auto; padding: 60px 0;}
    #contact { width: 100%; height: auto; display: flex; justify-content: space-evenly;}
    .contact-box { width: 250px; height: auto; margin: 0;}
    .contact-box h1 { text-align: center; font-size: 28px;}
    .contact-box h2 { text-align: center; font-size: 20px;}

    /* Maps */
    #maps-back { width: 100%; height: 450px; padding: 0; background: url('../themes/mapa.fw.png') top no-repeat; background-size: auto 470px;}
    .maps-ID { width: 200px; height: 80px; position: absolute; margin: 240px 0 0 calc(50% - 80px); padding: 0 0 0 40px; text-align: left;}
    .maps-ID-icon { width: 30px; height: 42px; position: absolute; margin: 0 0 0 -40px; background: url('../themes/mapa.icon.fw.png') top no-repeat; background-size: cover;}
    .maps-ID h1 { font-size: 30px;}
    .maps-ID h2 { font-size: 18px;}

    /* Pravidla provozu */
    #rulers-face { width: 100%; height: auto; padding: 70px 0 0 0;}
    .rulers { width: 100%; height: auto;}
    .rulers-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .rulers h1 { text-align: center;}
    .rulers h2 { width: 90%; text-align: left;}
    .rulers-data { width: 80%;}

    /* Výzva */
    #challenge-face { width: 100%; height: auto; padding: 20px 0 40px 0;}
    .challenge { width: 100%; height: auto;}
    .challenge-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .challenge h1 { text-align: center;}
    .challenge-data { width: 760px; height: 100px; margin: 0 0 0 0;}
    .challenge-data-left, .challenge-data-right { width: 378px; height: 90px; position: absolute; margin: 0; border-right: 1px dotted #36A4D9;}
    .challenge-data-right { width: 380px; margin: 0 0 0 380px; border: none;}
    .challenge-data-ID, .challenge-data-right .challenge-data-ID { width: 190px; height: 70px; position: absolute; margin: 0; padding: 10px;}
    .challenge-data-right .challenge-data-ID { margin: 0 0 0 170px;}
    .challenge-data-popis, .challenge-data-right .challenge-data-popis { text-align: left; width: 150px; height: 30px; position: absolute; margin: 0 0 0 225px; padding: 30px 0;}
    .challenge-data-right .challenge-data-popis { margin: 0 0 0 0; padding: 30px 0;}
    .challenge-data-popis span { font-weight: 600; color: #FFF;}
    .challenge-data-ID h1 { height: 66px; text-align: right; font-size: 48px; font-weight: 900; color: #2467b2; margin: 0 0 10px 0;}
    .challenge-data-right .challenge-data-ID h1 { text-align: left;}
    .challenge-data-popis h2 { font-size: 15px;}
    .challenge-data-right .challenge-data-popis h2 { text-align: right;}

    /* Otevírací doba + Ceník služeb */
    #open-face, #prize-face { width: 100%; height: auto; padding-bottom: 50px;}

    .boxing { width: 100%; display: flex; justify-content: space-evenly;}
    .boxing-content { width: 370px; height: auto; margin: 0 0 0 0;}
    .boxing-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .boxing-content h1 { text-align: center; font-size: 40px;}
    .boxing-databox, .boxing-databox-big { width: 370px; height: 50px; margin: 0 0 5px 0; border-radius: 10px;}
    .boxing-databox-big { width: 370px; height: 70px; margin: 0 0 5px 0;}
    .boxing-databox-left { width: 240px; height: 18px; position: absolute; margin: 0; padding: 16px 10px; font-size: 22px;}
    .boxing-databox-right { width: 140px; height: 20px; position: absolute; margin: 0 0 0 210px; text-align: right; padding: 15px 10px; font-size: 23px;}
    .boxing-databox-right sup { font-size: 14px;}
    .box-shadow-04 { background: rgba(255,255,255,.04);}
    .box-shadow-08 { background: rgba(255,255,255,.08);}

    /* Galerie */
    #gallery-face { width: 100%; height: 800px; padding: 0;}
    .gallery { width: 760px; height: auto; text-align: left;}
    .gallery-linear { width: 80px; height: 5px; margin: 0 0 0 480px; background: #2467b2;}
    .gallery h1 { width: calc(100% - 250px); padding: 0 0 0 250px; text-align: center;}

    .gallery-app { width: 750px; height: 833px; position: absolute; margin: -30px 0 0 5px; text-align: left; background: url('../themes/galerie.tablet.fw.png') top no-repeat; background-size: auto 833px;}
    .gallery-app-01 { width: 250px; height: 416px; position: absolute; margin: 0;}
    .gallery-app-01-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02 { width: 500px; height: 250px; position: absolute; margin: 166px 0 0 250px;}
    .gallery-app-02-content { width: 478px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-02-content img { width: 480px;}
    .gallery-app-03 { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden;}
    .gallery-app-03-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-04 { width: 250px; height: 416px; position: absolute; margin: 416px 0 0 250px;}
    .gallery-app-04-content { width: 230px; height: 396px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-01-content img, .gallery-app-03-content img, .gallery-app-04-content img { height: 400px;}
    .gallery-app-05 { width: 250px; height: 250px; position: absolute; margin: 583px 0 0 0;}
    .gallery-app-05-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-06 { width: 250px; height: 250px; position: absolute; margin: 416px 0 0 500px;}
    .gallery-app-06-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-07 { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden;}
    .gallery-app-07-content { width: 228px; height: 228px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 140px; overflow: hidden;}
    .gallery-app-05-content img, .gallery-app-06-content img, .gallery-app-07-content img { height: 230px;}
}

/* Rozhraní pro smartphone */
@media screen and (min-width: 480px) and (max-width: 767px) {
    #facebody { width: 100%; min-height: 100vh; position: relative;}

    /* Definice textu */
    .free { width:100%; height: 9px;}
    .free-big { width: 100%; height: 30px;}
    .free-mini { width: 100%; height: 7px;}
    .space { width: 100%; height: 20px;}
    .top-space { width: 100%; height: 50px;}

    h1, .nadpis { font-size: 30px; margin: 0 0 13px 0; font-weight: 300; font-family: 'Sansita Swashed', cursive;}
    h2, .classic-txt, .classic-txt-seznam, .classic-txt-special { font-size: 17px; margin: 0 0 6px 0; font-weight: 300;}
    .classic-txt-seznam { width: calc(100% - 18px); padding: 0 0 0 18px; margin: 0 0 10px 0; text-align: left; background: url('../themes/seznam.fw.png') 4px 6px no-repeat; background-size: 5px;}
    h1 span, h2 span, .classic-txt-special span, .classic-txt span, .classic-txt-seznam span, .classic-txt-special span  { font-weight: 600; color: #2467b2;}
    .nadpis span { font-weight: 900; font-size: 38px;}
    a.h1, h1 a, a.h2, h2 a, a.nadpis, a.classic-txt, .classic-txt a, .nadpis a { color: #FFF; text-decoration: none;}
    a.h1:hover, h1 a:hover, a.h2:hover, h2 a:hover, a.nadpis:hover, a.classic-txt:hover, .classic-txt a:hover, .nadpis a:hover { color: #36A4D9; text-decoration: 1px underline #FFF;}

    /* Základní nastavení */
    section { padding: 40px 0;}
    #topist { padding: 0;}

    /* Hlavička webu */
    header { width: 100%; height: 650px; text-align: left;}
    .header-radius { width: 90%; height: 650px; position: absolute; margin: 0; text-align: left; border-top-right-radius: 600px; border-top: 1px solid rgba(107,107,107,.4);}
    .header-logo { width: 200px; height: 65px; position: absolute; margin: 20px 0 0 calc(50% - 220px); background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}

    .header-topmotiv { width: 180px; height: 260px; position: absolute; margin: 100px 0 0 calc(50% - 90px);}
    .header-topmotiv-cross { width: 178px; height: 258px; position: absolute; margin: 0; border: 1px solid #6b6b6b; border-top-left-radius: 90px; border-top-right-radius: 90px; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px;}
    .header-topmotiv-pict { width: 158px; height: 238px; position: absolute; margin: 10px; overflow: hidden; border: 1px solid #FFF; border-top-left-radius: 90px; border-top-right-radius: 90px; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px; background: url('../themes/photo.fw.png') top left no-repeat; background-size: auto 240px;}
    .header-topmotiv-emblem { width: 100px; height: 100px; position: absolute; margin: 60px 0 0 150px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .header-topmotiv-back { width: 30px; height: 90px; position: absolute; margin: 250px 0 0 75px;}
    .header-topmotiv-back-point { width: 14px; height: 14px; position: absolute; margin: 2px 0 0 8px; border-radius: 14px; background: #FFF;}
    .header-topmotiv-back-point-obrys { width: 4px; height: 4px; position: absolute; margin: 20px 0 0 11px; border-radius: 14px; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-point-obrys { border: 2px solid #6b6b6b;}
    a.header-topmotiv-back:hover .header-topmotiv-back-point-obrys { border: 2px solid #36A4D9;}
    .header-topmotiv-back-arrow { width: 40px; height: 40px; position: absolute; background: url('../themes/dale.fw.png') top no-repeat; background-size: cover; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-arrow { margin: 30px 0 0 -5px;}
    a.header-topmotiv-back:hover .header-topmotiv-back-arrow { margin: 40px 0 0 -5px;}

    nav { width: 190px; height: 58px; position: absolute; text-align: left; margin: 20px 0 0 calc(50% + 30px); border: 1px solid #6b6b6b; border-radius: 30px;}
    .navi-maps { width: 50px; height: 50px; position: absolute; margin: 5px; border-radius: 100%; background: #2467b2;}
    .navi-maps-icon { width: 40px; height: 56px; position: absolute; margin: 5px; background: url('../themes/maps.fw.png') top no-repeat; background-size: cover;}
    .navi-button { width: 123px; height: 14px; position: absolute; margin: 4px 0 0 60px; font-size: 18px; font-weight: 900; text-align: center; padding: 18px 0; border-radius: 25px; background: #2467b2;}
    .navi-facebook, .navi-instagram { width: 0px; height: 0px; position: absolute; margin: 0; border-radius: 100%;}

    .header-tituls { width: 240px; height: 100px; position: absolute; margin: 160px 0 0 calc(50% - 200px); background: url('../themes/tituls.1.fw.png') left no-repeat; background-size: auto 100px;}
    .header-tituls-back { width: 121px; height: 100px; position: absolute; margin: 0; background: url('../themes/tituls.0.fw.png') left no-repeat; background-size: auto 100px;}

    .header-temp { width: 320px; height: 80px; position: absolute; margin: 560px 0 0 calc(50% - 160px);}
    .header-temp-pict { width: 70px; height: 70px; position: absolute; margin: 5px 0 0 5px; background: url('../themes/tempret.fw.png') top no-repeat; background-size: cover;}
    .header-temp-ID { width: 230px; height: 36px; position: absolute; margin: 20px 0 0 80px;}
    .header-temp-ID-min { width: 100px; height: 36px; position: absolute; margin: 0; padding: 0 0 0 0;}
    .header-temp-ID-max { width: 100px; height: 36px; position: absolute; margin: 0 0 0 130px; padding: 0 0 0 0;}
    .header-temp-ID-min h2, .header-temp-ID-max h2 { font-size: 36px; text-align: center;}
    .header-temp-ID-min h2 span, .header-temp-ID-max h2 span { color: #FFF; font-weight: 900;}
    .header-temp-ID-min h2 sup, .header-temp-ID-max h2 sup { font-size: 20px;}
    .header-temp-ID-before { width: 30px; height: 10px; position: absolute; margin: 12px 0 0 100px; background: url('../themes/before.fw.png') top no-repeat; background-size: cover;}
    .header-temp-error { width: 100%; height: 20px; text-align: center; position: absolute; margin: 10px 0 0 0; color: #36A4D9;}
    .header-temp-error h2 { font-size: 16px;}

    .header-swim { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden;}

    .header-info { width: 400px; height: 140px; position: absolute; margin: 400px 0 0 calc(50% - 200px);}
    .header-info .nadpis span { height: 30px; font-size: 16px; margin: 0; padding: 5px 10px; font-weight: 900; font-family: 'League Spartan', sans-serif; background: #2467b2;}
    .header-info h2 { margin: 0; font-size: 22px; font-family: 'Sansita Swashed', cursive;}
    .header-info h2 span { color: #FFF;}

    .header-star-a { width: 50px; height: 50px; position: absolute; margin: 100px 0 0 calc(50% + 160px); background: url('../themes/star.blue.fw.png') top no-repeat; background-size: cover;}
    .header-star-b { width: 40px; height: 40px; position: absolute; margin: 260px 0 0 calc(50% - 150px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}
    .header-star-c { width: 30px; height: 30px; position: absolute; margin: 280px 0 0 calc(50% + 140px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}

    /* Spodní část webu */
    footer { width: 100%; height: auto; padding: 70px 0 40px 0;}
    .footer-content { width: 460px; height: 120px; text-align: left;}
    .footer-odkaz { width: 390px; height: 50px; position: absolute; margin: -40px 0 0 35px;}
    .footer-odkaz-logo { width: 153px; height: 50px; position: absolute; margin: 0; background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-emblem { width: 80px; height: 80px; position: absolute; margin: -15px 0 0 170px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-facebook { width: 50px; height: 50px; position: absolute; margin: 0 0 0 270px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-instagram { width: 50px; height: 50px; position: absolute; margin: 0 0 0 340px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    .copyright { width: 250px; height: 20px; position: absolute; margin: 50px 0 0 105px;}
    .copyright h2 { font-size: 18px; text-align: center;}
    .creative { width: 250px; height: 20px; position: absolute; margin: 100px 0 0 105px;}
    .rhotechnology { width: 240px; height: 25px; position: absolute; margin: -15px 0 0 5px; transition: all 0.35s ease-in-out;}
    a.rhotechnology { background: url('../themes/creator.fw.png') left no-repeat; background-size: auto 25px;}
    a.rhotechnology:hover { background: url('../themes/creator.active.fw.png') left no-repeat; background-size: auto 25px;}
    .romandesign { width: 204px; height: 25px; position: absolute; margin: 15px 0 0 23px; transition: all 0.35s ease-in-out;}
    a.romandesign { background: url('../themes/creator.fw.png') right no-repeat; background-size: auto 25px;}
    a.romandesign:hover { background: url('../themes/creator.active.fw.png') right no-repeat; background-size: auto 25px;}

    /* Kontakt */
    #contact-face { width: 100%; height: auto; padding: 30px 0;}
    #contact { width: calc(100% - 20px); height: auto; display: flex; justify-content: space-evenly; flex-wrap: wrap;}
    .contact-box { width: 230px; height: auto; margin: 0;}
    .contact-box:nth-child(3n) { width: 230px; height: auto; margin: 0; padding-top: 20px;}
    .contact-box h1 { text-align: center; font-size: 28px;}
    .contact-box h2 { text-align: center; font-size: 18px;}

    /* Maps */
    #maps-back { width: 100%; height: 450px; padding: 0; background: url('../themes/mapa.fw.png') top no-repeat; background-size: auto 470px;}
    .maps-ID { width: 200px; height: 80px; position: absolute; margin: 240px 0 0 calc(50% - 80px); padding: 0 0 0 40px; text-align: left;}
    .maps-ID-icon { width: 30px; height: 42px; position: absolute; margin: 0 0 0 -40px; background: url('../themes/mapa.icon.fw.png') top no-repeat; background-size: cover;}
    .maps-ID h1 { font-size: 30px;}
    .maps-ID h2 { font-size: 18px;}

    /* Pravidla provozu */
    #rulers-face { width: 100%; height: auto; padding: 50px 0 0 0;}
    .rulers { width: 100%; height: auto;}
    .rulers-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .rulers h1 { text-align: center;}
    .rulers h2 { width: 90%; text-align: left;}
    .rulers-data { width: 80%;}

    /* Výzva */
    #challenge-face { width: 100%; height: auto; padding: 10px 0 20px 0;}
    .challenge { width: 100%; height: auto;}
    .challenge-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .challenge h1 { text-align: center;}
    .challenge-data { width: 380px; height: auto; margin: 0 0 0 0;}
    .challenge-data-left, .challenge-data-right { text-align: left; width: 380px; height: 88px; margin: 0; border-bottom: 1px dotted #36A4D9;}
    .challenge-data-right { height: 90px; margin: 0 0 0 0; border: none;}
    .challenge-data-popis span { font-weight: 600; color: #FFF;}
    .challenge-data-ID { width: 205px; height: 70px; position: absolute; margin: 0; padding: 10px;}
    .challenge-data-popis { width: 150px; height: 30px; position: absolute; margin: 0 0 0 225px; padding: 30px 0;}
    .challenge-data-ID h1 { height: 66px; text-align: right; font-size: 48px; font-weight: 900; color: #2467b2; margin: 0 0 10px 0;}
    .challenge-data-popis h2 { font-size: 13px;}

    /* Otevírací doba + Ceník služeb */
    #open-face, #prize-face { width: 100%; height: auto; padding-bottom: 40px;}

    .boxing { width: 100%; display: flex; justify-content: space-evenly; flex-wrap: wrap;}
    .boxing-content { width: 460px; height: auto; margin: 0 0 0 0;}
    .boxing-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .boxing-content h1 { text-align: center; font-size: 28px;}
    .boxing-databox, .boxing-databox-big { width: 420px; height: 50px; margin: 0 0 5px 0; border-radius: 10px;}
    .boxing-databox-big { width: 420px; height: 80px; margin: 0 0 5px 0;}
    .boxing-databox-left { width: 240px; height: 18px; position: absolute; margin: 0; padding: 16px 10px; font-size: 22px;}
    .boxing-databox-right { width: 140px; height: 20px; position: absolute; margin: 0 0 0 260px; text-align: right; padding: 15px 10px; font-size: 23px;}
    .boxing-databox-right sup { font-size: 12px;}
    .box-shadow-04 { background: rgba(255,255,255,.04);}
    .box-shadow-08 { background: rgba(255,255,255,.08);}

    /* Galerie */
    #gallery-face { width: 100%; height: 680px; padding: 0;}
    .gallery { width: 460px; height: auto; text-align: left;}
    .gallery-linear { width: 80px; height: 5px; margin: 0 0 0 260px; background: #2467b2;}
    .gallery h1 { width: calc(100% - 150px); padding: 0 0 0 150px; text-align: center;}

    .gallery-app { width: 450px; height: 750px; position: absolute; margin: -90px 0 0 5px; text-align: left;}
    .gallery-app-01 { width: 150px; height: 300px; position: absolute; margin: 0;}
    .gallery-app-01-content { width: 128px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-02 { width: 300px; height: 150px; position: absolute; margin: 150px 0 0 150px;}
    .gallery-app-02-content { width: 278px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-02-content img { width: 280px;}
    .gallery-app-03 { width: 150px; height: 150px; position: absolute; margin: 300px 0 0 300px;}
    .gallery-app-03-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-04 { width: 150px; height: 300px; position: absolute; margin: 300px 0 0 150px;}
    .gallery-app-04-content { width: 128px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-01-content img, .gallery-app-03-content img, .gallery-app-04-content img { height: 280px;}
    .gallery-app-05 { width: 150px; height: 150px; position: absolute; margin: 450px 0 0 0;}
    .gallery-app-05-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-06 { width: 150px; height: 150px; position: absolute; margin: 600px 0 0 150px;}
    .gallery-app-06-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-07 { width: 150px; height: 150px; position: absolute; margin: 600px 0 0 300px;}
    .gallery-app-07-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-05-content img, .gallery-app-06-content img, .gallery-app-07-content img { height: 130px;}
}

/* Rozhraní pro mobil */
@media screen and (max-width: 479px) {
    #facebody { width: 100%; min-height: 100vh; position: relative;}

    /* Definice textu */
    .free { width:100%; height: 7px;}
    .free-big { width: 100%; height: 20px;}
    .free-mini { width: 100%; height: 5px;}
    .space { width: 100%; height: 10px;}
    .top-space { width: 100%; height: 35px;}

    h1, .nadpis { font-size: 24px; margin: 0 0 10px 0; font-weight: 300; font-family: 'Sansita Swashed', cursive;}
    h2, .classic-txt, .classic-txt-seznam, .classic-txt-special { font-size: 15px; margin: 0 0 4px 0; font-weight: 300;}
    .classic-txt-seznam { width: calc(100% - 18px); padding: 0 0 0 18px; margin: 0 0 10px 0; text-align: left; background: url('../themes/seznam.fw.png') 4px 5px no-repeat; background-size: 5px;}
    h1 span, h2 span, .classic-txt-special span, .classic-txt span, .classic-txt-seznam span, .classic-txt-special span  { font-weight: 600; color: #2467b2;}
    .nadpis span { font-weight: 900; font-size: 28px;}
    a.h1, h1 a, a.h2, h2 a, a.nadpis, a.classic-txt, .classic-txt a, .nadpis a { color: #FFF; text-decoration: none;}
    a.h1:hover, h1 a:hover, a.h2:hover, h2 a:hover, a.nadpis:hover, a.classic-txt:hover, .classic-txt a:hover, .nadpis a:hover { color: #36A4D9; text-decoration: 1px underline #FFF;}

    /* Hlavička webu */
    header { width: 100%; height: 820px; text-align: left;}
    .header-radius { width: 90%; height: 820px; position: absolute; margin: 0; text-align: left; border-top-right-radius: 600px; border-top: 1px solid rgba(107,107,107,.4);}
    .header-logo { width: 200px; height: 65px; position: absolute; margin: 20px 0 0 calc(50% - 100px); background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}

    .header-topmotiv { width: 150px; height: 220px; position: absolute; margin: 160px 0 0 calc(50% - 75px);}
    .header-topmotiv-cross { width: 148px; height: 218px; position: absolute; margin: 0; border: 1px solid #6b6b6b; border-top-left-radius: 90px; border-top-right-radius: 90px; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px;}
    .header-topmotiv-pict { width: 128px; height: 198px; position: absolute; margin: 10px; overflow: hidden; border: 1px solid #FFF; border-top-left-radius: 90px; border-top-right-radius: 90px; border-bottom-left-radius: 90px; border-bottom-right-radius: 90px; background: url('../themes/photo.fw.png') top left no-repeat; background-size: auto 200px;}
    .header-topmotiv-emblem { width: 80px; height: 80px; position: absolute; margin: 30px 0 0 120px; background: url('../themes/erb.fw.png') top no-repeat; background-size: cover;}
    .header-topmotiv-back { width: 30px; height: 90px; position: absolute; margin: 210px 0 0 60px;}
    .header-topmotiv-back-point { width: 14px; height: 14px; position: absolute; margin: 2px 0 0 8px; border-radius: 14px; background: #FFF;}
    .header-topmotiv-back-point-obrys { width: 4px; height: 4px; position: absolute; margin: 20px 0 0 11px; border-radius: 14px; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-point-obrys { border: 2px solid #6b6b6b;}
    a.header-topmotiv-back:hover .header-topmotiv-back-point-obrys { border: 2px solid #36A4D9;}
    .header-topmotiv-back-arrow { width: 40px; height: 40px; position: absolute; background: url('../themes/dale.fw.png') top no-repeat; background-size: cover; transition: all 0.35s ease-in-out;}
    a.header-topmotiv-back .header-topmotiv-back-arrow { margin: 30px 0 0 -5px;}
    a.header-topmotiv-back:hover .header-topmotiv-back-arrow { margin: 40px 0 0 -5px;}

    nav { width: 190px; height: 58px; position: absolute; text-align: left; margin: 95px 0 0 calc(50% - 95px); border: 1px solid #6b6b6b; border-radius: 30px;}
    .navi-maps { width: 50px; height: 50px; position: absolute; margin: 5px; border-radius: 100%; background: #2467b2;}
    .navi-maps-icon { width: 40px; height: 56px; position: absolute; margin: 5px; background: url('../themes/maps.fw.png') top no-repeat; background-size: cover;}
    .navi-button { width: 123px; height: 14px; position: absolute; margin: 4px 0 0 60px; font-size: 18px; font-weight: 900; text-align: center; padding: 18px 0; border-radius: 25px; background: #2467b2;}
    .navi-facebook, .navi-instagram { width: 0px; height: 0px; position: absolute; margin: 0; border-radius: 100%;}

    .header-tituls { width: 200px; height: 80px; position: absolute; margin: 240px 0 0 calc(50% - 140px); background: url('../themes/tituls.1.fw.png') left no-repeat; background-size: auto 80px;}
    .header-tituls-back { width: 76px; height: 80px; position: absolute; margin: 0; background: url('../themes/tituls.0.fw.png') left no-repeat; background-size: auto 80px;}

    .header-temp { width: 300px; height: 70px; position: absolute; margin: 620px 0 0 calc(50% - 150px);}
    .header-temp-pict { width: 70px; height: 70px; position: absolute; margin: 0; background: url('../themes/tempret.fw.png') top no-repeat; background-size: cover;}
    .header-temp-ID { width: 210px; height: 36px; position: absolute; margin: 25px 0 0 80px;}
    .header-temp-ID-min { width: 90px; height: 36px; position: absolute; margin: 0; padding: 0 0 0 0;}
    .header-temp-ID-max { width: 90px; height: 36px; position: absolute; margin: 0 0 0 120px; padding: 0 0 0 0;}
    .header-temp-ID-min h2, .header-temp-ID-max h2 { font-size: 30px; text-align: center;}
    .header-temp-ID-min h2 span, .header-temp-ID-max h2 span { color: #FFF; font-weight: 900;}
    .header-temp-ID-min h2 sup, .header-temp-ID-max h2 sup { font-size: 16px;}
    .header-temp-ID-before { width: 26px; height: 8px; position: absolute; margin: 12px 0 0 93px; background: url('../themes/before.fw.png') top no-repeat; background-size: cover;}
    .header-temp-error { width: 100%; height: 20px; text-align: center; position: absolute; margin: 0 0 0 0; color: #36A4D9;}
    .header-temp-error h2 { font-size: 16px;}

    .header-swim { width: 300px; height: 70px; position: absolute; margin: 720px 0 0 calc(50% - 150px);}
    .header-swim-pict { width: 70px; height: 70px; position: absolute; margin: 0; background: url('../themes/swimmer.png') top no-repeat; background-size: cover;}
    .header-swim-ID { width: 210px; height: 36px; position: absolute; margin: 25px 0 0 80px;}
    .header-swim-ID-info { width: 100px; height: 55px; position: absolute; margin: -10px 0 0 0; padding: 0 0 0 0;}
    .header-swim-ID-info h2 { font-size: 15px; text-align: left; color: #FFF;}
    .header-swim-ID-info h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-info h2 sup { font-size: 12px; font-weight: 900;}
    .header-swim-ID-num { width: 90px; height: 30px; position: absolute; margin: 0 0 0 120px; padding: 0;}
    .header-swim-ID-num h2 { font-size: 30px; text-align: right;}
    .header-swim-ID-num h2 span { color: #FFF; font-weight: 900;}
    .header-swim-ID-popis { width: 0px; height: 0px; position: absolute; margin: 0; text-align: right; font-size: 0px; overflow: hidden; visibility: hidden;}

    .header-info { width: 300px; height: 140px; position: absolute; margin: 470px 0 0 calc(50% - 150px);}
    .header-info .nadpis span { height: 20px; font-size: 14px; margin: 0; padding: 5px 10px; font-weight: 900; font-family: 'League Spartan', sans-serif; background: #2467b2;}
    .header-info h2 { margin: 0; font-size: 18px; font-family: 'Sansita Swashed', cursive;}
    .header-info h2 span { color: #FFF;}

    .header-star-a { width: 40px; height: 40px; position: absolute; margin: 80px 0 0 calc(50% + 100px); background: url('../themes/star.blue.fw.png') top no-repeat; background-size: cover;}
    .header-star-b { width: 30px; height: 30px; position: absolute; margin: 120px 0 0 calc(50% - 150px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}
    .header-star-c { width: 20px; height: 20px; position: absolute; margin: 320px 0 0 calc(50% + 90px); background: url('../themes/star.shadow.fw.png') top no-repeat; background-size: cover;}

    /* Spodní část webu */
    footer { width: 100%; height: auto; padding: 70px 0 40px 0;}
    .footer-content { width: 300px; height: 120px; text-align: left;}
    .footer-odkaz { width: 280px; height: 50px; position: absolute; margin: -35px 0 0 10px;}
    .footer-odkaz-logo { width: 153px; height: 50px; position: absolute; margin: 0; background: url('../themes/logo.fw.white.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-emblem { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden;}
    .footer-odkaz-facebook { width: 50px; height: 50px; position: absolute; margin: 0 0 0 170px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-facebook { background: #2467b2 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-facebook:hover { background: #36A4D9 url('../themes/facebook.fw.png') top no-repeat; background-size: cover;}
    .footer-odkaz-instagram { width: 50px; height: 50px; position: absolute; margin: 0 0 0 230px; border-radius: 100%; transition: all 0.35s ease-in-out;}
    a.footer-odkaz-instagram { background: #2467b2 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    a.footer-odkaz-instagram:hover { background: #36A4D9 url('../themes/instagram.fw.png') top no-repeat; background-size: cover;}
    .copyright { width: 250px; height: 20px; position: absolute; margin: 50px 0 0 25px;}
    .copyright h2 { font-size: 18px; text-align: center;}
    .creative { width: 250px; height: 20px; position: absolute; margin: 100px 0 0 25px;}
    .rhotechnology { width: 240px; height: 25px; position: absolute; margin: -15px 0 0 5px; transition: all 0.35s ease-in-out;}
    a.rhotechnology { background: url('../themes/creator.fw.png') left no-repeat; background-size: auto 25px;}
    a.rhotechnology:hover { background: url('../themes/creator.active.fw.png') left no-repeat; background-size: auto 25px;}
    .romandesign { width: 204px; height: 25px; position: absolute; margin: 15px 0 0 23px; transition: all 0.35s ease-in-out;}
    a.romandesign { background: url('../themes/creator.fw.png') right no-repeat; background-size: auto 25px;}
    a.romandesign:hover { background: url('../themes/creator.active.fw.png') right no-repeat; background-size: auto 25px;}

    /* Kontakt */
    #contact-face { width: 100%; height: auto; padding: 20px 0;}
    #contact { width: calc(100% - 20px); height: auto; display: flex; justify-content: space-evenly; flex-wrap: wrap;}
    .contact-box { width: 280px; height: auto; margin: 0; padding-top: 30px;}
    .contact-box h1 { text-align: center; font-size: 24px;}
    .contact-box h2 { text-align: center; font-size: 18px;}

    /* Maps */
    #maps-back { width: 100%; height: 400px; padding: 0; background: url('../themes/mapa.fw.png') top no-repeat; background-size: auto 420px;}
    .maps-ID { width: 180px; height: 80px; position: absolute; margin: 210px 0 0 calc(50% - 75px); padding: 0 0 0 40px; text-align: left;}
    .maps-ID-icon { width: 30px; height: 42px; position: absolute; margin: 0 0 0 -40px; background: url('../themes/mapa.icon.fw.png') top no-repeat; background-size: cover;}
    .maps-ID h1 { font-size: 22px;}
    .maps-ID h2 { font-size: 15px;}

    /* Pravidla provozu */
    #rulers-face { width: 100%; height: auto; padding: 30px 0 0 0;}
    .rulers { width: 100%; height: auto;}
    .rulers-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .rulers h1 { text-align: center;}
    .rulers h2 { width: 96%; text-align: left;}
    .rulers-data { width: 90%;}

    /* Výzva */
    #challenge-face { width: 100%; height: auto; padding: 10px 0 20px 0;}
    .challenge { width: 100%; height: auto;}
    .challenge-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .challenge h1 { text-align: center;}
    .challenge-data { width: 300px; height: auto; margin: 0 0 0 0;}
    .challenge-data-left, .challenge-data-right { text-align: left; width: 300px; height: 68px; margin: 0; border-bottom: 1px dotted #36A4D9;}
    .challenge-data-right { margin: 0 0 0 0; border: none;}
    .challenge-data-popis span { font-weight: 600; color: #FFF;}
    .challenge-data-ID { width: 190px; height: 60px; position: absolute; margin: 0; padding: 10px;}
    .challenge-data-popis { width: 80px; height: 30px; position: absolute; margin: 0 0 0 215px; padding: 30px 0;}
    .challenge-data-ID h1 { height: 66px; text-align: right; font-size: 40px; font-weight: 900; color: #2467b2; margin: 0 0 10px 0;}
    .challenge-data-popis h2 { font-size: 10px;}

    /* Otevírací doba + Ceník služeb */
    #open-face, #prize-face { width: 100%; height: auto; padding-bottom: 20px;}

    .boxing { width: 100%; display: flex; justify-content: space-evenly; flex-wrap: wrap;}
    .boxing-content { width: 300px; height: auto; margin: 0 0 0 0; padding: 20px 0 0 0;}
    .boxing-lineas { width: 80px; height: 5px; margin: 0 0 0 0; background: #2467b2;}
    .boxing-content h1 { text-align: center; font-size: 24px;}
    .boxing-databox, .boxing-databox-big { width: 300px; height: 40px; margin: 0 0 5px 0; border-radius: 6px;}
    .boxing-databox-big { width: 300px; height: 54px; margin: 0 0 5px 0;}
    .boxing-databox-left { width: 230px; height: 16px; position: absolute; margin: 0; padding: 12px 10px; font-size: 16px;}
    .boxing-databox-right { width: 80px; height: 16px; position: absolute; margin: 0 0 0 205px; text-align: right; padding: 12px 5px; font-size: 16px;}
    .boxing-databox-right sup { font-size: 9px;}
    .box-shadow-04 { background: rgba(255,255,255,.04);}
    .box-shadow-08 { background: rgba(255,255,255,.08);}

    /* Galerie */
    #gallery-face { width: 100%; height: 680px; padding: 0;}
    .gallery { width: 300px; height: auto; text-align: left;}
    .gallery-linear { width: 80px; height: 5px; margin: 0 0 0 185px; background: #2467b2;}
    .gallery h1 { width: calc(100% - 150px); padding: 0 0 0 150px; text-align: center;}

    .gallery-app { width: 300px; height: 750px; position: absolute; margin: -70px 0 0 0; text-align: left;}
    .gallery-app-01 { width: 150px; height: 300px; position: absolute; margin: 0;}
    .gallery-app-01-content { width: 128px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-02 { width: 150px; height: 150px; position: absolute; margin: 150px 0 0 150px;}
    .gallery-app-02-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-02-content img { width: 280px;}
    .gallery-app-03 { width: 150px; height: 150px; position: absolute; margin: 300px 0 0 0;}
    .gallery-app-03-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-04 { width: 150px; height: 300px; position: absolute; margin: 300px 0 0 150px;}
    .gallery-app-04-content { width: 128px; height: 278px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-01-content img, .gallery-app-03-content img, .gallery-app-04-content img { height: 280px;}
    .gallery-app-05 { width: 150px; height: 150px; position: absolute; margin: 450px 0 0 0;}
    .gallery-app-05-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-06 { width: 150px; height: 150px; position: absolute; margin: 600px 0 0 0;}
    .gallery-app-06-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-07 { width: 150px; height: 150px; position: absolute; margin: 600px 0 0 150px;}
    .gallery-app-07-content { width: 128px; height: 128px; position: absolute; margin: 10px; border: 1px solid #FFF; border-radius: 75px; overflow: hidden;}
    .gallery-app-05-content img, .gallery-app-06-content img, .gallery-app-07-content img { height: 130px;}
}

.header-info h2 .info-highlight { font-weight: 900; }
