/* CSS Document */

/**** 
Couleur primaire : #0e425f
Couleur textes : #86A0AF
Couleur textes 50% : #000000
Couleur textes placeholder : #5E727D
Couleur de fond : #F5F6FC
Couleur de fond de tableau : #F9F9FF
Couleur suivi inactif : #DADADD

Couleur fond popin blanche : #26477D avec opacity 0.65
Couleur fond popin bleue : #FFFFFF avec opacity 0.65

Couleur fond bleu foncé sur fond bleu : #095DBF

Couleur bordure de champs : #DADDE1
Couleur fond checkbox (on/off) : #EDEEF0
Couleur fond checkbox : #e7e9f0

Couleur valid : #2EB39A
Couleur error : #EB5757
Couleur orange : #F88C2D

Stats :
Couleur 1 (violet) : #8676FF
Couleur 2 (rose) : #FF708B
Couleur 3 (jaune) : #FFBA69
***/
body { font-size: 16px }
a { color:#777777; text-decoration:none; transition:color .3s; -webkit-transition:color .3s; }
a:hover, a.on { color:#0e425f; }

#formContainer { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 440px; height: 100%; max-height: 400px; max-width: 100%; background-color: #FFFFFF; border-radius: 12px; overflow: auto; }

#formLoginContent img { margin-top: 50px; }

.textLogin { margin: 40px 0 }

.formLogin { display: inline-block }
.formLogin input { width: 320px; max-width: 80vw; }
#errorForm div { padding: 10px 0; margin: 5px 10px; font-size: 15px; font-weight: 500; background-color:#D12F32; color:#FFFFFF; text-align: center; border-radius: 5px; }

h1::before { display: none; }

@media screen and (max-width: 950px) {
    #formContainer { overflow: inherit }
}

@media screen and (max-width: 420px) {
    #formContainer { width: auto; left: 10px; right: 10px; transform: translate(0, -50%)}
    #formLoginContent { position: relative; padding: 10px 20px 30px }
    #formLoginContent .left { float: left }
    #formLoginContent .right { float: right }
}
