/*
Theme Name: Facile2Soutenir
Description: PRODUCTION
Version: 6.0
Author: JM AUBERT
Author URI: https://www
Template: enfold

>>>>>>>>>>>>>>>>>>>>>>>>>>> PRODUCTION <<<<<<<<<<<<<<<<<<<<<<<<<<<

*/


/* FONTS */
@font-face {
    font-family: 'Roboto Light';
    src: url('fonts/roboto-light/roboto-light.woff2') format('woff2'),
         url('fonts/roboto-light/roboto-light.woff') format('woff'),
         url('fonts/roboto-light/roboto-light.ttf') format('truetype'),
         url('fonts/roboto-light/roboto-light.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/open-sans/opensans-regular-webfont.eot');
    src: url('fonts/open-sans/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/open-sans/opensans-regular-webfont.woff2') format('woff2'),
         url('fonts/open-sans/opensans-regular-webfont.woff') format('woff'),
         url('fonts/open-sans/opensans-regular-webfont.ttf') format('truetype'),
         url('fonts/open-sans/opensans-regular-webfont.svg#opensansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@import url('https://fonts.googleapis.com/css?family=Roboto:300');



body, table, td {font-size:17px; font-family: 'Roboto','Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;}
#main { background-color: #f5f7ff !important; /*background-color: #ecf1f7 !important;*/}
.top {background-color:#f5f7ff !important; vertical-align: top !important; }  /* ajouté partout sauf sur landing page, dans header.php */
.main_color {background-color: #f5f7ff !important;}

#advanced_menu_toggle {display:none;}
#advanced_menu_hide {display:none;}

@media only screen and (max-width: 768px){
      body {font-size:14px;}
      h1 {font-size: 2em;}
}
@media only screen and (max-width: 414px){
      body {font-size:12px;}
}
p {line-height: 1.3; margin:0.5em 0;font-size:1em;}
li {line-height: 1.3; /*margin:0.5em 0;*/font-size:1em;}


/********************************************************************************/
/********************************************************************************/
/**************************            TEMP            ************************/
/********************************************************************************/
/********************************************************************************/

.mea_undermenu {
    background-color:#deb;
	padding: 0.5em;
}

.legende800 {max-width: 800px; text-align: left;}
@media only screen and (max-width: 1000px){.legende800 {max-width: 600px;}}
@media only screen and (max-width: 768px){.legende800 {max-width: 800px; text-align: center;}}





/********************************************************************************/
/********************************************************************************/
/**************************            GLOBAL            ************************/
/********************************************************************************/
/********************************************************************************/

.image-overlay {visibility: hidden;}
.container_wrap > .container {padding:0 !important;}
.container_wrap .container .content {padding:0 !important; border:0 !important; margin-right:0 !important} /* enleve le padding de 50 sur les cotés */
.sidebar_left .content {margin-left:0;}

/********************        HEADER         *****************/

#header_main {box-shadow: 0 1px 5px 2px #8e8e8e !important; background-color: #fcfcff; /*background-color: #fdfdfd;*/}
#header_main > .container {padding:0 !important;}
#header_main .container {height: 62px !important;}
#main {padding-top:62px !important;}
.logo {left: 50% !important; margin-top:5px!important; position: absolute!important;  margin-left: -37px;}
.responsive .logo img {height: auto !important;    width: auto;    max-width: 100%;    display: inline-block;    max-height: 50px;}
 

/********************        FOOTER          *****************/

#footer .container { max-width: 1200px; margin: auto;} 
#footer .flex_column {width: 25%; clear: initial; margin: 0;border-left: 1px solid rgba(255, 255, 255, 0.2) !important;min-height: 300px;padding: 0px 1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;vertical-align: top;display: inline-block;text-align: center;}
#footer .flex_column li a  {font-size: 0.8em;color: #fff !important;display: inline-block;position: relative;opacity: .5;transition: all .5s ease;}
#footer .flex_column li a:after {content: '';display: block;margin: auto;height: 1px;width: 0px;background: transparent;transition: width .5s ease, background-color .5s ease;}
#footer .flex_column li a:hover:after { width: 100%; background: #fff;}
#footer .flex_column li a:hover {opacity: 1; color:white;}
#footer .flex_column p {font-size: .7em;color: #acacac;}
#footer .flex_column .logo-sociaux {width:2.5em; margin: 5px;}
#footer .widget {  margin: 0 !important;   padding: 1em 0 0 0 !important;}
#footer a {text-decoration: none !important;}
#footer a:hover{ opacity: 1;}
#footer h3 { font-weight: normal; font-size:1.2em;}
#footer .first {border-left: 0 !important;}

#socket .container {    max-width: 1200px;    margin: auto;}
#socket img {vertical-align: middle; width: 30px; margin-right:20px; }
#socket .first {border-left: 0 !important;}

@media only screen and (max-width: 767px) {
      #footer .flex_column {border:0;min-height: unset; margin-bottom:0 !important;}
      #footer .flex_column li {display: inline-block;  line-height: .9em;  font-size: .9em;  vertical-align: middle;}
      #footer .flex_column li a  {padding: 0 0.7em;}
      #footer .flex_column h3 {display:none;}
      #footer .flex_column .image-icone {display:none;}
      #footer .widget {padding-top: 0 !important;}
}
@media only screen and (max-width: 414px) {
      #footer .flex_column li {display: block; padding: 0.4em 0;}
}


/********************        SOCKET          *****************/

#socket {padding:0.6em 0;}





/********************        SUBHEADERS           *****************/
.subheader-container {min-height:250px; padding:2em 0; text-align: center;  }
@media only screen and (max-width: 768px) {
      .subheader-container {min-height: initial;}
      #toutes-les-associations .subheader-container {min-height: 250px;}
}
.subheader {max-width: 1200px; margin:auto; display: block; /*border-top: 1px solid #e6e6e6;border-bottom: 1px solid #e6e6e6;*/}
.subheader-box {padding:1.5em; max-width:500px; margin: auto; background-color:rgba(255,255,255,0.5); }
.subheader-box h1 {margin: 0 0 .5em 0; font-size: 2em;}




/********************        MODAL LOGIN BOX          *****************/

.facebook-bouton-1{color: #ffffff !important;background-color: #3463a2;border-color: rgba(0,0,0,0.2) !important;display: inline-block;margin: auto;border-radius: 3px;max-width: 320px;text-align: left;}
.facebook-bouton-1:focus,
.facebook-bouton-1:hover,
.facebook-bouton-1:active{background-color:#2d4373; text-decoration:none;}
.facebook-bouton-logo {max-height: 50px; max-width : 50px;vertical-align: middle;padding: 3px;}   
.facebook-bouton-texte {max-width : 270px; font-size: 15px;display: inline-block;vertical-align: middle;padding: 5px 15px 5px 0px;}


.modal-login-box {position: fixed;z-index: 502;right: 20px;top: 80px;}
@media only screen and (max-width: 414px) {
	.modal-login-box {right: 0; left: 0; margin: 0.5em;}
}
    



/********************        CORRECTIONS PLUGINS         *****************/
/* CORRECTIONS PODS */
.pods-form-front-success {display:none !important;} /* obligé pour éviter l'affichage si plusieurs formulaire sur meme page. ex : mes causes */

/*  CORRECTIONS  GF  */
.validation_error {display:none;}





/*=======================================================================
=========================================================================
====================== ELEMENTS DE MISE EN PAGE =========================
=========================================================================
=========================================================================*/

.center {text-align: center !important;}
.hide {display:none !important;}
.mw600 {max-width:600px;  margin-left: auto; margin-right: auto;}


.ma {display:inline-block;vertical-align:middle;}
.cma {display:inline-block;vertical-align:middle; text-align: center;}
.ta {display:inline-block;vertical-align:top;}
.cta {display:inline-block;vertical-align:top; text-align: center;}
.page-statique {max-width:1200px !important; margin:auto; color:#5e5e5e; background-color: #ffffff;}   /* test fond blanc pour ??? => pas top pour les pages applis*/

.mw800 {max-width:800px;  margin-left: auto; margin-right: auto;}
.mw1000 {max-width:1000px;  margin-left: auto; margin-right: auto;}
.mw1200 {max-width:1200px;  margin-left: auto; margin-right: auto;}

.fright {float: right;} /*menu*/


/* ==========================   BOUTONS   ============================= */


.bouton {border-radius: 3px;margin:0.3em;text-align: center;color:white !important;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;   transition: all .3s ease; text-decoration:none !important; line-height: 1.3;}


.bouton:hover {text-decoration:none !important; cursor: pointer;}
.bouton-inverse {border-radius: 3px;margin: 0.3em;text-align: center;color: #adadad !important;transition: background-color 0.2s ease-in-out!important;text-decoration: none !important;line-height: 1.3;border: 1px solid #adadad !important;}
.bouton-inverse:hover {background-color: #efefef; color: #848484 !important;}


.bouton-block  {display:block;}


.bouton-vert { background-color: #00B050; border:2px solid #00B050 !important;} /*details asso*/
.bouton-vert:hover {background-color:#009543; border:2px solid #009543 !important;}
.bouton-bleu { background-color: #4B7DD7;} 
.bouton-bleu:hover {background-color:#285ab7 !important;} /*sinon ca ne marche pas sur la landing */
.bouton-bleu-degrade {transition: none!important; background: #4ba8ff;background: -moz-linear-gradient(top, #4ba8ff 0%, #0d8cff 10%);background: -webkit-linear-gradient(top, #4ba8ff 0%,#0d8cff 10%);background: linear-gradient(to bottom, #4ba8ff 0%,#0d8cff 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ba8ff', endColorstr='#0d8cff',GradientType=0 );} 
.bouton-bleu-degrade:hover {background:#0285fb !important;}

.bouton-bleu-degrade2,
.submit-bleu input[type="submit"]{/*border: 1px solid #4ba8ff !important;*/background: #4ba8ff!important;-webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;   transition: all .3s ease; background: -moz-linear-gradient(top, #4ba8ff 0%, #0d8cff 10%)!important;background: -webkit-linear-gradient(top, #4ba8ff 0%,#0d8cff 10%)!important;background: linear-gradient(to bottom, #4ba8ff 0%,#0d8cff 100%)!important;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ba8ff', endColorstr='#0d8cff',GradientType=0 )!important;}
.bouton-bleu-degrade2:hover,
.submit-bleu input[type="submit"]:hover{box-shadow: 0 0 0 5px rgba(13,140,255,0.3);/*border: 1px solid #077eef !important;*/}

.bouton-orange { background-color: #ff8800;} /*liste marchands inscription-asso */
.bouton-orange:hover { background-color: #b76000 !important;} /*sinon ca ne marche pas sur la landing */
.bouton-orange-degrade {transition: none!important; color: white;background: #ff8800;background: -moz-linear-gradient(top, #ff8800 0%, #ffaa00 10%);background: -webkit-linear-gradient(top, #ff8800 0%,#ffaa00 10%);background: linear-gradient(to bottom, #ff8800 0%,#ffaa00 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8800', endColorstr='#ffaa00',GradientType=0 );} 
.bouton-orange-degrade:hover {background:#ff6c00 !important;}
.bouton-orange-degrade2,
.pods-form-pod-associations .pods-file-add {webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;   transition: all .3s ease;/*border: 1px solid #ff9000 !important;*/color: white;background: #ff9000 !important;background: -moz-linear-gradient(top, #ffa000 0%,#ff9000 100%) !important;background: -webkit-linear-gradient(top, #ffa000 0%,#ff9000 100%) !important;background: linear-gradient(to bottom, #ffa000 0%,#ff9000 100%) !important;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa000', endColorstr='#ff9000',GradientType=0 ) !important;}
.bouton-orange-degrade2:hover,
.bouton-orange-degrade2:focus,
.pods-form-pod-associations .pods-file-add:hover{outline: unset;box-shadow: 0 0 0 5px rgba(255,136,0,0.3) !important;background: #ff8000 !important;background: -moz-linear-gradient(top, #ff9000 0%,#ff8000 100%) !important;background: -webkit-linear-gradient(top, #ff9000 0%,#ff8000 100%) !important;background: linear-gradient(to bottom, #ff9000 0%,#ff8000 100%) !important;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9000', endColorstr='#ff8000',GradientType=0 ) !important;}

.bouton-gris-degrade2 {webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;   transition: all .3s ease;/*border: 1px solid #777777 !important;*/color: white;background: #777777 !important;background: -moz-linear-gradient(top, #888888 0%,#777777 100%) !important;background: -webkit-linear-gradient(top, #888888 0%,#777777 100%) !important;background: linear-gradient(to bottom, #888888 0%,#777777 100%) !important;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#888888', endColorstr='#777777',GradientType=0 ) !important;}
.bouton-gris-degrade2:hover,
.bouton-gris-degrade2:focus {outline: unset;box-shadow: 0 0 0 5px rgba(108,108,108,0.3) !important;background: #6c6c6c !important;background: -moz-linear-gradient(top, #777777 0%,#6c6c6c 100%) !important;background: -webkit-linear-gradient(top, #777777 0%,#6c6c6c 100%) !important;background: linear-gradient(to bottom, #777777 0%,#6c6c6c 100%) !important;filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#777777', endColorstr='#6c6c6c',GradientType=0 ) !important;}

.bouton-avec-icone i {font-size: 1.2em; vertical-align: text-bottom;}
.bouton-avec-icone {padding-right: 0.5em;}

.bouton-max300{max-width: 300px;}
.bouton-max200{max-width: 200px;}

.bouton-milieu-bas {position: absolute; bottom:0; left:0; right:0;}
.box-2 input[type="submit"] {width: 100%; margin: 1em 0; font-size:1em;}
.bouton-submit-100 {width: 100%; margin: 1em 0; font-size:1em;} /* mon compte */
.bouton-apres-titre {display: inline-block; vertical-align:middle; margin: 0px 0 0px 1em; } /*mes achats */
.bouton-mini { padding: 5px 8px; font-size: 11px;}

.bouton-large {padding: 0.3em 1.2em; font-size: 0.95em; }
.bouton-large2 {padding: 0.6em 1.2em;  font-size: 1.2em; }
.bouton-moyen {padding: 0.4em 0.8em; font-size: 0.9em;}
.bouton-moyen2 { padding: 0.6em 0.8em;  font-size: 0.9em;}
.bouton-petit {padding:0.3em 10px; font-size: 12px; }


/* ==========================   LISTES   ============================= */

ul {margin:0;}
.list-dash {list-style-type: none;} /* boiet à outil - site web */
.list-dash  li {text-indent: -15px;margin-left: 30px;line-height: 1.3;margin-top: 5px;}
.list-dash li:before {content: "-"; margin-right: 10px;}
/*li:before {content: "-"; margin-right: 10px;} SUREMENT PAS ! y'en a partout... */


/* ==========================   FONTS   ============================= */

h1 { font-size: 2.5em; margin: 0.6em 0; font-weight:normal; line-height: 1.3; font-family: 'Roboto Light', 'Roboto', 'Open Sans', 'Arial'; }
h2 { font-size: 2em; margin: 0.8em 0; font-weight: normal; line-height: 1.3;  font-family: 'Roboto Light', 'Roboto', 'Open Sans', 'Helvetica', 'Arial', 'sans-serif';}
h3 { font-size: 1.5em; margin: .5em 0; font-weight: bold;  text-transform:none !important; }
h4 { font-size: 1.3em; margin: 0.3em 0; font-weight: bold;  text-transform:none !important; letter-spacing: -0.015em!important;}
h5 { font-size: 1em; margin: 0.2em 0; font-weight: bold; }
h6 { font-size: 1em;  margin: 0.2em 0; font-weight: bold; line-height: 1.2; text-transform:none !important; letter-spacing: -0.015em!important; }
.inverse h1,
.inverse h2,
.inverse h3,
.inverse h4,
.inverse h5,
.inverse h6 {color:white !important;}
            
.inverse h3,
.inverse h4,
.inverse h5,
.inverse h6 {font-weight:normal !important;}			
			
.inverse p {color:white !important;}
.inverse a {color:white !important;}
a.inverse {color:white !important;}

.sous-titre {font-weight: bold; text-align: center;text-transform: uppercase;color: #2196F3; margin:0.6em 0; font-size:1.2em;}  /*redirection install terminée && connexion && inscrip asso && gere la page && inscription*/ 
.sous-titre2 {font-weight: bold; text-align: center;color: #2196F3; margin:0.6em 0; font-size:1.2em;}  /*facebook login error*/ 
.commentaire {font-size: .85em; text-align: center; font-style: italic; padding: 0 .2em; margin-top: .2em;  color: #787878 !important;}   /*redirection install terminée && connexion  && TDB asso && erreur FB */

.footnote-transparent {padding: 0 .6em; font-size: .75em; margin: 1em 0;} /* tous formulaires */
.footnote-normal {padding: 0 .6em; font-size: .75em; margin: 1em 0; color: #3463a2;}
 
                        


/* ==========================   BOX   ============================= */


.container_100vh{flex-direction:column;background-color:#ecf1f7;min-height: 100vh;padding-bottom: 120px;display: flex;align-items: center;justify-content: center;} /* connexion / reinitialisation / redirection marchand */
@media only screen and (max-width: 414px) {.container_100vh {padding-bottom: 0px;}}
@media only screen and (max-width: 768px){container_100vh {padding-bottom: 170px;}}

.box-v6{border-radius: 3px;border: 1px solid #e6e6e6;padding: 1.5em ;background-color: #ffffff;margin: 1em 0;box-shadow: none;}  /* connexion / reinitialisation / insc asso / Application installation terminee / FB erreur */
@media only screen and (max-width: 500px){.box-v6{padding: 15px;}}


.box-cat{background-color: #787878;padding: 0.3em 0.6em;display: inline-block;border-radius: 2px;  margin: 0.15em 0.3em 0.15em 0; text-decoration:none;} /*marchands & asso */
.box-cat p {font-size:0.9em;}

/* comment ca marche - accueil non connecte - landing */
.background-degrade-bleu { background: #478cff;background: -moz-radial-gradient(center, ellipse cover, #43a5fd 5%,#0037ff 100%);background: -webkit-radial-gradient(center, ellipse cover, #43a5fd 5%,#0037ff 100%);background: radial-gradient(ellipse at center, #43a5fd 5%,#0037ff 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43a5fd', endColorstr='#0037ff',GradientType=1 );}
.background-degrade-bleu-2 {background-color: #009cde;background-image: radial-gradient(circle farthest-side at center bottom,#009cde,#003087 125%)}
.background-degrade-bleu-blanc-1 {background-color: #a9c7ff;background:radial-gradient(circle farthest-side at center center ,#ffffff,#378aff 110%);}
.background-degrade-bleu-blanc-2 {background-color: #a9c7ff;background:radial-gradient(circle farthest-side at center center ,#ffffff,#6499fb 110%);}

.background-bleu-clair {background-color: #eff7ff !important;}
.background-bleu {background-color: #2196F3;}
.background-orange {background-color: #ff8800;}


      
      
.box-3 {padding: .6em 1.2em; background-color: rgb(245,245,245);  border-radius: 4px; border: 1px solid #e2e2e2 !important; margin: 1em auto;} /* mon compte - mon asso */
.box-3b {margin: 1em 0; padding: 1em 0.5em 1.5em; border: 1px solid #dcdcdc; background: #f5f7ff; text-align: center;} /* mes achats § soutenir */




/* ==========================   TABLEAUX   ============================= mon-asso-versements | mon-compte-soutenir | mes achats */


.tableau-1 {border:none; background-color:transparent !important; max-width:600px; line-height: 1.3;}  /* mes achats / mon asso */ /* historique dons */
.tableau-1 tr {background-color:transparent !important;}
.tableau-1 .donnee td {height:45px; padding: 0 10px;background-color:transparent; vertical-align: middle; border:0 !important;  color: #5a5a5a !important; max-width: 260px;  overflow: hidden;  text-overflow: ellipsis;}
tr.donnee:hover td {background-color:#deebf7 !important;}
.tableau-1 .donnee {background-color: rgb(245,245,245) !important;}
.tableau-1 .donnee td.c_etat {text-align:right; font-size: 0.8em; border-right:5px solid !important; width:100px; background-color:#fff !important;}
.tableau-1 .donnee td.c_date {width:60px;}
.tableau-1 .donnee td.c_marchand {min-width:30%;}
.tableau-1 .donnee td.c_destinataire {min-width:30%;}
.tableau-1 .donnee td.c_remboursement {text-align:right; font-size: 1.15em; }
.tableau-1 .donnee td.c_don {text-align:right; font-size: 1.15em; }
.tableau-1 .donnee td.c_recu img{max-width:40px; vertical-align: middle;}
.tableau-1 .donnee td.c_resultat {line-height: 1.2; }
.tableau-1 .separateur td {background-color:transparent !important; border:0 !important; padding:3px;}
.tableau-1 th {text-transform: none; letter-spacing: normal;border:0 !important; vertical-align: middle; background-color:transparent !important;}

@media only screen and (max-width: 414px) {
      .tableau-1 .donnee td { padding: 0 5px !important; }
      .tableau-1 .donnee td { max-width: 120px; }
}

.dated-item {width: 35px;height: 40px;background: #89969f;border-radius: 3px;text-align: center;color: #fff;}
.dated-item-top {height: 20px;width: 100%;font-size: 12px;line-height: 20px; border-radius: 3px 3px 0 0;}
.dated-item-bottom {height: 20px;line-height: 18px;font-weight: 300;font-size: 12px; background: rgba(255,255,255,0.45);}      




/* ==========================   LOGOS CONTAINERS   ============================= */ /* accueil - landing */

.logos-marchands {max-width: 1200px; text-align: center;margin: 1em auto;}
.logos-marchands a { display: inline-block;}
.logos-marchands img{ border-radius: 3px; vertical-align: middle;}
.marchand-logo-container {position: relative; border: 1px solid #d0d0d0;background-color: white;display: inline-block;vertical-align: middle;text-align: center;width: 120px;height: 120px;line-height: 120px;  margin:0.2em; padding: 0 0.2em ;border-radius: 0.2em;}
.marchand-logo-container .text-over {    /* opacity: 0; */
    position: absolute;
    opacity:0;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    line-height: 114px;
    height: 118px;
    background-color: rgba(33, 150, 243, 0.85);
    color: white;
    z-index: 1;
    cursor: pointer;
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}
.marchand-logo-container:hover .text-over { opacity: 1.0;}
.marchand-logo-container .text-over > div {vertical-align: middle; line-height: 1; display: inline-block;}

.marchand-logo-container img {vertical-align: middle;     padding-bottom: .4em; } 
@media only screen and (max-width: 768px) {
      .marchand-logo-container {width: 100px; height: 100px; line-height: 98px;}
      .marchand-info-container {width: 100px;}
      .marchand-logo-container .text-over { line-height: 96px; height: 98px;}
}
@media only screen and (max-width: 414px) {
      .marchand-logo-container {width: 80px; height: 80px; line-height: 78px;}
      .marchand-info-container {width: 80px;}
      .marchand-logo-container .text-over { line-height: 76px; height: 78px;}
      .logos-marchands { padding: 0;}
}




/* ==========================   SIDEBARS   ============================= */
#top #main .sidebar {padding-top: 1em; border: 0;}
.inner_sidebar { margin-left: 1em;}
.inner_sidebar h6{ text-align: center; color: rgb(127,127,127) !important;} /*marchands favoris / visites */
            
.sidebar-box {border-radius:4px; border: 0; margin: 0 0 1em; padding: 0.6em; text-align: center;max-width: 300px;}
.sidebar-box img {display: block;margin: .5em auto;}
.box-bleu-degrade2{
    background: #158eff!important;
    background: -moz-linear-gradient(top, #4ba8ff 0%, #0368c3 10%)!important;
    background: -webkit-linear-gradient(top, #4ba8ff 0%,#0368c3 10%)!important;
    background: linear-gradient(to bottom, #4ba8ff 0%,#0368c3 100%)!important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ba8ff', endColorstr='#0368c3',GradientType=0 )!important;
    color: white;
}




/* ============================ FORMULAIRES ============================ */

.formulaire-2 {padding: .5em 1em; background-color: rgb(245,245,245); border-radius: 4px; border: 1px solid #e2e2e2 !important;}
.formulaire-2 ::-webkit-input-placeholder { font-family:'Roboto', 'Open Sans';}
.formulaire-2 :-moz-placeholder { font-family:'Roboto', 'Open Sans'; }
.formulaire-2 ::-moz-placeholder { font-family:'Roboto', 'Open Sans'; }
.formulaire-2 :-ms-input-placeholder { font-family:'Roboto','Open Sans'}
.formulaire-2 label.rad { font-weight: normal !important; font-size: .9em !important; margin-right: 1em !important; vertical-align: middle;}
.formulaire-2 label {font-size: 0.7em !important; color: #8c8c8c; text-transform: uppercase; line-height: 0.7em; padding-left: 0.1em;}
.formulaire-2 input[type='text'],
.formulaire-2 input[type='password'],
.formulaire-2 input[type="email"],
.formulaire-2 textarea,
.formulaire-2 select {padding: 0.8em 0.6em!important;font-size: 0.9em!important;margin-bottom: 0.3em!important;border-radius: 4px!important;}
.formulaire-2 input[type="checkbox"],
.formulaire-2 input[type="radio"] {height: 1.5em;width: 1.5em !important; margin:0.3em 0; vertical-align: middle;margin: 0.3em 0.3em 0.3em 0;}

.formulaire-erreurs {border-top: 1px solid red !important;padding-top: 5px;color: red;font-weight: bold;margin-top: 15px;}
.formulaire-erreurs p {margin: 0.4em 0.2em;  line-height: 1.1;  font-size: 0.75em;}


/* LANDING V8 & CONNEXION v8 */
.formulaire-transparent {max-width:300px;  margin:1em auto;  text-align:left;}
#top .formulaire-transparent input[type="text"],
#top .formulaire-transparent input[type="password"] {font-family:'Roboto Light'; border: none; border-radius:0; background-color: transparent !important;font-size: 1.2em;margin: 0;padding: 0.5em 0.1em;outline: none;box-shadow: none;color:white !important;}
#top .formulaire-transparent input[type="text"] { margin-top: 1em; border-bottom: 1px solid rgb(180, 180, 180);}
#top .formulaire-transparent input[type="password"] { margin-bottom: 1em;}
#top .formulaire-transparent input[type="submit"] { width:100%;}
.formulaire-transparent ::-webkit-input-placeholder { color:rgb(180,180,180);}
.formulaire-transparent :-moz-placeholder { color:rgb(180,180,180);}
.formulaire-transparent ::-moz-placeholder { color:rgb(180,180,180); }
.formulaire-transparent :-ms-input-placeholder { color:rgb(180,180,180);} 
.formulaire-transparent .icon-enveloppe  {position: absolute;left: -1.5em;top: 0.75em;font-size: 1.2em; color:white;}
.formulaire-transparent .icon-cadenas {position: absolute;left: -1.35em;top: 0.65em;font-size: 1.2em; color:white;}
.formulaire-transparent-erreur {border-top: 1px solid red !important; padding: 0.3em; color: red; margin-top: 1em; background-color: rgba(255,0,0,0.2);}
.formulaire-transparent-erreur p {line-height: 1.1;font-size: 0.75em;}

@media only screen and (max-width: 414px) {
      .formulaire-transparent { max-width: 220px;}
}

/* insc & reini & Application installation terminee  & inscrip asso*/
.container-form-v6{max-width: 360px;width: 100%;margin-right: auto;margin-left: auto;}
.container-form-header {margin-top:0.6em; text-align: center;}
.container-form-header h1 {/* ou sont les H1 ? */color: #55575d;font-size: 1.3em;margin: 5px 0;line-height: normal;text-transform: none !important;font-weight: normal;letter-spacing: normal !important;padding: 0 !important;font-family: 'Roboto', 'Open Sans', 'Arial';}
.container-form-header .form-logo {max-width:120px; display: inline-block;}
#top .container-form-v6 ::-webkit-input-placeholder { color:rgb(180, 180, 180); font-size:17px;}
#top .container-form-v6 :-moz-placeholder { /* Firefox 18- */ color:rgb(180,180,180); font-size:17px;}
#top .container-form-v6 ::-moz-placeholder {  /* Firefox 19+ */ color:rgb(180,180,180); font-size:17px;}
#top .container-form-v6 :-ms-input-placeholder { color:rgb(180,180,180); font-size:18px;}
@media only screen and (max-width: 400px){
      .container-form-v6{max-width: 300px; margin: 0.3em auto;}
      .container-form-header .form-logo { max-width: 100px;}         
}
p.login-remember{ display:none;}
.oubien {color: #787878; text-align: center; margin: 15px 0 !important;}
.lien-formulaire {display: block; margin-bottom: 5px; text-align: center;}






/* ============================  MODALS ET TUTORIAUX ============================== */

.tooltip-gauche:after {content: '';position: absolute;border-style: solid;display: block;width: 0;top: 25px;left: -22px; border-width: 10px 20px 10px 0; border-color: transparent #ffffff;}
.tooltip-droite:after {content: '';position: absolute;border-style: solid;display: block;width: 0;top: 25px;right: -22px; border-width: 10px 0 10px 20px; border-color: transparent #ffffff;}
.tooltip-haut-gauche:after {content: '';position: absolute;border-style: solid;display: block;width: 0;top: -22px;left: 12px; right: auto; border-width: 0px 10px 20px 10px; border-color: #ffffff transparent;}
.tooltip-haut-centre:after {content: '';position: absolute;border-style: solid;display: block;width: 0;top: -22px;left: 48%; right : auto; border-width: 0px 10px 20px 10px; border-color: #ffffff transparent;}
.tooltip-haut-droite:after {content: '';position: absolute;border-style: solid;display: block;width: 0;top: -22px;left: auto; right : 12px; border-width: 0px 10px 20px 10px; border-color: #ffffff transparent;}
.tooltip-bas:after {content: '';position: absolute;border-style: solid;display: block;width: 0;bottom: -87px; left: 48%; border-width: 20px 10px 0 10px; border-color: #ffffff transparent;}
@media only screen and (max-width: 768px) {
.tootip-gauche:after { top: -15px; right: 30px; left: auto; border-color: #0d8cff transparent; border-width: 0px 10px 20px 10px;}
}
.modal4 {font-family: roboto!important;border-radius: 6px;box-shadow: 0 0 30px 1px rgba(0,0,0,0.5);padding: 0!important;border: 0 !important;overflow: visible;margin: .6em 0 !important;}
.modal4 .ui-dialog-titlebar {display: none;}
.modal4 .ui-dialog-content {overflow: visible;font-size: 0.9em;color: #3c434a;background: #deebf7;border: 5px solid white; border-bottom: 0; box-shadow: none;padding: .7em;line-height: 1.3;border-radius: 6px 6px 0 0;}
.modal4 .ui-dialog-content h2 { margin: 0 0 0.6em 0;}
.modal4 .ui-dialog-content .modal-close-interne {position: absolute;top: 5px;right: 5px;font-size: 0.9em;color: #909090;cursor: pointer;}
.modal4 .ui-dialog-content .modal-close-interne:hover {color: #505050;}
.modal4 .ui-dialog-content .modal-close-interne .icon-fermer {font-size: 1.4em;}
.modal4 .ui-dialog-buttonpane {text-align: center;margin: 0 !important;border: none!important; background: none;}
.modal4 .ui-dialog-buttonpane .ui-dialog-buttonset { /* float: none !important; text-align: center;*/}
.modal4 .ui-dialog-buttonset { padding: 0 5px;}
.modal4 .ui-dialog-buttonset .ui-button {min-width: 100px; font-family: Roboto;margin: .6em .4em;font-size: 0.8em; /*padding: .6em .9em;*/color: white; outline: none;border: 0; webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;transition: all .3s ease; background: #4ba8ff; background: -moz-linear-gradient(top, #4ba8ff 0%, #0d8cff 10%); background: -webkit-linear-gradient(top, #4ba8ff 0%,#0d8cff 10%); background: linear-gradient(to bottom, #4ba8ff 0%,#0d8cff 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ba8ff', endColorstr='#0d8cff',GradientType=0 );}
.modal4 .bouton-double .ui-button {margin-left: 0; float: right; /*border-radius: 3px*/ }
.modal4 .bouton-unique .ui-button {width: 100%; margin: 0.6em 0;}
.modal4 .ui-dialog-buttonpane .ui-dialog-buttonset {float:none !important;}


.modal4 .ui-dialog-buttonset .ui-button {border: 1px solid #4ba8ff !important; font-family: Roboto; outline: none;  margin: 10px .4em;font-size: 0.8em; padding: .6em .9em; -webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease;-ms-transition: all .3s ease;   transition: all .3s ease;} /*10px pour que le tooltip se voie*/

.modal4 .bouton-double .ui-button:hover{box-shadow : 0 0 0 3px rgba(13,140,255,0.3); border: 1px solid #077eef !important;}

.bouton-lien {font-size:0.8em !important; background:transparent !important; border:1px solid white !important; color:grey!important; padding : 0.5em !important; box-shadow:none !important;}
.bouton-lien:hover {box-shadow:none !important; text-decoration:underline; border:1px solid white !important; }

#tuto-user {padding: .5em 1em 1.5em 1em;}

.bouton-facebook {background: #3B5998;  width: 120px; }
.bouton-facebook:hover {background:#283e68; }
.bouton-twitter {background: #56BDF2; width: 120px;  }
.bouton-twitter:hover {background:#129ce7; }


/* switch mobile */
.modal-redirection2 {max-width: 600px;z-index: 99999; position: absolute;display:none;}
.modal-redirection2 .modal-redirection-main {background: #696565;}
.modal-redirection2 .modal-redirection-top {padding:10px;}
.modal-redirection2 .modal-redirection-top h2{ margin: 0 !important; text-align: center; color: white !important;}
.modal-redirection2 .modal-redirection-middle{background:#ffffff;padding:0px 10px;}
.modal-redirection2 .modal-redirection-middle-texte {padding:20px 0;}
.modal-redirection2 .modal-redirection-middle-texte p {margin:10px 0;text-align:center; font-size:18px; line-height:1.3;}
.modal-redirection2 .modal-redirection-socket{padding:10px;}
.modal-redirection2 .modal-redirection-socket p { color:white; text-align: center; font-size:16px;}
.modal-redirection2 .modal-redirection-below .modal-bouton {width:280px; display:block; margin:20px auto;}




/*=======================================================================
=========================================================================
=====================  MODULES ET TEMPLATES REUTILISABLES ===============
=========================================================================
=========================================================================*/

/* ================  INSCRIPTION TOUTES ETAPES ================== */

.inscription-header {padding: 0; background-color: white; border-bottom: 1px solid #eee;}
.inscription-header .logo-f2s {display: block;margin: 0px auto;max-height: 85px;}
.inscription-header .header-left{width:19%; text-align:center; display: inline-block; vertical-align: middle;}
.inscription-header .header-middle{width:59%; text-align:center; display: inline-block; vertical-align: middle;}
.inscription-header .header-right{width:19%; text-align:center; display: inline-block; vertical-align: middle;line-height: 1.3;}
#header-logo {width:19.5%; display:inline-block; vertical-align: middle; text-align: center;}
#header-message {width: 59%; display:inline-block; vertical-align: middle; text-align: center;}
#header-connexion {width: 19.5%; display:inline-block; vertical-align: middle; text-align: center;}
#progressbar-container {background-color:transparent;max-width:800px;margin:auto;text-align: center;position: relative;}
#progressbar-container #progressbar {margin :10px 0; overflow: hidden;}
#progressbar-container #progressbar li {list-style-type: none;color: #a9a9a9;font-size: 1em;width: 33.33%;float: left;position: relative;line-height:1;}
#progressbar-container #progressbar li:before {width: 30px;line-height: 30px;display: block;font-size: 18px;color: #a9a9a9;border-radius: 3px;margin: 0 auto 5px auto;background: #e8e8e8;}
#progressbar-container #progressbar li#inscription-1:before {content: '1';}
#progressbar-container #progressbar li#inscription-2:before {content: '2';}
#progressbar-container #progressbar li#inscription-3:before {content: '3';}
#progressbar-container #progressbar li:after {content: '';width: 70%;height: 2px;background: #dedede;position: absolute;left: -35%;top: 15px;}
#progressbar-container #progressbar li:first-child:after {content: none; }
#progressbar-container #progressbar li.active:before{ background: #4b7dd7; color: white;}
#progressbar-container #progressbar li.active{	color: #4b7dd7; font-weight: bold; }
.inscription-main {text-align:center; max-width: 1200px; margin: auto; padding: 20px 0;}
.inscription-etape {min-height:100vh; background: #d7ebff; padding-bottom: 2em;/*background: radial-gradient(ellipse at center center , #b2d4ff 5%,#62a8ff 70%);*/ }
.inscription-box { margin: 2em 0.6em; padding: 0.5em 1.5em; background: rgba(255, 255, 255, 0.6); border-radius: 3px; } 
.inscription-main h2 { font-size:1.5em;  text-align: center; color: #303030; margin-top: 0.2em;}


@media only screen and (max-width: 768px) {
      .inscription-header .header-left{width:100%; padding-top:5px; }
      .inscription-header .header-left .logo-f2s {max-height: 60px;}
      .inscription-header .header-middle{width: 100%;padding: 10px 0;;border-top: 1px solid #dcdcdc;background: #fafafa; }
      .inscription-header .header-right{width:100%; background-color: #4B7DD7; color:white; }      
}


@media only screen and (max-width: 400px){
      .inscription-main {margin: 0px auto;}
      .inscription-box {  margin: 10px; padding: 10px;}
      #choisir-plus-tard p {font-size:16px;}
}


/* ================ LANDING V8 & CONNEXION v8 & INSCRIPTION ================== */

.header-fixed {position: absolute; height: 85px;top: 0; left: 0; right: 0; margin: auto; background-color: transparent;z-index: 26; width: 100%; max-width: 1200px;}
.header-fixed .header-logo-container {display: block; height: 100%; float: left; text-align: left;}
.header-fixed .header-logo-container .header-logo { max-height: 90%; margin: 5px; display:inline-block; vertical-align: middle;}
.header-fixed .header-btn-container {display: block;/* width: 49.5%; */height: 100%;float: right;text-align: center;line-height: 80px;}
.btn-header {margin: 0 1em 0 0; padding: .6em .8em; font-size: 1em; line-height: 1.3;text-decoration: none !important; display: inline-block;vertical-align: middle; }
.btn-connexion {font-size: 1.1em;color: white !important;font-weight: bold;position: relative;}
.bg { position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: -1;background: linear-gradient(rgba(0, 0, 0, 0.4),rgba(0, 0, 0, 0.4) ),url(https://www.facile2soutenir.fr/wp-content/uploads/2018/01/background4.jpg);background-size: cover;background-position: top center;background-attachment: fixed;}
.blur-bg {-webkit-filter: blur(15px);-moz-filter: blur(15px);-o-filter: blur(15px);-ms-filter: blur(15px);filter: blur(15px);}
.blur-bg10 {-webkit-filter: blur(10px);-moz-filter: blur(10px);-o-filter: blur(10px);-ms-filter: blur(10px);filter: blur(10px);}
.blur-bg5 {-webkit-filter: blur(5px);-moz-filter: blur(5px);-o-filter: blur(5px);-ms-filter: blur(5px);filter: blur(5px);}
.soulignement {transition: .35s ease all;margin: 0 auto;display: inline-block;height: 3px;width: 0;background: rgba(255,255,255,.3);-webkit-transition-delay: 70ms;position: absolute;bottom: 0;left: 0;}
.btn-connexion:hover span.soulignement { width: 100%; background: rgba(255,255,255,1);}
.btn-inscription-sous-titre { display:inline-block; vertical-align: middle; max-width: 400px; margin: auto; text-align: center;}
.btn-inscription-sous-titre p {color: #f0f0f0; font-size: 0.85em;}
hr.header-sep {border: 0;margin: auto;height: 1px;opacity: .25;position: absolute;top: 85px;width: 100%;background: -webkit-linear-gradient(90deg,rgba(255,255,255,0) 5%,#fff 50%,rgba(255,255,255,0) 95%);background: -moz-linear-gradient(90deg,rgba(255,255,255,0) 5%,#fff 50%,rgba(255,255,255,0) 95%);background: -o-linear-gradient(90deg,rgba(255,255,255,0) 5%,#fff 50%,rgba(255,255,255,0) 95%);background: -ms-linear-gradient(90deg,rgba(255,255,255,0) 5%,#fff 50%,rgba(255,255,255,0) 95%);background: linear-gradient(90deg,rgba(255,255,255,0) 5%,#fff 50%,rgba(255,255,255,0) 95%);}
@media screen and (max-width: 670px) {
      hr.header-sep {top:50px;}
}
@media only screen and (max-width: 768px) {
      .header-fixed { height: 50px;}
      .header-fixed .header-btn-container { line-height: 50px;}
      .header-sep { top: 50px;}
      .btn-connexion { padding: .6em .2em;}      
}




/* ================  TEMPLATE - COMMENT CA MARCHE ================== */
/* ================  INSCRIPTION ETAPE 1 ================== */
/* ================  ACCUEIL (NON CONNECTE) ================== */
/* ================  LANDING ================== */

.btn-ccm{cursor:pointer; width: 200px;}
.btn-ccm-container {margin:1em auto 2.5em;}
.btn-ccm-actif {background-color:#FF8800; color:white;}
.btn-ccm-inactif {color:#5a5a5a !important; background-color: #cbddfe;}
.btn-ccm-inactif:hover {background:#FF8800 !important; color:white !important;}

.comment-ca-marche {text-align: center; padding: 0.6em 0.6em 2.5em 0.6em;}
.comment-ca-marche h3 {color: white;}
.comment-ca-marche .video-comment-container {max-width: 600px; margin: 0px auto;}
.comment-ca-marche .liste-tiers-item p{font-size:1.1em; color:#5a5a5a;}
.comment-ca-marche .liste-tiers-item span{font-weight:bold; font-size:1.15em;}
.comment-ca-marche .liste-tiers-item img{width:80px;}
@media only screen and (max-width: 600px) {
      .liste-tiers-item {width: 90%; padding: .3em !important;}
}
/* CARROUSEL MARCHANDS PARTENAIRES */
.carrousel-marchands  {text-align: center; padding: 0.6em .6em 2em .6em; background-color: #f5f6ff; }
/* REVERSEMENT */
.bloc-reversement {padding: 4em .6em;}
.bloc-reversement p {text-align:center; color:white; max-width: 800px; margin: auto; font-size: 1.7em;}



/* ================ ETAPE 2 - CATEGORIES
/* ================ TOUTES LES ASSOS  */

#type-wrapper {display: block;text-align: center;padding: 0;margin: auto;max-width: none;position: absolute;bottom: 0;left: 0;right: 0;}
#type-wrapper a {display: inline-block;vertical-align: top;color: #ccc;text-decoration: none !important;position: relative;margin: 0.2em;padding: 0;width: auto;height: auto;}
#type-wrapper a:hover{color:#FFbe00 !important;}
#type-wrapper a:hover .cellule-wrapper {border-color:#FFbe00 !important; background-color: rgba(255,190,0,0.15);}
#type-wrapper a:hover .type-wrapper-texte{opacity:1;}
#type-wrapper a.type-actif{color:#FFbe00 !important;}
.cellule-wrapper {word-wrap: break-word;display: inline-block;height: auto;border-radius: 10em;background-color: #00000080;padding: 0.4em;font-size: 1.2em;margin: 0.1em;border: 2px solid #ccc !important;}
#type-wrapper a.type-actif .cellule-wrapper {border-color:#FFbe00 !important; background-color: rgba(255,190,0,0.15);}
.type-wrapper-texte {margin: .6em 0;line-height: 1.1;font-size: 0.85em;position: absolute;top: -3em;width: 12em;text-align: center;/* margin-left: -6em; */right: 0;left: 50%;opacity: 0;transform: translateX(-50%);background: rgba(0,0,0,0.6);padding: 0.4em 0 0.5em 0; -webkit-transition: all 500ms ease-out;-moz-transition: all 500ms ease-out;-o-transition: all 500ms ease-out;transition: all 500ms ease-out;}
.type-wrapper-texte span {font-size: .9em;}



/* ================ INSCRIPTION ETAPE 2 > RECHERCHE CAUSE  && 
/* ================ TOUTES LES ASSOS ***************/
/* ================ MES CAUSES ***************/



/*container grande cause : inscription etape 2 - mes causes */
.grandecause-container {text-align:center; margin: 1.5em auto 0.6em;}
.grandecause {width: 13em; padding: 0.5em;  margin: 0.2em 0.6em;  border-radius: 6px;}
.grandecause h3 {font-size:1.2em; margin-top:0;}
.grandecause-arbres {background-color: #96e096;}
.grandecause-img-container {margin: 0.9em auto; background: white; padding: 1.5em; border-radius: 100%; height: 7.5em; width: 7.5em;} 
.grandecause-arbres .bouton-blanc:hover {color:#00B050 !important;}



.recherche_cause_container {padding: 1em 0.5em;}
.recherche_cause_formulaire {position: relative;max-width: 30em;display: block;margin: auto;vertical-align: middle;height: 2.5em;}

#top .recherche_cause_formulaire input:-moz-placeholder {  color:#aaaaaa !important;} 
#top .recherche_cause_formulaire input::-moz-placeholder  {  color:#aaaaaa !important;}
#top .recherche_cause_formulaire input::-webkit-input-placeholder  {  color:#aaaaaa !important;} 
#top .recherche_cause_formulaire input:-ms-input-placeholder  {  color:#aaaaaa !important;} 
#top .recherche_cause_formulaire input[type="text"]:focus {    box-shadow: none !important;}
#top .recherche_cause_formulaire input {padding: .4em .6em .3em 3em!important; font-size: 1em; top: 0px;height: 2.5em; z-index: 20;position: absolute;/*background: transparent !important;*/border-radius: 200px;box-shadow: 0 0 5px 1px rgba(222,235,247,1);}

.recherche_cause_icones {position: absolute;right:0;top:0;height:100%;width:100%;text-align: right;}
.recherche_cause_loupe {width: 2.2em;height: 1.8em;position: relative;float: left;display: inline-block;z-index: 30;margin: .4em .2em .3em .4em;}
.recherche_cause_loupe svg {fill: #565656;height: 100%;width: 2em;}
.recherche_cause_fermer {vertical-align: middle;position: relative;cursor: pointer;display: inline-block;z-index: 30;text-align: center;margin-right: .3em;width: 2.2em;height: 2.5em;}
.recherche_cause_fermer svg {background: #333333;border-radius: 100%;margin: .6em 0;width: 1.5em;height: 1.5em;fill: #fefefe;padding: 0.25em;}
.recherche_cause_encours {width: 2.2em;height: 1.8em;position: relative;cursor: pointer;display: inline-block;z-index: 30;vertical-align: middle;}
.recherche_cause_encours svg {height: 100%;}

.recherche_cause_reponse {max-width: 800px;display: block;margin: 0.5em auto; -webkit-animation: fadeIn 1s;animation: fadeIn 1s;}
.recherche_cause_champ {box-shadow: inset 0px 2px 6px 0px rgba(0, 0, 0, 0.3);}

.recherche_cause_bloc {display: block;height: 100px;text-align: left;padding: 0px;margin: .6em 0;box-sizing:content-box; background-color: white; border: 1px solid rgb(230,230,230);}
.recherche_cause_bloc .bloc-cause {width: 100%; height: 100%; position:relative; display: inline-block;border:0 !important;}
.recherche_cause_bloc .bloc-cause:hover .recherche_cause_bloc_overlay{ visibility: visible; opacity: 1;}
.recherche_cause_bloc_overlay {opacity: 0;visibility: hidden;  transition: visibility 0s, opacity 0.2s linear; overflow:hidden; position: absolute;width: 100%;height: 100%;background-color: rgba(33, 150, 243, 0.7);z-index: 5;}
.recherche_cause_bloc_overlay p{ font-size: 1.5em;color: white;line-height: 1;font-family: 'Roboto Light', 'Roboto', 'Helvetica', 'Arial' ;text-align: center;margin: -0.5em 0 0 0;position: absolute;width: 100%;top: 50%;}
.recherche_cause_bloc .logo-cause {height: 100px;line-height: 80px;padding: 5px;}


/* A TRAVAILLER */
.recherche_cause_bloc .logo-cause { width: 20%; }

/* A TRAVAILLER */
.recherche_cause_bloc .logo-cause img {max-height: 100%;width: auto;vertical-align: middle;}
.recherche_cause_bloc .presentation-cause {width: 78%;height: 100px;padding: 0 5px;overflow: hidden;vertical-align: top;display: inline-block;position:relative;}
.recherche_cause_bloc p.nom-cause {font-size: 1.2em;margin: 0.3em 0;font-family: 'Roboto Light', 'Roboto', 'Helvetica', 'Arial' ; font-weight: bold;}
.recherche_cause_bloc .presentation-cause::after {content: "";font-weight: bold;position: absolute;bottom: 0;right: 0;width: 100%;height: 2em;background: linear-gradient(rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 1) 100%);}
.recherche_cause_bloc .container-accroche-cause{ /*max-height: 50px;*/}
.recherche_cause_bloc .container-accroche-cause p{font-size: 0.85em; line-height: 1.2; color: #5a5a5a !important;}


.liste_causes {max-width: 1200px; display: block;  margin: 0.5em auto; padding: 1em 0.5em; text-align: center; /*background: rgba(255, 255, 255, 0.6);text-align: center;border: 1px solid;*/}
.liste_cause_bloc {display: inline-block;margin: 0.5em .1em;vertical-align: top;}
.bloc-cause {text-decoration:none !important;}
.bloc-cause-haut {height: 150px;width: 150px;line-height: 141px;text-align: center;background-color: white;border: 1px solid rgb(230,230,230);position: relative;}
.bloc-cause-haut img {max-height: 100%;width: auto;vertical-align: middle;}
.bloc-cause-bas { width: 150px;height: 2em;line-height: 1.5em;padding: 0.2em 0.1em;text-align: center;text-align: center;background-color: rgb(245,245,245);border: 1px solid rgb(230,230,230);border-top: 0;font-size: .85em;}
.bloc-cause-bas p {margin:0; overflow: hidden;text-overflow: ellipsis; white-space: nowrap;}
.bloc-cause-liens {width: 200px; text-align:center; line-height: 1.3; margin-top: 5px;}
.bloc-cause-liens .favori-icone { vertical-align: text-top; margin:1px 5px 0 0;}
.bloc-cause-haut:hover .bloc-cause-overlay{ display: block !important;} 
.bloc-cause-overlay {display: none; font-size: 0.9em; padding: 0.6em .3em; overflow:hidden;  position: absolute;width: 100%;height: 100%;background-color: rgba(0,10,30,0.6);z-index: 5;color: white;line-height: 1.25;font-family: 'Roboto Light', 'Roboto', 'Helvetica', 'Arial' ;;top:0;}



/* ================ MODAL ACCUEIL ========= */
/* ================ MENU ================== */

.recherche_reponse li {display:inline-block;}
.recherche_reponse {-webkit-transition: all  1s ease-in-out;-moz-transition: all  1s ease-in-out;-o-transition: all  1s ease-in-out;transition: all  1s ease-in-out;position:relative;z-index:1500; text-align: center;}
.titre-resultats { margin: 1.5em 1em 1em 1.25em;color: #5c5c5c !important;text-align: left;}
.no-result {font-size:0.9em;text-align: center;font-style: italic;margin-left:.1em;}

.recherche_icones {position: absolute;right:0;top:0;height:100%;width:100%;text-align: right;}
.recherche_fermer {width: 60px;height: 68px;position: relative;cursor: pointer;display: inline-block;z-index: 30;text-align:center;}
.recherche_fermer svg {background: #333333;border-radius: 50%;margin: 15px 0;width: 35px;height: 35px; fill: #fefefe;padding: 4px;box-sizing: border-box;}
.recherche_encours {width: 50px;height: 68px;position: relative;cursor: pointer;display: inline-block;z-index: 30;}
.recherche_encours svg {height: 100%;width: 40px;vertical-align: baseline;display: inline-block;}
.recherche_loupe {width: 50px;height: 68px;position: relative; float:left; display: inline-block; z-index: 30;}
.recherche_loupe svg {fill: #565656; height: 100%; width: 40px;vertical-align: baseline;display: inline-block;}
.recherche_reponse li.result-container-1 {height: 6em;text-align: left;display: block;background: white;margin: 0.3em 0;padding: 0.5em; border: 1px solid #dcdcdc;border-radius: 2px; position: relative;}
.recherche_reponse .result-container-1-logo {cursor:pointer; display:inline-block; vertical-align: middle; border-right:1px solid #bfbfbf; text-align: center; /*margin-right:10px; padding:0 10px;*/height: 5em; width:5.5em; line-height:5em;}
.recherche_reponse .result-container-1-logo img {max-height: 4.5em;max-width: 5em;display: inline-block;vertical-align: middle;border-radius: 4px;line-height: normal;}
.recherche_reponse .result-container-1-texte {display:inline-block; vertical-align: middle; padding-left: 1em;}
.recherche_reponse .result-container-1-texte .result-container-1-nom {font-size: .9em;font-weight: bold; color: #686868;}
.recherche_reponse .result-container-1-texte .result-container-1-remboursement {font-size: 1.2em;font-weight: bold;color:#FF8800;}
/*.recherche_reponse .result-container-1-boutons { display: inline-block; width: 210px; float: right; vertical-align: middle;}*/
.recherche_reponse .result-container-1-boutons { position: absolute; right: 0.5em; top: 0.55em;}
.recherche_reponse .result-container-1-boutons .icon-panier{ font-size: 1em; margin-left: .7em; vertical-align: baseline;}
.recherche_reponse .result-container-1-suspendu {background:#9a9a9a !important;}
.recherche_reponse .result-container-1-suspendu .result-container-1-logo {opacity:0.5; cursor: not-allowed;}
.recherche_reponse .result-container-1-suspendu p {position:absolute; max-width:100%; opacity:0; top:0; margin:2em 0; color:white; text-align: center; font-size: 1.1em;}
.recherche_reponse .result-container-1-suspendu:hover {background:#5e5e5e !important;}
.recherche_reponse .result-container-1-suspendu:hover p {opacity:1;}
.recherche_reponse .result-container-1-suspendu:hover .result-container-1-logo {opacity:0.2;}

@media only screen and (max-width: 414px) { /* test*/
      .recherche_reponse .result-container-1-boutons {text-align: right;}
      .result-details-marchand {display:inline-block!important;}
}

/* =======================  INSTALL APPLICATION ======================= */
/* =======================  INSCRIPTION ETAPE 3 ======================= */
/* =======================  INSCRIPTION ETAPE 3 SANS APPLI  ======================= */

.application-etapes-liste {display: table;table-layout: fixed; margin: 15px auto; max-width: 1200px;}
.application-etape {width: 33.33333%;display: table-cell;position: relative; vertical-align: top;text-align: center !important;}
.application-etape > img{max-width: 80%; box-shadow: 0 0 20px 1px rgba(0,0,0,0.2); }
.application-etape p {margin: 0.5em 1.5em;}
/*.application-etape:after {content:  url('wp-content/uploads/2016/02/Fleche-droite2-bleue40.png');position: absolute;top: 22%;right: -13px;}*/
.application-etape:last-child:after{display:none}
.message {position: relative;display: inline-block;}    
.message-encours::before {content: url('/wp-content/uploads/2016/02/icone-sablier.png'); padding: 4px 3px 2px 3px;position: absolute;left: -40px;top: -4px;border: 2px solid #ff8800;border-radius: 300px;width: 22px;height: 22px;text-align: center;}
.message-ok::before {content: url('/wp-content/uploads/2015/12/check-vert.png');padding: 4px 3px 2px 3px;position: absolute;left: -40px;top: -4px;border: 2px solid #00b050;border-radius: 300px;width: 22px;height: 22px;text-align: center;}  
.liste-tiers {margin-left:0;}
.liste-tiers-item {width: 31%;display: inline-block;vertical-align: top;text-align: center !important;margin: 0 1% !important;padding: 20px !important;}
.liste-tiers-item img{display: block; margin: auto;}
.application-etapes-footer {text-align: center; margin: 30px 0 0; font-size: 0.8em; font-style: italic;}











/* =======================  MENU SIDE ======================= */
.compte-container li {list-style: disc;list-style-position: inside;}
.compte-container .pods-form-fields li {list-style: none;}

.compte-administration {  background-color:white;}
.compte-administration .compte-main {
      min-height: 100vh;
      width:75%;
      /*max-width: 1000px;
      border: 1px solid rgb(220, 220, 220);*/
      border-top: 0;
      padding: 1em;
      background-color: white;      
      border-left: 1px solid #e4e4e4;
}
.compte-administration .compte-side{
      width:23%;
      padding-top:1em;
      padding-left:.75em;
      max-width: 300px;
      
      min-height: 100vh; 
      
}
.container-compte .sidebar .widget {display: inline-block; width:100%;}

.container-compte {background-color:#f5f7ff;}

.container-compte .sidebar_left {border-left: none !important; border-right-width:0 !important; padding:0 !important;}
.container-compte .sidebar_left .inner_sidebar {
      /*margin: 20px 20px 20px 0 !important;*/
      margin: 0 !important;
}
.compte-administration h4 { margin: 30px 0 10px 0; font-size: 36px; font-weight: normal;}
.compte-administration .compte-container h2 { font-size: 1.5em;  margin-top: 0.2em;}


/* SIDEBAR DROITE */
.sidebar-box-container {text-align: center;margin-bottom: 2em;   border-radius: 6px;}
.sidebar-box-heading {border-bottom: 1px solid rgb(245, 247, 255) !important;font-size: 1em;color: #3e3e3e;padding: 0.1em 0.5em;line-height: 1!important;}
.sidebar-box-heading p {line-height: 1!important;}
.sidebar-box-body {padding: 0 .5em .5em;font-size: 0.85em;}


.v5-custom-menu-side {
      /*min-width: 180px;
      max-width: 200px;*/
      display:inline-block;
      
      width:100%;
      
}
.v5-custom-menu-side > ul { z-index:6;}

.v5-custom-menu-side li.item-niveau-1-side {text-align: center; float: none;max-width: 100%;
    border-top: 1px solid #fdfdfd;
    border-bottom: 1px solid #dfdfdf;
} /* ? */
.v5-custom-menu-side li a, .v5-custom-menu-side li span {
          color: #6a7884;
          -webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;text-decoration:none !important;
}
.v5-custom-menu-side li:hover{
      /*background-color: #deebf7;*/
      background-color: #ffffff;
      cursor:pointer;
}
.v5-custom-menu-side li:hover > a > span {
      color: #2697ff !important;
}

.lien-niveau-side{padding: 5px 20px;} 
.container-avatar-side {display: block;text-align: center;}
.container2-avatar-side {display: inline-block;background-color: rgba(0,0,0,0.2);border-radius: 200px;text-align: center;height: 65px;width: 65px;padding: 3px 0;}
.container2-avatar-side img{border-radius: 200px;max-height: 60px;max-width: 60px;}
.item-niveau-1-side { margin: 0; line-height: 1.3;
    padding: 1.5em 1em;
}
.lien-niveau-1-side{display: block;text-align: center; padding: 0;}
.text-niveau-1-side{color: #323c46; display: inline-block;vertical-align: middle;}
.niveau-1-side-actif {background-color: #ffffff; border-right: 2px solid #48a5fd !important;}
.niveau-1-side-actif > a > span {color: #2094ff; }
.lien-niveau-2-side{color: rgb(90,90,90);font-style: italic;font-size: 12px;padding-top: 5px;padding-bottom: 5px;display: block;line-height: 1;}
.niveau-2-side-actif > span{color: #2094ff !important; font-weight: bold;}
.text-niveau-2-side{color: rgb(159, 159, 159) !important;}
.fleft  {float:left!important;}
.fright  {float:right!important;}
.item-niveau-0-side > ul > li:first-child {border-top:0;}




/* tous les marchands & listes de larchands */

.container-2 { display: block; margin: auto; max-width: 1024px; overflow: hidden;} /* page tous les marchands */
.container-2 ul {margin: 0 5px;}
.container-2 h2 {margin: 0.9em 0 ;border-left: 7px solid #ff8800; padding-left: 10px;}
.container-2 h3 {border-top: 1px dashed #5e5e5e!important;border-bottom: 1px dashed #5e5e5e!important;padding: .3em 0 .4em 1em;}  
.container-cat {margin: 1em 0;}
.ariane {font-size: 0.7em; font-weight: bold; color :#5a5a5a; margin: 0.5em 0;}
.ariane a {color:#FF8800;}

      
      
.marchands_liste_container {transition: all .2s ease-in-out;background: white;text-align: center; border-radius: 4px;box-shadow: 0 0 8px 1px rgba(0,0,0,0.1);margin:15px;padding: 10px 5px 5px 5px;width: 200px;display: inline-block;vertical-align: middle;}
.marchands_liste_container:hover{-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05); box-shadow: 0 0 25px 2px rgba(255,130,0,1);}
.marchands_liste .marchands_liste_boutons {display: block;margin: 0 0px;}
.marchands_liste .marchands_liste_texte  {margin: 15px 0; height:65px;} 
.marchands_liste .marchands_liste_texte .marchands_liste_nom {font-size: 15px;font-weight: bold; line-height: 1.2;}
.marchands_liste .marchands_liste_texte .marchands_liste_remboursement {font-size: 18px;font-weight: bold;color:#FF8800;}
.marchands_liste .marchands_liste_logo_container {display:inline-block;vertical-align: middle;padding:0 10px;height: 80px;width: 100%;line-height:80px;margin: 10px 0;}
.marchands_liste .marchands_liste_logo_container img  {max-height: 80px;max-width: 80px;display: inline-block;vertical-align: middle;border-radius: 4px;line-height: normal;}

@media only screen and (max-width: 767px){
      .marchands_liste { margin: auto; }
      .marchands_liste li.marchands_liste_container {width:auto; display: block;background: white;padding: 5px;border: 1px solid #dcdcdc;border-radius: 2px;height: auto;margin: 15px auto;max-width: 360px;}
      .marchands_liste .marchands_liste_texte {display:inline-block; vertical-align: middle;}
      .marchands_liste .marchands_liste_logo_container {border: 0;text-align: center;margin: auto;height:auto;line-height: 1.1;width: 48%; }
      .marchands_liste .marchands_liste_texte {width: 48%;line-height: 1.1;padding: 2px;margin: 2px 0;}
      .marchands_liste .marchands_liste_boutons { display: block; width: auto; float: none; text-align: center;}
      .marchands_liste .marchands_liste_boutons .bouton,
      .marchands_liste .marchands_liste_boutons .bouton-inverse { font-size: 12px; padding: 7px; display: inline-block; width: 40%;}
}
@media only screen and (max-width: 414px){
      .marchands_liste .marchands_liste_boutons .bouton,
      .marchands_liste .marchands_liste_boutons .bouton-inverse { display: block; width: auto;}
}  

/*=======================================================================
=========================================================================
==========================  PAGES SPECIFIQUES  ==========================
=========================================================================
=========================================================================*/

/* details asso */

.asso-content-right li {
    list-style-type: disc;
    list-style-position: outside;
    margin-left: 1.5em;
}


/*=======================================================================
=========================================================================
======================    LOADERS & ANIMATIONS    =======================
=========================================================================
=========================================================================*/


/* toutes les landing pages*/
.headerloop { position: absolute;bottom: 0px;left: 0px;width: 100%;text-align: center;opacity: 0;display: block;-webkit-font-smoothing: antialiased;}
.headerloop-container .headerloop:nth-child(1) {-webkit-animation-name: wizzIn;animation-name: wizzIn;-webkit-animation-duration: 3s;animation-duration: 3s;-webkit-animation-delay: 1s;animation-delay: 1s;}
.headerloop-container .headerloop:nth-child(2) {-webkit-animation-name: wizzIn;animation-name: wizzIn;-webkit-animation-duration: 3s;animation-duration: 3s;-webkit-animation-delay: 3.55s;animation-delay: 3.55s;}
.headerloop-container .headerloop:nth-child(3) {-webkit-animation-name: wizzIn;animation-name: wizzIn;-webkit-animation-duration: 3s;animation-duration: 3s;-webkit-animation-delay: 6.1s;animation-delay: 6.1s;}
.headerloop-container .headerloop:nth-last-child(1) {-webkit-animation-name: wizzFinal;animation-name: wizzFinal;-webkit-animation-duration: 11.50s;animation-duration: 11.50s;-webkit-animation-delay: 0s;animation-delay: 0s;opacity: 1;}
@-webkit-keyframes wizzIn {
      00% {opacity: 0;-webkit-transform: translateY(80px);transform: translateY(80px);}
      20%, 80% {opacity: 1;-webkit-transform: translateY(0px);transform: translateY(0px);}
      100% {opacity: 0;-webkit-transform: translateY(-80px);transform: translateY(-80px);}
}
@keyframes wizzIn {
      00% {opacity: 0;-webkit-transform: translateY(80px);transform: translateY(80px);}
      20%, 80% {opacity: 1;-webkit-transform: translateY(0px);transform: translateY(0px);}
      100% {opacity: 0;-webkit-transform: translateY(-80px);transform: translateY(-80px);}
}
@-webkit-keyframes wizzFinal {
      00% {opacity: 0;-webkit-transform: translateY(0px);transform: translateY(0px);}
      80% {opacity: 0;-webkit-transform: translateY(0px);transform: translateY(0px);}
      100% {opacity: 1;-webkit-transform: translateY(0px);transform: translateY(0px);}
}
@keyframes wizzFinal {
      00% {opacity: 0;-webkit-transform: translateY(0px);transform: translateY(0px);}
      80% {opacity: 0;-webkit-transform: translateY(0px);transform: translateY(0px);}
      100% {opacity: 1;-webkit-transform: translateY(0px);transform: translateY(0px);}
}
.headerloop-container {position: relative; margin-bottom: 1em !important;}
.headerloop img {height: 100px;vertical-align: middle;margin: 0 20px;}




/* tous les marchands et assos */
.hvr-bounce-to-right {display: inline-block;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);box-shadow: 0 0 1px transparent;position: relative;-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;}
.hvr-bounce-to-right:before {content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0;-webkit-transform: scaleX(0);transform: scaleX(0);-webkit-transform-origin: 0 50%;transform-origin: 0 50%;-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.hvr-bounce-to-right:hover, .hvr-bounce-to-right:focus, .hvr-bounce-to-right:active {color: white;}
.hvr-bounce-to-right:hover:before, .hvr-bounce-to-right:focus:before, .hvr-bounce-to-right:active:before { -webkit-transform: scaleX(1);    transform: scaleX(1);    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
.hvr-orange:before {background: #ff8800;}
.hvr-bleu:before {background: #2196F3;}

.lds-ripple { display: inline-block;position: relative;width: 64px;height: 64px;}
.lds-ripple div {position: absolute;border: 4px solid #4b7dd7;opacity: 1;border-radius: 50%;animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;}
.lds-ripple div:nth-child(2) {animation-delay: -0.5s;}
@keyframes lds-ripple {0% {top: 28px;left: 28px;width: 0;height: 0;opacity: 1;}100% {top: -1px;left: -1px;width: 58px;height: 58px;opacity: 0;}}
.loader-bleu-gris {/*border: 16px solid #f3f3f3;*/ /* Light grey */border: 3px solid transparent;border-top: 3px solid #4b7dd7;border-radius: 50%;width: 18px;height: 18px;display: inline-block;animation: loader-bleu-gris 1.5s linear infinite;}
.loader-bi {border-bottom: 3px solid #4b7dd7;}
.loader-quadri {border-bottom: 3px solid #4b7dd7;border-left: 3px solid #cccccc;border-right: 3px solid #cccccc;}
@keyframes loader-bleu-gris {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
.lds-ellipsis {z-index: 20;display: inline-block;position: relative;width: 64px;height: 64px;}
.lds-ellipsis div {position: absolute;top: 27px;width: 11px;height: 11px;border-radius: 50%;background: #fff;animation-timing-function: cubic-bezier(0, 1, 1, 0);}
.lds-ellipsis div:nth-child(1) {left: 6px;animation: lds-ellipsis1 0.6s infinite;}
.lds-ellipsis div:nth-child(2) {left: 6px;animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(3) {left: 26px;animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(4) {left: 45px;animation: lds-ellipsis3 0.6s infinite;}
@keyframes lds-ellipsis1 {0% {transform: scale(0);} 100% {transform: scale(1);}}
@keyframes lds-ellipsis3 {0% {transform: scale(1);} 100% {transform: scale(0);}}
@keyframes lds-ellipsis2 {0% {transform: translate(0, 0);} 100% {transform: translate(19px, 0);}}
.lds-ellipsis-center {  position:absolute;  left: 50%; top: 50%; margin-left: -32px; margin-top: -32px;}    
.lds-ellipsis-right{    position: absolute; right: 20px;}
.lds-ellipsis-bleu div {background: #2196F3 !important;}
.bouton-encours {position:relative;background-color: grey !important;color: lightgray !important;border-color: grey !important;}
.bouton-encours:active {background-color: #000 !important; }

/* preloader */
.loader {width: 50px; height: 50px; border-radius: 50%; background: #a2c6f0; animation: loader 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite; margin: auto; position: center; margin-top: 60vh!important; border: 5px solid #dcdcdc; }
.preloader {background-size: 15%;position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9998; background-image: url('/wp-content/uploads/2015/11/Facile2Soutenir-logo.png'); background-repeat: no-repeat; background-color: #FFF; background-position: center;}

@keyframes loader {
 0%, 100% {animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5); }
 0% {transform: rotateY(0deg); }
 50% {transform: rotateY(1800deg); animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1); }
 100% {transform: rotateY(3600deg); }
}