:root{
    --text-color:rgba(255, 255, 255, 0.767);
    --background-color:rgb(19, 19, 19);
}


html{
    overflow-x: hidden;
}

body{
    background-color: var(--background-color);
    color: var(--text-color);
}

#naslov{
    margin-top:15vh;
    text-align:center;
    background-color: transparent;
}

#naslov h1{
    font-size:100px;
}

#login-form{
    background-color: transparent;
    border: 5px solid var(--text-color);
    border-radius:40px;
    padding:50px;
}

#login-form h6{
    text-align: center;
}

.input{
    border-radius:40px;
    border: 3px solid var(--text-color);
    background:var(--background-color);
    outline:none;
    transition-duration: 0.7s;
    font-weight: 700;
    color:var(--text-color);
}

.input:hover{
    border: 3px solid var(--background-color);
    background:var(--text-color);
    transition-duration: 0.7s;
}

.input:focus{
    border: 3px solid var(--background-color);
    background:var(--text-color);
    color:var(--background-color);
    font-weight: 700;
    transition-duration: 0.7s;
    padding:10px;
}

.button{
    background:var(--background-color);
    border:3px solid var(--text-color);
    border-radius:40px;
    font-weight: 700;
    color:var(--text-color);
    transition-duration: 0.7s;
}



.button:hover{
    border: 3px solid var(--background-color);
    background:var(--text-color);
    color:var(--background-color);
    transition-duration: 0.7s;
}

h1{
    font-weight: 700;
}

h5{
    font-weight: 700;
}


h6{
    font-weight: 700;
}

#dark-mode{
    height:5vh;
    width:auto;
    border:3px solid var(--text-color);
    color:var(--text-color);
    background-color:var(--background-color);
    font-weight:700;
    transition-duration: 0.7s;
    border-radius:10px;
    margin: 10px 0px 0px 10px;
}

#dark-mode:hover{
    border:3px solid var(--background-color);
    color:var(--background-color);
    background-color:var(--text-color);
    transition-duration: 0.7s;
}