/* === Základní Mobile-First Styly === */

:root {

    --krnov-blue: #0066B2;

    --krnov-yellow: #FDCE00;

    --bg-main: #F7F7F7;

    --bg-secondary: #E7E7E7;

    --heading-color: #344648;

    --text-color: #000000;

    --font-main: 'Open Sans', sans-serif;

    font-size: 16px;

}



body {

    font-family: var(--font-main);

    background-color: var(--bg-main);

    color: var(--text-color);

    margin: 0;

    padding: 0;

    display: flex;

    flex-direction: column; /* Allow language selector above container */

    justify-content: flex-start; /* Align items to top */

    align-items: center; /* Center items horizontally */

    min-height: 100vh;

    padding-top: 10px; /* Space for language selector */

}



/* === Language Selector === */

.language-selector {

    background-color: white;

    padding: 10px 15px;

    margin-bottom: 15px;

    border-radius: 8px;

    box-shadow: 0 1px 4px rgba(0,0,0,0.1);

    display: flex; /* Changed by JS if needed */

    align-items: center;

    gap: 10px;

    flex-wrap: wrap; /* Allow wrapping on small screens */

    justify-content: center; /* Center items when wrapped */

}



.lang-selector-label {

    font-weight: bold;

    color: var(--heading-color);

    font-size: 0.95rem;

    flex-basis: 100%; /* Make label take full width initially */

    text-align: center;

    margin-bottom: 5px; /* Space between label and flags on mobile */

    order: 1; /* Label first on mobile */

}



.lang-flag-button {

    background: none;

    border: 2px solid transparent;

    padding: 2px;

    margin: 0 5px; /* Add some horizontal margin */

    cursor: pointer;

    border-radius: 4px;

    line-height: 0; /* Remove extra space around image */

    transition: border-color 0.2s ease;

    order: 2; /* Put flags after label */

}



.lang-flag-button img {

    width: 32px;

    height: auto;

    display: block;

    border: 1px solid #ccc; /* Subtle border around flag */

}



.lang-flag-button:hover,

.lang-flag-button:focus {

    border-color: var(--krnov-blue);

    outline: none;

}



.lang-flag-button:active {

    transform: scale(0.95);

}





/* === Language Visibility Control === */

.lang {

    display: none !important; /* Hide all language-specific elements by default */

}



/* Show elements ONLY for the language class active on the BODY tag */



/* Default display for shown elements (inline for spans) */

body.lang-cz .lang-cz,

body.lang-pl .lang-pl {

    display: inline !important;

}



/* Override display to BLOCK for specific elements when shown */

body.lang-cz h1.lang-cz,

body.lang-cz h2.lang-cz,

body.lang-cz h3.lang-cz,

body.lang-cz p.lang-cz,

body.lang-cz div.lang-cz, /* Generic div containers */

body.lang-cz li.lang-cz,  /* List items */

body.lang-cz label.lang-cz, /* Form labels */

body.lang-cz .lang-selector-label.lang-cz, /* Label in language selector */

body.lang-cz .credits.lang-cz /* Credits paragraph */

{

    display: block !important;

}



body.lang-pl h1.lang-pl,

body.lang-pl h2.lang-pl,

body.lang-pl h3.lang-pl,

body.lang-pl p.lang-pl,

body.lang-pl div.lang-pl,

body.lang-pl li.lang-pl,

body.lang-pl label.lang-pl,

body.lang-pl .lang-selector-label.lang-pl,

body.lang-pl .credits.lang-pl /* Credits paragraph */

{

    display: block !important;

}



/* Ensure spans INSIDE other shown elements display correctly */

body.lang-cz a > .lang-cz,

body.lang-cz button > .lang-cz,

body.lang-cz b > .lang-cz,

body.lang-cz strong > .lang-cz,

body.lang-cz em > .lang-cz,

body.lang-cz #timer-display > .lang-cz,

body.lang-cz #penalty-info > .lang-cz,

body.lang-cz #final-penalty-info > .lang-cz,

body.lang-cz #cloze-penalty-info > .lang-cz,

body.lang-cz #cert-code > .lang-cz,

body.lang-cz th > .lang-cz /* Span inside table header */

{

    display: inline !important;

}



body.lang-pl a > .lang-pl,

body.lang-pl button > .lang-pl,

body.lang-pl b > .lang-pl,

body.lang-pl strong > .lang-pl,

body.lang-pl em > .lang-pl,

body.lang-pl #timer-display > .lang-pl,

body.lang-pl #penalty-info > .lang-pl,

body.lang-pl #final-penalty-info > .lang-pl,

body.lang-pl #cloze-penalty-info > .lang-pl,

body.lang-pl #cert-code > .lang-pl,

body.lang-pl th > .lang-pl

{

    display: inline !important;

}



/* Special handling for <option> elements */

body.lang-cz select option.lang-cz,

body.lang-pl select option.lang-pl {

    display: block !important; /* Options need to be visible */

}

/* Hide options of the OTHER language */

body.lang-cz select option.lang-pl,

body.lang-pl select option.lang-cz {

    display: none !important;

}

/* Handle the default disabled option */

body.lang-cz select option[value=""][disabled].lang-cz,

body.lang-pl select option[value=""][disabled].lang-pl {

     display: block !important;

}

body.lang-cz select option[value=""][disabled].lang-pl,

body.lang-pl select option[value=""][disabled].lang-cz {

     display: none !important;

}





/* Fix for spans directly inside story text paragraph */

#story-text > .lang {

    display: inline !important; /* Ensure they behave like text */

}

/* Then hide/show based on body class */

body.lang-cz #story-text > .lang-pl,

body.lang-pl #story-text > .lang-cz {

     display: none !important;

}

body.lang-cz #story-text > .lang-cz,

body.lang-pl #story-text > .lang-pl {

     display: inline !important; /* Reinforce inline display when shown */

}



/* === End Language Visibility === */





.container {

    background-color: white;

    padding: 15px 15px;

    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);

    max-width: 800px;

    width: 100%;

    box-sizing: border-box;

    margin-top: 0; /* Remove extra margin if body padding exists */

}



.page { display: none; }

.page.active { display: block; }



h1, h2, h3, h4, h5, h6 {

    color: var(--heading-color);

    margin-top: 0;

    margin-bottom: 0.8em;

    line-height: 1.3;

}

h1 {

    color: var(--krnov-blue);

    text-align: center;

    margin-bottom: 1.2em;

    font-size: 1.9em;

    margin-top: 1em;

}

h2 {

    font-size: 1.5em;

}

p {

    color: var(--text-color);

    line-height: 1.6;

    margin-bottom: 1em;

    font-size: 1rem;

}

#story-text {



    white-space: pre-line;

    text-align: justify;

    hyphens: auto;

}



/* === Styly pro odkazy === */

a {

    color: var(--krnov-blue);

    text-decoration: none;

    transition: color 0.2s ease, text-decoration 0.2s ease;

}



a:hover, a:focus {

    color: #00508e;

    text-decoration: underline;

    outline: none;

}



#page-intro p a {

    font-weight: bold;

}



.logos {

    display: flex;

    justify-content: space-around;

    align-items: center;

    margin: 20px 0;

    background-color: transparent;

    padding: 0;

    border-radius: 0;

    flex-wrap: wrap;

    gap: 10px;

}

#page-intro center img {

    display: block;

    margin: 10px auto;

    max-width: 100%;

    height: auto;

}

.logos img {

    max-height: 35px;

    width: auto;

    vertical-align: middle;

}



button {

    background-color: var(--krnov-blue);

    color: white;

    border: none;

    padding: 14px 20px;

    border-radius: 5px;

    font-size: 1rem;

    cursor: pointer;

    transition: background-color 0.3s ease;

    margin-top: 15px;

    margin-right: 8px;

    display: inline-block;

    min-height: 44px;

    box-sizing: border-box;

    line-height: 1.2;

    text-align: center;

}

button:last-of-type { margin-right: 0; }

button:hover, button:focus {

    background-color: #00508e;

    outline: 2px solid var(--krnov-yellow);

    outline-offset: 2px;

}

button:active {

    transform: scale(0.98);

}



#page-intro center button#btn-to-story {

    margin-right: 0;

}



/* === ÚPRAVY REGISTRACE === */

#page-register h2 {

    margin-bottom: 0.6em;

}

#page-register p:first-of-type {

    margin-bottom: 1.2em;

}

form {

    margin-top: 20px;

    display: flex;

    flex-direction: column;

    gap: 15px;

}

#registration-form {

    gap: 8px;

    margin-top: 0;

}

label {

    font-weight: bold;

    color: var(--heading-color);

    font-size: 0.95rem;

    margin-bottom: -5px;

}

#registration-form label {

     margin-bottom: -4px;

}

#registration-form button#btn-start-game {

    background-color: var(--krnov-yellow);

    color: var(--heading-color);

    font-weight: bold;

    width: 100%;

    margin-top: 30px;

}

#registration-form button#btn-start-game:hover,

#registration-form button#btn-start-game:focus {

    background-color: #e4b800;

}

#registration-form + hr {

    margin: 35px 0 30px 0;

    border: none;

    border-top: 1px solid #ccc;

}

/* === KONEC ÚPRAV REGISTRACE === */





input[type="text"],

textarea,

select,

input[type="number"] {

    padding: 12px 10px;

    border: 1px solid #ccc;

    border-radius: 4px;

    font-size: 1rem;

    width: 100%;

    box-sizing: border-box;

    background-color: white;

    color: var(--text-color);

    font-family: inherit;

    margin-top: 2px;

}



select {

    cursor: pointer;

}



input[type="number"]::placeholder { color: #aaa; opacity: 1; }

input[type="number"]::-webkit-inner-spin-button,

input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

input[type="number"] { -moz-appearance: textfield; }

textarea { resize: vertical; }



#timer-display {

    font-size: 1.1em;

    font-weight: bold;

    text-align: right;

    margin-bottom: 15px;

    color: var(--krnov-blue);

    padding: 0 15px;

    box-sizing: border-box;

    width: 100%;

}



.map-scroll-container {

    width: 100%;

    height: calc(100vh - 280px); /* Adjust height if needed */

    overflow: scroll;

    border: 1px solid #ccc;

    margin: 0 0 15px 0;

    position: relative;

    -webkit-overflow-scrolling: touch;

    line-height: 0; /* Prevent extra space below image */

}

.map-image-wrapper {

    position: relative;

    height: 100%; /* Make wrapper control height */

    display: inline-block; /* Allow points to be positioned relative */

    vertical-align: top;

}

#map-image {

    display: block;

    height: 100%; /* Image fills wrapper height */

    width: auto; /* Width adjusts automatically */

    max-width: none; /* Allow image to be wider than container for scrolling */

}



/* === Map Points jako kruhy === */

.map-point-abs {

    position: absolute;

    width: 20px;

    height: 20px;

    background-color: var(--krnov-yellow);

    border: 2px solid var(--krnov-blue);

    border-radius: 50%;

    cursor: pointer;

    transition: transform 0.2s, border-color 0.3s, background-color 0.3s;

    transform: translate(-50%, -50%);

    box-shadow: 1px 1px 3px rgba(0,0,0,0.5);

    padding: 1; /* Remove padding, use flex for centering */

    z-index: 10;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--krnov-blue);

    font-size: 0.75rem;

    font-weight: bold;

    line-height: 1;

    box-sizing: border-box;

}

.map-point-abs span { display: block; } /* Span with number inside */

.map-point-abs:hover {

    transform: translate(-50%, -50%) scale(1.2);

    border-color: #003366; /* Darker blue on hover */

}

.map-point-abs:active {

     transform: translate(-50%, -50%) scale(1.1);

}

.map-point-abs.completed {

    background-color: #28a745; /* Green for completed */

    border-color: darkgreen;

    cursor: not-allowed;

    pointer-events: none; /* Disable clicks */

    color: white;

}

.map-point-abs.completed:hover, .map-point-abs.completed:active {

     transform: translate(-50%, -50%); /* No scale effect when completed */

}

/* === KONEC MAP POINTS === */





#page-map h2, #page-map p { padding: 0 15px; margin-bottom: 10px; }

#page-map h2 + p { margin-top: 0.5em; }



#question-image-container { margin-bottom: 1.5em; text-align: center; }

.question-image {

    max-width: 100%;

    max-height: 50vh;

    height: auto;

    display: none; /* Hidden by default, shown by JS */

    margin: 0 auto;

    border: 1px solid var(--bg-secondary);

    border-radius: 4px;

    vertical-align: middle;

}



#penalty-info, #final-penalty-info, #cloze-penalty-info {

    color: red;

    font-weight: bold;

    margin-top: 15px;

    font-size: 0.9rem;

    line-height: 1.4;

    text-align: center;

}





#page-question button#btn-back-to-map {

    background-color: var(--bg-secondary);

    color: var(--heading-color);

}

#page-question button#btn-back-to-map:hover, #page-question button#btn-back-to-map:focus {

    background-color: #d0d0d0;

}



/* === Mezistránka po 10 otázkách === */

#page-intermediate-congrats { text-align: center; padding-top: 2em; padding-bottom: 2em; }

#page-intermediate-congrats h2 { color: var(--krnov-blue); margin-bottom: 1em; }

#page-intermediate-congrats p { font-size: 1.1em; margin-bottom: 1em; max-width: 600px; margin-left: auto; margin-right: auto; }

#page-intermediate-congrats button#btn-to-final-puzzle {

    background-color: var(--krnov-yellow);

    color: var(--heading-color);

    font-weight: bold;

    margin-top: 1.5em;

    padding: 15px 30px;

    margin-right: 0; /* Center button */

}

#page-intermediate-congrats button#btn-to-final-puzzle:hover,

#page-intermediate-congrats button#btn-to-final-puzzle:focus { background-color: #e4b800; }

/* === Konec mezistránky === */



/* === Styly pro Certifikát === */

#certificate {

    border: 3px solid var(--krnov-blue);

    padding: 25px 20px 15px 20px;

    margin: 30px 0;

    background-color: #ffffff;

    text-align: center;

    border-radius: 8px;

    position: relative;

    overflow: hidden;

    box-shadow: 0 4px 8px rgba(0,0,0,0.1);

    background-image: url('sipy.png'); /* Ensure this path is correct */

    background-repeat: repeat;

    background-size: 120px; /* Adjust size of pattern */

}

.kok {

    max-height: 20px; /* Default max height */

    max-width: 13%; /* Prevent tiny logos from stretching too wide */

     width: 2px;

    

}



.certificate-content {

    background-color: rgba(255, 255, 255, 0.85); /* Slightly transparent background */

    padding: 20px;

    margin-bottom: 25px;

    border-radius: 5px;

    position: relative; /* Ensure content is above background pattern */

    z-index: 1;

}



#certificate h2 {

    color: var(--krnov-blue);

    font-size: 1.8em;

    margin-bottom: 0.8em;

    font-weight: bold;

    letter-spacing: 1px;

}



#certificate p {

    font-size: 1rem;

    line-height: 1.5;

    margin-bottom: 0.6em;

    color: #333;

}



#certificate p.congrats-text {

    font-size: 1.1em;

    font-style: italic;

    margin-bottom: 0.3em;

}



#certificate p.game-title {

    font-size: 1.4em;

    font-weight: bold;

    color: var(--heading-color);

    margin-bottom: 1.2em;

}



#certificate p.cert-dynamic-data {

    margin-top: 0.5em;

    margin-bottom: 0.5em;

}



#certificate span#cert-name,

#certificate span#cert-date,

#certificate span#cert-time {

    font-weight: bold;

    color: var(--krnov-blue);

    font-size: 1.1em;

    display: inline-block; /* Prevent breaking */

    margin: 0 3px;

}



/* Zvýraznění unikátního kódu */

#certificate span#cert-code {

    font-family: 'Courier New', Courier, monospace;

    font-size: 1.1em;

    /* Specific styles (bold, color) are added/removed by JS based on status */

}





#certificate p.final-wish {

    margin-top: 1.5em;

    font-weight: bold;

    font-size: 1.1em;

    color: var(--krnov-blue);

}



.certificate-logos {

    display: flex;

    justify-content: space-around;

    align-items: center;

    margin-top: 20px;

    padding-top: 15px;

    border-top: 1px solid #ccc;

    position: relative;

    z-index: 1; /* Above background pattern */

    background-color: rgba(255, 255, 255, 0.85); /* Match content background */

    /* Adjust margins to span full width inside padding */

    margin-left: -20px;

    margin-right: -20px;

    margin-bottom: -15px; /* Extend to bottom */

    padding-left: 15px;

    padding-right: 15px;

    padding-bottom: 10px;

    border-bottom-left-radius: 6px; /* Match outer radius */

    border-bottom-right-radius: 6px;

}



/* ÚPRAVA VELIKOSTI LOG NA CERTIFIKÁTU */

.certificate-logos img {

    max-height: 45px; /* Default max height */



    width: auto;

    object-fit: contain; /* Ensure aspect ratio is maintained */

}

.kok {

    max-height: 20px; /* Default max height */

    max-width: 13%; /* Prevent tiny logos from stretching too wide */

     width: 2px;

}



/* Specifické pravidlo pro logo EU - VĚTŠÍ */

#certificate .certificate-logos img[alt="Logo EU"] {

    max-height: 60px;  /* Increased height */

    max-width: 50%;    /* Increased width allowance */

}

/* === KONEC ZMĚNY VELIKOSTI LOG === */





/* Styl aplikovaný během generování PDF (volitelné) */

#certificate.generating-pdf .certificate-content,

#certificate.generating-pdf .certificate-logos {

     /* background-color: white; */ /* Remove transparency for PDF if needed */

}

#certificate.generating-pdf {

    box-shadow: none; /* Remove shadow for cleaner PDF render */

    /* border: none; */ /* Optionally remove border for PDF */

}

/* === Konec stylů pro Certifikát === */



/* === Styl pro kredit tvůrce === */

.credits {

    text-align: center;

    font-size: 0.9em;

    margin-top: 25px;

    margin-bottom: 5px;

    color: #555;

}

/* === Konec stylu pro kredit === */



#leaderboard-table {

    width: 100%;

    border-collapse: collapse;

    margin: 20px 0;

    font-size: 0.9rem;

}

#leaderboard-table th, #leaderboard-table td {

    border: 1px solid #ddd;

    padding: 8px 6px;

    text-align: left;

    vertical-align: middle;

}

#leaderboard-table th {

    background-color: var(--bg-secondary);

    color: var(--heading-color);

    font-weight: bold;

    white-space: nowrap;

}



#leaderboard-table tbody tr:nth-child(odd) { background-color: var(--bg-main); }

#leaderboard-table td:first-child { /* Rank column */

    text-align: right;

    font-weight: bold;

    width: 35px;

    padding-right: 10px;

}

#page-leaderboard button#btn-back-to-last-page {

    background-color: var(--bg-secondary);

    color: var(--heading-color);

}

#page-leaderboard button#btn-back-to-last-page:hover, #page-leaderboard button#btn-back-to-last-page:focus {

    background-color: #d0d0d0;

}



/* === Dopňovačka (Cloze) === */

#cloze-diary { line-height: 1.8; margin-bottom: 20px; text-align: justify; }



.cloze-select {

    -webkit-appearance: none; -moz-appearance: none; appearance: none;

    border: none; background-color: transparent; padding: 0 2px; margin: 0 1px;

    font-family: inherit; font-size: inherit; line-height: inherit; color: var(--krnov-blue);

    cursor: pointer; display: inline; vertical-align: baseline; outline: none;

    border-bottom: 1px dotted #999; width: auto; /* Width adjusted by JS */

    text-indent: 0.01px; /* Fix for some browser rendering */

    text-overflow: ''; /* Prevent ellipsis */

}

.cloze-select.correct {

    background-color: #d4edda; border-color: #155724; color: #155724;

    border-bottom: 1px solid #155724; border-radius: 2px;

}

.cloze-select.incorrect {

    background-color: #f8d7da; border-color: #721c24; color: #721c24;

    border-bottom: 1px solid #721c24; border-radius: 2px;

}

/* === Konec Cloze === */





/* === Tabulka s čísly === */

.cipher-table-container {

    margin: 1.5em 0; overflow-x: auto; background-color: var(--bg-secondary);

    padding: 5px; border: 1px solid #ccc; border-radius: 4px;

}

.cipher-table {

    width: 100%; border-collapse: collapse; font-family: 'Courier New', Courier, monospace;

    font-size: 1rem; min-width: 450px; /* Prevent excessive shrinking */

}

.cipher-table td {

    border: 1px solid #bbb; padding: 8px 10px; text-align: center;

    min-width: 30px; background-color: white;

}

/* === Konec tabulky === */



#final-penalty-info { font-weight: bold; font-size: 0.9rem; }

#page-final-puzzle form { margin-top: 1.5em; }

#page-final-puzzle button#btn-submit-final-answer {

    background-color: var(--krnov-yellow);

    color: var(--heading-color);

    font-weight: bold;

    width: 100%;

    margin-top: 15px;

}

#page-final-puzzle button#btn-submit-final-answer:hover,

#page-final-puzzle button#btn-submit-final-answer:focus { background-color: #e4b800; }



/* === Media Query pro větší obrazovky === */

@media (min-width: 768px) {

    :root { font-size: 17px; } /* Slightly larger base font */

    body { padding-top: 15px; }

    .language-selector {

        padding: 12px 20px;

        gap: 15px;

        flex-wrap: nowrap; /* Prevent wrapping on larger screens */

        width: auto; /* Allow selector to shrink */

        max-width: max-content;

    }

     .lang-selector-label {

         flex-basis: auto; /* Allow label to shrink */

         order: 1; /* Put label first */

         margin-bottom: 0; /* Reset mobile margin */

         text-align: left;

     }

    .lang-flag-button img { width: 40px; }



    .container { padding: 30px 40px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); margin: 20px auto; min-height: auto; }

    h1 { font-size: 2.2em; margin-top: 0; }

    h2 { font-size: 1.7em; }

    p { font-size: 1.05rem; }

     #page-intro center img { max-width: 60%; }

    button { padding: 12px 25px; font-size: 1rem; margin-right: 10px; }

     #registration-form button#btn-start-game { width: auto; display: inline-block; }

    #page-intro center button#btn-to-story { width: auto; display: inline-block; }

     input[type="text"], textarea, select, input[type="number"] { font-size: 1rem; }

    .map-scroll-container { height: 550px; } /* Taller map on desktop */

    .map-point-abs { width: 26px; height: 26px; font-size: 0.8rem; } /* Slightly larger points */

     .question-image { max-height: 400px; /* Allow larger images */ }

     #page-map h2, #page-map p { padding: 0; } /* Remove mobile padding */

     #leaderboard-table { font-size: 1rem; }

     #leaderboard-table th, #leaderboard-table td { padding: 10px 12px; }

     #leaderboard-table td:first-child { width: 50px; }

    #page-final-puzzle button#btn-submit-final-answer { width: auto; display: inline-block; }

    .cipher-table-container { overflow-x: initial; } /* No horizontal scroll needed */

    .cloze-select { font-size: 1.05rem; } /* Slightly larger cloze text */



    /* Mezistránka na desktopu */

    #page-intermediate-congrats p { font-size: 1.2em; }

    #page-intermediate-congrats button#btn-to-final-puzzle { padding: 15px 35px; }



    /* === Desktopové styly pro certifikát === */

    #certificate {

        padding: 40px 30px 20px 30px;

        margin: 40px auto; /* More vertical margin */

        max-width: 700px; /* Limit width */

        background-size: 150px; /* Larger background pattern */

    }

    .certificate-content {

         padding: 30px;

         margin-bottom: 30px;

    }

    #certificate h2 { font-size: 2.2em; }

    #certificate p { font-size: 1.1rem; }

     #certificate p.congrats-text { font-size: 1.2em; }

    #certificate p.game-title { font-size: 1.6em; }

     #certificate span#cert-name,

     #certificate span#cert-date,

     #certificate span#cert-time { font-size: 1.2em; }

     #certificate span#cert-code { font-size: 1.2em; } /* Větší kód na desktopu */

     #certificate p.final-wish { font-size: 1.2em; }



    .certificate-logos {

        padding-top: 20px;

        margin-top: 30px;

        /* Adjust margins for desktop padding */

        margin-left: -30px;

        margin-right: -30px;

        margin-bottom: -20px;

        padding-left: 20px;

        padding-right: 20px;

        padding-bottom: 15px;

    }



    /* Desktopové velikosti log */

    .certificate-logos img {

        max-height: 55px; /* Default max height on desktop */

    }

    #certificate .certificate-logos img[alt="Logo EU"] {

        max-height: 75px;  /* Larger EU logo on desktop */

        max-width: 45%;

    }

    /* === KONEC Desktop certifikátu === */



    /* Styl pro kredit na desktopu */

    .credits { font-size: 1em; margin-top: 30px; }

}