body{
    margin: 0rem;
    font-family: "Outfit", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;

    background-color: white;
    color: #792610;
}

nav{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;

    background-color: #f0dad1;
    padding: 1rem;

    position: sticky;
    top: 0rem;
    z-index: 2;
}

nav a{
    text-decoration: none;
    color: #792610;
    font-size: 1.5rem;
}

nav h1{
    text-decoration: none;
    color: #792610;
    font-size: 1.5rem;
}

nav a:hover{
    transform: scale(1.05);
}

button:hover{
    transform: scale(1.05);
}

.INFO{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 1rem;
    background-color: #fae9e3;
}

#vidi_jos{
    text-decoration: none;
}

.HERO_DIV{
    width: 100vw;
    height: 70vh;
    background: url("HERO.png");

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#ime_restorana{
    color: white;
    font-size: 10em;

    font-family: "Niconne", cursive;
    font-weight: 400;
    font-style: normal;
}

.DUGMAD_HERO{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 1rem;
}

.DUGMAD_HERO a{
    text-decoration: none;
    color: white;
    font-size: 1.2rem;
    border: 0.1rem solid white;
    padding: 1rem;
}

.DUGMAD_HERO a:hover{
    opacity: 80%;
}

.IME_SEKCIJE{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.IME_SEKCIJE_ROD{
    display: flex;
    justify-content: left;
    align-items: center;
    margin-left: 2rem;
}

.OPIS_SEKCIJE{
    font-size: 1.5rem;
    margin-left: 2rem;
    margin-right: 2rem;

    color: #792610;
}

/*GPT*/
.ime_sekcije::after {
    content: "";
    display: block;
    width: 12em;               
    height: 1px;             
    background-color: #792610;
    margin: 10px auto 0;       
    border-radius: 2px;        
}

.ime_sekcije{
    color: #792610;
    font-size: 2.8rem;
}

.PRICA{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 2rem;
    margin-left: 2rem;
    margin-right: 2rem;
}

.PRICA p{
    font-size: 1.3rem;
    text-align: justify;
    color: #792610;
}

.PRICA iframe{
    height: 20rem;
    border-radius: 1rem;
    box-shadow: 2px 2px 15px black;
}

.POD_SEKCIJA{
    margin-left: 2rem;
    color: #792610;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.POD_SEKCIJA h3{
    font-size: 2.5rem;
    /*
    font-family: "Niconne", cursive;
    font-weight: 400;
    font-style: normal;
    */
}

.POD_SEKCIJA p{
    font-size: 1.5rem;
    margin-right: 2rem;
    margin-left: 2rem;

    /*
    font-family: "Niconne", cursive;
    font-weight: 400;
    font-style: normal;
    */

    text-align: center;
}

/*MENI*/
/********************************************/
/********************************************/

.PONUDE{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
    margin: 2rem;
}

.PONUDA{
    background-color: #693b2f1a;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;

    color: #792610;

    border: 0.1rem solid #792610;
    border-radius: 1rem;
    height: 26rem;
}

.PONUDA:hover{
    transform: scale(1.01);
    box-shadow: 2px 2px 15px black;
}

.PONUDA h2{
    text-align: center;
    width: 10rem;
    font-size: 1.2rem;
}

.PONUDA h3{
    font-size: 1.5rem;
}

.PONUDA img{
    width: 15rem;
    height: 10rem;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    border-bottom: 0.1rem solid #792610;
}

.PONUDA p{
    font-size: 0.8rem;
    width: 12rem;
    text-align: center;
}

.PONUDA button{
    text-decoration: none;
    background-color: black;
    padding: 0.8rem;
    border-radius: 1rem;
    color: white;
    font-size: 1rem;
    border: none;
}

.PONUDA button:active{
    background-color: rgb(158, 158, 158);
}

.PONUDA a:hover{
    transform: scale(1.05);
}

.MENI_BOJA{
    background-color: #ffdfdf3f;;
}

/*KETERING*/
/********************************************/
/********************************************/

.STAVKA{
    display: flex;
    justify-content: start;
    align-items: center;
    flex-direction: column;

    padding: 1rem;
    height: 18rem;
    width: 16rem;

    border-radius: 1rem;
    background-color: #693b2f1a;

    color: white;
    backdrop-filter: blur(25px);
}

.STAVKA p{
    font-size: 0.8rem;
}

.PONUDE_KET{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
}

.KETERING_POZ{
    background: url("KETERING_POZ.png");
    background-size: cover;
}

.PRIMERI{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 2rem;
}

.PRIMERI img{
    width: 15rem;
    height: 10rem;
}

#book_ket{
    text-decoration: none;
    background-color: black;
    padding: 1rem;
    border-radius: 1rem;
    color: white;
}

.IZRACUNAJ{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1rem;
}

.IZRACUNAJ input{
    padding: 1rem;
    width: 15rem;
    height: 1rem;
    border-radius: 0.5rem;
    border: 0.1rem solid #79271034;
    background-color: white;
}

#slavlje{
    padding: 1rem;
    width: 17.2rem;
    border-radius: 0.5rem;
    border: 0.1rem solid #79271034;
}

.IZRACUNAJ button{
    padding: 1rem;
    border-radius: 1rem;
    border: 0.1rem solid #79271034;
}

.IZRACUNAJ button:hover{
    transform: scale(1.05);
}

#book_ket{
    text-decoration: none;
    background-color: black;
    padding: 0.8rem;
    border-radius: 1rem;
    color: white;
}

#book_ket:hover{
    transform: scale(1.05);
}

/*GALERIJA*/
/********************************************/
/********************************************/

.GALERIJA{
    margin-left: 2rem;
    margin-right: 2rem;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;

    gap: 1.5rem;
}

.GALERIJA div{
    background-size: cover;
    width: 15rem;
    height: 10rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 1rem;

    width: 15rem;
    height: 10rem;
}

.GALERIJA div h1{
    display: none;
}

.GALERIJA div:hover{
    transform: scale(1.05);
    box-shadow: 2px 2px 15px black;
}

.GALERIJA div:hover h1{
    display: inline;
}

/*Posebe slike*/
/********************************************/
/********************************************/

.SLIKA{
    background: url("GALERIJA/2.jpg");
}

.SLIKA2{
    background: url("GALERIJA/3.jpg");
}

.SLIKA3{
    background: url("GALERIJA/4.jpg");
}

.SLIKA4{
    background: url("GALERIJA/5.jpg");
}

.SLIKA5{
    background: url("GALERIJA/6.jpg");
}

.SLIKA6{
    background: url("GALERIJA/7.jpg");
}

.SLIKA7{
    background: url("GALERIJA/8.jpg");
}

/*NAGRADE*/
/********************************************/
/********************************************/

.OPIS_NAGRADE_DIV{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    gap: 2rem;
}

.NAGRADA{
    width: 10rem;
    padding: 1rem;
    height: 10rem;
    border: 0.1rem solid #792610;
    border-radius: 1rem;
    background-color: #693b2f1a;
}

.NAGRADA h2{
    text-align: center;
}

.UNOS_NAGRADA{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 1rem;
}

.UNOS_NAGRADA button{
    padding: 1rem;
    border-radius: 1rem;
    border: 0.1rem solid #79271034;
}

.UNOS_NAGRADA input{
    padding: 1rem;
    border-radius: 1rem;
    border: 0.1rem solid #79271034;
    width: 8rem;
}

#ispis_nagrade{
    text-align: center;
    margin-left: 6rem;
    margin-right: 6rem;
}

/*REZERVACIJE*/
/********************************************/
/********************************************/

.BOOK_DIV{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1rem;
}

form{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    flex-direction: column;
}

form input{
    padding: 1rem;
    width: 25rem;
    height: 1rem;
    border-radius: 0.5rem;
    border: 0.1rem solid #79271034;
    background-color: white;
}

.BOOK_DIV button{
    padding: 1rem;
    border-radius: 1rem;
    border: 0.1rem solid #79271034;
}

.BOOK_DIV button:active{
    padding: 1rem;
    border-radius: 1rem;
    border: 0.1rem solid #79271034;
    background-color: white;
}

form button:hover{
    transform: scale(1.05);
}

.POZADINA{
    background: url("image.png");
    background-size: cover;
    backdrop-filter: blur(100px);
}

.ime_sekcije_book::after {
    content: "";
    display: block;
    width: 12em;               
    height: 1px;             
    background-color: #ffffff;
    margin: 10px auto 0;       
    border-radius: 2px;        
}

.ime_sekcije_book{
    font-size: 2.8rem;
    color: white;
}

#ispis_rezervacije{
    margin-left: 6rem;
    margin-right: 6rem;
    text-align: center;
}

/*KORPA*/
/********************************************/
/********************************************/

#KORPA{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100vw;
    text-align: left;
}