:root {
    --glavnaBoja: #003da6;
    --pozadinska: rgb(225, 239, 255);
    --footerBoja: #001e51;
  }
body{
    margin:0;
    background-color:var(--pozadinska);
    overflow: hidden;
}

main{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height: 100vh;
    color:var(--glavnaBoja);
}


.jezici-kopirajt{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 50vh;
    width:100vw;
}


.loading{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height:100vh;
}

.crno-za-animaciju{
    position:absolute;
    background-color: var(--pozadinska);
    width:640px;
    height:200px;
    transition: 1500ms ease-in;
}

.logo-slika{
    margin-top:5rem;
    transition: 500ms ease-in;
}

.logo-slika img{
     width:clamp(50vw,75vw,650px);
    aspect-ratio: 4; 
}

.jezici{
    margin:2.5vh auto 3vh;
    display: flex;
    flex-direction: row;
    width:85%;
    align-items: center;
    justify-content: center;
    gap:12.5%;
    transition:3500s ease-in;
    opacity: 0;
}

.aktivan{
    opacity:1;
    transition: opacity 3500ms ease-out;
}

.jezici div{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size:2.8rem;
    color:var(--glavnaBoja);
    font-family: 'Titillium web', sans-serif;
}

.dugme-jezik{
    width:175px;
    height:125px;
    border-radius:2.5%;
    border:2.5px solid black;
    padding:0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 15px;
    box-shadow:3px 3px rgba(0,0,0,0.5);
}

.dugme-jezik:hover{
    opacity:0.75;
}

#srpski-jezik{
    background-image:url("../Slike/zastava-srbije-grb.png");
}

#engleski-jezik{
    background-image:url("../Slike/zastava-uk.png");
}

#ruski-jezik{
    background-image:url("../Slike/zastava-rusije.png");
}

.copyright{
    color: var(--footerBoja);
    font-size:1.25rem;
    margin-bottom: 20px;
}

.pomeri-nagore{
    margin-bottom:30px;
}

.pomeri-nadole{
    margin-top:30px;
}

@media (min-width:955px){
    .logo-loading img{
        width:600px;
        aspect-ratio: 4;
    }
}



/* Tablet i mobilni */
@media (max-width:735px){
    .jezici{
        flex-direction: column;
        gap:50px;
    }

    .logo-slika img{
        width:95vw;
    }

    .dugme-jezik{
        width:250px;
        height:200px;
    }

    .jezici div{
        font-size:2rem;
    }

    body{
        overflow-y: scroll;
    }

    ::-webkit-scrollbar{
        width:10px;
    }
    
    ::-webkit-scrollbar-track{
        margin:100px 0 10px;
    }
    
    ::-webkit-scrollbar-thumb{
        background-color:rgba(255, 2555, 255, 0.2);
        border-radius: 15px;
        height:60px;
    }
}

@media (max-width:550px){
    main{
        justify-content: flex-start;
    }

    .logo-slika{
        margin:7.5rem 0 10rem;
    }
}

@media (max-width:500px){
    /* .dugme-jezik{
        width:50vw;
        height:30vw;
    } */

    .logo-loading img{
        width:70vw;
        aspect-ratio: 4;
    }
    
    .crno-za-animaciju{
        width:80vw;
    }
}