@import url('https://fonts.googleapis.com/css2?family=Agbalumo&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web&display=swap');
body {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    min-height: 100vh; /* Body je minimálně vysoké tak, jako výška okna */
    justify-content: center;
    font-family: 'Bungee', sans-serif;
    background-color: black;
    background-size: cover;
    background-position:center;

    
}

h1 {
    color: rgb(27, 92, 27);
    font-size: 100px;
    

}

button {
    background: linear-gradient(to right, rgb(64, 154, 101) 50%, rgb(173, 152, 75) 50%);
    background-size: 200% 100%;
    transition: background-position 0.3s ease-in-out, box-shadow 0.3s ease-in-out,transform 0.2s ease;
    border: 0px;
    color: white;
    font-size: 1em;
    padding: 0.5em 1.5em;
    border-radius: 1em;
    
    cursor: pointer;
    margin-top: 20px;
    font-family: 'Bungee', sans-serif;
}

button:active {
    transform: translateY(-4px); 
}

button:hover {
    background-position: -100% 0; 
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.7);
}





#indexTlacitka {
    min-height: 250px;
    
}




.aplikace {
    background-color: aliceblue;
    border: solid 2px darkgreen;
    height: 80vh;
    width: 80vw; 
    
}

.textBox {
    background-color: rgb(198, 241, 200);
    border-radius: 1em;
    padding: 40px;
    border-color: aliceblue;
    border-style: dotted;
    color: rgb(16, 73, 48); 
    text-align: center;
    font-family: 'Titillium Web', sans-serif;
    font-size: 1.3em;
}
/* basic.css */

#dalsiText, #dalsiText2 {
    font-family: 'Bungee', sans-serif;
    font-size:20px;
}
#dalsiText:hover, #dalsiText2:hover {
    background-color: rgb(75, 173, 83);
    box-shadow: 0 0 10px rgb(255, 255, 255);

}

.textBox {
    opacity: 0; 
    transition: opacity 1s ease; 
}

.textBox.show {
    opacity: 1; /* When the 'show' class is applied, set opacity to 1 */
}



body {
    position: relative;
    margin: 0;
    padding: 0;
    height: 100vh;
    overflow: hidden;
}

body::before,
body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}






