.special-elite-regular {
  font-family: "Special Elite", system-ui;
  font-weight: 400;
  font-style: normal;
}


html {
    font-family: "Special Elite", sans-serif;
    font-style: normal;
    color: none;
    letter-spacing: 1px;
}

body {
    padding: 0;
    margin: 0;
    background-color: #0a1220;
    
}

header {
    min-height: 50px;
    max-height: auto;
    width: 100vw;
    background-color: #0d659d;
    background-image: url(img/damagefilm.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: multiply;
    position: fixed;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    top: 0px;
    margin: 0px;
    padding: 0px;
    z-index: 50;
}


header h1 {
    font-size: 50px;
    text-decoration: none;
}

header a{
    width: auto;
    display: block;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.flex_main_box {
    display: flex;
    position: relative;
    flex-direction: column;
    height: auto;
    gap: 2.5rem;
    align-items: center;
    margin: 0;
    z-index: 0;
    padding-top: 10%;
    padding-left: 20%;
    padding-right: 20%;
    padding-bottom: 2%;
    background-color: #0a1220;
    background-image: url(img/bg2.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: multiply;

}

.flex_info_box {
    display: flex;
    flex-direction: row;
    height: auto;
    width: 100%;
    align-items: center;
    background-color: transparent;
    z-index: 1;
    text-shadow: 1px 1px 2px #192e41;
    gap: 0rem;


}

.flex_info_box_left {
    background-color: none;
    position: relative;
    height: 20rem;
    width: 35%;
    z-index: 2;
    padding: 0;
    margin: 0;  
    border-top-left-radius: 2.5rem;
    border-bottom-left-radius: 2.5rem;
  

}

.flex_info_box_right {
    background-color:  #192e41;
    background-image: url(img/damagefilm.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-blend-mode:soft-light;
    min-height: 20rem;
    max-height: auto;
    width: 65%;
    z-index: 3;
    padding: 0;
    margin: 0;
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    text-align: center;
    box-shadow: -150px 0px 150px -25px #0a1220;
}

.flex_info_box_right:hover {
    background-color: #594421;
    box-shadow: -100px 0px 100px -50px #4b3b32;
   
}

#profil {
    background-image: url("img/L1000620.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;


}

#vfx {
    background-image: url("https://m.media-amazon.com/images/M/MV5BZWJjMjdhNGEtZjEyMi00OTg2LTllMzQtN2JlZWNjYzI4YzFhXkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#vfx_zaklinac {    
    background-image: url("https://m.media-amazon.com/images/M/MV5BNzgzZTU2MGYtNjBjMS00NGM4LTk2MzQtOTY5YTNlOTFjZTM1XkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}



#vfx_sisu {    
    background-image: url("https://m.media-amazon.com/images/M/MV5BYjAxN2RmYjktMDE2OS00MWM5LThlZTQtZDY4YzAxMWQyZWY4XkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#vfx_samaritan {    
    background-image: url("https://m.media-amazon.com/images/M/MV5BZGUwMmJjYzgtZDk0Yy00ZDY4LThjMjctYTAxOTEyYjg0MTQ0XkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#vfx_crow {    
    background-image: url("https://m.media-amazon.com/images/M/MV5BNzgzYmQ0OTYtMjMwMS00ZGI2LWE5MjMtMWViZjkwMGY4NGZmXkEyXkFqcGc@._V1_FMjpg_UX1000_.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    
}

#analogfoto {
    background-image: url("img/IMG_3632.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#temnakomora {
    background-image: url("analog/instagram/logo2b.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#temnakomora2 {
    background-image: url("img/IMG_3668.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#cesky {
    background-image: url("img/Flag_of_the_Czech_Republic.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#anglicky {
    background-image: url("img/Flag_of_the_United_Kingdom_\(3-5\).svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#nemecky {
    background-image: url("img/Flag_of_Germany.svg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#finsky {
    background-image: url("img/Flag_of_Finland.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#rusky {
    background-image: url("img/Flag_of_Russia.svg.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

h1, h2, h3, p {
    padding-left: 3rem;
    color: #bbc8de;
}


h1 {
    text-decoration: underline solid 1px;
    text-underline-offset: 5px;
}

p {
    margin: 1rem;
    text-shadow: none;
    line-height: 25px;
}

a {
    text-decoration: none;
}

footer {
    height: 25px;
    width: 100%;
    background-color: none;
    color: white;
    justify-content: center;
    z-index: 100;
    position: sticky;
    margin-bottom: 5px;
}

footer p {
    font-size: 10px;
    text-align: center;
}




@media screen and (max-width: 1500px) {
    .flex_main_box {
        padding-left: 5%;
        padding-right: 5%;
        padding-top: 15%;
    }

    header a h1 {
        font-size: 35px;
    }
    
}

@media screen and (max-width: 1000px) {
    
    .flex_main_box {
        padding-top: 25%;
    }
    .flex_info_box {
        flex-direction: column;
        padding: 0;
    }
    .flex_info_box_right {
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        padding: 0;
    }

    .flex_info_box_right:hover {
        box-shadow: none;
    }

    .flex_info_box_left {
        width: 100%;
        height: 150px;
        border-radius: 0;
    }

    h1, h2, h3, p {
        padding: 0;
    }

    header a h1 {
        font-size: 17px;
    }
   
    
}