#load {display: none} .H #load {display:block; width:50px; height:auto; /*height:12.5px*/ position:fixed; z-index:1001; top:50%; margin-top:-6px; left:50%; margin-left:-25px;} html {font-size: 100%; height:100%; width:100%; -webkit-font-smoothing: antialiased;text-rendering: optimizeLegibility;overscroll-behavior: none; position: relative} /* @font-face {font-family:'LGC';font-style: normal;font-weight: 400; src: url('../index.html'); src: local(''), url('../index.html#iefix') format('embedded-opentype'), url('../index.html') format('woff2'), url('../index.html') format('woff'), url('../index.html') format('truetype'); }grostexte pagereduit ani @font-face {font-family:'LGC';font-style: normal;font-weight: 600; src: url('../index.html'); src: local(''), url('../index.html#iefix') format('embedded-opentype'), url('../index.html') format('woff2'), url('../index.html') format('woff'), url('../index.html') format('truetype'); } */ @font-face {font-family:'POP';font-style: normal;font-weight: 200; src: url('../Fontes/POP-200.eot'); src: local(''), url('../Fontes/POP-200-.eot#iefix') format('embedded-opentype'), url('../Fontes/POP-200.woff2') format('woff2'), url('../Fontes/POP-200.woff') format('woff'), url('../Fontes/POP-200.ttf') format('truetype'); } @font-face {font-family:'POP';font-style: normal;font-weight: 300; src: url('../Fontes/POP-300.eot'); src: local(''), url('../Fontes/POP-300-.eot#iefix') format('embedded-opentype'), url('../Fontes/POP-300.woff2') format('woff2'), url('../Fontes/POP-300.woff') format('woff'), url('../Fontes/POP-300.ttf') format('truetype'); } @font-face {font-family:'POP';font-style: normal;font-weight: 400; src: url('../Fontes/POP-400.eot'); src: local(''), url('../Fontes/POP-400-.eot#iefix') format('embedded-opentype'), url('../Fontes/POP-400.woff2') format('woff2'), url('../Fontes/POP-400.woff') format('woff'), url('../Fontes/POP-400.ttf') format('truetype'); } @font-face {font-family:'POP';font-style: normal;font-weight: 500; src: url('../Fontes/POP-500.eot'); src: local(''), url('../Fontes/POP-500-.eot#iefix') format('embedded-opentype'), url('../Fontes/POP-500.woff2') format('woff2'), url('../Fontes/POP-500.woff') format('woff'), url('../Fontes/POP-500.ttf') format('truetype'); } @font-face {font-family:'POP';font-style: normal;font-weight: 600; src: url('../Fontes/POP-600.eot'); src: local(''), url('../Fontes/POP-600-.eot#iefix') format('embedded-opentype'), url('../Fontes/POP-600.woff2') format('woff2'), url('../Fontes/POP-600.woff') format('woff'), url('../Fontes/POP-600.ttf') format('truetype'); } @font-face {font-family:'JS';font-style: normal;font-weight: 300; src: url('../index.html'); src: local(''), url('../index.html#iefix') format('embedded-opentype'), url('../Fontes/JS-300.woff2') format('woff2'), url('../Fontes/JS-300.woff') format('woff'), url('../Fontes/JS-300.ttf') format('truetype'); } @font-face {font-family:'JS';font-style: normal;font-weight: 400; src: url('../Fontes/JS-400.eot'); src: local(''), url('../Fontes/JS-400-.eot#iefix') format('embedded-opentype'), url('../Fontes/JS-400.woff2') format('woff2'), url('../Fontes/JS-400.woff') format('woff'), url('../Fontes/JS-400.ttf') format('truetype'); } @font-face {font-family:'JS';font-style: normal;font-weight: 500; src: url('../Fontes/JS-500.eot'); src: local(''), url('../Fontes/JS-500-.eot#iefix') format('embedded-opentype'), url('../Fontes/JS-500.woff2') format('woff2'), url('../Fontes/JS-500.woff') format('woff'), url('../Fontes/JS-500.ttf') format('truetype'); } /* Frutiger Arabic custom font */ @font-face { font-family: 'FrutigerLTArabic'; font-style: normal; font-weight: 400; src: url('../Fontes/FrutigerLTArabic-55Roman.eot'); src: local(''), url('../Fontes/FrutigerLTArabic-55Roman.eot?#iefix') format('embedded-opentype'), url('../Fontes/FrutigerLTArabic-55Roman.woff2') format('woff2'), url('../Fontes/FrutigerLTArabic-55Roman.woff') format('woff'), url('../Fontes/FrutigerLTArabic-55Roman.ttf') format('truetype'); } body {/*font-size: 1em;*/ color:#000; font-family:'POP', sans-serif; margin:0; font-weight:400; height:100%; width:100%; position:relative; background-color:#f6f6f6; -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; font-variant-ligatures: no-common-ligatures;} body {font-size: 1.3em;} @media screen and (max-width: 2300px) { body {font-size: 1.2em} } @media screen and (max-width: 2100px) { body {font-size: 1.1em} } @media screen and (max-width: 1950px) { body {font-size: 1em} } * { outline: none;} .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} .retMob { display: none} .js{ font-family:'JS' } img {display:block} a img {border:none} a {outline:none; border:none; text-decoration:none} ul, li {margin:0; padding:0; list-style:none} h1, h2, h3, h4 {padding:0; margin:0; font-size:1em; font-weight:normal; line-height:1.1em} sup {font-size: 0.55em; line-height: 1em} svg {width: 100%; height: 100%; display: block} /*::-moz-selection, ::selection { background:#00949a}*/ #testeur {position:fixed; z-index:9999; bottom:0; right:0; padding:7px; font-size:0.8em; letter-spacing:0.1em; /*display:inline-block;*/ font-family: sans-serif; color:#FFF; opacity:0.6; background-color: #000000; display:none} #MOB {display:none} #MOB2 {display:none} #MOB3 {display: none} .brmob3 {display: none} .calExt{} .cal {position: absolute; top:0; left:0; width: 100%} .H .cal {width: auto; height: auto} .calExt2{} .cal2 {position: absolute; top:0; left:0; width: 100%} .H .cal2 {width: auto; height: auto} .calExt2HB{} .cal2HB {position: absolute; top:0; left:0; width: 100%} .H .cal2HB {width: auto; height: auto} .Texteselect {-webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} .H .ano0 {visibility: hidden} .H .anSX1 {transform-origin:0 0 } .H .anSX2 {transform-origin:0 0 } .H .anS1 {transform-origin:50% 50% } .H .anS2 {visibility: hidden; transform-origin:50% 50% } .H .anS3 {visibility: hidden; transform-origin:50% 50% } .H .anyMini {visibility: hidden; transform-origin: 0 0} .H .any1, .H .any2, .H .ani {visibility: hidden; transform-origin: 50% 50% } .H .anyA, .H .anyB, .H .anyC, .H .anyD {visibility: hidden; transform-origin: 50% 50% } .H .anCL0 {overflow: hidden; position: relative; transform-origin: 0 0} .H .anCL1 {overflow: hidden; position: relative; transform-origin: 0 0} /* anim */ .H .anT, .H .anB, .H .anC li, .H .anC2 li {visibility:hidden} .coulIci01{fill:#BF1931;} .coulIci02{fill:#383838;} .coulIci03{fill:#000;} .coulIci04{fill:#fff;} #remonte {width:46px; height:46px; background-color:#fff; position:fixed; bottom:0px; right:40px; z-index:1200; visibility:hidden; overflow:hidden; cursor:pointer; } #remonte img {width:22px; position:absolute; top:50%; left:50%; margin-left:-11px; margin-top:-11px; display:block;transform-origin: 50% 50%;} .H #remonte {visibility: hidden} #call {width: auto; display: inline-block; padding:1em 1.6em; position: fixed; bottom: 0; right: 40px; z-index: 1200; visibility: hidden; cursor: pointer; background-color: #FFFFFF} #call a {color: #222222; font-weight: 400; font-size: 1em; padding-left:1.7em; display: inline-block; position: relative} #call a b { position: absolute; top: 50%; left:0; width: 1.2em; height: 1.2em; margin-top: -0.6em; display: block; font-weight: normal} #menu {width:80px; height:80px; position:fixed; top:10px; right:40px; z-index:9999; cursor:pointer; overflow:hidden;transform-origin:0% 0%; visibility: hidden} #menu i,#menu b {width:20px; height:2px; top:50%; left:50%; z-index:920; display:block; position:absolute; margin-left:-10px;} #menu i {background-color:#e2aa21; transform-origin: 0 0} #menu b { visibility:hidden; transform-origin: 100% 100%;} #t1, #t1b { margin-top:-7px} #t2, #t2b {margin-top:-1px} #t3, #t3b {margin-top:5px} #menu div {width:100%; height:100%; position:absolute; top:0; left:0;background-color:#e2aa21; z-index:918; transform-origin: 100% 100%;} #menu #fermer {width:80px; height:80px; display:block; position:absolute; top:0; left:0; z-index:930; background-color:#eeeeee; visibility: hidden} #fermer b {width:26px;height:2px;background-color:#000;transform-origin:50% 50%; position: absolute; top:39px; left:27px;display: block; margin:0;} .H #menu {visibility:hidden} .navigation {width:100%; height:auto; position:relative; left:0; background-color: #FFFFFF; z-index: 9998} .H .navigation {width:100%; height: 100%; position: fixed; left:102%; bottom: 0; z-index:9998; overflow:hidden; transform-origin:0 0; background-color: #FFFFFF} /*.H .navigation {left:0%} .navigation .fondnav {display: none} .H .navigation .fondnav {display:block; position:absolute; z-index:900; top:50%; left:50%; width: auto; height: auto}*/ .navigationInt {width:100%; height:600px; padding-top: 150px; position: relative; z-index:902; /*background-color:#BF4446 */} .H .navigationInt {height:100%; padding-top: 0} #navvisu {width:26.3%; height: 80%; position: absolute; top:10%; left:4%; transform-origin:0 0} #navvisuINT {position: relative; width: 100%; height: 100%; overflow: hidden} #navvisu img {position: absolute; top: 50%; left: 50%; width: auto} #navcontenu {width:59%; float:right} .navcontG {width:28%; float: left; position: relative; z-index: 20} .navcontG ul li {display: block} .navcontG ul li a {display:inline-block; position: relative; color:#000; font-size: 1.75em; line-height: 1.45em; padding: 0.3em 0; font-weight:300; letter-spacing: 0.02em} .navcontG ul li a i {position: absolute; bottom: 0.25em; left: 0; width:0%; display: block; background-color: #bf1931; height: 2px} .navcontG ul li a.NAVactif i {width: 100%} .navcontD {width:72%; float: right; position: relative; z-index: 21} .colnavcont {float: left; display: inline-block; position: relative; padding-left:1.2em; padding-right: 3.6em; margin-top:0.5em} .colnavcont .lignenavcont {position: absolute; top: 0; left: 0; height: 100%; width: 1px; background-color: #c3c3c3; transform-origin: 0 0} .colnavcont li {display: block} .colnavcont li a {display:inline-block; position: relative; color:#000; font-size:1em; line-height: 1.45em; padding: 0.4em 0; font-weight:300; letter-spacing: 0.03em} .colnavcont li a i {position: absolute; bottom: 0.2em; left: 0; width:0%; display: block; background-color: #bf1931; height: 1px} .colnavcont li a.NAVactif i {position: absolute; bottom: 0.2em; left: 0; width:100%; display: block; background-color: #bf1931; height: 1px} #liennavcont {margin-top: 6.8em} #liennavcont a{color:#bf1931; font-size:2.5em; font-weight: 300; letter-spacing: 0.03em; line-height: 1.45em; display: inline-block; position: relative; overflow:hidden} #liennavcont a b {position: relative; display: inline-block;transform-origin: 0 0; font-weight: 300; line-height: 1.45em} #liennavcont a i {position: absolute; bottom: 0em; left: 0; width:0; display: block; height: 2px;background-color: #bf1931;} .navlangue {position: absolute; top:10%; left:41%; z-index: 50; display: none} .navlangue a {width:2.7em; height:2.7em; display: inline-block; position: relative; border-radius: 50%; transform-origin: 50% 50%; background-color: #fff; margin-left: 0.2em} .navlangue a span {position: absolute; top: 50%; margin-top: -0.6em; font-size: 1em; line-height: 1.2em; text-align: center; display: block; left: 0; width: 100%; color:#000; transform-origin: 50% 50%} .navlangue a.navlangactif {background-color: #bf1931; } .navlangue a.navlangactif span {color: #fff} .navcontmentions {position:absolute; bottom:2em; right:2.5em; color:#d2d2d2; font-size:0.85em; letter-spacing:0.03em; font-weight:400; text-align:right; display:block; line-height: 1.8em} .navcontmentions a {color:#6C6C6C; text-decoration:none;} .navcontmentions a:hover {color:#363636; text-decoration:none} /* Accueil NEW*/ #introAcc-logo {width:290px; position:fixed; top:17px; margin-left:0; left:2rem; display:block; z-index:903} #introAcc-logo img {width:100%; transform-origin: 0 0; top:0 !important;} .H #introAcc-logo {visibility:hidden} #introAcc-bandeau { position: fixed; top: 0; left: 0; width: 100%; height:100px; z-index: 902; background-color: #f7f7f7; transform-origin: 0 0} .menu-fix{height: 100px;} .H #introAcc-bandeau {visibility: hidden} .cal2A {position:relative; top:0; left:0; width: 100%} .calExt2A{} .H .cal2A {position: absolute; top:0; left:0; width: 100%} .H .cal2A {width: auto; height: auto} #introAcc-conteneurExt {top: 0; left: 0; width: 100%; height:auto; min-height: 320px; z-index: 800} .H #introAcc-conteneurExt {position: fixed; height: 100%} #introAcc-conteneur {width: 100%; height:auto; position: relative; overflow: hidden; z-index:801} .H #introAcc-conteneur {height: 100%} #introAcc-photo { transform-origin: 50% 50%; z-index: 798} .H #introAcc-photo {visibility: hidden} #introAcc-video { transform-origin: 50% 50%; z-index: 799} .H #introAcc-video {visibility: hidden} #btS1 { border:solid 2px #fff; width:16px; border-radius:16px; height:28px; bottom:60px; left:50%; margin-left:-10px; position:absolute; z-index:903} #btS2 { background-color:#FFF; width:2px; border-radius:2px; height:6px; bottom:70px; left:50%; margin-left:-1px; position:absolute; z-index:903} #btS3 {width:200px; display:inline-block; color:#fff; text-align:center; position:absolute; bottom:30px; left:50%; margin-left:-100px; font-size:0.9em; letter-spacing:0.04em; z-index:902; font-weight:400} .H #btS1, .H #btS2, .H #btS3 {visibility:hidden} .H #introAcc-suite1 {width: 100%; height:100%; min-height: 320px; position: relative} .H #introAcc-suite2 {width: 100%; height:20%; position: relative} .H #introAcc-suite3 {width: 100%; height:70%; position: relative} #PageComplete {position: relative; z-index:950; width: 100%; height: auto; overflow: hidden} .H #PageComplete {visibility:hidden; } #introAcc-texte { position:relative; background-color:#f6f6f6; z-index:951; padding-top:17em; padding-bottom:200px } #accueil { position:relative; background-color:#f6f6f6; z-index:952} .textecentre {width:962px; margin:0 auto} @media screen and (max-width: 2300px) { .textecentre {width:888px} } @media screen and (max-width: 2100px) { .textecentre {width:814px} } @media screen and (max-width: 1950px) { .textecentre {width:740px} } .textecentre h1 { font-size: 1.5em; font-weight:400; color:#000; display:block; text-align:center; letter-spacing:0.065em; margin:0; padding:0} .textecentre h1 i {color:#707070; display:block; font-style:normal; font-size:0.55em; letter-spacing:0.14em; text-transform:uppercase; font-weight:400; padding-top:1em} .textecentre h1 i sup {font-size:0.5em} .textecentre p {font-weight:300; color:#696969; text-align:justify; padding-top:3em; line-height:2.3em; letter-spacing:0.02em; text-align-last: center; font-size: 1.2em; margin:0} .textecentre img {width: 100%; max-width: 740px; margin:3em auto 0 auto; display: block} #accueil .galeriemini {width:71%; margin-left:auto; margin-right:auto; /*padding-top:15em;*/ position:relative} #accueil .margehB {padding-top:5em} .titreaccueil { display:inline-block; position:absolute; top:0; font-family:'JS', sans-serif; font-weight:400; left:1.2em; z-index:800; text-transform:uppercase; letter-spacing:0.04em; color:#000} .titreaccueil span {font-size:4.2em;line-height:1.2em; } #accueil .margeh0 {padding-top:5em} .margeh0 .titreaccueil {margin-top:2.3em} #accueil .margehA {padding-top:5em} .margehA .titreaccueil {margin-top:3em} .gde {width:100%} .H .gde {width:20%} #accueil .gde {position:relative; overflow:hidden; z-index:600; margin-right:55px; } .H .galG .gde {float:left} .H .galD .gde {float:right} .gde img {width: 100%} .H .gde img {position:absolute; top:0; left:0; width:100%} .gde .der { display:none} .H .gde .der {position:relative; width:100%; display:block; visibility:hidden} .pet {width:auto; margin-top:100px} .H .pet {width:40%; margin:0; padding:0} .H .galG .pet {float:right} .H .galD .pet {float:left} .pet li {float:left; width:50%; display:block; margin:0; padding:0} .pet li a {display:block; width:100%; height: 100%; position:relative; text-decoration:none} .pet li a i {display:block; width:100%; height:auto; position:relative; overflow:hidden} .pet li a i img { position:relative; display:block; width:100%; transform-origin: 50% 50%;} /*.H .pet li a i img {position:absolute; top:0; left:0;}*/ .pet li a span {position:relative;} .H .pet li a span {position:absolute; top:0;} #accueil .pet li a span {margin-top:10px; display:inline-block; color:#4f4f4f; font-size:0.85em; text-transform:uppercase; letter-spacing:0.09em; padding-bottom:2px; line-height: 1.3em} .pet li a span b { background-color:#bf1931; height:2px; width:0; position:absolute; bottom:0; left:0} .liensousgal { display:inline-block; float:right; font-size:2em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; line-height:1.2em; padding-right:1.6em; color:#000; position: relative; margin-top: 0em; padding-bottom: 0.5em; padding-top: 0.5em} .liensousgal span { display:inline-block; position:relative} .liensousgal i {width:100%; height:2px; background-color:#bf1931; position:absolute; bottom:0; left:0; transform-origin: 0 0; display: block} .liensousgal b { display:block; position:absolute; right: 0; top:50%; margin-top:-0.3em; width: 0.5em; height: 0.5em; transform-origin: 50% 50%} .actus {width:71%; margin-left:auto; margin-right:auto; /*padding-top:15em;*/ position:relative; overflow:visible} .actusint {width:100%; height:auto; position:relative; z-index:10; overflow:hidden} .actusint b {position:absolute; top:0; left:0; width:100%; height:100%; z-index:15; cursor:pointer} .actusint img {position:relative; top:0; left:0; width:100%; z-index:10} .H .actusint img {position:absolute} .actusint .der {display: none} .H .actusint .der {position:relative; width:100%; display:block; visibility:hidden} .actusint p { margin-top: 100px} .H .actusint p { display:inline-block; z-index:12; position:absolute; top:50%; left:50%; margin-top:-100px; margin-left:-300px; background-color: rgba(255, 255, 255, 0.9); padding:2em 2.4em; letter-spacing:0.05em; text-align:center} .actusint p strong { display:inline-block; color:#000; font-size:1.6em; font-weight:400; padding-bottom:0.2em;font-family:'JS', sans-serif; text-transform: uppercase; line-height: 1.3em} .actusint p span{ display:inline-block; color:#595959; font-size:1.1em; font-weight:300;} .actusint div {} .H .actusint div { display:inline-block; z-index:30; position:absolute; bottom:5px; right:5px;letter-spacing:0.05em} .actusint div a, .actusint div span {display:inline-block; float:left; background-color: rgba(255, 255, 255, 0.93); margin-right:1px; padding:1.2em 2.4em 1.2em 4.5em; font-size:0.8em; color:#4b4b4b; cursor:pointer; position: relative} .actusint div a i, .actusint div span i { display:block; position:absolute; left: 1.2em; top:50%; margin-top:-1.1em; width: 2.2em; height: 2.2em; transform-origin: 50% 50%} .flaccueil {width:70px; height:70px; display:block; position:absolute; bottom:50%; right:0; margin-bottom:-35px; margin-right:-100px; cursor:pointer; transform-origin: 50% 50%} /*.sansmargefl {margin-bottom:-62px;} /*-35 -55/2*/ #extraits {width:71%; margin-left:auto; margin-right:auto} .extraitsint {display:block; width:80%; margin:0 auto; padding-top:12em; padding-bottom:15em;} .H .extraitsint {display:none} #extraits h2 {font-size:2.4em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:0.05em; line-height:1.2em; color:#000} #extraits h3 {font-size:1.6em; font-family:'JS', sans-serif; font-weight:300; text-transform:uppercase; letter-spacing:0.05em; line-height:1.2em; color:#565656; padding-top:0.4em} #extraits p {margin:0; font-size:0.95em; text-align:justify; font-weight:300; padding-top:2em; letter-spacing:0.045em; line-height:2.2em; display:block; color:#303030; overflow:visible; position:relative; float:left; width:43%; margin-right:7%} #extraits p a {color:#000; text-decoration:underline} #extraits p a:hover {color:#333; text-decoration:none} .votreprojet {width:71%; margin-left:auto; margin-right:auto; position:relative} .votreprojetint {width:100%; margin:0; padding:0; list-style:none} .votreprojet li {width:200px; float:left; display:block; margin:0; padding:0; margin-right:55px;} .H .votreprojet li {width:25%} .votreprojet .sansmproj {margin-right:0} .votreprojet li a {display:block; width:100%; height: 100%; position:relative; text-decoration:none} .votreprojet li a i {display:block; width:100%; height:auto; position:relative; overflow:hidden} .votreprojet li a i img {display:block; width:100%; position:relative; transform-origin: 50% 50%;} .votreprojet li a span {position:relative} .H .votreprojet li a span {position:absolute; top:0} .votreprojet li a span {margin-top:10px; display:inline-block; color:#4f4f4f; font-size:0.85em; text-transform:uppercase; letter-spacing:0.09em; padding-bottom:2px;} .votreprojet li a span b { background-color:#000; height:2px; width:0; position:absolute; bottom:0; left:0} .soustitreaccueil { display:block; text-align:center; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; padding-top:5em} .soustitreaccueil span {font-size:2.5em;letter-spacing:0.05em; line-height:1.2em} .marques {width:71%; margin-left:auto; margin-right:auto; padding-top:7em; position:relative;} .marquesgde {width:40%} .H .marquesgde {width:20%} .marquesgde {float:left; position:relative; margin-right:55px; overflow:hidden; z-index:600; background-color:#fff} .marquesgde img {position:relative; width:100%; top:0; left:0; transform-origin: 50% 50%;} .marquespet {float:right; width:40%; margin:0; padding:0} .marquespet li {float:left; width:50%; display:block; margin:0; padding:0} .marquespet li a {display:block; width:100%; position:relative; text-decoration:none; background-color:#fff} .marquespet li a i {display:block; width:100%; height:100%; position:relative; overflow:hidden} .marquespet li a i img {position:relative; display:block; width:100%; top:0; left:0;transform-origin: 50% 50%;} .process {width:71%; margin-left:auto; margin-right:auto; padding-top:5em; padding-bottom:10em; position:relative} .titreprocess { display:block; text-align:left; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase} .titreprocess span {font-size:4.2em;letter-spacing:0.03em; line-height:1.2em; display: inline-block; overflow: hidden} .titreprocess span b {display: inline-block; position: relative; transform-origin: 0 0; font-weight: 400; line-height: 1.3em} .listeprocess {width: 100%; display: block; margin-top: 4.4em} .listeprocess li {width: 100%; display: block; position: relative; padding:1.6em 0 2.4em 0} .proc-ligne {width: 100%; height: 1px; background-color: #000; top: 0; left: 0; position: absolute} .proc-ligneDER {width: 100%; height: 1px; background-color: #000; bottom: 0; left: 0; position: absolute} .proc-ico {width: 3.5em; height: 3.5em; display: block;border-radius: 50%; border:1px solid #dfdfdf; position:absolute; top: 1.6em; left: 0;} .proc-ico div {width: 100%; height: 100%; position: relative} .proc-ico b {width:50%; height:50%; position: absolute; top: 25%; left: 25%; transform-origin: 50% 50%} .proc-titre {width: 35%; float: left; padding-left:10%; padding-top: 1em; overflow: visible} .proc-titre h3 {font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; font-size: 1.4em; line-height: 1.4em} .proc-desc {width: 46%; float: right; margin-right:2.6%} .proc-desc p {color:#6C6C6C; font-size: 0.95em; line-height:1.8em} .showrooms {width:71%; margin-left:auto; margin-right:auto; padding-top:15em; position:relative} .titreshowrooms { display:block; text-align:left; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase} .titreshowrooms span {font-size:3em;letter-spacing:0.03em; line-height:1.2em; display: inline-block; overflow: hidden} .listeshowrooms {width: 100%; display: block; margin-top: 4.4em} .listeshowrooms li {width: 100%; display: block; position: relative; padding:1.6em 0 2.4em 0} .showrooms-ligne {width: 100%; height: 1px; background-color: #000; top: 0; left: 0; position: absolute} .showrooms-ligneDER {width: 100%; height: 1px; background-color: #000; bottom: 0; left: 0; position: absolute} .showrooms-titre {float:none; display: block; padding:3em 0; overflow: visible; } .showrooms-titre h3 {font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; font-size: 2.1em; line-height: 1.4em} .showrooms-titre span {font-weight:400; font-size: 1.2em; color: #9B9B9B; padding-top: 0.7em; display: inline-block} .showrooms-desc {float:none;display: block; } .showrooms-desc iframe {width:100%; border:none; border:0; min-height:800px} .showrooms-desc img {width:100%; display: block} /* bas */ #bas {width:71%; margin:3em auto 0 auto; max-width: 1650px } #logobas {width:290px; margin:0 auto; display:block; z-index:903} #logobas img {width:100%; transform-origin: 0 0;} .basint {width: 100%; height: auto; position: relative; margin-top:3.5em} .baslangue {position: absolute; top:0.5em; right: 0; z-index: 50; display: none} .baslangue a {width:2.7em; height:2.7em; display: inline-block; position: relative; border-radius: 50%; transform-origin: 50% 50%; background-color: #f6f6f6; margin-left: 0.2em} .baslangue a span {position: absolute; top: 50%; margin-top: -0.6em; font-size: 1em; line-height: 1.2em; text-align: center; display: block; left: 0; width: 100%; color:#000; transform-origin: 50% 50%} .baslangue a.langactif {background-color: #bf1931; } .baslangue a.langactif span {color: #fff} .basG {width:31.8%; /*display: inline-block;*/ padding-left:6%; float: left; position: relative; z-index: 20} .basG ul li {display: block} .basG ul li a {display:inline-block; position: relative; color:#000; font-size: 1.75em; line-height: 1.45em; padding: 0.3em 0; font-weight:300; letter-spacing: 0.02em} .basG ul li a i {position: absolute; bottom: 0.25em; left: 0; width:0%; display: block; background-color: #bf1931; height: 2px} .basG ul li a.basactif i {width: 100%} .basD {width:62%; float: right; position: relative; z-index: 21} .colbas {float: left; display: inline-block; position: relative; padding-left:1.2em; padding-right: 3.6em; margin-top:0.5em} .colbas .lignebas {position: absolute; top: 0; left: 0; height: 100%; width: 1px; background-color: #c3c3c3; transform-origin: 0 0} .colbas li {display: block} .colbas li a {display:inline-block; position: relative; color:#000; font-size:1em; line-height: 1.45em; padding: 0.4em 0; font-weight:300; letter-spacing: 0.03em} .colbas li a i {position: absolute; bottom: 0.2em; left: 0; width:0%; display: block; background-color: #bf1931; height: 1px} .colbas li a.basactif i {position: absolute; bottom: 0.2em; left: 0; width:100%; display: block; background-color: #bf1931; height: 1px} #lienbas {margin-top: 6.8em} #lienbas a{color:#bf1931; font-size:2.5em; font-weight: 300; letter-spacing: 0.03em; line-height: 1.45em; display: inline-block; position: relative; overflow:hidden} #lienbas a b {position: relative; display: inline-block;transform-origin: 0 0; font-weight: 300; line-height: 1.45em} #lienbas a i {position: absolute; bottom: 0em; left: 0; width:0; display: block; height: 2px;background-color: #bf1931;} .mentions {position:relative; padding:4em 0 3em 0; color:#d2d2d2; font-size:0.85em; letter-spacing:0.03em; font-weight:400; text-align:center; width:100%; display:block; line-height: 1.8em} .mentions a {color:#6C6C6C; text-decoration:none} .mentions a:hover {color:#363636; text-decoration:none} /*page int*/ #logoint {width:290px; margin:0 auto 0 auto; padding-top:47px; display:block; z-index:903} #logoint img {width:100%} .H #logoint {visibility:hidden} /*reas*/ #realisations { position:relative; background-color:#f6f6f6; z-index:1000; padding-top:10em} #realisations .galeriemini {width:85%;/*width:92%;*/ margin-left:auto; margin-right:auto; margin-top:0; position:relative;} #realisations .margehA {padding-top:13em} #realisations .gde {position:relative; overflow:hidden; z-index:600;margin-right:70px; } #realisations .pet li a span {margin-top:10px; display:inline-block; color:#4f4f4f; font-size:1.1em; text-transform:uppercase; letter-spacing:0.09em; padding-bottom:2px; font-weight:400} .titrereas { display:inline-block; position:absolute; top:0; left:1.7em; z-index:800; text-transform:uppercase; letter-spacing:normal; margin-top:-5em; color:#2c2c2c; pointer-events:none; padding-top:1.6em} .titrereas span { position: relative; display: inline-block; overflow: hidden; line-height: 1.3em; font-size:4.2em; font-family:'JS', sans-serif; font-weight:400; padding:0.1em 0} .titrereas span b {position: relative; display: inline-block; font-weight: 400; line-height: 1.3em} .titrereas i {display:block; width:4em; background-color:#2c2c2c; height:2px; position:absolute; top:0px; left:0; transform-origin: 0 0;} .H .titrereas b, .titrereas i {visibility:hidden} .titrereas sup {font-size: 0.5em} .Projetsuite {width: 100%; text-align: center; overflow: hidden; position: relative; margin-top: 10em; margin-bottom: 8em} .Projetsuite strong { background-color: #bf1931; color:#fff; letter-spacing: 0.3em; text-transform: uppercase; font-size:0.9em; padding: 0.5em 1.2em; display:inline-block; font-weight:300; line-height: 1.4em} .Projetsuite span {color:#000; font-size:2.4em; font-weight:300; line-height: 1.5em; letter-spacing: 0.04em; display: inline-block; padding-top: 0.8em} .lienProjetsuite {display: inline-block; color:#000; position: relative; padding-bottom: 0.05em} .lienProjetsuite i {position: absolute; display: block; left:0; bottom: 0; height:2px; background-color: #bf1931; width:100%; z-index: 20; transform-origin: 50% 50%} /* projet */ #projet {width:100%; padding-top:10em; position:relative; z-index:20} #projet h2 { position:relative; display:block; margin:0; margin-left:16%; font-size:4.3em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.4em; color:#2c2c2c; padding-top:0.4em} #projet h2 sup {font-size:0.6em; padding-left:0.2em} #projet h2 i {display:block; width:1.5em; background-color:#2c2c2c; height:2px; position:absolute; top:0; left:0; transform-origin: 0 0;} #projet h1 { margin:0; display:block; margin-left:16%; font-size:1.4em; font-weight:300; letter-spacing:0.04em; line-height:1.4em; color:#474747;padding-top:0.4em} #projet #i0 {width:84%; margin-left:16%; display:block; margin-top:6em} .H #projet h2, .H #projet h1, .H #projet #i0 {visibility:hidden} #projet .i1 {width:84%; margin-left:16%; display:block; margin-top:8em} #projet .i2 {width:100%; display:block; margin-top:15em} #projet .i3 {width:84%; display:block; margin-right:16%; margin-top:10em} #projet .icentre {width:68%; display:block; margin:13em auto 0 auto} #projet .ibis1 {width:34%; display:block; margin-left:16%; margin-top:13em} #projet .ibis2 {width:34%; display:block; margin-left:50%; margin-top:0px} #projet .desc {width:40%; margin-top:14em; margin-left:auto; margin-right:auto; color:#2c2c2c; letter-spacing:0.025em} #projet .desc h3 {font-size:2.2em; font-weight:300; line-height:1.5em} #projet .desc p {font-size:1.15em; line-height:2em; text-align:justify; font-weight:300; margin-top:3em} #projet .desc p a {color:#000; text-decoration:underline} #projet .desc p a:hover {color:#999; text-decoration:none} #projet .archi {width:70%; margin-left:30%; margin-top:6em; padding-bottom:6em; color:#2c2c2c; letter-spacing:0.025em} #projet .archi img {width:160px; margin-right:55px; float:left; display:block} #projet .archint {width:70%; float:left;} #projet .archint p {font-size:1.3em; line-height:1.7em; padding-top:30px; display:block; margin:0; font-weight:300} #projet .archint strong {font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.4em; font-size:1.4em; padding-top:15px; display:block; letter-spacing:0.03em} #projet .archint a {font-size:1.3em; line-height:1.4em; padding-top:0px; display:block; color:#949494; font-weight:300; text-decoration:underline} #projet .archint a:hover {color:#666666; text-decoration:none} #projet #similaire {width:72%; margin-left:auto; margin-right:auto; margin-top:13em} #projet #similaire h4 { display:block; text-align:center; font-size:2em; letter-spacing:0.025em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; line-height:1.4em; color:#000000; padding-bottom:2em} #projet #similaire ul { display:block;} #projet #similaire ul li { display:block; width:30%; float:left; margin-right:5%} #projet #similaire ul .der {margin-right:0} #projet #similaire li a { display:block; width:100%; position:relative; overflow:hidden; border-style:solid; border-color:#fff; border-width:0px; padding:12px;} #projet #similaire li a img { display:block; width:100%;transform-origin: 50% 50%;} #projet #suite {width:60%; margin-left:auto; margin-right:auto; margin-top:8em;} #suitea {width:50%; float:left; position:relative; overflow:hidden; background-color:#FFF; color:#000; text-align:left; height:248px; display: block} #suiteb {width:50%; float:left; position:relative; overflow:hidden; background-color:#000000; color:#fff; text-align:right; height:248px; display: block} #suite span {font-size:1.6em; background-size:40px; padding-top:22px; padding-bottom:18px; background-repeat:no-repeat;letter-spacing:0.045em; position:relative; z-index:30; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; display:inline-block} #suitea span {margin-left:70px; background-image:url("../Images/fl2miniG.png");background-position:0 50%; padding-left:60px;} #suiteb span {margin-right:70px; background-image:url("../Images/fl2miniDblanc.png"); background-position:100% 50%; padding-right:60px;} #suiteb img {position:absolute; top:50%; left:50%; width:auto; height:auto; margin-left:-750px; margin-top:-750px; z-index:28; opacity:0.5} #precsuiv {position:fixed; bottom:40px; left:40px} #precsuiv a {float:left; width:64px; display:block; cursor:pointer} #prec {background-color: rgba(36, 36, 36, 0.8); margin-right:1px} #suiv {background-color: rgba(36, 36, 36, 0.4);} #precsuiv img {width:100%; display:block; transform-origin: 50% 50%;} .H #prec, .H #suiv {visibility:hidden} #mot {display:block; font-size:27em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.4em; color:#2c2c2c; opacity:0.8; padding-top:2px; z-index:500; position:fixed; pointer-events:none; -webkit-mix-blend-mode:color-burn; -moz-mix-blend-mode:color-burn; -o-mix-blend-mode:color-burn; -ms-mix-blend-mode: color-burn; mix-blend-mode:color-burn} #mot sup {font-size:0.6em; padding-left:5px} #mot i { display:block; font-style:normal; position:fixed; top:0px; left:0px; z-index:500; visibility:hidden;pointer-events:none;} /* marques */ #marques {width:100%; padding-top:8em; position:relative; z-index:20} #intromarques {width:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; overflow:hidden; background-color:#000; position: relative} .H #intromarques {visibility:hidden} #intromarques .visuintromarques {z-index: 10} #interieurintro {margin-left:7%; padding-top: 3em; padding-bottom:10em; width:70%; position: relative; z-index: 11} #interieurintro h1 { position:relative; display:block; margin:0; font-size:2.9em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.4em; color:#fff; padding-top:0.8em} #interieurintro h1 i {display:block; width:2.3em; background-color:#fff; height:2px; position:absolute; top:0; left:0; transform-origin: 0 0;} #interieurintro p { margin:0; display:block; font-size:1.25em; font-weight:300; letter-spacing:0.04em; line-height:1.7em; color:#fff;padding-top:0.5em} #interieurintro .flsuite {width: 4.4em; height: 4.4em; position: absolute; bottom:2.5em; left: 0; cursor: pointer} .H #interieurintro h1, .H #interieurintro h1 i, .H #interieurintro p {visibility:hidden} #listemarques {margin:0; padding:0} #listemarques li {} #listemarques li a {display:block; width:100%;background-color:#f6f6f6; color:#000; overflow:hidden; position:relative; border-bottom:1px solid #000;} #listemarques li a img {display:block; width:50%; float:right; transform-origin: 50% 50%} #listemarques li a p {display:block; width:43%; float:left; margin:0; padding:0; margin-top:1em; padding-left: 7%} #listemarques li a b { clear:both; height:0; width:100%; display:block} #listemarques a strong { position:relative; display:block; margin:0; font-size:2.8em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.1em; padding-top:0.8em} #listemarques a strong i {display:block; width:2em; background-color:#000; height:1px; position:absolute; top:0; left:0; transform-origin: 0 0;} #listemarques a span { margin:0; display:block; font-size:1.25em; font-weight:300; letter-spacing:0.04em; line-height:1.4em; padding-top:0.5em} .H #listemarques li a img {visibility:hidden} /*page int*/ #logomarque {width:580px; margin:170px auto 62px auto; display:block; z-index:903; transform-origin: 50% 50%} #logomarque img {width:100%; transform-origin: 0 0;} .H #logomarque {visibility:hidden} /*marque int*/ #interieur {width:100%} .imglarge {width:100%; display:block; transform-origin: 50% 50%} #interieur .pagereduit {width:71%; margin:0 auto} #interieur .pagereduit2 {width:65%; margin:0 auto} #interieur .grostexte {font-size:1.3em; font-weight:300; line-height:1.5em; letter-spacing:0.005em; margin-top:5em; color:#2d2d2d; padding-bottom:2em} .grostexte .coul1 {color:#bf1931} #interieur .colGint { width:45%; float:left; margin-top:6em} #interieur .colDint { width:45%; float:right; margin-top:6em} #interieur .colGintgalerie { width:45%; float:left; padding-top:0px} #interieur .colDintgalerie { width:45%; float:right; padding-top:18em} .pagereduit h2 {color:#202020; font-weight:400; letter-spacing:0.05em; line-height:1.6em; font-size:1.25em; position:relative} .pagereduit p {color:#494949; font-weight:300; letter-spacing:0.025em; line-height:2em; font-size:1.1em; margin-top:2.1em; padding:0; text-align:justify} .pagereduit p sup {font-size:0.6em} .pagereduit p strong {color:#e84d1c; font-weight:500} #interieur .margeH1 {margin-top:15em} #interieur .margeB1 {margin-bottom:15em} .pagereduit2 img {width:100%; display:block; margin-bottom:10em} .pagereduit2 h3 {color:#202020; font-weight:400; letter-spacing:0.04em; line-height:1.6em; font-size:2.1em; position:relative; margin-top:18em; text-align:center;font-weight:300} .pagereduit2 p {color:#202020; font-weight:400; letter-spacing:0.025em; line-height:1.6em; font-size:1.5em; position:relative; margin-top:2em; margin-bottom:10em;text-align:center;font-weight:300} .listeinterieur {width:100%} .fdnoir {background-color:#000; padding:15em 0 20em 0; margin-top:5em} .fdsans { padding:13em 0 5em 0;} .listeinterieur h3 {font-size:3em; font-family:'JS', sans-serif; font-weight:400; text-align:center; display:block; text-transform:uppercase; letter-spacing:0.03em; line-height:1.4em; color:#fff} .listeinterieur h4 {font-size:2.1em; font-weight:300; text-align:center; display:block; letter-spacing:0.03em; line-height:1.4em; color:#202020} .listeinterieur ul {width:1342px; margin:55px auto 0 auto} .listeinterieur li {width:295px; margin-right:54px; float:left; margin-top:54px;} .listeinterieur .sansm {margin-right:0} .listeinterieur li a, .listeinterieur li span { display:block; position:relative; overflow:hidden} .listeinterieur li a img, .listeinterieur li span img { display:block; width:100%; transform-origin: 50% 50%;} .H #animationprem {visibility:hidden} /* nous connaitre */ .grandfond {width:100%; background-color:#000; position: relative; height: auto; overflow: hidden} .fdint1 {padding-top:9em; padding-bottom:21em; margin-top:0px; margin-bottom:0} .fdint2 {padding-top:9em; padding-bottom:21em; margin-top:15em; margin-bottom:0} .grandfond .cal {z-index: 10; position: absolute} .grandfond .grandfondInt {z-index: 11; position: relative; margin-left: 14.5% /*71%*/} .grandfondInt p {font-size: 1.7em;font-weight:300; line-height:1.9em; letter-spacing:0.025em; color:#D8D8D8;} .grandfondInt p sup {font-size:0.6em} .grandfondInt p span, .grandfondInt p a {color:#FFF; display:inline-block; position:relative} .grandfondInt p span i, .grandfondInt p a i {position:absolute; bottom:0.3em; left:0; width:100%; height:2px; background-color:#FFF} .contgeneralInt {width:55%; margin-left:auto; margin-right:auto; position:relative} .contgeneral-titre {background-color: #fff; padding: 5em 0 3em 0; margin-top:47px;} .contgeneral-titre h1 {font-size:2.4em; position: relative; padding-top:0.7em; font-weight:400; letter-spacing: 0.03em; color:#000; line-height: 1.6em} .contgeneral-titre h1 i {position:absolute; top:0; left:0; width:1.5em; height:2px; background-color:#000; transform-origin: 0 0} .contgeneral-titre h2 {font-size:1.3em; position: relative; padding-top:0.5em; font-weight:300; letter-spacing: 0.03em; color: #636363; line-height: 1.6em} .contgeneral-contenu {padding: 3em 0 10em 0;background-color:#fff} .contgeneral-contenu h2 {font-size:1.8em; position: relative; padding-top:0.7em; font-weight:400; letter-spacing: 0.03em; color:#000; line-height: 1.6em} .contgeneral-contenu h2 i {position:absolute; top:0; left:0; width:1.5em; height:2px; background-color:#C5C5C5; transform-origin: 0 0} .contgeneral-contenu h3 {font-size:1.3em; position: relative; padding-top:0.7em; font-weight:400; letter-spacing: 0.03em; color: #636363; line-height: 1.8em} .contgeneral-contenu p {font-size:1.1em; position: relative; padding-top:0.7em; font-weight:300; letter-spacing: 0.03em; color: #636363; line-height:1.9em; padding-bottom:4em; padding-top:0.5em; margin-top: 0} .contgeneral-contenu p a {color: #1D1D1D; font-size: 1.2em; text-decoration: underline; display: inline-block; padding-top:0.5em} .contgeneral-contenu p a:hover {color: #646464; text-decoration: none} /*presse*/ #presseext {position:relative; overflow:visible;} #presse {width:100%; margin-top:139px; padding-bottom:200px; display:block; } #listepresse {width:99.9%; margin:0 auto} #listepresse li {width:33.3%; float:left} #listepresse li .lienpresse {border-bottom:1px solid #000; display:block; padding:50px 0 50px 0; text-align:center; position:relative; overflow:hidden; cursor:pointer} #listepresse li .bordD {border-right:1px solid #000; } #listepresse li .bordT {border-top:1px solid #000; } #listepresse li strong {color:#3c3b3a; display:block; padding-bottom:7px; letter-spacing:0.03em; font-size:1.25em; font-weight:300; position:relative; z-index:10} #listepresse li strong sup {font-size:0.6em} #listepresse li i {color:#777777; display:block; font-size:1em; letter-spacing:0.025em; font-weight:300; font-style:normal; position:relative; z-index:10} #listepresse li b { position:absolute; z-index:8; background-color:#ec232b; width:100%; height:100%; top:0; left:0; visibility:hidden; transform-origin:100% 100%} #listepresse .bg1 {background-color:#4dbc15} #listepresse .bg2 {background-color:#ec232b} #listepresse .bg3 {background-color:#f37507} #listepresse .bg4 {background-color:#ff5000} #listepresse .bg5 {background-color:#000} #listepresse .bg6 {background-color:#2e3e8e} #listepresse .bg7 {background-color:#83239e} #listepresse .bg8 {background-color:#7dcda3} #listepresse.bg9 {background-color:#e3362d} .H #listepresse li .lienpresse {visibility:hidden} #fondgris {position:fixed; top:0; left:0; height:100%; width:100%; background-color:#e5eaea; z-index:500; display:none} #croix {width:80px; height:80px; display:none; position:fixed; top:40px; right:40px; z-index:510; background-color:#FFF; cursor:pointer} #croix img {width:40px; height:40px; margin-top:20px; margin-left:20px} #presseAction {display:block} .H #presseAction {display:none;position:absolute; top:0; left:15%; width:70%;z-index:502; } .couvpresse {} .H .couvpresse {display:none} .couv {float:left; width:35%} .infospresse {float:right; width:57%} .infospresse .publi1 {font-size:2em; letter-spacing:0.025em; line-height:1.4em; font-weight:300; color:#000; display:block;} .infospresse .publi2 {font-size:1.4em; letter-spacing:0.025em; line-height:1.6em; font-weight:300; display:block; color:#595959; padding-left:15px; margin-top:3px} .pluspresse { display:inline-block; letter-spacing:0.05em; margin-top:60px; margin-left:15px} .pluspresse a, .pluspresse span {display:inline-block; float:left; background-color: rgba(255, 255, 255, 0.9); margin-right:1px; background-repeat:no-repeat; background-position:15px 25%; background-size:27px; padding:20px 20px 20px 60px; font-size:0.9em; color:#4b4b4b; cursor:pointer} .pluspresse .pictodll {background-image:url("../Images/dll.png")} .pluspresse .pictoplus {background-image:url("../Images/plus.png");} .extraitspresse {display:block; width:100%; padding-top:180px; padding-bottom:250px} .H .extraitspresse {display:none} .extraitspresse h2 {font-size:2.4em; font-family:'JS', sans-serif; font-weight:500; text-transform:uppercase; letter-spacing:0.05em; line-height:1.2em; color:#000} .extraitspresse h3 {font-size:1.6em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:0.05em; line-height:1.2em; color:#565656; padding-top:13px} .extraitspresse p {margin:0; font-size:1.1em; text-align:justify; font-weight:300; padding-top:45px; letter-spacing:0.045em; line-height:2.1em; display:block; color:#303030; overflow:visible; position:relative; float:left; width:43%; margin-right:7%} /*contact*/ #contact {height:100%; width:100%; position:relative; z-index:800; background-color: #000000; overflow: hidden; min-height: 500px} .H #contact {visibility: hidden} #contact .cal {position: absolute; z-index: 10; transform-origin: 50% 50%} #contact-G {width:46%; margin-left:15%; top:26.8%; position:absolute; z-index: 12} #contact-G h1 {color:#5b5b5c; text-transform: uppercase; letter-spacing: 0.09em; font-size:0.9em} #contact-G p#liencontact { font-size:2.5em; color:#fff; margin: 1em 0 0 0; padding: 0; line-height: 1.8em; font-weight: 300; letter-spacing: 0.03em} #contact-G p#liencontact a{color:#fff; font-weight: 300; line-height: 1.8em; display: inline-block; position: relative; overflow:hidden} #contact-G p#liencontact a b {position: relative; display: inline-block;transform-origin: 0 0; font-weight: 300; line-height: 1.8em} #contact-G p#liencontact a i {position: absolute; bottom: 0em; left: 0; width:100%; display: block; height: 2px;background-color: #bf1931; transform-origin: 0 0} #contact-G .lienplus {color:#000; background-color:#fff; border-radius:50px;display:inline-block; border:none; padding-top:1.2em; padding-bottom: 1.2em; padding-left: 3em; padding-right: 4em; font-size:1.05em; background-image:url("../Images/flcontact2.png"); background-repeat:no-repeat; background-position:90% 50%; background-size:4.5%; line-height:1.2em; letter-spacing:0.04em; margin:2em 0 0 0; cursor:pointer; text-align:left; font-weight:400; font-family: 'POP', sans-serif;} #contact-D {width:39%; right:0; bottom:16%; position:absolute; z-index: 12; -webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} #contact-D .colcontact { display: inline-block; float: left; margin-right:12%; padding-left: 2em; line-height:2em; position: relative; margin-bottom: 2.5em} #contact-D h2 {color:#5b5b5c; text-transform: uppercase; letter-spacing: 0.09em; font-size:0.9em; padding-bottom:1.4em} .colcontact span {color:#fff; letter-spacing: 0.09em; font-size:0.9em; display: inline-block; position: relative} .colcontact a {color:#fff; letter-spacing: 0.09em; font-size:1em; display: inline-block; position: relative} .colcontact a i {position: absolute; bottom: 0em; left: 0; width:0; display: block; height:1px;background-color: #bf1931; transform-origin: 0 0} .colcontact .trait {position: absolute; top:0; left: 0; width:1px; display: block; height:100%;background-color: #fff; transform-origin:100% 100%} #rdv {background-color: #f7f7f7; position: relative; overflow: hidden} #rdv.rdvavecfond {padding-bottom: 12em} .H #rdv {visibility: hidden} #rdv .cal {width: 100%; position: absolute; top: 0; left: 0; transform-origin: 50% 50%; z-index: 1} #titrerdv {position: relative; z-index: 30;background-color: #f7f7f7;padding-top:7em;} #rdv h2.titrecontact {font-size:3.4em; line-height: 1.4em; color: #000; font-weight:300; display: block; text-align: center; letter-spacing:0.025em; width: 92%; margin-left: auto; margin-right: auto; position: relative; z-index: 30} #rdv p.soustitrecontact {font-size: 1.3em; line-height: 1.6em; color: #000; padding-top:0; padding-bottom:2em; display: block; text-align: center; letter-spacing: 0.025em; font-weight: 300; width: 92%; margin-left: auto; margin-right: auto; position: relative; z-index: 30} .scontactInt {width: 54%; margin-left: auto; margin-right: auto; max-width: 1300px; position: relative; z-index: 30} .scontactInt h3 {font-size:1.8em; font-family:'JS', sans-serif; font-weight:400; letter-spacing: 0.05em; text-align: center; display: block; text-transform: uppercase} .scontactInt-trait {width: 100%; display: block; height: 1px; background-color: #000; transform-origin: 50% 50%} .scontactInt-contenu {width: 100%; background-color: #FFFFFF; padding: 6em 0 6em 0; margin-top: 1.2em} #formulaire2 ::-webkit-input-placeholder {color:#7d7d7d; } #formulaire2 :-moz-placeholder {color:#7d7d7d; opacity:1; } #formulaire2 ::-moz-placeholder {color:#7d7d7d;opacity:1;} #formulaire2 :-ms-input-placeholder {color:#7d7d7d;} #formulaire2 ::-ms-input-placeholder {color:#7d7d7d;} #formulaire2 ::placeholder {color:#7d7d7d;} #formulaire2 .titreformulaire {color:#000; font-size: 1.1em; font-weight:400; padding:2.3em 0 0 0; display: block; letter-spacing: 0.04em} #formulaire2 .titreformulaire strong {display: inline-block; font-size: 1em; letter-spacing: 0.05em; font-weight:600} #formulaire2 {display:block; text-align:left; margin:0 auto; padding-bottom:0; padding-top:1.8em; width:80%; font-size:1em; font-family: 'POP', sans-serif; font-weight:400; letter-spacing:0.04em; -webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} #formulaire2 .formgauche {width:47%; float:left; margin:0.6em 0 0 0; display: block} #formulaire2 .formdroite {width:47%; float:left; margin:0.6em 0 0 6%; display: block} #formulaire2 .fromlong {width:100%; float:none; margin:0.6em 0 0 0; padding:0; display: block} #formulaire2 input.text {color:#45636d; font-size:1.2em; border:none; padding:0.9em 0 0.2em 0; font-family: 'POP', sans-serif; font-weight:400; border-bottom:1px solid #5f5e5e; background:none; border-radius:0; letter-spacing: 0.025em} #formulaire2 input.text:hover {color:#000; background-color: rgba(0, 0, 0, 0.02);border-bottom:1px solid #386793; } #formulaire2 textarea{margin:1.2em 0 0 0; height:9em; color:#45636d; border:none; padding:1em 4% 0.8em 4%; background-color: rgba(255, 255, 255, 1); width:92%; border-radius:20px; font-size:1.2em; font-family: 'POP', sans-serif; font-weight:300; line-height: 1.6em} #formulaire2 textarea:hover {color:#000; background-color: rgba(255, 255, 255, 0.9);} #formulaire2 .check {display: block; position: relative; width: 100%; margin-bottom: 0.2em; margin-top: 2.3em; -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none;} #formulaire2 .labcheckbox2 {display:block; font-size:1em; font-weight:300; color:#000000; cursor: pointer; float: left; padding-left:46px; padding-bottom: 0.4em; line-height: 1.4em; padding-top: 0.2em} .labcheckbox2 a {color:#3E3E3E; text-decoration: underline} .labcheckbox2 a:hover { text-decoration: none} #formulaire2 input.box2 {accent-color:#000; width:24px;border-radius:4px; height:24px; display:inline-block; position: absolute; top:1px; left: 0; cursor: pointer;} #formulaire2 .minimargeH {margin-top: 0.9em} #formulaire2 .labcheckbox {display:block; font-size: 1.05em; font-weight: 400; color:#000000; cursor: pointer;float: left; padding-left:35px; padding-bottom: 0.4em; line-height: 1.4em; padding-top: 0.3em} #formulaire2 input.box {accent-color:#000; width:22px; height:22px; display:inline-block; position: absolute; top:2px; left: 0; cursor: pointer} #formulaire2 input.box:checked, #formulaire2 input.box2:checked {accent-color:#000} #formulaire2 .labcheckbox:hover, #formulaire2 .labcheckbox2:hover {color:#45636d;} #formulaire2 .envoyerreduit {width:100%; text-align: center} #envoyer {color:#fff; background-color:#000000; border-radius:50px;display:inline-block; border:none; padding-top:1.2em; padding-bottom: 1.2em; padding-left: 3em; padding-right: 4em; font-size:1.05em; background-image:url("../Images/flcontact.png"); background-repeat:no-repeat; background-position:90% 50%; background-size:4.5%; line-height:1.2em; letter-spacing:0.04em; margin:2em 0 0 0; cursor:pointer; text-align:left; font-weight:400; font-family: 'POP', sans-serif;} #message-requete {font-family: 'POP', sans-serif;margin:0; letter-spacing:0.02em; font-size:1.3em; position:fixed; top:50px; left:50%; margin-left:-300px; width:500px; z-index:99999; background-color:#fff; padding:50px; border-radius:12px; display:none; position:fixed; color:#0d2243; cursor:pointer; background-image:url("../Images/croix.png"); background-size:30px; background-position:96% 20px; background-repeat:no-repeat} #message-requete h3 {color:#000; font-weight:500; padding-bottom:10px; font-size:1.1em; line-height: 1.6em} #message-requete ul {margin:10px 0 10px 0; padding:0; list-style:none} #message-requete ul li {list-style:none; padding:0.4em 4px 0.4em 2em; font-size:0.8em; margin:1px 0 0 0; display:block; width:auto} #message-requete .message-ok { background-image:url("../Images/valide.png"); background-repeat:no-repeat; background-position:5px 0.6em; background-size:1em; font-size:0.9em; font-weight:600} #message-requete .message-erreur { background-image:url("../Images/erreur.png"); background-repeat:no-repeat; background-position:5px 0.6em; background-size:1em} #fondmessage {background-color:#262727; z-index:99998; position:fixed; width:100%; height:100%; top:0; left:0; display:none} /* slide */ #logoslide {position:relative; width:290px; top:47px; left:50%; margin-left:-145px; display:block; z-index:903} .H #logoslide { position:absolute; visibility:hidden} #logoslide img {width:100%; display:block} #lineslide {position:relative; margin-top:150px} .H #lineslide { visibility:hidden; position:fixed; margin-top:0; bottom:0px; left:0; z-index:850; display:block; width:100%; height:100px} #lineslide #coteG {float:left; width:35%} #lineslide #coteD {float:right; width:35%} #flprecslide {width:38px; display:block; float:left; margin-left:4%;margin-right:4%; cursor:pointer} #flprecslide img {width:100%; display:block} #flsuivslide {width:38px; display:block; float:right; margin-left:4%; margin-right:4%; cursor:pointer} #flsuivslide img {width:100%; display:block} #lineslide #coteG i, #lineslide #coteG b {float:left; transform-origin:0 0} #lineslide #coteD i, #lineslide #coteD b {float:right; transform-origin:0 0} #lineslide i { background-color:#FFF; height:1px; width:20%; display:inline-block; margin-top:19px; margin-left:2%; margin-right:2%} #lineslide b { background-color:#FFF; height:8px; width:8px; display:inline-block; margin-top:15px; border-radius:50%; transform-origin:50% 50%} #lineslide h1 {position:relative; display:block; height:160px; font-size:3em; font-family:'JS', sans-serif; font-weight:400; text-align:center; text-transform:uppercase; letter-spacing:0.03em; line-height:0.9em; color:#fff} .H #lineslide h1 { width:30%; position:fixed; bottom:0; left:50%; margin-left:-15%} #lineslide h1 span {font-style:normal;display:inline-block; margin-top:0px/*js*/} #degrade { display:none;width:100%; height:40%; position:fixed; bottom:0; left:0; z-index:801; cursor:pointer; background: -moz-linear-gradient(top, rgba(0,0,0,0) 10%, rgba(0,0,0,0.6) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 10%,rgba(0,0,0,0.6) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0) 10%,rgba(0,0,0,0.6) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#000", endColorstr="#000",GradientType=0 ); /* IE6-9 */ } .H #degrade {visibility:hidden; display:block} #degrade2 { display:none;width:100%; height:40%; position:fixed; top:0; left:0; z-index:801; cursor:pointer; background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 25%, rgba(0,0,0,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 25%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0.6) 25%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#000", endColorstr="#000",GradientType=0 ); /* IE6-9 */ } .H #degrade2 {visibility:hidden; display:block} #slide, #slideimg {position:relative} .H #slide {height:100%; width:100%; position:fixed; z-index:800; visibility: hidden} .H #slideimg {height:100%; width:100%; position:relative; z-index:800; cursor:pointer; overflow: hidden} #slideimg img {position:relative} .H #slideimg img { display:block; width:100%; position:absolute; width:auto; height:auto;z-index:800; visibility:hidden; transform-origin: 50% 50%} #slideprec {position:fixed; top:50%; margin-top:-60px; left:0; display:inline-block; border-top-right-radius:90px;border-bottom-right-radius:90px; background-color: rgba(0, 0, 0, 0.72); color:#FFF; text-decoration:none; padding:25px 75px 25px 25px; z-index:890; transform-origin:50% 50%} #slideprec b { font-weight:300; font-size:1.15em; letter-spacing:0.025em; line-height:1.5em; display:block} #slideprec span { padding-left:45px; font-weight:300; font-size:0.8em; letter-spacing:0.1em; line-height:1.5em; display:inline-block; position:relative} #slideprec span i { background-color:#FFF; height:1px; width:30px; display:inline-block; position:absolute; top:50%; left:0; transform-origin:0 0} #slidesuiv {position:fixed; top:50%; margin-top:-60px; right:0; display:inline-block; border-top-left-radius:90px;border-bottom-left-radius:90px; background-color: rgba(0, 0, 0, 0.72); color:#FFF; text-decoration:none; padding:25px 25px 25px 75px; z-index:890; transform-origin:50% 50%} #slidesuiv b { font-weight:300; font-size:1.25em; letter-spacing:0.025em; line-height:1.5em; display:block} #slidesuiv span { padding-left:45px; font-weight:300; font-size:0.8em; letter-spacing:0.1em; line-height:1.5em; display:inline-block; position:relative} #slidesuiv span i { background-color:#FFF; height:1px; width:30px; display:inline-block; position:absolute; top:50%; left:0; transform-origin:0 0} .H #slideprec, .H #slidesuiv {visibility:hidden} /* projet */ #pagechoix {width:100%; padding-top:10em; position:relative; z-index:20} #pagechoix h2 { position:relative; display:block; margin:0; margin-left:0; font-size:3.7em; font-family:'JS', sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:normal; line-height:1.4em; color:#000; padding-top:0.4em} #pagechoix h2 sup {font-size:0.6em; padding-left:0.2em} #pagechoix h2 i {display:block; width:1.5em; background-color:#2c2c2c; height:2px; position:absolute; top:0; left:0; transform-origin: 0 0;} #pagechoix h1, #pagechoix h3 { margin:0; display:block; margin-left:0; font-size:1.4em; font-weight:300; letter-spacing:0.04em; line-height:1.4em; color:#474747;padding-top:0.4em} #pagechoix h4 { position:relative; display:block; margin:0; margin-left:0; font-size:2.1em; font-weight:300; letter-spacing:0.03em; line-height:1.4em; color:#a4a4a4; padding-top:1.5em; padding-bottom: 1em} #pagechoix .margeH {margin-top:7em; padding-top:7em} #pagechoix .margeH2 {margin-top:7em; padding-top:5em} .margeH3 {padding-top:7em} #pagechoix .margeB {padding-bottom:7em} #pagechoix .fondblanc {background-color: #fff} .pagechoixInt {width: 71%; margin-left: auto; margin-right: auto} .choixcarres {width:100%; display: block; padding-top:5em} li.choixcarre {width: 22%; margin-right: 4%; float: left; margin-bottom: 3em; cursor: pointer} li.choixcarre.ret {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} li.choixcarre.sansM {margin-right:0} li.choixcarre b {width: 100%; display: block; position: relative; border-radius:15px; overflow: hidden; border-width:2px; border-color:#f6f6f6; border-style: solid} li.choixcarre b i {width: 100%; display: block; position: relative; overflow: hidden; border-radius:8px; } li.choixcarre b i img {width: 100%; display: block; transform-origin: 50% 50%} li.choixcarre strong {font-size: 0.9em; color:#636363; text-transform: uppercase; left: 0.03em; display: block; padding-top:1.3em; display: block; font-weight:400} li.choixrond {width:8.4%; margin-right:3%; float: left; margin-bottom: 3em; cursor: pointer} li.choixrond.ret {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} li.choixrond.sansM {margin-right:0} li.choixrond b {width: 100%; display: block; position: relative; border-radius:50%; overflow: hidden; border-width:2px; border-color:#f6f6f6; border-style: solid; } li.choixrond b i {width: 100%; display: block; position: relative; overflow: hidden; border-radius:50%; } li.choixrond b i img {width: 100%; display: block; transform-origin: 50% 50%; position: relative} li.choixrond strong {font-size: 0.9em; color:#636363; text-transform: uppercase; left: 0.03em; display: block; padding-top:1.3em; display: block; font-weight:400; text-align: center} .choixblocG {width: 50%; float: left; margin-bottom:3em} .choixblocD {width: 45%; float:right; margin-bottom:3em} #pagechoix textarea{margin:0; height:14em; color:#45636d; border:none; padding:1em 4% 0.8em 4%; background-color: rgba(255, 255, 255, 1); width:92%; border-radius:20px; font-size:1.2em; font-family: 'POP', sans-serif; font-weight:300; line-height: 1.6em; letter-spacing: 0.03em} #pagechoix textarea:hover {color:#000; background-color: rgba(255, 255, 255, 0.9);} .optchoix {display: inline-block; background-color:#fff; padding:0.8em 5.2em 0.8em 1.7em; position: relative; margin-right:0.7em; margin-bottom:0.7em; border-radius: 50px; font-size: 1em; font-weight:400; color:#3E3E3E; cursor: pointer} .optchoix div {position: absolute; top: 50%; margin-top: -0.6em; width:2.8em; height: 1.2em; right: 1em; display: block; border-radius: 50px; background-color: #949494} .optchoix div i {position:relative; width: 100%; height: 100%; display: block} .optchoix div i b {position:absolute; width: 0.8em; height: 0.8em; display: block; top: 50%; margin-top: -0.4em; background-color: #FFFFFF; border-radius: 50%; left:0.3em} /*.optchoix.optchoixActive div {background-color: #55c692} .optchoix.optchoixActive div i b {left:1.7em} .optchoix.optchoixDesactive div {background-color: #949494} .optchoix.optchoixDesactive div i b {left:0.3em}*/ #pagechoix .checkbox-list {padding:3em 0} #pagechoix .check {display: block; position: relative; width: 100%; margin-bottom: 0.2em; margin-top:0.2em; -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none;} #pagechoix .labbox {display:block; font-size:1.1em; font-weight:400; color:#000000; cursor: pointer; padding-left:46px; padding-bottom: 0.4em; line-height: 1.4em; padding-top: 0.2em} #pagechoix input.box {accent-color:#000; width:24px;border-radius:4px; height:24px; display:inline-block; position: absolute; top:1px; left: 0; cursor: pointer;} #pagechoix input.box:checked, #pagechoix input.box:checked {accent-color:#000} #pagechoix .labbox:hover, #pagechoix .labbox2:hover {color:#45636d;} .H .checkbox-list {display:none} .boutonsetapes {position: relative; margin:3em 0 1.5em 0; z-index: 900; width: 100%; display: block; text-align: center} .btvaliderEtape {border-radius: 50px; display: inline-block; text-align: left; font-weight: 400; cursor: pointer; margin:0 0.5em 1.2em 0.5em} .btvaliderEtape.Noir {background-color: #000000; color: #fff; font-size: 1em; letter-spacing: 0.03em;} .btvaliderEtape.Blanc {background-color: #fff; color: #000; font-size: 1em; letter-spacing: 0.03em; box-shadow: 1px 1px 18px rgba(0, 0, 0, 0.09);} .btvaliderEtapeInt {position: relative; display: inline-block; padding: 1.1em 3.7em 1.1em 2em} .btvaliderEtape.Noir b {width:2em; top: 50%; margin-top: -1em; display: block; position: absolute; right:1.4em; transform-origin: 50% 50%} .btvaliderEtape.Blanc b {width:1.6em; top: 50%; margin-top: -0.8em; display: block; position: absolute; right:1.4em; transform-origin: 50% 50%} .autreidee {display: inline-block; text-align: left; font-weight: 400; cursor: pointer; margin:1em 0 0 0; position: absolute; right: 0; top: 0; color: #000; font-size: 1em} .autreideeInt {position: relative; width:100%; height: 100%; position: relative; padding-right:1.8em; padding-bottom: 0.5em; padding-top: 0.5em} .autreidee b {width:0.8em; top: 50%; margin-top: -0.45em; display: block; position: absolute; right:0; transform-origin: 50% 50%} .autreidee i {width:100%; bottom:0; left:0; height: 2px; background-color: #c3c3c3; display: block; position: absolute; transform-origin:0 0} .etapeAutreidee {width: 60%; margin:0 auto; padding:0 0 1.5em 0; display: none} .etapeAutreidee h4 {text-align: center} #pagechoix .etapeAutreidee textarea {margin:0; height:7em} #pagechoix .etapeAutreidee textarea.fondgris {background-color:#f7f7f7} @media screen and (max-width: 1750px) { /*@media screen and (max-width: 1600px) {*/ body {font-size:0.8em} .H #load {width:40px; /*height:10px*/margin-top:-5px; margin-left:-20px;} #menu {width:64px; height:64px; top:32px; right:32px} #menu i,#menu b {width:16px; height:2px; margin-left:-8px;} #t1, #t1b { margin-top:-6px} #t2, #t2b {margin-top:-1px} #t3, #t3b {margin-top:4px} #menu #fermer {width:64px; height:64px} #menu #fermer img {width:16px; height:16px; margin-top:24px; margin-left:24px} #fermer b {width:20px;height:2px;top:31px; left:22px;margin:0;} #remonte {width:37px; height:37px;right:32px} #remonte img {width:16px; margin-left:-8px; margin-top:-8px;} #call {right: 32px} #introAcc-logo {width:232px; top:38px; } #introAcc-bandeau, .menu-fix {height:128px} #btS1 { border:solid 2px #fff; width:14px; border-radius:14px; height:24px; bottom:48px; margin-left:-9px;} #btS2 {width:2px; border-radius:2px; height:5px; bottom:56px} #btS3 {bottom:25px;} .textecentre {width:592px} #accueil .gde {margin-right:44px} #accueil .pet li a span {margin-top:8px} .pet li a span b {height:2px} .flaccueil {width:56px; height:56px; margin-bottom:-28px; margin-right:-80px; background-size:56px} .votreprojet li {margin-right:44px;} .votreprojet li a span {margin-top:8px; padding-bottom:2px;} .marquesgde {margin-right:44px} /* bas */ #bas {} #logobas {width:232px} /*page int*/ #logoint {width:232px; margin:0 auto 0 auto; padding-top:38px} /*reas*/ #realisations .galeriemini {width:92%} #realisations .gde {margin-right:56px; } #realisations .pet li a span {margin-top:8px; } /* projet */ #projet .desc {width:50%; font-size:1.1em} #projet .archi {width:75%; margin-left:25%} #projet .archi img {width:135px; margin-right:40px} #projet .archint {width:70%} #projet .archint p { padding-top:23px} #projet .archint strong {font-size:1.5em; padding-top:10px} #projet #similaire {width:75%} #projet #suite {width:63%} #suitea {height:200px} #suiteb {height:200px} #suite span {font-size:1.7em; background-size:30px; letter-spacing:0.04em} #suitea span {margin-left:60px; padding-left:50px;} #suiteb span {margin-right:60px; padding-right:50px;} #precsuiv {bottom:32px; left:32px} #precsuiv a {width:51px} /* marques */ /*page int*/ #logomarque {width:460px; margin:140px auto 50px auto} #interieur .pagereduit2 {width:65%} #interieur .grostexte {font-size:2.2em;} #interieur .colGint { width:45%; } #interieur .colDint { width:45%; } #interieur .colGintgalerie { width:45%} #interieur .colDintgalerie { width:45%; } .pagereduit h2 {font-size:1.3em} /*.pagereduit h2 b {width:60px; height:60px;left:-30px; margin-top:-30px}*/ .pagereduit p {font-size:1.15em} .pagereduit2 img {margin-bottom:8em} .listeinterieur h3 {font-size:2.8em} .listeinterieur ul {width:1080px; margin:45px auto 0 auto} .listeinterieur li {width:240px; margin-right:40px; margin-top:40px;} /* nous connaitre */ .fdint1 {margin-top:0px} .contgeneral-titre {margin-top:38px;} .showrooms-desc iframe {min-height:600px} /*presse*/ #presse {margin-top:112px; padding-bottom:160px} #listepresse li .lienpresse {padding:40px 0 40px 0} #listepresse li strong {padding-bottom:5px; font-size:1.25em} #listepresse li i {font-size:1em} #croix {width:64px; height:64px; top:32px; right:32px} #croix img {width:32px; height:32px; margin-top:16px; margin-left:16px} .H #presseAction {left:15%; width:70%} .couv {float:left; width:35%} .infospresse {width:57%} .infospresse .publi1 {font-size:2em} .infospresse .publi2 {font-size:1.4em; padding-left:12px; margin-top:2px} .pluspresse {margin-top:50px; margin-left:12px} .pluspresse a, .pluspresse span {background-position:12px 25%; background-size:21px; padding:16px 16px 16px 50px} /*contact*/ #rdv h2.titrecontact {font-size:3em} #rdv p.soustitrecontact {font-size: 1.1em} .scontactInt h3 {font-size: 1.6em} #formulaire2 .labcheckbox2 {padding-left:42px;padding-top:0.1em} #formulaire2 input.box2 {width:20px; height:20px} #message-requete {top:40px; margin-left:-240px; width:400px;padding:40px; background-size:26px; background-position:96% 16px} #message-requete h3 {padding-bottom:8px} #message-requete ul {margin:8px 0 8px 0} /* slide */ #logoslide {width:232px; top:38px; margin-left:-116px} #flprecslide {width:33px} #flsuivslide {width:33px} #lineslide i {margin-top:16px} #lineslide b {height:6px; width:6px;margin-top:13px} #slideprec { margin-top:-60px;padding:20px 60px 20px 20px} #slideprec span { padding-left:35px} #slideprec span i { width:20px} #slidesuiv {margin-top:-60px;padding:20px 20px 20px 60px} #slidesuiv span { padding-left:35px} #slidesuiv span i {width:30px} } @media screen and (max-width: 1300px) { body {font-size:0.75em} .textecentre {width:555px} #accueil .galeriemini {width:75%} #accueil .gde {margin-right:34px} #accueil .pet li a span {margin-top:5px} .pet li a span b {height:2px} .flaccueil {width:40px; height:40px; margin-bottom:-20px; margin-right:-60px; background-size:40px} .extraitsint {width:90%} .votreprojet li {margin-right:34px;} .votreprojet li a span {margin-top:5px; padding-bottom:2px;} .marquesgde {margin-right:34px} #accueil .galeriemini, .votreprojet, .actus, .marques, #extraits, .process, .showrooms, .pagechoixInt {width:75%} /* bas */ #bas {width:75%} /*reas*/ #realisations .galeriemini {width:90%} #realisations .gde {margin-right:45px; } #realisations .pet li a span {margin-top:7px} .titrereas { margin-top:-4.8em; padding-top:1.6em} .titrereas span { font-size:4em} /* projet */ #projet .desc {width:60%; font-size:1.1em} #projet .archi {width:80%; margin-left:20%; margin-top:80px; padding-bottom:80px} #projet .archi img {width:130px} #projet .archint {width:70%} #projet .archint p, #projet .archint a {font-size:1.3em} #projet #similaire {width:75%} #projet #suite {width:70%} #suitea {height:180px} #suiteb {height:180px} #suite span {font-size:1.6em; background-size:26px; letter-spacing:0.03em} #suitea span {margin-left:50px; padding-left:45px;} #suiteb span {margin-right:50px; padding-right:45px;} #precsuiv {bottom:28px; left:28px} #precsuiv a {width:45px} /*page int*/ #interieur .grostexte {font-size:2em;} .pagereduit2 img {margin-bottom:100px} .listeinterieur ul {width:890px; margin:40px auto 0 auto} .listeinterieur li {width:200px; margin-right:30px; margin-top:30px;} .pagereduit2 h3 {margin-top:200px} .pagereduit2 p {margin-top:30px; margin-bottom:110px} /* nous connaitre */ .grandfond .grandfondInt {margin-left: 12.5% /*75%*/} .showrooms-desc iframe {min-height:500px} /*presse*/ .H #presseAction {left:10%; width:80%; } /*contact*/ .scontactInt {width: 60% } #formulaire2 .labcheckbox2 {padding-left:40px;padding-top: 0.2em} #formulaire2 input.box2 {width:18px; height:18px} } @media screen and (max-width: 1200px) { #MOB2 {display: block} body {font-size: 0.72em} #navvisu {width:25%;} #navcontenu {width:65%} .navlangue {left:35%} #liennavcont {margin-top: 7em} #liennavcont a{font-size:2.3em; } /*.titreaccueil span {font-size:2.8em}*/ #accueil .gde {margin-right:30px} .pet {font-size:0.8em} #accueil .pet li a span {margin-top:5px} .votreprojet li {margin-right:30px;font-size:0.8em} .votreprojet li a span {margin-top:5px; padding-bottom:2px;} .marquesgde {margin-right:30px} #accueil .galeriemini, .votreprojet, .actus, .marques, #extraits, .process, .showrooms, .pagechoixInt {width:72%} /* bas */ #bas {width:72%} .basG {width:29.8%; padding-left:0; } .basD {width:70%} #lienbas {margin-top: 7em} #lienbas a{font-size:2.3em; } /*reas*/ #realisations .galeriemini {width:86%} #realisations .gde {margin-right:36px; } #realisations .pet li a span {margin-top:5px} .Projetsuite {margin-top: 9em; margin-bottom: 7em; font-size: 0.9em} /* projet */ #projet h2 {font-size:4em} #projet h1 {font-size:1.5em} #projet #i0 {margin-top:4em} /* marques */ #listemarques li a { font-size:0.9em} /*page int*/ #logomarque {width:380px; margin:130px auto 50px auto} #interieur .grostexte {font-size:1.9em;} .listeinterieur ul {width:810px; margin:35px auto 0 auto} .listeinterieur li {width:180px; margin-right:30px; margin-top:30px;} .grandfond .grandfondInt {margin-left: 14% /*72%*/} .grandfondInt p {font-size: 1.6em;} #contact-G {width:46%; margin-left:10%; top:26.8%; } #contact-G p#liencontact { font-size:2em} #contact-D {width:39%; right:0; bottom:19%} .scontactInt {width: 65% } #pagechoix h2 {font-size:2.8em; padding-top: 0.8em} li.choixcarre strong {font-size: 0.8em} li.choixrond strong {font-size: 0.8em} } /*760 au depart*/ @media screen and (max-width: 990px) { #MOB2 {display:none} #MOB {display: block} .retMob {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} body {font-size: 1em} .H #load {width:32px; /*height:8px*/margin-top:-4px; margin-left:-16px;} #introAcc-logo {width:200px; position:fixed; top:29px; /*left:50%;*/ display:block; z-index:903} #introAcc-bandeau { position: fixed; top: 0; left: 0; width: 100%; height:104px; z-index: 902; background-color: #f7f7f7; transform-origin: 0 0} ..menu-fix{ height: 104px; } .H #introAcc-suite3 {width: 100%; height:40%; position: relative} #menu {width:64px; height:64px; top:20px; right:20px} .navigation {width:100%; height:auto; position:relative; left:0; background-color:#fff; z-index: 9998} .H .navigation {width:100%; height: 100%; position: fixed; left:102%; bottom:auto; top:0; z-index:9998; overflow:hidden; transform-origin:0 0} .navigationInt {width:100%; height:100%; overflow: scroll; overflow-y: scroll; overflow-x: hidden;} .H .navigationInt {height:100%} #navvisu { display: none} #navcontenu {width:100%; float:none; margin-left:0; padding-top:40px} .navcontG {width:38%; margin-left:10%} .navcontG ul li a {font-size: 1.6em} .navcontD {width:50%;} .colnavcont {float:none; display:block; padding-left:1.2em; padding-right:1.5em; margin-top:0.5em; margin-bottom:0.9em} #liennavcont {margin-top:4em; text-align:left; margin-left: 8%} #liennavcont a{font-size:2em} .navlangue {top:20px; left:10%} .navcontmentions {margin-left: 10%; position:relative; bottom:0; right:0; bottom:unset; right:unset; font-size:0.8em; margin-top:4em; text-align: left; padding-bottom: 6em} #remonte {width:40px; height:40px; background-color: rgba(255, 255, 255, 1); position:fixed; bottom:0px; right:20px; z-index:1900; visibility:hidden; overflow:hidden; cursor:pointer} #remonte img {width:20px; position:absolute; top:50%; left:50%; margin-left:-10px; margin-top:-10px; display:block} #call {right:20px} #introAcc-texte {padding-top:13em;} .textecentre {width:500px; margin:0 auto; font-size:0.9em} .textecentre p {font-size:0.95em} /*.textecentre h1 {letter-spacing:0.065em; margin:0; padding:0} .textecentre h1 i {font-size:0.55em; padding-top:10px} .textecentre h1 i sup {font-size:0.7em} .textecentre p { font-size:0.7em; padding-top:30px; line-height:1.9em; letter-spacing:0.025em}*/ #accueil .galeriemini {width:80%; margin-left:auto; margin-right:auto; position:relative;} #accueil .margehB {padding-top:3em} .titreaccueil { display:inline-block; position:relative; top:0; top:auto; top:unset; left:0; left:auto; left:unset; margin-top:0; padding-bottom:1em} .titreaccueil span {font-size:2.6em; line-height:1.2em;} #accueil .margeh0 {padding-top:0em} .margeh0 .titreaccueil {margin-top:0em} #accueil .margehA {padding-top:8em} .margehA .titreaccueil {margin-top:0em} #accueil .galeriemini.margehA {padding-top: 0} /* v sans js */ #accueil .gde { display:block; position:relative; overflow:visible; z-index:600;margin-right:0; width:100%} .H #accueil .gde {display:none} .gde img {width:100%; margin-bottom:5px} .H .gde img { margin-bottom:0} .pet {width:100%; margin-top:100px} .H .pet {width:100%; margin:0; padding:0} .H .galG .pet {float:none} .H .galD .pet {float:none} .galD {margin:0 auto} .pet li {float:none; width:100%; display:block; margin:0; padding:0 0 2em 0} .pet li a {display:block; width:100%; position:relative; margin-bottom:20px} .pet li a i, .pet li a i img { display:none} .pet li a img {width:100%; display:block} .pet li a span {position:relative;} .H .pet li a span {position:relative; /*top:100%;*/ top:0; top:auto; top:unset} #accueil .pet li a span {margin-top:10px; font-size:1.1em; } .pet li a span b { display:none} .liensousgal { float:right; font-size:1.5em; margin-top: 0.5em} .actus {width:80%; position:relative; overflow:visible} .actusint {width:100%; height:auto; position:relative; z-index:10; overflow:visible} .actusint b {display:none} .actusint img, .H .actusint img {position:relative; top:auto; left:auto; width:100%; z-index:10} .actusint .der, .H .actusint .der { display:none} .H .actusint p { display:inline-block; z-index:12; position:relative; top:0; top:auto; left:0; margin:0; left:auto; margin-top:0; margin-left:0; background:none; padding:0; padding-top: 2.5em; width:100%; text-align:left; font-size:0.7em} .actusint p strong {font-size:2em; padding-bottom:0.3em } .actusint p span{font-size:1.3em; padding-bottom:1.3em } .H .actusint div { display:inline-block; position:relative; bottom:0; bottom: unset; right:0; right: unset; left: 0;margin-bottom: 3em} .actusint div a, .actusint div span {background:none; margin-right:2em; font-size:0.7em; padding:1.2em 0em 1.2em 3.1em;} .actusint div a i, .actusint div span i { left: 0em;} .flaccueil { display:none} #extraits {width:80%} .extraitsint {display:block; width:100%; margin:0 auto; padding-top:7em; padding-bottom:10em;} .H .extraitsint {display:none} #extraits h2 {font-size:1.4em; letter-spacing:0.04em; line-height:1.3em; color:#000} #extraits h3 {font-size:1em; letter-spacing:0.04em; line-height:1.3em; padding-top:0.4em; padding-bottom: 0.5em} #extraits p {margin:0; font-size:0.9em; padding-top:1.5em; letter-spacing:0.035em; line-height:1.8em; float:none; width:100%; margin-right:0} /*.votreprojet { display:none} */ .votreprojet {width:80%} .votreprojet li {float:left; width:46%; padding:0 0 2em 0; margin:0; ; margin-right:8%; } .H .votreprojet li {width:46%} .votreprojet .sansmproj, .votreprojet .sansMMobile {margin-right:0} .votreprojet li a {display:block; width:100%; height:auto} .H .votreprojet li a span {position:relative; /*top:100%;*/ top:0; top:auto; top:unset} .votreprojet li a span {margin-top:10px; font-size: 1.1em} .votreprojet li a span b { display: none} .soustitreaccueil {padding-top:8em} .soustitreaccueil span {font-size:2em} .marques {width:100%; padding-top:4em; position:relative;} .marquesgde {width:50%} .H .marquesgde {width:50%} .marquesgde {float:left; position:relative; margin-right:0; overflow:hidden; z-index:600; background:none} .marquesgde img {position:relative; width:100%; top:0; left:0; transform-origin: 50% 50%;} .marquespet {float:right; width:50%; margin:0; padding:0} .marquespet li {float:left; width:50%; display:block; margin:0; padding:0} .marquespet li a {display:block; width:100%; position:relative; text-decoration:none; background:none} .marquespet li a i {display:block; width:100%; height:100%; position:relative; overflow:hidden} .marquespet li a i img {position:relative; display:block; width:100%; top:0; left:0;transform-origin: 50% 50%;} .process, .showrooms {width:80%; padding-top:8em} .titreprocess span {font-size:2.6em;} .listeprocess {margin-top:3em} .listeprocess li {padding:1.6em 0 2.4em 0} .proc-ico {width: 3.5em; height: 3.5em; top: 1.6em} .proc-titre {width: 80%; float: none; padding-left:20%; padding-top: 1em} .proc-titre h3 {font-size: 1.4em} .proc-desc {width: 80%; float: none; margin-right:0; padding-left: 20%; padding-top: 1.5em} .proc-desc p {font-size: 0.95em;} .titreshowrooms span {font-size: 2.3em} .showrooms-titre h3 {font-size: 1.7em} .showrooms-titre span {font-size: 1em; } #amenage, #amenagetitre {display:none} .contgeneralInt {width: 80%; font-size: 0.9em} /* bas */ #bas { width:80%; margin:8em auto 0 auto;} #logobas {width:200px} .basint {margin-top:5em} .basG {width:48%; padding-left:0%} .basG ul li a {font-size: 1.6em} .basD {width:50%} .colbas {float:none; display:block; padding-left:1.2em; padding-right: 1.5em; margin-bottom:0.9em} #lienbas {margin-top:4em; text-align: center} #lienbas a {font-size:2em} .mentions {padding:10em 0 8em 0; font-size:0.8em} /*page int*/ #logoint {width: 200px; padding-top: 29px} /*reas*/ #realisations { position:relative; background-color:#f6f6f6; z-index:1000; padding-top:8em} #realisations .galeriemini {width:92%; margin-left:auto; margin-right:auto; margin-top:0; position:relative;} #realisations .margehA {padding-top:0} /* v sans js */ #realisations .gde { display:block; position:relative; overflow:visible; z-index:600;margin-right:0; width:100%} .H #realisations .gde { display:none} #realisations .pet li a span {margin-top:6px;font-size:1.1em} .titrereas { left:1.4em; margin-top:-3.2em; padding-top:1.1em} .titrereas span { font-size:2.8em} .Projetsuite {margin-top:9em; margin-bottom: 6em; font-size: 0.6em} /* projet */ #projet {width:90%; margin-left:auto; margin-right:auto; padding-top:4.8em; position:relative; z-index:20} #projet h2 {margin-left:0; font-size:1.8em; padding-top: 0.6em} #projet h2 i {width:2em} #projet h1 {margin-left:0; font-size:1.1em; letter-spacing:0.03em; } #projet #i0 {width:100%; margin-left:0; display:block; margin-top:2.5em} #projet .i1 {width:100%; margin-left:0%; margin-top:50px} #projet .i2 {width:100%; margin-top:50px} #projet .i3 {width:100%; margin-right:0; margin-top:50px} #projet .icentre {width:100%; margin:50px auto 0 auto} #projet .ibis1 {width:50%; margin-left:0; margin-top:50px} #projet .ibis2 {width:50%; margin-left:50%; margin-top:0px} #projet .desc {width:100%; margin-top:100px} #projet .desc h3 {font-size:1.6em} #projet .desc p {font-size:0.9em; line-height:1.8em;margin-top:50px} #projet .archi {width:100%; margin-left:0%; margin-top:70px; padding-bottom:70px} #projet .archi img {width:120px; margin-right:auto; margin-left:auto; float:none; display:block} #projet .archint {width:100%; float:none; text-align:center} #projet .archint p {font-size:1em; padding-top:20px} #projet .archint strong {font-size:1.2em; padding-top:15px;} #projet .archint a {font-size:1em} #projet #similaire {width:100%; margin-left:auto; margin-right:auto; margin-top:180px} #projet #similaire h4 {font-size:2em; padding-bottom:40px} #projet #similaire ul { display:block;} #projet #similaire ul li { margin-bottom:50px; display:block; width:50%; float:none; margin-right:auto; margin-left:auto} #projet #similaire ul .der {margin-right:auto} #projet #similaire li a {padding:0; border:10px solid #fff} #projet #suite {width:100%; margin-top:120px;} #suitea { display: none; width:0%; float:none} #suiteb {width:100%; float:none; text-align:center; height:400px} #suite span {font-size:1.2em; background-size:40px; padding-top:22px; padding-bottom:18px;} #suiteb span {margin-right:0px; background-position:100% 50%; padding-right:60px;} #mot {font-size:12em} #precsuiv {display: none} /*#precsuiv, #mot, #mot i { display:none}*/ /* marques */ #marques {width:100%; padding-top:29px; position:relative; z-index:20} #interieurintro{ margin-left:auto; margin-right:auto; width:80%;} #interieurintro h1 {font-size:1.9em} #interieurintro p {font-size:0.9em} #interieurintro p br {display:none} #interieurintro .flsuite {width: 4em; height:4em;} #listemarques li {} #listemarques li a {border:none; font-size:1em; width:100%;overflow:visible} #listemarques li a img {display:block; width:100%; float:none; margin-top:1.3em} #listemarques li a p {display:block; float:none; margin:0; padding:0; margin-top:6em; margin-left:auto; margin-right:auto; width:80%;} #listemarques a strong {font-size:1.8em; margin-left:0;} #listemarques a span {font-size:0.8em; margin-left:0;} /*page int*/ #logomarque {max-width:400px; width:80%; margin:80px auto 30px auto} #interieur .pagereduit {width:80%; margin:0 auto} #interieur .pagereduit2 {width:80%; margin:0 auto} #interieur .grostexte {font-size:1.6em; margin-top:4em; padding-bottom:0em} #interieur .grostexte br { display:none} #interieur .colGint { width:100%; float:none; margin-top:4em} #interieur .colDint { width:100%; float:none; margin-top:4em} #interieur .colGintgalerie { width:47%; float:left; padding-top:0px} #interieur .colDintgalerie { width:47%; float:right; padding-top:9em} .pagereduit h2 {font-size:1.25em} .pagereduit p {line-height:1.7em; font-size:1.1em; margin-top:2.2em} #interieur .margeH1 {margin-top:8em} #interieur .margeB1 {margin-bottom:8em} .pagereduit2 img {margin-bottom:2.5em} .pagereduit2 h3 {font-size:1.6em} .pagereduit2 p {font-size:1.1em} .fdnoir {padding:9em 0 12em 0; margin-top:3em} .fdsans { padding:9em 0 4em 0;} .listeinterieur h3 {font-size:2.1em} .listeinterieur h4 {font-size:1.4em} .listeinterieur ul {width:40%; margin:60px auto 0 auto} .listeinterieur li {width:100%; margin-right:0; float:none; margin-top:40px;} /* nous connaitre */ .fdint1 {margin-top:29px; padding-bottom: 10em; padding-top:5em} .fdint2 {padding-top:5em; padding-bottom:10em} .grandfond .grandfondInt {margin-left:auto; margin-right: auto; width: 80%;} .grandfondInt p {font-size: 1.3em;} .grandfondInt p .sansfacult {display: none} .contgeneral-titre {margin-top:29px;} /*presse*/ #presse {margin-top:70px; padding-bottom:200px} #listepresse {border-top:1px solid #000;} #listepresse li {width:100%; float:none} #listepresse li .lienpresse {padding:30px 0 30px 0} #listepresse li .bordD {border-right:none } #listepresse li .bordT {border-top:none } #listepresse li strong {font-size:1em} #listepresse li i {font-size:0.9em} #listepresse li b { display:none} #croix {top:10px; left:10px} .H #presseAction {left:5%; width:90%} .couv {float:none; width:60%; margin:0 auto} .infospresse {float:none; width:100%} .infospresse .publi1 {font-size:1.2em; text-align:center; padding-top:15px} .infospresse .publi2 {font-size:0.9em; padding-left:0px; text-align:center} .pluspresse { display:block; letter-spacing:0.03em; margin-top:15px; margin-left:0px; text-align:center} .pluspresse a, .pluspresse span {display:inline-block; float:none; width:100%; margin-top:5px; margin-right:2px;background-position:50% 0; background-size:13px; padding:40px 0 8px 0; font-size:0.7em} .extraitspresse {padding-top:120px; padding-bottom:200px} .extraitspresse h2 {font-size:1.3em} .extraitspresse h3 {font-size:1.1em} .extraitspresse p {margin:0; font-size:0.95em; padding-top:25px; letter-spacing:0.025em; line-height:1.8em; float:none; width:100%; margin-right:0} /*contact*/ #contact {height:auto; min-height:100%;} #contact-G {width:90%; margin-left:10%; top:0; top:unset; margin-top:6em; position:relative} #contact-G p#liencontact { font-size:1.8em} #contact-G .lienplus {font-size:0.9em} #contact-D {width:90%; margin-left:10%; right:0; right:unset; bottom:0; bottom:unset; margin-top:8em; position:relative; z-index: 12; margin-bottom:5em} #contact-D .colcontact { margin-right:8%; line-height:1.8em;font-size:0.9em} #contact-D h2 {padding-bottom:1.4em} #titrerdv {padding-top:6em} #rdv h2.titrecontact {font-size:2.2em} #rdv p.soustitrecontact {font-size:0.9em} .scontactInt {width: 70%} .scontactInt h3 {font-size:1.2em} .scontactInt-contenu {padding: 5em 0 5em 0; margin-top: 1.2em} #formulaire2 .titreformulaire {font-size: 1.1em; padding:2.5em 0 0 0} #formulaire2 {width:80%} #formulaire2 .formgauche {width:100%; float:none; margin:0.6em 0 0 0; display: block} #formulaire2 .formdroite {width:100%; float:none; margin:0.6em 0 0 0; display: block} #formulaire2 .labcheckbox2 {padding-left:46px;padding-top: 0.2em} #formulaire2 input.box2 {accent-color:#000; width:24px;border-radius:4px; height:24px} /* slide */ #logoslide {width: 200px; padding-top: 29px; position: relative; left: 0; top: 0; left:unset; top:unset; margin-left:auto; margin-right: auto} .H #logoslide { position:relative} .H #lineslide { visibility:hidden; position:relative; margin-top:3.5em; bottom:0; left:0; height:auto} #lineslide #coteG, #lineslide #coteD { display:none} #flprecslide, #flsuivslide { display:none} #lineslide h1 {position:relative; display:block; height:auto; font-size:2.5em; line-height: 1.4em; color:#fff; padding-bottom:1.5em} .H #lineslide h1 { width:100%; position:relative; bottom:0; left:0; margin-left:0;} #degrade, .H #degrade, #degrade2, .H #degrade2 { display:none} .H #slide {height:auto; width:100%; position:relative; background-color: #000} .H #slideimg {height:auto; width:100%; position:relative; cursor:default; padding-bottom:8em} #slideimg img {width:100%} .H #slideimg img { display:block; width:100%; position:relative; top:0; left:0; width:100%; height:auto; margin-left:0; margin-top:0; z-index:800; visibility:hidden; margin-bottom:20px} #slideprec {display:none} #slidesuiv {position:relative; top:0; top:unset; margin-top:0px; right:0; right:unset; display:block; width:100%; border-top-left-radius:0; border-bottom-left-radius:0; background-color:#fff; color:#000; text-decoration:none; padding:5em 0 15em 0; text-align:center; z-index:890; transform-origin:50% 50%} #slidesuiv b { font-weight:300; font-size:2.6em; letter-spacing:0.025em; line-height:1.5em; display:block; text-align:left; padding-left:2em} #slidesuiv span { margin-left:3em; padding-left:2.9em; font-weight:300; font-size:1.2em; letter-spacing:0.1em; line-height:1.5em; display:inline-block; position:relative} #slidesuiv span i { background-color:#000; height:1px; width:2em; display:inline-block; position:absolute; top:50%; left:0; transform-origin:0 0} .H #slideprec, .H #slidesuiv {visibility:hidden} #pagechoix {padding-top: 6em} .pagechoixInt {width: 80%} #pagechoix h2 {font-size:1.7em; padding-top: 0.8em} #pagechoix h2 i {width:1.5em;} #pagechoix h1, #pagechoix h3 { font-size:1.1em} #pagechoix .margeH {margin-top:5em; padding-top:5em} #pagechoix .margeH2 {margin-top:5em; padding-top:4em} #pagechoix .margeB {padding-bottom:5em} .choixcarres {width:100%; display: block; padding-top:3em} li.choixcarre {width:48%; margin-right:4%; float: left; margin-bottom: 3em} li.choixcarre.ret, li.choixcarre.retMob {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} li.choixcarre.sansM, li.choixcarre.sansMMob {margin-right:0} li.choixrond {width:30%; margin-right:3.3%; float: left; margin-bottom: 3em} li.choixrond.ret, li.choixrond.retMob {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} li.choixrond.sansM, li.choixrond.sansMMob {margin-right:0} .choixblocG {width:100%; float:none; margin-bottom:0em} .choixblocD {width:100%; float:none; margin-bottom:5em} #pagechoix textarea{height:12em; font-size:1.2em; font-size: 16px } .optchoix {font-size: 1em} .autreidee {margin:1.5em 1em 0 1em; position:relative; right:unset; top:unset; font-size: 1em} .etapeAutreidee {width: 80%;} #pagechoix .etapeAutreidee textarea {margin:0; height:7em; font-size: 16px} } @media screen and (max-width:710px) { #MOB3 {display: block} .brmob3 {display:inline} #navcontenu {width:100%; float:none; margin-left:0; padding-top:40px} .navcontG {width:90%; margin-left:10%; float: none} .navcontG ul li a {font-size: 1.6em} .navcontD {width:90%; margin-left:10%; float: none; margin-top: 2em} .colnavcont {float:none; display:block; margin-bottom:1.3em} #liennavcont {margin-top:4em; text-align:left; margin-left:10%} #liennavcont a{font-size:1.4em} .navcontmentions {font-size:0.8em; margin-top:4em; padding-bottom: 6em; line-height: 2.2em} #btS3 {font-size:0.8em} #introAcc-texte {padding-top:9em;} .textecentre {width:85%; margin:0 auto; font-size:0.8em} .textecentre p {line-height:2em; font-size:0.95em;} .titreaccueil span {font-size:2.2em} .liensousgal { float:none; font-size:1.6em;} .liensousgal b { display:block; position:absolute; right: 0; top:0; top:unset; bottom:0; margin-bottom:0.9em; width: 0.6em; height: 0.6em; transform-origin: 50% 50%} #accueil .pet li a span {margin-top:10px; font-size:1em; } .votreprojet li a span {margin-top:10px; font-size:0.9em} .actusint {font-size: 0.8em} .H .actusint p {font-size: 0.7em} .actusint p strong { font-size:1.6em; font-weight:400; font-family:'POP', sans-serif; text-transform:none; } .actusint p span { font-size:1.25em; padding-bottom:1.5em} .H .actusint div {margin-bottom: 3em} .actusint div a, .actusint div span {font-size:0.65em;} .flaccueil { display:none} .extraitsint {padding-top:5em; padding-bottom:8em;} #extraits p {font-size:0.8em; padding-top:2em; letter-spacing:0.03em; } .soustitreaccueil span {font-size:1.6em} .process, .showrooms {width:80%; padding-top:8em} .titreprocess span {font-size:2.2em;} .listeprocess {margin-top:3em} .listeprocess li {padding:1.6em 0 2.4em 0} .proc-ico {width:3em; height:3em; top: 1.8em} .proc-titre {width: 70%; float: none; padding-left:30%; padding-top: 1em} .proc-titre h3 {font-size: 1.1em} .proc-desc {width: 70%; float: none; margin-right:0; padding-left: 30%; padding-top: 1em} .proc-desc p {font-size: 0.8em;} .titreshowrooms span {font-size:1.4em} .showrooms-titre h3 {font-size: 1.2em} .showrooms-titre span {font-size:0.9em; } .contgeneralInt {width: 80%; font-size: 0.7em} #bas { margin:8em auto 0 auto;} .basint {margin-top:5em} .basG {width:100%; float: none} .basG ul li a {font-size: 1.6em} .basD {width:100%; float: none; margin-top: 2em} .colbas {float:none; display:block; margin-bottom:1.3em} #lienbas {margin-top:4em; text-align:left} #lienbas a {font-size:1.4em} .mentions {padding:8em 0 8em 0; line-height: 2.2em} .titrereas { margin-top:-2.8em; padding-top:1.1em} .titrereas span { font-size:2.3em} #projet h2 {font-size:1.4em} #projet h1 {font-size:0.8em} #projet #i0 {width:100%; margin-left:0; display:block; margin-top:2.5em} #projet #similaire ul li {width:70%;} #mot {font-size:8em} #mot, #mot i { display:none} #projet .desc, #projet .archi { font-size: 0.95em} #interieurintro{ margin-left:auto; margin-right:auto; width:90%;} #interieurintro h1 {font-size:1.8em} #interieurintro p {font-size:0.8em} #listemarques li a {font-size:0.9em} #listemarques li a p {width:90%;} /*page int*/ #logomarque {max-width:400px; width:80%; margin:80px auto 30px auto} #interieur .pagereduit {width:80%} #interieur .pagereduit2 {width:80%} #interieur .grostexte {font-size:1.3em; line-height: 1.7em} .pagereduit h2 {font-size:1.1em} .pagereduit p {line-height:1.8em; font-size:0.95em; margin-top:2.2em} #interieur .margeH1 {margin-top:8em} #interieur .margeB1 {margin-bottom:8em} .pagereduit2 img {margin-bottom:2.5em} .pagereduit2 h3 {font-size:1.6em} .pagereduit2 p {font-size:1.1em} .fdnoir {padding:6em 0 9em 0; margin-top:3em} .fdsans { padding:6em 0 2em 0;} .listeinterieur h3 {font-size:1.7em} .listeinterieur h4 {font-size:1.4em} .listeinterieur ul {width:60%; margin:60px auto 0 auto} .listeinterieur li {margin-top:30px;} .grandfond .grandfondInt {width: 80%;} .grandfondInt p {font-size: 1.1em;} .grandfondInt p .sansfacult {display: none} #lineslide h1 {font-size: 1.8em} #slidesuiv b { font-size:1.8em; padding-left:1em} #slidesuiv span { font-size:1em; margin-left:1.5em;} #contact-G {width:90%; margin-left:10%; margin-top:6em} #contact-G h1 {font-size:0.8em} #contact-G p#liencontact { font-size:1.2em} #contact-G .lienplus {font-size:0.7em} #contact-D {width:90%; margin-left:10%; margin-top:6em;margin-bottom:5em} #contact-D .colcontact { margin-right:6%; line-height:1.8em; font-size:0.7em} #titrerdv {padding-top:6em} #rdv h2.titrecontact {font-size:1.6em} #rdv p.soustitrecontact {font-size:0.9em} .scontactInt {width: 90%} .scontactInt h3 {font-size:1.4em} .scontactInt-contenu {padding: 5em 0 5em 0; margin-top: 1.2em; font-size: 0.8em} #formulaire2 .titreformulaire {font-size: 1.1em; padding:2.5em 0 0 0} #formulaire2 {width:80%} #formulaire2 .formgauche {width:100%; float:none; margin:0.6em 0 0 0; display: block} #formulaire2 .formdroite {width:100%; float:none; margin:0.6em 0 0 0; display: block} #formulaire2 .labcheckbox2 {padding-left:38px;padding-top: 0.2em} #formulaire2 input.box2 {accent-color:#000; width:19px;border-radius:4px; height:19px} #message-requete {font-size:1em; top:15px; left:2%; margin-left:0; width:84%; padding:20px 6%; background-size:15px; background-position:96% 15px;} #pagechoix h2 {font-size:1.7em; padding-top: 0.8em} #pagechoix h1, #pagechoix h3 { font-size:0.9em} #pagechoix h4 {font-size:1.4em} li.choixcarre strong {font-size: 0.7em} li.choixrond strong {font-size: 0.7em} .boutonsetapes {font-size: 0.8em} .autreidee {margin:1em 1em 0 1em; font-size:0.95em} #pagechoix textarea{height:19em; font-size:0.85em; font-size: 16px } .optchoix {font-size:0.75em} .etapeAutreidee {width:100%;} #pagechoix .etapeAutreidee textarea {margin:0; height:10em; font-size: 16px} } @media screen and (max-width: 460px) { #introAcc-logo {width:200px; margin-left:0px; top:29px; left:6%; } #logobas {width:200px; margin: 0} #lienbas a, #liennavcont a {font-size:1.2em} #logoint {width: 200px; padding-top: 29px; margin:0 0 0 6%} #logoslide {width: 200px; padding-top: 29px; margin:0 0 0 6%} .titrereas { margin-top:-2.5em; padding-top:1.1em} .titrereas span { font-size:1.8em} .fdint1 {margin-top:29px} .contgeneral-titre {margin-top:29px;} } @media screen and (max-width: 400px) { #lienbas a, #liennavcont a {font-size:1.1em} } @media screen and (max-width: 360px) { #introAcc-logo {width:175px; margin-left:0px; top:32px; /*left:5%;*/ } .actusint div a, .actusint div span {font-size:0.6em;} #logobas {width:175px} #lienbas a, #liennavcont a {font-size:1em} #logoint {width:175px; padding-top:32px; margin:0 0 0 5%} #logoslide {width:175px; padding-top: 32px; margin:0 0 0 5%} .titrereas { margin-top:-2.3em; padding-top:1.1em} .titrereas span { font-size:1.5em} .fdint1 {margin-top:32px} .contgeneral-titre {margin-top:32px;} #contact-G p#liencontact { font-size:1.1em} } .partner-logo{ --gap:2rem; --marginTop: 3em; display: flex; gap: var(--gap, 1rem); margin-block-start: var(--marginTop); >li{ position: relative; display: grid; place-items: center; img{ margin-block: auto; } &:not(:last-child):after{ content: ""; position: absolute; width: 1px; right: calc(var(--gap) / -2) ; /*height: calc(100% - var(--marginTop));*/ height: calc(100%); background-color: rgb(205, 205, 205); /*top: var(--marginTop);*/ top: 0; margin-block: auto; } } }