/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* RESET */

* { box-sizing:border-box; }
html { position:relative; display:block; }

body { position:relative; display:block; width:100%; margin:0; padding:0; font-family:Montserrat, sans-serif; font-size:0.8rem; font-weight:200; line-height:1.4; background-color:rgba(255,255,255,1); color:rgba(21,21,21,1); text-align:left; overflow-x:hidden; overflow-y:scroll; }
body.noscrollbar { overflow-y:hidden; }

header, main, footer { position:relative; display:block; width:100%; margin:0; padding:0; overflow-x:hidden; }

h1, h2, h3, h4, h5, h6 { position:relative; margin:0; padding:0; font-family:Days One, sans-serif; font-size:1.5rem; font-weight:400; color:inherit; }

div { position:relative; margin:0; padding:0; }

a, a:link, a:active, a:visited, a:focus { font-size:inherit; color:inherit; text-decoration:inherit; outline-color:transparent; }
body.desktop a:hover { color:inherit; text-decoration:underline; outline-color:transparent; }

img { margin:0; padding:0; border:0; }
svg { position:relative; display:inline-block; vertical-align:top; height:100%; width:100%; margin:0; padding:0; }

p { font-size:inherit; word-wrap:break-word; text-align:left; margin:0; padding:1em 0 0 0; }
p:first-of-type, h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p { padding-top:0; }
span { position:relative; display:inline; font-size:inherit; margin:0; padding:0; }

ul { position:relative; margin:0; padding:0; }
li { position:relative; font-size:inherit; word-wrap:break-word; text-align:left; margin:0; padding:0; }
.fromrte ul { margin-left:1em; }

.wrap { display:block; position:absolute; overflow:hidden; left:0; top:0; width:100%; height:100%; }
.cover { position:absolute; top:50%; left:50%; width:auto; height:auto; transform:translate(-50%, -50%); display:block; margin:0; padding:0; background-color:transparent; }
.cover.top { top:0; transform:translate(-50%,0); }
.cover.bottom { top:100%; transform:translate(-50%,-100%); }
.cover.left { left:0; transform:translate(0,-50%); }
.cover.topleft { left:0; top:0; transform:translate(0,0); }
.cover.bottomleft { left:0; top:100%; transform:translate(0,-100%); }
.cover.right { left:100%; transform:translate(-100%,-50%); }
.cover.topright { left:100%; top:0; transform:translate(-100%,0); }
.cover.bottomright { left:100%; top:100%; transform:translate(-100%,-100%); }
.cover > img, .cover > video, .cover > div, .cover > span { position:absolute; display:inline-block; width:100%; height:100%; left:0; top:0; }

.clear { clear:both; }
.blochref { cursor:pointer; }

pre, code { position:relative; font-size:13px; text-align:left; color:#c7254e; background-color: #f9f2f4; border-radius:0.5em; padding:0.8em; display:block; margin:0 0 1em 0; border:0; }

.ajaxloader { z-index:999999; position:fixed; left:0; top:0; width:100vw; height:100vh; background-color:rgba(0,0,0,0.4); }
.ajaxloader svg { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:8%; height:auto; color:rgb(0,165,225); }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/*    Mise en forme spécifique des formulaires   */
/*----------------------------------------------------------------------------------------------------------------------------------------------*/

input, textarea, select { position:relative; display:inline-block; vertical-align:top; width:100%; font-size:inherit; display:inline-block; background-color:rgba(221,221,221,1); color:rgba(22,22,22,1); line-height:2; height:2em; vertical-align:middle; margin:0; padding:0.1em 0.3em 0 0.3em; width:100%; border:0; border-radius:0; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; }
textarea { height:6em; }
select { background-image:url(https://www.atelierdumoteur.com/_chartes_/ateliermoteur/ressources/images/contribution/dropdown.svg) !important; background-size:1.5em; background-position: right center !important; background-repeat: no-repeat !important; padding-right:30px !important; }
select::-ms-expand { display: none; }
select option { color:rgba(22,22,22,1); }
select.placeholder { color:rgba(54,54,54,0.55) !important; }

/* Mise en forme des boutons radio et des checkboxes */
input[type="radio"] + span:before, input[type="checkbox"] + span:before, input[type="radio"] + span:after, input[type="checkbox"] + span:after {
	content:'' !important; position:absolute !important;
	left:0 !important; top:0 !important; /* on décale la case de 10% de sa taille pour bien la centrer en hauteur */
	width:1em !important; height:1em !important; /* on définit la taille de référence de la case à la même taille que la font du span */
	transform-origin: 50% 50% !important; /* pour être certain du point d'origine du scale pour la case et la coche */
	transition:all .2s !important; /* on prévoit une animation */
}
input[type="radio"], input[type="checkbox"] { position:absolute !important; left:0 !important; top:1em !important; opacity:0 !important; transform: scale(0) !important; height:1em !important; width:1em !important; } /* On masque le champ input (opacité 0) */
input[type="radio"] + span, input[type="checkbox"] + span { position:relative !important; cursor:pointer !important; padding-top:0 !important; padding-bottom:0 !important; padding-left:1.6em !important; } /* on prépare le label (balise span située à côté du champ input) */
input[type="radio"] + span:before, input[type="checkbox"] + span:before { border:1px solid rgba(221,221,221,1) !important; background-color:transparent !important; } /* Aspect général de la case */
input[type="radio"] + span:after, input[type="checkbox"] + span:after { border:1px solid transparent !important; background-color:rgba(221,221,221,1) !important; } /* Aspect général de la coche */
input[type="checkbox"] + span:before, input[type="checkbox"] + span:after { border-radius: 5% !important; } /* angles arrondis */
input[type="radio"] + span:before, input[type="radio"] + span:after { border-radius: 50% !important; } /* cases circulaires */
input[type="radio"]:not(:checked) + span:after, input[type="checkbox"]:not(:checked) + span:after { opacity: 0 !important; transform: scale(0) !important; } /* Aspect si "pas cochée" */
input[type="radio"]:checked + span:after, input[type="checkbox"]:checked + span:after { opacity: 1 !important; transform: scale(0.5) !important; } /* Aspect si "cochée" */

label { position:relative; display:inline-block; vertical-align:top; font-weight:200; }

button, a.button { position:relative; display:inline-block; vertical-align:top; font-family:Montserrat, sans-serif; font-size:inherit; font-weight:400; text-align:center; background-color:rgba(22,22,22,1); border:1px solid rgba(22,22,22,1); color:rgba(255,255,255,1); margin:0; padding:0.5em 1em; width:auto; outline:0; }
body.desktop button:hover, body.desktop a.button:hover { color:rgba(22,22,22,1); background-color:rgba(255,255,255,1); border-color:rgba(22,22,22,1); text-decoration:none; outline:0; }


body.noscrollbar { height:0; overflow-y:hidden; }
body.windows.noscrollbar, 
body.windows.noscrollbar #preload > div, 
body.windows.noscrollbar aside#headercontact,
body.windows.noscrollbar header, 
body.windows.noscrollbar header nav > div { max-width:calc(100% - 17px); }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* HEADER */

header { z-index:1000; position:fixed; padding-top:calc(2 * 0.8rem); text-align:left; left:0; top:0; right:0; height:calc( (1.4 * 4rem) + (2 * 0.8rem) ); background-color:rgba(255,255,255,1); color:rgba(21,21,21,1); overflow:hidden; transition:height 300ms ease 0ms; }
body.showmenu header {  background-color:transparent; height:100%; transition:height 0ms ease 0ms }

header nav { z-index:1100; position:fixed; display:block; opacity:0; background-color:rgba(45,45,45,1); max-height:0; width:100%; left:0; top:0; bottom:0; margin:0; padding:0; overflow-x:hidden; overflow-y:hidden; transition: opacity 300ms linear 0ms, max-height 0ms linear 300ms; }
body.showmenu header nav { opacity:1; overflow-y:auto; max-height:100%; transition: opacity 300ms linear 0ms, max-height 0ms linear 0ms; }

header a, header button, body.desktop header button:hover { border:0; outline:0; background-color:transparent; }

a#logo { position:relative; display:inline-block; vertical-align:top; font-size:4rem; margin:0.3em 0 0.1em 5%; padding:0; width:calc(1em * (249.1 / 106.8)); height:1em; }

button#showhidemenu { z-index:1200; position:absolute; display:inline-block; top:3rem; right:3rem; width:3rem; height:3rem; margin:0; padding:0; background-color:transparent; }
button#showhidemenu > svg { color:rgba(21,21,21,1); position:absolute; left:0; top:0; width:100%; height:100%; transition:color 300ms linear 0ms; }
body.showmenu button#showhidemenu > svg { color:rgba(255,255,255,1); }

button#showhidemenu > svg line { transition:transform 300ms linear 0ms; stroke-width:3; stroke-linecap:round; transform-origin: 40% 50%; }
button#showhidemenu > svg line:nth-of-type(1) { transform: translate(0,-20%) scaleX(1) rotate(0deg); }
button#showhidemenu > svg line:nth-of-type(2) { transform: translate(-18.75%,0) scaleX(0.625); }
button#showhidemenu > svg line:nth-of-type(3) { transform: translate(12.5%,20%) scaleX(1.25) rotate(0deg); }
body.desktop #showhidemenu:hover > svg line:nth-of-type(1) { transform: translate(0,-20%) scaleX(1) rotate(0deg); }
body.desktop #showhidemenu:hover > svg line:nth-of-type(2) { transform: translate(0,0) scaleX(1); }
body.desktop #showhidemenu:hover > svg line:nth-of-type(3) { transform: translate(0,20%) scaleX(1) rotate(0deg); }
body.showmenu button#showhidemenu > svg line:nth-of-type(1), body.desktop.showmenu button#showhidemenu:hover > svg line:nth-of-type(1) { transform: translate(0,0) scaleX(1) rotate(45deg); }
body.showmenu button#showhidemenu > svg line:nth-of-type(2), body.desktop.showmenu button#showhidemenu:hover > svg line:nth-of-type(2) { transform: translate(-40%,0) scaleX(0); }
body.showmenu button#showhidemenu > svg line:nth-of-type(3), body.desktop.showmenu button#showhidemenu:hover > svg line:nth-of-type(3) { transform: translate(0,0) scaleX(1) rotate(-45deg); }

header nav > svg { z-index:1130; position:fixed; left:26vw; top:-200%; width:20vw; height:auto; max-height:50vh; transform:translateX(-50%); color:rgba(255,255,255,1); }
body.showmenu header nav > svg { top:15%; }

header nav > ul { z-index:1110; position:relative; display:block; top:25%; left:0; height:auto; width:100%; padding-left:49vw; padding-bottom:5rem; overflow-x:hidden; }
header nav > ul li { position:relative; font-size:1.8rem; margin:0 0 0.5em 0; list-style-type:none; white-space: nowrap; text-overflow:ellipsis; }
header nav > ul li.current button:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:2px; height:2rem; background-color:rgb(0,165,225); }
header nav button { text-align:left; color:rgba(255,255,255,1); font-size:1em; font-weight:200; transition:color 100ms linear 0ms; margin:0; padding:0.5em 1em 0.5em 1.5em; }
body.desktop header nav button:hover { color:rgb(0,165,225); }

header nav .copyright { z-index:1130; position:fixed; left:0; bottom:200%; padding:1em 5% 2em 20%; width:100%; height:auto; font-size:0.9rem; background-color:rgba(45,45,45,1); color:rgba(255,255,255,1); }
body.showmenu header nav .copyright { bottom:0; }
header nav .copyright span { display:inline-block; padding-right:calc(2rem + 1px); margin-right:2rem; }
header nav .copyright span:after { content:''; position:absolute; width:1px; height:1em; right:0; top:50%; transform:translateY(-50%); background-color:rgba(255,255,255,1); opacity:0.5; }
header nav .copyright button { display:inline-block; padding:0; margin:0; border:0; }


body.showmenu aside#headercontact { z-index:0; }
aside#headercontact { z-index:1140; position:fixed; font-size:0; left:0; right:0; background-color:rgba(38,38,38,1); color:rgba(255,255,255,1); text-align:right; padding-right:3.2rem; }
aside#headercontact > span { font-size:0.8rem; line-height:1; display:inline-block; position:relative; vertical-align:baseline; height:auto; padding:0.5em 0 0.5em 2em; margin-right:4em; }
aside#headercontact svg { display:inline-block; position:absolute; height:60%; width:auto; left:0; top:50%; transform:translateY(-50%); }
body.desktop aside#headercontact a:hover { text-decoration:none; }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* MAIN */
main { font-size:1rem; margin:0; padding:0; display:block; position:relative; width:100%; overflow-x:hidden; overflow-y:hidden; }
main, aside.mosaic { padding-top:calc( (1.4 * 4rem) + (2 * 0.8rem) ); }
.scroll main { }

section.defaut { text-align:center; padding-bottom:3rem; }
section.defaut img { max-width:100%; }

main h1, main h2, main h3, main h4, main h5, main h6 { color:rgb(0,165,225); }

a.ancre { display:block !important; position:absolute !important; margin:0 !important; padding:0 !important; width:0 !important; height:0 !important; overflow:hidden !important; top:calc( -1 * ( (1.4 * 4rem) + (2 * 0.8rem) ) ) !important; z-index:100000 !important; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* ACCUEIL */

#preload { position:fixed; z-index:9999; background-color:#000; top:0; left:0; width:100%; bottom:0; opacity:1; }
#preload.disappear { opacity:0; width:0; transition:opacity 1500ms ease 0ms, width 0ms linear 1500ms; }
#preload > div { position:absolute; left:0; width:100%; top:0; height:100%; }
#preload > div svg { z-index:2; position:absolute; left:50%; top:50%; width:50%; max-height:50%; height:auto; transform:translate(-50%,-50%); color:#fff; }
#preload > svg { position:absolute; left:50%; top:50%; max-width:20%; max-height:20%; width:auto; height:auto; transform:translate(-50%,-50%); color:rgb(0,165,225); opacity:0.6; }
#preload > p { z-index:1; position:absolute; left:50%; top:50%; width:30%; height:auto; color:rgba(255,255,255,1); font-size:1.5rem; text-transform:uppercase; font-weight:200; padding:2em 0.5em; text-align:center; opacity:1; transform:translate(-50%,-50%); }
#preload.launch > p { opacity:0; transition:opacity 200ms ease 500ms; }


#preload > #count { z-index:3; position:absolute; left:50%; bottom:10%; width:5em; height:auto; color:rgba(255,255,255,1); font-size:1.6rem; text-transform:uppercase; font-weight:200; padding:0 0.5em 0 0.5em; text-align:center; opacity:0; transform:translateX(-50%); }
#preload.launch #count { opacity:1; }


.slider { position:relative; width:100%; height:0; padding:0; overflow:hidden; background-color:rgb(125,113,83); }
.slider ul { position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; }
.slider ul li { z-index:851; position:absolute; width:100%; height:100%; left:100%; top:0; opacity:0; background-color:rgba(38,38,38,1); }
.slider ul li.fadeout { z-index:851; left:100vw; opacity:0; transition:opacity 1000ms linear 1000ms, left 0ms linear 2000ms, z-index 0ms linear 1000ms; }
.slider ul li.fadein { z-index:852; left:0; opacity:1; transition:opacity 1000ms linear 1000ms, left 0ms linear 0ms, z-index 0ms linear 0ms; }
.slider ul li.first { transition:all 0ms linear 0ms; }
.slider ul li h2 { font-size:2.3rem; display:block; position:relative; left:0; width:100%; top:50%; transform:translateY(-50%); margin:0; padding:0 40% 0 10%; }
.slider ul li h2 span { opacity:0; left:100vw; position:relative; display:inline-block; width:100%; margin:0; padding:0; text-align:left; }
.slider ul li h2 span:nth-of-type(1) { font-size:1.5em; line-height:1.2; color:rgb(0,165,225); font-weight:400; text-transform:uppercase; margin-bottom:0.5em; }
.slider ul li h2 span:nth-of-type(2) { font-size:1.05em; line-height:1.3; color:rgba(255,255,255,1); font-family:Montserrat, sans-serif; font-weight:200; text-transform:uppercase; }
.slider ul li svg { position:absolute; top:45%; right:10%; transform:translateY(-50%); height:30rem; width:auto; color:rgba(0,165,225,0.85); }
.slider ul li.fadein svg { opacity:1; transition:opacity 500ms linear 2800ms; }
.slider ul li.fadeout svg { opacity:0; transition:opacity 200ms linear 0ms; }
.slider ul li.first svg { opacity:0; transition:all 0ms linear 0ms; }
.slider ul li.fadein h2 span { opacity:1; left:0; }
.slider ul li.fadein h2 span:nth-of-type(1) { transition:opacity 500ms linear 2300ms, left 500ms linear 2000ms; }
.slider ul li.fadein h2 span:nth-of-type(2) { transition:opacity 500ms linear 2500ms, left 500ms linear 2200ms; }
.slider ul li.fadeout h2 span { opacity:0; left:100vw; transition:opacity 200ms linear 0ms, left 0ms linear 2000ms; }
.slider ul li.first h2 span { opacity:0; left:100vw; transition:all 0ms linear 0ms; }

#home-slider.slider { padding-bottom:calc(100vh - ((1.4 * 4rem) + (2 * 0.8rem) )); }
#home-slider.slider ul li.diapo-electriques div.animate > img { animation:9000ms linear 0ms infinite running electriques; }
@keyframes electriques {
	0% { top: 0%; left: 0%; width:105%; height:105%; }
	100% { top: -10%; left:-15%; width:120%; height:120%; }
}
#home-slider.slider ul li.diapo-motos div.animate > img { animation:9000ms linear 0ms infinite running motos; }
@keyframes motos {
	0% { top: 0%; left: -5%; width:105%; height:105%; }
	100% { top: -10%; left:0%; width:120%; height:120%; }
}
#home-slider.slider ul li.diapo-camions div.animate > img { animation:9000ms linear 0ms infinite running camions; }
@keyframes camions {
	0% { top: 0%; left: 0%; width:105%; height:105%; }
	100% { top: -5%; left:-10%; width:110%; height:110%; }
}



#home-activites { font-size:0; position:relative; display:block; margin:2rem 1.5rem; padding:0; }
#home-activites ul li { width:33.33%; height:0; margin:0; padding:0; padding-bottom:22.22%; position:relative; display:inline-block; background-color:rgba(255,255,255,1); overflow:hidden; }
#home-activites ul li.vente { width:100%; padding-bottom:17%; }
#home-activites ul li > div { position:absolute; display:block; left:1rem; top:1rem; bottom:1rem; right:1rem; overflow:hidden; background-color:rgba(38,38,38,1); }
#home-activites ul li h2 { z-index:23; font-size:2.3rem; color:rgba(255,255,255,1); position:absolute; width:100%; left:50%; top:50%; transform:translate(-50%, -50%); margin:0; padding:0 1.5em; text-align:center; text-transform:uppercase; }
#home-activites ul li img { z-index:21; position:absolute; display:block; left:50%; top:50%; transform:translate(-50%,-50%) scale(1.01); border:0; margin:0; padding:0; width:100%; height:auto; transition:transform 200ms ease 0ms; }
body.desktop #home-activites ul li a:hover { text-decoration:none; }
body.desktop #home-activites ul li > div:after { opacity:0; content:''; z-index:22; position:absolute; left:0; top:0; right:0; bottom:0; background-color:rgba(0,165,225,0.8); transition:opacity 300ms ease 0ms; }
body.desktop #home-activites ul li > div:hover:after { opacity:1; }


#home-presentation { position:relative; display:block; margin:0; padding:0; overflow:hidden; }
#home-presentation > .parallaxe { position:relative; left:0; top:0; width:100%; height:20rem; overflow:hidden; }
#home-presentation > .parallaxe img { position:absolute; left:0; width:100%; }
#home-presentation > div:not(.parallaxe) { position:relative; padding:8rem 10% 8rem 40%; }
#home-presentation > div:not(.parallaxe) > svg { position:absolute; left:8%; top:50%; width:24%; height:auto; transform:translateY(-50%); color:rgba(21,21,21,1); }
#home-presentation > div:not(.parallaxe) > div:not(.wrap) { font-size:1rem; position:relative; margin:0; height:auto; background-color:rgba(255,255,255,0.9); padding:3rem 6rem; }
#home-presentation h2 { font-weight:400; text-transform:uppercase; font-size:2.2em; margin-bottom:0.5em; }
#home-presentation h3 { font-family:Montserrat, sans-serif; font-weight:200; color:rgba(21,21,21,1); text-transform:uppercase; font-size:1.6em; margin-bottom:1.2em; }
#home-presentation p { font-size:0.9em; line-height:1.5; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* PAGES ACTIVITES */

#page-slider.slider { padding-bottom:calc(100% / 3); }
#page-slider.slider.vente { padding-bottom:calc(100% / (2500 / 698)); }
#page-slider.slider ul li svg { height:23vw; }

#page-blocs { font-size:0; display:block; width:100%; position:relative; padding:0; margin:0; border-top:3rem solid rgb(125,113,83); }

section.bloc { font-size:0; display:inline-block; vertical-align:top; width:100%; position:relative; padding:0; margin:1rem 0; }
section.bloc:first-of-type { margin-top:2rem; }
section.bloc:last-of-type { margin-bottom:3rem; }

section.bloc > div { position:relative; display:block; padding:0; margin:0; width:100%; }

section.bloc div.bloc-col { font-size:1rem; position:relative; display:inline-block; vertical-align:top; width:50%; margin:0; padding:0 0 6rem 0; }
section.bloc div.bloc-col:nth-of-type(1) { padding-right:calc(4% + 1rem); }
section.bloc div.bloc-col:nth-of-type(2) { padding-left:calc(4% + 1rem); }

section.bloc h2 { font-size:2rem; z-index:2; text-transform:uppercase; margin:0; padding:6rem 0 1rem 0; font-weight:400; }
section.bloc.double h2 { padding-top:2rem; padding-bottom:2rem; }
section.bloc h2 span { color:rgba(198,198,198,1); }
section.bloc h3 { font-size:1.5em; font-family:Montserrat, sans-serif; font-weight:200; text-transform:uppercase; margin-bottom:1rem; }
section.bloc p, section.detail p { font-size:0.9em; }
section.bloc p { position:relative; padding-right:20%; }
section.bloc p:first-of-type { margin-top:2.5em; }
section.bloc a { color:rgb(0,165,225); font-weight:400; }
body.desktop section.bloc a { text-decoration:none; color:rgb(0,165,225); }

section.bloc button { padding:0.7em 2em; margin:4rem 0 0 0; font-size:0.9em; text-align:center; background-color:transparent; color:rgba(21,21,21,1); border:1px solid rgba(21,21,21,0.6); border-radius:6px; transition:all 300ms ease 0ms; }
section.bloc.dark button { color:rgba(255,255,255,1); border-color:rgba(255,255,255,0.6); }
body.desktop section.bloc button:hover { background-color:rgb(0,165,225); color:rgba(255,255,255,1); border-color:rgb(0,165,225); }

section.bloc.dark > div { background-color:rgba(45,45,45,1); }
section.bloc div.bloc-col, section.bloc h3, section.bloc p { color:rgba(21,21,21,1); }
section.bloc.dark div.bloc-col, section.bloc.dark h3, section.bloc.dark p { color:rgba(255,255,255,1); }


section.bloc div.bloc-col, section.bloc h2 { padding-left:8%; padding-right:8%; }

section.bloc.peinture div.bloc-col:nth-of-type(1), section.bloc.peinture h2 { padding-left:calc(4% + 1rem); padding-right:8%; }

section.bloc.plus h2 { padding-top:1rem; }
section.bloc.plus p:first-of-type { margin-top:0; }
section.bloc.plus div.bloc-col:nth-of-type(1) { width:100%; padding-right:8%; padding-bottom:0; }

section.bloc.ratio > div { overflow:hidden; height:0; padding-bottom:calc( 100% / 1.2); }
section.bloc.ratio p { padding-right:5%; }

section.bloc.introcarrosserie, section.bloc.introrestauration { margin-top:0; }
section.bloc.introcarrosserie h2, section.bloc.introrestauration h2 { font-size:0; }

aside.mosaic { font-size:0; display:block; position:relative; width:100%; margin:0; padding-left:0; padding-right:0; padding-bottom:3rem; }
aside.mosaic li { position:relative; display:inline-block; height:0; margin:0; padding:0; width:calc(100% / 3); padding-bottom:calc(100% / 3); color:rgba(255,255,255,1); overflow:hidden; }
aside.mosaic li.paysage { width:calc(2 * 100% / 3); }
aside.mosaic li.panoramic { width:calc(3 * 100% / 3); }
aside.mosaic li img { z-index:21; }

aside.mosaic li a { z-index:23; position:absolute; left:0; top:0; right:0; bottom:0; font-size:1rem; text-transform:uppercase; color:inherit; transition:background 300ms ease 0ms; }
body.desktop aside.mosaic li a:hover { text-decoration:none; color:inherit; }
aside.mosaic li a > div { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:1rem; text-transform:uppercase; color:inherit; }
aside.mosaic li a span { opacity:0; position:relative; display:block; width:100%; text-transform:uppercase; text-align:center; font-size:2.3em; line-height:1.2;  font-weight:600; transition:opacity 100ms ease 0ms; }
body.desktop aside.mosaic li a:hover span, aside.mosaic li a.hover span { opacity:1; transition:opacity 300ms ease 500ms; }
aside.mosaic li a span.annee { padding-top:0.2em; font-weight:200; }

aside.mosaic div.hoverdir { position:absolute; z-index:22; background:rgba(125,113,83,0.88); width:100%; height:100%; }
aside.mosaic li a.hover { background:rgba(125,113,83,0.88); }

section.detail { font-size:1rem; display:inline-block; vertical-align:top; width:100%; position:relative; padding:5rem 20% 0 20%; margin:0; text-align:center; }
section.detail nav { position:absolute; left:2%; top:1em; }
section.detail h2 { font-family:Montserrat, sans-serif; font-size:2.5em; font-weight:700; color:rgba(66,66,66,1); text-transform:uppercase; padding-bottom:0.8em; }
section.detail h3 { font-family:Montserrat, sans-serif; font-size:2.2em; font-weight:200; color:rgba(66,66,66,1); text-transform:uppercase; padding-bottom:1.2em; }
section.detail p { text-align:center; }

#page-blocs.vente section { padding-top:4rem; }
#page-blocs.vente h2 { font-size:1.5rem; font-family:Montserrat, sans-serif; color:rgba(21,21,21,1); font-weight:600; text-align:center; width:90%; margin:0 auto 2rem auto; text-transform:uppercase; }

#page-blocs.vente .liste > div { display:block; font-size:0.9rem; text-align:center; width:90%; margin:2rem auto 2rem auto; }
#page-blocs.vente .liste > div p { text-align:center; }
#page-blocs.vente .vide > div { display:block; font-size:0.9rem; text-align:center; width:90%; margin:0 auto 8rem auto; }
#page-blocs.vente .vide h2 { font-size:1.3rem; margin-bottom:1.2rem; }
#page-blocs.vente .vide > div p { text-align:center; }

#page-blocs.vente .liste > ul { position:relative; display:block; font-size:0; margin:4rem auto 0 auto; width:90%; }
#page-blocs.vente .liste > ul > li { position:relative; display:inline-block; vertical-align:top; width:100%; margin:0; padding:0 2rem; }
#page-blocs.vente .liste > ul > li img { position:relative; width:100%; height:auto; padding:0; margin:0; }

#page-blocs.vente .liste > ul > li a { position:relative; display:block; font-size:1rem; padding:0 0 0 1em; margin:2em 0 4em 0; overflow-x:hidden; }
#page-blocs.vente .liste > ul > li a:hover { text-decoration:none; }

#page-blocs.vente .liste h3 { font-size:1.2em; line-height:1; font-family:Montserrat, sans-serif; font-weight:200; color:rgba(21,21,21,1); margin:0 5em 0.8em 0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#page-blocs.vente .liste a > div { font-size:0.9em; position:relative; display:block; padding:0; width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#page-blocs.vente .liste span { position:relative; display:inline; }
#page-blocs.vente .liste span:not(:first-of-type):before { content:'-'; position:relative; display:inline; padding:0 0.2em; font-weight:200; color:rgba(21,21,21,1); }

#page-blocs.vente .liste span.prix { font-size:1.2em; line-height:1; background-color:rgba(255,255,255,1); font-weight:600; position:absolute; right:0; top:0;  padding:0 0 0 1em; color:rgb(0,165,225); }
#page-blocs.vente .liste span.prix:before { content:none; padding:0; }

#page-blocs.vente .liste span.marque { font-weight:600; text-transform:uppercase; }
#page-blocs.vente .liste span.energie { font-weight:600; }
#page-blocs.vente .liste span.boite { display:inline-block; text-transform:uppercase; padding-top:1em; }
#page-blocs.vente .liste .neuf span.kilometrage { font-weight:600; color:rgb(0,165,225); }

#page-blocs.vente .engagements { position:relative; display:block; margin:0 auto 4rem auto; padding:0; width:90%; }
#page-blocs.vente .engagements h2 { color:rgba(21,21,21,1); font-family:Days One, sans-serif; font-size:2.4rem; }
#page-blocs.vente .engagements > ul { font-size:0; position:relative; display:block; margin-top:4rem; }
#page-blocs.vente .engagements > ul > li { font-family:Rubik; font-weight:300; font-size:1rem; position:relative; display:inline-block; vertical-align:top; width:calc( (100% - (6 * 3em) ) / 3); height:0; padding-bottom:calc(55% / 3); margin:0; margin:2em 3em 0 3em; background-color:rgb(0,165,225); }
#page-blocs.vente .engagements > ul > li:before { content:''; z-index:1; position:absolute; left:1em; top:1em; right:1em; bottom:1em; background-color:transparent; border:1px solid rgba(255,255,255,1); }
#page-blocs.vente .engagements h3 { z-index:4; font-family:Rubik; font-weight:800; position:absolute; font-size:1.8em; top:52%; left:50%; transform:translate(-50%, -50%); width:10em; text-align:center; color:rgba(255,255,255,1); text-transform:uppercase; }
#page-blocs.vente .engagements h3 span { font-weight:300; }
#page-blocs.vente .engagements .asterisque { z-index:3; position:absolute; font-size:0.7em; left:2.5em; bottom:2.1em; color:rgba(255,255,255,1); }
#page-blocs.vente .engagements .picto { z-index:2; position:absolute; top:1em; height:6.5em; width:6.5em; left:50%; transform:translate(-50%, -50%); border-radius:50%; background-color:rgb(0,165,225); color:rgba(255,255,255,1); }


#page-blocs.vente .fiche { position:relative; display:block; font-size:0; margin:0 auto 4rem auto; width:90%; }
#page-blocs.vente section.fiche > nav { position:relative; width:100%; padding-bottom:1rem; margin-bottom:2rem;  border-bottom:1px solid rgba(21,21,21,1); }

#page-blocs.vente section.fiche > div { position:relative; display:inline-block; vertical-align:top; width:50%; margin:0 0 2rem 0; padding:0; }

#page-blocs.vente .photos img { position:relative; width:100%; height:auto; padding:0; margin:0; }
#page-blocs.vente .photos > ul { position:relative; display:block; margin-top:2rem; }
#page-blocs.vente .photos > ul > li { position:relative; display:inline-block; vertical-align:top; width:calc( (100% - (2 * 0.5rem) ) / 3); margin:0; margin:0 0 0.5rem 0; cursor:pointer; }
#page-blocs.vente .photos > ul > li:nth-of-type(3n+2) { margin:0 0.5rem 0.5rem 0.5rem; }

#page-blocs.vente .photos nav { display:block; border:0; margin:2rem 0; padding:0; text-align:center; }
#page-blocs.vente .photos nav button, #page-blocs.vente .photos nav div { position:relative; display:inline-block; vertical-align:middle; margin:0; padding:0; }
#page-blocs.vente .photos nav button { width:1em; }
#page-blocs.vente .photos nav div { width:10em; }
#page-blocs.vente .photos nav div > span { display:inline-block; vertical-align:middle; min-width:2em; text-align:left; }
#page-blocs.vente .photos nav div > span:first-of-type { text-align:right; }

#page-blocs.vente div.photo { width:100%; height:auto; padding:0; margin:0; }
#page-blocs.vente div.photo > img { z-index:1;  }
#page-blocs.vente div.photo:after { z-index:2; content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-image: radial-gradient(ellipse at center, transparent 70%, rgba(0,0,0,10%)); }

#page-blocs.vente div.descriptif h3 { font-size:1.4rem; text-transform:uppercase; font-family:Montserrat, sans-serif; color:rgba(21,21,21,1); font-weight:400; }
#page-blocs.vente div.descriptif h4 { font-size:1.1rem; text-transform:uppercase; font-family:Montserrat, sans-serif; color:rgba(21,21,21,1); font-weight:200; }
#page-blocs.vente div.descriptif h5 { font-size:1rem; text-transform:uppercase; font-family:Montserrat, sans-serif; color:rgba(21,21,21,1); font-weight:700; }

#page-blocs.vente div.descriptif h3 > img, #page-blocs.vente div.descriptif h3 > svg { position:relative; display:block; width:auto; height:auto; max-width: 40%; max-height:5rem; margin-bottom:1rem; }

#page-blocs.vente div.descriptif > div.neuf { position:relative; display:block; font-size:1.1rem; font-weight:400; margin:1em 0; text-transform:uppercase;  color:rgb(0,165,225); }

#page-blocs.vente div.descriptif > ul.entete { position:absolute; display:inline-block; width:auto; right:0; top:0; padding:0; margin:0; }
#page-blocs.vente div.descriptif > ul.entete > li { position:relative; display:block; font-size:1rem; padding:0; margin:0 0 0.7em 0; text-align:right;  min-width:15em; }
#page-blocs.vente div.descriptif > ul.entete > li.prix h5 { display:none; }
#page-blocs.vente div.descriptif > ul.entete > li.prix span { font-size:1.2em; display:inline-block; width:auto; padding:0.5em 1em; background-color:rgb(0,165,225); color:rgba(255,255,255,1); text-transform:uppercase; border-radius:6px; font-weight:400; text-align:center; }
#page-blocs.vente div.descriptif > ul.entete > li.ref h5, #page-blocs.vente div.descriptif > ul.entete > li.ref span { display:inline; font-size:0.8em; text-transform:none; font-weight:Montserrat, sans-serif; font-weight:200; padding-right:0.3em; }

#page-blocs.vente div.descriptif > ul.line { margin:4rem 0; }
#page-blocs.vente div.descriptif > ul.line > li { font-size:0.9rem; list-style-type:none; }
#page-blocs.vente div.descriptif > ul.line > li h5, #page-blocs.vente div.descriptif > ul.line > li span { display:inline-block; vertical-align:top; position:relative; line-height:1.4; }
#page-blocs.vente div.descriptif > ul.line > li h5 { font-size:1em; text-transform:none; width:14em; font-weight:400; padding-right:1em; }
#page-blocs.vente div.descriptif > ul.line > li span { font-size:1em; width:calc(100% - 14em - 5px); }
#page-blocs.vente div.descriptif > ul.line > li.garantie { padding-top:1rem; }

#page-blocs.vente div.descriptif > ul.tag { margin:4rem 0; }
#page-blocs.vente div.descriptif > ul.tag > li { font-size:0.9rem; display:inline-block; width:auto; margin-right:0.5em; margin-bottom:0.5em; padding:0.5em 1em; background-color:rgb(0,165,225); color:rgba(255,255,255,1); text-transform:uppercase; border-radius:6px; font-weight:400; }

#page-blocs.vente div.descriptif > ul.option { margin:2rem 0 0 0; }
#page-blocs.vente div.descriptif > ul.option > li { font-size:0.9rem; display:block; padding-left:1.5em; }
#page-blocs.vente div.descriptif > ul.option > li:before { content:''; position:absolute; left:0; top:0.5em; width:0.5em; height:0.5em; background-color:rgba(100,100,100,1); }

#page-blocs.vente div.infos button { width:100%; text-transform:uppercase; padding:0.7em 2em; margin:0; font-size:0.9rem; text-align:center; background-color:transparent; color:rgba(21,21,21,1); border:1px solid rgba(21,21,21,0.6); border-radius:6px; transition:all 300ms ease 0ms; }
body.desktop #page-blocs.vente div.infos button:hover { background-color:rgb(0,165,225); color:rgba(255,255,255,1); border-color:rgb(0,165,225); } 

section nav { font-size:1rem; display:inline-block; }
section nav button { font-size:1em; position:relative; text-transform:uppercase; background-color:transparent; border:0; color:rgba(21,21,21,1); font-weight:600; margin:0; padding:0 1.5em; }
section nav button svg { transform:translateY(-50%) rotate(180deg); height:1em; width:1em; position:absolute; display:inline-block; vertical-align:baseline; top:50%; }
section nav button svg { stroke-width:6; }
section nav div.prevnext { font-size:0; position:absolute; width:auto; right:0; display:inline-block; vertical-align:baseline; }
section nav div.prevnext button { font-size:1rem; text-transform:none; font-weight:400; }

section nav button:not(.next) svg { transform:translateY(-50%) rotate(180deg); left:0; }
section nav button.next svg { transform:translateY(-50%) rotate(0deg); right:0; }
section nav button.inactive { cursor:default; opacity:0.2; }

section > nav button.next:before { content:'/'; opacity:1; position:absolute; top:50%; left:0; transform:translate(-50%,-50%); }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* ANIMATION SCROLL */

.scrollanim.init { opacity:0; transition:opacity 300ms linear 0ms, transform 300ms linear 0ms; }
.scrollanim { opacity:1; transition:opacity 500ms linear 0ms, transform 300ms linear 0ms; }

.scrollanim.frombottom.init { opacity:0; transform:translate(0,50%); }
.scrollanim.frombottom { opacity:1; transform:translate(0,0); }
.scrollanim.fromtop.init { opacity:0; transform:translate(0,-50%); }
.scrollanim.fromtop { opacity:1; transform:translate(0,0); }
.scrollanim.fromleft.init { opacity:0; transform:translate(-100%,0); }
.scrollanim.fromleft { opacity:1; transform:translate(0,0); }
.scrollanim.fromright.init { opacity:0; transform:translate(100%,0); }
.scrollanim.fromright { opacity:1; transform:translate(0,0); }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* CONTACT */

#page-contact { font-size:0; display:block; width:100%; position:relative; padding:0; margin:0; border-top:3rem solid rgb(125,113,83); }

/* Formulaire */

section.contact form { position:relative; display:block; width:100%; font-size:0; padding:4rem 10% 4rem 10%; }
section.contact form h2 { font-size:1.8rem; text-transform:none; padding:0 0 1em 0; font-family:Montserrat, sans-serif; color:rgba(21,21,21,1); font-weight:200; }
section.contact form h2 span { font-size:0.8em; font-weight:400; }
section.contact form h2 p { padding-top:0; }
	
section.contact fieldset { font-size:0; position:relative; display:inline-block; vertical-align:top; margin:0 0 1rem 0; padding:0; border:0; width:100%;  }

section.contact label, section.contact fieldset > div { font-size:1rem; width:100%; display:inline-block; vertical-align:top; margin:0; padding:0; margin-bottom:0.7em; }
section.contact label > span, section.contact fieldset > div > span { color:rgba(73,73,73,1); font-weight:400; font-size:0.9em; width:100%; display:inline-block; vertical-align:top; padding:0.5em 0.5em 0.5em 1em; }
section.contact label.consentementrgpd { font-size:0.8rem; margin-top:1rem; text-transform:none; }
section.contact option.placeholder { color:rgba(54,54,54,0.55); }
section.contact fieldset > div.infosdevis { margin-top:0.7em; margin-bottom:0; }

section.contact input, section.contact textarea { background-color:transparent; border:1px solid rgba(21,21,21,0.3); border-radius:3px; padding:0 1em; }

section.contact textarea { height:10em; }

section.contact input[type="radio"] + span:before, section.contact input[type="checkbox"] + span:before, section.contact input[type="radio"] + span:after, section.contact input[type="checkbox"] + span:after { top:0.05em !important; border-radius:3px !important; }
section.contact input[type="radio"] + span:before, section.contact input[type="checkbox"] + span:before { border-color:rgba(21,21,21,0.3) !important; }
section.contact input[type="radio"] + span:after, section.contact input[type="checkbox"] + span:after { background-color:rgb(0,165,225) !important; }
section.contact input[type="radio"] + span:before, section.contact input[type="radio"] + span:after { border-radius:50% !important; }

section.contact select { background:transparent url(../../_chartes_/ateliermoteur/ressources/images/forms/dropdown.svg) calc(100% - 0.5em) center no-repeat !important; padding-right:2.5em !important; }
section.contact input[name="date"] { background:transparent url(../../_chartes_/ateliermoteur/ressources/images/forms/date.svg) calc(100% - 0.5em) center no-repeat; padding-right:2.5em; }
.datepicker table tr td.disabled, body.desktop .datepicker table tr td.disabled:hover { opacity:0.3; }

section.contact form label input[type="checkbox"], section.contact form label input[type="radio"] { padding-top: 0 !important; padding-bottom: 0 !important; position: relative !important; left: 0 !important; top: 1.2rem !important; transform: scale(1) !important; }

section.contact form button { position:relative; background-color:rgb(0,165,225); border-color:rgb(0,165,225); color:rgba(255,255,255,1); border-radius:6px; text-transform:uppercase; font-weight:400; padding:0.5em 2.5em; font-size:1rem; margin-top:1em; display:block; width:auto; transform:translateX(-100%); left:100%; transition:all 300ms ease 0ms; }
body.desktop section.contact form button:hover { background-color:transparent; border-color:rgba(21,21,21,0.6); color:rgba(21,21,21,1); }

section.contact span.asterisque { display:block; width:auto; font-size:0.7rem; margin:1em 0 2em 0; }
section.contact sup { color:rgb(0,165,225); font-weight:500; }

section.contact div.succes { padding-top:3rem; padding-bottom:5rem; font-size:1.4rem; text-align:center; }
section.contact div.erreur { padding-bottom:3rem; }

/* COORDS */

section.contact h2 { font-size:1.8em; text-transform:uppercase; padding:0; }

section.contact aside.coordscontact { font-size:1rem; position:relative; padding:4rem 10%; padding-bottom:75%; background-color:rgba(57,57,57,1); color:rgba(221,221,221,1); background-repeat:no-repeat; background-position:center bottom; background-size:100%; }

section.contact aside.coordscontact div { font-size:1em; padding-bottom:1rem; }
section.contact aside.coordscontact div.nom { font-size:1.5em; font-weight:600; padding-top:2.2em; padding-bottom:1em; }
section.contact aside.coordscontact div.tel { font-size:1.3em; font-weight:400; }

body.desktop section.contact aside.coordscontact a:hover { text-decoration:none; }


/* MAP */

section.contact aside.mapcontact { font-size:1rem; }
section.contact aside.mapcontact h2 { padding:1em 10%; text-transform:uppercase; background-color:rgba(57,57,57,1); color:rgb(0,165,225); }
section.contact aside.mapcontact > div { position:relative; padding:0; margin:0; width:100%; height:0; padding-bottom:40%; }

// Affichage des boutons zoom
section.contact aside.mapcontact ul > li { position:relative; list-style-type:none; padding:0 0.2em; }
section.contact aside.mapcontact ul > li:before { content:''; display:none; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* MENTIONS LEGALES */

section#page-mentionslegales { font-family:Verdana, sans-serif; color:rgba(21,21,21,1); font-size:0.7rem; font-weight:300; display:block; margin:0; padding:3em 10%; border-top:3rem solid rgb(125,113,83); }
section#page-mentionslegales h1 { font-size:1.4em; text-transform:uppercase; font-weight:600; padding-bottom:1em; }
section#page-mentionslegales h2 { font-size:1.1em; text-transform:uppercase; font-weight:600; padding-top:1.5em; padding-bottom:0.5em; }
section#page-mentionslegales p { text-align:justify; }
section#page-mentionslegales li { text-align:justify; }
section#page-mentionslegales strong { font-weight:600; }

/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* AUTHENTIFICATION */

section.section-auth { padding-top:4rem; }

section.section-auth { width:45%; margin:0 auto 15rem auto; }
section.section-auth h1 { padding:3rem 0 2rem 0; }
section.section-auth input { margin-bottom:0.5em; }

section.section-auth form button { position:relative; background-color:rgb(0,165,225); border-color:rgb(0,165,225); color:rgba(255,255,255,1); border-radius:6px; text-transform:uppercase; font-weight:400; padding:0.5em 2.5em; font-size:1rem; margin-top:1em; display:block; width:auto; transform:translateX(-100%); left:100%; transition:all 300ms ease 0ms; }
body.desktop section.section-auth form button:hover { background-color:transparent; border-color:rgba(21,21,21,0.6); color:rgba(21,21,21,1); }


section.section-auth .retour { padding-bottom:1.5em; }

section.section-auth #ul-auth { list-style-type:none; margin:2rem 0; }
section.section-auth #ul-auth li { text-transform:uppercase; }
body.desktop section.section-auth #ul-auth li a:hover { color:rgb(0,165,225); text-decoration:none; }

section#page-compte.section-auth { width:60%; }


section.adminliste { width:60%; margin:4rem auto; }
section.adminliste ul { margin-top:2rem; }
section.adminliste ul li { font-size:0.9rem; padding-bottom:0.5em; }
section.adminliste ul li > span { font-weight:400; padding-left:0.5em; display:inline-block; vertical-align:middle; }
section.adminliste a { opacity:0.3; font-weight:200; padding-left:0.2em; display:inline-block; vertical-align:middle; transition:all 300ms ease;}
section.adminliste a:hover { opacity:1; }
section.adminliste > a svg { stroke:currentColor; stroke-width:10; }

#fieldset_versions { display:none; }
#fieldset_destination { display:none; }
#fieldset_properties { display:none; }
#fieldset_acces { display:none; }
#fieldset_referencement { display:none; }
#fieldset_redirection { display:none; }


/*----------------------------------------------------------------------------------------------------------------------------------------------*/
/* FOOTER */
footer { z-index:900; position:relative; background-color:rgba(255,255,255,1); }

footer .contact { z-index:903; position:absolute; left:40%; top:2.6rem; width:18rem; padding:0; margin:0; font-size:0.9rem; color:rgba(255,255,255,1); }
footer .contact button { padding:0.7em 2em; margin:2em 0 0 0; font-size:0.9em; background-color:transparent; color:rgba(255,255,255,1); text-transform:uppercase; text-align:center; border:1px solid rgba(255,255,255,0.6); border-radius:6px; transition:all 300ms ease 0ms; }
body.desktop footer .contact button:hover { background-color:rgb(0,165,225); color:rgba(255,255,255,1); border-color:rgb(0,165,225); }

footer .coords { z-index:901; font-size:1rem; position:relative; background-color:rgba(45,45,45,1); color:rgba(255,255,255,1); padding:2.6rem 60% 2.6rem 10%; }
footer .coords > span { display:inline-block; width:100%; margin:0; padding:0.5em 0 0 0; vertical-align:top; }
footer .coords > span:first-of-type { padding-left:0; padding-top:0; padding-bottom:0.5em; }
footer .coords > span > span { display:inline-block; }
body.desktop footer .coords a:hover { text-decoration:none; }
footer .coords span.nom { font-size:1.3em; text-transform:uppercase; font-family:Days One, sans-serif; color:rgb(0,165,225); }
footer .coords span.adresse { font-size:0.8em; }
footer .coords span.email { font-size:0.7em; padding-top:0.1rem; padding-bottom:0.4rem; }
footer .coords span.tel { font-size:1em; font-weight:400; padding-left:calc(1em + 1px); margin-left:1em; }
footer .coords span.tel:before { content:''; position:absolute; width:1px; height:1em; left:0; top:50%; transform:translateY(-50%); background-color:rgba(255,255,255,1); opacity:0.5; }

footer .copyright { z-index:902; font-size:0.6rem; background-color:rgba(38,38,38,1); color:rgba(255,255,255,1); padding:0 5rem; text-align:right;  }
footer .copyright > span, footer .copyright > a { display:inline-block; margin:1.2em 0; padding:0 1em; text-transform:uppercase; vertical-align:top; line-height:1.1; }
footer .copyright > span:first-of-type { text-transform:none; padding-right:3rem; }
footer .copyright > span:not(:first-of-type):before { content:''; position:absolute; width:1px; height:1em; left:0; top:50%; transform:translateY(-50%); background-color:rgba(255,255,255,1); opacity:0.5; }
footer .copyright a { text-transform:uppercase; transition:all 300ms ease 0ms; }
body.desktop footer .copyright a:hover { text-decoration:none; color:rgb(0,165,225); background-color:transparent; }


/* ------------------------------------------------------------------------------------------------------------- */
/* RESPONSIVE */

html { font-size:10px; font-size:1vw; }

#en2mots { background-color:rgba(255,255,255,1); width:100%; max-width:2560px; margin:0 auto; position:relative; }

/* AFFICHAGE PANORAMIC */

/* Attention, le style panoramic n'est pas ajouté sur body mais sur html
html.panoramic { left:calc( ( 100% - 2.2 * 100vh ) / 2); width:calc(2.2 * 100vh); font-size:2vh; text-align:center; }
*/
html.panoramic #preload p { width:20%; }
html.panoramic #preload > div svg { max-height:65%; }

/* AFFICHAGE FONT MAXI */
@media (min-width:2000px) { 

	html { font-size:20px; }

	section.bloc.entretien div.bloc-col:nth-of-type(2) p { padding-right:30%; }

section.pneus.bloc.half div.bloc-col:nth-of-type(1) { width:50% !important; }
section.clim.bloc.half div.bloc-col:nth-of-type(1) { width:50% !important; }

#page-blocs.vente .engagements { width:90rem; }

}

/* AFFICHAGE MAXI */
@media (min-width:2560px) { 

	.litebox-overlay .litebox-container { margin-left:auto; margin-right:auto; }
	.litebox-overlay .litebox-inline-html { width:960px; }

}
/* AFFICHAGE NORMAL */
@media (orientation:portrait) and (min-width:951px), (orientation:landscape) and (min-width:501px) {
	aside#headercontact { top:0; }

	#home-activites ul li:nth-of-type(2) .scrollanim { transition-delay:200ms; }
	#home-activites ul li:nth-of-type(3) .scrollanim { transition-delay:400ms; }

	section.bloc div.bloc-row { position:relative; display:block; margin:0; padding:0; }
	section.bloc div.bloc-row div.bloc-col { padding-top:6rem; padding-bottom:6rem; vertical-align:middle; }

	section.bloc.half { width:calc(50% - 1rem); }
	section.bloc.half:nth-of-type(2n) { margin-left:1rem; }
	section.bloc.half:nth-of-type(2n+1) { margin-right:1rem; }
	section.bloc.half div.bloc-col:nth-of-type(1) { width:60%; padding-right:1rem; }

	section.bloc.half div.bloc-col, section.bloc.half h2 { padding-left:12%; padding-right:12%; }
	section.bloc.half h2 { padding-top:5rem; }
	
	section.bloc.entretien div.bloc-col:nth-of-type(1) { padding-top:0; padding-bottom:0; }

section.pneus.bloc.half div.bloc-col:nth-of-type(1) { width:65%; }
section.clim.bloc.half div.bloc-col:nth-of-type(1) { width:65%; }

	section.bloc.introcarrosserie div.bloc-col, section.bloc.introrestauration div.bloc-col { padding-left:calc(8% + 4%); }
	section.bloc.peinture div.bloc-col, section.bloc.peinture h2 { margin-left:50%; }

	#page-blocs.restauration section.bloc.half div.bloc-col { width:100%; padding-left:12%; padding-right:12%; padding-bottom:1rem; }
	#page-blocs.restauration section.bloc.half { width:calc(50% - (6% + 1rem)); }
	#page-blocs.restauration section.bloc.half:nth-of-type(2n) { margin-left:calc(6% + 1rem); }
	#page-blocs.restauration section.bloc.half:nth-of-type(2n+1) { margin-right:calc(6% + 1rem); }
	#page-blocs.restauration section.bloc.half p { padding-right:0; }
	#page-blocs.restauration section.bloc:last-of-type { margin-bottom:1rem; }

	section.detail nav button { font-size:0.8rem; }

#page-blocs.vente .liste > ul > li { width:calc(100% / 3); }

#page-blocs.vente section.fiche > div { float:left; width:calc(50% + 1px); }
#page-blocs.vente section.fiche > div.infos { margin-bottom:4rem; }
#page-blocs.vente section.fiche > div.descriptif { float:right; padding-left:8rem; width:calc(50% - 1px); margin-bottom:4rem; }


	section.contact > div { padding:4rem calc(40% + 10% - 2rem) 4rem 10%; }
	section.contact form { padding:0; }
	section.contact form label, section.contact form fieldset > div, section.contact form > span { padding-right:2rem; }
	section.contact form button { left:calc(100% - 2rem); }

	section.contact label.nom, section.contact label.prenom, section.contact label.email, section.contact label.telephone { width:50%; }
	section.contact label.activite, section.contact label.date { width:50%; }
	section.contact label.cp { width:calc(100% / 3); }
	section.contact label.ville { width:calc(100% * 2 / 3); }

	section.contact label.immatriculation, section.contact label.marque, section.contact label.modele { width:calc(100% / 3); }

	section.contact aside.coordscontact { position:absolute; padding:4rem 5rem 4rem 8rem; right:0; top:-1px; bottom:0; width:40%; }
	section.contact aside.coordscontact h2 { padding-top:1em; }

}
/* AFFICHAGE TABLETTE et PETIT ECRAN */
@media (orientation:portrait) and (min-width:951px) and (max-width:1600px), (orientation:landscape) and (min-width:501px) and (max-width:1200px) {

	html { font-size:11px; font-size:1.1vw; }

	header { padding-top:calc(2 * 0.9rem); height:calc( (1.4 * 4.4rem) + (2 * 0.9rem) ); }
	main, aside.mosaic { padding-top:calc( (1.4 * 4.4rem) + (2 * 0.9rem) ); }

	a#logo { font-size:4.4rem; }
	aside#headercontact > span { font-size:0.9rem; }

	#home-slider.slider, #home-slider.slider.vente { padding-bottom:calc(100vh - ((1.4 * 4.4rem) + (2 * 0.9rem) )); }
	
	#home-activites ul li h2 { padding:0 1em; }

	#home-presentation > div:not(.parallaxe) { position:relative; padding:8rem 6% 8rem 36%; }
 
	section.bloc.half h2 { padding-top:4rem; }
	section.bloc h3 { font-size:1.4em; }
	#home-presentation p, section.bloc p, section.detail p { font-size:1em; }
	section.bloc button { margin-top:3rem; }

	section.pneus.bloc.half div.bloc-col:nth-of-type(1) { width:70%; }
	section.clim.bloc.half div.bloc-col:nth-of-type(1) { width:85%; }

	section.bloc.introcarrosserie div.bloc-col { width:65%; }

#page-blocs.vente .liste > ul > li { width:calc( 100% / 2); }
#page-blocs.vente .liste > ul > li a { font-size:1.2rem; }

#page-blocs.vente .engagements > ul > li { width:calc( (100% - (6 * 2em) ) / 3); padding-bottom:calc(60% / 3); margin:2em 2em 0 2em; }

#page-blocs.vente div.descriptif h3 { font-size:1.5rem; }
#page-blocs.vente div.descriptif h4 { font-size:1.2rem; }
#page-blocs.vente div.descriptif h5 { font-size:1.1rem; }
#page-blocs.vente div.descriptif > div.neuf { font-size:1.2rem; }
#page-blocs.vente div.descriptif > ul.entete > li { font-size:1.1rem; }
#page-blocs.vente div.descriptif > ul.line > li { font-size:1rem; }
#page-blocs.vente div.descriptif > ul.tag > li { font-size:1rem; }
#page-blocs.vente div.descriptif > ul.option > li { font-size:1rem; }


	footer .contact { font-size:1rem; }
	footer .coords { font-size:1.1rem; padding-right:10%; }
	footer .copyright { font-size:0.7rem; }

}
/* AFFICHAGE MOBILE */
@media (orientation:portrait) and (max-width:950px), (orientation:landscape) and (max-width:500px) {

body,
header nav button,
.slider ul li h2 span:nth-of-type(2),
#home-presentation h3,
section.bloc h3,
section.contact form h2 { font-weight:300; }

	html { font-size:24px; font-size:3vw; }

	.nosmartphone br { display: none; content: ' '; clear:none; }

	a#logo { font-size:5rem; }

	button#showhidemenu { top:3.5rem; right:3rem; width:3rem; height:3rem; }

	header { padding-top:0; height:calc( (1.4 * 5rem) ); }
	main, aside.mosaic { padding-top:calc( (1.4 * 5rem) ); }

	button#showhidemenu { top:1.5rem; width:3.5rem; height:3.5rem; }

	header nav > svg { height:12rem; width:auto; left:3rem; transform:none; }
	body.showmenu header nav:after { z-index:1120; content:''; position:fixed; background-color:rgba(45,45,45,1); top:0; height:15rem; left:0; width:100%; }
	body.showmenu header nav > svg { top:2rem; }

	header nav > ul { padding:0 2rem 5rem 2rem; top:15rem; }
	header nav > ul li { font-size:1.8rem; margin:0.8em 0; }
	header nav button { padding: 0.2em 0.8em; }
	header nav .copyright { font-size:1.1rem; display:inline-block; padding:0.8em 0 0.8em 1.2rem; }
	header nav .copyright span { padding-right:calc(1.2rem + 1px); margin-right:1.2rem; }

	aside#headercontact { bottom:0; text-align:center; padding-right:0; }
	aside#headercontact > span { font-size:1.4rem; margin-right:2.5em; }
	aside#headercontact span:nth-of-type(2) { margin-right:0; }
	aside#headercontact span:nth-of-type(3) { display:none; }
	.touchscroll aside#headercontact, .scroll aside#headercontact { display:none; }

	#preload p { width:50%; }
	#preload svg { max-width:80%; max-height:50%; }

	.slider ul li h2 { font-size:1.8rem; top:60%; padding:0 8%; }
	.slider ul li svg { top:24%; right:0; transform:translate(35%,-50%); height:17rem; }
	.slider ul li.diapo-vehicules-electriques img { transform:translateX(-10%); }

	#home-slider.slider { padding-bottom:calc(100vh - ( (1.4 * 5rem) + (2 * 0.8rem) ) ); }
	@keyframes motos {
		0% { top: 0%; left: -15%; width:105%; height:105%; }
		100% { top: -10%; left:-5%; width:110%; height:110%; }
	}

	#home-activites ul li, #home-activites ul li.vente { width:100%; padding-bottom:66.66%; }

	#home-presentation .parallaxe { height:10rem; }
	#home-presentation > div:not(.parallaxe) { position:relative; padding:0; }
	#home-presentation > div:not(.parallaxe) > svg, #home-presentation > div:not(.parallaxe) img  { display:none; }
	#home-presentation > div:not(.parallaxe) > div:not(.wrap) { font-size:1.4rem; padding:3rem 8%; text-align:center; }
	#home-presentation h2 { font-size:1.9em; margin-bottom:0.5em; }
	#home-presentation h2 span { display:none; }
	#home-presentation h3 { font-size:1.3em; margin-bottom:1.2em; }
	#home-presentation p { font-size:1em; text-align:center; }

	/* PAGES ACTIVITES */
	#page-slider.slider { padding-bottom:calc(100% / 1.5); }
	#page-slider.slider.vente { padding-bottom:calc(100% / 1.8); }

	section.bloc.ratio > div { overflow:visible; height:auto; padding-bottom:0 !important; }

	section.bloc div.bloc-col, section.bloc div.bloc-col:nth-of-type(1), section.bloc div.bloc-col:nth-of-type(2), section.detail { width:100%; padding-left:8%; padding-right:8%; }
	section.bloc h3 { font-size:1.7em; }
	section.bloc p, section.detail p { font-size:1.4em; padding-right:0; }
	section.bloc button { font-size:1.4em; }

	section.bloc.entretien .bloc-col:nth-of-type(2) { padding-bottom:calc(35vh + 4rem); }
	section.bloc.entretien .wrap { left:100%; top:100%; transform:translate(-100%, -100%); height:35vh; width:260%; }
	
	section.bloc.electriques .cover { transform:translate(-55%,-50%); }
	section.bloc.electriques h3 { z-index:3; }
	section.bloc.electriques div.bloc-col { z-index:4; }
	section.bloc.electriques p { z-index:4; color:rgba(255,255,255,1); }
	section.bloc.electriques button { color:rgba(255,255,255,1); border-color:rgba(255,255,255,0.6); }
	section.bloc.electriques > div:after { z-index:2; content:''; position:absolute; left:0; top:0; right:0; bottom:0; background:linear-gradient(30deg, rgba(0,0,0,0.9) 30%, rgba(0,0,0,0) 80%); }

	section.bloc.introcarrosserie .bloc-col:nth-of-type(1), section.bloc.introrestauration .bloc-col:nth-of-type(1) { padding-bottom:calc(35vh + 4rem); }
	section.bloc.introcarrosserie .wrap, section.bloc.introrestauration .wrap { left:100%; top:100%; transform:translate(-100%, -100%); height:35vh; width:260%; }

	section.bloc.tolerie .cover { transform:translate(-53%,-50%); }

	section.bloc.peinture .cover { transform:translate(-20%,-50%); }
	section.bloc.peinture h3 { z-index:3; }
	section.bloc.peinture div.bloc-col { z-index:4; }
	section.bloc.peinture p { z-index:4; }
	section.bloc.peinture > div:after { z-index:2; content:''; position:absolute; left:0; top:0; right:0; bottom:0; background:linear-gradient(30deg, rgba(255,255,255,0.9) 30%, rgba(255,255,255,0) 80%); }

	section.bloc.parebrise .cover { transform:translate(-55%,-50%); }

	#page-blocs.restauration section.bloc.half h2 { padding-top:3rem; }
	#page-blocs.restauration section.bloc.half div.bloc-col { padding-bottom:0; }

	section.detail h3 { font-size:2.4em; }

	aside.mosaic li { width:100%; padding-bottom:100%; }
	aside.mosaic li.paysage { width:100%; padding-bottom:calc(100% / 2); }
	aside.mosaic li.panoramic { width:100%; padding-bottom:calc(100% / 3); }

#page-blocs.vente h2 { font-size:2.2rem; }

#page-blocs.vente .liste > div { font-size:1.4rem; }
#page-blocs.vente .vide > div { font-size:1.4rem; }

#page-blocs.vente .liste > ul > li { padding:0; }
#page-blocs.vente .liste > ul > li a { font-size:1.5rem; padding:0; margin-bottom:3em; }

#page-blocs.vente .engagements h2 { font-size:2.2rem; width:100%; }
#page-blocs.vente .engagements > ul { margin-top:3rem; }
#page-blocs.vente .engagements > ul > li { width:100%; padding-bottom:65%; margin:3em 0 1em 0; font-size:1.2rem; }

#page-blocs.vente section.fiche > div { width:100%; }
#page-blocs.vente section.fiche > div.infos { margin:2rem 0 0 0; }
#page-blocs.vente .photos nav { font-size:1.2rem; }

#page-blocs.vente div.descriptif h3 { font-size:1.8rem; }
#page-blocs.vente div.descriptif h4 { font-size:1.5rem; }
#page-blocs.vente div.descriptif h5 { font-size:1.4rem; }
#page-blocs.vente div.descriptif > div.neuf { font-size:1.5rem; }
#page-blocs.vente div.descriptif > ul.entete > li { font-size:1.3rem; }
#page-blocs.vente div.descriptif > ul.line > li { font-size:1.2rem; }
#page-blocs.vente div.descriptif > ul.tag > li { font-size:1.2rem; }
#page-blocs.vente div.descriptif > ul.option > li { font-size:1.2rem; }

#page-blocs.vente div.descriptif > ul.line > li h5 { width:12em; }
#page-blocs.vente div.descriptif > ul.line > li span { width:calc(100% - 12em - 5px); }

#page-blocs.vente div.infos button { font-size:1.2rem; }


.iphone .scrollanim { transition:all 300ms linear 0ms; }
.iphone .scrollanim.fromleft.init { transform:translate(0,0); left:-100vw; }
.iphone .scrollanim.fromleft { transform:translate(0,0); left:0; }
.iphone .scrollanim.fromright.init { transform:translate(0,0); left:100vw; }
.iphone .scrollanim.fromright { transform:translate(0,0); left:0; }


	/* CONTACT */
	section.contact form { padding:4rem 7%; }
	section.contact form h2 { font-size:2rem; }
	section.contact label, section.contact fieldset > div { font-size:1.4rem; }
	section.contact span.asterisque { font-size:1.1rem; }
	section.contact form button { font-size:1.4rem; width:100%; margin-top:2em; }

	section.contact h2 { font-size:2.1rem; }
	section.contact aside.coordscontact { font-size:1.3rem; }

	section.contact aside.mapcontact > div { padding-bottom:140%; }

	/* FOOTER */
	footer { text-align:center; }

	footer .contact { position:relative; display:block; width:100%; left:0; top:0; }
	footer .contact button { font-size:1.8rem; padding:1em 0.5em; margin:0; border-radius:0; width:100%; background-color:rgb(0,165,225); color:rgba(255,255,255,1); border:0; }
	footer .contact span { display:none; }
	body.desktop footer .contact button:hover { background-color:rgb(0,165,225); color:rgba(255,255,255,1); }

	footer .coords { padding:1rem 1rem; font-size:1.2rem; }
	footer .coords > span { display:block; margin:1.5em 0; padding-left:0; }
	footer .coords > span > span { display:block; }
	footer .coords span.nom { font-size:2.4em; width:100%; padding-left:0; padding-bottom:0; margin-bottom:1em; }
	footer .coords span.adresse { font-size:1.6em; padding-top:0; padding-left:0; }
	footer .coords span.email { font-size:1.5em; padding-bottom:1em; }
	footer .coords span.tel { font-size:2.3em; padding-left:0; margin-left:0; }
	footer .coords span.tel:before { content:none; }

	footer .copyright { font-size:1.2rem; padding:1rem 1rem; text-align:center; }
	footer .copyright > span, footer .copyright > a { display:block; margin:1.5em 0; }
	footer .copyright > span:first-of-type { padding:0 1em 1em 1em; }
	footer .copyright > span:not(:first-of-type):before { content:none; }


	section#page-mentionslegales { font-size:0.9rem; }

section.section-auth { width:80%; margin:0 auto 4rem auto; }

}

/* AFFICHAGE MINI */
@media (max-width:300px) { 
	body { overflow-x:scroll; }
	html { font-size:9px; }
	#en2mots { width:300px; }
	header { width:300px; position:relative; }
	main { width:300px; margin-top:0 !important; }
	footer { width:300px; }
}