/* CD FEDRA font */



@font-face {

    font-family: 'CD_Fedra';

    src: url('../fonts/CD_Fedra_Pro_Book.woff2') format('woff2');

    font-weight: 100;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'CD_Fedra';

    src: url('../fonts/CD_Fedra_Pro_Medium.woff2') format('woff2');

    font-weight: 450;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'CD_Fedra';

    src: url('../fonts/CD_Fedra_Pro_Bold.woff2') format('woff2');

    font-weight: 900;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'D-DIN';

    src: url('../fonts/D-DIN.woff2') format('woff2');

    font-weight: 100;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'D-DIN';

    src: url('../fonts/D-DIN_Bold.woff2') format('woff2');

    font-weight: 450;

    font-style: normal;

    font-display: swap;

}



/* Samotné tělo */



body{

    min-height: 100vh;

    font-family: "CD_Fedra", sans-serif;

    margin: 0;

    background-color: #ECECEC;

}



/* PDF */



.pdf{

    height: 90vh;

    width: 85vw;

    margin-left: 7.5vw;

}



/* Scrollbar */



* {

    scrollbar-width: thin;

    scrollbar-color: #009FE2 #ECECEC;

}



::-webkit-scrollbar {

    width: 10px;

    background-color: #ECECEC;

}



::-webkit-scrollbar-thumb {

    background: #009FE2;

}



::-webkit-scrollbar-thumb:hover {

    background: #00295E;

}



/* Čáry máry */



.cara_vodorovna{

    height: 4px;

    width: 85vw;

    background-color: #009FE2;

    border-radius: 2px;

    margin: auto;

    margin-bottom: 8px;

    margin-top: 8px;

}



.cara_kompletni{

    height: 1rem;

    width: 100%;

    background-color: #009FE2;

    border-radius: 2px;

}



/* Texty */



.velkej_text{

    color: #00295E;

    font-weight: 900;

    text-transform: uppercase;

    text-align: center;

    font-size: 2rem;

}



.odkaz{

    color: #00295E;

    font-weight: 900;

    text-transform: uppercase;

    text-decoration: underline;

    text-align: center;

    font-size: 1.25rem;

    cursor: pointer;

}



.odkaz:hover{

    color: #009FE2;

}



.mensi_text{

    color: #00295E;

    font-weight: 450;

    font-size: 1.5rem;

}



.mensi_text_zapati{

    color: #FFFFFF;

    font-weight: 450;

    font-size: 1.5rem;

}



.adresa{

    color: #FFFFFF;

    font-size: 1rem;

}



.proklik{

    color: #FFFFFF;

    font-size: 1rem;

    cursor: pointer;

}



.proklik:hover{

    color: #009FE2;

}



.sloupec_textu_formular{

    width: 40vw;

}







.tlustsi_text{

    font-weight: 900;

}



/* Obsah */



.kontejner{

    display: flex;

    flex-direction: column;

    justify-content: space-around;

    align-items: center;

    gap: 2vh;

    padding: 2vh;

}



.radek_obsahu, .radek_obsahu_inverzni, .radek_obsahu_qr{

    display: flex;

    flex-direction: row;

    align-items: center;

}



.radek_obsahu, .radek_obsahu_inverzni{

    justify-content: space-around;

    gap: 2vh;

    width: 90vw;

}



.radek_obsahu_qr{

    justify-content: center;

    gap: 5vw;

}



.fotka_text, .fotka_text_qr{

    max-width: 60vw;

    max-height: 60vh;

}



.fotka_text_qr{

    cursor: pointer;

}



.text, .text_historie{

    color: #00295E;

    text-align: justify;

    font-size: 1.1rem;

    font-weight: 100;

}



.text_centrovany{

    color: #00295E;

    text-align: center;

    font-size: 1.1rem;

    font-weight: 100;

    width: 40vw;

}



.fotka_kontakt{

    width: 40vh;

    height: 40vh;

}



.tema_historie{

    color: #00295E;

    text-align: center;

    font-size: 1.5rem;

}



.text_kontakty{

    color: #00295E;

    text-align: center;

    font-size: 1.4rem;

    font-weight: 100;

}



.text_specializace_kontakty{

    color: #00295E;

    text-align: center;

    font-size: 1.75rem;

    font-weight: 450;

}



/* Timeline */



.caso_linka{

    position: relative;

    padding-left: 4vw;

    width: 30vw;

}



.caso_linka_bod{

    position: relative;

    margin-bottom: 4vh;

}



.caso_linka_bod::before{

    content: "";

    position: absolute;

    left: calc(-4vw - 2px);

    top: 0;

    width: 4px;

    height: 10px;

    background: #009FE2;

}



.caso_linka_bod::after{

    content: "";

    position: absolute;

    left: calc(-4vw - 2px);

    top: 36px;

    bottom: -4vh;

    width: 4px;

    background: #009FE2;

}



.caso_linka_bod:first-child::before, .caso_linka_bod:last-child::after{

    display: none;

}



.bod{

    position: absolute;

    left: calc(-4vw - 13px);

    top: 10px;



    width: 20px;

    height: 20px;



    background: #00295E;

    border-radius: 50%;

    border: 3px solid #fff;

    box-shadow: 0 0 0 2px #009FE2;



    z-index: 2;

}



.cas{

    font-weight: bold;

    color: #00295E;

    margin-bottom: 5px;

    font-size: 1.2rem;

}



.udalost_nadpis{

    margin: 0 0 5px;

    font-weight: bold;

    font-size: 1.5rem;

    color: #00295E;

}



.udalost_popis{

    margin: 0;

    font-size: 1.2rem;

    color: #00295E;

}



/* Partneři a organizátoři */



.kontejner_partner{

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    justify-content: space-evenly;

    align-items: center;

    gap: 4vw;

    padding: 1rem;

    margin: 0rem 2rem 2rem 2rem;

}



.hlavni_partner{

    max-width: 400px;

    cursor: pointer;

}



.hlavni_partner img {

    width: 100%;

}



.partner{

    flex: 1 1 clamp(100%, 50%, 25%);

    max-width: 200px; 

    cursor: pointer;

}



.partner img {

    width: 100%;

}



.kontejner_organizatori{

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    justify-content: space-evenly;

    align-items: center;

    gap: 4vw;

    padding: 1rem;

}



.organizator{

    flex: 1 1 clamp(100%, 50%, 25%);

    max-width: 200px; 

    cursor: pointer;

}



.organizator img {

    width: 100%;

}



/* Zápatí */



.flex_zapati{

    background-color: #00295E;

    display: flex;

    flex-direction: row;

    justify-content: space-evenly;

    flex-wrap: wrap;

    align-items: center;

    padding: 20px;

}



/* LOGO */



.logo{

    background-image: url(../images/icon/logo.png);

    background-size: cover;

    aspect-ratio: 1 / 1;

    height: 10vh;

}



/*Navigace*/



.navigace{

    height: 2.5rem;

    padding: 15px;

    position: sticky;

    top: 0;

    left: 0;

    background-color: #00295E;

    margin-bottom: 0;

    z-index: 3;

}



.flex_pro_navigaci{

    line-height: 2.5rem;

    display: flex;

    flex-direction: row;

    flex-wrap: wrap;

    justify-content: right;

    align-items: center;

    gap: 30px;

    margin-right: calc(25px + 2.5rem);

    margin-left: calc(25px + 2.5rem);

}



.tlacitko, .tlacitko_aktivni{

    cursor: pointer;

    font-size: 1.5rem;

    font-weight: 100;

    user-select: none;

    color: #FFFFFF;

}



.tlacitko{

    opacity: 0.5;

}



.tlacitko_aktivni{

    opacity: 1;

}



.domu, .domu_aktivni{

    position: absolute;

    color: #FFFFFF;

    opacity: 0.5;

    font-size: 2.5rem;

    cursor: pointer;

    user-select: none;

    top: 1rem;

    right: 1.5rem;

}



.menu{

    display: none;

}



.nic{

    display: none;

}



.jazyk, .jazyk_aktivni{

    font-weight: 100;

    position: absolute;

    color: #FFFFFF;

    opacity: 0.5;

    font-size: 1.5rem;

    cursor: pointer;

    user-select: none;

}



.jazyk_1{

    top: 1.5rem;

    left: 1.5rem;

}



.jazyk_2{

    top: 1.5rem;

    left: 4rem;

}



.domu:hover, .domu_aktivni, .krizek_menu:hover, .menu:hover, .tlacitko_aktivni, .tlacitko:hover, .jazyk:hover, .jazyk_aktivni{

    opacity: 1;

}



/* Formulář */



.formular{

    width: 80vw;

    padding: 0;

}



.formular iframe {

    width: 100%;

    height: 3150px;

    border: none;

}



/* Banner */



.banner_cz, .banner_en{

    width: 100%;

    aspect-ratio: 100/10;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    image-rendering: smooth;

}



.banner_cz{

    background-image: url("../images/banner/pc/cz.png");

}



.banner_en{

    background-image: url("../images/banner/pc/en.png");

}



.cara_banner{

    height: 0.5rem;

    width: 100%;

    background-color: #FFFFFF;

    border-radius: 2px;

}



/* Pragotron */



.pragotron{

    image-rendering: smooth;

    width: 20%;

    margin: 1rem;

}





/* Galerie */



.galerie{

    position: relative;

    width: 35vw;

}



.galerie_fotka{

    width: 100%;

    height: auto;

    display: block;

    z-index: 1;

}



.tlacitko_preskakovaci_zpet, .tlacitko_preskakovaci_dopredu{

    position: absolute;

    font-size: 2rem;

    width: 3rem;

    height: 100%;

    cursor: pointer;

    color: #066F8A;

    background-color: rgba(0, 0, 0, 0.50);

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 2;

    user-select: none;

    top: 0;

}



.tlacitko_preskakovaci_dopredu{

    right: 0;

}



.tlacitko_preskakovaci_zpet{

    left: 0;

}



.tlacitko_preskakovaci_zpet:hover, .tlacitko_preskakovaci_dopredu:hover{

    color: #0995b9;

    background-color: rgba(0, 0, 0, 0.90);

}



/* Mobil */



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

    .radek_obsahu, .radek_obsahu_qr{

    flex-direction: column;

    }



    .jazyk_1_mobil{

        top: 5rem;

        left: 1.5rem;

    }



    .jazyk_2_mobil{

        top: 5rem;

        left: 4rem;

    }



    .radek_obsahu_inverzni{

    flex-direction: column-reverse;

    }



    .formular{

        width: 90vw;

    }



    .formular iframe {

    height: 4000px;

    }



    .galerie{

        width: 90vw;

    }



    .caso_linka{

        margin-left: 4vw;

        width: 80vw;

    }



    .fotka_text, .fotka_text_qr{

    max-width: 90vw;

    max-height: 90vh;

    }   



    .fotka_kontakt{

    width: 90vw;

    height: 90vw;

    }



    .text_historie, .text, .text_centrovany{

        width: 90vw;

    }



    .flex_zapati{

        flex-direction: column;

    }



    .sloupec_textu{

        text-align: center;

    }



    .sloupec_textu_formular{

        width: 90vw;

    }



    .flex_pro_navigaci{

        display: none;

    }



    .menu{

        display: block;

        position: absolute;

        color: #066F8A;

        opacity: 0.5;

        font-size: 2.5rem;

        cursor: pointer;

        user-select: none;

        top: 1rem;

        right: 1.5rem;

    }



    .domu, .domu_aktivni{

        right: 5.5rem;

    }



    .menu:hover{

        opacity: 1;

    }

    

    .menu_viditelne{

        display: block;

        position: fixed;

        top: 0;

        left: 0;

    }



    .flex_pro_menu{

        display: flex;

        flex-direction: column;

        justify-content: center;

        align-items: flex-start;

        gap: 20px;

        z-index: 21;

        background-color: #00295E;

        height: 100vh;

        min-width: 45vw;

        max-width: 80vw;

        position: fixed;

        padding-right: 2.5rem;

    }



        .galerie{

        width: 90vw;

    }



    .tlacitko{

        margin-left: 2.5rem;

    }



    .tlacitko_aktivni{

        margin-left: 2.5rem;

    }



    .flex_pro_menu{

        animation: menu-animace-otevreni 0.5s;

    }



    .flex_pro_menu_zavirani{

        animation: menu-animace-zavreni 0.5s;

    }



    .zavirac_menu{

        position: sticky;

        top: 0;

        bottom: 0;

        z-index: 20;

        background-color: #000;

        opacity: 0.5;

        height: 100vh;

        width: 100vw;

    }



    .zavirac_menu{

        animation: to_tmavy_vznikne 0.5s;

    }



    .zavirac_menu_zavirani{

        animation: to_tmavy_zanikne 0.5s;

    }



    .krizek_menu{

        position: absolute;

        color: #066F8A;

        opacity: 0.5;

        font-size: 2.5rem;

        cursor: pointer;

        user-select: none;

        top: 1.5rem;

        left: 1.5rem;

    }



    .krizek_menu:hover{

        opacity: 1;

    }



    .menu_viditelne{

        position: fixed;

        top: 0;

        left: 0;

        overflow-y: scroll;

        z-index: 19;

    }



    .banner_cz, .banner_en{

    aspect-ratio: 100/54;

    }



    .banner_cz{

        background-image: url("../images/banner/mobil/cz.png");

    }



    .banner_en{

        background-image: url("../images/banner/mobil/en.png");

    }



    .pragotron{

        width: 60%;

    }

}



/* Animace */



.odkaz, .odkaz:hover, .proklik, .proklik:hover, .domu, .domu:hover, .domu_aktivni, .tlacitko, .tlacitko:hover, .tlacitko:hover, .menu, .menu:hover, .krizek_menu, .krizek_menu:hover, .galerie_fotka, .tlacitko_preskakovaci_zpet:hover, .tlacitko_preskakovaci_dopredu:hover, .tlacitko_preskakovaci_zpet, .tlacitko_preskakovaci_dopredu, .jazyk, .jazyk_aktivni, .jazyk:hover{

    transition: 0.2s;

}



@keyframes menu-animace-otevreni{

    0% {

        left: -100%;

    }

    100% {

        left: 0;

    }

}



@keyframes to_tmavy_vznikne{

    0% {

        opacity: 0;

    }

    100% {

        opacity: 0.5;

    }

}



@keyframes menu-animace-zavreni{

    0% {

        left: 0;

    }

    100% {

        left: -100%;

    }

}



@keyframes to_tmavy_zanikne{

    0% {

        opacity: 0.5;

    }

    100% {

        opacity: 0;

    }

}



/* Barvy

175% 022E3A

150% 066F8A

100% 0995b9

50% 84CAE0

25% C2E4EF

10% E6F4F8

5% F3FAFC

*/