@font-face {
    font-family: raleway;
    src: url('fonts/Raleway/static/Raleway-Regular.ttf') format('TrueType')
}

body {
    background-color: black;
    font-family: raleway;
    margin: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;




}

@media print {
    @page {
        size: auto;
        /* auto is the initial value */

        /* this affects the margin in the printer settings */
        margin: 10mm 10mm 0mm 10mm;
    }

    body {
        /* this affects the margin on the content before sending to printer */
        margin: 0px !important;
        background-color: white !important;
    }

    .resulval {
        font-size: 17px !important;
        margin-top: 10px;
    }

    #infogal2,
    #infogal {
        border: 1px solid black;
        padding: 0px 10px;
        margin-top: 20px !important;
        color: black;
        border-radius: 15px;
        width: 90% !important;
        margin-left: calc(5% - 11px);
        margin-bottom: 15px;
        background-color: white !important;
    }

    #txtimp {
        width: 100%;
        text-align: center;
        margin-top: -5px;
    }

    #bigres2 {
        font-size: 15px;
        border: 1px solid white;
        width: 95%;
        margin-left: calc(2.5% - 1px);
        border-radius: 12px;
        margin-bottom: 0 !important;
        background-color: rgba(255, 255, 255, 0.85);
    }

    #pourimp {
        display: block !important;
        position: relative !important;
        top: 0 !important;
        left: 5px !important;
    }

    #validationeval2 {
        display: none;
    }

    #topblack2 {
        display: none;
    }

    #certirapport {
        font-size: 15px !important;
        width: 100% !important;
        text-align: center !important;
        background-color: white !important;
        margin-top: 20px !important;
    }

    #precblack {
        width: 200px !important;
        display: block !important;
    }

    #lowpage {
        display: none !important;
    }

    #divlog {
        display: none !important;
    }



}


form {
    -webkit-appearance: none;
}

div {
    -webkit-appearance: none;
}

#sombreunpeu {
    position: fixed;
z-index: -1;
height: 100%;
width: 100%;
background: url(image/signfondargent.png) no-repeat center fixed;
    background-size: auto;
background-size: contain;
opacity: 0.35;
top: 0;
left: 0;
}

a:link,
a:visited {
    text-decoration: none;
    color: white;
}

.ttxtssmenu a,
a:visited {
    color: white;
}

#logoeval {
    height: 30px;
    width: 30px;
    background-image: url(image/logosignnew.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;

}

#commspasla {
    display: none;
}

#titresign {
    font-size: 15px;
    color: white;
    margin-left: 5px;
}

#titresign2 {
    height: 30px;
    width: 140px;
    background-image: url(image/precellence_texteonly.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 10px;
    position: relative
}

#sssign2 {
    height: 20px;
    width: 80px;
    background-image: url(image/bysign.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 10px;
    position: absolute;
    bottom: -15px;
    right: -70px;
}

#divlog {
    display: flex;
    position: fixed;
    top: 5px;
    left: 5px;
    /*width: 30vw;*/
    height: 30px;
    /*max-width: 200px;*/
    flex-direction: row;
    line-height: 30px;
    z-index: 2;
    opacity: 0.55;
}

#precblack {
    position: relative;
    top: 5px;
    left: 5px;
    width: 150px;
    display: none
}

#pourimp {
    display: none;
}

.inlog {
    width: 70%;
    height: 30px;
    border-radius: 5px;
    -webkit-appearance: none;
    border: none;



}

.inlog:focus {
    width: 70%;
    height: 30px;
    border-radius: 5px;
    box-shadow: 0px 0px 4px 5px #75b5fe;

    outline: none;

}

#caselisteclient {
    color: white;
    position: fixed;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 5px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 20px
}

#listeclient {
    display: none;
    background-color: #8c8c8c;
    position: fixed;
    top: 130px;
    left: 50%;
    border-radius: 15px;
    text-align: left;
    font-size: 15px;
    overflow: auto;
    height: 300px;
    transform: translateX(-50%);
    width: 75%;
    max-width: 300px
}

#liste1,
#liste2 {
    list-style-type: none
}

#liste2 {
    z-index: 1;
    white-space: nowrap;
}

#piedsigneval {
    color: white;
    position: fixed;
    bottom: 0;
    text-align: center;
    font-size: 10px;
    height: 20px;
    background-color: grey;
    width: 100%;
    line-height: 20px
}

.lienclient {
    color: white
}

.titleClient {
    font-size: 25px;
    text-align: center;
    color: white;
    position: fixed;
    left: 50%;
    top: 25px;
    border-radius: 12px;
    transform: translateX(-50%);
    background-color: black;


}

.titleClient2 {
    font-size: 25px;
    text-align: center;
    color: white;

    border-radius: 20px;

    background-color: black;
}

.titleeval {
    font-size: 30px;
    text-align: center;
    color: white;
    position: fixed;
    left: 50%;
    top: 33px;
    transform: translateX(-50%);
    white-space: nowrap;
    max-width: 70vw;
    overflow: auto;
}

#titleeval1 {
    color: black;
    background-color: white;
    opacity: 1;
}

#titleeval2 {
    color: white;
    background-color: black;
    opacity: 0.35;

}

#titleeval3 {
    color: black;
    background-color: white;
    opacity: 1;


}

#titleeval4 {
    color: white;
    background-color: black;
    opacity: 0.35;
}

#titleeval5 {
    color: white;
    background-color: black;
    opacity: 0.35;
}

.tireres {
    font-size: 17px;
    border-radius: 20px;
    border: 1px solid white;
    padding: 5px;
    margin-left: 10px;
    margin-right: 10px;

}

.divflex {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: row;
    margin-bottom: 20px;


}

#closelist1 {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    background-image: url(image/cross.png);
    background-size: contain;
    background-position: center;
    border-radius: 50%
}

#signevalue {
    color: white;
    padding: 10px 10px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px
}

.signvalue2 {
    color: white;
    padding: 5px 0;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    text-align: center;
    max-width: 45vw;
}

.signvalue2:focus {
    outline: none;
    background-color: white;
    color: black;
}

#evaluateur {

    font-size: 15px;
    border-radius: 12px;
    background-color: white;
}

#listeemployes {
    display: none;
    background-color: black;
    position: fixed;
    top: 100px;
    left: 10px;
    border-radius: 15px;
    text-align: left;
    font-size: 15px;
    overflow: auto;
    width: 60%;
    max-width: 300px;
    height: 60vh;
    z-index: 2;
    color: white;
    border: 1px solid white
}

#evaluation {
    display: none;
    position: fixed;
    top: 140px;
    width: 100vw;
    text-align: center;
    overflow: auto;
    height: calc(100% - 170px);
}

#evaluation2 {

    position: fixed;
    top: 50px;
    width: 100vw;
    text-align: center;
    overflow: auto;
    height: calc(100% - 50px);
}

.eval {
    margin: 25px auto
}

.titreeval {
    font-size: 15px;
    color: white;

}

.caseeval {
    display: flex;
    flex-direction: row;
    background-color: grey;
    border-radius: 12px;
    width: 90vw;
    height: 50px;
    overflow: auto;
    margin: 10px auto;
    padding: 10px;
    justify-content: space-around;
    color: black
}

#validation {
    border-radius: 33px;
    color: #75b5fe;
    border: 4px solid #75b5fe;
    width: 100px;
    margin: 0px auto;
    height: 30px;
    background-color: black;
    -webkit-appearance: none;
    font-size: 15px;
}

.labeval {
    font-size: 15px;
    margin-top: 10px
}

.labevalr {
    white-space: nowrap;
}


input {
    -webkit-appearance: none;
}

select {
    -webkit-appearance: none;
}

.orginput {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center
}

#ideval {

    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: white;
}

.ideval {

    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: white;
}

.ideval22 {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: white;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
}

#labevalr {
    color: white;
    font-size: 20px
}

.comments {
    background-color: white;
    border-radius: 12px;
    width: 90vw;
    height: 50px;
    overflow: auto;
    color: black;
    margin: auto
}

.comments2 {
    background-color: white;
    border-radius: 12px;
    width: 90vw;
    height: 50px;
    overflow: auto;
    color: black;
    margin: 0 auto;
    padding: 10px;
    outline: none;
}

.comments2:focus {
    background-color: white;
    border-radius: 12px;
    width: 90vw;
    height: 50px;
    border: 4px solid #75b5fe;
    overflow: auto;
    color: black;
    margin: 0 auto;
    padding: 10px;
}

.resulval {
    text-align: left;
    color: black;
    margin-left: 20px;
    margin-top: 20px;
    width: 90%;
    word-break: normal;
    font-size: 20px;


}

.resulval33 {

    display: flex;
    flex-direction: row;
    justify-content: space-between;

}

.indivpourc {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.resulval3 {
    text-align: left;
    color: black;
    margin-left: 20px;
    margin-top: 40px;
    width: 90%;
    word-break: normal;
    font-size: 20px;
    font-weight: 600;
}

.comms {
    font-style: italic;
    font-size: 15px;
}

#nomeval {
    position: fixed;
    right: 5px;
    top: 10px;
    color: white;
    font-size: 15px;
    padding: 10px;
    text-align: center
}

#bigres {
    position: fixed;
    top: 100px;
    left: calc(2.5% - 1px);
    ;
    height: calc(100% - 100px);
    overflow: auto;
    border-radius: 12px;
    border: 1px solid white;
    width: 95%;
}

#bigres2 {
    font-size: 15px;
    /* width: 98%; */
    border: 1px solid white;
    width: 95%;
    margin-left: calc(2.5% - 1px);
    border-radius: 12px;
    margin-bottom: 30px;
    background-color: rgba(255, 255, 255, 0.85);
}

.employedeliste {}

#certirapport {
    font-size: 10px;
    width: 100%;
    text-align: center;
    background-color: grey;
    margin-top: 20px;

}

#evall2 {
    position: absolute;
    display: flex;
    top: 95px;
    justify-content: space-around;
    align-items: center;
    flex-direction: row;
    width: 100vw
}

#infogal {
    border: 1px solid grey;
    padding: 0px 10px;
    margin-top: 110px;
    color: black;
    background-color: grey;
    border-radius: 15px;
    width: 90vw;
    margin-left: calc(5vw - 11px);
    margin-bottom: 30px;
}

#infogal2 {
    border: 1px solid grey;
    padding: 0px 10px;
    margin-top: 110px;
    color: black;
    background-color: grey;
    border-radius: 15px;
    width: 90vw;
    margin-left: calc(5vw - 11px);
    margin-bottom: 30px;
}

.titregal {
    font-size: 15px;
}

.titregal2 {
    margin-bottom: 80px
}

.titrenombresite {
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: right;
    font-size: 14px;
}

.infohaut {

    font-size: 21px;
    margin-left: 10px;
}

.infohaut2 {
    text-transform: uppercase;
    font-size: 30px;

}

.infohaut3 {
    text-transform: uppercase;
    font-size: 15px;

}

#siteevaltop {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: -15px;
}

#siteevaltop2 {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;

}

#datecadre {
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    font-size: 14px;
}

#validationeval {
    position: fixed;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
    text-align: center;
    color: white;

    width: max-content;
    z-index: 2
}

#validationeval2 {
    position: fixed;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 20px;
    text-align: center;
    color: white;

    width: 100%;
    z-index: 2
}

#evaluateur2 {
    color: white;
    padding: 10px 10px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    text-align: center;
}

#topblack {
    position: fixed;
    top: 0;
    left: 0;
    height: 55px;
    width: 100%;
    background-color: transparent;
    z-index: 1
}

#topblack5 {
    position: fixed;
    top: 0;
    left: 0;
    height: 50px;
    width: 100%;
    background-color: transparent;
    z-index: 1
}

#topblack2 {
    position: fixed;
    top: 0;
    left: 0;
    height: 105px;
    width: 100%;
    background-color: transparent;
    z-index: 1;
}

@media screen and (orientation: portrait) {
    #topblack {
    position: fixed;
    top: 0;
    left: 0;
    height: 110px;
    width: 100%;
    background-color: black;
    z-index: 1
}

#topblack5 {
    position: fixed;
    top: 0;
    left: 0;
    height: 110px;
    width: 100%;
    background-color: black;
    z-index: 1
}

#topblack2 {
    position: fixed;
    top: 0;
    left: 0;
    height: 110px;
    width: 100%;
    background-color: black;
    z-index: 1;
}
}
#contentval {
    position: fixed;
    overflow: auto;
    height: calc(100% - 20px);
    width: 100%;
}

#btnstart {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 98%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;

}

.btndebut {
    color: white;
    padding: 5px 5px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    text-align: center;
}

.societe {

    color: white;
    text-transform: uppercase;
}

#choievl,
#choievl2 {
    color: white;
    padding: 5px 5px;
    border-radius: 20px;
    font-size: 20px;
    width: 100% height:20px;
    text-decoration: underline;
    text-align: center;
    margin-top: 70px;
    margin-bottom: 20px;

}



#whitedeb,
#whitedeb2,
#whitedeb3,
#whitedeb4 {
    color: white;
    padding: 10px 5px;
    border-radius: 20px;
    font-size: 15px;
    width: 100% width:max-content;
    text-align: center;
}

#whitedeb11 {}

#whitedeb12 {
    display: none
}

#whitedeb13 {}

#whitedeb14 {
    display: none
}

#whitedeb15 {
    display: none
}

.whitedeb {
    color: white;
    padding: 10px 5px;
    border-radius: 20px;
    font-size: 15px;
    width: 100% width:max-content;
    text-align: center;
}

#submit {
    border-radius: 33px;
    color: white;
    border: 4px solid #75b5fe;
    width: 100px;
    margin: 0px auto;
    height: 35px;
    background-color: #75b5fe;
    -webkit-appearance: none;
    font-size: 17px;
    font-family: raleway;
    text-transform: capitalize;

}

#submit2,
#submit3,
#submit4,
#submit5,
#submit6 {
    border-radius: 33px;
    color: white;
    border: 4px solid #75b5fe;
    width: 100px;
    margin: 0px auto;
    height: 35px;
    background-color: #75b5fe;
    -webkit-appearance: none;
    font-size: 17px;
    font-family: raleway;
    text-transform: capitalize;
}



#sellist,
#sellist2,
#sellist3,
#sellist4,
#sellist7,
#sellist8,
#sellist9,
#sellist10,
#sellist11{

    color: white;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    width: 220px;
    height: 40px;
    padding: 0 10px;
    outline: none;

}

.listverif {

    color: white;
    margin: 0 auto;
    border: 1px solid white;
    border-radius: 5px;
    font-size: 15px;
    background-color: black;
    width: 250px;
    max-height: 100px;
    padding: 15px;
    outline: none;
    /* margin-top: 35px; */
    /* margin-left: 10px; */
    text-align: left;
    overflow: auto;

    list-style-type: none;

}

#sellist5 {

    color: white;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    width: 150px;
    height: 40px;
    padding: 0 10px;
    outline: none;

}

#sellist6 {

    color: white;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    width: 150px;
    height: 40px;
    padding: 0 10px;
    outline: none;
    line-height: 40px;
    text-align: left
}

.listeverifadm {
    margin-top: 40px
}

#textlist {

    color: white;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    width: 180px;
    height: 40px;
    padding: 0 10px;
    outline: none;

}

#sellist:focus,
#sellist2:focus,
#sellist3:focus,
#sellist5:focus,
#sellist6:focus,
#sellist4:focus,
#sellist7:focus,
.listverif:focus {
    color: black;
    border: 3px solid#75b5fe;
    background-color: white;



}

#textlist:focus {

    color: white;
    border: 3px solid#75b5fe;
    border-radius: 20px;
    font-size: 15px;
    background-color: black;
    width: 180px;
    height: 40px;
    padding: 0 10px;


}

#annuler {

    width: 80px;
    color: #75b5fe;
    background-color: black;
    border-radius: 20px;
    border: 1px solid #75b5fe;
    padding: 3px;
    text-transform: capitalize;
    height: 30px;
    position: fixed;
    bottom: 50px;
    left: 5px;
    z-index: 10;
    -webkit-appearance: none;
    text-transform: uppercase;
}

#annuler2 {

    width: 80px;
    color: #75b5fe;
    background-color: black;
    border-radius: 20px;
    border: 1px solid #75b5fe;
    padding: 3px;
    text-transform: capitalize;
    height: 30px;
    z-index: 10;
    -webkit-appearance: none;
    text-transform: uppercase;
}

#revalider {
    width: max-content;
    color: #75b5fe;
    background-color: black;
    border-radius: 20px;
    border: 4px solid #75b5fe;
    padding: 5px;
    text-transform: capitalize;
    height: 30px;
    position: fixed;
    bottom: 50px;
    right: 5px;
    text-align: center;
    z-index: 5;
    text-transform: uppercase;
}

#revalider2 {
    width: 80px;
    color: #75b5fe;
    background-color: black;
    border-radius: 20px;
    border: 4px solid #75b5fe;
    padding: 3px;
    text-transform: capitalize;
    height: 30px;
    text-align: center;
    line-height: 30px;
    z-index: 5;
    text-transform: uppercase;
}

#inforeg {
    position: fixed;
    bottom: 150px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 25px;
    z-index: 100;
    color: #75b5fe;
    width: max-content;
    background-color: black;
    border-radius: 20px;
    border: 2px solid #75b5fe;
    -webkit-animation: clign 0.7s 4 linear alternate forwards;
    animation: clign 0.7s 4 linear alternate forwards;
    padding: 15px;
    opacity: 0;
    font-weight: 1000;
}

@-webkit-keyframes clign {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes clign {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

#passw {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: max-content;
    color: white;
    background-color: grey;
    padding: 20px;
    font-size: 20px;
    width: 80vw;
    max-width: 400px;
}

#attention {
    display: none;
    position: fixed;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    color: red;
    width: 90vw;
    text-align: center;
    text-transform: uppercase;
    font-weight: 1000;
    font-size: 30px;
    font-family: impact;
}

#grr {
    position: fixed;
    z-index: -1;
    height: 100%;
    width: 100%;
    background: url(image/tdm.png) no-repeat center fixed;
    background-size: contain;
    opacity: .15
}

.spanres {
    text-transform: uppercase;
    margin-left: 20px;
}

.spanres2 {
    text-transform: uppercase;
    margin: 0 auto;
}

#deconnect {
    height: 40px;
    width: 150px;
    background-color: black;
    color: #75b5fe;
    border-radius: 20px;
    border: 1px solid #75b5fe;
    position: absolute;
    text-align: center;
    font-size: 15px;
    line-height: 15px;
    text-transform: uppercase;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}

#deconnect2 {
    display: inline-block;
    height: 30px;
    width: 150px;
    background-color: black;
    color: #75b5fe;
    border-radius: 20px;
    border: 1px solid #75b5fe;
    text-align: center;
    font-size: 15px;
    line-height: 30px;
    text-transform: uppercase;

}

#lowpage {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 100%;
    height: 40px;
    position: fixed;
    z-index: 11;
    bottom: 0;
    left: 0;
    align-items: center;
    background-color: black;
}

.lpage {
    height: 30px;
    width: 30px;


}

#printme {
    display: none;
    background-image: url(image/signimprim.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;

}

#printme2 {

    display: inline-block;
    width: 30px;
    height: 30px;
    background-image: url(image/signimprim.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;

}

#printmetr {
    display: inline-block;
    width: 30px;
    height: 30px;
    overflow: all;
    text-align: center;

}

#printmetrin {

    width: 80px;
    height: 30px;

}

#connectme {
    background-image: url(image/unmeilleurvous-login.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;

}

#connectme2 {
    display: inline-block;
    background-image: url(image/unmeilleurvous-login.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;

}

#homesymb {
    background-image: url(image/logosignnew.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
    /*border-radius: 50%;
    border:2px solid white;
    background-color: transparent;*/

}

#logoutbox {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: max-content;
    color: white;
    background-color: transparent;
    padding: 20px;
    font-size: 20px;
    width: 80vw;
    height: 150px;
    max-width: 400px;
    z-index: 15;

}

#crosslogout {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    background-image: url(image/cross.png);
    background-size: contain;
    background-position: center;
    border-radius: 50%
}

#hideapps,
#hideapps2 {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 12;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}


#menuleft {
    height: 100%;
    width: max-content;
    padding-right: 20px;
    position: fixed;
    top: 0;
    left: -100%;
    background-color: black;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    color: white;
    z-index: 13;
    box-shadow: 0px 0px 3px white;

}

#spaceitems {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 50%;

}

.ssmenu {
    display: flex;
    flex-direction: row;
    width: max-content;
    justify-content: space-around;
    align-items: center;

    text-decoration: none;

}

.itmenu {
    height: 25px;
    width: 25px;
    margin-right: 10px;
    margin-left: 20px;

}

#it3 {
    background-image: url(image/unmeilleurvous-inforond.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
}

#it2 {
    background-image: url(image/unmeilleurvous-calm.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
}

#it1 {
    background-image: url(image/unmeilleurvous-instr.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
}

#it4 {
    background-image: url(image/telsign.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
}

#it5 {
    background-image: url(image/mailsign.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
}

.slidemenu {
    -webkit-animation: slidenow 0.3s 1 linear forwards;
    animation: slidenow 0.3s 1 linear forwards;
}

@-webkit-keyframes slidenow {
    0% {
        left: -100%;
    }

    100% {
        left: 0;
    }
}

@keyframes slidenow {
    0% {
        left: -100%;
    }

    100% {
        left: 0;
    }
}

#crossmenu {
    width: 15px;
    height: 15px;
    position: absolute;
    top: 10px;
    right: -30px;
    cursor: pointer;
    background-image: url(image/cross.png);
    background-size: contain;
    background-position: center;
    border-radius: 50%
}

#logmenu {
    height: 50px;
    width: 50px;
    margin: 0 auto;
    background-image: url(image/logosignnew.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;

}

#mentions {
   position:fixed;
   width:95%;
   left:2.5%;
   top:110px;
   overflow: auto;
   height:calc(100% - 140px);
}

#ttxtssmenu {
    color: white;
}

#baspage {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    height: 25px;
    line-height: 25px;
    font-size: 10px;
    background-color: rgba(117, 181, 254, 0.15);
    color: white;
}

#commenton {

    width: 95vw;
    margin-left: 2.5vw;
    margin-top: 115px;
    margin-bottom: 75px;
    color: white;
    font-size: 15px;
    line-height: 20px;

}

#commenton p {
    margin-left: 10px;
}

#mentions p {
    font-size: 12px;
}

#mentions h4 {
    font-size: 14px;
    margin-top: 40px;
}

#smenu3 {
    position: absolute;
    bottom: 40px;
    left: 0;

}

#inpass {
    width: max-content;
    padding: 6px;
    color: white;
    background-color: #75b5fe;
    border-radius: 15px;
    border: 1px solid white;
    font-size: 15px;
    font-family: raleway;
    margin: 0 auto;
}

#inpassw {
    height: 25px;
    width: 180px;
}

.incasec {
    height: 15px;
    width: 15px;
    border: 0.5px solid black;
    background-color: white;
    border-radius: 50%;
    outline: none;
}

.incasec:checked {
    height: 15px;
    width: 15px;
    border: 0.5px solid black;
    background-color: #75b5fe;
    border-radius: 50%;
}

.yesnot {
    height: 20px;
    width: 20px;
    border: 0.5px solid black;
    background-color: white;
    border-radius: 50%;
    outline: none;
}

.yesnot:checked {
    height: 20px;
    width: 20px;
    border: 0.5px solid black;
    background-color: #75b5fe;
    border-radius: 50%;

}

.sapnres {
    text-transform: uppercase;
    margin-left: 20px;
    font-size: 15px;
    font-weight: 800;
    word-break: normal;
}

.barrepourcent2 {

    height: 20px;
    border: 1px solid white;
    border-radius: 10px;
    -webkit-print-color-adjust: exact;

}

.barrepourcent {
    width: 60vw;
    height: 20px;
    /*border:1px solid rgba(0,0,0,0.35);*/
    border-radius: 20px;
    -webkit-print-color-adjust: exact;
    margin-top: 1px;
    margin-left: 1px;


}

.fondbarrep {
    position: absolute;
    top: 0;
    left: 0;
    width: 60vw;
    height: 20px;
    border: 1px solid rgba(0, 0, 0, 0.35);
    border-radius: 20px;
    background-color: transparent;

}

.barrespro {
    position: relative;
    width: 60vw;
}

progress::-webkit-progress-bar {
    background-color: transparent;
    height: 100%;
    width: 100%;
    /*box-sizing: border-box;*/
    border-radius: 10px;

}

progress::-webkit-progress-inner-element {
    box-sizing: inherit;
    height: 100%;
    width: 100%;
    background-color: transparent;
    border-radius: 10px;
}

progress::-webkit-progress-value {
    background-color: rgba(0, 0, 0, 0.35);
    height: 100%;
    width: 50%;
    /*box-sizing: border-box;*/
    border-radius: 10px;

}

#divdate {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 10px auto;
}

.dateinputs {
    margin: 5px 10px;
}

#pasdedonnes {
    font-size: 30px;
    color: white;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90vw;
    text-align: center;
}

#pagemove1 {
    margin-bottom: 50px;
}




#divcreate {
    width: 100%;
    text-align: center;
    font-size: 15px;
    margin-top: 50px;
    color: white;

}

#divbtncreate {
    width: 100%;
    text-align: center;
    font-size: 15px;
    margin-top: 140px;
    color: white;
    display: flex;
    flex-direction: row;
    justify-content: center;
}


.createtable {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    color: white;
}

.signvalue3 {
    color: white;
    padding: 7px 12px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 17px;
    background-color: black;
    text-align: center;
    max-width: 50vw;
    margin-top: 15px;
}

.signvalue3:focus {
    outline: none;
    background-color: white;
    color: black;
}

.signvalue4 {
    color: black;
    padding: 7px 12px;
    border: 1px solid white;
    border-radius: 20px;
    font-size: 17px;
    background-color: white;
    text-align: center;
    margin-top: 15px;
    border: 1px solid black;
}

.signvalue4:focus {
    outline: none;
    border: 2px solid #75b5fe;
}

#validationeval3 {
    position: fixed;
    top: 80px;
    left: 0;
    font-size: 21px;
    text-align: center;
    color: white;
    text-transform: uppercase;
    width: 100%;
    z-index: 2;
}

.creatio {
    border-radius: 33px;
    color: white;
    border: 4px solid #75b5fe;
    width: 100px;
    margin: 0px auto;
    height: 35px;
    background-color: #75b5fe;
    -webkit-appearance: none;
    font-size: 17px;
    margin-left: 15px;
}

#creasite {}

#creaagent1 {
    display: none
}

#creaeval1 {
    display: none
}

.labevalr3 {
    white-space: nowrap;
    border-radius: 20px;
    padding: 5px;
    margin: 0px 10px;
    border: 1px solid white;
}

.labevalr3:focus {
    white-space: nowrap;
    background-color: white;
    color: #75b5fe;
}

#btnsite {
    color: black;
    background-color: white;
}

#btnagent,
#btneval {
    opacity: 0.35;
}

.validcreate {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 300px;
    height: max-content;
    text-align: center;
    padding: 25px 20px;
    background-color: white;
    z-index: 10;
}

.stopcreate,
.modifcreate {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 300px;
    height: max-content;
    text-align: center;
    padding: 25px 20px;
    background-color: white;
    z-index: 100;
}

.txtvalidsite {
    color: black;
    width: 100%;
    margin-bottom: 25px;
}

.boutonsval {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}
.boutonsval2 {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.admbtnmodidifier {
    width: max-content;
    padding: 5px;
    color: #75b5fe;
    background-color: white;
    border-radius: 15px;
    border: 1px solid #75b5fe;
    font-size: 15px;
}

.admbtnvalider {
    width: max-content;
    padding: 6px;
    color: white;
    background-color: #75b5fe;
    border-radius: 15px;
    border: 1px solid #75b5fe;
    font-size: 15px;

}

.cachevalid {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: 5;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

#inpcreaeval:focus,
#inpcreaagent:focus,
#inpcreasite:focus {
    outline: none;
    background-color: white;
    color: black;
    border: 3px solid #75b5fe;
}

.ajouttitre {
    font-size: 17px;
    text-transform: uppercase;
}

#ajouttitre2,
#ajouttitre10,
#ajouttitre12 {
    color: black;
    width: max-content;
    background-color: white;
    border: 1px solid white;
    font-size: 17px;
    text-transform: uppercase;
    padding: 5px;
    border-radius: 20px;
}

#ajouttitre3,
#ajouttitre11,
#ajouttitre13,
#ajouttitre31{
    color: white;
    width: max-content;
    background-color: black;
    border: 1px solid white;
    font-size: 17px;
    text-transform: uppercase;
    padding: 5px;
    border-radius: 20px;
    opacity: 0.35;

}

.divajoutmod {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

#modifeval,
#supsite,
#supagent,
#supeval {
    display: none;
}

.flexdiveval {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}