/* Feuille destyle pour la page de connexion du Moodle */

/* VARIABLES */
:root {
	--main-green-color: #1B916C;
    --main-yellow-color : #fcd364;
    --main-blue-color : #607fbf;
    --main-green-opacity-color: #1B916C;
    --main-footer-color: #f8f9fa;
}

.fond-ug {
    background: url('../assets/moodle-login-bg-universite-de-guyane.jpg');
    background-size: cover;
    background-position: center
}

.alert-msg {
	border-radius: 5px;
	padding: 10px 20px 10px 20px;	
	margin : 10px 120px 10px 120px;
	text-align: center;
	border: 1px solid;
}

.alert-msg-err {
	border-color: #FF0000;
	background-color: rgba(255, 0, 0, 0.8);
    color: #FFFFFF;
}

.bloc-middle {
    margin: 100px auto !important;
    background-color: rgba(255,255,255,.9);
}

.bloc-form {
    text-align: center;
}

.title {
    margin-top: .75rem;
    margin-bottom: .75rem;
}
.logo-title {
    max-width: 60%;
    height: auto;
}
.form h5 {
    font-weight: bold;
}

.bouton {
    padding-bottom: 10px;
}
.bouton .btn {
    padding: 10px;
    width: 90%;
}

.bouton .btn:hover {
    opacity: 0.8;
}

.btn-vert {
    background-color: var(--main-green-color) !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.btn-jaune {
    background-color: var(--main-yellow-color) !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.btn-bleu {
    background-color: var(--main-blue-color) !important;
    color: #FFFFFF !important;
    font-weight: bold !important;
}

.bouton .lien {
    text-decoration: none;
    color: #000000;
    font-size: 0.9rem;
}

.bouton .lien:hover {
    color: var(--main-green-color);
}

.formCnx .btn {
    padding: 5px;
    width: auto;
}

.element-form {
    padding-top: 10px;
}

.formCnx .element-form label {
    width: 90%;
    font-weight: bold;
    text-align: left;
}

.formCnx .element-form input {
    width: 90%;
    border: 1px solid #ced4da;
    height: calc(1.5em + .75rem + 2px);
}

.formCnx .element-form input:focus {
    border-color: var(--main-green-color) !important;
}

.formCnx .element-form input::placeholder {
    font-size: 0.8rem;
    font-style: italic;
}

/* PIED DE PAGE */
.footer {
	background-color: #00505f;
	border-top: 4px solid var(--main-green-opacity-color);
	padding: 5px 0px;
	margin-top: 10px;
	font-size: 12px;
	position: relative;
}

.container-footer {
	width: auto;
	padding: 0 20%;
	text-align: center;
}

.logininfo {
    color: var(--main-footer-color);
    text-align: left;
    font-size: 1rem;
}

footer .lien {
    text-decoration: none;
    color: var(--main-footer-color);
}

footer .lien:hover {
    text-decoration: underline;
    color: var(--main-footer-color) !important;
}

.footercontact {
    color: var(--main-footer-color);
    text-align: left;
}

.footercontact ul {
    list-style: none;
}

.footercontact li {
    font-size: 1rem;
}
.social-icon a{
    margin-right: 5px;
}
.social-icon i{
    font-size: 1.5rem;
    color: #FFFFFF !important;
}
/* mobile */
@media (max-width:680px) {
    .bloc-middle {
        width: 90% !important;
    }

    .container-footer {
        width: auto;
        padding: 0 15px;
        text-align: center;
    }
}