#content-form {
    flex-direction: column;
}
#login-form-container > h2 {
    margin-bottom: 5vmin;
}
section#content {
    display: inline-block;
}

small {
    display: block;
    margin-top: 1vmin !important;
    margin-bottom: 1vmin;

    font-size: 1rem;

    color: red;
}

#school-infos small {
    font-size: 2vmin;
}

#school-info .schoolname {
    margin-top: -1vmin;
}

.hr {
    z-index: 228;

    display: block;
    width: 90%;
    height: 2px;
    margin: auto;
    margin-top: 2rem;
    margin-bottom: 2rem;

    background-color: rgb(255, 255, 255);
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .17);
}

label {
    display: block;
}
.form-control:focus {
    border: 1px solid #070a0d;
    /*background-color: #0f1820;*/
    background-color: #fafafa;
}
#login-form > div {
    margin-top: 2vmin;
}
#login-form label {
    margin-bottom: 0;

    color: #71daf4;
}
.checkbox label {
    color: white !important;
}
#content {
    /*width: 60vmin;*/
    width: 60vw;
    /*margin-top: 5vmin;*/
}
#content,
#news {
    margin-top: 2vmin;
}
.button-generic,
#button-connect,
#button-contact,
#button-retrieve {
    cursor: pointer;
}
#button-connect {
    margin-top: 4vmin;
}
.button-generic img,
#button-connect img,
#button-contact img,
#button-retrieve img {
    display: block;
    margin: auto;
}
small.hidden {
    visibility: hidden;
}
/*
form small {
    color: hsla(0, 70%, 60%, 1) !important;
}*/

#content-loading {
    text-align: center;
}
#content-loading #spinner {
    margin-top: 10vmin;
    margin-bottom: 10vmin;
    width: 23.6vmin;
    height: 23.6vmin;
}
#content-loading p {
    color: #71daf4;
}
#button-license {
    width: 30vmin;
    margin: auto;
}

.form-control-lg,
.input-group-lg > .form-control,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
    line-height: 1.4 !important;
}
h2 {
    font-size: 2.8vmin;

    color: black;
}
h2 strong {
    display: block;

    font-size: 1.8rem;
    font-weight: bold;
}
.editions {
    font-weight: bold;
}
.jocatop {
    font-weight: bold;
    color: #29b4c2;
}
input[type=text],
input[type=email],
input[type=password] {
    display: block;
    width: 100%;
    height: 3vw;
    padding: 2vmin;
    margin: 0;
    color: #243e58;
    border-radius: .5vmin;
    font-family: Roboto;
    font-size: 1.8vmin;
    background-color: #FAFAFA;
    border-color: #6E6E6E;
    border-width: 0.2vmin;    
}
#connect-pwd-container, #create-password-container, #create-password-validate-container, #update-password-container {
    position: relative;
    display: block;
}
#connect-pwd-showhide, #create-password-showhide, #create-password-validate-showhide, #update-password-showhide {
    font-family: "Font Awesome 5 Free";
    position: absolute;
    display: inline-block;
    top: 17%;
    right: 4%;
    /* left: calc(50% - 3vw); */
    color: #000;
    width: auto;
    height: 3vw;
    text-align: left;    
}


input[type=text] + small,
input[type=email] + small,
input[type=password] + small {
    margin-bottom: 2vmin;
}
.form-text {
    margin-top: 0;
}
.button-generic button,
#button-connect button,
#button-contact button,
#button-retrieve button {
    position: relative;

    display: inline-block;
    width: 100%;
    height: 100%;
    margin: auto;
    margin-right: 2vw;
    color: white;
    padding: 0px;   /* Permet de centrer le texte dans le bouton (responsive) */

}

.button-generic,
#button-connect,
#button-retrieve,
#button-contact {
      position: relative;
    display: block;
    padding: 1vh 3vw;
    /* height: 3vw; */
    max-width: 400px;
    max-height: 70px;
    margin: auto;
    margin-bottom: 1vmin;
}
#button-features {
    width: auto;
    max-width: inherit;
}

#button-retrieve > label{
    text-align: center !important;
}


#content-features {
    display: none;
    height: 82vmin;
    padding-bottom: 5vmin;
    overflow-y: scroll;

    pointer-events: all;
}
#content-features h2 {
    font-weight: bold;
}
#content-features div {
    margin-bottom: 5vmin;
}
#content-features > div > img {
    width: 100%;
    margin-top: 1vmin;
}
#show-features {
    margin-top: 6vmin !important;
}
#button-student{
    margin-top: 4vmin;
}
html {
    overflow: hidden;
}
body.up {
    transform: translateY(-20vmin);
}
footer {
    pointer-events: none;
}
#return-to-form {
    position: absolute;
    top: 50%;
    right: 50px;
}
/*tidus, yuffie, elarra, ramza, */
@media screen and (max-width: 1024px) and (max-height: 600px) {
    body.up {
        transform: translateY(-40vmin);
    }
    .button-generic,
    #button-contact,
    #button-contact/*,
    #button-retrieve */{
        margin-right: 2vmin;
    }
}

#logo {
    width: 30vmin;
    margin: auto;
    margin-bottom: 4vmin;
}
/*header {
    position: fixed;
}*/

.label-connect, #login-form label {
    /*color: #888;*/
    font-family: Roboto;
    font-weight: 300;
    text-align: left;
    
	/*font-size: 60%;*/
	font-size: 0.8em;
	padding: 0.3em 0;
   	color: #000;
}

.jocastore-text {
    background-image: url(../img/v3/Logo_Jocastore.png);
    width: 6.9em;
    height: 1.5em;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat;
    line-height: 1em;
    position: relative;
    top: 0.5em;
}
/* Spécifique IE 11 et Edge */
input[type="password"]::-ms-reveal {    /* Supprime l'oeil des champs inputs */
    display: none;
}