.modal {
  position:fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:rgba(0,0,0,0.7);
  z-index:999;
  display: none;
  width:100%;
}

.modal_infos {
  width:50%;
  margin-top:-200px;
  background: green;
  color:#ffffff;
  padding:10px 20px;
  font-size: 18px;
  text-align: center;
  position:absolute;
  left:25%;
}

.modal_erreurs {
  width:50%;
  margin-top:-200px;
  background: red;
  color:#ffffff;
  padding:10px 20px;
  font-size: 18px;
  text-align: center;
  position:absolute;
  left:25%;
}

/* .modal.modal_fichier .modal_container, .modal.modal_bg .modal_container  {
  max-width: 500px;
} */

.btn_modal_fermer  {
  cursor: pointer;
}

.btn_modal_fermer img {
  height:27px;
  width:27px;
}

.modal_container{
  width:80%;
  max-width: 800px;
  background:#ffffff;
  margin: 5% auto 0;
  padding-bottom:20px;
}

.modal_header {
  background: #333333;
  display: flex;
  justify-content: space-between;
  color:#ffffff;
  padding:15px;
  font-family: FFDINWebProMedium;
  font-weight: normal;
  font-style: normal;
}
.modal_form, .modal_validation, .modal_publier, .modal_dates, .modal_terminer, .modal_validation_cat, .modal-tri, .modal_validation_tri{
  padding:20px 20px 0 20px;
  display:none
}

.form_container {
  display: flex;
}

.col_un, .col_deux {
  width:100%;
}

.col_deux {
  padding-left: 20px;
}

.col_deux p {
  margin-top:0;
}

.img_logo{
  margin-top: 20px;
}

.modal_titre {
  font-size: 20px;
}

.img_logo {
  max-width: 300px;
  max-height: 300px;
  height:auto;
  margin:50px;
}

.logo_input {
    width: 100%;
}

.upload_fichier {
  width:100%;
  margin-top:20px;
  margin-bottom:20px;
}
.upload_fichier p {
  margin-bottom: 5px;
}

.modal_form input[type="text"], .modal_form input[type="tel"], .modal_form input[type="mail"],  .modal_form select, .modal_form textarea, input.date_news, .modal-tri select {
  padding:10px;
  display: block;
  margin-bottom: 15px;
  width:calc(100% - 20px);
  font-family: FFDINWebProRegular;
  font-weight: normal;
  font-style: normal;
}

.modal_validation input[type="text"] {
  padding:10px;
  display: block;
  margin-bottom: 15px;
  width:calc(50% - 20px);
  font-family: FFDINWebProRegular;
  font-weight: normal;
  font-style: normal;
  margin-top:15px;
}

.modal_validation .alert_published {
  padding:5px;
  background:#ff6700;  
  display: inline-block;
}

.modal_validation .alert_published img {
  height:30px;
  margin-right:5px;
  float:left;
}

.modal_validation .alert_published p {
  float: left;
  margin: 5px;
  color:#fff;
}


.modal_publier input[type="text"], .modal_publier input[type="tel"], .modal_publier input[type="mail"], .modal_publier select, .modal_publier textarea, input.date_news {
  padding:10px;
  display: block;
  margin-bottom: 15px;
  width:calc(100% - 20px);
  font-family: FFDINWebProRegular;
  font-weight: normal;
  font-style: normal;
}

.modal_dates input[type="date"] {
  padding:10px;
  display: block;
  margin-bottom: 15px;
  width:calc(100% - 20px);
  font-family: FFDINWebProRegular;
  font-weight: normal;
  font-style: normal;
}

.modal_form select {
  width:100%;
}

option[disabled] {
  background:none;
}

.option_default {
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
  background: #ffffff;
}


::placeholder {
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
}
::-webkit-input-placeholder {
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
}
::-moz-placeholder {
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
}
:-ms-input-placeholder {
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
}

.validation_txt {
  font-family: FFDINWebProBold;
  font-weight: normal;
  font-style: normal;
}

.modal_validation_btn {
  display: flex;
  justify-content: space-between;

}

.modal_validation_echec:hover, .modal_validation_succes:hover {
  background:#333333;
  color:#ffffff;
}

.modal_validation_echec, .modal_validation_succes{
  padding:10px 15px;
  cursor:pointer;
  font-family: FFDINWebProMedium;
  font-weight: normal;
  font-style: normal;
}

.modal_validation_echec {
  border:1px solid #999999;
}

.modal_validation_succes {
  background:#00ff00;
}

.modal_publier .form_container {
  flex-direction: column;
}

#form_modifier_date .form_container {
  display: flex;
  flex-direction: column;
  padding-top: 20px;
}




/*******************
PROGRESS BAR
*********************/
.progress_container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top:20px;
}

#progress_bar {
  /* display: none; */
  height: 30px;
  width: 400px;
  border: 1px solid #333333;
  background:#ffffff;
}

.progress {
  background: #333333;
  height: 30px;
}

.progress_txt {
  /* display: none; */
  text-align: center;
  font-family: FFDINWebProLight;
  font-weight: normal;
  font-style: italic;
  padding-left:5px;

}




/* preload image */

.preload_img {
  background-image: url('../images/loading.gif');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50px;
  width:200px;
  height:200px;
  display: none;

}

.ajax_loader {
  display: none;
  width:300px;
  height:200px;
  position: absolute;
  left:calc(50% - 150px);
  top:calc(50% - 100px);
  color:#ffffff;
  font-size: 18px;
  text-align: center;
}

.ajax_loader  img {
  display: block;
  margin: 0 auto;
  width:100px;
  height:100px;
}


/* checkbox offre utlisateur */

.checkbox_offre {
  display: flex;
  align-items: center;
}

.checkbox_offre input {
  margin-right: 5px;
}

.offre_client_item {
  margin-bottom: 10px;
}

#form_bg .form_container {
  flex-direction:column;
}

.mail_footer {
  margin-bottom: 20px;
  padding:10px;
  border:1px solid #cccccc;
  font-size: 13px;
  opacity: 0.5;
  pointer-events: none;
}


.modal-opacity {
  position: fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:rgba(0,0,0,0.7);
  display: none;
  z-index: 99;
  cursor: pointer;

}

.client_doe_utilisateur {
  height:200px;
}