/* Vložená data */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

/* Nastavení posuvníku */
/* width */
::-webkit-scrollbar { width: 8px;}
/* Track */
::-webkit-scrollbar-track { background: #f8f8f8;}
/* Handle */
::-webkit-scrollbar-thumb { background: #f7f5f8;}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover { background: #444;}

body { width: 100%; font-family: "Roboto Condensed", sans-serif; display: flex; flex-flow: column; align-items: flex-start; justify-content: center; margin: 0 0 0 0; font-weight: 300; color: #1D1A38; background: #f8f8f8;}
    
span { font-weight: 900; color: #1D1A38;}
a { color: #1D1A38; text-underline-offset: 4px; text-decoration-color: #1D1A38; text-decoration-thickness: 2px; text-decoration-line: 2px; text-decoration-style: dotted; transition: ease-in-out color .35s;}
a:hover { color: #1D1A38; text-decoration-color: #104D90;}
a span { color: #1D1A38; transition: ease-in-out color .35s;}
a:hover span { color: #104D90;}

/* Velké obrazovky a stolní monitory */
@media (min-width: 1281px) {
    #facebody, #facebody-page { width: 100%; height: auto; position: relative; display: flex; flex-flow: column; align-items: flex-start; justify-content: center;}

    /* 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 { width: 100%; font-size: 2.6em; margin: 0 0 20px 0;}
    h2 { width: 100%; font-size: 1.6em;}
    p { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; font-weight: 300;}
    li { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; list-style: none;}
    li::before { content: "➜ "; color: #104D90;}

    /* Hlavička webu */
    header { width: 100%; height: 170px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1D1A38; background: #FFF url('../themes/nadpis.png') calc(50%) 100px no-repeat; background-size: 900px auto;}
    .header-menu { width: 1260px; height: 100px; z-index: 10; display: flex; align-items: start; justify-content: space-between;}
    .logo { width: 200px; height: 100px; display: flex; align-items: top; justify-content: center;}
    .logo img { width: 200px; margin-top: -20px;}

    .navigace { width: 1000px; height: 100px; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
    .navi-socbox { width: 1000px; height: 40px; display: flex; align-items: center; justify-content: flex-end;}
    .socbox { width: auto; height: 40px; padding: 0 10px; display: flex; align-items: center; justify-content: center;}
    .socbox img { width: 40px;}

    nav { width: 1000px; height: 46px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;}
    .navibox, .navibox-super { width: auto; height: 40px; padding: 0 20px; display: flex; align-items: center; justify-content: center; transition: all .35s ease-in-out;}
    a.navibox { text-decoration: none; color: #1D1A38;}
    a.navibox:hover { color: #104D90;}
    .navibox-super { background: rgba(0,0,0,.25);}
    a.navibox-super { border: 3px solid #F2BC1B; text-decoration: none; color: #1D1A38; background: #F2BC1B;}
    a.navibox-super:hover { border: 3px solid #104D90; color: #F2BC1B; background: #104D90;}
    .navibox p, .navibox-super p { margin: 0; font-weight: 500;}

    /* Obsahová část */
    section { width: 100%; height: auto; padding: 80px 0; display: flex; flex-flow: column; align-items: center; justify-content: center;}
    main { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; border-top: 1px solid #d0d0d0; background: #FFF url('../themes/future.jpg') bottom center no-repeat; background-size: 1200px auto;;}
    .town { background: #FFF url('../themes/town.png') top center no-repeat; background-size: 1200px auto;}
    main p { text-align: center;}

    /* Obsahová část */
    .content { width: 1200px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .content h1 { width: 100%; text-align: center; font-weight: 300;}
    .content h1 span { color: #FFF; background: #1D1A38; font-size: 1.2em; padding: 10px 20px; font-weight: 500;}
    .content h2 { width: 100%; text-align: center; color: #F2BC1B;}

    .erbus { width: 1200px; height: auto; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .erb { width: 210px; height: auto; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .erb img { width: 200px; margin-left: 5px;}
    .erb img.shadow { filter: grayscale(1); width: 200px; margin-left: 5px;}
    .erb h3 { margin: 0; text-align: center; font-weight: 500;}

    .article-content { width: 1200px; height: auto; padding: 0 10px; gap: 20px; display: flex; flex-wrap: wrap; align-content: center; justify-content: start;}
    
    .articlebox { width: 280px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    a.articlebox { text-decoration: none;}
    .articlebox h2 { font-size: 1.8em; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    a.articlebox h2 { color: #1D1A38; text-decoration: none;}
    a.articlebox:hover h2 { color: #104D90; text-decoration: none;}
    .articlebox p { margin: 0;}
    .articlebox-image { width: 278px; height: 188px; border: 1px solid #1D1A38; overflow: hidden; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .articlebox-image img { object-fit: cover; display: block; transition: all .35s ease-in-out;}
    a.articlebox .articlebox-image img { height: 100%; filter: grayscale(1);}
    a.articlebox:hover .articlebox-image img { height: 105%; filter: grayscale(0);}

    /* Vlastní článek */
    #facebody-page h1 { width: 100%; font-size: 2em; margin: 10px 0 0 0; text-align: center; font-weight: 300;}
    article { width: 1200px; height: auto; display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-around;}
    .left-container { width: 840px; padding: 0 20px; height: auto; display: flex; flex-wrap: wrap; align-content: start; align-items: left; justify-content: start;}
    .right-container { width: 300px; height: auto; display: flex; gap: 20px; flex-wrap: wrap; align-items: start; align-content: start; justify-content: space-between;}
    
    .right-container .articlebox { width: 300px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    .right-container .articlebox h2 { font-size: 1.6em; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    .right-container .articlebox p { margin: 0; font-size: 1em;}
    .right-container .articlebox-image { width: 298px; height: 198px;}
    .right-container h1 { width: 100%; text-align: left;}
    .right-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; font-weight: 500; color: #1D1A38; background: #F2BC1B;}

    /* Kontaktní informace */
    .contact-content { width: 1200px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: center; padding: 80px 0;}

    .contact-content h1 { width: 100%; text-align: center; color: #F2BC1B;}
    .contact-content h1 span { color: #1D1A38; background: #F2BC1B; padding: 10px 20px; font-weight: 500;}
    .contact-content h2 { width: 100%; text-align: center; color: #1D1A38;}
    .contact-content h2 span { color: #F2BC1B; font-style: italic; background: #104D90; padding: 10px 20px; border-radius: 10px; border: 1px solid #F2BC1B; font-weight: 300;}
    .contact-content .erb { width: 150px;}
    .contact-content .erb img { width: 140px;}
    .contact-content .erb img.shadow { width: 140px;}

    /* Spodní část */
    footer { width: 100%; height: auto; padding: 80px 0 40px 0; display: flex; flex-wrap: wrap; align-items: end; justify-content: center; border-top: 1px solid #1D1A38; background: #FFF url('../themes/footer.white.png') calc(50% + 200px) 40px no-repeat; background-size: 900px auto;}
    footer .content { width: 1360px; height: auto; padding: 0 0 40px 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: start; justify-content: center;}
    footer .socbox { width: auto; height: 30px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center;}
    footer .socbox img { width: 30px;}
    footer .socbox p { width: auto; margin: 0 0 0 0; padding: 0 20px 0 10px; font-size: 1.2em; font-weight: 500;}

    footer .content-bottom { width: 1360px; height: auto; z-index: 10; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    footer .content-bottom p { margin: 0 0 4px 0; font-size: .9em; text-align: center;}

    /* Obsahová část webu */
    .content-page-image-position { width: 700px; height: 340px; margin: 0 0 0 70px;}
    .content-page-image { width: 698px; height: 398px; margin: -20px 0 0 0; border: 1px solid #1D1A38; overflow: hidden; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .content-page-image img { width: 100%; object-fit: cover; display: block;}

    .left-container h1 { width: 100%; text-align: left;}
    .left-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; color: #f8f8f8; background: #104D90;}
    .left-container h2 { width: 100%; text-align: left;}
    .left-container h2 { width: auto; padding: 10px 20px; margin: 0; font-weight: 600; position: relative; color: #104D90;}
    .left-container p { font-size: 1.4em; text-align: justify;}
    .left-container p span { font-weight: 600; color: #1D1A38;}

    .content-link { width: calc(100% - 22px); height: 30px; padding: 10px 10px; margin: 0 0 5px 0; cursor: pointer; font-weight: 400; transition: all .35s ease-in-out; position: relative; display: flex; flex-wrap: wrap; justify-content: left; align-items: center;}
    a.content-link { text-decoration: none; border-bottom: 1px solid rgba(27,26,32,.15);}
    a.content-link:hover { border-bottom: 1px solid #F2BC1B;}
    .content-link p { font-size: 1.2em; width: 760px; color: #444; margin: 0; font-weight: 300; transition: all .35s ease-in-out; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
    .content-link p span { transition: all .35s ease-in-out;}
    a.content-link:hover p, a.content-link:hover p span { color: #104D90;}
    .content-link-icon { width: 50px; height: 30px;}
    .content-link-icon-data { width: 50px; height: 50px; position: absolute; margin: -10px;}
    .content-link-icon-data img { width: 40px; margin: 5px; transition: all .35s ease-in-out;}
    a.content-link .content-link-icon-data img { filter: grayscale(1);}
    a.content-link:hover .content-link-icon-data img { filter: grayscale(0);}

    .gallery-face, .video-face { width: 840px; height: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .gallery-box { width: 264px; height: 159px; margin-bottom: 10px; border: 1px solid #1D1A38; overflow: hidden; cursor: pointer; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; transition: all .35s ease-in-out;}
    .gallery-box:hover { border: 1px solid #F2BC1B;}
    .gallery-box img { width: 100%; object-fit: cover; display: block;}
    .video-face { width: 760px; padding: 40px;}
    .youtubevimeo { width: 760px; height: 420px; border: 1px solid #104D90;}
    
    .content-page-tiraz { width: 810px; padding: 15px; border-top: 1px solid #c5c5c5;}
    .content-page-tiraz-box { width: 810px; margin: 0 0 10px 0; font-size: 15px; color: #444; display: flex; flex-wrap: wrap;}
    .content-page-tiraz-box:nth-child(2) { margin: 0;}
    .content-page-tiraz-box-a { width: 210px; font-weight: 600;}
    .content-page-tiraz-box-b { width: 600px; font-weight: 600;}
    .content-page-tiraz-box-b span { font-weight: 300;}

    /* Navigační ikona */
    .mobilnavigace { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden; border: none;}
}

/* Menší laptopy a stolní počítače */
@media (min-width: 1100px) and (max-width: 1280px) {
    #facebody, #facebody-page { width: 100%; height: auto; position: relative; display: flex; flex-flow: column; align-items: flex-start; justify-content: center;}

    /* 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 { width: 100%; font-size: 2.6em; margin: 0 0 20px 0;}
    h2 { width: 100%; font-size: 1.6em;}
    p { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; font-weight: 300;}
    li { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; list-style: none;}
    li::before { content: "➜ "; color: #104D90;}

    /* Hlavička webu */
    header { width: 100%; height: 170px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1D1A38; background: #FFF url('../themes/nadpis.png') calc(50%) 100px no-repeat; background-size: 900px auto;}
    .header-menu { width: 1100px; height: 100px; z-index: 10; display: flex; align-items: start; justify-content: space-between;}
    .logo { width: 200px; height: 100px; display: flex; align-items: top; justify-content: center;}
    .logo img { width: 200px; margin-top: -20px;}

    .navigace { width: 900px; height: 100px; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
    .navi-socbox { width: 900px; height: 40px; display: flex; align-items: center; justify-content: flex-end;}
    .socbox { width: auto; height: 40px; padding: 0 10px; display: flex; align-items: center; justify-content: center;}
    .socbox img { width: 40px;}

    nav { width: 900px; height: 46px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;}
    .navibox, .navibox-super { width: auto; height: 40px; padding: 0 20px; display: flex; align-items: center; justify-content: center; transition: all .35s ease-in-out;}
    a.navibox { text-decoration: none; color: #1D1A38;}
    a.navibox:hover { color: #104D90;}
    .navibox-super { background: rgba(0,0,0,.25);}
    a.navibox-super { border: 3px solid #F2BC1B; text-decoration: none; color: #1D1A38; background: #F2BC1B;}
    a.navibox-super:hover { border: 3px solid #104D90; color: #F2BC1B; background: #104D90;}
    .navibox p, .navibox-super p { margin: 0; font-weight: 500;}

    /* Obsahová část */
    section { width: 100%; height: auto; padding: 60px 0; display: flex; flex-flow: column; align-items: center; justify-content: center;}
    main { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; border-top: 1px solid #d0d0d0; background: #FFF url('../themes/future.jpg') bottom center no-repeat; background-size: 1200px auto;;}
    .town { background: #FFF url('../themes/town.png') top center no-repeat; background-size: 1200px auto;}
    main p { text-align: center;}

    /* Obsahová část */
    .content { width: 1100px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .content h1 { width: 100%; text-align: center; font-weight: 300;}
    .content h1 span { color: #FFF; background: #1D1A38; font-size: 1.2em; padding: 10px 20px; font-weight: 500;}
    .content h2 { width: 100%; text-align: center; color: #F2BC1B;}

    .erbus { width: 1100px; height: auto; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .erb { width: 310px; height: auto; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .erb img { width: 300px; margin-left: 5px;}
    .erb img.shadow { filter: grayscale(1); width: 200px; margin-left: 5px;}
    .erb h3 { margin: 0; font-size: 1.4em; text-align: center; font-weight: 500;}

    .article-content { width: 1100px; height: auto; padding: 0 10px; gap: 20px; display: flex; flex-wrap: wrap; align-content: center; justify-content: start;}
    
    .articlebox { width: 255px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    a.articlebox { text-decoration: none;}
    .articlebox h2 { font-size: 1.5em; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    a.articlebox h2 { color: #1D1A38; text-decoration: none;}
    a.articlebox:hover h2 { color: #104D90; text-decoration: none;}
    .articlebox p { margin: 0; font-size: 1em;}
    .articlebox-image { width: 253px; height: 168px; border: 1px solid #1D1A38; overflow: hidden; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .articlebox-image img { object-fit: cover; display: block; transition: all .35s ease-in-out;}
    a.articlebox .articlebox-image img { height: 100%; filter: grayscale(1);}
    a.articlebox:hover .articlebox-image img { height: 105%; filter: grayscale(0);}

    /* Vlastní článek */
    #facebody-page h1 { width: 100%; font-size: 2em; margin: 10px 0 0 0; text-align: center; font-weight: 300;}
    article { width: 1100px; height: auto; display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-around;}
    .left-container { width: 740px; padding: 0 20px; height: auto; display: flex; flex-wrap: wrap; align-content: start; align-items: left; justify-content: start;}
    .right-container { width: 300px; height: auto; display: flex; flex-wrap: wrap; gap: 15px; align-items: start; align-content: start; justify-content: space-between;}
    
    .right-container .articlebox { width: 300px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    .right-container .articlebox h2 { font-size: 1.6em; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    .right-container .articlebox p { margin: 0; font-size: 1em;}
    .right-container .articlebox-image { width: 298px; height: 198px;}
    .right-container h1 { width: 100%; text-align: left;}
    .right-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; font-weight: 500; color: #1D1A38; background: #F2BC1B;}

    /* Kontaktní informace */
    .contact-content { width: 1100px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-evenly; padding: 80px 0;}

    .contact-content h1 { width: 100%; text-align: center; color: #F2BC1B;}
    .contact-content h1 span { color: #1D1A38; background: #F2BC1B; padding: 10px 20px; font-weight: 500;}
    .contact-content h2 { width: 100%; font-size: 1.8em; text-align: center; color: #1D1A38;}
    .contact-content h2 span { color: #F2BC1B; font-style: italic; background: #104D90; padding: 10px 20px; border-radius: 10px; border: 1px solid #F2BC1B; font-weight: 300;}
    .contact-content .erb { width: 130px;}
    .contact-content .erb img { width: 120px;}
    .contact-content .erb img.shadow { width: 120px;}

    /* Spodní část */
    footer { width: 100%; height: auto; padding: 60px 0 40px 0; display: flex; flex-wrap: wrap; align-items: end; justify-content: center; border-top: 1px solid #1D1A38; background: #FFF url('../themes/footer.white.png') calc(50% + 200px) 40px no-repeat; background-size: 900px auto;}
    footer .content { width: 1100px; height: auto; padding: 0 0 40px 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: start; justify-content: center;}
    footer .socbox { width: auto; height: 30px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center;}
    footer .socbox img { width: 30px;}
    footer .socbox p { width: auto; margin: 0 0 0 0; padding: 0 20px 0 10px; font-size: 1.2em; font-weight: 500;}

    footer .content-bottom { width: 1100px; height: auto; z-index: 10; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    footer .content-bottom p { margin: 0 0 4px 0; font-size: .9em; text-align: center;}

    /* Obsahová část webu */
    .content-page-image-position { width: 700px; height: 330px; margin: 0 0 0 20px;}
    .content-page-image { width: 698px; height: 398px; margin: -20px 0 0 0; border: 1px solid #1D1A38; overflow: hidden; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .content-page-image img { width: 100%; object-fit: cover; display: block;}

    .left-container h1 { width: 100%; text-align: left;}
    .left-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; color: #f8f8f8; background: #104D90;}
    .left-container h2 { width: 100%; text-align: left;}
    .left-container h2 { width: auto; padding: 10px 20px; margin: 0; font-weight: 600; position: relative; color: #104D90;}
    .left-container p { font-size: 1.3em; text-align: justify;}
    .left-container p span { font-weight: 600; color: #1D1A38;}

    .content-link { width: calc(100% - 22px); height: 30px; padding: 10px 10px; margin: 0 0 5px 0; cursor: pointer; font-weight: 400; transition: all .35s ease-in-out; position: relative; display: flex; flex-wrap: wrap; justify-content: left; align-items: center;}
    a.content-link { text-decoration: none; border-bottom: 1px solid rgba(27,26,32,.15);}
    a.content-link:hover { border-bottom: 1px solid #F2BC1B;}
    .content-link p { font-size: 1.2em; width: 660px; color: #444; margin: 0; font-weight: 300; transition: all .35s ease-in-out; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
    .content-link p span { transition: all .35s ease-in-out;}
    a.content-link:hover p, a.content-link:hover p span { color: #104D90;}
    .content-link-icon { width: 50px; height: 30px;}
    .content-link-icon-data { width: 50px; height: 50px; position: absolute; margin: -10px;}
    .content-link-icon-data img { width: 40px; margin: 5px; transition: all .35s ease-in-out;}
    a.content-link .content-link-icon-data img { filter: grayscale(1);}
    a.content-link:hover .content-link-icon-data img { filter: grayscale(0);}

    .gallery-face, .video-face { width: 750px; height: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .gallery-box { width: 238px; height: 143px; margin-bottom: 10px; border: 1px solid #1D1A38; overflow: hidden; cursor: pointer; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; transition: all .35s ease-in-out;}
    .gallery-box:hover { border: 1px solid #F2BC1B;}
    .gallery-box img { width: 100%; object-fit: cover; display: block;}
    .video-face { width: 670px; padding: 35px;}
    .youtubevimeo { width: 670px; height: 380px; border: 1px solid #104D90;}
    
    .content-page-tiraz { width: 710px; padding: 15px; border-top: 1px solid #c5c5c5;}
    .content-page-tiraz-box { width: 710px; margin: 0 0 10px 0; font-size: 15px; color: #444; display: flex; flex-wrap: wrap;}
    .content-page-tiraz-box:nth-child(2) { margin: 0;}
    .content-page-tiraz-box-a { width: 110px; font-weight: 600;}
    .content-page-tiraz-box-b { width: 600px; font-weight: 600;}
    .content-page-tiraz-box-b span { font-weight: 300;}

    /* Navigační ikona */
    .mobilnavigace { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden; border: none;}
}

/* Tablety na šířku */
@media screen and (min-width: 768px) and (max-width: 1099px) {
    #facebody, #facebody-page { width: 100%; height: auto; position: relative; display: flex; flex-flow: column; align-items: flex-start; justify-content: center;}

    /* Definice textu */
    .free { width:100%; height: 18px;}
    .free-big { width: 100%; height: 30px;}
    .free-mini { width: 100%; height: 9px;}
    .space { width: 100%; height: 30px;}
    .top-space { width: 100%; height: 60px;}

    h1 { width: 100%; font-size: 2.6em; margin: 0 0 20px 0;}
    h2 { width: 100%; font-size: 1.6em;}
    p { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; font-weight: 300;}
    li { width: 100%; font-size: 1.3em; margin: 0 0 10px 0; list-style: none;}
    li::before { content: "➜ "; color: #104D90;}

    /* Hlavička webu */
    header { width: 100%; height: 200px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1D1A38; background: #FFF url('../themes/nadpis.png') calc(50%) 100px no-repeat; background-size: 700px auto;}
    .header-menu { width: 760px; height: 100px; z-index: 10; display: flex; align-items: start; justify-content: space-between;}
    .logo { width: 220px; height: 100px; display: flex; align-items: top; justify-content: center;}
    .logo img { width: 220px; margin-top: -40px;}

    .navigace { width: 540px; height: 100px; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
    .navi-socbox { width: 540px; height: 40px; display: flex; align-items: center; justify-content: flex-end;}
    .socbox { width: auto; height: 40px; padding: 0 10px; display: flex; align-items: center; justify-content: center;}
    .socbox img { width: 40px;}

    nav { width: 760px; height: 46px; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;}
    .navibox, .navibox-super { width: auto; height: 40px; padding: 0 20px; display: flex; align-items: center; justify-content: center; transition: all .35s ease-in-out;}
    a.navibox { text-decoration: none; color: #1D1A38;}
    a.navibox:hover { color: #104D90;}
    .navibox-super { background: rgba(0,0,0,.25);}
    a.navibox-super { border: 3px solid #F2BC1B; text-decoration: none; color: #1D1A38; background: #F2BC1B;}
    a.navibox-super:hover { border: 3px solid #104D90; color: #F2BC1B; background: #104D90;}
    .navibox p, .navibox-super p { margin: 0; font-weight: 500;}

    /* Obsahová část */
    section { width: 100%; height: auto; padding: 60px 0; display: flex; flex-flow: column; align-items: center; justify-content: center;}
    main { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; border-top: 1px solid #d0d0d0; background: #FFF url('../themes/future.jpg') bottom center no-repeat; background-size: 900px auto;;}
    .town { background: #FFF url('../themes/town.png') top center no-repeat; background-size: 1200px auto;}
    main p { text-align: center;}

    /* Obsahová část */
    .content { width: 760px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .content h1 { width: 100%; text-align: center; font-weight: 300;}
    .content h1 span { color: #FFF; background: #1D1A38; font-size: 1.2em; padding: 10px 20px; font-weight: 500;}
    .content h2 { width: 100%; text-align: center; color: #F2BC1B;}

    .erbus { width: 760px; height: auto; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .erb { width: 170px; height: auto; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .erb img { width: 170px; margin-left: 5px;}
    .erb img.shadow { filter: grayscale(1); width: 200px; margin-left: 5px;}
    .erb h3 { margin: 0; font-size: 1.4em; text-align: center; font-weight: 500;}

    .article-content { width: 760px; height: auto; padding: 0; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    
    .articlebox { width: 245px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    a.articlebox { text-decoration: none;}
    .articlebox h2 { font-size: 1.5em; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    a.articlebox h2 { color: #1D1A38; text-decoration: none;}
    a.articlebox:hover h2 { color: #104D90; text-decoration: none;}
    .articlebox p { margin: 0;}
    .articlebox-image { width: 243px; height: 168px; border: 1px solid #1D1A38; overflow: hidden; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .articlebox-image img { object-fit: cover; display: block; transition: all .35s ease-in-out;}
    a.articlebox .articlebox-image img { height: 100%; filter: grayscale(1);}
    a.articlebox:hover .articlebox-image img { height: 105%; filter: grayscale(0);}

    /* Vlastní článek */
    #facebody-page h1 { width: 100%; font-size: 1.8em; margin: 10px 0 0 0; text-align: center; font-weight: 300;}
    article { width: 760px; height: auto; display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-around;}
    .left-container { width: 750px; padding: 0 5px; height: auto; display: flex; flex-wrap: wrap; align-content: start; align-items: left; justify-content: start;}
    .right-container { width: 760px; height: auto; display: flex; gap: 10px; flex-wrap: wrap; align-items: start; align-content: start; justify-content: center;}
    
    .right-container h1 { width: 100%; text-align: left;}
    .right-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; font-weight: 500; color: #1D1A38; background: #F2BC1B;}

    /* Kontaktní informace */
    .contact-content { width: 760px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: center; padding: 50px 0;}

    .contact-content h1 { width: 100%; text-align: center; color: #F2BC1B;}
    .contact-content h1 span { color: #1D1A38; background: #F2BC1B; padding: 10px 20px; font-weight: 500;}
    .contact-content h2 { width: 100%; font-size: 1.4em; text-align: center; color: #1D1A38;}
    .contact-content h2 span { color: #F2BC1B; font-style: italic; background: #104D90; padding: 10px 20px; border-radius: 10px; border: 1px solid #F2BC1B; font-weight: 300;}
    .contact-content .erb { width: 180px;}
    .contact-content .erb img { width: 170px;}
    .contact-content .erb img.shadow { width: 170px;}

    /* Spodní část */
    footer { width: 100%; height: auto; padding: 40px 0 30px 0; display: flex; flex-wrap: wrap; align-items: end; justify-content: center; border-top: 1px solid #1D1A38; background: #FFF url('../themes/footer.white.png') calc(50% + 200px) 40px no-repeat; background-size: 900px auto;}
    footer .content { width: 760px; height: auto; padding: 0 0 20px 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: start; justify-content: center;}
    footer .socbox { width: auto; height: 30px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center;}
    footer .socbox img { width: 30px;}
    footer .socbox p { width: auto; margin: 0 0 0 0; padding: 0 20px 0 10px; font-size: 1.2em; font-weight: 500;}

    footer .content-bottom { width: 760px; height: auto; z-index: 10; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    footer .content-bottom p { margin: 0 0 4px 0; font-size: .9em; text-align: center;}

    /* Obsahová část webu */
    .content-page-image-position { width: 700px; height: 340px; margin: 0 0 0 20px;}
    .content-page-image { width: 698px; height: 398px; margin: -20px 0 0 0; border: 1px solid #1D1A38; overflow: hidden; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .content-page-image img { width: 100%; object-fit: cover; display: block;}

    .left-container h1 { width: 100%; text-align: left;}
    .left-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; color: #f8f8f8; background: #104D90;}
    .left-container h2 { width: 100%; text-align: left;}
    .left-container h2 { width: auto; padding: 10px 20px; margin: 0; font-weight: 600; position: relative; color: #104D90;}
    .left-container p { font-size: 1.2em; text-align: justify;}
    .left-container p span { font-weight: 600; color: #1D1A38;}

    .content-link { width: 100%; height: 30px; padding: 10px 0; margin: 0 0 5px 0; cursor: pointer; font-weight: 400; transition: all .35s ease-in-out; position: relative; display: flex; flex-wrap: wrap; justify-content: left; align-items: center;}
    a.content-link { text-decoration: none; border-bottom: 1px solid rgba(27,26,32,.15);}
    a.content-link:hover { border-bottom: 1px solid #F2BC1B;}
    .content-link p { font-size: 1.2em; width: 680px; color: #444; margin: 0; font-weight: 300; transition: all .35s ease-in-out; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
    .content-link p span { transition: all .35s ease-in-out;}
    a.content-link:hover p, a.content-link:hover p span { color: #104D90;}
    .content-link-icon { width: 50px; height: 30px;}
    .content-link-icon-data { width: 50px; height: 50px; position: absolute; margin: -10px 0;}
    .content-link-icon-data img { width: 40px; margin: 5px; transition: all .35s ease-in-out;}
    a.content-link .content-link-icon-data img { filter: grayscale(1);}
    a.content-link:hover .content-link-icon-data img { filter: grayscale(0);}

    .gallery-face, .video-face { width: 750px; height: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .gallery-box { width: 238px; height: 143px; margin-bottom: 10px; border: 1px solid #1D1A38; overflow: hidden; cursor: pointer; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; transition: all .35s ease-in-out;}
    .gallery-box:hover { border: 1px solid #F2BC1B;}
    .gallery-box img { width: 100%; object-fit: cover; display: block;}
    .video-face { width: 680px; padding: 35px;}
    .youtubevimeo { width: 680px; height: 380px; border: 1px solid #104D90;}
    
    .content-page-tiraz { width: 730px; padding: 15px; border-top: 1px solid #c5c5c5;}
    .content-page-tiraz-box { width: 720px; margin: 0 0 10px 0; font-size: 15px; color: #444; display: flex; flex-wrap: wrap;}
    .content-page-tiraz-box:nth-child(2) { margin: 0;}
    .content-page-tiraz-box-a { width: 120px; font-weight: 600;}
    .content-page-tiraz-box-b { width: 600px; font-weight: 600;}
    .content-page-tiraz-box-b span { font-weight: 300;}

    /* Navigační ikona */
    .mobilnavigace { width: 0px; height: 0px; position: absolute; margin: 0; visibility: hidden; overflow: hidden; border: none;}
}

/* Tablety na výšku */
@media screen and (min-width: 481px) and (max-width: 767px) {
    #facebody, #facebody-page { width: 100%; height: auto; position: relative; display: flex; flex-flow: column; align-items: flex-start; justify-content: center;}

    /* Definice textu */
    .free { width:100%; height: 20px;}
    .free-big { width: 100%; height: 30px;}
    .free-mini { width: 100%; height: 12px;}
    .space { width: 100%; height: 20px;}
    .top-space { width: 100%; height: 30px;}

    h1 { font-size: 22px; margin: 0 0 12px 0;}
    h2 { font-size: 19px;}
    p { font-size: 16px; margin: 0 0 6px 0; font-weight: 300;}
    li { width: 100%; font-size: 16px; margin: 0 0 6px 0; list-style: none;}
    li::before { content: "➜ "; color: #104D90;}

    /* Hlavička webu */
    header { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1D1A38; background: #FFF url('../themes/nadpis.png') calc(50%) 100px no-repeat; background-size: 700px auto;}
    .header-menu { width: 480px; height: 80px; z-index: 10; display: flex; align-items: start; justify-content: start;}
    .logo { width: 180px; height: 100px; margin: 0 0 0 150px; display: flex; align-items: top; justify-content: center;}
    .logo img { width: 180px; margin-top: -20px;}

    .navigace { width: 0px; height: 0px; visibility: hidden; overflow: hidden; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
    .navi-socbox { width: 0px; height: 0px; visibility: hidden; overflow: hidden; display: flex; align-items: center; justify-content: flex-end;}
    .socbox { width: auto; height: 40px; padding: 0 10px; display: flex; align-items: center; justify-content: center;}
    .socbox img { width: 40px;}

    nav { width: 0px; height: 0px; overflow: hidden; visibility: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;}
    .navibox, .navibox-super { width: auto; height: 40px; padding: 0 20px; display: flex; align-items: center; justify-content: center; transition: all .35s ease-in-out;}
    a.navibox { text-decoration: none; color: #1D1A38;}
    a.navibox:hover { color: #104D90;}
    .navibox-super { background: rgba(0,0,0,.25);}
    a.navibox-super { border: 3px solid #F2BC1B; text-decoration: none; color: #1D1A38; background: #F2BC1B;}
    a.navibox-super:hover { border: 3px solid #104D90; color: #F2BC1B; background: #104D90;}
    .navibox p, .navibox-super p { margin: 0; font-weight: 500;}

    /* Obsahová část */
    section { width: 100%; height: auto; padding: 40px 0; display: flex; flex-flow: column; align-items: center; justify-content: center;}
    main { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; border-top: 1px solid #d0d0d0; background: #FFF url('../themes/future.jpg') bottom center no-repeat; background-size: 700px auto;;}
    .town { background: #FFF url('../themes/town.png') top center no-repeat; background-size: 800px auto;}
    main p { text-align: center;}

    /* Obsahová část */
    .content { width: 460px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .content h1 { width: 100%; text-align: center; font-weight: 300;}
    .content h1 span { color: #FFF; background: #1D1A38; font-size: 22px; padding: 8px 15px; font-weight: 500;}
    .content h2 { width: 100%; text-align: center; color: #F2BC1B;}

    .erbus { width: 460px; height: auto; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .erb { width: 150px; height: auto; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .erb img { width: 140px; margin-left: 5px;}
    .erb img.shadow { filter: grayscale(1); width: 140px; margin-left: 5px;}
    .erb h3 { margin: 0; font-size: 17px; text-align: center; font-weight: 500;}

    .article-content { width: 460px; height: auto; padding: 0; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: start;}
    
    .articlebox { width: 225px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    a.articlebox { text-decoration: none;}
    .articlebox h2 { font-size: 18px; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    a.articlebox h2 { color: #1D1A38; text-decoration: none;}
    a.articlebox:hover h2 { color: #104D90; text-decoration: none;}
    .articlebox p { margin: 0;}
    .articlebox-image { width: 225px; height: 148px; border: 1px solid #1D1A38; overflow: hidden; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .articlebox-image img { object-fit: cover; display: block; transition: all .35s ease-in-out;}
    a.articlebox .articlebox-image img { height: 100%; filter: grayscale(1);}
    a.articlebox:hover .articlebox-image img { height: 105%; filter: grayscale(0);}

    /* Vlastní článek */
    #facebody-page h1 { width: 100%; font-size: 20px; margin: 10px 0 0 0; text-align: center; font-weight: 300;}
    article { width: 460px; height: auto; display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-around;}
    .left-container { width: 460px; padding: 0; height: auto; display: flex; flex-wrap: wrap; align-content: start; align-items: left; justify-content: start;}
    .right-container { width: 460px; height: auto; display: flex; flex-wrap: wrap; align-items: start; align-content: start; justify-content: space-between;}

    /* Kontaktní informace */
    .contact-content { width: 460px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: center; padding: 40px 0;}

    .contact-content h1 { width: 100%; text-align: center; color: #F2BC1B;}
    .contact-content h1 span { color: #1D1A38; background: #F2BC1B; padding: 8px 15px; font-weight: 500;}
    .contact-content h2 { width: 100%; font-size: 18px; text-align: center; color: #1D1A38;}
    .contact-content h2 span { color: #F2BC1B; font-style: italic; background: #104D90; padding: 10px 20px; border-radius: 10px; border: 1px solid #F2BC1B; font-weight: 300;}
    .contact-content .erb { width: 100px;}
    .contact-content .erb img { width: 100px;}
    .contact-content .erb img.shadow { width: 100px;}

    /* Spodní část */
    footer { width: 100%; height: auto; padding: 30px 0 30px 0; display: flex; flex-wrap: wrap; align-items: end; justify-content: center; border-top: 1px solid #1D1A38; background: #FFF url('../themes/footer.white.png') 50% 40px no-repeat; background-size: 600px auto;}
    footer .content { width: 460px; height: auto; padding: 0 0 20px 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: start; justify-content: center;}
    footer .socbox { width: auto; height: 30px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center;}
    footer .socbox img { width: 30px;}
    footer .socbox p { width: auto; margin: 0 0 0 0; padding: 0 20px 0 10px; font-size: 16px; font-weight: 500;}

    footer .content-bottom { width: 460px; height: auto; z-index: 10; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    footer .content-bottom p { margin: 0 0 4px 0; font-size: 13px; text-align: center;}

    /* Obsahová část webu */
    .content-page-image-position { width: 460px; height: 200px; margin: 0;}
    .content-page-image { width: 458px; height: 278px; margin: -20px 0 0 0; border: 1px solid #1D1A38; overflow: hidden; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .content-page-image img { width: 100%; object-fit: cover; display: block;}

    .left-container h1 { width: 100%; text-align: left;}
    .left-container h1 span { width: auto; text-align: left; padding: 10px 20px; position: relative; color: #f8f8f8; background: #104D90;}
    .left-container h2 { width: 100%; text-align: left;}
    .left-container h2 { width: auto; padding: 10px 20px; margin: 0; font-weight: 600; position: relative; color: #104D90;}
    .left-container p { font-size: 17px; text-align: justify;}
    .left-container p span { font-weight: 600; color: #1D1A38;}

    .content-link { width: 460px; height: 30px; padding: 5px 0; margin: 0 0 5px 0; cursor: pointer; font-weight: 400; transition: all .35s ease-in-out; position: relative; display: flex; flex-wrap: wrap; justify-content: left; align-items: center;}
    a.content-link { text-decoration: none; border-bottom: 1px solid rgba(27,26,32,.15);}
    a.content-link:hover { border-bottom: 1px solid #F2BC1B;}
    .content-link p { font-size: 17px; width: 410px; color: #444; margin: 0; font-weight: 300; transition: all .35s ease-in-out; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
    .content-link p span { transition: all .35s ease-in-out;}
    a.content-link:hover p, a.content-link:hover p span { color: #104D90;}
    .content-link-icon { width: 40px; height: 30px;}
    .content-link-icon-data { width: 30px; height: 30px; position: absolute; margin: 0;}
    .content-link-icon-data img { width: 30px; margin-left: 5px; transition: all .35s ease-in-out;}
    a.content-link .content-link-icon-data img { filter: grayscale(1);}
    a.content-link:hover .content-link-icon-data img { filter: grayscale(0);}

    .gallery-face, .video-face { width: 460px; height: auto; display: flex; flex-wrap: wrap; justify-content: space-around;}
    .gallery-box { width: 218px; height: 133px; margin-bottom: 10px; border: 1px solid #1D1A38; overflow: hidden; cursor: pointer; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; transition: all .35s ease-in-out;}
    .gallery-box:hover { border: 1px solid #F2BC1B;}
    .gallery-box img { width: 100%; object-fit: cover; display: block;}
    .video-face { width: 420px; padding: 20px;}
    .youtubevimeo { width: 420px; height: 280px; border: 1px solid #104D90;}
    
    .content-page-tiraz { width: 440px; padding: 15px; border-top: 1px solid #c5c5c5;}
    .content-page-tiraz-box { width: 430px; margin: 0 0 10px 0; font-size: 15px; color: #444; display: flex; flex-wrap: wrap;}
    .content-page-tiraz-box:nth-child(2) { margin: 0;}
    .content-page-tiraz-box-a { width: 120px; font-weight: 600;}
    .content-page-tiraz-box-b { width: 310px; font-weight: 600;}
    .content-page-tiraz-box-b span { font-weight: 300;}

    /* Navigační ikona */
    .mobilnavigace { width: 42px; height: 42px; position: absolute; margin: 0 0 0 calc(50% + 76px); border: 2px solid #444; border-radius: 100%; display: flex; align-items: center; justify-content: center;}
    .mobileicon { width: 30px; height: 30px; background: url('../themes/icons.png') top no-repeat; background-size: cover;}
}

/* Rozhraní pro mobil */
@media screen and (max-width: 480px) {
    #facebody, #facebody-page { width: 100%; height: auto; position: relative; display: flex; flex-flow: column; align-items: flex-start; justify-content: center;}

    /* Definice textu */
    .free { width:100%; height: 6px;}
    .free-big { width: 100%; height: 20px;}
    .free-mini { width: 100%; height: 6px;}
    .space { width: 100%; height: 10px;}
    .top-space { width: 100%; height: 15px;}

    h1 { font-size: 22px; margin: 0 0 12px 0;}
    h2 { font-size: 19px;}
    p { font-size: 16px; margin: 0 0 6px 0; font-weight: 300;}
    li { width: 100%; font-size: 16px; margin: 0 0 6px 0; list-style: none;}
    li::before { content: "➜ "; color: #104D90;}

    /* Hlavička webu */
    header { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1D1A38; background: #FFF url('../themes/nadpis.png') calc(50%) 100px no-repeat; background-size: 400px auto;}
    .header-menu { width: 320px; height: 70px; z-index: 10; display: flex; align-items: start; justify-content: start;}
    .logo { width: 140px; height: 100px; margin: 0 0 0 90px; display: flex; align-items: top; justify-content: center;}
    .logo img { width: 140px; margin-top: -20px;}

    .navigace { width: 0px; height: 0px; visibility: hidden; overflow: hidden; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
    .navi-socbox { width: 0px; height: 0px; visibility: hidden; overflow: hidden; display: flex; align-items: center; justify-content: flex-end;}
    .socbox { width: auto; height: 40px; padding: 0 10px; display: flex; align-items: center; justify-content: center;}
    .socbox img { width: 40px;}

    nav { width: 0px; height: 0px; overflow: hidden; visibility: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;}
    .navibox, .navibox-super { width: auto; height: 40px; padding: 0 20px; display: flex; align-items: center; justify-content: center; transition: all .35s ease-in-out;}
    a.navibox { text-decoration: none; color: #1D1A38;}
    a.navibox:hover { color: #104D90;}
    .navibox-super { background: rgba(0,0,0,.25);}
    a.navibox-super { border: 3px solid #F2BC1B; text-decoration: none; color: #1D1A38; background: #F2BC1B;}
    a.navibox-super:hover { border: 3px solid #104D90; color: #F2BC1B; background: #104D90;}
    .navibox p, .navibox-super p { margin: 0; font-weight: 500;}

    /* Obsahová část */
    section { width: 100%; height: auto; padding: 20px 0; display: flex; flex-flow: column; align-items: center; justify-content: center;}
    main { width: 100%; height: auto; display: flex; align-items: center; justify-content: center; border-top: 1px solid #d0d0d0; background: #FFF url('../themes/future.jpg') bottom center no-repeat; background-size: 400px auto;;}
    .town { background: #FFF url('../themes/town.png') top center no-repeat; background-size: 800px auto;}
    main p { text-align: center;}

    /* Obsahová část */
    .content { width: 320px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .content h1 { width: 100%; text-align: center; font-weight: 300;}
    .content h1 span { color: #FFF; background: #1D1A38; font-size: 20px; padding: 10px 20px; font-weight: 500;}
    .content h2 { width: 100%; text-align: center; color: #F2BC1B;}

    .erbus { width: 320px; height: auto; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .erb { width: 100px; height: auto; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    .erb img { width: 90px; margin-left: 5px;}
    .erb img.shadow { filter: grayscale(1); width: 90px; margin-left: 5px;}
    .erb h3 { margin: 0; font-size: 14px; text-align: center; font-weight: 500;}

    .article-content { width: 320px; height: auto; padding: 0; gap: 10px; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    
    .articlebox { width: 150px; height: auto; display: flex; flex-wrap: wrap; align-content: start; justify-content: start; transition: all .35s ease-in-out;}
    a.articlebox { text-decoration: none;}
    .articlebox h2 { font-size: 16px; width: 100%; text-align: left; color: #1D1A38; font-weight: 300; margin: 0 0 5px 0; transition: all .35s ease-in-out;}
    a.articlebox h2 { color: #1D1A38; text-decoration: none;}
    a.articlebox:hover h2 { color: #104D90; text-decoration: none;}
    .articlebox p { margin: 0; font-size: 14px;}
    .articlebox-image { width: 150px; height: 98px; border: 1px solid #1D1A38; overflow: hidden; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;}
    .articlebox-image img { object-fit: cover; display: block; transition: all .35s ease-in-out;}
    a.articlebox .articlebox-image img { height: 100%; filter: grayscale(1);}
    a.articlebox:hover .articlebox-image img { height: 105%; filter: grayscale(0);}

    /* Vlastní článek */
    #facebody-page h1 { width: 100%; font-size: 20px; margin: 10px 0 0 0; text-align: center; font-weight: 300;}
    article { width: 320px; height: auto; display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-around;}
    .left-container { width: 320px; padding: 0; height: auto; display: flex; flex-wrap: wrap; align-content: start; align-items: left; justify-content: start;}
    .right-container { width: 320px; height: auto; display: flex; flex-wrap: wrap; align-items: start; align-content: start; justify-content: space-between;}

    /* Kontaktní informace */
    .contact-content { width: 320px; height: auto; display: flex; flex-wrap: wrap; align-items: start; justify-content: center; padding: 20px 0;}

    .contact-content h1 { width: 100%; text-align: center; color: #F2BC1B;}
    .contact-content h1 span { color: #1D1A38; background: #F2BC1B; padding: 5px 10px; font-weight: 500;}
    .contact-content h2 { width: 100%; font-size: 15px; text-align: center; color: #1D1A38;}
    .contact-content h2 span { color: #F2BC1B; font-style: italic; background: #104D90; padding: 5px 10px; border-radius: 10px; border: 1px solid #F2BC1B; font-weight: 300;}
    .contact-content .erb { width: 80px;}
    .contact-content .erb img { width: 70px;}
    .contact-content .erb img.shadow { width: 70px;}

    /* Spodní část */
    footer { width: 100%; height: auto; padding: 20px 0 20px 0; display: flex; flex-wrap: wrap; align-items: end; justify-content: center; border-top: 1px solid #1D1A38; background: #FFF url('../themes/footer.white.png') calc(50% + 50px) 40px no-repeat; background-size: 600px auto;}
    footer .content { width: 320px; height: auto; padding: 0 0 20px 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: start; justify-content: center;}
    footer .socbox { width: auto; height: 25px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center;}
    footer .socbox img { width: 25px;}
    footer .socbox p { width: auto; margin: 0 0 0 0; padding: 0 20px 0 10px; font-size: 15px; font-weight: 500;}

    footer .content-bottom { width: 320px; height: auto; z-index: 10; display: flexbox; flex-wrap: wrap; align-items: start; justify-content: space-between;}
    footer .content-bottom p { margin: 0 0 4px 0; font-size: 14px; text-align: center;}

    /* Obsahová část webu */
    .content-page-image-position { width: 320px; height: 100px; margin: 0;}
    .content-page-image { width: 318px; height: 178px; margin: -30px 0 0 0; border: 1px solid #1D1A38; overflow: hidden; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .content-page-image img { width: 100%; object-fit: cover; display: block;}

    .left-container h1 { width: 100%; text-align: left;}
    .left-container h1 span { width: auto; text-align: left; padding: 5px 10px; position: relative; color: #f8f8f8; background: #104D90;}
    .left-container h2 { width: 100%; text-align: left;}
    .left-container h2 { width: auto; padding: 5px 10px; margin: 0; font-weight: 600; position: relative; color: #104D90;}
    .left-container p { font-size: 16px; text-align: justify;}
    .left-container p span { font-weight: 600; color: #1D1A38;}

    .content-link { width: 320px; height: auto; padding: 5px 0; margin: 0 0 5px 0; cursor: pointer; font-weight: 400; transition: all .35s ease-in-out; position: relative; display: flex; flex-wrap: wrap; justify-content: left; align-items: center;}
    a.content-link { text-decoration: none; border-bottom: 1px solid rgba(27,26,32,.15);}
    a.content-link:hover { border-bottom: 1px solid #F2BC1B;}
    .content-link p { font-size: 15px; width: 270px; color: #444; margin: 0; font-weight: 300; transition: all .35s ease-in-out; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
    .content-link p span { transition: all .35s ease-in-out;}
    a.content-link:hover p, a.content-link:hover p span { color: #104D90;}
    .content-link-icon { width: 40px; height: 30px;}
    .content-link-icon-data { width: 30px; height: 30px; position: absolute; margin: 0;}
    .content-link-icon-data img { width: 30px; margin-left: 5px; transition: all .35s ease-in-out;}
    a.content-link .content-link-icon-data img { filter: grayscale(1);}
    a.content-link:hover .content-link-icon-data img { filter: grayscale(0);}

    .gallery-face, .video-face { width: 320px; height: auto; display: flex; flex-wrap: wrap; justify-content: space-between;}
    .gallery-box { width: 153px; height: 93px; margin-bottom: 10px; border: 1px solid #1D1A38; overflow: hidden; cursor: pointer; position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; transition: all .35s ease-in-out;}
    .gallery-box:hover { border: 1px solid #F2BC1B;}
    .gallery-box img { width: 100%; object-fit: cover; display: block;}
    .video-face { width: 310px; padding: 5px;}
    .youtubevimeo { width: 310px; height: 170px; border: 1px solid #104D90;}
    
    .content-page-tiraz { width: 310px; padding: 5px; border-top: 1px solid #c5c5c5;}
    .content-page-tiraz-box { width: 310px; margin: 0 0 10px 0; font-size: 13px; color: #444; display: flex; flex-wrap: wrap;}
    .content-page-tiraz-box:nth-child(2) { margin: 0;}
    .content-page-tiraz-box-a { width: 90px; font-weight: 600;}
    .content-page-tiraz-box-b { width: 220px; font-weight: 600;}
    .content-page-tiraz-box-b span { font-weight: 300;}

    /* Navigační ikona */
    .mobilnavigace { width: 42px; height: 42px; position: absolute; margin: 0 0 0 calc(100% - 86px); border: 2px solid #444; cursor: pointer; border-radius: 100%; display: flex; align-items: center; justify-content: center;}
    .mobileicon { width: 30px; height: 30px; background: url('../themes/icons.png') top no-repeat; background-size: cover;}
}