/*noinspection CssUnknownTarget*/
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900');

.exemple1 {
    color: #ccc;
    text-align: center;
}

.exemple2 {
    color: #fff;
    text-align: center;
    border: solid 1px #fff;
    padding: 5px;
}


#r1d1 {
    background-color: #000;
}

#r2d2 {
    background-color: #eee;
}

.flexPasswordContainer {
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.bg-form {
    background-color: #a83f43;
}

.bg-hero {
    background-color: #efe4de;
}


.Flato {
    font-family: 'Lato', sans-serif !important;
}

.FlatoL {
    font-family: 'Lato', sans-serif !important;
    font-weight: lighter;
}

.Flato400 {
    font-family: 'Lato', sans-serif !important;
    font-weight: 400;
}

.Flato700 {
    font-family: 'Lato', sans-serif !important;
    font-weight: bold;
}

.Flato900 {
    font-family: 'Lato', sans-serif !important;
    font-weight: 900;
}

/* GENERAL */

.Wlogo {
    max-width: 65%;
}

h1 {
    font-size: 30px !important;
}

h2 {
    font-size: 28px !important;
    line-height: 40px;
}

h5 {
    font-size: 18px !important;
    line-height: 22px;
}

.Upper {
    text-transform: uppercase;
}

.no-pad {
    padding: 0 !important;
}

.p20 {
    padding: 20px;
}

.pR20 {
    padding-right: 20px;
}

.pL20 {
    padding-left: 20px;
}

.p40 {
    padding: 40px;
}

.quart {
    height: 12%;
}

@media screen and (max-width: 39.9375em) {
    .quart {
        height: 0 !important;
    }
}

.alignC {
    text-align: center !important;
}

.alignR {
    text-align: right !important;
}

.alignL {
    text-align: left !important;
}

.alignJ {
    text-align: justify !important;
}

.aCenter {
    margin: auto;
}

.fw700 {
    font-weight: 700;
}

.espace10 {
    height: 10px;
}

.espace20 {
    height: 20px;
}

.espace40 {
    height: 40px;
}

.espace80 {
    height: 80px;
}

.separateur {
    border-bottom: 1px solid #ccc;
}

.width90 {
    width: 90%;
}

.Full {
    width: 100%;
}

.Hull {
    height: 100%;
}

.s10 {
    font-size: 10px;
}

.s12 {
    font-size: 12px;
}

.s14 {
    font-size: 14px;
}

.s16 {
    font-size: 16px;
}

.s18 {
    font-size: 18px;
}

.s20 {
    font-size: 20px;
}

.s22 {
    font-size: 22px;
}

.s24 {
    font-size: 24px;
}

.s28 {
    font-size: 28px !important;
}

.s30 {
    font-size: 30px;
}

.s40 {
    font-size: 40px;
}

.s60 {
    font-size: 60px;
}

.l14 {
    line-height: 14px;
}

.l16 {
    line-height: 16px;
}

.l18 {
    line-height: 18px;
}

.l20 {
    line-height: 20px;
}

.l22 {
    line-height: 22px;
}

.l24 {
    line-height: 24px;
}

.l26 {
    line-height: 26px;
}

.l28 {
    line-height: 28px;
}

.l32 {
    line-height: 32px;
}

.l34 {
    line-height: 34px;
}

.l42 {
    line-height: 42px;
}

.l60 {
    line-height: 60px;
}

/* COLOR WEAVILITY */

.bleuW {
    color: #337799;
}

.bleuC {
    color: #177e9f;
}

.Rose {
    color: #c33367;
}

.Blanc {
    color: #ffffff !important;
}

.gris {
    color: #646363;
}

.jaunelmds {
    color: #ef9024;
}

.gris {
    color: #646363;
}

/* KPI */

.b1 {
    background-color: #f2a650;
}

.b2 {
    background-color: #f29b3a;
}

.b3 {
    background-color: #ef9024;
}

.b4 {
    background-color: #000;
}

.inblock {
    display: inline-block;
}

.bright {
    border-right: solid 1px #fff;
}

.bsubmit {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    margin: 0 0 1rem;
    padding: .85em 1em;
    -webkit-appearance: none;
    border: 1px solid transparent;
    border-radius: 5px !important;
    transition: background-color .25s ease-out, color .25s ease-out;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    color: #fefefe;
}

.bsubmit:hover {
    background: var(--button-hover-background);
}


.bsign {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    margin: 0 0 1rem;
    padding: .99em 1em;
    -webkit-appearance: none;
    border: 1px solid transparent;
    border-radius: 10px;
    transition: background-color .25s ease-out, color .25s ease-out;
    font-size: .8rem;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    color: #fefefe;
}

.bsign:hover {
    color: #fff !important;
}

.bsubmit:hover {
    color: #fff !important;
}

.blocklogin {
    max-width: 380px;
    margin: auto;
}

.cleanweb-cadre {
    border: 1px solid #ccc;
}

li.feedbackPanelERROR {
    color: red;
    min-height: 16px;
    margin: 0;
    padding-bottom: 5px;
    text-align: left;
}

li.feedbackPanelINFO {
    color: green;
    min-height: 16px;
    margin: 0;
    padding-bottom: 5px;
    text-align: left;
}

.oidc {
    padding: 1em 0;
    margin: auto;
    width: 90%;
}

.oidc_ecps {
    color: #35b3ff;
    font-size: 24px;
    font-weight: bold;
    margin-right: 10px;
}

.oidc a {
    display: inline-block;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    background: #f5f5f5;
    border: 1px solid #0082c4;
    border-radius: 10px;
    padding: 7px 20px;
    color: #337ab7;
    text-decoration: none;
}

.oidc a:hover {
    background: #e2edfa;
}

.loginSeparator {
    width: 100%;
    margin: 1em 0 1.5em;
    border-bottom: 1px solid #414141;
    line-height: .1em;
}

.loginSeparator_text {
    background: white;
    padding: 1em;
}

.oidc_block .credentials_text, .loginSeparator_text {
    color: #717171;
    font-size: 12px;
}

.ssoRegistration {
    max-width: 500px;
    margin: auto;
}

.ssoRegistration .input-groupSSO label {
    display: inline-block;
    width: 120px;
    text-align: right;
    padding-right: 15px;
}

.ssoRegistration .input-groupSSO input {
    display: inline-block;
    width: 300px;
}

.otpCodeHelp {
    color: #5e5e5e;
    font-style: italic;
    margin-bottom: 20px;
    background: #eff9f2;
    padding: 5px
}

.version {
    color: #646363;
    font-size: 12px;
    text-align: center;
    font-style: italic;
    margin-top: 3px;
}

.background-image {
    background: url('../../../../images/newlogin/slide05.jpg') no-repeat right;
    background-size: cover;
    min-height:919px;
}

/* ------------------------------------------------------------------------------------------------------------------ */
/*                                           theme specifics                                                          */
/* ------------------------------------------------------------------------------------------------------------------ */

/*
 Color of the 'Login' button at the authorization page.
 */
.bsubmit {
    background-color: var(--theme-color);
}

/*
 Color of the 'Send' button at the account activation page, 'Logout' button at the disconnect user page,
 'Login' button at the forgotten login page.
 */
.bsign {
    background-color: var(--theme-color);
}
/* ------------------------------------------------------------------------------------------------------------------ */