:root
{
    --coulfond: #F0E7E2;
    --coulfond2: #D1D36A;
    --coultexte: #D6D8E5;
    --coultexte2: #495E1B;
    --coul3: #A6A3B8;
}

body
{
    background-color: var(--coulfond2);
    font-family: Arial, sans-serif;
    overflow-x: hidden;
    color: black;
}

a
{
    color: var(--coultexte2);
    text-decoration: none;
    border-radius: 15px;
    padding: 0 15px;
    transition: 250ms;
}

a:hover
{
    background-color: var(--coultexte);
    transition: 50ms;
}


h1
{
    color: var(--coultexte2);
    font-size: 5rem;
}

h3
{
    color: var(--coulfond2);
}

h4
{
    color: var(--coultexte2);
}

img
{
    border-radius: 25px;
}

button
{
    color: var(--coulfond2);
}

button:hover
{
    color: black;
}

input:hover
{
    background-color: var(--coulfond2);
}

.navbar {
    background-color: var(--coulfond2);
    position: fixed;
    width: 100%;
    top:0;
    left:0;
    height: 50px;
    line-height: 50px;
    z-index: 11;
    justify-content:space-around;
    display:flex;
}

.barv
{
    display: flexbox;
    position: fixed;
    height: fit-content;
    width: fit-content;
    left: 0;
    top: 15%;
    background-color: var(--coulfond2);
    z-index: 11;
    border-radius: 0 20px 20px 0;
    padding:0 1%;
    a
    {
        background-color: var(--coultexte);
        font-size: larger;
    }
}

.contenu
{
    background-color: var(--coulfond);
    width: 102%;
    height: 100%;
    margin: -7px;
    display: block;
    text-align: center;
    font-size: 1rem;
    .bloc
    {
        margin: 0 25%;
        text-align: left;
        background-color: var(--coul3);
        display: block;
        padding: 1% 2% 2% 2%;
        border-radius: 20px;
        margin-top: 4%;
        margin-bottom: 4%;
    }
}

.reservation
{
    display: block;

}

.baspage
{
    display: flex;
    justify-content: center;
    padding-bottom: 35px;

    .sousmenu
    {
        display: block;
        padding-top: 20px;
        padding: 0 2%;
    }
}