/*fonty*/
@import url('https://fonts.cdnfonts.com/css/minecrafter');

*{
        margin: 0;
        padding: 0%;
        background-color: black;
    }

@font-face {
    font-family: 'Minecraftia';
    src: url('./assets/img/minecraft/Minecraftia.ttf') format('truetype');
}

.minecrafter{
    font-family: 'minecrafter', sans-serif;
}

.minecraftia{
    font-family: "Minecraftia" !important;
}

.minecraftia *{
    font-family: "Minecraftia" !important;
}

/*header*/
.triangle {
    position: absolute;
   width: 50px;
   height: 50px;
   background-color: transparent;
}
    .rect{
        width: 100%;
        height: 150px;
    }

    .navNahled{
        width: 14.05%;
        object-fit: cover;
        background-color: rgb(255, 255, 255);
    }

    h1{
        font-family: "UnifrakturMaguntia", cursive;
        color: aliceblue;
        font-size: 100px;
        margin-left: 3%;
        margin-top: 6%;
    }

    h2{
        font-family: "IM Fell English", serif;
        font-weight: 400;
        font-style: normal;
        font-size: 30px;
        color: aliceblue;
        margin: 3%;
    }  


    .flexOdkaz{
        display: flex;
        justify-content: center;
        align-items: center;
        margin-right: 75%;
    }

    .textOdkaz{
        position: absolute;
        text-decoration: none;
    }

    .odkaz{
        width: 80%;
    }

    .avatar{
        width: 18%;
        background-color: rgb(255, 255, 255);
        margin-top: 0.5%;
    }

.flexAvatar{
        display: flex;
        flex-direction: row;
        gap: 0.5%;
        column-gap: 0.5%;
        justify-content: center;
        flex-wrap: wrap;
        margin-top: 0.5%;
}

/*zoom prvky*/
.zoom-container {
    position:fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(10px);
    z-index: 120;
}

.zoomed-image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.zoomed-image > img {
    width: 95%;
    max-width: 95%;
    max-height: 80vh;
    height: auto;
}

/*responzivita-tablet*/
@media only screen and (min-width: 700px) and (max-width: 1000px){
    .navNahled{
    width: 19.58%;
    }
    .textOdkaz{
        font-size: 20px;
    }
    .visible{
        display: none;
    }
    h1{
        font-size: 90px;
    }
    h2{
        font-size: 25px;
    } 
}

/*responzicita mobil*/
@media only screen and (min-width: 200px) and (max-width: 700px){
    .navNahled{
        width: 30%;
    }
    .textOdkaz{
        font-size: 20px;
        margin-left: 25%;
        width: 120px;
    }
    .visible{
        display: none;
    }
    .visible1{
        display: none;
    }
    h1{
        font-size: 70px;
    }
    h2{
        font-size: 20px;
    } 
    .odkaz{
        width: 170%;
        margin-left: 100%;
    }
    .avatar{
        width: 25%;
        background-color: rgb(255, 255, 255);
        margin-top: 1%;
    }
    .flexAvatar{
        display: flex;
        flex-direction: row;
        gap: 1%;
        margin-top: 0.5%;
    }
}