body {
    text-align: center;
    font-size: large;
    min-height: 100%;
    font-family: 'Franklin Gothic Medium';
    background-image:     url("/static/obrazky/bar_1.jpg");
    background-color:       #000002;
    background-repeat:    no-repeat;
    background-position: center;
    background-size:        cover;
    background-image:     linear-gradient (white, black);

    /* background-image: url("obrazky\bar.png");
    background-color: #cccccc; */
  }

  h1, h2 {
    color: rgb(255, 248, 238);
    text-shadow: 2px 2px 1px #201f1f;
}

.napoj{
    text-align: left;
    font-size: 24px ;
    color: aliceblue;
    background-color: rgb(57, 53, 48);
    word-wrap:initial;
}
.avatar{
    float: left;
    width: 300px;
    height:max-content;
    padding-left: 20px;
    padding-right: 2px;
}
.avatar:hover {
    border-radius: 50%;
    transition: 1s;
    size-adjust: 200% ;
}
body > header {
    height: 140px;
    /* width: 100%; */
    color: white;
    display: flex;
    justify-content: flex-start;
    font-size: 65px;
    align-items:center ;
    
    /* text-align: left; */
}



.kostka {
    display: block;
    width: 400px;
    height: auto;
    margin-top: 50px; /* Posunutí o 50px od horního okraje */
    margin-left: auto; /* Zarovnání na střed vodorovně */
    margin-right: auto; /* Zarovnání na střed vodorovně */
    padding: 0%;
}

    
.tlacitko{
    color: antiquewhite;
    background: #6e228a;
    font-size: 0.9em;
    text-decoration: none;
    text-transform: uppercase;
    padding: 12px 25px;
    border-radius: 25px;
    /* pokud chci zakulatit pouze některé rohy, nastaví se hodnota 4x */
}
.tlacitko:hover {
    color: rgb(45, 43, 42);
    background: #c59bd5;
    font-size: 0.9em;
    text-decoration: none;
    text-transform: uppercase;
    padding: 12px 25px;
    border-radius: 25px;
}

p {
    word-wrap: break-word;
}