/* Styles généraux du pied de page */
#footer {
    width: 100%;
    padding: 10px 0 0 0;
    background: #202020;
    border-top: 5px solid #e5e5e5;
}

#footer.litex {
    background: #fafafa;
}

.footer-in {
    margin: 0 auto;
 
    color: #ccc;
    position: relative;
}

.footer-in .columns {
    margin-top: 20px;
}

.footer-in h4 {
    color: #c4c6c8;
    border-bottom: 4px solid #252627;
    padding-bottom: 6px;
    margin: 0;
    margin: 39px 0 21px 0;
    font-size: 13px;
    text-align: center;
}

.footer-in hr {
    border-color: #8a8585;
}

.footer-in .copyright-txt {
    font-size: 12px;
}

.footer-in p .contact-label {
    line-height: 19px;
    color: white;
}

.contact-inf .contact-text {
    color: #8c8080; /* Couleur de texte, choisissez celle qui convient à votre design */
}




.contact2 div {
    line-height: 21px;
}

.footer-in a {
    text-decoration: none;
}

.footer-sbc {
    position: relative;
    text-align: center;
    margin: 0 auto;
}

.footer-sbc input[type="text"], .footer-sbc input[type="submit"] {
    float: left;
    margin: 4px 7px;
}

/* Social Icons (styles généraux si utilisés ailleurs, mais les styles .socailfollow sont plus spécifiques) */
.social-icons a {
    border: 0;
    float: left;
    margin: 1px 7px 0 12px;
    opacity: 0.5;
    text-decoration: none;
    -webkit-transition: opacity 0.5s ease;
    -moz-transition: opacity 0.5s ease;
    -ms-transition: opacity 0.5s ease;
    -o-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}

.social-icons a:hover {
    opacity: 1;
}

.social-icons.members {
    clear: both;
    text-align: center;
    margin-bottom: 10px;
}

.social-icons.members a {
    text-align: center;
    float: none;
}

.footer-in a img {
    float: left;
    margin: 3px 4px 0 1px;
}

/* ==================================================================== */
/* Styles CORRIGÉS pour la section des réseaux sociaux (.socailfollow) */
/* ==================================================================== */

/* Conteneur principal des icônes de réseaux sociaux */
.socailfollow {
    display: flex; /* Active Flexbox pour aligner les éléments sur une ligne */
    justify-content: center; /* Centre les icônes horizontalement au milieu du conteneur */
    align-items: center; /* Centre les icônes verticalement (utile si elles ont des hauteurs différentes) */
    
    /* TRÈS IMPORTANT : Assurez-vous qu'aucun float n'est appliqué ici ou qu'il est mis à 'none' */
    float: none; 
    
    width: 100%; /* S'assure que le conteneur flex prend toute la largeur disponible pour permettre le centrage */
    margin-top: 10px; /* Ajoute un espacement au-dessus du groupe d'icônes si nécessaire */
    margin-bottom: 10px;
}

/* Styles pour chaque lien d'icône individuel (<a>) */
.socailfollow a {
    /* TRÈS IMPORTANT : annule tout flottant pour que flexbox fonctionne correctement. */
    /* L'ancienne règle 'float: left;' est supprimée ici. */
    float: none; 
    
    width: 18px; /* Largeur de chaque zone d'icône */
    height: 18px; /* Hauteur de chaque zone d'icône */
    padding: 10px; /* Rembourrage autour de l'icône, rendant la zone cliquable plus grande */
    
    /* Espacement entre les icônes :
       0px pour la marge supérieure/inférieure,
       20px pour la marge gauche/droite.
       Vous pouvez ajuster '20px' pour plus ou moins d'espace selon vos préférences. */
    margin: 0 20px; 
    
    text-decoration: none; /* Supprime le soulignement par défaut des liens */
    
    /* Utilise flexbox pour centrer l'icône (<i>) à l'intérieur de son propre lien (<a>) */
    display: flex; /* Ou 'inline-flex' si vous voulez qu'ils se comportent plus comme des éléments de texte */
    justify-content: center; 
    align-items: center; 
    
    border-radius: 2px; /* Coins légèrement arrondis */
    
    /* Transitions pour les effets de survol */
    -webkit-transition: all 0.31s ease;
    -moz-transition: all 0.31s ease;
    -ms-transition: all 0.31s ease;
    -o-transition: all 0.31s ease;
    transition: all 0.31s ease;
}

/* L'ancienne règle .socailfollow a:first-of-type n'est plus nécessaire car 'margin: 0 20px;' gère tout. */
/* .socailfollow a:first-of-type { margin-left: 0; } */


.footer-in .socailfollow a:hover { /* Gardé pour compatibilité si cette règle est plus spécifique */
    text-decoration: none;
}

/* Styles de survol pour chaque type d'icône */
.socailfollow a.facebook:hover {
    background: #3b5996;
}

/* Les règles .top-bar .socailfollow a.facebook:hover i, .our-team .socailfollow a.facebook:hover i
   sont spécifiques à d'autres sections. Je les laisse si elles sont utilisées ailleurs,
   mais pour la section actuelle, .socailfollow a:hover i est suffisant. */
.top-bar .socailfollow a.facebook:hover i, .our-team .socailfollow a.facebook:hover i { 
    color: #3b5996; 
} 

.socailfollow a.twitter:hover {
    background: #00acee;
}

.top-bar .socailfollow a.twitter:hover i, .our-team .socailfollow a.twitter:hover i { 
    color: #00acee; 
} 

.socailfollow a.vimeo:hover { 
    background: #0dadd6; 
} 

.top-bar .socailfollow a.vimeo:hover i, .our-team .socailfollow a.vimeo:hover i { 
    color: #0dadd6; 
} 

.socailfollow a.dribble:hover { 
    background: #d53e68; 
} 

.top-bar .socailfollow a.dribble:hover i, .our-team .socailfollow a.dribble:hover i { 
    color: #d53e68; 
} 

.socailfollow a.youtube:hover { 
    background: #cb322c; 
} 

.top-bar .socailfollow a.youtube:hover i, .our-team .socailfollow a.youtube:hover i { 
    color: #cb322c; 
} 

.socailfollow a.pinterest:hover { 
    background: #cb2027; 
} 

.top-bar .socailfollow a.pinterest:hover i, .our-team .socailfollow a.pinterest:hover i { 
    color: #cb2027; 
} 

.socailfollow a.google:hover { 
    background: #c3391c; 
} 

.top-bar .socailfollow a.google:hover i, .our-team .socailfollow a.google:hover i { 
    color: #c3391c; 
} 

.socailfollow a.linkedin:hover { 
    background: #0073b2; 
} 

.top-bar .socailfollow a.linkedin:hover i, .our-team .socailfollow a.linkedin:hover i { 
    color: #0073b2; 
} 

.socailfollow a.rss:hover { 
    background: #f29a1d; 
} 

.top-bar .socailfollow a.rss:hover i, .our-team .socailfollow a.rss:hover i { 
    color: #f29a1d; 
} 

.socailfollow img { 
    opacity: 0.79; 
} 



/* Styles pour les icônes (<i>) elles-mêmes */
.socailfollow i { 
    font-size: 18px; 
    color: #fff; 
    opacity: 0.95;
} 

#footer.litex .socailfollow i { 
    color: #343434; 
} 

#footer.litex .socailfollow a:hover i { 
    color: #fff; 
} 

.top-bar .socailfollow { 
    float: right; 
    margin-right: 10px; 
} 

.top-bar .socailfollow.lftflot { 
    float: left; 
} 

.top-bar .socailfollow img { 
    opacity: 0.97; 
} 

.top-bar .socailfollow a, .our-team .socailfollow a { 
    padding: 4px; 
    margin: 1px 4px; 
    background: #fff; 
} 

.top-bar .socailfollow i, .our-team .socailfollow i { 
    color: #979797; 
    -webkit-transition: all 0.25s ease; 
    -moz-transition: all 0.25s ease; 
    -ms-transition: all 0.125s ease; 
    -o-transition: all 0.25s ease; 
    transition: all 0.25s ease; 
} 

.top-bar .socailfollow a:hover, .our-team .socailfollow a:hover { 
    background: none; 
} 

.contact-inf { 
    background: url(../images/world-map2.png) no-repeat center 20px; 
} 

.footer-in .contact-inf { 
    background: url(../images/world-map.png) no-repeat center center; 
} 

.footer-in .contact-inf p { 
    margin-bottom: 10px; 
} 

.footer-in a:link, .footer-in a:visited { 
    color: #afb4b7; 
} 

.footer-in a:hover { 
    color: #909090; 
    text-decoration: underline; 
} 

#footer.litex .footer-in a { 
    color: #0093d0; 
} 

.footer-in a.terms { 
    color: #578f1a; 
} 

.footer-in .lts-tweets { 
    padding: 12px; 
    padding-top: 34px; 
    text-align: center; 
    position: relative; 
} 

.footer-in .lts-tweets i { 
    font-size: 80px; 
    color: #333; 
    position: absolute; 
    top: 2px; 
    left: 40%; 
    z-index: 9; 
} 

.footer-in .lts-tweets h3 { 
    z-index: 12; 
    position: relative; 
} 

.footer-in .lts-tweets h5 { 
    color: #82878a; 
    padding: 0 10px; 
    font-size: 16px; 
    font-weight: 400; 
    font-family: "Roboto Slab"; 
} 

.flickr-feed { 
    padding-left: 10px; 
    margin-bottom: 14px; 
    color:#8c8080;
} 

.flickr-feed a { 
    float: left; 
    margin: 0 1px 1px 0; 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
    -webkit-transition: opacity 0.31s ease; 
    -moz-transition: opacity 0.31s ease; 
    -ms-transition: opacity 0.31s ease; 
    -o-transition: opacity 0.31s ease; 
    transition: opacity 0.31s ease; 
} 

#footer.litex .flickr-feed a { 
    opacity: 0.85; 
    filter: alpha(opacity=85); 
} 

.flickr-feed a img { 
    margin: 0; 
    width: 82px; 
    height: 82px; 
    box-shadow: 0px 2px 6px -2px rgba(0, 0, 0, 0.7); 
} 

.flickr-feed a:hover, #footer.litex .flickr-feed a:hover { 
    opacity: 1; 
    filter: alpha(opacity=100); 
} 

.footbot { 
    margin: 0 auto; 
    position: relative; 
    height: 38px; 
    border-top: 5px solid #252627; 
    padding: 26px 0 18px; 
    text-align: right; 
    border-top-right-radius: 2px; 
    border-top-left-radius: 1px; 
} 

#footer.litex .footbot, #footer.litex .footer-in h4, #footer.litex .footer-in hr { 
    border-color: #e0e0e0; 
    color: #5b5b5b; 
} 

.footbot img { 
    position: relative; 
    margin: 6px 40px 0 0; 
    opacity: 0.93; 
} 

.footer-navi { 
    float: left; 
    font-size: 12px; 
    color: #55595d; 
    padding: 3px 0 0 10px; 
    text-transform: capitalize; 
} 

.footer-navi ul { 
    margin-left: 40px; 
} 

.footer-navi a { 
    color: #a9b2b4; 
    margin: 0 4px; 
} 

.footer-navi a:hover { 
    color: #ccc; 
    text-decoration: underline; 
}

/* L'ancienne section .footer-social est supprimée car les styles sont maintenant gérés directement par .socailfollow */
/* .footer-social { ... } */
/* .footer-social .one-fourth.column { ... } */
/* .footer-social .socailfollow a { ... } */
/* .footer-social .socailfollow a:first-of-type { ... } */
/* .footer-social .socailfollow { ... } */


