/*
Based on code from https://tympanus.net/codrops/2011/11/07/animated-buttons-with-css3/
Icons by http://www.webiconset.com/
Font/Icons by http://www.justbenicestudio.com/
*/

.cplus-bouton{

    height: 22px;
    width: 22px;

    display:inline-block;
    position:relative;
    
    /*Effet ombré*/
    -webkit-box-shadow:0px 1px 1px rgba(255,255,255,0.2) inset, 1px 1px 3px rgba(0,0,0,0.2);
    -moz-box-shadow:0px 1px 1px rgba(255,255,255,0.2) inset, 1px 1px 3px rgba(0,0,0,0.2);
    box-shadow:0px 1px 1px rgba(255,255,255,0.2) inset, 1px 1px 3px rgba(0,0,0,0.2);

    /*Radius*/
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    
    /*Transistion d'effet*/
    -webkit-transition:box-shadow 0.3s ease-in-out;
    -moz-transition:box-shadow 0.3s ease-in-out;
    -o-transition:box-shadow 0.3s ease-in-out;
    transition:box-shadow 0.3s ease-in-out;

}

.cplus-bouton{
    /*couleur par défaut*/
    background:#CCBD90;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#DED5B6,0),color-stop(#CCBD90,1));
    background:-webkit-linear-gradient(top, #DED5B6 0%, #CCBD90 100%);
    background:-moz-linear-gradient(top, #DED5B6 0%, #CCBD90 100%);
    background:-o-linear-gradient(top, #DED5B6 0%, #CCBD90 100%);
    background:linear-gradient(top, #DED5B6 0%, #CCBD90 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#DED5B6', endColorstr='#CCBD90',GradientType=0 );
    border:1px solid #C9B989;
}

.cplus-bouton:hover,
.cplus-bouton:focus{
    -webkit-box-shadow:0px 1px 1px rgba(255,255,255,0.4) inset, 1px 1px 5px rgba(0,0,0,0.4);
    -moz-box-shadow:0px 1px 1px rgba(255,255,255,0.4) inset, 1px 1px 5px rgba(0,0,0,0.4);
    box-shadow:0px 1px 1px rgba(255,255,255,0.4) inset, 1px 1px 5px rgba(0,0,0,0.4);
    cursor: pointer;
}

.cplus-bouton.pas-bouton:hover,
.cplus-bouton.pas-bouton:focus{
    -webkit-box-shadow:0px 1px 1px rgba(255,255,255,0.8) inset, 1px 1px 3px rgba(0,0,0,0.2);
    -moz-box-shadow:0px 1px 1px rgba(255,255,255,0.8) inset, 1px 1px 3px rgba(0,0,0,0.2);
    box-shadow:0px 1px 1px rgba(255,255,255,0.8) inset, 1px 1px 3px rgba(0,0,0,0.2);
    cursor: default !important;
}

.cplus-bouton.gris_fonce{
    background:#888888;
    /*background:-webkit-gradient(linear,left top,left bottom,color-stop(#CCCCCC,0),color-stop(#AAAAAA,1));
    background:-webkit-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:-moz-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:-o-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCBD90', endColorstr='#AAAAAA',GradientType=0 );*/
    border:1px solid #777777;
}

.cplus-bouton.gris{
    background:#CCCCCC;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#CCCCCC,0),color-stop(#AAAAAA,1));
    background:-webkit-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:-moz-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:-o-linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    background:linear-gradient(top, #CCCCCC 0%, #AAAAAA 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCBD90', endColorstr='#AAAAAA',GradientType=0 );
    border:1px solid #BBBBBB;
}

.cplus-bouton.bleu{
    background:#80a9da;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#80a9da,0),color-stop(#6f97c5,1));
    background:-webkit-linear-gradient(top, #80a9da 0%, #6f97c5 100%);
    background:-moz-linear-gradient(top, #80a9da 0%, #6f97c5 100%);
    background:-o-linear-gradient(top, #80a9da 0%, #6f97c5 100%);
    background:linear-gradient(top, #80a9da 0%, #6f97c5 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#80a9da', endColorstr='#6f97c5',GradientType=0 );
    border:1px solid #5d81ab;
}

.cplus-bouton.vert{
    background:#8CBE63;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#8CBE63,0),color-stop(#ADDD87,1));
    background:-webkit-linear-gradient(top, #8CBE63 0%, #ADDD87 100%);
    background:-moz-linear-gradient(top, #8CBE63 0%, #ADDD87 100%);
    background:-o-linear-gradient(top, #8CBE63 0%, #ADDD87 100%);
    background:linear-gradient(top, #8CBE63 0%, #ADDD87 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#8CBE63', endColorstr='#ADDD87',GradientType=0 );
    border:1px solid #8EB46E;
}

.cplus-bouton.jaune{
    background:#E3AE46;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#E3AE46,0),color-stop(#EEC97F,1));
    background:-webkit-linear-gradient(top, #E3AE46 0%, #EEC97F 100%);
    background:-moz-linear-gradient(top, #E3AE46 0%, #EEC97F 100%);
    background:-o-linear-gradient(top, #E3AE46 0%, #EEC97F 100%);
    background:linear-gradient(top, #E3AE46 0%, #EEC97F 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#E3AE46', endColorstr='#EEC97F',GradientType=0 );
    border:1px solid #DEAE50;
}

.cplus-bouton.rouge{
    background:#D3393F;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#D3393F,0),color-stop(#EB666A,1));
    background:-webkit-linear-gradient(top, #D3393F 0%, #EB666A 100%);
    background:-moz-linear-gradient(top, #D3393F 0%, #EB666A 100%);
    background:-o-linear-gradient(top, #D3393F 0%, #EB666A 100%);
    background:linear-gradient(top, #D3393F 0%, #EB666A 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#D3393F', endColorstr='#EB666A',GradientType=0 );
    border:1px solid #D74B4F;
}

.cplus-bouton.orange{
    background:#FFAA00;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#FFAA00,0),color-stop(#D96D00,1));
    background:-webkit-linear-gradient(top, #FFAA00 0%, #D96D00 100%);
    background:-moz-linear-gradient(top, #FFAA00 0%, #D96D00 100%);
    background:-o-linear-gradient(top, #FFAA00 0%, #D96D00 100%);
    background:linear-gradient(top, #FFAA00 0%, #D96D00 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFAA00', endColorstr='#D96D00',GradientType=0 );
    border:1px solid #F09100;
}

.cplus-bouton.violet{
    background:#9d4beb;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#9d4beb,0),color-stop(#b971fd,1));
    background:-webkit-linear-gradient(top, #9d4beb 0%, #b971fd 100%);
    background:-moz-linear-gradient(top, #9d4beb 0%, #b971fd 100%);
    background:-o-linear-gradient(top, #9d4beb 0%, #b971fd 100%);
    background:linear-gradient(top, #9d4beb 0%, #b971fd 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d4beb', endColorstr='#b971fd',GradientType=0 );
    border:1px solid #ac61f3;
}

.cplus-bouton.inactif{
    background:#CDCDCD;
    background:-webkit-gradient(linear,left top,left bottom,color-stop(#E8E8E8,0),color-stop(#CDCDCD,1));
    background:-webkit-linear-gradient(top, #E8E8E8 0%, #CDCDCD 100%);
    background:-moz-linear-gradient(top, #E8E8E8 0%, #CDCDCD 100%);
    background:-o-linear-gradient(top, #E8E8E8 0%, #CDCDCD 100%);
    background:linear-gradient(top, #E8E8E8 0%, #CDCDCD 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCBD90', endColorstr='#CDCDCD',GradientType=0 );
    border:1px solid #D1D1D1;
    cursor:default;
}

.cplus-bouton.carre{
    width: 32px;
    height: 32px;
}

.cplus-bouton.petit.carre{
    width: 12px;
    height: 12px;
}

.cplus-bouton.moyen.carre{
    width: 22px;
    height: 22px;
}

.cplus-bouton.grand.carre{
    width: 48px;
    height: 48px;
}

.cplus-bouton.plus-grand.carre{
    width: 64px;
    height: 64px;
}


.cplus-bouton.petit.rond{
    width: 12px;
    height: 12px;

    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;
}

.cplus-bouton.rond{
    width: 32px;
    height: 32px;

    -webkit-border-radius:16px;
    -moz-border-radius:16px;
    border-radius:16px;
}

.cplus-bouton.moyen.rond{
    width: 22px;
    height: 22px;

    -webkit-border-radius:11px;
    -moz-border-radius:11px;
    border-radius:11px;
}

.cplus-bouton.grand.rond{
    width: 48px;
    height: 48px;

    -webkit-border-radius:24px;
    -moz-border-radius:24px;
    border-radius:24px;
}

.cplus-bouton.plus-grand.rond{
    width: 64px;
    height: 64px;

    -webkit-border-radius:32px;
    -moz-border-radius:32px;
    border-radius:32px;
}

.cplus-bouton.image{
    text-indent: -9999px;
    overflow: hidden;
}

.cplus-bouton.petit.image:before,
.cplus-bouton.moyen.image:before,
.cplus-bouton.image:before,
.cplus-bouton.grand.image:before,
.cplus-bouton.plus-grand.image:before{
    content: '';
    position: absolute;
    background: transparent url(Btns_systeme_b.png?ver=1.4) 0px center no-repeat;
    background-size: cover;
    /*top: 0;
    right: 0;
    bottom: 0;
    left: 0;*/
    top: 50%;
    bottom: 50%;
    left: 50%;
    right: 50%;

    /*default image dimensions*/
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
}

.cplus-bouton.petit.image.inactif:before,
.cplus-bouton.moyen.image.inactif:before,
.cplus-bouton.image.inactif:before,
.cplus-bouton.grand.image.inactif:before,
.cplus-bouton.plus-grand.image.inactif:before{
    background: transparent url(Btns_systeme_g.png?ver=1.4) 0px center no-repeat;
    background-size: cover;
}

.cplus-bouton.carre.image:before{
    width: 30px;
    height: 30px;
    margin-left: -15px;
    margin-top: -15px;
}

.cplus-bouton.petit.image:before{
    width: 10px;
    height: 10px;
    margin-left: -5px;
    margin-top: -5px;
}

.cplus-bouton.moyen.image:before{
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
}

.cplus-bouton.image:before{
    
}

.cplus-bouton.grand.image:before{
    width: 46px;
    height: 46px;
    margin-left: -23px;
    margin-top: -23px;
}

.cplus-bouton.plus-grand.image:before{
    width: 62px;
    height: 62px;
    margin-left: -31px;
    margin-top: -31px;
}


.cplus-bouton.rond.petit.image:before{
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}

.cplus-bouton.rond.moyen.image:before{
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}

.cplus-bouton.rond.image:before{
    width: 28px;
    height: 28px;
    margin-left: -14px;
    margin-top: -14px;
}

.cplus-bouton.rond.grand.image:before{
    width: 44px;
    height: 44px;
    margin-left: -22px;
    margin-top: -22px;
}

.cplus-bouton.rond.plus-grand.image:before{
    width: 60px;
    height: 60px;
    margin-left: -30px;
    margin-top: -30px;
}


/* 

Liste des boutons images :
Par défaut : Lecture
fleche-haut, fleche-bas, fleche-droite, fleche-gauche : Flèche de direction
calendrier : Calendrier
calendrier-import : Import calendrier
deconnexion : Déconnexion
aide : Point d'interrogation
cadena : Cadena
information : Lettre i
famille 
exclamation
informations
remove
hourglass
refresh

ok : coche validation
remove : croix X
hourglass : Sablier
refresh : flèche ronde de rafraichissement de page

*/

.cplus-bouton.image.fleche-haut:before,
.cplus-bouton.image.fleche-bas:before,
.cplus-bouton.image.fleche-gauche:before,
.cplus-bouton.image.fleche-droite:before{
    width: 24px;
    height: 24px;
    margin-left: -12px;
    margin-top: -12px;
}

.cplus-bouton.petit.image.fleche-haut:before{
    background-position: -130px center;
}
.cplus-bouton.moyen.image.fleche-haut:before{
    background-position: -260px center;
}
.cplus-bouton.image.fleche-haut:before{
    background-position: -390px center;
}
.cplus-bouton.grand.image.fleche-haut:before{
    background-position: -598px center;
}
.cplus-bouton.plus-grand.fleche-haut:before{
    background-position: -806px center;
}
.cplus-bouton.rond.image.fleche-haut:before{
    background-position: -364px center;
}
.cplus-bouton.petit.rond.image.fleche-haut:before{
    background-position: -104px center;
}
.cplus-bouton.moyen.rond.image.fleche-haut:before{
    background-position: -234px center;
}
.cplus-bouton.grand.rond.image.fleche-haut:before{
    background-position: -572px center;
}
.cplus-bouton.plus-grand.rond.image.fleche-haut:before{
    background-position: -780px center;
}

.cplus-bouton.petit.image.fleche-bas:before{
    background-position: -140px center;
}
.cplus-bouton.moyen.image.fleche-bas:before{
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
    background-position: -280px center;
}
.cplus-bouton.image.fleche-bas:before{
    background-position: -420px center;
}
.cplus-bouton.grand.image.fleche-bas:before{
    background-position: -644px center;
}
.cplus-bouton.plus-grand.fleche-bas:before{
    background-position: -868px center;
}
.cplus-bouton.rond.image.fleche-bas:before{
    background-position: -392px center;
}
.cplus-bouton.petit.rond.image.fleche-bas:before{
    background-position: -112px center;
}
.cplus-bouton.moyen.rond.image.fleche-bas:before{
    background-position: -252px center;
}
.cplus-bouton.grand.rond.image.fleche-bas:before{
    background-position: -616px center;
}
.cplus-bouton.plus-grand.rond.image.fleche-bas:before{
    background-position: -840px center;
}

.cplus-bouton.petit.image.fleche-gauche:before{
    background-position: -110px center;
}
.cplus-bouton.moyen.image.fleche-gauche:before{
    background-position: -220px center;
}
.cplus-bouton.image.fleche-gauche:before{
    background-position: -330px center;
}
.cplus-bouton.grand.image.fleche-gauche:before{
    background-position: -506px center;
}
.cplus-bouton.plus-grand.fleche-gauche:before{
    background-position: -682px center;
}
.cplus-bouton.rond.image.fleche-gauche:before{
    background-position: -264px center;
}
.cplus-bouton.petit.rond.image.fleche-gauche:before{
    background-position: -88px center;
}
.cplus-bouton.moyen.rond.image.fleche-gauche:before{
    background-position: -198px center;
}
.cplus-bouton.grand.rond.image.fleche-gauche:before{
    background-position: -484px center;
}
.cplus-bouton.plus-grand.rond.image.fleche-gauche:before{
    background-position: -660px center;
}

.cplus-bouton.petit.image.fleche-droite:before{
    background-position: -120px center;
}
.cplus-bouton.moyen.image.fleche-droite:before{
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
    background-position: -240px center;
}
.cplus-bouton.image.fleche-droite:before{
    background-position: -360px center;
}
.cplus-bouton.grand.image.fleche-droite:before{
    background-position: -552px center;
}
.cplus-bouton.plus-grand.fleche-droite:before{
    background-position: -744px center;
}
.cplus-bouton.rond.image.fleche-droite:before{
    background-position: -288px center;
}
.cplus-bouton.petit.rond.image.fleche-droite:before{
    background-position: -96px center;
}
.cplus-bouton.moyen.rond.image.fleche-droite:before{
    background-position: -240px center;
}
.cplus-bouton.grand.rond.image.fleche-droite:before{
    background-position: -529px center;
}
.cplus-bouton.plus-grand.rond.image.fleche-droite:before{
    background-position: -720px center;
}


.cplus-bouton.petit.image.fleche-droite:before{
    background-position: -120px center;
}
.cplus-bouton.moyen.image.fleche-droite:before{
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
    background-position: -240px center;
}
.cplus-bouton.image.fleche-droite:before{
    background-position: -360px center;
}
.cplus-bouton.grand.image.fleche-droite:before{
    background-position: -552px center;
}
.cplus-bouton.plus-grand.fleche-droite:before{
    background-position: -744px center;
}
.cplus-bouton.rond.image.fleche-droite:before{
    background-position: -288px center;
}
.cplus-bouton.petit.rond.image.fleche-droite:before{
    background-position: -96px center;
}
.cplus-bouton.moyen.rond.image.fleche-droite:before{
    background-position: -240px center;
}
.cplus-bouton.grand.rond.image.fleche-droite:before{
    background-position: -529px center;
}
.cplus-bouton.plus-grand.rond.image.fleche-droite:before{
    background-position: -720px center;
}


.cplus-bouton.petit.image.calendrier:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.calendrier:before{
    background-position: -460px center;
}
.cplus-bouton.image.calendrier:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.calendrier:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.calendrier:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.calendrier:before{
    background-position: -552px center;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    margin-top: -12px;
}
.cplus-bouton.petit.rond.image.calendrier:before{
    background-position: -184px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.calendrier:before{
    background-position: -414px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.calendrier:before{
    background-position: -874px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.calendrier:before{
    background-position: -1150px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}


.cplus-bouton.petit.image.calendrier-import:before{
    background-position: -240px center;
}
.cplus-bouton.moyen.image.calendrier-import:before{
    background-position: -480px center;
}
.cplus-bouton.image.calendrier-import:before{
    background-position: -720px center;
}
.cplus-bouton.grand.image.calendrier-import:before{
    background-position: -1104px center;
}
.cplus-bouton.plus-grand.calendrier-import:before{
    background-position: -1488px center;
}
.cplus-bouton.rond.image.calendrier-import:before{
    background-position: -576px center;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    margin-top: -12px;
}
.cplus-bouton.petit.rond.image.calendrier-import:before{
    background-position: -192px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.calendrier-import:before{
    background-position: -432px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.calendrier-import:before{
    background-position: -912px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.calendrier-import:before{
    background-position: -1200px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.deconnexion:before{
    background-position: -306px center;
}
.cplus-bouton.moyen.image.deconnexion:before{
    background-position: -306px center;
}
.cplus-bouton.image.deconnexion:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.deconnexion:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.deconnexion:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.deconnexion:before{
    background-position: -374px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.deconnexion:before{
    background-position: -184px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.deconnexion:before{
    background-position: -289px center;
    width: 17px;
    height: 17px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.deconnexion:before{
    background-position: -874px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.deconnexion:before{
    background-position: -1150px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.aide:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.aide:before{
    background-position: -460px center;
}
.cplus-bouton.image.aide:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.aide:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.aide:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.aide:before{
    background-position: -646px center;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    margin-top: -12px;
}
.cplus-bouton.petit.rond.image.aide:before{
    background-position: -184px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.aide:before{
    background-position: -414px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.aide:before{
    background-position: -874px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.aide:before{
    background-position: -1150px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.cadena:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.cadena:before{
    background-position: -460px center;
}
.cplus-bouton.image.cadena:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.cadena:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.cadena:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.cadena:before{
    background-position: -396px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.cadena:before{
    background-position: -184px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.cadena:before{
    background-position: -324px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.cadena:before{
    background-position: -874px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.cadena:before{
    background-position: -1150px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}


.cplus-bouton.petit.image.famille:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.famille:before{
    background-position: -460px center;
}
.cplus-bouton.image.famille:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.famille:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.famille:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.famille:before{
    background-position: -814px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.famille:before{
    background-position: -296px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.famille:before{
    background-position: -592px center;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
}
.cplus-bouton.grand.rond.image.famille:before{
    background-position: -1332px center;
    width: 36px;
    height: 36px;
    margin-left: -18px;
    margin-top: -18px;
}
.cplus-bouton.plus-grand.rond.image.famille:before{
    background-position: -1704px center;
    width: 46px;
    height: 46px;
    margin-left: -20px;
    margin-top: -25px;
}


.cplus-bouton.petit.image.exclamation:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.exclamation:before{
    background-position: -760px center;
}
.cplus-bouton.image.exclamation:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.exclamation:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.exclamation:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.exclamation:before{
    background-position: -836px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.exclamation:before{
    background-position: -296px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.exclamation:before{
    background-position: -592px center;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
}
.cplus-bouton.grand.rond.image.exclamation:before{
    background-position: -1332px center;
    width: 36px;
    height: 36px;
    margin-left: -18px;
    margin-top: -18px;
}
.cplus-bouton.plus-grand.rond.image.exclamation:before{
    background-position: -1704px center;
    width: 46px;
    height: 46px;
    margin-left: -20px;
    margin-top: -25px;
}


.cplus-bouton.petit.image.informations:before{
    background-position: -230px center;
}
.cplus-bouton.moyen.image.informations:before{
    background-position: -460px center;
}
.cplus-bouton.image.informations:before{
    background-position: -690px center;
}
.cplus-bouton.grand.image.informations:before{
    background-position: -1058px center;
}
.cplus-bouton.plus-grand.informations:before{
    background-position: -1426px center;
}
.cplus-bouton.rond.image.informations:before{
    background-position: -572px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.informations:before{
    background-position: -184px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.informations:before{
    background-position: -468px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.informations:before{
    background-position: -874px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.informations:before{
    background-position: -1150px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.remove:before{
    background-position: -100px center;
}
.cplus-bouton.moyen.image.remove:before{
    background-position: -200px center;
}
.cplus-bouton.image.remove:before{
    background-position: -300px center;
}
.cplus-bouton.grand.image.remove:before{
    background-position: -460px center;
}
.cplus-bouton.plus-grand.remove:before{
    background-position: -620px center;
}
.cplus-bouton.rond.image.remove:before{
    background-position: -220px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.remove:before{
    background-position: -80px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.remove:before{
    background-position: -180px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.remove:before{
    background-position: -380px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.remove:before{
    background-position: -500px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.hourglass:before{
    background-position: -20px center;
}
.cplus-bouton.moyen.image.hourglass:before{
    background-position: -40px center;
}
.cplus-bouton.image.hourglass:before{
    background-position: -60px center;
}
.cplus-bouton.grand.image.hourglass:before{
    background-position: -91px center;
}
.cplus-bouton.plus-grand.hourglass:before{
    background-position: -121px center;
}
.cplus-bouton.rond.image.hourglass:before{
    background-position: -44px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.hourglass:before{
    background-position: -16px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.hourglass:before{
    background-position: -36px center;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    margin-top: -9px;
}
.cplus-bouton.grand.rond.image.hourglass:before{
    background-position: -76px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.hourglass:before{
    background-position: -100px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.image.refresh:before{
    background-position: -120px center;
}
.cplus-bouton.petit.image.refresh:before{
    background-position: -40px center;
}
.cplus-bouton.moyen.image.refresh:before{
    background-position: -80px center;
}
.cplus-bouton.grand.image.refresh:before{
    background-position: -184px center;
}
.cplus-bouton.plus-grand.refresh:before{
    background-position: -248px center;
}
.cplus-bouton.petit.rond.image.refresh:before{
    background-position: -32px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.refresh:before{
    background-position: -64px center;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
}
.cplus-bouton.rond.image.refresh:before{
    background-position: -95px center;
    width: 24px;
    height: 24px;
    margin-left: -13px;
    margin-top: -13px;
}
.cplus-bouton.grand.rond.image.refresh:before{
    background-position: -152px center;
    width: 38px;
    height: 38px;
    margin-left: -19px;
    margin-top: -19px;
}
.cplus-bouton.plus-grand.rond.image.refresh:before{
    background-position: -200px center;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}



.cplus-bouton.petit.image.engrenages:before{
    background-position: -56px center;
}
.cplus-bouton.moyen.image.engrenages:before{
    background-position: -112px center;
}
.cplus-bouton.image.engrenages:before{
    background-position: -210px center;
}
.cplus-bouton.grand.image.engrenages:before{
    background-position: -252px center;
}
.cplus-bouton.plus-grand.engrenages:before{
    background-position: -324px center;
}
.cplus-bouton.rond.image.engrenages:before{
    background-position: -154px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.engrenages:before{
    background-position: -56px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.engrenages:before{
    background-position: -112px center;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
}
.cplus-bouton.grand.rond.image.engrenages:before{
    background-position: -252px center;
    width: 36px;
    height: 36px;
    margin-left: -18px;
    margin-top: -18px;
}
.cplus-bouton.plus-grand.rond.image.engrenages:before{
    background-position: -324px center;
    width: 46px;
    height: 46px;
    margin-left: -20px;
    margin-top: -25px;
}

.cplus-bouton.petit.image.calendrier_error:before{
    background-position: -390px center;
}
.cplus-bouton.moyen.image.calendrier_error:before{
    background-position: -780px center;
}
.cplus-bouton.image.calendrier_error:before{
    background-position: -1170px center;
}
.cplus-bouton.grand.image.calendrier_error:before{
    background-position: -1794px center;
}
.cplus-bouton.plus-grand.calendrier_error:before{
    background-position: -2418px center;
}
.cplus-bouton.rond.image.calendrier_error:before{
    background-position: -858px center;
    width: 22px;
    height: 22px;
    margin-left: -11px;
    margin-top: -11px;
}
.cplus-bouton.petit.rond.image.calendrier_error:before{
    background-position: -312px center;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    margin-top: -4px;
}
.cplus-bouton.moyen.rond.image.calendrier_error:before{
    background-position: -624px center;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    margin-top: -8px;
}
.cplus-bouton.grand.rond.image.calendrier_error:before{
    background-position: -1404px center;
    width: 36px;
    height: 36px;
    margin-left: -18px;
    margin-top: -18px;
}
.cplus-bouton.plus-grand.rond.image.calendrier_error:before{
    background-position: -1796px center;
    width: 46px;
    height: 46px;
    margin-left: -20px;
    margin-top: -25px;
}



/******************** Utlisé dans le dossier Famille **********************/
.cplus-bouton.gros-bouton{

    width: 100%;

    /*height:90px;*/
    height:75px;
    max-height:75px;

    /*max-width: 320px;*/
    max-width: 280px;
    min-width: 200px;

    color: #fff !important;
    text-decoration: none;

    /*padding-left:90px;
    padding-right:105px;*/
    padding-left: 48px;
    padding-right: 48px;

    margin: 0px;

    float:left;
    clear:both;
    overflow:hidden;

    display: table;
}

.cplus-bouton.gros-bouton img{
    position:absolute;
    width: 42px;
    left:6px;
    top:16px;
    border:none;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
}
.cplus-bouton.gros-bouton .cplus-bouton-slide-text,
.cplus-bouton.gros-bouton .cplus-bouton-slide-text2{
    position:absolute;
    /*width: 205px;
    max-width: 205px;*/
    width: calc(100% - 60px);

    text-align: center;
    /*font-size:36px;
    top:18px;
    top:35px;
    left:18px;*/
    color:#FFF;
    text-shadow:0px 1px 1px rgba(0,0,0,0.3);
    -webkit-transform:scale(0);
    -moz-transform:scale(0);
    -ms-transform:scale(0);
    -o-transform:scale(0);
    transform:scale(0);
    opacity:0;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
}

.cplus-bouton.gros-bouton .cplus-bouton-slide-text{
    top: 5px;
    left: 10px;
    font-size: 14px;
    line-height: 1em;
}

.cplus-bouton.gros-bouton .cplus-bouton-slide-text2{
    bottom: 5px;
    left: 10px;
    font-size: 16px;
    font-weight: bold;
}

.cplus-bouton.gros-bouton .cplus-bouton-text{
    display: table-cell;
    vertical-align: middle;
    padding-top: 0;
}

.cplus-bouton.gros-bouton .cplus-bouton-text{
    padding-top: 13px;
    display: block;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: -1px;

    /*max-width: 110px;
    min-width: 110px;*/

    text-align: center;

    opacity:1;
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);

    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
}

.cplus-bouton.gros-bouton:hover .cplus-bouton-text{
    padding-top: 0;

    opacity:0;
    -webkit-transform:scale(0);
    -moz-transform:scale(0);
    -ms-transform:scale(0);
    -o-transform:scale(0);
    transform:scale(0);
}

.cplus-bouton.gros-bouton.bleu .cplus-bouton-text{
    text-shadow:0px -1px 1px #5d81ab;
}

.cplus-bouton.gros-bouton.vert .cplus-bouton-text{
    text-shadow:0px -1px 1px #8EB46E;
}

.cplus-bouton.gros-bouton.jaune .cplus-bouton-text{
    text-shadow:0px -1px 1px #DEAE50;
}

.cplus-bouton.gros-bouton.rouge .cplus-bouton-text{
    text-shadow:0px -1px 1px #D74B4F;
}

.cplus-bouton.gros-bouton.orange .cplus-bouton-text{
    text-shadow:0px -1px 1px #F09100;
}

.cplus-bouton.gros-bouton .cplus-bouton-text small{
    display:block;
    font-size:12px;
    letter-spacing:0px;
    line-height: 1em;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right{
    position:absolute;
    right:0px;
    top:0px;
    height:100%;
    /*width:80px;*/
    width:44px;
    -webkit-box-shadow:1px 0px 1px rgba(255,255,255,0.4) inset;
    -moz-box-shadow:1px 0px 1px rgba(255,255,255,0.4) inset;
    box-shadow:1px 0px 1px rgba(255,255,255,0.4) inset;
}

.cplus-bouton.gros-bouton.bleu .cplus-bouton-icon-right{
    border-left:1px solid #5d81ab;
}

.cplus-bouton.gros-bouton.vert .cplus-bouton-icon-right{
    border-left:1px solid #8EB46E;
}

.cplus-bouton.gros-bouton.jaune .cplus-bouton-icon-right{
    border-left:1px solid #DEAE50;
}

.cplus-bouton.gros-bouton.rouge .cplus-bouton-icon-right{
    border-left:1px solid #D74B4F;
}

.cplus-bouton.gros-bouton.orange .cplus-bouton-icon-right{
    border-left:1px solid #F09100;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right span{
    width:32px;
    height:32px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    border-radius:20px;
    position:absolute;
    left:50%;
    top:50%;
    margin:-16px 0px 0px -16px;
    border:1px solid rgba(0,0,0,0.5);
    background:#adadad url(./arrow_down.png) no-repeat center center;
    -webkit-box-shadow:0px 1px 1px rgba(255,255,255,0.3) inset, 0px 1px 2px rgba(255,255,255,0.5);
    -moz-box-shadow:0px 1px 1px rgba(255,255,255,0.3) inset, 0px 1px 2px rgba(255,255,255,0.5);
    box-shadow:0px 1px 1px rgba(255,255,255,0.3) inset, 0px 1px 2px rgba(255,255,255,0.5);
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right span.icon1{
    opacity:0.7;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right span.icon2{
    opacity:0;
    background:#5b5b5b url(./go.png) no-repeat center center;
    /*background-size: 70%;*/
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-edit span.icon1{
    background:#5b5b5b url(./edit.png) no-repeat center center;
    background-size: 70%;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-hourglass span.icon1{
    background:#5b5b5b url(./hourglass.png) no-repeat center center;
    background-size: 74%;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-valid span.icon1{
    background:#5b5b5b url(./valid.png) no-repeat center center;
    background-size: 70%;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-unvalid span.icon1{
    background:#5b5b5b url(./unvalid.png) no-repeat center center;
    background-size: 70%;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-renew span.icon1{
    background:#5b5b5b url(./renew.png) no-repeat center center;
    background-size: 70%;
}

.cplus-bouton.gros-bouton .cplus-bouton-icon-right.cplus-icon-cadena span.icon1{
    background:#5b5b5b url(./cadena.png) no-repeat center center;
    background-size: 70%;
}

.cplus-bouton.gros-bouton:hover img{
    /*opacity:0;*/
}

.cplus-bouton.gros-bouton:hover .cplus-bouton-slide-text,
.cplus-bouton.gros-bouton:hover .cplus-bouton-slide-text2{
    opacity:1;
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);
}

.cplus-bouton.gros-bouton:hover .cplus-bouton-icon-right span{
    background-color:#afafaf;

    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -ms-transform:rotate(360deg);
    -o-transform:rotate(360deg);
    transform:rotate(360deg);
}

.cplus-bouton.gros-bouton:hover .cplus-bouton-icon-right span.icon1{
    opacity: 0;
}

.cplus-bouton.gros-bouton:hover .cplus-bouton-icon-right span.icon2{
    opacity: 1;
}

.cplus-bouton.gros-bouton.bleu:hover .cplus-bouton-icon-right span{
    background-color:#5d81ab;
}

.cplus-bouton.gros-bouton.vert:hover .cplus-bouton-icon-right span{
    background-color:#8EB46E;
}

.cplus-bouton.gros-bouton.jaune:hover .cplus-bouton-icon-right span{
    background-color:#DEAE50;
}

.cplus-bouton.gros-bouton.rouge:hover .cplus-bouton-icon-right span{
    background-color:#D74B4F;
}

.cplus-bouton.gros-bouton.orange:hover .cplus-bouton-icon-right span{
    background-color:#F09100;
}


/******************** Version 2 : désactivation du hover afin d'afficher les libellés pour les appareils tactiles **********************/
.cplus-bouton.gros-bouton-v2{

    width: 100%;

    /*height:90px;*/
    height:75px;
    max-height:75px;

    /*max-width: 320px;*/
    max-width: 280px;
    min-width: 200px;

    color: #fff !important;
    text-decoration: none;

    /*padding-left:90px;
    padding-right:105px;*/
    padding-left: 48px;
    padding-right: 4px;
	padding-top: 4px;

    margin: 0px;

    float:left;
    clear:both;
    overflow:hidden;

    display: table;
}

.cplus-bouton.gros-bouton-v2 img{
    position:absolute;
    width: 42px;
    left:6px;
    top:16px;
    border:none;
    -webkit-transition:all 0.15s ease-in-out;
    -moz-transition:all 0.15s ease-in-out;
    -o-transition:all 0.15s ease-in-out;
    transition:all 0.15s ease-in-out;
	
	-webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);
}

.cplus-bouton.gros-bouton-v2:hover img{
    /*opacity:0;*/
	-webkit-transform:scale(1.14);
    -moz-transform:scale(1.14);
    -ms-transform:scale(1.14);
    -o-transform:scale(1.14);
    transform:scale(1.14);
}

.cplus-bouton.gros-bouton-v2 .cplus-bouton-text,
.cplus-bouton.gros-bouton-v2 .cplus-bouton-text2{
    display: table-cell;
    vertical-align: middle;
    padding-top: 0;
}

.cplus-bouton.gros-bouton-v2 .cplus-bouton-text{
    margin-top: 4px;
    display: block;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: -1px;

    /*max-width: 110px;
    min-width: 110px;*/

    text-align: center;

    /*opacity:1;
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);

    -webkit-transition:all 0.1s ease-in-out;
    -moz-transition:all 0.1s ease-in-out;
    -o-transition:all 0.1s ease-in-out;
    transition:all 0.1s ease-in-out;*/
}

.cplus-bouton.gros-bouton-v2 .cplus-bouton-text2{
    margin-top: 4px;
    display: block;
    /*font-size: 16px;*/
    line-height: 20px;
    /*letter-spacing: -1px;*/

    /*max-width: 110px;
    min-width: 110px;*/

    text-align: center;
	
	font-weight: bold;

    /*opacity:1;
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1);
    -o-transform:scale(1);
    transform:scale(1);

    -webkit-transition:all 0.1s ease-in-out;
    -moz-transition:all 0.1s ease-in-out;
    -o-transition:all 0.1s ease-in-out;
    transition:all 0.1s ease-in-out;*/
}

.cplus-bouton.gros-bouton-v2:hover .cplus-bouton-text,
.cplus-bouton.gros-bouton-v2:hover .cplus-bouton-text2{
    /*padding-top: 0;*/

    /*opacity:0;*/
    /*-webkit-transform:scale(1.03);
    -moz-transform:scale(1.03);
    -ms-transform:scale(1.03);
    -o-transform:scale(1.03);
    transform:scale(1.03);*/
}

.cplus-bouton.gros-bouton-v2.bleu .cplus-bouton-text{
    text-shadow:0px -1px 1px #5d81ab;
}

.cplus-bouton.gros-bouton-v2.vert .cplus-bouton-text{
    text-shadow:0px -1px 1px #8EB46E;
}

.cplus-bouton.gros-bouton-v2.jaune .cplus-bouton-text{
    text-shadow:0px -1px 1px #DEAE50;
}

.cplus-bouton.gros-bouton-v2.rouge .cplus-bouton-text{
    text-shadow:0px -1px 1px #D74B4F;
}

.cplus-bouton.gros-bouton-v2.orange .cplus-bouton-text{
    text-shadow:0px -1px 1px #F09100;
}

.cplus-bouton.gros-bouton-v2 .cplus-bouton-text small{
    display:block;
    font-size:12px;
    letter-spacing:0px;
    line-height: 1em;
}

/*
Variable Browser Zoom Fix
https://danreynolds.ca/tech/2017/10/15/Variable-Browser-Zoom/
document.querySelector('body').style.zoom = `${1 / window.devicePixelRatio * 100}%`;
*/

@media (-webkit-device-pixel-ratio: 0.75) {
  .cplus-bouton.image:before {
    zoom: 133.33333333333331%;
  }
}

@media (-webkit-device-pixel-ratio: 0.8) {
  .cplus-bouton.image:before {
    zoom: 124.99999813735488%;
  }
}

@media (-webkit-device-pixel-ratio: 0.9) {
  .cplus-bouton.image:before {
    zoom: 111.11111405455043%;
  }
}

@media (-webkit-device-pixel-ratio: 1.1) {
  .cplus-bouton.image:before {
    zoom: 90.90908893868948%;
  }
}

@media (-webkit-device-pixel-ratio: 1.25) {
  .cplus-bouton.image:before {
    zoom: 80%;
  }
}

@media (-webkit-device-pixel-ratio: 1.5) {
  .cplus-bouton.image:before {
    zoom: 66.66666666666666%;
  }
}

@media (-webkit-device-pixel-ratio: 1.75) {
  .cplus-bouton.image:before {
    zoom: 57.14285714285714%;
  }
}

/* ¯¯¯¯¯¯¯¯¯ *\
  CONNECT
\* ˍˍˍˍˍˍˍˍˍ */
a.btn.fr-connect {
  position: relative;
  padding: 1.25em 0.75em 1.25em 4em;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  margin-bottom: 0.75rem;
  text-decoration: none;
}

a.fr-connect:focus, a.fr-connect:hover {
  color: #FFF;
  text-decoration: none;
}

a.fr-connect::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  bottom: 0.25em;
  left: 0.75em;
  width: 2.5em;
  height: 3em;
  margin-top: -1.5em;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 48'%3E%3Cpath fill='%232a2f82' d='M34.965 15.1 19.971 6.423 4.977 15.184a.606.606 0 0 0-.306.524v16.948a.666.666 0 0 0 .306.524l14.992 8.6 14.994-8.706a.665.665 0 0 0 .306-.524V15.628a.605.605 0 0 0-.304-.528Z'/%3E%3Cpath fill='%23df1f26' d='m14.614 15.6-5.029 8.628-4.557-9.175 5.39-3.113 4.489 3.16ZM35.27 32.58V15.622a.6.6 0 0 0-.306-.523L19.971 6.423'/%3E%3Cpath fill='%232e65b0' d='m4.673 32.58 15.3-26.157v35.362L4.977 33.18a.666.666 0 0 1-.306-.524V15.708Zm24.669-20.735L34.8 15l-4.489 9.15-5.387-9.236Z'/%3E%3Cpath fill='%23fff' d='m39.606 12.305-19.19-11.02a.933.933 0 0 0-.832 0L.394 12.305A.886.886 0 0 0 0 13v22a.886.886 0 0 0 .394.7l19.189 11.02a.933.933 0 0 0 .832 0L39.606 35.7A.886.886 0 0 0 40 35V13a.886.886 0 0 0-.394-.695ZM10.762 30.061h.079c-.042 0-.079.007-.079.05 0 .1.151 0 .2.1a.912.912 0 0 0-.629.276c0 .051.1.051.151.051-.075.1-.226.05-.277.151a.177.177 0 0 0 .1.05c-.05 0-.1 0-.1.051v.151c-.126 0-.176.1-.277.151.2.151.327 0 .528 0-.528.2-.956.478-1.484.629-.1 0 0 .151-.1.151.151.1.227-.05.377-.05-.654.377-1.333.7-2.037 1.132a.351.351 0 0 0-.1.2h-.2c-.1.05-.05.176-.151.277.226.151.5-.2.654 0 .05 0-.1.05-.2.05-.05 0-.05.1-.1.1h-.154c-.1.075-.2.126-.2.276a.219.219 0 0 0-.226.1 9.034 9.034 0 0 0 3.144-.578 7.685 7.685 0 0 0 2.088-1.559.176.176 0 0 1 .05.1 2.168 2.168 0 0 1-.806 1.08c-.277.151-.478.377-.7.478a4.045 4.045 0 0 0-.428.276 10.761 10.761 0 0 1-1.939.412l-.305.044c-.225.033-.449.069-.671.108L4.977 33.18a.648.648 0 0 1-.288-.411.574.574 0 0 0 .094-.063.265.265 0 0 0-.113-.071v-.65a12.786 12.786 0 0 0 3.038-.942A8.746 8.746 0 0 0 4.671 29.7v-1.515a11.662 11.662 0 0 1 1.639.392 6.415 6.415 0 0 1 1.182.578 3.113 3.113 0 0 0 .478.377.91.91 0 0 0 .8.05h.33a3.961 3.961 0 0 0 1.937-.905c0 .05.05.05.1.05a3.63 3.63 0 0 1-.428 1.132c.003.051-.048.152.053.202Zm2.817 3.571c.251-.1.4-.277.629-.377-.05.05-.05.151-.1.2a3.691 3.691 0 0 0-.528.4 15.96 15.96 0 0 0-1.585 1.61c-.252.3-.528.578-.8.855a2.385 2.385 0 0 1-.31.245l-2.527-1.45a4.047 4.047 0 0 0 1.076-.053 4.984 4.984 0 0 0 .855-.327v.1c.7-.277 1.232-.906 1.937-1.132.025 0 .126.1.226.05a1.883 1.883 0 0 1 1.509-.7c0 .05 0 .1.05.1h.025c-.151.126-.327.251-.5.377-.057.052-.007.102.043.102Zm-8.908-6.164v-.186a5.814 5.814 0 0 1 1.588-.188 1.52 1.52 0 0 1 .478 0 5.861 5.861 0 0 0-2.066.374Zm30.6 5.088a.665.665 0 0 1-.306.524l-10.079 5.851a32.3 32.3 0 0 1-3.408-1.185 2.826 2.826 0 0 1-.05-2.245 3.794 3.794 0 0 1 .352-.883c.025-.025.05-.05.05-.076a.025.025 0 0 0 .025-.025 4.316 4.316 0 0 1 .377-.555l.015-.015.02-.021.015-.015c0-.025.025-.05.05-.076.025-.051.075-.076.1-.126a3.771 3.771 0 0 1 .579-.5 4.07 4.07 0 0 1 .654-.177 19.817 19.817 0 0 1 2.415.328.751.751 0 0 1 .277.1 1.849 1.849 0 0 0 .905-.05 1.137 1.137 0 0 0 .855-.706 1.212 1.212 0 0 0 .05-1.059c-.178-.276-.013-.437.181-.59l.068-.055a1.17 1.17 0 0 0 .231-.216c.126-.252-.1-.4-.151-.63-.05-.1-.226-.05-.327-.2.352-.151.855-.429.629-.857-.151-.227-.377-.63-.1-.857.352-.2.855-.151 1.006-.479a1.138 1.138 0 0 0-.292-1.085l-.075-.108a4.754 4.754 0 0 1-.211-.32 6.914 6.914 0 0 0-.528-.757 4.3 4.3 0 0 1-.528-1.009c-.151-.378.05-.706.05-1.084a6.347 6.347 0 0 0-.327-2.144c-.126-.353-.176-.731-.327-1.059a1.12 1.12 0 0 0-.226-.58.375.375 0 0 1 0-.328 4.874 4.874 0 0 0 .579-.479.567.567 0 0 0-.2-.706c-.327-.151-.3.328-.528.429h-.151c-.05-.126.05-.177.151-.277 0-.05 0-.151-.05-.151-.2 0-.377-.051-.428-.151a3.957 3.957 0 0 0-1.861-1.286 2.319 2.319 0 0 0 .579.1 1.67 1.67 0 0 0 1.006-.1c.227-.076.277-.479.377-.706a.8.8 0 0 0-.151-.631 2.189 2.189 0 0 0-.906-.756 9.13 9.13 0 0 1-.679-.353.952.952 0 0 0-.251-.126c-2.965-1.485-9.069-.2-9.534 0h-.009a8.244 8.244 0 0 0-1.249.475 3.922 3.922 0 0 0-2.365 2.465 3.829 3.829 0 0 0-1.333 1.509c-.428.8-1.056 1.509-.956 2.414.1.78.277 1.484.428 2.289a4.668 4.668 0 0 0 .2.8c.1.276 0 .629.151.855.075.151.025.327.227.428v.2c.05.05.05.1.151.1v.2a6.446 6.446 0 0 1 1.107 1.434c.1.276-.478.151-.7.05a5.979 5.979 0 0 1-1.132-.956.175.175 0 0 0-.051.1c.2.352.906.78.528 1.006-.2.1-.428-.151-.629.051-.05.075 0 .176 0 .276-.277-.2-.578-.1-.855-.2-.2-.05-.252-.427-.478-.427a15.162 15.162 0 0 0-1.811-.327 15.137 15.137 0 0 0-1.739-.159V15.708a.606.606 0 0 1 .306-.524l14.987-8.761L34.965 15.1a.605.605 0 0 1 .306.524Zm-7.954-8.261a.325.325 0 0 1-.282.149 2.843 2.843 0 0 0-.282.273c.1 0 0 .149.1.149-.205.223.077.694-.205.793a2.176 2.176 0 0 1-1.127 0 .722.722 0 0 1 .167-.016h.085a.382.382 0 0 0 .337-.132v-.2c0-.05-.051-.05-.1-.05a.161.161 0 0 1-.1.05.223.223 0 0 0-.154-.2.807.807 0 0 1-.718-.273.67.67 0 0 1 .436-.05c.128 0 .077-.223.231-.322h.154c.307-.372.871-.471.974-.843 0-.1-.282-.1-.487-.149a2.259 2.259 0 0 0-.82.05 4.65 4.65 0 0 0-1.051.273 3.225 3.225 0 0 1 .923-.471 3.886 3.886 0 0 1 .718-.2l.132-.026.133-.027a.971.971 0 0 1 .556 0c.231.1.615.1.666.248.1.273-.154.545-.435.744-.057.081.148.135.148.23Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 2.5em 3em;
}