body,html{
    padding: 0;
    margin: 0;
    font-size: 1.2em;
    font-family: 'Hind Guntur', sans-serif;
    background:#CDCDC0;
    color:rgb(59, 62, 65);
}

a{
    text-decoration: none;
    color:#fff;
    background: rgb(143, 154, 158);
    padding: .3em .6em;
    border-radius: 10px;
}

#employe_content>a{
    text-decoration: none;
}

select{
    font-size: .8em;
}

input[type="date"] {
    appearance: none;
    -webkit-appearance: none;
    color: rgb(75, 71, 68);
    font-family: "Helvetica", arial, sans-serif;
    font-size: 18px;
    border:1px solid #ffffff;
    background:#ffffff;
    padding:5px;
    display: inline-block !important;
    visibility: visible !important;
    border-radius: 5px;
}


#formSearch{
    text-align: center;
    padding-top: 1em;
}

#formSearch>table{
    position:relative;
    left:50vw;
    transform: translateX(-50%);
    text-align: center;
    border:0;
    border-spacing: 50px 15px;
}

#formSearch>table td{
    padding: .2em .5em;
    border-radius: 30px;
    border:1px rgba(75, 71, 68, 0.3) solid;
    box-shadow: inset 0 0 20px 2px rgba(0, 0, 0, .2);
    background:rgb(226, 226, 215);
}

#formSearch>table tr:first-of-type{
    font-size: 1.1em;
    font-weight: bold;
    border-spacing: 25px;
}

#formPret{
    display: flex;
    justify-content: space-around;
    flex-flow: row wrap;
    min-height: 200px;
    margin-bottom: 100px;
}

#formPret select{
    padding: .2em;
    border-radius: 10px;
}


#formPret>div{
    width: 100vw;
    max-height: 20vh;
    align-self: center;
    text-align: center;
}

#date_fin{
    max-height: 20px;
}

#topbar{
    background-image: url('../image/topbar.jpg');
    background-size: cover;
    background-position-y: -150px;
    height: 25vh;
    display: flex;
    justify-content: center;
}

#topbar>h1{
    color:black;
    align-self: center;
}

#employe{
    position: absolute;
    right:0;
    top: 0;
    font-size: 1em;
    padding: 0.5em;
    color:white;
}

#employe>a{
    text-decoration: none;
    color:rgb(226, 227, 228);
    background:none;
    padding: .2em;
}

#employe>a:hover{
    text-decoration: none;
    color:#fff;
}

#liens_employe{
    text-align: center;
}

#lien_deco{
    position: absolute;
    top:0;
    right: 0;
    margin: .5em;
}

#lien_admin{
    position: absolute;
    bottom:0;
    right: 0;
    margin: .5em;
}

#content{
    text-align: center;
    min-height: 75vh;

}


#formConnexion{
    text-align: center;
    height: 50vh;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
}

#envoyer{
    padding:.4em .8em;
    font-size: .8em;
    background:white;
    border: none;
    border-radius: 5px;
    box-shadow: 0 0 10px 2px rgba(0, 0, 0, .2);
    transition: box-shadow .3s ease-out;
}

#envoyer:hover{
    box-shadow: 0 0 20px 5px rgba(155, 116, 116, 0.2);
}

#retard{
    border : none;
    font-size: 1.1em;
    border-spacing: 30px 10px;
}

#retard td{
    border-radius: 1em;
    padding: .2em;
}

#retard tr:first-of-type{
    font-weight: bold;
}

.retour{
    position: absolute;
    top:20px;
    right:20px;
}

#table_archive{
    border : none;
    font-size: 1.1em;
    border-spacing: 30px 10px;
    text-align: center;
}

#table_archive td{
    border-radius: 1em;
    padding: .2em;
}

#table_archive tr:first-of-type{
    font-weight: bold;
}