* { -webkit-box-sizing: border-box; box-sizing: border-box; }

html { margin: 0; padding: 0; font-size: 62.5%; font-family: "Relative", Arial, sans-serif; }

body { margin: 0; padding: 0; font-size: 1.6rem; line-height: 2.1rem; color: #381A0A; background-color: #FFF; }
h1, .h1 { font-size: 3.6rem; line-height: 4.1rem; font-weight: 700; text-transform: none; margin: 0 0 32px 0; }

h2, .h2 { font-size: 3rem; line-height: 3.5rem; font-weight: 500; text-transform: none; margin: 0 0 16px 0; text-align: center}

h3, .h3 { font-size: 2.4rem; line-height: 2.7rem; text-transform: none; font-weight: 500; margin: 0 0 16px 0; }

h4, .h4 { font-size: 1.8rem; line-height: 2.1rem; text-transform: none; font-weight: 500; margin: 0 0 12px 0; }

h5, .h5 { font-size: 1.6rem; line-height: 2.1rem; text-transform: none; font-weight: 700; margin: 0 0 8px 0; }

h6, .h6 { font-size: 1.6rem; line-height: 1.8rem; text-transform: none; font-weight: 500; }

.logoEntete { 
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
	position: relative;
	width: 100%;
	padding-right: 8px;
	padding-left: 8px;   
	margin-top:20px;
	margin-bottom:20px;
}

.container {
    max-width: 100%;
    padding-left: 8px;
    padding-right: 8px;    
	margin-right: auto;
	margin-left: auto;
}

.zoneContenu { background-color: #f2f2f2; padding: 24px; }

.zoneContenuInner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: 960px; }
@media screen and (min-width: 768px) { .zoneContenuInner { width: 75%; } }
@media screen and (max-width: 767px) { .zoneContenuInner { width: calc(100% + 48px); -webkit-transform: translateX(-24px); transform: translateX(-24px); } }

@media screen and (max-width: 767px) { .zoneTitre {padding: 0 30px;} }

.zoneCompte { display: -webkit-box; display: -ms-flexbox; display: flex; }
@media screen and (max-width: 767px) { .zoneCompte { -ms-flex-wrap: wrap; flex-wrap: wrap; } }

.zoneConnexion, .zoneFranceConnect { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding: 24px 24px; background-color: #fff; }
.zoneConnexion .h1, .zoneFranceConnect .h1 { margin-top: 0; }
.zoneConnexion p, .zoneFranceConnect p { margin-top: 0; margin-bottom: 16px; text-align: center}

@media screen and (min-width: 768px) { .zoneConnexion { -ms-flex-preferred-size: 60%; flex-basis: 60%; max-width: 60%; padding: 48px 24px; } }
.zoneConnexion form { text-align: left; max-width: 360px; margin: 0 auto; margin-top: 16px;  }
.zoneConnexion .zoneBtn .btn { display: block; margin-top: 32px; width: 100%; }

.zoneFranceConnect .btnFranceConnect { margin-bottom: 8px; }
.zoneFranceConnect .btnFranceConnect:focus { outline: none; }
.zoneFranceConnect .btnFranceConnect:focus-visible { outline: 2px dashed #0052FF; outline-offset: 4px; }
.zoneFranceConnect .btnFranceConnect, .zoneFranceConnect .linkFranceConnect { -ms-flex-item-align: center; align-self: center; }

.separator { position: relative; display: block; min-height: 21px; text-align: center; margin: 24px 16px; width: 100%; }
.separator span { position: relative; display: inline-block; padding: 0 24px; background-color: #F2F2F2; z-index: 1; }
.separator:before { content: ""; display: block; width: calc(100% - 32px); position: relative; top: 10px; border-bottom: 1px solid #DDDDD4; }

.link { color: #0052FF; text-decoration: underline; }
.link:hover, .link:focus { color: #381A0A; outline: 0; }
.link:focus { outline: 2px dashed #0052FF; outline-offset: 4px; }

button { font-family: "Relative", Arial, sans-serif; font-size: 1.6rem; line-height: 2.1rem; border: 1px solid; outline: 0; background: none; cursor: pointer; }
button:focus { outline: 2px dashed #0052FF; outline-offset: 4px; }

.btn { padding: 8.5px 12px; text-decoration: none; border: 1px solid; }
.btn.primary { color: #fff; background-color: #0052FF; border-color: #0052FF; }
.btn.secondary { color: #0052FF; background-color: #FFF; border-color: #0052FF; }
.btn.tertiary { color: #381A0A; background-color: transparent; border-color: #381A0A; }
.btn.inverse { color: #381A0A; background-color: #FFF; border-color: #FFF; }
.btn:hover, .btn:focus { background-color: #381A0A; color: #FFF; border-color: #381A0A; }
.btn:focus { outline: 2px dashed #0052FF; outline-offset: 4px; }
.btn:disabled { background-color: #B0B1A6; border-color: #B0B1A6; color: #FFF !important; opacity: 1; cursor: default;}

.control-group { position: relative; }
.control-group:not(:first-of-type) { margin-top: 32px; }
.control-group.info input { border-left: 4px solid #00E8FF; padding-left: 9px; }
.control-group input { font-family: "Relative", Arial, sans-serif; font-size: 1.6rem; line-height: 2.1rem; display: block; width: 100%; border: 1px solid #381A0A; padding: 8.5px 12px; outline: 0; }
.control-group input.errorField { border-left: 4px solid #F6261B; padding-left: 9px; }
.control-group input:hover { border-left: 4px solid #381A0A; padding-left: 9px; }
.control-group input:focus { border-left: 4px solid #0052FF; padding-left: 9px; }
.control-group label { position: absolute; left: 9px; font-weight: 400; display: inline-block; padding: 0 4px; background-color: #FFF; -webkit-transition: all 0.2s; transition: all 0.2s; }
.control-group input + label { top: 10px; font-size: 1.6rem; line-height: 2.1rem; color: #8B8178; pointer-events: none; }
.control-group input:focus + label, .control-group input.filled + label { top: -10px; font-size: 1.4rem; line-height: 1.9rem; color: #381A0A; }
.control-group input:hover + label + .errorMessage, .control-group input:hover + label + * + .errorMessage, .control-group input.errorField:hover + label + .errorMessage, .control-group input.errorField:hover + label + * + .errorMessage { border-left-color: #381A0A; }
.control-group input:focus + label + .errorMessage, .control-group input:focus + label + * + .errorMessage, .control-group input.errorField:focus + label + .errorMessage, .control-group input.errorField:focus + label + * + .errorMessage { border-left-color: #0052FF; }
.control-group.info input:hover + label + .infoMessage, .control-group.info input:hover + label + * + .infoMessage { border-left-color: #381A0A; }
.control-group.info input:focus + label + .infoMessage, .control-group.info input:focus + label + * + .infoMessage { border-left-color: #0052FF; }
.control-group .errorMessage, .control-group .infoMessage { display: block; padding: 4px 0; padding-left: 8px; font-size: 1.4rem; line-height: 1.8rem; font-weight: 500; color: #381A0A; border-left: 4px solid; }
.control-group .infoMessage { border-left-color: #00E8FF; }
.control-group .errorMessage { color: #F6261B; border-left-color: #F6261B; }

.oubli { display: inline-block; margin-top: 8px; color: #0052FF; }

.zoneBtn{ text-align: center; margin-top: 32px; }

.zoneBtn #connection{ width: 100%; }

@media screen and (min-width: 768px) { .zoneBtn #connection{ max-width:240px; display: inline-block }}

.mire-connexion__compte--login h2, .mire-connexion__compte--login .h2{
    font-size: 2.8rem; line-height: 3.2rem; font-weight: 500; margin-bottom:0px;
}

#fm1 { max-width: 360px; width: 100% }

@media screen and (max-width: 767px) { #fm1 { max-width: calc(100% - 48px); } }



.g-recaptcha { margin-top: 32px; }

#msgErrGlobal.errorMessage { border-left: 4px solid #F6261B; color: #381A0A; margin-top: 32px; padding: 0; padding-left: 16px;
color: #F6261B; font-size: 1.6rem; line-height: 2.1rem; font-weight: 500; }

/* Chatbot Inbenta */
#inbenta-bot-sdk strong {
    font-weight: bold;
}
#inbenta-bot-sdk * {
     line-height: inherit; font-size: 12px;
}

/* Permet de ne pas afficher le révélateur de mot de passe dans Edge */
::-ms-reveal {
   display: none;
}

.inputEye {
   padding-right: 36px;
}

.imgEye {
   position:absolute;
   top:8px;
   right:10px;
   width:24px;
   height:24px;
   cursor:pointer;
}

/* Styles ajoutés pour l'affichage des messages */
.container-2021 {
    width: 100%;
    margin-right: auto;
    margin-left: auto
}

@media (max-width: 767px) {
    .container-2021 {
        max-width:767px;
        padding-right: 12px;
        padding-left: 12px
    }
}

@media (min-width: 767px) {
    .container-2021 {
        max-width:1040px;
        padding-right: 20px;
        padding-left: 20px
    }
}

@media (min-width: 1040px) {
    .container-2021 {
        max-width:1366px;
        padding-right: 22px;
        padding-left: 22px
    }
}

.row-2021 {
    display: flex;
    flex-wrap: wrap;
}

.row-2021>* {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%
}

@media (max-width: 767px) {
    .row-2021 {
        margin-right:-12px;
        margin-left: -12px
    }
}

@media (min-width: 767px) {
    .row-2021 {
        margin-right:-20px;
        margin-left: -20px
    }
}

@media (min-width: 1040px) {
    .row-2021 {
        margin-right:-22px;
        margin-left: -22px;
    }
}

@media (min-width: 767px) {
    .row-2021.row-mobile {
        margin:0
    }
}

.row-2021-left {
    display: flex;
    flex-wrap: wrap
}

.row-2021-left>* {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%
}

@media (max-width: 767px) {
    .row-2021-left {
        margin-left:-12px
    }
}

@media (min-width: 767px) {
    .row-2021-left {
        margin-left:-20px
    }
}

@media (min-width: 1040px) {
    .row-2021-left {
        margin-left:-22px
    }
}

.row-2021-right {
    display: flex;
    flex-wrap: wrap
}

.row-2021-right>* {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%
}

@media (max-width: 767px) {
    .row-2021-right {
        margin-right:-12px
    }
}

@media (min-width: 767px) {
    .row-2021-right {
        margin-right:-20px
    }
}

@media (min-width: 1040px) {
    .row-2021-right {
        margin-right:-22px
    }
}

.bloc-bandeau-info {
    z-index: 100;
}

.m-auto {
    margin: auto;
}

.disp-b {
    display: block;
}

@media (min-width: 1040px) {
    .col-lg-11 {
        position: relative;
        flex: 0 0 auto;
        padding-right: 22px;
        padding-left: 22px;
        width: 91.6666666667%;
    }
}

@media (min-width: 767px) {
    .col-md-12 {
        position: relative;
        flex: 0 0 auto;
        padding-right: 20px;
        padding-left: 20px;
        width: 100%;
    }
}

@media (min-width: 0px) {
    .col-sm-12 {
        position: relative;
        flex: 0 0 auto;
        padding-right: 12px;
        padding-left: 12px;
        width: 100%;
    }
}

.bloc-bandeau-info .bandeau-alert,
.bloc-bandeau-info .bandeau-information {
    background-color: #fff;
    padding: 10px;
    margin-top: 10px;
    position: relative;
    border-top: solid 1px #ddddd4;
    border-right: solid 1px #ddddd4;
    border-bottom: solid 1px #ddddd4;
}

.bloc-bandeau-info .bandeau-information {
    border-left: 4px solid #00e8ff;
}

.bloc-bandeau-info .bandeau-alert {
    border-left: 4px solid #ED0603
}

.m-b-20 {
    margin-bottom: 20px;
}

.disp-f {
    display: flex;
}

p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

[class^="ag2ricon-"],
[class*=" ag2ricon-"] {
    font-family: 'pictoteque-ag2r' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.txt-32 {
    font-size: 3.2rem;
    text-transform: inherit;
    font-weight: 400;
    line-height: 3.6rem;
}

.ag2ricon-information:before {
    content: "\e968";
}

.ag2ricon-alert:before {
    content: "\e907"
}

*,
:after,
:before {
    box-sizing: border-box;
}

.m-l-16 {
    margin-left: 16px;
}

.m-r-30 {
    margin-right: 30px;
}

.txt-14 {
    font-size: 1.4rem;
    text-transform: inherit;
    font-weight: 400;
    line-height: 1.8rem;
}

.m-r-10 {
    margin-right: 10px;
}

.col-align-center-v {
    margin-top: auto;
    margin-bottom: auto;
}

.txt-16-md {
    font-size: 1.6rem;
    text-transform: inherit;
    font-weight: 500;
    line-height: 2rem;
}

.bloc-bandeau-info .bandeau-alert .bandeau-contenu .contenu-txt,
.bloc-bandeau-info .bandeau-information .bandeau-contenu .contenu-txt {
    margin-top: 4px;
}

.txt-16 {
    font-size: 1.6rem;
    text-transform: inherit;
    font-weight: 400;
    line-height: 2rem;
}

.p-r-20 {
    padding-right: 20px;
}

.bloc-bandeau-info .bandeau-alert .picto-close,
.bloc-bandeau-info .bandeau-information .picto-close {
    cursor: pointer;
    position: absolute;
    right: 10px;
}

[class^="ag2ricon-"],
[class*=" ag2ricon-"] {
    font-family: 'pictoteque-ag2r' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.txt-28 {
    font-size: 2.8rem;
    text-transform: inherit;
    font-weight: 400;
    line-height: 3.2rem;
}

.cl-marron {
    color: #381a0a;
}

.bt-lien {
    background-color: transparent;
    border: none;
}

button {
    font-family: "Relative", Arial, sans-serif;
    font-size: 1.6rem;
    line-height: 2.1rem;
    border: 1px solid;
    outline: 0;
    background: none;
    cursor: pointer;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

.ag2ricon-croix:before {
    content: "\e928";
}

.bloc-bandeau-info .bandeau-alert .picto-close,
.bloc-bandeau-info .bandeau-information .picto-close {
    cursor: pointer;
    position: absolute;
    right: 10px;
}

[class^="ag2ricon-"],
[class*=" ag2ricon-"] {
    font-family: 'pictoteque-ag2r' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.txt-28 {
    font-size: 2.8rem;
    text-transform: inherit;
    font-weight: 400;
    line-height: 3.2rem;
}

.cl-marron {
    color: #381a0a;
}