
/* PIED */
#pied { background:#2f343b; position:relative; z-index:10; }
#pied .global .contenu-wrapper {display: grid; grid-template-columns: repeat(24, [col-start] 1fr); -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
/** PIED COLONNES LOGO CENTRE **/
#pied .global .contenu-wrapper .col { margin:15px 0 0; grid-row: 1; padding: 110px 0; }
 
#col-menu { grid-column: col-start 1 / span 7; }
#col-centre {grid-column: col-start 9 / span 8; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
#col-contact { padding-bottom: 0 !important; grid-column: col-start 18 / span 7; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
 
#pied ul li {padding:0; }
#pied ul li::before {display:none; }

#pied .col .categorie {margin-bottom:20px; }
#pied .col .categorie > a {text-decoration:none; }
#pied .col .categorie > a > span,
#pied .col .categorie > a:visited > span,
#pied .col .categorie > span {text-decoration:none; color:#ea5b1b; font-size:32px; font-weight:700; display:block; }


#col-menu > div { max-width: 385px; }
#pied .menu {padding:0; margin:0 0 15px 0; font-size:0; }
#pied .menu li {list-style:none; display:inline-block; vertical-align:top; margin:0 0 5px 0; }
#pied .menu li > a {text-decoration:none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
#pied .menu li > a::after {content: ""; background: #ffffff; width: 1px; height: 12px; display:block; margin:0 5px; }
#pied .menu li:last-child > a::after {display:none; }
#pied .menu li > a > span,
#pied .menu li > a:visited > span,
#pied .menu li > span {text-decoration:none; color:#fff; font-weight:400; font-size:18px; line-height: 22px; position: relative; }
 
#pied .liens {padding:0; margin:0; }
#pied .liens li { margin:0 0 7px 0; list-style:none; position:relative; }
#pied .liens li > a {text-decoration:none; }
#pied .liens li > a > span,
#pied .liens li > a:visited > span,
#pied .liens li > span {text-decoration:none; color:#808994; font-weight:400; font-size:18px; line-height: 22px; }
#pied .liens li:hover > a > span,
#pied .liens li:hover > span {}

#pied #logo-pied {width:100%; position:relative; margin:0 auto; }
#pied #logo-pied a,
#pied #logo-pied a:visited {text-decoration:none; color:#000; }
#pied #logo-pied a img {height:auto; width:100%; max-width: 497px; }
	
#pied-reseaux-conteneur {width: 100%; position: absolute; bottom: 100px; left: 0; }
#pied-reseaux {text-align:center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
#pied-reseaux .pied-social {margin: 0 5px; }
#pied-reseaux .pied-social a,
#pied-reseaux .pied-social a:visited { width:28px; height:28px; text-decoration:none; display:block; }
#pied-reseaux .pied-social i { width:100%; height:100%; display: block; filter: brightness(0) invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%); }
#pied-reseaux .pied-social a:hover i {filter: invert(38%) sepia(60%) saturate(1743%) hue-rotate(353deg) brightness(96%) contrast(91%); }

#pied-reseaux .pied-social.social-facebook i {background: url(../images/icone-facebook-rond-o.svg) no-repeat center center; background-size: contain; }
#pied-reseaux .pied-social.social-instagram i {background: url(../images/icone-instagram-rond-o.svg) no-repeat center center; background-size: contain; }
#pied-reseaux .pied-social.social-linkedin i {background: url(../images/icone-linkedin-rond-o.svg) no-repeat center center; background-size: contain; }
#pied-reseaux .pied-social.social-twitter-x i {background: url(../images/icone-x-twitter-rond-o.svg) no-repeat center center; background-size: contain; }
#pied-reseaux .pied-social.social-youtube i {background: url(../images/icone-youtube-rond-o.svg) no-repeat center center; background-size: contain; }
#pied-reseaux .pied-social.social-whatsapp i {background: url(../images/icone-whatsapp-rond-o.svg) no-repeat center center; background-size: contain; }

#col-contact > div {height: 100%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start;}
/** VERSION AVEC FONT AWESOME **/
#pied .pied-contact-element { overflow: hidden; padding: 0 0 7px 4px; text-align:left; margin:0px 0 8px; }
#pied .pied-contact-element a,
#pied .pied-contact-element a:visited {text-decoration:none; color:#000; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
#pied .pied-contact-element i {height:13px; width: 13px; text-align: center; margin-right: 10px; display:block; filter: invert(38%) sepia(60%) saturate(1743%) hue-rotate(353deg) brightness(96%) contrast(91%);}
#pied .pied-contact-element .pied-contact-span {width: calc(100% - 23px); display: inline-block; vertical-align: top; -webkit-box-flex:1; -ms-flex:1; flex:1; font-size:18px; color: #ffffff; font-weight: 400;}
#pied #pied-telephone i {background:url(../images/icone-telephone.svg) no-repeat center center; background-size:contain; }
#pied #pied-mail i {background:url(../images/icone-mail.svg) no-repeat center center; background-size:contain; }
/** END **/

#pied-soutien {  width: 100%; background:#fff; padding: 20px 10px 25px; 	border-radius: 15px 15px 0 0; margin-top: 45px; box-sizing: border-box;}
#pied-soutien #pied-soutien-titre { color:#373c41; text-align:center; font-size:22px; font-weight:400; margin-bottom: 25px; }
#pied-soutien-logos { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
#pied-soutien-logos .pied-soutien-logo { margin: 10px 20px 0; }
#pied-soutien-logos .pied-soutien-logo img {max-height:85px; max-width:175px; width:100%; height:100%; object-fit:contain; display: block; }


@media all and (max-width: 1350px) {
    #pied .global .contenu-wrapper .col { padding: 70px 0;}
    #pied .col .categorie > a > span, 
    #pied .col .categorie > a:visited > span, 
    #pied .col .categorie > span {  font-size: 27px;}
}
@media all and (max-width: 1150px) {
	#pied .global { padding: 20px 20px 0; }
	#pied .global .contenu-wrapper .col {grid-row: 2;  padding:0; margin: 25px 0 0;}
	#pied #col-centre { grid-row: 1; grid-column: col-start 1 / span 24; display:block; }
    #pied #logo-pied {text-align: center;}
    #pied-reseaux-conteneur {position: relative; bottom: unset; left: unset; margin-top: 20px; }
	#pied #col-menu { grid-column: col-start 1 / span 11; }
	#pied #col-contact {grid-column: col-start 14 / span 11; }
}


@media all and (max-width:780px) {
    #pied .col .categorie > a > span, 
    #pied .col .categorie > a:visited > span, 
    #pied .col .categorie > span {  font-size: 20px;}
    #pied .menu li > a > span, 
    #pied .menu li > a:visited > span, 
    #pied .menu li > span,
    #pied .liens li > a > span,
    #pied .liens li > a:visited > span, 
    #pied .liens li > span {  font-size: 16px;}
}

@media all and (max-width:605px) {
	#pied #col-menu { grid-column: col-start 1 / span 24; }
	#pied #col-contact {grid-row: 3; grid-column: col-start 1 / span 24; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
}	