body, html{
    background-image: url('/img/odzadje.jpg');
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
    background-attachment: fixed;
    
    scroll-behavior: smooth;
    max-width: 100%;
    overflow-x: hidden;
    margin: 0;
}

a:hover, a:visited, a:link, a:active {
    text-decoration: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

@media screen and (min-width: 992px){
    a{
        font-size: 1em;
    }   
}

@media screen and (max-width: 991px){
    a{
        font-size: 0.75em;
        font-weight: bold;
    }
}

@media screen and (max-width: 768px){
    a{
        font-size: 0.7em;
    }
    h5{
        font-size: 0.1em;
    }
}

input{
    background-color: rgb(255, 0, 0, 0.8);
    border: none;
    outline: none;
    color: white;
    border-radius: 5px;
    width: 90%;
}

input:focus{
    outline: none;
}

.bgWhite90{
    background-color: rgb(255, 255, 255, 0.9);
}

.gumb{
    background-color: rgb(0, 0, 0, 0.75);
    transition: 0.3s;
}

.gumb:hover{
    background-color: rgb(255, 0, 0, 0.8);
}

.void{
    height: 100vh;
    background-image: linear-gradient(rgb(0, 0, 0, 0), rgb(0, 0, 0, 0.9));
}

.voidSlika{
    background-size: contain;
    background-repeat: no-repeat;
    height: 20%;
    width: 10%;
}

@media screen and (min-width: 992px){
    .void .voidLogo{
        width: 500px;
    }
}

@media screen and (max-width: 991px){
    .void .voidLogo{
        width: 300px;
    }
}

.nextStop:hover, .booknow:hover {transform: scale(1.02);}

.galerija {
    columns: 5 200px;
    column-gap: 1.5rem;
    width: 90%;
    margin: 0 auto;
}
.galerija div {
    width: 150px;
    margin: 0 1.5rem 1.5rem 0;
    display: inline-block;
    width: 100%;
    border: solid 2px black;
    padding: 5px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    transition: all 0.25s ease-in-out;
}
.galerija div:hover img {
    filter: grayscale(0);
}
.galerija div:hover {
    border-color: rgb(255, 0, 0, 0.8);
}
.galerija img {
    width: 100%;
    filter: grayscale(100%);
    border-radius: 5px;
    transition: all 0.25s ease-in-out;
}
.galerija p {
    margin: 5px 0;
    padding: 0;
    text-align: center;
    font-style: italic;
}

.press{
    position:fixed;
        top:2rem;
        left:2rem;
        z-index: 10
}

@media screen and (min-width: 992px){
    .press{
        position:fixed;
        top:2rem;
        left:2rem;
        z-index: 10
    }  
}

@media screen and (max-width: 991px){
    .press{
        position:fixed;
        top:2rem;
        left:2rem;
        z-index: 10
    }
}

@media screen and (max-width: 768px){
    .press{
        position:fixed;
        top:2rem;
        left:2rem;
        z-index: 10
    }
}

.senca{
    box-shadow:  0 0 0 0 rgba(0,0,0,0.15),0 0 0 0 rgba(0,0,0,0.15),0 0 0 0 rgba(0,0,0,0.15), 0 8px 8px 8px rgba(0,0,0,0.3);
}

.sencaNoter{
    box-shadow:  0 1px 1px 1px rgba(0,0,0,0.15),0 2px 2px 2px rgba(0,0,0,0.15),0 4px 4px 4px rgba(0,0,0,0.15),0 8px 8px 8px rgba(0,0,0,0.15) inset;
}

.fa-soundcloud{
    opacity: 75%;
}
.fa-soundcloud:hover{
    opacity: 100%;
}
.fa-instagram{
    opacity: 75%;
}
.fa-instagram:hover{
    opacity: 100%;
}
.fa-youtube{
    opacity: 75%;
}
.fa-youtube:hover{
    opacity: 100%;
}
.fa-globe{
    opacity: 75%;
}
.fa-globe:hover{
    opacity: 100%;
}
.fa-envelope{
    opacity: 75%;
}
.fa-envelope:hover{
    opacity: 100%;
}