/* Onboarding exabanque */
#onboarding_exabanque {
    display: none; /*La fenêtre modale ne s'affiche pas par défaut*/
    width: 100%; /* full screen */
    height: 100%;
    background-color: rgba(0,0,0,0.7); /* Opacité 70% */
    position: fixed;
    z-index: 500;
}

/* Fenêtre modale */
.fenetre_modale {
    display: none ;
    background-color: #EDF9FC;
    margin: auto;
    width: 910px;
    height: 541px;
    margin-top: 175px;
    position: relative;
    z-index: 50;
}

.onboarding_icone_croix {
    position: absolute;
    z-index: 51; 
    left: 865px;
    top: 20px;
    cursor: pointer;
}

.onboarding_titre{
    color :#007397;
    font-family: "Source Sans Pro Semibold";
    font-size: 27pt;
    font-weight: bold;
    padding-top: 50px;
    padding-left: 55px;
}

.onboarding_legend{
    color: #FFFFFF;
    font-family: "Source Sans Pro Semibold";
    font-size: 21pt;
    font-weight: bold;
    position: absolute;
    left: 603px;
    top: 130px;
    z-index: 51; 
}

#onboarding_legend_question{
    color: #FFFFFF;
    font-family: "Source Sans Pro Semibold";
    font-size: 21pt;
    font-weight: bold;
    position: absolute;
    left: 612px;
    top: 130px;
    z-index: 51; 
}

.onboarding_texte{
    color :#454349;
    font-family : "Source Sans Pro Semibold";
    font-size: 15pt;
    line-height:  1.4em;
    font-weight: bold;
    padding-left: 55px;
}
.texte_ecran1{
    width: 445px;
}
.texte_ecran2a{
    width: 453px;
}
.texte_ecran2b{
    width: 450px;
}
.texte_ecran3{
    width: 442px;
}

.onboarding_bouton{
    color :#FFFFFF;
    font-size: 15pt;
    font-family: "Source Sans Pro Semibold";
    font-weight: bold;
    border-radius: 15px;
    height: 53px;  
    margin-top: 30px; 
    border-style : none;
    cursor: pointer;
    background-color: #007CE0 !important;
    background-image: linear-gradient(50deg, rgba(255,255,255,0) 0%, rgb(75 225 212) 100%);
    transition: background-color 250ms linear;
}
.onboarding_bouton:hover {
    background-color: rgb(75,255,212) !important;
}
.bouton_ecran1{
    margin-left: 95px;
    margin-top: 35px;
    width: 385px;
}
.bouton_ecran2a{
    margin-left: 130px;
    margin-top: 35px;
    width: 343px;
}
.bouton_ecran2b{
    margin-left: 170px;
    width: 285px;
}
#onboarding_boutons_ecran1{
    position: absolute;
    bottom: 50px;
}
.onboarding_bouton_retour{
    color : #454349;
    font-size: 13pt;
    font-family: "Source Sans Pro Italic", sans-serif;
    font-style: italic;
    background-color: #EDF9FC;
    border-style : none;
    position:absolute; 
    bottom:5px;
    left:15px;
    cursor: pointer;
}

.onboarding_img_bulle{
    position: absolute;
    left: 532px;
    pointer-events: none;
}

.onboarding_img_video{
    position: absolute;
    left: 580px;
    top: 180px;
    cursor: pointer;
}

.onboarding_icone_play{
    position: absolute;
    left: 699px;
    top: 230px;
    cursor: pointer;
}

.onboarding_video{
    position: absolute;
    left: 580px;
    top: 180px;
    width : 306px;
    height : 171px;
    border: 0;
    z-index: 1; 
}

.onboarding_img_guide{
    position: absolute;
    left: 610px;
    top: 180px;
    pointer-events: none;
}

.label_lettre_souscription_ebics {
    display: inline-block;
    width: 250px;
    padding-left: 55px;
    color :#454349;
    font-family: "Source Sans Pro Semibold";
    font-size: 15pt;
    font-weight: bold;
}

.form_lettre_souscription_ebics {
    margin-bottom: 10px;
}

.onboarding_img_tel{
    position: absolute;
    left: 620px;
    top: 215px;
    z-index: 1; 
}

.onboarding_legend_tel{
    color: #FFFFFF;
    font-family: "Source Sans Pro Semibold";
    font-size: 13pt;
    position: absolute;
    left: 690px;
    top: 215px;
    z-index: 1; 
}

.onboarding_img_mail{
    position: absolute;
    left: 620px;
    top: 275px;
    z-index: 1; 
}

.onboarding_legend_mail{
    color: #FFFFFF;
    font-family: "Source Sans Pro Semibold";
    font-size: 13pt;
    position: absolute;
    left: 690px;
    top: 269px;
    z-index: 1; 
}

.onboarding_img_aide{
    position: absolute;
    left: 620px;
    top: 325px;
    z-index: 1; 
}

.onboarding_legend_aide{
    color: #FFFFFF;
    font-family: "Source Sans Pro Semibold";
    font-size: 13pt;
    position: absolute;
    left: 690px;
    top: 326px;
    z-index: 1; 
}

#img_err_nom_banque{
    visibility: hidden;
    position: absolute;
    bottom: 29px;
    left: 293px;
    width : 15px;
    height : 15px;
    z-index: 3; 
}
.err_nom_banque {
  position: absolute;
  display: inline-block;
}
.msg_err_nom_banque {
  visibility: hidden;
  width: 350px;
  padding: 10px 0;
  top: -56px;
  left: 280px;
  background-color: white;
  font-family: "Source Sans Pro Semibold";
  font-size: 11pt;
  font-weight: bold;
  color: #EE3322;
  text-align: center;
  border: 1px solid black;
  border-radius: 10px;
  position: absolute;
  z-index: 2;
  transition: opacity 0.3s;
  text-align: left;
  text-indent: 15%;
}
.msg_err_nom_banque::before {
  content: "";
  position: absolute;
  top: 103%;
  left: 20%;
  margin-left: -6px;
  border-width: 10px;
  border-style: solid;
  border-color: black transparent transparent black;
}
.msg_err_nom_banque::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 20.0%;
  margin-left: -5px;
  border-width: 9.50px;
  border-style: solid;
  border-color: white transparent transparent white;
}
#nom_banque{
    border-color: black;
}

#img_err_charge_compte{
    visibility: hidden;
    position: absolute;
    top: 95px;
    left: 293px;
    width : 15px;
    height : 15px;
    z-index: 3; 
}
.err_charge_compte {
  position: absolute;
  display: inline-block;
}
.msg_err_charge_compte {
  visibility: hidden;
  width: 350px;
  padding: 10px 0;
  top: 81px;
  left: 280px;
  background-color: white;
  font-family: "Source Sans Pro Semibold";
  font-size: 11pt;
  font-weight: bold;
  color: #EE3322;
  text-align: center;
  border: 1px solid black;
  border-radius: 10px;
  position: absolute;
  z-index: 2;
  transition: opacity 0.3s;
  text-align: left;
  text-indent: 15%;
}
.msg_err_charge_compte::before {
  content: "";
  position: absolute;
  top: -55%;
  left: 20%;
  margin-left: -6px;
  border-width: 10px;
  border-style: solid;
  border-color: transparent transparent black black;
}
.msg_err_charge_compte::after {
  content: "";
  position: absolute;
  top: -49%;
  left: 20.0%;
  margin-left: -5px;
  border-width: 9.50px;
  border-style: solid;
  border-color: transparent transparent white white;
}
#nom_charge_compte{
    border-color: black;
}

.onboarding_input_form{
    border-radius: 0;
}