/* --------------------------------------------
 * Colonne de droite
 ------------------------------------------- */

#col_droite .block {
    padding: 20px 25px;
    background: #fff;
}

#col_droite .title {
    padding: 13px 16px 7px;
    background-color: #edeeee;
    color: #5c6066;
}

#col_droite h2.block {
    padding-top: 25px;
    margin-bottom: 0;
}

#col_droite .txt12 { font-size: 0.923em; }

/*--------- = equivalence de don ---------*/
#col_droite .bloc-chiffres {
    margin-bottom: 5px;
    padding: 15px 35px;
    line-height: 1.1;
}
#col_droite .bloc-chiffres.first { padding-top: 0px; }
#col_droite .bloc-chiffres.last { margin-bottom: 0; }

#col_droite .service-donateur a {
    text-decoration: underline;
}

.bloc-chiffres .em {
    font-family: "staatliches", poppins, arial, sans-serif;
    font-size: 1.286em;
    line-height:1;
    text-transform: uppercase;
}
.bloc-chiffres .couleur {
    color:#ed1b23;
    font-size: 2.571em;
}

.bloc-chiffres .em .couleur { font-size: 2em; }

.bloc-chiffres strong { display: block; }

/*--- picto ----*/
.bloc-chiffres .picto { position: relative; }

.bloc-chiffres .picto::before {
    position: absolute;
    top: 0;
    speak: none;
    line-height: 1;
    font-family: 'icomoon';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 4.2em;
}

/*pour ie 11 : initialisation de la police à 14px : ie11 ne remplace pas la valeur définit dans picto (4.2em) mais s'en sert de base */
.bloc-chiffres .picto-pays::before,
.bloc-chiffres .picto-projets::before,
.bloc-chiffres .picto-asso::before{
    font-size: 0.241em;
}

.picto-color::before { color: #ed1b23;}

.picto-right { padding-right: 70px;}
.picto-right::before { right: 0;}

.picto-left::before { left: 0; }

/*- microscope -*/
.bloc-chiffres .picto-microscope {
    padding-left: 57px;
    padding-bottom:.3em;
    text-align: right;
}

.picto-microscope::before { content: '\e906'; }

/*- chercheurs -*/
.picto-chercheur {
    margin-bottom:0.4em;
    padding-top: 20px;
}

.picto-chercheur::before { content: '\e908';}

.picto-chercheur span {
    display: inline-block;
    vertical-align: top;
    max-width: 50%;
}
.picto-chercheur .couleur { margin-right: 5px; }

/* programme - pays */
.picto-pharmacie::before {
    content: '\e905';
    top: 12px;
}

.picto-pays {
    margin-top: 20px;
    padding-left: 90px;
}

.bloc-chiffres .picto-pays::before {
    content: '\e902';
    top: 6px;
    font-size: 4.5em;
}

.association {
    display: inline-block;
    width: 50%;
}

.pays {
    display: block;
    margin-top: 5px;
    text-align: right;
}

/*- projets - asso -*/
.picto-projets { padding-right: 90px; }

.bloc-chiffres .picto-projets::before {
    content: '\e904';
    font-size: 3.8em;
    top: 8px;
}

.picto-asso {
    padding-left: 80px;
    margin-top: 20px;
}

.bloc-chiffres .picto-asso::before {
    content: '\e903';
    font-size: 3.4em;
}

.personnes { display: block; }

/* ----- monnaie ---- */
.monnaie {
    clear:both;
    overflow:hidden;
}

.monnaie .nb {
    display: block;
    font-size: 2.143em;
}

.monnaie .couleur {color:#ed1b23;}
.monnaie .couleur1 {color:#333;}
.monnaie .couleur2 {color:#b0babf;}

.monnaie .txt40 {font-size: 2.857em;}
.monnaie .txt13 {font-size: 0.929em;}

.monnaie img {
    display: block;
    margin: .2em auto 0;
}

.monnaie .collecte {
    float: left;
    width: 40%;
    margin-top: -27px;
}

.monnaie .gestion {
    float:right;
    width: 52%;
    margin-top: 7px;
}

.rapport_d_activite {
    display: inline-block;
    min-height: 20px;
    margin-top: 7px;
    padding-left: 9px;

    font-size:0.857em	;
    background:url(../../don_img/charte/form_don2015/fleche.png) no-repeat left 2px;
}

/* sécurité */
.securite {
    text-align:center;
}

.securite h2 {
    margin-bottom: 1em; }

.securite img {
    margin-right:2px;
    margin-bottom:10px;
}

/* une question */
.unequestion { margin-top: 25px; }

.unequestion a:focus, .unequestion a:hover { text-decoration: underline; }

#col_droite .unequestion .title {
    padding: 0;
    margin-bottom: 10px;
    background: none;
    font-size: 1.286em;
}
.unequestion .nb { font-size: 1.286em; }


    /* boutique lien */
.shop-link {
    margin-top: 25px;
    box-shadow: 7px 7px 0 0 #cecfd1;
    font-size: 1.714em;
}

#col_droite .shop-link .title {
    position: relative;
    padding-left: 20px;
    padding-right: 20px;
    display: block;
    background-color: #fff;
}

.shop-link .title::after {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    content: '\e900';
    font-family: 'icomoon' !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #940500;
    font-size: 1.2em;
}

/* video konami */
.videoKscontent {
    width:100%;
    min-height:360px;
}

/* --------------------------------------------
 * Version tablette
 ------------------------------------------- */
@media screen and (max-width: 1020px) {
    #col_droite .equivalence.first,
    #col_droite .tablette {
        margin-top:28px;
        width:364px;
    }

    #col_droite .equivalence.first { float: left;}
    #col_droite .tablette { float: right; }
}

/* --------------------------------------------
 * Version mobile
 ------------------------------------------- */
@media screen and (max-width: 767px) {

    #col_droite .equivalence.first,
    #col_droite .tablette {
        float: none;
        clear: both;
        width:100%;
        max-width:310px;
        margin: auto;
        padding-top: 25px;
    }

    #col_droite .mobile_closed,
    #col_droite .mobile_closed .block {
        padding: 0;
    }

    /*anim ouverture*/
    .equivalence.mobile_closed > * {
        display:none;
    }

    .equivalence.mobile_closed > h2 {
        display:block;
    }

    #col_droite .block,
    #col_droite .title {
        transition: all .3s ease-in-out;
    }

    /* titre */
    #col_droite .title.mobile {
        position: relative;
        padding-right: 16px;
    }

    #col_droite .title.mobile::after {
        position: absolute;
        right: -26px;
        top: 11px;
        content: "\e90a";
        font-family: 'icomoon' !important;
        speak: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: #ed1b23;
        font-size: 1.2em;
    }

    #col_droite .mobile_closed a.title {
        padding-right: 30px;
        background: none;
    }

    #col_droite .mobile_closed a.title::after {
        right: 10px;
        transform: rotate(180deg);
    }
}
