@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700,900');
/*******************************************************
GLOBAL
********************************************************/
body {
font-size: 16px;
color: #222;
font-family: Roboto !important;
font-weight: 400;
}
@media(max-width:991px) {
#body-rendezvous > div.is-wrapper > header > div.container-fluid {
display: none;
}
}
h1, h2, h3, h4, h5, h6 {
font-family: Roboto !important;
}
footer .footer-liste h2:before
body.dark {
position: relative;
}
strong {
font-weight: 700;
}
/*body.dark:before {
content: "";
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-color: black;
opacity: 0.4;
z-index: 101;
}*/
a {
display: inline-block;
text-decoration: none;
}
a:not(.btn) {
color: #52bd1d;
font-weight: 400;
}
@media(min-width:991px) {
a:not(.btn):hover,
a:not(.btn):focus,
a:not(.btn):active {
color: #3c8f14;
}
}
a:hover,
a:focus,
a:active,
button:hover,
button:focus,
button:active {
text-decoration: none !important;
box-shadow: none !important;
}
.max-width-home {
max-width: 1700px;
margin: 0 auto;
}
.max-width {
max-width: 1500px;
margin: 0 auto;
}
img {
max-width: 100%;
}
.container-fluid > .row, .container-fluid > div > .row {
padding: 0;
}
.is-boxes {
min-height: auto;
}
p {
margin: 0;
}
.bg-dark {
display: none !important;
}
h1:not(.home) {
font-size: 36px;
font-weight: 900;
margin-top: 30px;
line-height: 1;
margin-bottom: 70px;
position: relative;
}
h1:not(.home) span{
font-weight:300;
display:block;
}
@media(max-width:767px) {
h1:not(.home) {
font-size: 30px;
}
}
h1:not(.home):before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
background-repeat: no-repeat;
background-image: url(title-underline.svg);
}
h1:not(.home).text-center {
text-align:center;
}
h1:not(.home).text-center:before {
right:0;
margin:auto;
}
.is-wrapper > div {
background-color: transparent !important;
}
#back-to-top {
position: fixed;
bottom: 7px;
right: 7px;
display: none;
z-index: 200;
text-align: center;
}
#back-to-top .far {
background-color: #222;
color: #fff;
width: 40px;
height: 40px;
font-size: 18px;
line-height: 40px;
border-radius: 100%;
}
.anchor {
visibility: hidden;
height: 76px;
margin-top: -76px;
}
/*******************************************************
BTN
********************************************************/
.btn {
font-size: 18px;
position: relative;
padding: 10px 25px;
border-radius: 0;
color: white;
z-index: 0;
border: none;
background-color: transparent;
}
.btn:before {
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX(-5deg);
z-index: -1;
}
.btn:hover,
.btn:focus,
.btn:active {
color: white;
outline: none !important;
box-shadow: none !important;
background-color: transparent !important;
}
.btn-default:before {
background: linear-gradient(to right,#2b8906,#6a9d26);
}
.btn-default:hover:before {
background: linear-gradient(to right,#207100,#96d443);
}
.btn-primary:before,
.btn-secondary:before {
background-color: #343738;
}
.btn-primary:hover:before,
.btn-secondary:hover:before {
background-color: #616a6d;
}
/*******************************************************
FONTS
********************************************************/
.roboto-light {
font-weight: 300;
}
.roboto-regular {
font-weight: 400;
}
.roboto-bold {
font-weight: 700;
}
/*******************************************************
LAYOUT
********************************************************/
#body-prendre-rendez-vous header + div {
/*padding-top:107px !important;*/
}
/* header fix 1280px*/
@media(min-width:991px) and (max-width:1570px) {
header .navbar-toggler {
padding-left: 23px !important;
padding-right: 23px !important;
}
header .logo {
margin-left: 73px !important;
}
header .btn-header a,
header .btn-header .tel-desk {
padding: 18px 29px 18px 60px !important;
}
header .btn-header .fad {
left: 20px !important;
}
header .info-centre span.nom {
max-width: 163px !important;
display: inline-block !important;
line-height: 1 !important;
}
}
header {
box-shadow: 0px 2px 13px 0px rgba(0,0,0,0.1);
position: relative;
border-bottom: 1px solid white;
background-color: #fff;
}
header.fixed,
.top-content.fixed {
position: fixed;
width: 100%;
z-index: 100;
}
header .logo img {
max-width: 189px;
}
@keyframes goDown {
0% {
top: -100%;
}
100% {
top: 0;
}
}
@media(max-width:991px) {
header .top-content {
position: relative;
}
header .top-content a {
font-size: 16px;
color: white;
background-color: #52bd1d;
line-height: 1.2;
display: block;
padding: 15px 15px 15px 165px;
}
header .top-content a.btn-mobile {
padding: 15px 15px 15px 90px;
}
header .top-content a.btn-mobile .fad {
left: 0;
font-size: 20px;
}
header .top-content a.btn-mobile span {
text-transform: none;
}
header .top-content a.btn-mobile .col-auto {
position: relative;
}
header .top-content a.btn-mobile .col-auto:last-child span {
padding-left: 16px;
}
header .top-content a span {
text-transform: uppercase;
display: block;
font-weight: 700;
}
header .top-content a .fad {
--fa-primary-color: white;
--fa-secondary-color: white;
--fa-secondary-opacity: 0.5;
--fa-primary-opacity: 1.0;
font-size: 25px;
left: 123px;
top: 50%;
position: absolute;
transform: translateY(-50%);
}
}
@media(min-width:992px) {
header .logo {
margin-left: 210px;
}
}
@media(max-width:991px) {
header .logo {
display: block;
padding: 10px 0;
}
header .logo img {
display: block;
margin: 0 auto;
}
}
@media(max-width:767px) {
header .info-centre {
display: block !important;
text-align: center;
margin-bottom: 10px;
margin-left: 0 !important;
}
}
header .info-centre {
font-size: 18px;
font-weight: 300;
margin-left: 35px;
display: inline-block;
}
header .info-centre a {
color: #222;
font-size: 24px;
font-weight: 900;
color: #343738;
}
header .info-centre span {
vertical-align: middle;
}
header .info-centre a:hover,
header .info-centre a:focus,
header .info-centre a:active {
color: #52bd1d;
}
header .info-centre span:first-child {
vertical-align: middle;
font-weight: 400;
font-size: 18px;
}
header .info-centre a:hover span:first-child,
header .info-centre a:focus span:first-child,
header .info-centre a:active span:first-child {
color: #222;
}
@media(max-width:767px) {
header .info-centre span:first-child,
header .info-centre .fal {
display: none;
}
}
header .info-centre .fal {
font-size: 14px;
padding: 0 10px;
}
header .btn-header a {
font-size: 16px;
color: #222;
padding: 18px 60px 18px 85px;
position: relative;
margin-left: 1px;
line-height: 1.2;
z-index: 1;
transition: all .3s ease;
}
.tel-desk {
font-size: 16px;
color: #222;
padding: 18px 60px 18px 85px;
position: relative;
margin-left: 1px;
line-height: 1.2;
z-index: 1;
transition: all .3s ease;
}
@media(max-width:991px) {
header .btn-header {
text-align: center;
margin-bottom: 15px;
}
header .btn-header a {
font-size: 14px;
padding: 18px 28px 18px 46px;
margin-left: 3px;
margin-top: 10px;
}
.tel-desk {
font-size: 14px;
padding: 18px 28px 18px 46px;
margin-left: 3px;
margin-top: 10px;
}
}
@media(max-width:767px) {
header .btn-header a {
padding: 18px 16px 18px 46px;
}
.tel-desk {
padding: 18px 16px 18px 46px;
}
header .btn-header a:after {
content: none !important;
}
.tel-desk:after {
content: none !important;
}
}
header .btn-header a:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: -1;
transform: skewX(-5deg);
background-color: #f1f1f1;
transition: all .3s ease;
}
.tel-desk:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: -1;
transform: skewX(-5deg);
background-color: #f1f1f1;
transition: all .3s ease;
}
header .btn-header a:after {
content: "";
position: absolute;
height: 100%;
width: 15px;
top: 0;
right: 0;
transform: skewX(-5deg);
background-color: white;
opacity: 0.4;
}
.tel-desk:after {
content: "";
position: absolute;
height: 100%;
width: 15px;
top: 0;
right: 0;
transform: skewX(-5deg);
background-color: white;
opacity: 0.4;
}
header .btn-header a:hover {
color: white;
transition: all .3s ease;
}
.tel-desk:hover {
color: white;
transition: all .3s ease;
}
header .btn-header a:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
.tel-desk:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
header .btn-header .fad {
--fa-primary-color: #52bd1d;
--fa-secondary-color: #52bd1d;
--fa-secondary-opacity: 0.5;
--fa-primary-opacity: 1.0;
font-size: 30px;
left: 44px;
top: 50%;
position: absolute;
transform: translateY(-50%);
transition: all .3s ease;
}
@media(max-width:991px) {
header .btn-header .fad {
font-size: 20px;
left: 15px;
}
}
header .btn-header a:hover .fad {
--fa-primary-color: white;
--fa-secondary-color: white;
transition: all .3s ease;
}
.tel-desk:hover .fad {
--fa-primary-color: white;
--fa-secondary-color: white;
transition: all .3s ease;
}
header .btn-header .fad.fa-user-headset {
--fa-primary-color: #52bd1d;
--fa-secondary-color: #52bd1d;
--fa-primary-opacity: 0.5;
--fa-secondary-opacity: 1.0;
}
header .btn-header a span {
text-transform: uppercase;
color: #52bd1d;
display: block;
font-weight: 700;
transition: all .3s ease;
}
.tel-desk > span {
text-transform: uppercase;
color: #52bd1d;
display: block;
font-weight: 700;
transition: all .3s ease;
}
header .btn-header a:hover span {
color: white;
transition: all .3s ease;
}
.tel-desk:hover span {
color: white;
transition: all .3s ease;
}
header .navbar-toggler {
position: absolute;
border: none;
}
header .navbar-toggler:focus,
header .navbar-toggler:active {
outline: none;
}
@media(max-width:991px) {
header .navbar-toggler {
z-index: 0;
height: 100%;
padding: 0 25px;
left: -4px;
}
}
@media(min-width:992px) {
header .navbar-toggler {
top: 0;
height: 100%;
padding-left: 106px;
z-index: 4;
padding-right: 60px;
}
}
header .navbar-dark {
display: none;
}
header .navbar-toggler:before {
content: "";
position: absolute;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
background: linear-gradient(129deg,#ffffff,#f1f1f1);
left: -2px;
transform: skewX( -5deg );
}
header .navbar-toggler:hover:before {
background: linear-gradient(129deg,#ffffff,#d3d3d3);
}
header .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 1)' stroke-width='1' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
header nav.navbar {
display: block;
padding: 0;
}
@media(min-width:768px) {
header nav.navbar.open-menu:after {
content: "";
position: absolute;
height: 100vh;
width: 100vw;
background-color: rgb(0 0 0 / 38%);
z-index: -1;
top: 0;
right: -100vw;
}
}
@media(max-width:767px) {
header nav.navbar {
overflow-y: scroll;
}
}
@media(min-width:768px) and (max-height:735px) {
header nav.navbar {
overflow-y: scroll;
}
}
header nav.navbar.open-menu {
left: 0;
transition: left .6s ease;
}
header nav.navbar .navbar-nav {
display: block;
padding: 0 30px;
width: 100%;
}
header nav.navbar .navbar-nav .dropdown-toggle {
position: relative;
}
header nav.navbar .navbar-nav .dropdown-toggle:after {
content: none;
}
header nav.navbar .navbar-nav .dropdown-toggle .far {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
transition: transform .3s ease;
}
header nav.navbar .navbar-nav .dropdown.show .far {
transform: translateY(-50%) rotate(180deg);
transition: transform .3s ease;
}
header nav.navbar .navbar-nav .dropdown-menu {
position: static;
border: none;
margin: 0;
padding-top: 0;
}
header nav.navbar .navbar-nav .dropdown-menu .dropdown-item {
font-size: 14px;
font-weight: 300;
color: #212529;
padding: 10px 0 10px 40px;
}
header nav.navbar .navbar-nav .dropdown-menu .dropdown-item:hover,
header nav.navbar .navbar-nav .dropdown-menu .dropdown-item:active,
header nav.navbar .navbar-nav .dropdown-menu .dropdown-item:focus {
background-color: transparent;
color: #52bd1d;
}
header nav.navbar .close-menu {
font-size: 14px;
text-align: right;
padding: 15px 20px;
margin: 0;
background-color: #f1f1f1;
}
header nav.navbar .close-menu:hover {
cursor: pointer;
}
header nav.navbar .navbar-nav .nav-link {
font-size: 18px;
color: #222;
font-weight: 300;
display: block;
padding: 10px 15px;
transition: 0.3s ease;
}
header nav.navbar .navbar-nav .nav-link:hover,
header nav.navbar .navbar-nav .nav-link:active,
header nav.navbar .navbar-nav .nav-link:focus {
padding-left: 40px;
box-shadow: none !important;
border: none !important;
outline: none !important;
transition: 0.3s ease;
}
header nav.navbar .navbar-nav .nav-item + .nav-item {
border-top: 1px solid rgba(0,0,0,0.1);
}
header nav.navbar .navbar-nav .nav-item:nth-child(1) a,
header nav.navbar .navbar-nav .nav-item:nth-child(2) a {
font-weight: 400;
}
header nav.navbar .btn-rdv {
text-align: center;
margin-top: 30px;
}
header nav.navbar .btn-rdv a {
font-size: 16px;
color: #222;
padding: 18px 60px 18px 85px;
position: relative;
margin-left: 1px;
line-height: 1.2;
z-index: 1;
transition: all .3s ease;
}
@media(max-width:991px) {
header nav.navbar .btn-rdv a {
font-size: 14px;
padding: 18px 33px 18px 53px;
margin-left: 3px;
margin-top: 10px;
}
}
header nav.navbar .btn-rdv a:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: -1;
transform: skewX(-5deg);
background-color: #f1f1f1;
transition: all .3s ease;
}
header nav.navbar .btn-rdv a:after {
content: "";
position: absolute;
height: 100%;
width: 15px;
top: 0;
right: 0;
transform: skewX(-5deg);
background-color: white;
opacity: 0.4;
}
header nav.navbar .btn-rdv a:hover {
color: white;
transition: all .3s ease;
}
header nav.navbar .btn-rdv a:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
header nav.navbar .btn-rdv .fad {
--fa-primary-color: #52bd1d;
--fa-secondary-color: #52bd1d;
--fa-secondary-opacity: 0.5;
--fa-primary-opacity: 1.0;
font-size: 30px;
left: 44px;
top: 50%;
position: absolute;
transform: translateY(-50%);
transition: all .3s ease;
}
@media(max-width:991px) {
header nav.navbar .btn-rdv .fad {
font-size: 24px;
left: 20px;
}
}
header nav.navbar .btn-rdv a:hover .fad {
--fa-primary-color: white;
--fa-secondary-color: white;
transition: all .3s ease;
}
header nav.navbar .btn-rdv a span {
text-transform: uppercase;
color: #52bd1d;
display: block;
font-weight: 700;
transition: all .3s ease;
}
header nav.navbar .btn-rdv a:hover span {
color: white;
transition: all .3s ease;
}
footer {
background-color: #181b19;
color: white;
padding: 40px 0;
clear: both;
}
footer .logo img {
max-width: 170px;
}
footer h2 {
font-size: 20px;
font-weight: 900;
margin-top: 0;
margin-bottom: 50px;
position: relative;
}
footer h2.nom {
margin: 20px 0;
}
footer h2.nom:before {
content: none;
}
footer .score {
margin-bottom: 10px;
color: #ffc100;
}
footer .score .nb {
font-size: 14px;
font-weight: 900;
display: inline-block;
vertical-align: middle;
margin-right: 5px;
}
footer .score .avis {
font-size: 12px;
font-weight: 500;
display: inline-block;
vertical-align: middle;
margin-left: 5px;
color: #919191;
}
footer .score .fas {
font-size: 9px;
margin-right: 3px;
}
footer .adresse {
font-size: 14px;
}
@media(max-width:767px) {
footer h2 {
text-align: center;
}
footer h2:before {
left: 0;
right: 0;
margin: auto;
}
}
footer h2:before {
content: "";
position: absolute;
bottom: -20px;
height: 10px;
width: 150px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
background-size: cover;
margin: auto;
}
footer .meilleur-enseigne p {
font-size: 14px;
font-weight: 900;
margin-bottom: 5px;
margin-top: 10px;
}
footer .enseigne .meilleur-enseigne p {
margin-top: 20px;
}
footer .reseau {
margin-top: 30px;
}
footer .reseau .fab {
height: 47px;
width: 47px;
line-height: 47px;
text-align: center;
color: white;
border-radius: 5px;
margin-right: 8px;
font-size: 20px;
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px transparent;
transition: all 0.3s ease;
}
footer .reseau a.facebook:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #1b4195;
transition: all 0.3s ease;
}
footer .reseau a.linkedin:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #0f72aa;
transition: all 0.3s ease;
}
footer .reseau a.youtube:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #ad160b;
transition: all 0.3s ease;
}
footer .reseau a.twitter:hover .fab,
footer .reseau a.x:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #1DA1F2;
transition: all 0.3s ease;
}
footer .reseau a.instagram:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #E1306C;
transition: all 0.3s ease;
}
footer .reseau a.pinterest:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #E60023;
transition: all 0.3s ease;
}
footer .reseau a.tiktok:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #2af0ea;
transition: all 0.3s ease;
}
footer .reseau a.dailymotion:hover .fab {
box-shadow: 0 0 0 4px #181b19, 0 0 0 5px #7e5eff;
transition: all 0.3s ease;
}
footer .reseau a.facebook .fab {
background-color: #1b4195;
}
footer .reseau a.linkedin .fab {
background-color: #0f72aa;
}
footer .reseau a.youtube .fab {
background-color: #ad160b;
}
footer .reseau a.twitter .fab,
footer .reseau a.x .fab {
background-color: #1DA1F2;
}
footer .reseau a.instagram .fab {
background-color: #E1306C;
}
footer .reseau a.pinterest .fab {
background-color: #E60023;
}
footer .reseau a.tiktok .fab {
background-color: #2af0ea;
}
footer .reseau a.dailymotion .fab {
background-color: #7e5eff;
}
footer .footer-offre a {
font-size: 14px;
line-height: 1.4;
font-weight: 300;
margin-bottom: 15px;
color: white;
display: block;
padding-left: 40px;
position: relative;
}
footer .footer-offre a:hover {
color: white;
}
footer .footer-offre a:hover .fal {
transform: translateY(-50%) scale(1.2);
transition: all .3s ease;
}
footer .footer-offre a .fal {
font-size: 22px;
opacity: 0.4;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
transition: all .3s ease;
}
footer .footer-liste .card {
border: none;
background-color: transparent;
}
footer .footer-liste .card-header {
padding: 15px;
margin: 0;
background-color: transparent;
border: none;
}
footer .footer-liste .card-header h2 .far {
margin-left: 20px;
transition: all .3s ease;
}
footer .footer-liste .card-header h2.collapsed .far {
transform: rotate(180deg);
transition: all .3s ease;
}
@media(min-width:992px) {
footer .footer-liste .card-header {
padding: 0;
}
footer .footer-liste .card-body {
padding: 0;
}
footer .footer-liste .collapse:not(.show) {
display: block;
}
footer .footer-liste .collapsing {
transition: none !important;
}
}
@media(max-width:991px) {
footer .footer-liste h2 {
margin-bottom: 20px;
}
}
footer .footer-liste ul {
padding: 0;
margin: 0;
}
@media(max-width:767px) {
footer .footer-liste ul {
text-align: center;
}
footer .footer-liste a {
display: inline-block !important;
}
}
footer .footer-liste li {
list-style: none;
}
footer .footer-liste a {
font-size: 14px;
line-height: 1.4;
font-weight: 300;
margin-bottom: 15px;
color: white;
display: block;
padding-left: 15px;
position: relative;
}
footer .footer-liste a:hover {
color: white;
}
footer .footer-liste a:hover:before {
left: 5px;
transition: all .3s ease;
}
footer .footer-liste a:before {
content: "\f105";
position: absolute;
font-family: 'Font Awesome\ 5 Pro';
font-size: 12px;
font-weight: 300;
top: 50%;
transform: translateY(-50%);
left: 0;
transition: all .3s ease;
}
@media(min-width:768px) {
footer .bottom-nav.centre {
position: absolute;
bottom: 0;
right: 0;
}
}
@media(max-width:767px) {
footer .bottom-nav {
border-top: 1px solid #303230;
padding-top: 15px;
margin-top: 15px;
}
}
footer .enseigne .bottom-nav ul {
padding: 20px 0 10px 0;
}
footer .bottom-nav ul {
padding: 0;
margin: 0;
}
footer .bottom-nav li {
display: inline-block;
position: relative;
}
footer .bottom-nav li + li:before {
content: "/";
position: absolute;
left: -5px;
}
footer .bottom-nav li a {
color: white;
padding: 0 20px;
font-weight: 700;
}
@media(max-width:767px) {
footer .bottom-nav li a {
padding: 0 15px;
}
}
footer .bottom-footer {
text-align: center;
margin-top: 15px;
border-top: 1px solid #303230;
}
footer .bottom-footer ul {
margin: 0;
padding: 15px 0;
}
footer .bottom-footer li {
display: inline-block;
position: relative;
text-transform: uppercase;
}
@media(max-width:767px) {
footer .bottom-footer li {
display: block;
}
footer .bottom-footer li a {
padding: 0 !important;
}
}
@media(min-width:768px) {
footer .bottom-footer li + li:before {
content: "|";
position: absolute;
left: -1px;
font-size: 11px;
opacity: 0.5;
top: 6px;
}
}
footer .bottom-footer li a {
color: white;
padding: 0 20px;
opacity: 0.5;
font-size: 11px;
}
footer .bottom-footer li a:hover {
opacity: 1;
color: white;
}
footer .copyright-footer {
font-size: 12px;
opacity: 0.5;
text-align: center;
margin: 0;
font-weight: 300;
}
footer .copyright-footer a {
color: white;
}
footer .copyright {
display: none;
}
/*******************************************************
HOME COMMUN
********************************************************/
.horaires-supp {
background-color: rgb(82 189 29 / 10%);
border: 1px solid #c4e9b2;
padding: 20px;
color: #46a319;
}
.horaires-supp p {
font-weight: 500;
}
.horaires-supp ul {
margin: 0;
padding: 0;
}
.horaires-supp h2 {
display: none !important;
}
.horaires-supp li {
list-style: none;
}
.home-slide {
padding: 25px 0;
}
.home-slide .slide {
background-color: #f1f1f1;
}
.home-slide .carousel-item {
text-align: center;
}
.home-slide .carousel-inner {
max-width: 1700px;
margin: 0 auto;
}
.home-slide .carousel-inner img {
max-width: 100%;
vertical-align: middle;
}
@media(min-width:768px) {
.home-slide .carousel-inner {
height: 39vw;
max-height: 600px;
}
.home-slide .carousel-inner img {
height: 39vw;
max-height: 600px;
}
}
@media(max-width:767px) {
.home-slide .carousel-inner {
height: 79vw;
max-height: 660px;
}
.home-slide .carousel-inner img {
height: 79vw;
max-height: 660px;
}
}
.home-slide .carousel-control-prev,
.home-slide .carousel-control-next {
font-size: 48px;
display: block;
top: 50%;
width: 70px;
opacity: 1;
line-height: 70px;
color: white !important;
border-radius: 100%;
bottom: auto;
background-color: rgb(255, 255, 255, 0.4);
height: 70px;
transform: translateY(-50%);
}
.home-slide .carousel-control-prev {
left: 35px;
}
.home-slide .carousel-control-next {
right: 35px;
}
@media(max-width:767px) {
.home-slide .carousel-control-prev,
.home-slide .carousel-control-next {
font-size: 30px;
display: block;
top: 50%;
width: 50px;
opacity: 1;
line-height: 50px;
color: white !important;
border-radius: 100%;
bottom: auto;
background-color: rgb(255, 255, 255, 0.4);
height: 50px;
transform: translateY(-50%);
}
.home-slide .carousel-control-prev {
left: 15px;
}
.home-slide .carousel-control-next {
right: 15px;
}
}
.home-slide .carousel-indicators li {
opacity: 1;
border-radius: 11px;
height: 5px;
}
.home-slide .carousel-indicators li.active {
background-color: #d52b1e;
}
@media(min-width:992px) {
.home-point-fort {
text-align: center;
}
}
.home-point-fort .img-container {
display: inline-block;
vertical-align: middle;
margin-right: 40px;
}
@media(max-width:991px) {
.home-point-fort .img-container {
width: 75px;
text-align: center;
margin: 0;
}
.home-point-fort .point {
margin-bottom: 15px;
}
}
.home-point-fort p,
.home-point-fort a {
font-size: 18px;
color: #52bd1d;
text-align: left;
line-height: 1.3;
margin: 0;
padding: 5px 0;
font-weight: 700;
display: inline-block;
vertical-align: middle;
}
@media(max-width:767px) {
.home-point-fort p,
.home-point-fort a {
font-size: 16px;
font-weight: 500;
}
.home-point-fort p span,
.home-point-fort a span {
font-size: 16px !important;
}
}
.home-point-fort p span,
.home-point-fort a span {
font-size: 20px;
color: #222;
display: block;
font-weight: 900;
}
.home-point-fort .point + .point {
border-left: 1px solid rgba(0,0,0,0.1);
}
.home-offre {
padding: 30px 0;
margin-top: 40px;
}
@media(max-width:767px) {
.home-offre .offre:first-child {
text-align: center;
}
.home-offre .offre:first-child a:before {
right: auto;
left: 25%;
}
}
.home-offre h2 {
font-size: 36px;
text-align: center;
font-weight: 900;
margin-bottom: 40px;
position: relative;
}
.home-offre h2:before {
content: "";
position: absolute;
bottom: -25px;
height: 19px;
width: 292px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
right: 0;
margin: auto;
}
.home-offre h2 span{
font-weight:300;
display:block;
}
.home-offre .offre a {
display: block;
position: relative;
}
@media(min-width:768px) {
.home-offre .offre a {
opacity: 0;
}
}
.home-offre .offre a:before {
position: absolute;
font-size: 200px;
font-family: Roboto;
opacity: 0.1;
color: black;
top: 0;
right: 50px;
transform: skewX( -12deg );
line-height: 1;
font-weight: 900;
z-index: -1;
}
@media(max-width:767px) {
.home-offre .offre a:before {
right: 13px;
}
}
@media(min-width:768px)and (max-width:1399px) {
.home-offre .offre a:before {
right: 100px;
}
}
.home-offre .offre a:hover:before {
color: #52bd1d;
opacity: 0.4;
}
.home-offre .offre:nth-child(1) a:before {
content: "1";
}
.home-offre .offre:nth-child(2) a:before {
content: "2";
}
.home-offre .offre:nth-child(3) a:before {
content: "3";
}
.home-offre .offre:nth-child(4) a:before {
content: "4";
}
.home-offre .offre:nth-child(5) a:before {
content: "5";
}
.home-offre .offre:nth-child(6) a:before {
content: "6";
}
.home-offre .offre:nth-child(7) a:before {
content: "7";
}
.home-offre .offre:nth-child(8) a:before {
content: "8";
}
.home-offre .offre a p {
font-size: 18px;
font-weight: 900;
margin: 0;
display: inline-block;
text-align: center;
padding: 35px 0;
color: #222;
}
.home-offre .offre a p .fal {
font-size: 48px;
margin-bottom: 15px;
display: block;
}
.home-offre .offre a p span {
font-size: 12px;
display: block;
}
.home-offre .offre .anim {
animation-name: animOffre;
animation-duration: 0.7s;
animation-fill-mode: forwards;
}
.home-offre .offre:nth-child(2) .anim {
animation-delay: 0.2s;
}
.home-offre .offre:nth-child(3) .anim {
animation-delay: 0.4s;
}
.home-offre .offre:nth-child(4) .anim {
animation-delay: 0.6s;
}
.home-offre .offre:nth-child(5) .anim {
animation-delay: 0.8s;
}
.home-offre .offre:nth-child(6) .anim {
animation-delay: 1s;
}
.home-offre .offre:nth-child(7) .anim {
animation-delay: 1.2s;
}
.home-offre .offre:nth-child(8) .anim {
animation-delay: 1.4s;
}
@keyframes animOffre {
0% {
transform: translateX(-15px);
opacity: 0;
}
100% {
transform: translateX(0);
opacity: 1;
}
}
.home-rendez-vous {
padding: 40px 0;
position: relative;
padding-top: 160px;
background-color: #f3f4f4;
}
@media(max-width:991px) {
.home-rendez-vous {
padding-top: 50px;
}
}
.home-rendez-vous h2 {
font-size: 36px;
text-align: center;
font-weight: 900;
margin-top: 0;
line-height: 1;
margin-bottom: 40px;
position: relative;
}
.home-rendez-vous h2 span{
font-weight: 300;
display:block;
}
.home-rendez-vous h2 + p {
margin-bottom: 50px;
}
.home-rendez-vous .info-rdv {
padding-left: 70px;
}
@media(max-width:991px) {
.home-rendez-vous .info-rdv {
text-align: center;
margin-bottom: 30px;
padding: 0;
}
}
.home-rendez-vous .info-rdv p {
font-weight: 300;
font-size: 18px;
text-transform: uppercase;
line-height: 1;
margin-bottom: 10px;
}
.home-rendez-vous .info-rdv p.active {
font-weight: 900;
font-size: 22px;
color: #52bd1d;
}
.home-rendez-vous .action-rdv {
background-color: white;
box-shadow: 0px 2px 13px 0px rgba(0,0,0,0.1);
padding: 30px;
transition: all .3s ease;
}
@media(max-width:991px) {
.home-rendez-vous .action-rdv {
margin-bottom: 30px;
}
}
.home-rendez-vous .action-rdv:hover {
background-color: #2e2f2e;
color: white;
transition: all .3s ease;
}
.home-rendez-vous .action-rdv:hover h3 {
transition: all .3s ease;
color: #52bd1d;
}
.home-rendez-vous .action-rdv:hover h3 .fad {
--fa-primary-color: white;
transition: all .3s ease;
}
.home-rendez-vous .action-rdv h3 {
font-size: 22px;
margin-top: 0;
font-weight: 300;
margin-bottom: 30px;
position: relative;
padding-left: 55px;
transition: all .3s ease;
}
.home-rendez-vous .action-rdv h3 .fad {
--fa-primary-color: #222;
--fa-secondary-color: #52bd1d;
--fa-secondary-opacity: 1;
--fa-primary-opacity: 1;
font-size: 48px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
transition: all .3s ease;
}
.home-rendez-vous .action-rdv h3 img {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.home-rendez-vous .action-rdv h3 .hover {
display: none;
}
.home-rendez-vous .action-rdv:hover h3 .hover {
display: block;
}
.home-rendez-vous .action-rdv:hover h3 .not-hover {
display: none;
}
.home-rendez-vous .action-rdv h3 span {
font-weight: 700;
display: block;
}
.home-rendez-vous .action-rdv .btn {
display: block;
margin-top: 30px;
}
.home-pack-garanties {
padding: 50px 0;
}
@media(max-width:767px) {
.home-pack-garanties {
padding: 20px 0;
}
}
.home-pack-garanties .container-liste {
position: relative;
}
@media(min-width:992px) {
.home-pack-garanties .container-liste img {
position: absolute;
right: 0;
top: -35px;
}
}
@media(max-width:991px) {
.home-pack-garanties h2 {
margin-bottom: 65px !important;
}
}
.home-pack-garanties h2 {
font-size: 36px;
font-weight: 900;
margin-top: 0;
line-height: 1;
margin-bottom: 95px;
position: relative;
}
.home-pack-garanties h2:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
margin: auto;
}
.home-pack-garanties img {
display: block;
margin: 0 auto;
}
.home-pack-garanties ul {
padding: 0;
}
.home-pack-garanties ul li {
font-size: 22px;
font-weight: 700;
list-style: none;
margin-bottom: 15px;
}
@media(max-width:991px) {
.home-pack-garanties ul {
margin-top: 30px;
}
.home-pack-garanties ul li {
font-size: 18px;
}
}
.home-pack-garanties ul li a {
color: #374140;
padding-left: 55px;
position: relative;
}
.home-pack-garanties ul li a:hover {
color: #52bd1d;
}
.home-pack-garanties ul li a:hover:before {
content: "\f105";
font-size: 18px;
color: white;
background-color: #52bd1d;
border: 1px solid #52bd1d;
}
.home-pack-garanties ul li a:before {
content: "\f00c";
position: absolute;
font-family: 'Font Awesome\ 5 Pro';
color: #52bd1d;
font-size: 14px;
left: 0;
top: -1px;
font-weight: 500;
height: 35px;
width: 35px;
border-radius: 100%;
text-align: center;
line-height: 33px;
border: 1px solid #d1d2d2;
}
/*******************************************************
HOME CENTRE
********************************************************/
.home-presentation {
text-align: center;
padding: 20px 0;
}
.home-presentation .info {
padding: 20px 15px;
}
.home-presentation .info + .info {
border-left: 1px solid rgba(0,0,0,0.1);
}
@media(max-width:767px) {
.home-presentation .info {
position: relative;
}
}
.home-presentation .info.dropdown {
position: relative;
}
.home-presentation .info.dropdown a {
position: absolute;
left: 50%;
transform: translateX(-50%) rotate(180deg);
bottom: -8px;
color: #222;
transition: all .3s ease;
}
.home-presentation .info.dropdown a.collapsed {
transform: translateX(-50%) rotate(0deg);
transition: all .3s ease;
}
.home-presentation .card {
border: none;
text-align: center;
}
.home-presentation .card ul {
padding: 0;
margin: 0;
}
.home-presentation h1 {
font-size: 36px;
font-weight: 900;
margin-top: 0;
position: relative;
color: #222;
}
.home-presentation h1 span {
font-weight: 400;
display: inline-block;
color: #d52b1e;
background: -webkit-linear-gradient( 135deg,#ad160b, #d52b1e );
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.home-presentation h1:before {
content: "";
position: absolute;
bottom: -25px;
height: 19px;
width: 292px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
right: 0;
margin: auto;
}
.home-presentation p {
text-align: left;
display: inline-block;
vertical-align: middle;
font-size: 18px;
font-weight: 300;
}
@media(max-width:767px) {
.home-presentation .img-center {
margin-bottom: 50px;
}
}
.home-presentation .fal {
display: inline-block;
vertical-align: middle;
margin-right: 40px;
font-size: 34px;
}
@media(max-width:767px) {
.home-presentation .info .fal {
position: absolute;
top: 15px;
left: 50%;
transform: translateX(-50%);
}
.home-presentation .info p:not(.horaire) {
padding-top: 40px;
text-align: center;
}
.home-presentation .horaires-day {
text-align: center;
}
}
.home-presentation .horaires-day {
text-align: left;
display: inline-block;
vertical-align: middle;
}
@media(max-width:767px) {
.home-presentation .horaires-day {
max-width: 283px;
}
.home-presentation .fal {
margin: 0;
width: 45px;
}
.home-presentation .horaires-day p {
font-size: 18px;
text-align: center;
}
}
.home-presentation .horaires-day p {
display: block;
}
.home-presentation .horaires-day p:not(.horaire) {
font-size: 20px;
font-weight: 900;
}
.home-presentation .horaires-day p:not(.horaire) span {
text-transform: uppercase;
}
.home-presentation .horaires-day.horaires-day-open p:not(.horaire) span,
.home-presentation .horaires-day.horaires-day-full-open p:not(.horaire) span {
color: #52bd1d;
}
.home-presentation .horaires-day.horaires-day-full-closed p:not(.horaire) span,
.home-presentation .horaires-day.horaires-day-closed p:not(.horaire) span {
color: #d52b1e;
}
.home-rendez-vous .carousel-inner {
border: 10px solid white;
box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
background-color: white;
}
.home-rendez-vous .carousel-control-prev,
.home-rendez-vous .carousel-control-next {
font-size: 26px;
top: auto;
width: 50px;
opacity: 1;
line-height: 50px;
bottom: 10px;
background-color: black;
height: 50px;
text-align: center;
}
.home-rendez-vous .carousel-control-prev {
left: 10px;
}
.home-rendez-vous .carousel-control-next {
right: 10px;
}
.home-rendez-vous .carousel-indicators li {
opacity: 1;
border-radius: 11px;
height: 5px;
}
.home-rendez-vous .carousel-indicators li.active {
background-color: black;
}
.home-rendez-vous .carousel-control-next-icon,
.home-rendez-vous .carousel-control-prev-icon {
width: 10px;
height: 10px;
}
@media(max-width:1182px) {
.home-rendez-vous .img-centre {
margin-bottom: 50px;
}
.home-rendez-vous .carousel {
display: inline-block;
}
}
.home-avis {
padding: 40px 0;
}
@media(max-width:767px) {
.home-avis {
padding-bottom: 0;
}
}
@media(max-width:767px) {
.home-avis .col-md {
margin-bottom: 30px;
}
}
.home-avis h2 {
font-size: 36px;
text-align: center;
font-weight: 900;
margin-bottom: 40px;
}
.home-avis .fiche-centre {
background-color: white;
box-shadow: 0px 2px 13px 0px rgba(0, 0, 0,0.1);
padding: 30px;
height: 100%;
}
.home-avis .fiche-centre h3 {
margin-top: 0;
font-size: 26px;
font-weight: 700;
margin-bottom: 20px;
}
.home-avis .fiche-centre h3 span {
display: inline-block;
color: #d52b1e;
background: -webkit-linear-gradient( 135deg,#ad160b, #d52b1e );
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.home-avis .fiche-centre .score {
text-align: center;
background-color: #ffc100;
color: white;
display: inline-block;
vertical-align: top;
font-size: 32px;
font-weight: 900;
padding: 5px 20px;
line-height: 1.2;
}
.home-avis .fiche-centre .score span {
display: block;
font-size: 12px;
font-weight: 300;
}
.home-avis .fiche-centre .star {
display: inline-block;
margin-left: 10px;
vertical-align: top;
}
.home-avis .fiche-centre .star img {
display: block;
}
.home-avis .fiche-centre .star .fas {
font-size: 20px;
color: #ffc100;
}
.home-avis .fiche-centre .btn-container {
margin-top: 20px;
}
.home-avis .fiche-centre .btn-container a {
padding: 10px 15px;
border-radius: 5px;
font-size: 14px;
transition: all 0.3s ease;
}
.home-avis .fiche-centre .btn-container a .fad {
margin-right: 10px;
font-size: 20px;
}
.home-avis .fiche-centre .btn-container a .fa-pen-alt {
--fa-secondary-opacity: 1.0;
--fa-primary-opacity: 0.6;
}
.home-avis .fiche-centre .btn-container a .fa-comments {
--fa-primary-opacity: 0.4;
--fa-secondary-opacity: 0.2;
}
.home-avis .fiche-centre .btn-container a.btn-avis {
color: #222;
background-color: #f3f4f4;
margin-right: 5px;
}
.home-avis .fiche-centre .btn-container a.btn-avis:hover,
.home-avis .fiche-centre .btn-container a.btn-avis:active,
.home-avis .fiche-centre .btn-container a.btn-avis:focus {
background-color: #d9dada;
transition: all 0.3s ease;
}
.home-avis .fiche-centre .btn-container a.btn-avis-alt {
color: white;
background-color: #ffc100;
}
.home-avis .fiche-centre .btn-container a.btn-avis-alt:hover,
.home-avis .fiche-centre .btn-container a.btn-avis-alt:active,
.home-avis .fiche-centre .btn-container a.btn-avis-alt:focus {
background-color: #e8b002;
transition: all 0.3s ease;
}
.home-avis .avis {
background-color: #f3f4f4;
padding: 30px;
height: 100%;
}
.home-avis .avis .name {
font-weight: 700;
display: inline-block;
margin-right: 5px;
position: relative;
margin-bottom: 10px;
padding-left: 60px;
}
.home-avis .avis .name img {
position: absolute;
left: 0;
max-width: 50px;
}
.home-avis .avis .name span {
font-weight: 300;
display: block;
}
.home-avis .avis .star {
display: inline-block;
vertical-align: top;
line-height: 1.4;
}
.home-avis .avis .star .fas {
font-size: 13px;
color: #ffc100;
}
.home-avis .avis .aspect {
margin-bottom: 20px;
}
.home-avis .avis .aspect span {
font-weight: 700;
}
/*******************************************************
HOME ENSEIGNE
********************************************************/
.home-rendez-vous .pointe {
width: 100%;
position: absolute;
top: 0;
left: 0;
}
.home-rendez-vous .container-carte {
position: relative;
}
.home-rendez-vous .container-carte .carte {
position: absolute;
top: 50%;
left: calc(50% + 30px);
transform: translateY(-50%) translateX(-50%);
text-align: center;
width: 100%;
}
@media(max-width:991px) {
.home-rendez-vous .container-carte .carte {
left: 50%;
}
}
.home-rendez-vous .container-carte .carte p {
font-size: 60px;
font-weight: 700;
color: #d52b1e;
line-height: 1;
text-align: center;
font-style: italic;
margin-bottom: 15px;
}
.home-rendez-vous .container-carte .carte p span {
color: black;
display: block;
}
/*******************************************************
CONTACT
********************************************************/
.contact {
margin-bottom: 30px;
}
.contact p {
line-height: 1.3;
}
.contact p.offre p.offre,
form p.offre {
color: #6c757d;
margin: 0;
font-size: 16px;
text-align: left;
}
.contact p .title {
line-height: 1.3;
font-size: 20px;
}
.contact textarea {
min-height: 200px;
}
.contact .input-group .fa {
font-size: 11px;
}
.contact .input-group-text {
background-color: white;
border-radius: 0;
}
.contact small {
font-size: 13px;
display: block;
margin-bottom: 15px;
}
.grecaptcha-badge {
margin: 0 auto;
}
.contact .h2-form-candidature h2 {
margin-top: 0;
font-size: 26px;
font-weight: 400;
margin-bottom: 25px;
}
@media(min-width:768px) {
.contact:not(.modal) .form-captcha .col-sm-12 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
margin-left: 33.333333%;
}
.contact:not(.modal) .form-captcha .col-sm-12 > div {
padding: 0 10px;
}
}
.contact.modal {
color: #222;
}
.contact.modal button.close {
border: none;
background-color: transparent;
position: absolute;
right: 15px;
top: 15px;
font-size: 20px;
}
.contact.modal h1 {
margin-top: 0;
margin-bottom: 50px;
}
.contact.modal .modal-header {
border: none;
padding: 0;
}
.contact.modal p {
margin-bottom: 20px;
}
.contact.modal input#donnee {
display: none;
}
.contact.modal small {
text-align: justify;
}
.contact.modal .modal-content {
border-radius: 0;
padding: 30px;
}
.contact .option-enseigne {
display: none;
}
.modal-backdrop {
z-index: 101 !important;
}
/**form-confirm-modal remplace formConfirmModal**/
/**formConfirmModal a supprimer**/
#formConfirmModal .modal-header,
#formConfirmModal .modal-footer {
border: none;
}
#formConfirmModal .modal-content {
border-radius: 0;
}
#formConfirmModal h5 {
margin-top: 0;
font-size: 26px;
font-weight: 900;
position: relative;
}
#formConfirmModal h5:before {
content: "";
position: absolute;
bottom: -15px;
height: 12px;
width: 180px;
left: 0;
background-size: 100%;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
}
/**form-confirm-modal remplace formConfirmModal**/
#form-confirm-modal .modal-header,
#form-confirm-modal .modal-footer {
border: none;
}
#form-confirm-modal .modal-content {
border-radius: 0;
}
#form-confirm-modal h5 {
margin-top: 0;
font-size: 26px;
font-weight: 900;
position: relative;
}
#form-confirm-modal h5:before {
content: "";
position: absolute;
bottom: -15px;
height: 12px;
width: 180px;
left: 0;
background-size: 100%;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
}
/*******************************************************
LE CENTRE
********************************************************/
.centre .horaire-top {
position: relative;
padding-left: 50px;
font-size: 18px;
text-align: left;
display: inline-block;
margin-bottom: 15px;
}
.centre .horaire-top:before {
content: "\f017";
position: absolute;
font-family: "Font Awesome 5 Pro";
font-weight: 300;
top: 2px;
left: 0;
font-size: 34px;
}
.centre .description {
margin-bottom: 30px;
}
.centre .carousel-inner {
border: 10px solid white;
box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
}
.centre .carousel-control-prev,
.centre .carousel-control-next {
font-size: 26px;
top: auto;
width: 50px;
opacity: 1;
line-height: 50px;
bottom: 10px;
background-color: black;
height: 50px;
text-align: center;
}
.centre .carousel-control-prev {
left: 10px;
}
.centre .carousel-control-next {
right: 10px;
}
.centre .carousel-indicators li {
opacity: 1;
border-radius: 11px;
height: 5px;
}
.centre .carousel-indicators li.active {
background-color: black;
}
.centre .carousel-control-next-icon,
.centre .carousel-control-prev-icon {
width: 10px;
height: 10px;
}
.centre .horaires-day p {
font-weight: 900;
}
.centre .horaires-day p.horaire {
font-weight: 300;
}
.centre .horaires-day p:not(.horaire) span {
text-transform: uppercase;
}
.centre .horaires-day.horaires-day-open p:not(.horaire) span,
.centre .horaires-day.horaires-day-full-open p:not(.horaire) span {
color: #52bd1d;
}
.centre .horaires-day.horaires-day-full-closed p:not(.horaire) span,
.centre .horaires-day.horaires-day-closed p:not(.horaire) span {
color: #d52b1e;
}
.itineraire {
position: relative;
z-index: 0;
padding: 40px 0;
}
@media(min-width:768px) {
.itineraire {
margin-top: 60px;
}
}
.itineraire:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 1px;
-webkit-clip-path: polygon(100% 100%, 0 100%, 0 0);
clip-path: polygon(100% 100%, 0 100%, 0 0);
left: 0;
background: #f7f7f7;
z-index: -1;
}
.itineraire-container {
padding: 60px;
text-align: center;
margin: 0 60px;
background-color: white;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
}
.itineraire h2 {
font-weight: 700;
}
.itineraire .adresse {
font-weight: 500;
font-size: 20px;
}
@media(max-width:767px) {
.itineraire-container {
padding: 20px;
margin: 20px 0 0 0;
}
.itineraire .adresse {
font-size: 16px;
margin-bottom: 15px;
}
.itineraire h2 {
font-size: 24px;
}
}
.itineraire .gps {
display: flex !important;
margin-top: 20px;
justify-content: center !important;
}
@media(max-width:767px) {
.itineraire .gps {
margin: 20px 0;
}
}
.itineraire .gps .col {
text-align: left !important;
flex: 0 0 auto;
width: auto;
}
.itineraire .gps a {
color: #222;
font-weight: 500;
}
.itineraire .gps a p {
font-weight: 500;
}
@media(min-width:768px) {
.itineraire .gps a p {
display: inline-block;
margin-left: 10px;
}
}
@media(max-width:767px) {
.itineraire .gps a img {
display: block;
margin: 0 auto;
}
.itineraire .gps a p {
text-align: center;
}
}
.coordonnee {
padding: 50px 0;
background-color: #f7f7f7;
}
@media(max-width:767px) {
.coordonnee {
padding-top: 0;
}
}
.coordonnee .gm-style-iw {
padding: 20px 30px !important;
max-height: none !important;
}
.coordonnee .gm-style-iw-d {
max-height: none !important;
overflow: auto !important;
}
.coordonnee .infowindows {
font-size: 16px;
text-align: center;
}
.coordonnee .infowindows div[itemprop="name"] {
font-size: 18px;
font-weight: 700;
display: block;
margin-bottom: 15px;
}
.coordonnee .infowindows .map-phone-number {
margin: 7px;
font-weight: 600;
display: inline-block;
position: relative;
padding-left: 28px;
transition: color .3s ease;
}
.coordonnee .infowindows .map-phone-number:hover {
color: #52bd1d;
transition: color .3s ease;
}
.coordonnee .infowindows .map-phone-number:before {
content: "\f095";
position: absolute;
font-family: 'Font Awesome 5 Pro';
color: #52bd1d;
left: 0;
font-weight: 500;
}
.coordonnee .infowindows .map-bt-itineraire {
font-size: 16px;
position: relative;
padding: 10px 25px;
border-radius: 0;
color: white;
z-index: 0;
display: inline-block;
font-weight: 400;
line-height: 1.5;
margin-top: 10px;
border: none;
background-color: transparent;
}
.coordonnee .infowindows .map-bt-itineraire:before {
background: linear-gradient(to right,#2b8906,#6a9d26);
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX( -5deg);
z-index: -1;
}
.coordonnee .infowindows .map-bt-itineraire:hover:before {
background: linear-gradient(to right,#207100,#96d443);
}
@media(max-width:767px) {
.coordonnee .gm-style-iw {
padding: 10px 20px !important;
}
.coordonnee .infowindows {
font-size: 14px;
}
.coordonnee .infowindows div[itemprop="name"] {
font-size: 16px;
font-weight: 400;
}
.coordonnee .infowindows .map-opening-time {
display: none;
}
.coordonnee .infowindows .map-bt-itineraire {
padding: 5px 25px;
}
}
.coordonnee .container-horaire {
margin-top: 30px;
}
.coordonnee .container-horaire h2 {
font-weight: 700;
font-size: 32px;
}
@media(max-width:767px) {
.coordonnee .container-horaire,
.coordonnee .container-horaire h2 {
margin-top: 0;
}
}
.coordonnee .container-horaire ul {
margin: 0;
padding: 0;
}
.coordonnee .container-horaire ul li {
line-height: 1.8;
}
.coordonnee .container-horaire ul li.today {
font-size: 18px;
font-weight: 900;
}
.coordonnee .container-horaire ul li.closed {
color: #bdbdbd;
font-weight: 500;
}
.coordonnee .weGmap {
border: 10px solid white;
}
.galerie {
padding: 40px 0;
}
.galerie h2 {
font-weight: 700;
text-align: center;
position: relative;
font-size: 32px;
margin-bottom: 50px;
}
.galerie h2:before {
content: "";
position: absolute;
bottom: -20px;
height: 14px;
width: 218px;
left: 0;
right: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
background-size: cover;
margin: auto;
opacity: 0.6;
filter: grayscale(100%);
}
.galerie .resume {
text-align: center;
margin-bottom: 40px;
}
/*******************************************************
ACTUALITES
********************************************************/
.liste-actualites h1 + p {
margin-bottom: 40px;
font-weight: 700;
font-size: 20px;
font-style: italic;
}
.liste-actualites .actualite {
padding: 30px;
background-color: white;
color: #222;
position: relative;
padding-bottom: 130px;
box-shadow: 0px 2px 20px 2px rgb(0 0 0 / 10%);
transition: box-shadow .3s ease;
}
.liste-actualites .actualite:hover,
.liste-actualites .actualite:active,
.liste-actualites .actualite:focus {
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%) !important;
color: #222;
}
.liste-actualites .col-lg-4 {
margin-bottom: 30px;
}
.liste-actualites .actualite .title {
padding-left: 10px;
border-left: 5px solid #dadada;
transition: all 0.3s ease;
}
.liste-actualites .actualite:hover .title {
border-left: 5px solid #b7e69f;
transition: all 0.3s ease;
}
.liste-actualites .actualite:hover .title,
.liste-actualites .actualite:hover .resume {
color: #222;
}
.liste-actualites .actualite img {
margin-bottom: 20px;
}
.liste-actualites .actualite h2 {
font-weight: 700;
margin-top: 0;
}
.liste-actualites .actualite .btn {
position: absolute;
left: 50%;
bottom: 50px;
transform: translateX(-50%);
}
.liste-actualites .actualite .btn:before {
transition: all .3s ease;
}
.liste-actualites .actualite .btn {
transition: all .3s ease;
}
.liste-actualites .actualite .btn .fal {
position: absolute;
opacity: 0;
margin-left: 10px;
transform: translateY(-50%);
top: 50%;
transition: all .3s ease;
}
.liste-actualites .actualite:hover .btn:before {
background-color: #52bd1d;
transition: all .3s ease;
}
.liste-actualites .actualite:hover .btn {
padding-right: 50px;
transition: all .3s ease;
}
.liste-actualites .actualite:hover .btn .fal {
opacity: 1;
transition: all .3s ease;
}
.pagination {
justify-content: center !important;
margin-bottom: 30px;
margin-top: 10px;
}
.pagination .page-link:focus {
box-shadow: none;
}
.pagination .page-item:first-child .page-link,
.pagination .page-item:last-child .page-link {
border-radius: 0;
}
.pagination .page-item.disabled .page-link {
color: rgba(80, 80, 80, 0.7);
border: 1px solid #cccccc;
}
.pagination .page-item.active .page-link {
z-index: 1;
color: #fff;
border: 1px solid #52bd1d;
background-color: #52bd1d;
}
.pagination .page-link {
color: #222;
background-color: transparent;
border: 1px solid #cccccc;
}
.pagination .page-link:hover {
color: #222;
background-color: rgba(0, 0, 0, 0.1);
}
.liste-actualites .actualite .date {
font-weight: 700;
font-size: 14px;
}
.liste-actualites .actualite .date .far {
margin-right: 8px;
}
.liste-actualites .actualite .partage-facebook {
position: absolute;
bottom: 20px;
right: 30px;
}
.liste-actualites .actualite .partage-facebook span {
font-weight: 600;
color: #1b4195;
padding-right: 10px;
border-radius: 5px;
}
.liste-actualites .actualite .partage-facebook .fab {
height: 30px;
width: 30px;
line-height: 30px;
text-align: center;
color: white;
border-radius: 5px;
margin-right: 5px;
background-color: #1b4195;
}
.detail-actualite .date {
font-size: 20px;
margin-bottom: 20px;
font-weight: 700;
padding-left: 10px;
border-left: 5px solid #dadada;
}
.detail-actualite .date .far {
margin-right: 10px;
}
.detail-actualite .description {
font-weight: 300;
}
.detail-actualite .description a:not(.btn) {
color: #52bd1d;
font-weight: 400;
position: relative;
transition: all .3s ease;
}
.detail-actualite .description a:not(.btn):before {
content: "";
position: absolute;
height: 1px;
width: 0;
bottom: 0;
background-color: #3c8f14;
left: 0;
transition: all .3s ease;
}
.detail-actualite .description a:not(.btn):hover:before {
width: 100%;
transition: all .3s ease;
}
.detail-actualite .description a:not(.btn):hover {
color: #3c8f14;
transition: all .3s ease;
}
.detail-actualite .partage-facebook {
margin-top: 20px;
}
.detail-actualite .partage-facebook a {
font-weight: 600;
color: #1b4195;
padding-right: 10px;
border-radius: 5px;
overflow: hidden;
position: relative;
z-index: 1;
transition: all .3s ease;
}
.detail-actualite .partage-facebook a:hover,
.detail-actualite .partage-facebook a:focus,
.detail-actualite .partage-facebook a:active {
color: white;
transition: all .3s ease;
}
.detail-actualite .partage-facebook a:before {
content: "";
height: 30px;
width: 30px;
position: absolute;
background-color: #1b4195;
top: 0;
left: 0;
z-index: -1;
border-radius: 5px;
transition: all .3s ease;
}
.detail-actualite .partage-facebook a:hover:before {
width: 100%;
transition: all .3s ease;
}
.detail-actualite .partage-facebook .fab {
height: 30px;
width: 30px;
line-height: 30px;
text-align: center;
color: white;
border-radius: 5px;
margin-right: 3px;
background-color: #1b4195;
}
/*******************************************************
FAQ
********************************************************/
.faq {
margin-bottom: 50px;
}
.faq ul.horaires {
margin: 20px 0;
padding: 0;
}
.faq .card {
border-radius: 0;
box-shadow: 0px 2px 20px 0px rgba(0, 0, 0,0.1);
border: none;
margin-bottom: 10px;
}
.faq .card .card-header {
padding: 0;
background-color: white;
border: none;
}
.faq .card .card-header h2 {
margin: 0;
}
.faq .card .card-header button {
color: #222;
position: relative;
font-size: 18px;
padding: 15px 25px 15px 70px;
border: none;
width: 100%;
background-color: transparent;
display: block;
font-weight: 700;
}
.faq .card .card-header button.collapsed {
font-weight: 400;
}
.faq .card .card-header button:before {
content: "\f068";
font-family: 'Font Awesome 5 Pro';
position: absolute;
text-align: center;
height: 30px;
width: 30px;
left: 20px;
line-height: 30px;
color: white;
background-color: #52bd1d;
border-radius: 100%;
top: 50%;
transform: translateY(-50%);
}
.faq .card .card-header button.collapsed:before {
content: "\f067";
background-color: #2e2f2e;
}
.faq .card .card-header button .far {
position: absolute;
height: 100%;
width: 51px;
left: 0;
top: 0;
text-align: center;
font-size: 20px;
line-height: 51px;
background-color: #52bd1d;
color: white;
}
.faq .card .card-header button.collapsed .far {
background-color: #dfdfdf;
color: #222;
}
.faq .card .card-header button:hover,
.faq .card .card-header button:focus,
.faq .card .card-header button:active {
text-decoration: none;
outline: none !important;
box-shadow: none !important;
}
/*******************************************************
404
********************************************************/
.page-error {
text-align: center;
}
.page-error h1 {
font-size: 70px;
}
.page-error h1:before {
right: 0;
margin: auto;
}
.page-error h1 span {
display: block;
font-size: 50px;
font-weight: 400;
}
.page-error a {
font-size: 18px;
position: relative;
padding: 10px 25px;
border-radius: 0;
color: white;
z-index: 0;
border: none;
background-color: transparent;
margin-top: 40px;
}
.page-error a:before {
background-color: #343738;
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX( -5deg );
z-index: -1;
}
/*******************************************************
MENTIONS LEGALES
********************************************************/
.mentions-legales {
margin-bottom: 50px;
}
.mentions-legales li,
.mentions-legales p,
.mentions-legales td {
font-size: 16px;
}
/*******************************************************
ACTIVITES
********************************************************/
.activites {
margin-bottom: 50px;
}
.activites .activite {
margin: 40px 0;
position: relative;
overflow: hidden;
box-shadow: 1px 0px 20px 4px hsl(0deg 0% 0% / 10%);
}
.activites .activite .content {
opacity: 0;
}
.activites .activite.anim .content {
opacity: 1;
transition: all 1s ease;
}
@media(min-width:992px) {
.activites .activite:before {
content: "";
position: absolute;
height: calc(100% + 2px);
width: 110%;
background-color: white;
top: 0;
transform: skewX(-5deg);
z-index: 0;
}
.activite.anim:before {
width: 62%;
transition: all 1s ease;
}
.activites .activite:nth-child(odd):before {
left: 0;
}
.activites .activite:nth-child(even):before {
right: 0;
}
.activites .activite.anim:nth-child(odd) .content {
transform: translateX(0);
transition: all 1s ease;
}
.activites .activite.anim:nth-child(even) .content {
transform: translateX(0);
transition: all 1s ease;
}
.activites .activite:nth-child(odd) .col-lg-7 {
order: -1;
}
.activites .activite:nth-child(even) .content {
padding: 30px 50px 30px 0;
transform: translateX(20px);
}
.activites .activite:nth-child(odd) .content {
padding: 30px 0 30px 50px;
transform: translateX(-20px);
}
}
@media(max-width:991px) {
.activites .activite .content {
padding: 20px;
}
.activites .activite h2 {
font-size: 26px;
margin-bottom: 25px;
}
}
.activites .activite h2 {
font-weight: 600;
margin-top: 0;
color: #52bd1d;
margin-bottom: 30px;
}
.activites .activite img {
z-index: -1;
}
.activites .activite img-container {
z-index: -1;
}
.activites .activite .resume {
font-weight: 300;
text-align: justify;
}
.detail-actualite .description a:hover {
color: #3c8f14;
transition: all .3s ease;
}
/*******************************************************
OFFRES
********************************************************/
.liste-offre {
margin-bottom: 50px;
}
.liste-offre .col-md-6 {
margin-bottom: 40px;
}
.liste-offre .offre {
position: relative;
padding: 40px 70px;
margin-left: 30px;
height: 100%;
transition: all .3s ease;
}
.liste-offre .offre:after {
content: "";
position: absolute;
height: 100%;
width: 50px;
background-color: #ffffff;
z-index: -1;
top: 0;
transform: skewX( -5deg);
left: 0;
box-shadow: -13px 0px 14px 0px rgb(0 0 0 / 5%);
}
.liste-offre .offre:before {
position: absolute;
left: -75px;
top: 50%;
transform: translateY(-50%);
font-size: 200px;
font-weight: 900;
color: #52bd1d;
opacity: 0.2;
z-index: -1;
}
.liste-offre .col-md-6:nth-child(1) .offre:before {
content: "1";
}
.liste-offre .col-md-6:nth-child(2) .offre:before {
content: "2";
}
.liste-offre .col-md-6:nth-child(3) .offre:before {
content: "3";
}
.liste-offre .col-md-6:nth-child(4) .offre:before {
content: "4";
}
.liste-offre .col-md-6:nth-child(5) .offre:before {
content: "5";
}
.liste-offre .col-md-6:nth-child(6) .offre:before {
content: "6";
}
.liste-offre .col-md-6:nth-child(7) .offre:before {
content: "7";
}
.liste-offre .col-md-6:nth-child(8) .offre:before {
content: "8";
}
.liste-offre .offre h2 {
margin-top: 0;
font-weight: 700;
font-size: 28px;
position: relative;
padding-left: 92px;
margin-bottom: 30px;
}
.liste-offre .offre h2 .fal {
color: #d6d9d5;
position: absolute;
font-size: 65px;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.liste-offre .offre small {
display: block;
margin-top: 15px;
font-size: 12px;
color: #6c757d;
}
@media(min-width:768px) {
.liste-offre .offre:hover {
transform: translate(20px);
transition: all .3s ease;
}
.liste-offre .offre:hover:after {
border-left: 10px solid #addf95;
}
}
.liste-offre .offre-locale .date {
font-weight: 700;
font-size: 14px;
}
.liste-offre .offre-locale {
padding: 30px;
background-color: white;
padding-bottom: 70px;
color: #222;
position: relative;
box-shadow: 0px 2px 20px 2px rgb(0 0 0 / 10%);
transition: box-shadow .3s ease;
}
.liste-offre h2.locale {
font-size: 36px;
font-weight: 900;
margin-top: 0;
line-height: 1;
margin-bottom: 70px;
position: relative;
}
.liste-offre h2.locale:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
margin: auto;
}
.liste-offre .col-lg-4 {
margin-bottom: 30px;
}
.liste-offre .offre-locale .title {
padding-left: 10px;
border-left: 5px solid #dadada;
transition: all 0.3s ease;
}
.liste-offre .offre-locale img {
margin-bottom: 20px;
}
.liste-offre .offre-locale h3 {
font-weight: 700;
margin-top: 0;
}
.liste-offre .offre-locale span.btn:hover {
cursor: default;
}
.liste-offre .offre-locale .partage-facebook {
position: absolute;
bottom: 20px;
right: 30px;
}
.liste-offre .offre-locale .partage-facebook a {
font-weight: 600;
color: #1b4195;
padding-right: 10px;
border-radius: 5px;
overflow: hidden;
position: relative;
z-index: 1;
transition: all .3s ease;
}
.liste-offre .offre-locale .partage-facebook a:hover {
color: white;
transition: all .3s ease;
}
.liste-offre .offre-locale .partage-facebook a:before {
content: "";
height: 30px;
width: 30px;
position: absolute;
background-color: #1b4195;
top: 0;
left: 0;
z-index: -1;
border-radius: 5px;
transition: all .3s ease;
}
.liste-offre .offre-locale .partage-facebook a:hover:before {
width: 100%;
transition: all .3s ease;
}
.liste-offre .offre-locale .partage-facebook .fab {
height: 30px;
width: 30px;
line-height: 30px;
text-align: center;
color: white;
border-radius: 5px;
margin-right: 3px;
background-color: #1b4195;
}
@media(max-width:767px) {
.liste-offre .offre {
padding: 15px 30px;
}
.liste-offre .offre h2 {
font-size: 20px;
padding-left: 76px;
}
.liste-offre .offre h2 .fal {
font-size: 50px;
}
.liste-offre .offre p {
font-size: 15px;
}
}
/*******************************************************
PACK GARANTIE
********************************************************/
.pack .content,
.pack img {
opacity: 0;
}
.pack img {
animation: opacity 1s .3s;
animation-fill-mode: forwards;
}
.pack .content {
animation: opacity 1s .6s, left 1s .6s;
animation-fill-mode: forwards;
}
@keyframes opacity {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes left {
0% {
transform: translateX(-20px);
}
100% {
transform: translateX(0);
}
}
.pack .title {
position: relative;
}
@media(min-width:768px) {
.pack .title img {
position: absolute;
right: 0;
top: 0;
}
}
@media(max-width:767px) {
.pack .title img {
display: block;
margin: 0 auto 30px auto;
}
}
.pack .img-container {
position: relative;
overflow: hidden;
}
.pack .img-container:before,
.pack .img-container:after {
content: "";
position: absolute;
height: 100%;
width: 50px;
background-color: white;
z-index: 1;
transform: skewX( -5deg);
}
.pack .img-container:before {
right: -28px;
}
.pack .img-container:after {
right: -12px;
opacity: 0.5;
}
.pack h2 {
margin-top: 0;
padding-top: 45px;
position: relative;
font-weight: 500;
}
.pack h2:before,
.pack h2:after {
content: "";
position: absolute;
top: 29px;
left: 0;
height: 2px;
width: 70px;
background-color: #52bd1d;
}
@media(max-width:767px) {
.pack h2 {
padding-top: 10px;
}
.pack .content {
margin-bottom: 60px;
}
.pack h2:before,
.pack h2:after {
top: -9px;
}
}
.pack .content {
height: 100%;
}
.pack .content:hover h2 {
color: #52bd1d;
}
.pack .content:hover h2:before {
width: 140px;
transition: all .3s ease;
}
.pack .content small {
display: block;
margin-top: 15px;
font-size: 12px;
color: #6c757d;
}
.pack h2:before {
width: 70px;
transition: all .3s ease;
}
.pack h2:after {
width: 140px;
opacity: 0.4;
}
.pack img {
margin-bottom: 40px;
}
/*******************************************************
STORE LOCATOR
********************************************************/
/********* liste */
.store-locator-liste .filter .input-group-append {
line-height: 1;
margin-left: 3px !important;
}
.store-locator-liste .filter .input-group-append .btn {
background-color: #2e2f2e;
padding: 10px 13px;
font-size: 16px;
color: #fff;
border: 1px solid #2e2f2e;
margin-left: -3px;
transition: all .3s ease;
}
.store-locator-liste .filter .input-group-append .btn:hover,
.store-locator-liste .filter .input-group-append .btn:focus,
.store-locator-liste .filter .input-group-append .btn:active {
background-color: white !important;
padding: 10px 13px;
font-size: 16px;
color: #2e2f2e;
border: 1px solid #2e2f2e;
margin-left: -3px;
transition: all .3s ease;
}
.store-locator-liste #block_locator_map {
position: relative;
margin-top: 30px;
}
@media(max-width:767px) {
.store-locator-liste #block_locator_map {
/* display: none;*/
visibility: hidden;
}
.store-locator-liste #container_locator_list {
margin-top: 40px;
height: auto !important;
}
#block_locator_footer_list {
display: none;
}
}
.store-locator-liste #locator_map {
left: -50vw;
top: 0;
background-size: cover;
height: 830px;
width: 100vw;
right: -50vw;
margin: auto;
position: absolute;
}
.store-locator-liste #container_locator_list {
height: 830px;
background-color: white;
border: 1px solid rgba(0, 0, 0, 0.1);
}
.store-locator-liste > .row > .col-md-6 {
position: relative;
}
/******************* pager */
#locator_pageList {
padding-top: 40px;
}
#locator_pageList li {
padding: 8px 14px;
background-color: white;
color: #222;
background-color: transparent;
border: 1px solid #cccccc;
font-weight: 700;
margin-left: -1px;
transition: background-color .3s ease, color .3s ease;
}
#locator_pageList li:hover {
cursor: pointer;
color: #222;
background-color: rgba(0, 0, 0, 0.1);
transition: background-color .3s ease, color .3s ease;
}
#locator_pageList li.active {
z-index: 1;
color: #fff;
border: 1px solid #52bd1d;
background-color: #52bd1d;
}
#locator_pageList li.active:hover {
color: #fff;
border: 1px solid #52bd1d;
background-color: #52bd1d;
}
/**fin***/
#locator_slider {
background-color: #e8e8e8;
border: 1px solid #b5b5b5;
border-radius: 6px 6px 6px 6px;
-webkit-box-shadow: 1px 1px 0 #dedede inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-moz-box-shadow: 1px 1px 0 #dedede inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-o-box-shadow: 1px 1px 0 #dedede inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-ms-box-shadow: 1px 1px 0 #dedede inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
box-shadow: 1px 1px 0 #dedede inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
height: 10px;
position: absolute;
width: 100%;
}
#locator_slider div.locator_handle {
background: url("/Areas/StoreLocator/img//handle.png") center center transparent;
cursor: e-resize;
height: 15px;
position: absolute;
width: 24px;
height: 31px;
margin-top: -7px;
}
#locator_slider div.locator_handleBox {
background: url("/Areas/StoreLocator/img//etiquette-noir.png") center center transparent;
color: white;
left: -53px;
margin: 5px;
position: absolute;
text-align: center;
top: 20px;
width: 118px;
height: 34px;
}
locator_slider div.locator_handleBox div {
margin-top: 10px;
text-shadow: -1px -1px 0px #000;
}
.rangeslider,
.rangeslider__fill {
display: block;
height: 10px;
width: 100%;
-moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
.rangeslider {
border-radius: 10px;
box-shadow: none;
margin-top: 18px;
position: relative;
background-color: rgba(72, 72, 72,0.4);
}
.rangeslider .rangeslider--disabled {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
opacity: 0.4;
}
.rangeslider .rangeslider__fill {
border-radius: 10px;
box-shadow: none;
position: absolute;
top: 0;
background: #eaeaea;
}
.rangeslider .rangeslider__handle {
background-color: #222;
border: none;
width: 25px;
height: 25px;
top: -8px;
border-radius: 100%;
cursor: pointer;
display: inline-block;
position: absolute;
z-index: 7;
}
.locator_slider-bar {
width: 100%;
background-color: #979797;
height: 10px;
border: 1px solid #767676;
border-radius: 6px 6px 6px 6px;
-webkit-box-shadow: 1px 1px 0 #919191 inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-moz-box-shadow: 1px 1px 0 #919191 inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-o-box-shadow: 1px 1px 0 #919191 inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
-ms-box-shadow: 1px 1px 0 #919191 inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
box-shadow: 1px 1px 0 #919191 inset, 1px 1px 0 rgba(255, 255, 255, 0.65);
position: absolute;
top: -1px;
left: -1px;
}
.locator_icone_map,
.locator_icone_sat {
border-radius: 0;
width: 50px;
height: 50px;
border: 2px solid white;
cursor: pointer;
display: inline-block;
text-align: center;
vertical-align: middle;
}
.locator_icone_map {
background: url(/img/map.png) no-repeat center center transparent;
}
.locator_icone_sat {
background: url(/img/sat.png) no-repeat center center transparent;
}
.store-locator-title p {
font-size: 24px;
line-height: 1.2
}
.store-locator-liste .magasin {
padding: 20px;
position: relative;
overflow: hidden;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
padding-bottom: 40px;
}
.store-locator-liste .magasin:hover,
.store-locator-liste .active .magasin {
background-color: #eff7ec;
}
.store-locator-liste .clicked .magasin {
background-color: #eff7ec;
border: 1px solid #52bd1d;
}
.store-locator-liste .magasin h2 {
margin-top: 0;
font-size: 24px;
font-weight: 900;
}
.store-locator-liste .magasin .km {
position: relative;
padding-left: 28px;
margin-top: 5px;
font-weight: 400;
}
.store-locator-liste .magasin .km:before {
content: "\f5e4";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
left: 0;
color: #d52b1e;
}
.store-locator-liste .magasin .km .fas {
display: none;
}
.store-locator-liste .magasin .tel {
color: #222;
}
.store-locator-liste .magasin .button-secondary {
position: relative;
padding-left: 28px;
font-weight: 400;
}
.store-locator-liste .magasin .button-secondary:before {
content: "\f879";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
color: #d52b1e;
left: 0;
}
.store-locator-liste .magasin .lien-sl {
position: absolute;
bottom: 0;
right: -5px;
}
.store-locator-liste .magasin .button-default {
position: relative;
text-align: center;
margin: 0 !important;
padding: 8px 40px;
color: #222;
z-index: 0;
font-weight: 700;
text-transform: uppercase;
transition: all .3s ease;
}
@media(max-width:767px) {
.store-locator-liste .magasin .button-default {
padding: 8px 22px;
font-size: 14px;
}
}
.store-locator-liste .magasin .button-default:before {
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX( -5deg );
background-color: #e5e5e5;
z-index: -1;
transition: all .3s ease;
}
.store-locator-liste .magasin .button-default:after {
content: "\f101";
font-family: 'Font Awesome 5 Pro';
position: absolute;
font-weight: 900;
opacity: 0.5;
right: 40px;
color: white;
top: 50%;
opacity: 0;
transform: translateY(-50%);
}
.store-locator-liste .magasin .button-default:hover {
color: white;
padding-right: 65px;
transition: all .3s ease;
}
.store-locator-liste .magasin .button-default:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
.store-locator-liste .magasin .button-default:hover:after {
opacity: 0.5;
transition: all .3s ease;
}
.store-locator-liste .gm-style-iw {
padding: 20px !important;
}
.store-locator-liste .infowindows {
font-size: 16px;
text-align: center;
}
.store-locator-liste .infowindows span {
font-size: 18px;
font-weight: 700;
display: block;
}
.store-locator-liste .infowindows a {
margin-top: 15px;
}
#block_locator_liste_dep h2 {
font-size: 24px;
line-height: 1.2;
font-style: italic;
}
#block_locator_liste_dep td span:first-child {
color: white;
display: inline-block;
font-size: 20px;
font-weight: 700;
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
position: relative;
}
#block_locator_liste_dep td span:first-child:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
background-color: #2e2f2e;
z-index: -1;
left: 0;
top: 0;
transform: skewX( -5deg );
}
#block_locator_liste_dep td a {
color: #222;
}
#block_locator_liste_dep td a:hover,
#block_locator_liste_dep td a:active,
#block_locator_liste_dep td a:focus {
color: #52bd1d;
}
/********* dep */
.store-locator-dep .fil-ariane {
margin-bottom: 30px;
}
.store-locator-dep .fil-ariane ul {
margin: 0;
padding: 0;
}
.store-locator-dep .fil-ariane li {
display: inline-block;
padding: 0 10px;
font-weight: 500;
position: relative;
}
.store-locator-dep .fil-ariane li:last-child {
font-weight: 900;
}
.store-locator-dep .fil-ariane li + li:before {
content: "/";
position: absolute;
left: -5px;
}
.store-locator-dep .fil-ariane li a {
color: #222;
}
.store-locator-dep .magasin {
padding: 30px;
position: relative;
overflow: hidden;
height: 100%;
width: 100%;
color: #222;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
}
.store-locator-dep .magasin:hover {
color: #222;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%) !important;
}
.store-locator-dep .block_template_container {
margin-bottom: 30px;
}
.store-locator-dep .magasin h2 {
margin-top: 0;
font-size: 24px;
font-weight: 900;
}
.store-locator-dep .magasin .adresse {
margin-bottom: 5px;
}
.store-locator-dep .magasin .km {
position: relative;
padding-left: 28px;
font-weight: 400;
}
.store-locator-dep .magasin .km:before {
content: "\f5e4";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
left: 0;
color: #d52b1e;
}
.store-locator-dep .magasin .km .fas {
display: none;
}
.store-locator-dep .magasin .tel {
color: #222;
}
.store-locator-dep .magasin .button-secondary {
position: relative;
padding-left: 28px;
font-weight: 400;
}
.store-locator-dep .magasin .button-secondary:before {
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
color: #d52b1e;
left: 0;
}
.store-locator-dep .magasin .button-secondary.tel:before {
content: "\f879";
}
.store-locator-dep .magasin .button-secondary.rdv:before {
content: "\f274";
}
.store-locator-dep .magasin .button-secondary.rdv {
display: block;
}
.store-locator-dep .magasin .button-default {
position: absolute;
bottom: 0;
text-align: center;
margin: 0 !important;
right: -4px;
padding: 10px 40px;
color: #222;
z-index: 0;
font-weight: 700;
text-transform: uppercase;
transition: all .3s ease;
}
.store-locator-dep .magasin .button-default:before {
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX( -5deg );
background-color: #e5e5e5;
z-index: -1;
transition: all .3s ease;
}
.store-locator-dep .magasin .button-default:after {
content: "\f101";
font-family: 'Font Awesome 5 Pro';
position: absolute;
font-weight: 900;
opacity: 0.5;
right: 40px;
color: white;
top: 50%;
opacity: 0;
transform: translateY(-50%);
}
.store-locator-dep .magasin .button-default:hover {
color: white;
padding-right: 65px;
transition: all .3s ease;
}
.store-locator-dep .magasin .button-default:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
.store-locator-dep .magasin .button-default:hover:after {
opacity: 0.5;
transition: all .3s ease;
}
.store-locator-dep .retour-liste {
font-size: 18px;
position: relative;
padding: 10px 25px;
border-radius: 0;
color: white;
z-index: 0;
margin: 20px 0;
border: none;
background-color: transparent;
}
.store-locator-dep .retour-liste .fa {
margin-right: 5px;
}
.store-locator-dep .retour-liste:before {
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX(-5deg);
z-index: -1;
background-color: #343738;
}
.store-locator-dep .retour-liste:hover,
.store-locator-dep .retour-liste:focus,
.store-locator-dep .retour-liste:active {
color: white;
outline: none !important;
box-shadow: none !important;
background-color: transparent !important;
}
.store-locator-dep .retour-liste:hover:before {
background-color: #616a6d;
}
/*******************************************************
LISTE VILLE
********************************************************/
.store-locator-liste .filter .input-group .form-input-autocomplete {
position: absolute;
bottom: -10px;
transform: translateY(100%);
width: calc(100% - 86px);
display: flex;
flex-direction: column;
background: #FFFFFF;
color: #6c757d;
border-radius: 3px !important;
overflow: hidden;
border: 1px solid #ced4da;
z-index: 100
}
.store-locator-liste .filter .input-group .form-input-autocomplete > .autocomplete-item {
font-size: 16px;
font-weight: 400;
padding: 8px;
display: flex;
padding: 8px 12px !important;
align-items: center;
column-gap: 8px
}
.store-locator-liste .filter .input-group .form-input-autocomplete > .autocomplete-item:not(:first-of-type) {
padding-top: 4px
}
.store-locator-liste .filter .input-group .form-input-autocomplete > .autocomplete-item:not(:last-of-type) {
padding-bottom: 4px
}
.store-locator-liste .filter .input-group .form-input-autocomplete > .autocomplete-item:hover {
cursor: pointer;
background: #f3f3f3;
}
/*******************************************************
STORE LOCATOR - DETAIL
********************************************************/
.store-locator-detail .container-map {
position: relative;
}
.store-locator-detail .container-map #locator_map {
height: 500px;
left: 50%;
margin-left: -50vw;
width: 100vw;
}
@media(max-width:767px) {
.store-locator-detail .container-map #locator_map {
height: 300px;
}
}
@media(min-width:768px) {
.store-locator-detail .container-map .info-map {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
}
.store-locator-detail .container-map .info-map {
background-color: white;
padding: 30px;
}
.store-locator-detail .container-map .info-map .complement {
padding-left: 20px;
margin-left: 6px;
border-left: 3px solid #e6e6e6;
}
@media(max-width:767px) {
.store-locator-detail .container-map .info-map {
margin-top: 65px;
position: relative;
margin-bottom: 40px;
padding: 15px;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
}
}
.store-locator-detail .container-map .info-map h1 {
font-weight: 700;
margin-bottom: 20px;
font-size: 28px;
margin-top: 0;
line-height: 1.2;
}
.store-locator-detail .container-map .info-map h1:before {
content: none;
}
.store-locator-detail .container-map .info-map .adresse {
padding-left: 20px;
font-weight: 400;
margin-left: 6px;
border-left: 3px solid #e6e6e6;
}
.store-locator-detail .container-map .info-map .tel {
color: #222;
font-size: 18px;
margin-top: 20px;
padding-left: 30px;
position: relative;
}
@media(max-width:767px) {
.store-locator-detail .container-map .info-map h2 {
font-size: 24px;
}
.store-locator-detail .container-map .info-map .adresse {
font-size: 16px;
}
.store-locator-detail .container-map .info-map .tel {
font-size: 16px;
}
}
.store-locator-detail .container-map .info-map .tel:before {
content: "\f095";
position: absolute;
color: #d52b1e;
left: 0;
top: 0;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
}
.store-locator-detail .container-map .info-map .tel .far {
margin-right: 10px;
color: #52bd1d;
}
.store-locator-detail .container-map .info-map .horaires-day p:not(.horaire) {
display: none;
}
.store-locator-detail .container-map .info-map .horaires-day .horaire {
color: #222;
font-size: 18px;
margin-bottom: 15px;
padding-left: 30px;
position: relative;
}
@media(max-width:767px) {
.store-locator-detail .container-map .info-map .horaires-day .horaire {
font-size: 16px;
}
.store-locator-detail .container-map .container-btn .btn {
font-size: 16px;
padding: 10px 15px;
}
}
.store-locator-detail .container-map .info-map .horaires-day .horaire:before {
content: "\f017";
position: absolute;
color: #d52b1e;
left: 0;
top: 0;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
}
.store-locator-detail .container-map .info-map .lien-map .ico {
position: relative;
height: 53px;
width: 53px;
line-height: 53px;
margin-top: 1px;
background-color: #343738;
text-align: center;
display: block;
transition: opacity .3s ease, transform .3s ease;
}
.store-locator-detail .container-map .info-map .lien-map .ico:before {
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-size: 22px;
left: 0;
right: 0;
color: white;
margin: auto;
font-weight: 300;
}
.store-locator-detail .container-map .info-map .lien-map #div_streetview .ico:before {
content: "\f21d";
}
.store-locator-detail .container-map .info-map .lien-map #div_streetview.active .ico:before {
content: "\f279";
}
.store-locator-detail .container-map .info-map .lien-map #div_itineraire .ico:before {
content: "\f277";
}
.store-locator-detail .container-map .lien-map {
position: absolute;
bottom: 0px;
right: -54px;
}
@media(max-width:767px) {
.store-locator-detail .container-map .lien-map {
top: -54px;
width: 100%;
left: 0;
right: auto;
bottom: auto;
}
.store-locator-detail .container-map .lien-map > div {
display: inline-block;
width: 49.4%;
}
.store-locator-detail .container-map .info-map .lien-map .ico {
height: 40px;
width: 100%;
line-height: 40px;
display: inline-block;
}
}
.store-locator-detail .fil-ariane {
padding: 15px 0;
}
.store-locator-detail .fil-ariane {
padding: 30px 0;
border-bottom: 1px solid #e5e5e5;
margin-bottom: 30px;
}
.store-locator-detail .fil-ariane ul {
margin: 0;
padding: 0;
}
.store-locator-detail .fil-ariane li {
display: inline-block;
padding: 0 10px;
font-weight: 500;
position: relative;
}
.store-locator-detail .fil-ariane li:first-child {
padding-left: 0;
}
/* .store-locator-detail .fil-ariane li:last-child {
font-weight: 700;
}*/
.store-locator-detail .fil-ariane li:last-child a {
color: #52bd1d;
}
.store-locator-detail .fil-ariane li + li:before {
content: "/";
position: absolute;
left: -5px;
}
.store-locator-detail .fil-ariane li a {
color: #222;
}
.bloc-store-locator .fil-ariane li a:hover,
.bloc-store-locator .fil-ariane li a:focus,
.bloc-store-locator .fil-ariane li a:active,
.store-locator-detail .fil-ariane li a:hover,
.store-locator-detail .fil-ariane li a:focus,
.store-locator-detail .fil-ariane li a:active {
color: #52bd1d;
}
.store-locator-detail .content .reseau,
.store-locator-detail .content h2 {
display: inline-block;
vertical-align: middle;
}
.store-locator-detail .container-title {
margin-bottom: 40px;
}
.store-locator-detail .container-title .note-google {
margin-top: 42px;
}
.store-locator-detail .container-title .note-google span {
display: inline-block;
vertical-align: middle;
margin-right: 5px;
}
.store-locator-detail .container-title .note-google .note {
font-weight: 900;
margin-right: 5px;
color: #ffc100;
font-size: 20px;
}
.store-locator-detail .container-title .note-google .fas {
margin: 0 2px;
color: #ffc100;
font-size: 18px;
}
.store-locator-detail .container-title .note-google .source {
font-size: 14px;
}
.store-locator-detail .content h2.title {
margin: 0;
line-height: 1;
font-weight: 900;
position: relative;
}
.store-locator-detail .content h2.title:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
}
.store-locator-detail .content .reseau {
margin-left: 15px;
}
@media(max-width:767px) {
.store-locator-detail .content .reseau {
display: block;
margin-left: 0;
margin-top: 50px;
}
.store-locator-detail .container-title .note-google {
margin-top: 10px;
}
}
.store-locator-detail .content .reseau .fab {
height: 35px;
width: 35px;
line-height: 35px;
text-align: center;
color: white;
border-radius: 5px;
margin-right: 8px;
font-size: 16px;
box-shadow: 0 0 0 4px white, 0 0 0 5px transparent;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.facebook:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #1b4195;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.linkedin:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #0f72aa;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.youtube:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #ad160b;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.twitter:hover .fab,
.store-locator-detail .content .reseau a.x:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #1DA1F2;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.instagram:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #E1306C;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.pinterest:hover .fab {
box-shadow: 0 0 0 4px white, 0 0 0 5px #E60023;
transition: all 0.3s ease;
}
.store-locator-detail .content .reseau a.facebook .fab {
background-color: #1b4195;
}
.store-locator-detail .content .reseau a.linkedin .fab {
background-color: #0f72aa;
}
.store-locator-detail .content .reseau a.youtube .fab {
background-color: #ad160b;
}
.store-locator-detail .content .reseau a.twitter .fab,
.store-locator-detail .content .reseau a.x .fab {
background-color: #1DA1F2;
}
.store-locator-detail .content .reseau a.instagram .fab {
background-color: #E1306C;
}
.store-locator-detail .content .reseau a.pinterest .fab {
background-color: #E60023;
}
@media(min-width:768px) {
.store-locator-detail .content .description {
margin: 30px 0 50px 0 !important;
}
}
@media(max-width:767px) {
.store-locator-detail .content .description {
margin: 0 0 20px 0 !important;
}
}
.store-locator-detail .content .horaires-supp {
margin-top: 30px;
}
.store-locator-detail .content h3 {
line-height: 1;
font-weight: 600;
margin-bottom: 40px;
font-size: 26px;
position: relative;
}
.store-locator-detail .content h3:before {
content: "";
position: absolute;
height: 5px;
width: 70px;
background-color: #e5e5e5;
bottom: -20px;
left: 0;
}
@media(min-width:768px) {
.store-locator-detail .content .container-horaire {
margin-top: 30px;
}
.store-locator-detail .content .container-horaire {
padding: 0 30px 0 15px;
}
}
.store-locator-detail .content .container-horaire h3 {
margin-top: 0;
}
.store-locator-detail .content .horaires {
margin: 0;
padding: 0;
}
.store-locator-detail .content .horaires li {
list-style: none;
margin-bottom: 5px;
}
.store-locator-detail .content .horaires li.today {
font-weight: 600;
}
.store-locator-detail .content .horaires li.closed {
color: #bdbdbd;
font-weight: 500;
}
.store-locator-detail .content .aside {
padding: 30px;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
}
@media(max-width:767px) {
.store-locator-detail .content .aside {
padding: 15px;
margin-bottom: 40px;
}
}
.store-locator-detail .content .aside img {
display: block;
margin: 0 auto;
}
.store-locator-detail .content .aside .tel,
.store-locator-detail .content .aside .adresse,
.store-locator-detail .content .aside .web {
color: #222;
font-size: 18px;
margin-top: 20px;
padding-left: 30px;
position: relative;
}
.store-locator-detail .content .aside .tel:before,
.store-locator-detail .content .aside .adresse:before,
.store-locator-detail .content .aside .web:before {
position: absolute;
color: #d52b1e;
left: 0;
top: 0;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
}
.store-locator-detail .content .aside .tel:before {
content: "\f095";
}
.store-locator-detail .content .aside .adresse:before {
content: "\f3c5";
}
.store-locator-detail .content .aside .web:before {
content: "\f25a";
}
.store-locator-detail .content .aside .web {
transition: all .3s ease;
display: block;
}
.store-locator-detail .content .aside .web:hover {
opacity: 0.6;
transition: all .3s ease;
}
.store-locator-detail .content .aside .btn {
margin-top: 20px;
}
.store-locator-detail .content .aside h3 {
text-align: center;
margin-top: 30px;
}
.store-locator-detail .content .aside h3:before {
right: 0;
margin: auto;
}
.store-locator-detail .content .aside .gps {
display: flex !important;
margin-top: 30px;
justify-content: center !important;
}
.store-locator-detail .content .aside .gps a {
color: #222;
}
.store-locator-detail .content .aside .gps a:hover {
color: #52bd1d;
}
.store-locator-detail .back-link {
margin-bottom: 40px;
font-weight: 600;
font-size: 20px;
}
.store-locator-detail .back-link .fas {
margin-right: 10px;
}
/*******************************************************
FORM
********************************************************/
.form-control,
.form-select {
border-radius: 3px;
padding: 10px 20px;
height: auto;
color: #6c757d;
}
.form-select {
padding-right: 35px;
}
.form-select option:hover {
background-color: #52bd1d;
}
.form-control:hover,
.form-control:focus,
.form-control:active,
.form-select:hover,
.form-select:focus,
.form-select:active {
border: 1px solid #62c231;
box-shadow: 0 0 0 4px #d9ebd1;
}
.form-control.input-validation-error,
.form-select.input-validation-error {
border: 1px solid #db737d;
box-shadow: 0 0 0 4px #ffdcdf;
}
.form-control:-webkit-autofill,
.form-select:-webkit-autofill {
box-shadow: inset 0 -46px 0 0 white;
-webkit-text-fill-color: #6c757d !important;
}
/*.form-group.checked {
position: relative;
border: 1px solid #62c231;
box-shadow: 0 0 0 4px #d9ebd1;
}
*/
.form-group.checked:before {
content: "\f00c";
position: absolute;
color: #52bd1d;
font-weight: 900;
right: 19px;
font-family: 'Font Awesome 5 Pro';
font-size: 13px;
top: 50%;
transform: translateY(-50%);
}
small.rgbd {
display: block;
font-size: 12px;
line-height: 1.3;
font-weight: 300;
color: #6c757d;
text-align: justify;
}
small.rgbd a {
color: #066ec0;
text-decoration: underline !important;
}
small.rgbd a:hover {
color: #065898;
}
form .form-control[type="checkbox"] {
display: none;
}
form .form-control[type="checkbox"] + label {
font-weight: 300;
position: relative;
padding-left: 30px;
font-size: 16px;
line-height: 1.2;
color: #6c757d;
margin-bottom: 15px;
}
form .form-control[type="checkbox"] + label:before {
content: "\f0c8";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 400;
left: 0;
font-size: 22px;
top: -3px;
}
form .form-control[type="checkbox"] + label::after {
content: "\f14a";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 900;
left: 0;
font-size: 22px;
top: -3px;
color: #62c231;
opacity: 0;
}
form .form-control[type="checkbox"]:checked + label:after {
opacity: 1;
}
.form-rdv {
padding: 40px 0;
}
/*Menu asurance*/
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus {
border-color: #62c231;
box-shadow: 0 0 0 0.25rem rgb(98 194 49 / 25%);
}
.select2-container--bootstrap-5.select2-container--focus .select2-selection {
border-color: #62c231;
box-shadow: 0 0 0 0.25rem rgb(98 194 49 / 25%);
}
.select2.select2-container.select2-container--bootstrap-5 {
width: auto !important;
min-width: 260px;
}
.select2-container--bootstrap-5.select2-container--open .select2-selection {
border-color: #ced4da;
box-shadow: none;
}
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected, .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true] {
background-color: #52bd1d;
}
@media(max-width:767px) {
.form-rdv {
padding-top: 0;
}
}
.form-rdv h2,
.form-rdv h3 {
font-weight: 400 !important;
}
.form-rdv .btn {
margin-top: 50px;
}
.form-rdv .btn .fas {
margin-left: 15px;
}
.form-rdv h2 {
font-size: 30px;
font-weight: 300;
padding-left: 170px;
position: relative;
}
@media(max-width:767px) {
.form-rdv h2 {
padding-left: 0;
text-align: center;
margin-bottom: 0;
}
.form-rdv h2 img {
display: none;
}
}
.form-rdv #identification-vehicule {
padding-top: 40px;
}
.form-rdv h2 img {
position: absolute;
left: 0;
bottom: 7px;
}
.form-rdv h2 span {
font-weight: 700;
}
.form-rdv h3 {
font-size: 18px;
margin-top: 40px;
display: inline-block;
position: relative;
padding-left: 55px;
margin-bottom: 15px;
}
@media(max-width:767px) {
.form-rdv h3 {
margin-bottom: 10px;
}
}
.form-rdv h3 img {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.form-rdv .st {
font-weight: 300;
color: #6c757d;
}
.form-rdv .facultatif {
font-size: 12px;
background-color: #e7f5ff;
padding: 3px 15px;
border-radius: 15px;
color: #4599db;
border: 1px solid #bee3fe;
display: inline-block;
margin-left: 5px;
line-height: 1;
transform: translateY(-3px);
}
@media(max-width:767px) {
.form-rdv .facultatif {
margin-left: 54px;
}
}
#body-rendezvous .fil-ariane {
padding-top: 60px;
position: relative;
margin-right: 80px;
}
@media(max-width:991px) {
#body-rendezvous .fil-ariane {
margin: 0;
padding: 60px 40px 0 40px;
}
#body-rendezvous .fil-ariane:before {
width: calc(100% - 80px) !important;
transform: translateX(-50%);
left: 50% !important;
}
}
@media(max-width:767px) {
#body-rendezvous .fil-ariane {
top: 68px;
width: 100%;
background-color: white;
box-shadow: 0px 4px 10px 0px rgb(0 0 0 / 10%);
position: fixed;
left: 0;
padding: 30px;
z-index: 100;
}
#body-rendezvous .fil-ariane:before {
height: 2px !important;
bottom: 56px !important;
}
#body-rendezvous .fil-ariane .etape img {
display: none !important;
}
#body-rendezvous .fil-ariane .etape p {
bottom: -18px;
font-size: 11px !important;
top: inherit !important;
}
#body-rendezvous .fil-ariane .etape {
background-color: white;
}
#body-rendezvous .fil-ariane .etape span {
width: 40px !important;
height: 40px !important;
line-height: 38px !important;
}
}
#body-rendezvous .fil-ariane:before {
content: "";
position: absolute;
height: 5px;
width: 100%;
background-color: #cfd6d8;
bottom: 21px;
left: 0;
}
#body-rendezvous .fil-ariane .etape {
text-align: center;
position: relative;
}
#body-rendezvous .etape img {
display: none;
position: absolute;
top: -55px;
left: 50%;
transform: translateX(-50%);
}
#body-rendezvous .fil-ariane .etape.selected img {
display: block;
}
#body-rendezvous .fil-ariane .etape p {
font-size: 12px;
color: #bbc1c3;
position: absolute;
text-transform: uppercase;
left: 50%;
transform: translateX(-50%);
top: -24px;
white-space: nowrap;
text-transform: uppercase;
}
@media(min-width:768px) {
#body-rendezvous .fil-ariane .etape.selected p {
visibility: hidden;
}
}
#body-rendezvous .fil-ariane .etape span {
width: 35px;
height: 35px;
line-height: 33px;
font-size: 18px;
color: #bbc1c3;
border: 2px solid #bbc1c3;
border-radius: 100%;
display: inline-block;
text-align: center;
background-color: white;
position: relative;
}
#body-rendezvous .fil-ariane .etape.selected span:before {
position: absolute;
height: calc(100% + 4px);
width: calc(100% + 4px);
border-radius: 100%;
border: 2px solid #62c231;
top: -2px;
color: #62c231;
left: -2px;
font-weight: 900;
font-size: 22px;
background-color: white;
}
#body-rendezvous .fil-ariane .etape:nth-child(1).selected span:before {
content: "1";
}
#body-rendezvous .fil-ariane .etape:nth-child(2).selected span:before {
content: "2";
}
#body-rendezvous .fil-ariane .etape:nth-child(3).selected span:before {
content: "3";
}
#body-rendezvous .fil-ariane .etape:nth-child(4).selected span:before {
content: "4";
}
#body-rendezvous .fil-ariane .etape.checked span:after {
content: "\f00c";
position: absolute;
font-family: 'Font Awesome 5 Pro';
height: calc(100% + 4px);
width: calc(100% + 4px);
border-radius: 100%;
border: 2px solid #b6e29f;
top: -2px;
color: #99d978;
left: -2px;
font-size: 18px;
background-color: #e5fbe2;
}
/* ETAPE 1*/
.form-rdv .vitrage input[type="radio"] {
display: none;
}
@media(max-width:991px) {
.form-rdv .vitrage {
text-align: center;
}
}
.form-rdv .vitrage label.title {
width: 100%;
text-align: center;
margin: 50px 0 30px 0;
font-size: 18px;
font-weight: 400;
}
@media(max-width:767px) {
.form-rdv .vitrage label.title {
margin: 30px 0;
}
}
.form-rdv .vitrage label.vignette {
border-radius: 3px;
padding: 10px 15px;
height: 100%;
margin: 0;
text-align: center;
border: 1px solid transparent;
box-shadow: 0px 0px 10px 0px #e1e1e1;
}
.form-rdv .vitrage label.vignette.selected,
.form-rdv .vitrage label.vignette:hover {
background-color: #f3fcf2;
border: 1px solid #62c231;
box-shadow: 0 0 0 4px #d9ebd1;
cursor: pointer;
}
.form-rdv .vitrage label.vignette label {
display: block;
margin-top: 10px;
font-weight: 300;
line-height: 1;
}
/* ETAPE 2*/
.form-rdv .vehicule .info {
background-color: #e7f5ff;
border-radius: 5px;
padding: 15px 30px;
padding-left: 70px;
position: relative;
line-height: 1.8;
display: inline-block;
}
@media(max-width:1188px) {
.form-rdv .vehicule .info {
margin-top: 10px;
}
.form-rdv .vehicule .info:after {
content: "";
position: absolute;
border-right: 10px solid transparent;
border-left: 10px solid transparent;
border-top: 10px solid transparent;
border-bottom: 10px solid #e7f5ff;
left: 50%;
transform: translateX(-50%);
top: -20px;
}
}
.form-rdv .vehicule .info:before {
content: "";
position: absolute;
background-color: #74c0fc;
height: 100%;
width: 50px;
left: 0;
top: 0;
border-radius: 5px 0 0 5px;
}
@media(min-width:1189px) {
.form-rdv .vehicule .info:after {
content: "";
position: absolute;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid #74c0fc;
left: -20px;
top: 11px;
}
}
.form-rdv .vehicule .info .fal {
font-size: 24px;
color: white;
position: absolute;
top: 18px;
left: 14px;
}
.form-rdv .vehicule .info p {
font-size: 14px;
text-align: left;
}
.form-rdv .vehicule .info p span {
font-weight: 700;
display: block;
}
.form-rdv .vehicule .passe a {
color: #6c757d;
padding: 50px 0;
}
@media(max-width:767px) {
.form-rdv .vehicule .passe a {
padding: 30px 0 5px;
}
}
.form-rdv .vehicule .passe .fal {
background-color: #f3f4f4;
height: 60px;
width: 60px;
border-radius: 100%;
line-height: 60px;
text-align: center;
font-size: 24px;
}
/* ETAPE 3*/
@media(max-width:767px) {
.form-rdv .rdv .btn-rdv {
text-align: center;
}
.form-rdv .rdv .btn-rdv label {
margin-bottom: 15px;
}
.form-rdv .rdv .coordonne {
padding-left: 0 !important;
border: none !important;
}
}
@media(max-width:1417px) {
.form-rdv .rdv .coordonne {
display: block !important;
margin-left: 0 !important;
margin-top: 20px;
}
}
.form-rdv .rdv .btn-rdv label {
font-weight: 300;
color: #6c757d;
border: 1px solid #ced4da;
padding: 20px 30px;
line-height: 1.2;
position: relative;
padding-left: 90px;
margin-right: 8px;
text-align: left;
border-radius: 3px;
width: 295px;
}
.form-rdv .rdv .btn-rdv label input {
display: none;
}
.form-rdv .rdv .btn-rdv label .fal {
font-size: 30px;
position: absolute;
left: 30px;
top: 50%;
transform: translateY(-50%);
}
.form-rdv .rdv .btn-rdv label:hover {
cursor: pointer;
}
.form-rdv .rdv .btn-rdv label:hover,
.form-rdv .rdv .btn-rdv label:active,
.form-rdv .rdv .btn-rdv label:focus,
.form-rdv .rdv .btn-rdv label.selected {
background-color: #f3fcf2;
border: 1px solid #62c231;
box-shadow: 0 0 0 4px #d9ebd1 !important;
}
.form-rdv .rdv .coordonne {
display: inline-block;
color: #6c757d;
font-size: 14px;
line-height: 1.2;
vertical-align: top;
padding-left: 30px;
margin-left: 30px;
border-left: 1px solid #ced4da;
}
.form-rdv .rdv .coordonne .title {
font-size: 18px;
color: #2a2c2b;
margin-bottom: 5px;
font-weight: 400;
}
.form-rdv .rdv .coordonne .title span {
font-weight: 700;
color: #d62b1f;
}
@media(max-width:767px) {
.form-rdv .rdv .coordonne .title span {
display: block;
}
}
.form-rdv .rdv .coordonne p:not(.title) {
line-height: 1.2;
}
.form-rdv .rdv .offert {
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
background-color: #f3fcf2;
padding: 3px 15px;
border-radius: 15px;
color: #4cc04e;
border: 1px solid #99e390;
display: inline-block;
margin-left: 5px;
line-height: 1;
transform: translateY(-3px);
}
.form-rdv .rdv .form-check {
display: inline-block;
margin-left: 5px;
transform: translateY(6px);
}
.form-rdv .rdv .form-check-input:checked {
background-color: #4cc04e;
border-color: #4cc04e !important;
}
.form-rdv .rdv .form-check-input {
width: 40px;
height: 22px;
}
.form-rdv .rdv .form-check-input:focus {
border-color: #99e390;
outline: 0;
box-shadow: none;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2399e390'/%3e%3c/svg%3e");
}
/****** calendrier */
.ui-time-slot-picker.compact .ui-time-slot-calendar {
height: 220px !important;
}
.ui-time-slot-picker,
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day:first-child,
.ui-time-slot-picker #buttonDatePrevious,
.ui-time-slot-picker #buttonDateNext {
border: none;
}
.ui-time-slot-calendar .owl-item {
padding: 0 15px;
}
@media(max-width:767px) {
.ui-time-slot-calendar .owl-item {
padding: 0 5px;
}
.ui-time-slot-calendar .ui-time-slot-day {
transform: translateX(-10px) !important;
box-shadow: 0px 0px 0px 1px rgb(0 0 0 / 10%) !important;
}
}
.ui-time-slot-calendar .ui-time-slot-day {
margin: 10px !important;
transform: translateX(-15px);
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%)
}
@media(min-width:992px) {
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day:not(.closed):hover {
background-color: #f3fcf2;
}
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day:not(.closed):hover .day-number {
background-color: #62c231;
color: white;
border: 1px solid #62c231;
}
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day:not(.closed):hover .day {
color: #62c231;
}
}
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day .day {
text-transform: capitalize;
color: #8d9392;
font-size: 14px;
}
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day .day-number {
height: 43px;
width: 43px;
text-align: center;
color: #2a2c2b;
font-size: 18px;
font-weight: 900;
border-radius: 100%;
border: 1px solid #6c757d;
}
.ui-time-slot-day-content.container {
padding: 0 5px;
}
.ui-time-slot-picker .ui-time-slot {
font-size: 14px;
border: 1px solid #348e06;
color: #348e06;
position: relative;
background-color: #f3fcf2;
transition: all .3s ease;
}
.ui-time-slot-picker .ui-time-slot:hover,
.ui-time-slot-picker .ui-time-slot:active,
.ui-time-slot-picker .ui-time-slot:focus,
.ui-time-slot-picker .ui-time-slot.btn-default {
border: 1px solid #62c231;
color: white;
background-color: #62c231;
transition: all .3s ease;
}
.ui-time-slot-picker .ui-time-slot:hover:before,
.ui-time-slot-picker .ui-time-slot:active:before,
.ui-time-slot-picker .ui-time-slot:focus:before {
color: white;
transition: all .3s ease;
}
.ui-time-slot-picker .ui-time-slot.closed {
color: #888;
border: 1px solid #ced4da;
}
.ui-time-slot-picker .ui-time-slot.closed:before {
color: #888;
}
.ui-time-slot-picker .ui-time-slot-day.closed .ui-time-slot-day-content {
position: absolute;
top: 50%;
transform: translateY(-50%);
opacity: 0.4;
}
.ui-time-slot-picker .ui-time-slot-calendar .ui-time-slot-calendar-container .ui-time-slot-day.closed {
background: #f5f5f5;
box-shadow: none;
}
/* ETAPE 4*/
@media(max-width:767px) {
.form-rdv .info input {
margin-bottom: 10px;
}
}
.fileuploader {
margin: 0;
background: none;
}
.fileuploader-thumbnails-input {
height: 150px;
width: 150px;
line-height: 120px;
padding: 10px;
vertical-align: top;
}
.fileuploader-thumbnails-input .fileuploader-thumbnails-input-inner {
width: 100%;
height: 100%;
border: 1px dashed #a9a6a6;
text-align: center;
font-size: 30px;
color: #2a2c2b;
background: none;
vertical-align: top;
border-radius: 0;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-transition: all .1s ease;
transition: all .1s ease;
}
.form-rdv .info .info-supp {
margin-top: 50px;
padding: 40px;
background-color: #fcfcfc;
border: 2px solid #e5eaef;
position: relative;
margin-bottom: 20px;
}
@media(max-width:767px) {
.form-rdv .info .info-supp {
padding: 20px;
}
.form-rdv .info .info-supp .encadre {
margin-bottom: 15px;
}
.form-rdv .info .info-supp .encadre h3 {
margin-bottom: 10px !important;
}
}
.form-rdv .info .info-supp .encadre h3 {
margin-top: 0;
margin-bottom: 20px;
}
.form-rdv .info .info-supp .dropdown-menu {
width: 100%;
}
.form-rdv .info .info-supp .dropdown-menu li .dropdown-item {
color: #6c757d;
}
.form-rdv .info .info-supp .dropdown-menu li .dropdown-item:hover,
.form-rdv .info .info-supp .dropdown-menu li .dropdown-item:focus {
background-color: white;
color: black;
}
.form-rdv .info .info-supp textarea {
min-height: 130px;
margin: 30px 0;
}
.form-rdv .info .info-supp .docs p,
.form-rdv .info .info-supp .docs label {
color: #6c757d;
font-weight: 300;
}
.form-rdv .info .info-supp .docs p span {
color: #2a2c2b;
font-weight: 400;
}
@media(max-width:767px) {
.form-rdv .info .rgpd {
padding: 20px !important;
}
}
.form-rdv .info .rgpd {
padding: 40px;
background-color: #fcfcfc;
border: 2px solid #e5eaef;
}
.form-rdv .info .rgpd input {
display: none;
}
.form-rdv .info .rgpd small a {
text-decoration: underline !important;
color: #066ec0;
}
.form-rdv .info .rgpd small a:hover {
color: #065898;
}
@media(min-width:768px) and (max-width:991px) {
.form-rdv .form-captcha {
width: 66.66666667%;
}
}
@media(min-width:992px) {
.form-rdv .form-captcha {
width: 75%;
}
}
.form-rdv .form-captcha {
margin-top: 40px;
flex: 0 0 auto;
}
.form-rdv .form-captcha .grecaptcha-badge {
display: inline-block;
}
/*******************************************************
FORM ASIDE
********************************************************/
.form-rdv .separateur {
border-left: 5px solid #f3f4f4;
}
@media(max-width:767px) {
.form-rdv .aside {
display: none;
}
}
@media(max-width:1199px) {
.form-rdv .aside {
padding-left: 15px !important;
}
}
.form-rdv .aside {
position: sticky;
padding-left: 30px;
/*width: inherit;*/
padding-right: 30px;
}
.form-rdv .aside .title {
font-size: 14px;
text-transform: uppercase;
color: #374140;
font-weight: 300;
margin-bottom: 30px;
margin-top: 15px;
}
.form-rdv .aside .question {
font-size: 30px;
color: #2a2c2b;
font-weight: 900;
line-height: 1.2;
margin-bottom: 30px;
}
.form-rdv .aside .tel {
font-size: 22px;
color: #62c231;
font-weight: 900;
line-height: 1.2;
margin-bottom: 30px;
position: relative;
padding-left: 50px;
}
.form-rdv .aside .tel a {
font-weight: 400;
display: block;
}
.form-rdv .aside .tel .fad {
position: absolute;
font-size: 34px;
left: 0;
top: 10px;
}
.form-rdv .aside ul {
margin: 30px 0;
padding: 0;
}
.form-rdv .aside ul li {
list-style: none;
font-size: 22px;
font-weight: 700;
color: #374140;
line-height: 1.2;
}
.form-rdv .aside ul li .far {
margin-right: 10px;
color: #62c231;
font-size: 18px;
}
.form-rdv .aside .info-supp p {
font-size: 18px;
margin-bottom: 15px;
}
.form-rdv .aside .info-supp .fal {
margin-right: 10px;
color: #d52b1e;
transform: translateY(3px);
font-size: 30px;
}
/*******************************************************
AVIS CLIENT
********************************************************/
.title-avis {
font-size: 20px;
margin: 30px 0;
position: relative;
margin-left: 60px;
padding: 20px;
z-index: 1;
}
.title-avis:before {
content: "";
position: absolute;
height: 100%;
width: 18px;
background-color: #ffffff;
top: 0;
transform: skewX( -5deg);
left: 0;
box-shadow: -13px 0px 14px 0px rgb(0 0 0 / 8%);
}
.title-avis p {
line-height: 1.2;
}
.title-avis img {
position: absolute;
left: -56px;
top: 50%;
z-index: -1;
transform: translateY(-50%);
}
.title-avis p span {
display: block;
font-size: 26px;
font-weight: 900;
}
.title-avis .btn-avis-alt {
padding: 10px 15px;
border-radius: 5px;
font-size: 14px;
color: white;
background-color: #ffc100;
transition: all 0.3s ease;
margin-top: 7px;
}
.title-avis .btn-avis-alt:hover,
.title-avis .btn-avis-alt:active,
.title-avis .btn-avis-alt:focus {
background-color: #e8b002;
color: white;
transition: all 0.3s ease;
}
.title-avis .btn-avis-alt .fad {
--fa-secondary-opacity: 1.0;
--fa-primary-opacity: 0.6;
margin-right: 10px;
font-size: 20px;
}
.liste-avis select.form-select {
width: auto;
display: inline-block;
}
.liste-avis .note-google p {
font-size: 34px;
font-weight: 900;
line-height: 1.2;
margin-right: 10px;
}
.liste-avis .note-google p span {
font-size: 18px;
font-weight: 300;
line-height: 1.2;
margin-left: 10px;
vertical-align: middle;
}
.liste-avis .note-google .fa-star {
font-size: 23px;
color: #febc00;
margin: 0 4px;
}
.liste-avis {
padding-bottom: 35px;
}
.liste-avis .col-md-4 {
margin-bottom: 30px;
}
.liste-avis .avis {
background-color: #f3f4f4;
padding: 30px;
height: 100%;
}
.liste-avis .avis .name {
font-weight: 700;
display: inline-block;
margin-right: 5px;
position: relative;
margin-bottom: 10px;
padding-left: 60px;
}
.liste-avis .avis .name img {
position: absolute;
left: 0;
max-width: 50px;
}
.liste-avis .avis .name span {
font-weight: 300;
display: block;
}
.liste-avis .avis .star {
display: inline-block;
vertical-align: top;
line-height: 1;
}
.liste-avis .avis .star .fas {
font-size: 13px;
color: #ffc100;
}
.liste-avis .avis .aspect {
margin-bottom: 20px;
}
.liste-avis .avis .aspect span {
font-weight: 700;
}
/*******************************************************
CONFIRMATION RDV
********************************************************/
.confirmation-rdv {
padding-bottom: 40px;
text-align: center;
}
.confirmation-rdv .title h1 {
display: inline-block;
color: #62c231;
font-size: 40px;
line-height: 1.2;
text-align: left;
padding-left: 60px;
margin-bottom: 25px;
position: relative;
}
.confirmation-rdv .title h1:after {
content: "\f00c";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
color: #62c231;
font-size: 48px;
left: 0;
top: 12px;
}
.confirmation-rdv .title h1 span {
display: block;
font-weight: 700;
font-size: 22px;
}
.confirmation-rdv .title h1:before {
content: none;
}
.confirmation-rdv .title p {
font-size: 18px;
font-weight: 700;
margin-bottom: 25px;
}
.confirmation-rdv .recap {
margin: 30px 0 50px 0;
}
.confirmation-rdv .recap h2 {
font-size: 20px;
font-weight: 700;
margin-bottom: 35px;
position: relative;
}
.confirmation-rdv .recap h2:before {
content: "";
position: absolute;
bottom: -20px;
height: 13px;
width: 203px;
left: 0;
right: 0;
margin: auto;
background-image: url(title-underline-vert.svg);
background-repeat: no-repeat;
background-size: cover;
margin: auto;
}
.confirmation-rdv .recap .date {
font-weight: 700;
margin-bottom: 20px;
}
.confirmation-rdv .recap .adresse span {
font-weight: 700;
display: block;
margin-bottom: 5px;
}
.confirmation-rdv .recap .gps {
display: flex !important;
margin-top: 20px;
justify-content: center !important;
}
.confirmation-rdv .recap .gps a p {
color: #222;
font-weight: 500;
line-height: 1.2;
margin-top: 5px;
}
/*******************************************************
FLOTTE
********************************************************/
.flotte {
padding: 40px 0;
}
/*.flotte .baseline {
text-align: center;
font-size: 36px;
line-height: 1.2;
position: relative;
margin-bottom: 70px;
}
.flotte .baseline span {
display: block;
font-weight: 700;
font-size: 40px;
}
.flotte .baseline:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
right: 0;
margin: auto;
background-image: url(title-underline.svg);
background-repeat: no-repeat;
}*/
.flotte .argument p {
text-align: center;
position: relative;
padding-top: 93px;
margin-bottom: 40px;
font-weight: 500;
}
.flotte .argument p .fal {
position: absolute;
border: 1px solid rgb(82 189 29 / 30%);
font-size: 36px;
top: 0;
left: 50%;
transform: translateX(-50%);
border-radius: 100%;
height: 80px;
width: 80px;
line-height: 78px;
color: #52bd1d;
}
.flotte h2 {
font-weight: 700;
position: relative;
margin-bottom: 50px;
margin-top: 40px;
}
.flotte h2 + p {
text-align: center;
margin-bottom: 30px;
}
.flotte h2:before {
content: "";
position: absolute;
bottom: -20px;
height: 14px;
width: 218px;
left: 0;
right: 0;
background-image: url(title-underline.svg);
background-size: cover;
background-repeat: no-repeat;
margin: auto;
opacity: 0.6;
filter: grayscale(100%);
}
.flotte .confiance img {
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
margin-bottom: 30px;
}
.flotte form small {
display: block;
font-size: 12px;
font-weight: 300;
margin-bottom: 20px;
color: #6c757d;
}
.flotte .form-captcha {
margin-top: 40px;
flex: 0 0 auto;
}
.flotte .form-captcha .grecaptcha-badge {
display: inline-block;
}
/*******************************************************
WIDGET TRUSTVILLE
********************************************************/
.trustville-side {
background-color: #efefef;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 30%);
padding: 7px 10px;
position: fixed;
top: 50%;
z-index: 2;
transform: translateY(-50%);
text-align: center;
}
.trustville-side p {
line-height: 1;
}
.trustville-side .score {
color: #62c231;
font-size: 28px;
padding-bottom: 160px;
font-weight: 700;
}
.trustville-side .score span {
font-size: 16px;
}
.trustville-side .stars .fas {
color: #eec157;
font-size: 20px;
}
.trustville-side .nombre {
color: #62c231;
font-size: 17px;
text-decoration: underline;
}
.trustville-side .nombre:hover {
text-decoration: underline !important;
}
.trustville-side .nombre span {
font-weight: 700;
}
.trustville-side .side-rotate {
transform: rotate( -90deg);
position: absolute;
width: max-content;
left: -21px;
top: 90px;
text-align: center;
}
/*Gestion des etoiles*/
.trustville-side .stars {
background: url(stargrey.png);
background-size: cover;
width: 137px;
height: 28px;
position: relative;
}
.trustville-side .stars_rate {
content: '';
background: url(staryellow.png);
height: 28px;
width: 0%;
display: block;
background-size: cover;
max-width: 137px;
-webkit-transition: width 1s;
transition: width 1s;
position: absolute;
}
.trustville-side .close {
position: absolute;
right: -5px;
top: -5px;
cursor: pointer;
}
/*******************************************************
MEILLEUR ENSEIGNE
********************************************************/
.meilleur-enseigne-side {
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 30%);
top: 24%;
position: fixed;
z-index: 2;
left: 0;
}
/*******************************************************
RAPPEL ENSEIGNE
********************************************************/
.rappel-enseigne .block_template_container + .block_template_container {
border-top: 1px solid #e5e5e5;
}
.rappel-enseigne h5 {
font-size: 28px;
font-weight: 900;
position: relative;
}
.rappel-enseigne h5:before {
content: "";
position: absolute;
bottom: -23px;
height: 14px;
width: 220px;
background-size: cover;
background-repeat: no-repeat;
left: 0;
background-image: url(title-underline.svg);
margin: auto;
}
.rappel-enseigne .btn-close {
position: absolute;
right: 10px;
top: 10px;
}
.rappel-enseigne .offcanvas-header {
padding-bottom: 0;
}
.rappel-enseigne #agences-cp-title,
.rappel-enseigne #agences-container-title {
font-size: 20px;
font-style: italic;
margin: 15px 0;
}
.rappel-enseigne .magasin {
padding: 20px 0;
position: relative;
overflow: hidden;
}
.rappel-enseigne .magasin h2 {
margin-top: 0;
font-size: 22px;
font-weight: 900;
}
.rappel-enseigne .magasin .km {
position: relative;
padding-left: 28px;
margin-top: 5px;
font-weight: 400;
}
.rappel-enseigne .magasin .km:before {
content: "\f5e4";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
left: 0;
color: #d52b1e;
}
.rappel-enseigne .magasin .km .fas {
display: none;
}
.rappel-enseigne .magasin .tel {
color: #222;
}
.rappel-enseigne .magasin .button-secondary {
position: relative;
padding-left: 28px;
font-weight: 400;
margin-bottom: 15px;
}
.rappel-enseigne .magasin .button-secondary:before {
content: "\f879";
position: absolute;
font-family: 'Font Awesome 5 Pro';
font-weight: 500;
top: 0;
color: #d52b1e;
left: 0;
}
/*******************************************************
RECRUTEMENT
********************************************************/
.pills-emploi {
padding: 3px 12px;
border-radius: 5px;
font-size: 14px;
border: 1px solid #e6e6e6;
display: inline-block;
color: #494848;
background-color: #f7f7f7;
}
.pills-emploi.type {
background-color: #348c0a;
font-weight: 700;
color: white;
margin-right: 5px;
border: 1px solid #348c0a;
}
.pills-emploi.temps {
background-color: #f3fcf2;
border: 1px solid #348c0a;
color: #348c0a;
}
.salaire-emploi {
font-weight: 600;
}
.publication-emploi {
color: #6c757d;
font-size: 14px !important;
font-style: italic;
}
.adresse-emploi {
color: #6c757d;
margin-bottom: 15px;
font-weight: 400;
}
/*********** liste */
.liste-offre-emploi {
padding-bottom: 40px;
}
@media(min-width:992px) {
.liste-offre-emploi {
padding-bottom: 90px;
}
}
#form-emploi .form-select {
margin-bottom: 7px;
margin-right: 6px;
}
@media(min-width:768px) {
#form-emploi .form-select {
display: inline-block;
width: auto;
}
}
#form-emploi .form-select:last-child {
margin-right: 0;
}
.liste-offre-emploi .col-md-6 {
margin-bottom: 25px;
}
.liste-offre-emploi .emploi {
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
padding: 20px;
color: #222;
display: block;
border: 5px solid white;
transition: background-color .3s ease;
height: 100%;
position: relative;
}
@media(min-width:768px) {
.liste-offre-emploi .emploi {
padding-bottom: 55px;
}
.liste-offre-emploi .emploi .bottom-offre {
position: absolute;
bottom: 20px;
left: 50%;
width: calc(100% - 40px);
transform: translateX(-50%);
}
}
.liste-offre-emploi .emploi .bottom-offre .detail {
font-size: 15px;
color: #52bd1d;
font-weight: 400;
}
@media(max-width:767px) {
.liste-offre-emploi .emploi .bottom-offre .detail {
text-align: right;
}
}
.liste-offre-emploi .emploi .bottom-offre .detail .fal {
transform: translateY(1px);
}
.liste-offre-emploi .emploi:hover,
.liste-offre-emploi .emploi:active,
.liste-offre-emploi .emploi:focus {
color: #222;
background-color: #f1f1f1;
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%) !important;
transition: background-color .3s ease;
}
.liste-offre-emploi .emploi h2 {
font-size: 20px;
font-weight: 600;
margin-top: 0;
margin-bottom: 10px;
}
.liste-offre-emploi .emploi p {
line-height: 1.2;
font-size: 16px;
}
.liste-offre-emploi .emploi .adresse {
color: #6c757d;
margin-bottom: 15px;
font-weight: 400;
}
.liste-offre-emploi .emploi .pills-container {
margin-bottom: 15px;
}
.liste-offre-emploi .emploi .date {
margin-bottom: 15px;
}
.liste-offre-emploi .publication-emploi {
font-size: 13px !important;
}
/*********** détail */
.detail-offre-emploi {
margin-bottom: 50px;
}
.detail-offre-emploi .title {
margin-top: 30px;
}
.detail-offre-emploi h1 {
margin-top: 0;
}
.detail-offre-emploi .title .fal,
.detail-offre-emploi .title .fab {
height: 35px;
width: 35px;
line-height: 35px;
border-radius: 100%;
color: white;
background-color: #222222;
text-align: center;
margin-right: 7px;
box-shadow: 0 0 0 3px #ffffff, 0 0 0 4px transparent;
transition: all .3s ease;
}
.detail-offre-emploi .title .fal:hover,
.detail-offre-emploi .title .fab:hover {
box-shadow: 0 0 0 3px #ffffff, 0 0 0 4px #222222;
transition: all .3s ease;
}
.detail-offre-emploi h2 {
font-size: 24px;
font-weight: 600;
}
.detail-offre-emploi .content h2 {
margin-top: 50px;
}
@media(max-width:767px) {
.detail-offre-emploi .content h2 {
margin-top: 30px;
}
}
.detail-offre-emploi .aside {
box-shadow: 0px 2px 13px 0px rgb(0 0 0 / 10%);
padding: 35px;
}
@media(max-width:767px) {
.detail-offre-emploi .aside {
padding: 20px;
margin-top: 30px;
}
}
.detail-offre-emploi .aside h2 {
margin-top: 0;
margin-bottom: 25px;
}
.detail-offre-emploi .aside .adresse-emploi {
line-height: 1.2;
}
.detail-offre-emploi .aside .adresse-emploi a {
color: #52bd1d;
display: block;
}
.detail-offre-emploi .aside .adresse-emploi a .fal {
margin-right: 5px;
}
.detail-offre-emploi .aside .listing p {
margin-bottom: 20px;
}
.detail-offre-emploi .aside .listing p:last-child {
margin-bottom: 0;
}
.detail-offre-emploi .aside .listing p span {
font-weight: 600;
}
.detail-offre-emploi .aside .avantage {
margin-bottom: 20px;
}
.detail-offre-emploi .aside .avantage p {
margin-bottom: 10px;
}
.detail-offre-emploi .aside .avantage .pills-emploi {
margin-bottom: 5px;
}
/*******************************************************
MODAL COUPURE
********************************************************/
#modalalert {
text-align: center;
color: #343738 !important;
}
#modalalert .modal-content {
padding: 18% 15%;
background: url(rapid-pare-brise-coupure-electricite-min.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
position: relative;
z-index: 0;
border: none;
}
#modalalert .modal-content:before {
content: "";
position: absolute;
height: 100%;
width: 100%;
background-color: white;
opacity: 0.7;
top: 0;
z-index: -1;
left: 0;
border-radius: 0.3rem;
}
#modalalert .modal-content .btn-close {
position: absolute;
top: 40px;
right: 40px;
opacity: 1;
}
#modalalert .modal-header {
border-bottom: none;
padding: 0;
}
#modalalert .modal-header .modal-title {
display: block;
font-size: 50px;
font-weight: 900;
margin-top: 0;
line-height: 1.2;
margin-bottom: 20px;
}
@media(max-width:767px) {
#modalalert .modal-header .modal-title {
font-size: 37px;
}
}
#modalalert .modal-body {
padding: 0;
}
#modalalert .modal-body p {
font-weight: 600;
font-size: 22px;
}
#modalalert .modal-body p span {
color: #d52b1e !important;
}
@media(max-width:767px) {
#modalalert .modal-body p {
font-size: 18px;
}
}
/*******************************************************
MODAL COUPURE
********************************************************/
body[id^="body-partenaire-"] .store-locator-title {
margin-bottom: 25px;
}
body[id^="body-partenaire-"] .store-locator-title h1 span {
color: #52bd1d;
}
body[id^="body-partenaire-"] .store-locator-title h1 {
margin: 0;
padding: 40px;
font-size: 32px;
padding-left: 20px;
}
@media(max-width:767px) {
body[id^="body-partenaire-"] .store-locator-title {
text-align: center;
padding-top: 30px;
}
body[id^="body-partenaire-"] .store-locator-title h1 {
padding: 25px 0 !important;
font-size: 25px;
padding-left: 0;
}
}
body[id^="body-partenaire-"] .store-locator-title h1:before {
content: none;
}
body[id^="body-partenaire-"] header + div {
padding-top: 0 !important;
}
body[id^="body-partenaire-"] header,
body[id^="body-partenaire-"] footer .main,
body[id^="body-partenaire-"] footer .bottom-nav {
display: none
}
body[id^="body-partenaire-"] footer .bottom-footer {
margin: 0;
border: none;
}
body[id^="body-partenaire-"] footer .bottom-footer ul {
padding-top: 0;
}
/*******************************************************
PARRAINAGE
********************************************************/
.parrainage h2 {
font-weight: 700;
font-size: 32px;
}
@media(max-width:767px) {
.parrainage h2 {
margin-top: 0;
}
}
.parrainage h2 span {
color: #52bd1d;
}
@media(min-width:992px) {
.parrainage h2 span {
display: block;
}
}
.parrainage .etape-parrainage {
background-color: rgba(82, 189, 29,0.05 );
padding: 50px 30px;
text-align: center;
margin: 50px 0;
}
@media(max-width:767px) {
.parrainage .etape-parrainage {
padding: 20px 15px 35px 15px;
margin: 20px 0 40px 0;
}
}
.parrainage .etape-parrainage h3 {
font-weight: 900;
font-size: 26px;
margin-bottom: 30px;
}
.parrainage .etape-parrainage .etape + .etape {
margin-top: 45px;
}
.parrainage .etape-parrainage p {
padding: 0 100px;
font-size: 17px;
line-height: 1.3;
}
@media(max-width:767px) {
.parrainage .etape-parrainage p {
padding: 0 15px;
}
}
.parrainage .etape-parrainage p > span {
font-weight: 900;
color: #484E4D;
font-size: 90px;
display: inline-block;
position: relative;
transform: translateX(-32px);
margin-bottom: 15px;
}
.parrainage .etape-parrainage p span .container-img {
position: absolute;
height: 80px;
width: 80px;
line-height: 64px;
background-color: white;
text-align: center;
border-radius: 100%;
border: 1px solid #52bd1d;
box-shadow: 0 0 0 6px #d9ebd1;
bottom: 8px;
right: -66px;
}
.parrainage .etape-parrainage .modalite {
font-size: 15px;
}
.parrainage .modalite span {
font-size: 20px;
font-weight: 700;
display: block;
margin-bottom: 20px;
}
.parrainage .container-form {
padding: 20px 40px;
background-color: #fcfcfc;
border: 2px solid #e5eaef;
margin-bottom: 40px;
}
.parrainage .container-form h2 {
text-align: center;
}
.parrainage .container-form h2 img {
display: block;
margin: 0 auto;
}
.parrainage .container-form h2 + p {
text-align: center;
font-size: 17px;
margin-top: 25px;
}
.parrainage .container-form h3 {
font-size: 24px;
margin-bottom: 20px;
margin-top: 35px;
font-weight: 400;
}
.parrainage .container-form textarea {
min-height: 110px;
}
.parrainage .container-form .rgbd {
text-align: left;
margin-bottom: 35px;
}
/*******************************************************
DETAIL ACTIVITES
********************************************************/
/* décalaminage */
.detail-activite .description a {
color: #52bd1d;
font-weight: 400;
position: relative;
transition: all .3s ease;
}
.detail-activite .description a:before {
content: "";
position: absolute;
height: 1px;
width: 0;
bottom: 0;
background-color: #3c8f14;
left: 0;
transition: all .3s ease;
}
.detail-activite .description a:hover:before {
width: 100%;
transition: all .3s ease;
}
/* FIN */
.p-20 {
padding: 20px;
}
.p-30 {
padding: 30px 20px;
}
.p-40 {
padding: 40px 20px;
}
.p-50 {
padding: 50px 20px;
}
.p-60 {
padding: 60px 20px;
}
.p-70 {
padding: 70px 20px;
}
.p-80 {
padding: 80px 20px;
}
.p-150 {
padding: 150px 20px;
}
@media(max-width:991px) {
.p-20,
.p-30,
.p-40,
.p-50,
.p-60,
.p-70,
.p-80,
.p-150 {
padding: 30px 0;
}
}
.bg-grey {
background-color: #F7F7F7;
}
@media(max-width:991px) {
.detail-activite.bg-grey {
background-color: white;
}
}
.activite-header {
margin-bottom: 40px;
position: relative;
overflow: hidden;
box-shadow: 1px 0px 20px 4px hsl(0deg 0% 0% / 10%);
}
.activite-header h1 {
margin-top:0;
}
.activite-header .sous-titre {
font-size: 28px;
font-weight: 600;
margin-bottom: 30px;
margin-top:0;
color:#222 !important;
}
.breadcrumb-activite {
padding: 20px 0 ;
margin: 0;
}
.breadcrumb-activite li {
list-style: none;
display: inline-block;
font-weight:300;
position: relative;
}
.breadcrumb-activite li a {
font-size: 14px;
text-decoration: none;
color: #222222;
padding: 0 10px;
position: relative;
}
.breadcrumb-activite li a:hover {
color: #52bd1d;
}
.breadcrumb-activite li + li:before {
content: "\f105";
position: absolute;
font-family: 'Font Awesome 5 Pro';
color: #222222;
font-size: 14px;
font-weight: 300;
top: 4px;
left: -3px;
}
.detail-activite {
padding: 40px 0;
}
.detail-activite .img-container {
background-size: cover;
background-repeat: no-repeat;
background-position-x: center;
}
@media(max-width:991px) {
.detail-activite .img-container {
height: 300px;
background-position: center;
}
.detail-activite {
padding: 15px 0;
}
}
.detail-activite ul {
margin: 0;
}
.detail-activite h2 {
font-weight: 600;
font-size: 28px;
margin-top: 0;
margin-bottom: 30px;
}
.detail-activite p + h2,
.detail-activite ul + h2,
.detail-activite ul + p {
margin-top: 30px;
}
.detail-activite p + p {
margin-top: 30px;
}
.detail-activite .centered-title {
margin-bottom: 70px;
position: relative;
text-align: center;
}
.detail-activite .centered-title:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
margin: auto;
left: 0;
right: 0;
background-repeat: no-repeat;
background-image: url(title-underline.svg);
}
.activite-conclusion {
margin: 40px 0;
padding: 50px;
box-shadow: 1px 0px 20px 4px hsl(0deg 0% 0% / 10%);
}
@media(max-width:991px) {
.activite-conclusion {
padding: 30px 15px;
}
}
.activite-conclusion h2 {
font-size: 28px;
font-weight: 900;
}
.activite-conclusion h2 .fad {
--fa-primary-color: #52bd1d;
--fa-secondary-color: #52bd1d;
--fa-secondary-opacity: 0.5;
--fa-primary-opacity: 1.0;
font-size: 20px;
margin-right: 10px;
}
.activite-conclusion h3 {
font-size: 28px;
font-weight: 600;
margin: 30px 0;
}
.activite-conclusion .title-conclusion {
font-size: 28px;
font-weight: 600;
margin-bottom: 20px;
}
.activite-conclusion .bt-detail-activite,
.detail-activite .bt-detail-activite {
margin-top: 40px;
font-size: 16px;
padding: 15px 33px 15px 75px;
position: relative;
border-radius: 0;
color: white;
z-index: 0;
border: none;
}
.activite-conclusion .bt-detail-activite:before,
.detail-activite .bt-detail-activite:before {
content: "";
height: 100%;
position: absolute;
width: 100%;
top: 0;
left: 0;
transform: skewX(-5deg);
z-index: -1;
background: linear-gradient(to right,#2b8906,#6a9d26);
}
.activite-conclusion .bt-detail-activite:hover,
.activite-conclusion .bt-detail-activite:focus,
.activite-conclusion .bt-detail-activite:active,
.detail-activite .bt-detail-activite:hover,
.detail-activite .bt-detail-activite:focus,
.detail-activite .bt-detail-activite:active {
color: white;
outline: none !important;
box-shadow: none !important;
background-color: transparent !important;
}
.activite-conclusion .bt-detail-activite:hover:before,
.detail-activite .bt-detail-activite:hover:before {
background: linear-gradient(to right,#207100,#96d443);
}
.activite-conclusion .bt-detail-activite span,
.detail-activite .bt-detail-activite span {
text-transform: uppercase;
color: #fff;
display: block;
font-weight: 700;
transition: all .3s ease;
}
.activite-conclusion .bt-detail-activite .fad,
.detail-activite .bt-detail-activite .fad {
--fa-primary-color: #fff;
--fa-secondary-color: #fff;
--fa-secondary-opacity: 0.5;
--fa-primary-opacity: 1.0;
font-size: 30px;
left: 34px;
top: 50%;
position: absolute;
transform: translateY(-50%);
transition: all .3s ease;
}
.detail-autre-activite {
padding: 40px 0
}
.detail-autre-activite h2 {
margin-bottom: 70px;
font-weight: 600;
position: relative;
}
.detail-autre-activite h2:before {
content: "";
position: absolute;
bottom: -33px;
height: 19px;
width: 292px;
left: 0;
background-repeat: no-repeat;
background-image: url(title-underline.svg);
}
.detail-autre-activite .content {
background-color: white;
box-shadow: 1px 0px 20px 4px hsl(0deg 0% 0% / 10%);
padding: 25px;
height: 100%;
position: relative;
padding-bottom: 82px;
}
.detail-autre-activite .content h3 {
font-size: 21px;
margin-top: 25px;
}
.detail-autre-activite .content h3 span{
font-weight: 600;
}
.detail-autre-activite .btn {
position: absolute;
left: 50%;
bottom: 25px;
transform: translateX(-50%);
}
.detail-autre-activite .btn:before {
transition: all .3s ease;
}
.detail-autre-activite .btn {
transition: all .3s ease;
}
.detail-autre-activite .btn .fal {
position: absolute;
opacity: 0;
margin-left: 10px;
transform: translateY(-50%);
top: 50%;
transition: all .3s ease;
}
.detail-autre-activite .btn:hover:before {
background-color: #52bd1d;
transition: all .3s ease;
}
.detail-autre-activite .btn:hover {
padding-right: 50px;
transition: all .3s ease;
}
.detail-autre-activite .btn:hover .fal {
opacity: 1;
transition: all .3s ease;
}