
/* PIED */
#pied-conteneur {  margin-top: 70px;}
#pied-haut {padding: 60px 0; position: relative; z-index: 15; display: -webkit-box;display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;  }
#pied-googlemap {  width: 35%; height:365px; position: absolute; right: 0; top: 10px; z-index:10;}
#pied-googlemap iframe {width: 100%; height: 100%;}
    
#pied {margin-top: -60px; background:#fef0f0; position:relative; z-index:10; }
#pied .global {padding: 80px 20px 40px; position:relative; z-index:10; }

#pied-sup {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-sup .col { margin:15px 0; grid-row: 1;}
 
#pied ul li {padding:0; }
#pied ul li::before {display:none; }

#pied .col .categorie {margin-bottom:15px; }
#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:#8f0a0b; font-size:22px; font-weight:400; display:block; }

#pied .menu {padding:0; margin:0 0 15px 0; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;}
#pied .menu .menu-colonne {width: calc(50% - 5px);}
#pied .menu .menu-colonne > div {list-style:none;  margin:0 0 5px 0; }
#pied .menu .menu-colonne > div > a {text-decoration:none; }
#pied .menu .menu-colonne > div > a > span,
#pied .menu .menu-colonne > div > a:visited > span,
#pied .menu .menu-colonne > div > span {text-decoration:none; color:#8c7373; font-size:20px; font-weight: 400; position: relative; }
 
#col-logo {grid-column: col-start 1 / span 5; 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;}
#col-informations {  grid-column: col-start 7 / span 10;}
#col-separation {grid-column: col-start 18 / span 1; }
#col-separation div {width:2px; height:100%; background:#8f0a0b; margin: 0 auto;}
#col-contact {grid-column: col-start 19 / span 7;  }


/* Col logo */
#pied #logo-pied {width:100%; position:relative; margin:0 auto; }
#pied #logo-pied a,
#pied #logo-pied a:visited {text-decoration:none; color:#8f0a0b; }
#pied #logo-pied a img {vertical-align:top; height:auto; width:100%; }

#pied-reseaux-conteneur { margin-top:20px;  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-titre {margin: 0px 2px 0 0; font-size: 20px; color: #8f0a0b; display:inline-block; vertical-align:middle; }

#pied #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; }
#pied #pied-reseaux .pied-social { margin: 10px; } 
#pied #pied-reseaux .pied-social a,
#pied #pied-reseaux .pied-social a:visited {position:relative; text-align:center; color:#ececec; text-decoration:none; width:35px; height:35px; background: #8f0a0b; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s; -moz-transition: -moz-transform ease-out 0.1s, background 0.2s; transition: transform ease-out 0.1s, background 0.2s; border-radius: 28px; }
#pied #pied-reseaux .pied-social a::after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; content: ''; border-radius: 50%; z-index: -1; opacity: 0; -moz-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1); -webkit-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1); -o-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1); box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1); -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); }
#pied #pied-reseaux .pied-social i {color:#ececec; font-size: 25px; }
#pied #pied-reseaux .pied-social i.fa-facebook { font-size: 21px; }
#pied #pied-reseaux .pied-social a:hover {background: #ffffff; -webkit-transform: scale(0.93); -moz-transform: scale(0.93); -ms-transform: scale(0.93); transform: scale(0.93); }
#pied #pied-reseaux .pied-social a:hover i { color:#8f0a0b; }
#pied #pied-reseaux .pied-social a:hover::after {-webkit-animation: sonarEffect 1.3s ease-out 75ms; -moz-animation: sonarEffect 1.3s ease-out 75ms; animation: sonarEffect 1.3s ease-out 75ms; }

@-webkit-keyframes sonarEffect {
 0% {
 opacity: 0.3; 
 }
 40% {
 opacity: 0.5; 
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 }
 100% {
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 -webkit-transform: scale(1.5); 
 opacity: 0; 
 }
}
@-moz-keyframes sonarEffect {
 0% {
 opacity: 0.3; 
 }
 40% {
 opacity: 0.5; 
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 }
 100% {
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 -moz-transform: scale(1.5); 
 opacity: 0; 
 }
}
@keyframes sonarEffect {
 0% {
 opacity: 0.3; 
 }
 40% {
 opacity: 0.5; 
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 }
 100% {
 box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #8f0a0b, 0 0 0 10px rgba(255, 255, 255, 0.5); 
 transform: scale(1.5); 
 opacity: 0; 
 }
}

/* Col contact*/
#col-contact .pied-contact-element {margin-bottom: 35px; 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;  }
#col-contact .pied-contact-element a,
#col-contact .pied-contact-element a:visited {width: 100%; text-decoration:none; 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; }
#col-contact .pied-contact-element i {display:block; margin-right:15px; width:22px; height:22px; filter: invert(46%) sepia(10%) saturate(622%) hue-rotate(314deg) brightness(100%) contrast(88%);}
#col-contact .pied-contact-element .pied-contact-span {font-weight:400; color:#550f10; font-size:20px; max-width: calc(100% - 37px); }

#col-contact #pied-adresse {-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;  }
#col-contact #pied-adresse i {background:url(../images/icone-adresse-o.svg) no-repeat center center; background-size:contain; margin-top: 4px;}

#col-contact #pied-telephone {}
#col-contact #pied-telephone i {background:url(../images/icone-telephone-o.svg) no-repeat center center; background-size:contain; }

#col-contact #pied-mail {}
#col-contact #pied-mail i {background:url(../images/icone-mail-o.svg) no-repeat center center; background-size:contain;}

#col-contact #pied-horaires { margin-bottom: 0; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
#col-contact #pied-horaires i {background:url(../images/icone-horaires.svg) no-repeat center center; background-size:contain; }
#col-contact #pied-horaires p {margin:0; text-align: left;}
#col-contact #pied-horaires em {font-style: normal; display: inline-block; vertical-align: top;}

#pied-bas {margin-top: 35px; padding-top: 10px; border-top:2px solid #dbb9b9; }

/** PIED COLONNES LOGO CENTRE **/
#pied .liens {padding:0; margin:0; 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 .liens li { margin:0 0 7px 0; list-style:none; position:relative; }
#pied .liens li > a,
#pied .liens li > a:visited {text-decoration:none;   padding: 5px 5px 5px 0;}
#pied .liens li:not(#pied-signature) > a { 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 .liens li:not(#pied-signature) > a::after {content: ""; background: #8f0a0b; width: 1px; height: 15px; display:block; margin:0 5px 0 10px; }
#pied .liens li > a > span,
#pied .liens li > a:visited > span,
#pied .liens li > span {text-decoration:none; color:#8f0a0b; font-weight:400; font-size:16px; line-height: 19px; }
#pied .liens li:hover > a > span,
#pied .liens li:hover > span {}


@media all and (max-width:1700px) {
	#col-informations {  grid-column: col-start 7 / span 9;}
	#col-separation { grid-column: col-start 17 / span 1;}
	#col-contact {  grid-column: col-start 18 / span 7;}
}

@media all and (max-width:1450px) {
	#col-separation { grid-column: col-start 16 / span 1;}
	#col-contact {  grid-column: col-start 17 / span 8;}
}

@media all and (max-width:1250px) {

	#col-logo {  grid-column: col-start 1 / span 4;}
	#col-informations {  grid-column: col-start 6 / span 9;}
	#col-separation { grid-column: col-start 15 / span 1;}
	#col-contact {  grid-column: col-start 16 / span 9;}
	#pied .menu .menu-colonne > div > a > span, 
	#pied .menu .menu-colonne > div > a:visited > span, 
	#pied .menu .menu-colonne > div > span,
	#col-contact .pied-contact-element .pied-contact-span {  font-size: 18px;}
}

@media all and (max-width:1205px) {
	#pied-sup .col {grid-row: 2;}
	#pied-sup #col-logo {  grid-row: 1; grid-column: col-start 1 / span 24;}
	#pied #logo-pied { width: 220px;}
	#col-informations {  grid-column: col-start 1 / span 13;}
	#col-separation { grid-column: col-start 14 / span 1;}
	#col-contact {  grid-column: col-start 15 / span 10;}
}

@media all and (max-width:1090px) {
	#pied-googlemap {top: 27px;}
}

@media all and (max-width:1005px) {
	#pied-copyright {grid-column: col-start 1 / span 13;}
}

@media all and (max-width:930px) {
	#pied-conteneur { margin-top: 40px;}
	#pied-haut { padding: 20px 0 0;}
	#pied-googlemap {position: initial;  width: 100%;  grid-row: 4; grid-column: col-start 13 / span 12;}
	
	#pied { margin-top: 0; }
	
	#pied .global { padding: 20px 20px 40px;}
	#col-informations {  grid-column: col-start 1 / span 12;}
	#col-separation { grid-column: col-start 13 / span 1;}
	#col-contact {  grid-column: col-start 14 / span 11;}
	#pied .menu .menu-colonne > div > a > span, 
	#pied .menu .menu-colonne > div > a:visited > span, 
	#pied .menu .menu-colonne > div > span,
	#col-contact .pied-contact-element .pied-contact-span {  font-size: 17px;}
}

@media all and (max-width: 730px) {	
	#col-informations {  grid-column: col-start 1 / span 24;}
    
	#pied-sup #col-separation { grid-row: 3;   grid-column: col-start 1 / span 24;}
	#col-separation div {  width: 100%;  height: 1px;}
	#pied-sup #col-contact {  grid-row: 4;   grid-column: col-start 1 / span 24; padding-left:0;}
	
	#pied-copyright{grid-row: 1; grid-column: col-start 1 / span 24;}
}

@media all and (max-width: 640px) {	
	#pied-sup { display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start;}
	#pied-sup #col-logo,
	#pied-sup #col-informations,
	#pied-sup #col-separation {width:100%; margin:15px 0;}
	#col-contact .pied-contact-element { margin-bottom: 20px;}

}

@media all and (max-width:580px) {
	#pied-sup .col, 
	#pied-googlemap { width: 100%; }		
	#pied-sup .col {margin: 15px 0;}
}

@media all and (max-width:480px) {
	#pied-sup #col-logo, #pied-sup #col-informations, #pied-sup #col-separation {margin: 10px 0;}
	#pied .menu {margin-bottom: 0;}
	#pied .menu .menu-colonne {width: 100%;}
	#col-contact .pied-contact-element i {  margin-right: 10px;}
	#col-contact .pied-contact-element .pied-contact-span { max-width: calc(100% - 32px);}
}