/* Auteur du developpement sur-mesure pour DOKEVER : Herve Augoyat - https://www.ah-book.com Copie ou modification interdite sans accord ecrit de l'auteur */ #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} /* @media screen and (-webkit-min-device-pixel-ratio:0) and (min-resolution:.001dpcm) { img { image-rendering: -webkit-optimize-contrast !important; } } Unset for Safari 11+ @media not all and (min-resolution:.001dpcm) { @supports (-webkit-appearance:none) and (stroke-color:transparent) { img { image-rendering: unset !important; } }} */ @font-face {font-family:'EF';font-style: normal;font-weight: 100; src: url('../Fontes/EF-100.eot'); src: local(''), url('../Fontes/EF-100.eot?#iefix') format('embedded-opentype'), url('../Fontes/EF-100.woff2') format('woff2'), url('../Fontes/EF-100.woff') format('woff'), url('../Fontes/EF-100.ttf') format('truetype'), url('../Fontes/EF-100.svg#EuclidFlex-Light') format('svg'); } @font-face {font-family:'EF';font-style: normal;font-weight: 300; src: url('../Fontes/EF-300.eot'); src: local(''), url('../Fontes/EF-300.eot?#iefix') format('embedded-opentype'), url('../Fontes/EF-300.woff2') format('woff2'), url('../Fontes/EF-300.woff') format('woff'), url('../Fontes/EF-300.ttf') format('truetype'), url('../Fontes/EF-300.svg#EuclidFlex-Light') format('svg'); } @font-face {font-family:'EF';font-style: normal;font-weight: 400; src: url('../Fontes/EF-400.eot'); src: local(''), url('../Fontes/EF-400.eot?#iefix') format('embedded-opentype'), url('../Fontes/EF-400.woff2') format('woff2'), url('../Fontes/EF-400.woff') format('woff'), url('../Fontes/EF-400.ttf') format('truetype'), url('../Fontes/EF-400.svg#EuclidFlex-Regular') format('svg'); } @font-face {font-family:'EF';font-style: normal;font-weight: 500; src: url('../Fontes/EF-500.eot'); src: local(''), url('../Fontes/EF-500.eot?#iefix') format('embedded-opentype'), url('../Fontes/EF-500.woff2') format('woff2'), url('../Fontes/EF-500.woff') format('woff'), url('../Fontes/EF-500.ttf') format('truetype'), url('../Fontes/EF-500.svg#EuclidFlex-Medium') format('svg'); } @font-face {font-family:'EF';font-style: normal;font-weight: 600; src: url('../Fontes/EF-600.eot'); src: local(''), url('../Fontes/EF-600.eot?#iefix') format('embedded-opentype'), url('../Fontes/EF-600.woff2') format('woff2'), url('../Fontes/EF-600.woff') format('woff'), url('../Fontes/EF-600.ttf') format('truetype'), url('../Fontes/EF-600.svg#EuclidFlex-SemiBold') format('svg'); } body {font-size: 1em; color:#1d1c1b; font-family: 'EF', sans-serif; margin:0; font-weight:400; height:100%; width:100%; position:relative; background-color:#fff; -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; font-variant-ligatures: no-common-ligatures} * { outline: none;} .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} .retMob { display: none} 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} /*::-moz-selection, ::selection { background:#00949a}*/ #testeur {position:fixed; z-index:9999; bottom:0; left:0; padding:7px; font-size:0.7em; letter-spacing:0.1em; display:inline-block; font-family: sans-serif; color:#FFF; opacity:0.5; background-color: #000000; display: none} #CybotCookiebotDialog, .H #CybotCookiebotDialog, #CookiebotWidget, .H #CookiebotWidget {opacity:0; visibility: hidden} #MOB {display:none} #MOB2 {display:none} #MOB3 {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} #remonte {width:46px; height:46px; background-color:#fff; position:fixed; bottom:0px; left:0; z-index:150; 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} #logoHaut {width:55px; position:fixed; top:16px; left: 16px; z-index:150; visibility:hidden; cursor:pointer; -webkit-mix-blend-mode:darken; -moz-mix-blend-mode:darken; -o-mix-blend-mode:darken; -ms-mix-blend-mode:darken; mix-blend-mode:darken} #logoHaut img {width:100%; display: block; transform-origin: 50% 50%; position: relative} #menu {margin:0; padding: 0; position:relative; width: auto; z-index:800; transform-origin:100% 0; background-color: rgba(20,28,37,1); font-size: 0.9em} /*.H #menu {position:absolute; right: 0%; top:32px; background-color: rgba(20,28,37,0); border-bottom-left-radius:10px;margin-right:1.5em}*/ .H #menu {position:absolute; right: 0%; top:0; padding-top: 32px; background-color: rgba(20,28,37,0); border-bottom-left-radius:10px;padding-right:1.5em} #menu li {display: inline-block; float: left; margin: 0; padding: 0} #menu li .am {display:inline-block; padding:1em 1em 0.6em 1em; font-size: 1.1em; font-weight:500; color:#fff; cursor: pointer; line-height: 1.2em; margin:2px 0; letter-spacing: 0.05em} #menu span {display: inline-block; position:relative; padding-bottom: 0.4em; line-height: 1.2em} #menu .am span i {position: absolute; bottom: 0; width: 100%; left:0; height: 2px; background-color:#009de2; transform-origin: 0} #menu .ret {display:block;width: 0; float: none; margin: 0; padding: 0; clear: both; height: 0; line-height: 0} #menu li .cadre {border:2px solid #009de2; border-radius: 50px; margin-left:1em; margin-top: 0; margin-bottom: 0; background-color: rgba(0, 157, 226, 0); display: inline-block; transform-origin: 0 0} #menu .cadre span {} #menu .cadre span i { display: none} #menu li .cadre2 {border:2px solid #009de2; border-radius: 50px; margin-left:1em; margin-top: 0; margin-bottom: 0; background-color: #009de2; display: inline-block; transform-origin: 0 0} #menu .cadre2 span {} #menu .cadre2 span i { display: none} #menu li .mactif {color:#009de2} /*#menu .mactif span i {width:100%; background-color: #009de2}*/ #menu li .menuactifINT {color:#009de2} #menu .menuactifINT span i {width:100%; background-color: #009de2} #menu li #langue {position:relative; padding-right: 2.3em; margin-left:0.2em} #menu #langue img.fl {position:absolute; display: block; top: 50%; margin-top: -0.35em; width: 0.8em; right:1em; transform-origin: 50% 50%} #btmenu {display: none} .H #menu li .am, .H #menu span i {visibility: hidden} #langues {position: fixed; top:7em; right:0.6em; z-index: 99999; background-color:#fff; box-shadow: 1px 1px 18px rgba(0, 0, 0, 0.09); border-radius:1.1em; padding: 0.8em 1.6em} .H #langues {visibility: hidden} #langues li {display: block; border-bottom: 1px solid #dee1e2} #langues li.derligne {border: none} #langues li a {display:inline-block; position: relative; padding: 1em 13px 1em 2.4em; line-height: 1.3em} #langues li a img.drapeau { display: block; position: absolute; top: 50%; left:0em; margin-top:-0.85em; width: 1.7em; border-radius: 50%; transform-origin: 50% 50% } #langues li a span {color: #141c25; font-weight: 500; font-size: 1em; display: inline-block; position: relative} #langues li a.langactif span {color: #009de2; } #navigation {width:100%; height:auto; position:relative; left:0; } .H #navigation {width:100%; height: 100%; position: fixed; left:102%; top: 0; z-index: 200; overflow: hidden} #logonav {position: absolute; top:32px; left:9%; z-index: 201; width:253px;height: auto; display: block} .H #logonav {position: fixed} #logonav img {width: 100%; display: block} .retour {width: 72px; height: 72px; background-color: #009de2; border-radius: 50%; display: block; position: absolute; top: 26px; left:32%; margin-left:-36px; z-index: 600; cursor: pointer; } .retour img {width:100%; display: block; transform-origin: 50% 50%} #navG {float: left; width:32%; height: 100%; overflow: hidden; position: relative; transform-origin: 0; z-index: 100; background-color:#141c25} #navG img {width: 975px; height: 1300px; position: absolute; top:50%; left:0; margin-left:0; margin-top: -650px; z-index:100} #navD {float: right; width: 68%; height: 100%; overflow: hidden; position: relative} #fondnavD {width: 100%; height: 100%; background-color: #141c25; position: absolute; z-index:200; top:0; left:0; transform-origin:0 0 } #navDA, #navDB, #navDC, #navDD #navDE {position:relative; z-index: 201} .H #navDA, .H #navDB, .H #navDC, .H #navDD, .H #navDE { display: none} .navD1 {float: left; width: 40%; margin-top:11.5em; padding-left: 9%; position:relative; z-index: 201} .navD1 ul {display: block; padding-top:0.5em} .navD1 ul li {display: block} .navD1 a {display:inline-block;font-size:1.6em; color:#fff; line-height: 1.6em; padding: 0.15em 0; letter-spacing: 0.05em; font-weight:400; position: relative; overflow: hidden} .navD2 {float: right; width: 48%; margin-top:11.5em; padding-left: 3%; position:relative; z-index: 201} .navD2 ul {display: block; padding-top:0.5em} .navD2 ul li {display: block} .navD2 a {display:inline-block;font-size:1.25em; color:#fff; line-height:1.6em; padding: 0.3em 0 0.1em 0; font-weight:400; position: relative} .navD2 .traitnav {height: 100%; width: 2px; position: absolute; top: 0; left: 0; display: block; transform-origin:100% 100%} .navD2 .traitnav {background-color:#323941} .CRNB .traitnav {background-color:#dfe2e6} .navD1 a i, .navD2 a i {width:0; position: absolute; height: 1px; bottom: 0.1em; left:0; background-color:#fff} #navD strong {color:#87898c; position: relative; display: inline-block; font-weight:400; margin-bottom: 0.8em} .titreminiICO {position: relative; padding-left:3.2em; text-transform: uppercase; font-size:1em; letter-spacing: 0.16em; display: inline-block; line-height: 1.4em; padding-top: 0.4em; padding-bottom: 0.4em} .titreminiICO img {width:2.1em; position: absolute; top:50%; margin-top: -1.05em; left:0} .navD1 .mNAVactif {color:#009de2} .navD1 .mNAVactif i {width:100%; background-color: #009de2} .navD2 .mNAVactif {color:#009de2} .navD2 .mNAVactif i {width:100%; background-color: #009de2} #contactRapideNav { display:block; background-color: #FFFFFF; padding:1.6em 0 1.6em 0; position:relative; z-index:250; width:68%;} .H #contactRapideNav {position: absolute; bottom: 0; right: 0;} .H #RapideNavA, .H #RapideNavB, .H #RapideNavC, .H #RapideNavD, .H #RapideNavE {display: none} .CRNA {float: left; width:40%; padding-left: 9%; line-height:1.8em; -webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} .CRNB {width:48%; padding-left: 3%; float: left; display: block; position: relative} .CRNA strong, .CRNB strong {color:#343d47; position: relative; display: inline-block; font-weight:400; margin-bottom: 0.8em} .CRNA span, .CRNB span {color:#343d47; font-size:1.15em; letter-spacing: 0.07em; padding-top: 0.2em; font-weight:300; line-height: 1.8em; display: inline-block;padding-bottom: 0.1em;} .traitnav {height: 100%; width: 2px; position: absolute; top: 0; left: 0; display: block} .lienTraitA { position: relative; display: inline-block; color:#343d47;} .lienTraitA i {position:absolute; bottom: 0.1em; left: 0; width: 100%; height: 2px; background-color:#009de2; transform-origin: 0} .lienTraitB { position: relative; display: inline-block; color:#fff; font-weight: 500} .lienTraitB i {position:absolute; bottom: 0.1em; left: 0; width: 100%; height: 2px; background-color:#000; transform-origin: 0} .lienTraitC { position: relative; display: inline-block; color:#009de2; font-weight: 500} .lienTraitC i {position:absolute; bottom: 0.1em; left: 0; width: 100%; height: 2px; background-color:#000; transform-origin: 0} .H #navG, .H #navG img, .H #logonav, .H #fondnavD, .H .retour, .H #contactRapideNav {visibility: hidden} /* commun */ .ext1 {width:82%; margin-left: auto; margin-right: auto} .ext2 {width:66%; margin-left: auto; margin-right: auto} .fondgris { background-color:#f5f7f7} .fondgris2 { background-color:#eaebec} .coulA {color:#1085cf} .coulB {color:#000 } .coulC {color:#fff } .coulD {color:#797f81 } .brmob {display: none} .paddH23 {padding-top:23em} .paddH18 {padding-top:18em} .paddH15 {padding-top:15em} .paddH13 {padding-top:13em} .paddH12{padding-top:12em} .paddH11 {padding-top:11em} .paddH10 {padding-top:10em} .paddH9 {padding-top:9em} .paddH8 {padding-top:8em} .paddH7 {padding-top:7em} .paddH65 {padding-top:6.5em} .paddH6 {padding-top:6em} .paddH4 {padding-top:4em}.paddH2 {padding-top:2em} .paddB17 {padding-bottom:17em} .paddB15 {padding-bottom:15em} .paddB12 {padding-bottom:12em} .paddB11 {padding-bottom:11em} .paddB10 {padding-bottom:10em} .paddB8 {padding-bottom:8em} .paddB7 {padding-bottom:7em} .paddB4 {padding-bottom:4em} .paddB3 {padding-bottom:3em} .margH18 {margin-top: 18em} .margH17 {margin-top:17em}.margH15 {margin-top:15em}.margH13 {margin-top:13em}.margH11 {margin-top:11em} .margH9 {margin-top:9em} .margH8 {margin-top:8em} .margH7 {margin-top:7em}.margH6 {margin-top:6em}.margH4 {margin-top:4em} .margH3 {margin-top:3em} .margB108{margin-bottom:1.8em} .margB1{margin-bottom: 1em} .paddL3 {padding-left: 3em} .Texteselect {-webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} .H .ano0 {visibility: hidden} .H .anSX0 {visibility: hidden; transform-origin:0 0 } .H .anSX1 {transform-origin:0 0 } .H .ans1 {visibility: hidden; transform-origin:50% 50% } .contextimg {overflow: hidden} .H .any1, .H .any2, .H .any3 {visibility: hidden; transform-origin: 50% 50% } .H .anys1 {visibility: hidden; transform-origin: 50% 50% } .H .anScale {transform-origin:50% 50% } .animeTitre {line-height:0.9em; display:inline-block} .animeTitre span { position: relative; display:inline-block; overflow: hidden; line-height: 1em; padding-bottom: 0.01em} .animeTitre b {display: inline-block} .H .animeTitre b {visibility:hidden} /* ******** ACCUEIL 1 */ .animeTitreAC1 {line-height:0.9em; display:inline-block} .animeTitreAC1 span { position: relative; display:inline-block; overflow: hidden; line-height: 1em; padding-bottom: 0.01em} .animeTitreAC1 b {display: inline-block} .H .animeTitreAC1 b {visibility:hidden} .infoAC1 .AC1b2 {position:absolute; top:0; left: 0} .infoAC1 .AC1b2init {position: relative} /* ******** fin ACCUEIL 1 */ /* ******** ACCUEIL 2 */ .animeTitreAC2 {line-height:0.9em; display:inline-block} .animeTitreAC2 span { position: relative; display:inline-block; overflow: hidden; line-height: 1em; padding-bottom: 0.01em} .animeTitreAC2 b {display: inline-block} .H .animeTitreAC2 b {visibility:hidden} /* ******** fin ACCUEIL 2 */ /* suite accueil */ #intro {width: 100%; height: auto; min-height: 600px; overflow: hidden; position: relative} .H #intro {width: 100%; height: 100%; min-height: 100%; position: relative; overflow: hidden} #logo {width:253px; height: auto; display: block; position: absolute; top:32px; left:9%; z-index:31} #logo img {width: 100%; display: block} #video {z-index:8} .gal01 {z-index: 8} .H .gal01 { visibility: hidden} /* ******** ACCUEIL 1 */ #introintAC1 {padding-top: 14em; margin-left: 9%; position: relative; z-index: 15} #introintAC1 h2 {font-size:3.6em; color:#fff; position: relative; font-weight:500; padding:0em 0 0em 1em; float: left; display: inline-block} #introintAC1 h2 b {font-weight:500; line-height:1.2em} #introintAC1 h2 i {width: 1px; background-color: #fff; height: 100%; position: absolute; top: 0; left: 0; transform-origin: 100% 100%} #introintAC1 h2 #dokAC1 {width:1.6em; display: block; margin-top: 0.7em} #introintAC1 h2 .infoAC1 {color:#009de2; font-size: 0.6em; margin-top:0.2em} /* ******** fin ACCUEIL 1 */ /* ******** ACCUEIL 2 */ #introintAC2 { position: absolute; bottom: 10%; left: 5%; position:absolute; z-index: 15} #introintAC2 h2 {font-size:2.2em; color:#fff; position: relative; font-weight:300; padding:0em 0 0em 1em; float: left; display: inline-block} #introintAC2 h2 b {font-weight:300; line-height:1.2em} #introintAC2 h2 i {width: 1px; background-color: #fff; height: 100%; position: absolute; top: 0; left: 0; transform-origin: 100% 100%} #animAC2 {width:500px; position: relative; margin-top: 10em; margin-left: auto; margin-right: auto;z-index: 16} #dok00 {width: 360px; height: auto; position: relative; margin: 0 auto; margin-bottom: 0em} #dok01, #dok02 {width:100%; height: auto; display: block; position: absolute; top: 0; left: 0} #dok03 {width: 100%; position: relative; text-align: center; line-height:0.9em; display:block; font-size:2.6em; color:#fff; text-transform: uppercase; letter-spacing: 0.17em} #dok03 span { position: relative; display:block; width: 100%; overflow: hidden; line-height: 1em; padding-bottom: 0.01em} #dok03 span b {display: inline-block; position: absolute; top: 0; left: 0; width: 100%; text-align: center} #dok03 span b.dok03binit {position: relative} #dok03 span b, .H #dok03 span b { visibility: hidden} .H #dok01, .H #dok02 {visibility: hidden} #degrade3{width:100%; height:100%; position: absolute; top: 0; left: 0; z-index:11; background: -moz-radial-gradient(center, ellipse cover, rgba(22,28,40,0.4) 0%, rgba(22,28,40,0) 50%); background: -webkit-gradient(radial, center center, 0px, center center, 50%, color-stop(0%, rgba(22,28,40,0.4)), color-stop(100%, rgba(22,28,40,0))); background: -webkit-radial-gradient(center, ellipse cover, rgba(22,28,40,0.4) 0%, rgba(22,28,40,0) 50%); background: -o-radial-gradient(center, ellipse cover, rgba(22,28,40,0.4) 0%, rgba(22,28,40,0) 50%); background: -ms-radial-gradient(center, ellipse cover, rgba(22,28,40,0.4) 0%, rgba(22,28,40,0) 50%); background: radial-gradient(ellipse at center, rgba(22,28,40,0.4) 0%, rgba(22,28,40,0) 50%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#161c28', endColorstr='#161c28', GradientType=1 ); } /* ******** fin ACCUEIL 2 */ #introint {padding-top: 14em; margin-left: 9%; position: relative; z-index: 15} #introint h2 {font-size:3.6em; color:#fff; position: relative; font-weight:100; padding:0.6em 0 0.6em 1em} #introint h2 b {font-weight:100; line-height:1.2em} #introint h2 i {width: 1px; background-color: #fff; height: 100%; position: absolute; top: 0; left: 0; transform-origin: 100% 100%} #introint h2 .mini {color:#009de2; font-size: 0.65em} #introint h2 .mini b {padding-bottom: 0.3em; padding-top: 0.5em} #introdefile {position: relative; z-index: 16;background-color: #f5f7f7;} .H #introdefile {position: absolute; bottom: 0; right: 0; width: 50%; background-color: #f5f7f7; z-index: 16; transform-origin: 0 0} #introdefileInt {position: relative; overflow: hidden; min-height: 224px} #introdefilecontenu {display: block; padding: 1.7em 0 1em 2.5em; margin-right: 120px; position: relative; z-index: 3} .H .infosDefile {display: none} .H #infosDefile01 {display: block} #introdefile h2 {color:#009de2; font-weight: 500; line-height: 1.6em; font-size: 1.35em; display: block} #introdefile p {color:#161313; font-weight: 300; line-height: 1.5em; font-size: 1.5em; padding-top:0.2em; padding-bottom: 0.3em; display: block; margin: 0; min-height:3.5em} .bt1 {position: relative; color:#161313; padding-top:1.3em; padding-bottom: 1.3em; border-radius:7px; line-height:0.85em; font-size: 0.8em; overflow: hidden; display: inline-block} .bt1 strong {position: relative; padding-right:6em; font-weight:400; text-transform: uppercase; letter-spacing: 0.14em; z-index: 2} .bt1 strong span {display: inline-block} .bt1 strong img {display:block; width: 1.4em; position: absolute; right:3em; top:50%; margin-top: -0.7em} .bt1 i { display: block; border-radius: 50%; background-color:#161c28;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} #defileFleches {position: absolute; top: 0; width:112px; height: 100%; background-color: #eaecec; right: 0; z-index: 3} #defileSuivant {width:112px; height: 112px; background-color: #dee1e2; position:relative; display: block; overflow: hidden; cursor: pointer} #defilePrecedent {width:112px; height: 112px; background-color: #eaecec; position:relative; display: block; overflow: hidden; cursor: pointer} #defileSuivant img, #defilePrecedent img {width: 1.2em; position:absolute; top: 50%; left: 50%; margin-top: -0.6em; margin-left: -0.6em; z-index: 5} #defileSuivant i, #defilePrecedent i { display: block; border-radius: 50%; background-color:#fff;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} #ronddefile {background-color:#009de2;width:100%; height:5px; position: absolute; top:0; left:0; transform-origin:0 0; z-index: 1; visibility: hidden} #degrade1{width:100%; height:500px; position: absolute; top: 0; left: 0; z-index:10; background: -moz-linear-gradient(top, rgba(22,28,40,0.5) 0%, rgba(22,28,40,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(22,28,40,0.5) 0%,rgba(22,28,40,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(22,28,40,0.5) 0%,rgba(22,28,40,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#161c28', endColorstr='#161c28',GradientType=0 ); /* IE6-9 */ } #degrade2{width:70%; height:100%; position: absolute; top: 0; left: 0; z-index:10; background: -moz-linear-gradient(left, rgba(22,28,40,0.75) 0%, rgba(22,28,40,0) 100%); background: -webkit-linear-gradient(left, rgba(22,28,40,0.75) 0%,rgba(22,28,40,0) 100%); background: linear-gradient(to right, rgba(22,28,40,0.75) 0%,rgba(22,28,40,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#161c28', endColorstr='#161c28',GradientType=1 ); } .H #logo, .H #intro, .H #video, .H #degrade1, .H #degrade2 {visibility: hidden} .H #page { visibility: hidden} .titre01 {color:#1085cf; font-size:2.6em; line-height: 1.3em; font-weight: 300; position: relative; display: inline-block; padding-left:1.4em} .titre01 i {position: absolute; top:0.65em; width:1em; height: 2px; left: 0; background-color: #000; display: block} .titre02 {color:#161313; font-size:1.6em; letter-spacing: 0.01em; line-height: 1.65em; font-weight: 300; padding-top: 0.6em} .titre03 {color:#fff; font-size: 2.6em; letter-spacing: 0.025em; line-height: 1.3em; font-weight: 300; position: relative; display: inline-block; padding-left:1.4em} .titre03 i {position: absolute; top:0.65em; width:1em; height: 2px; left: 0; background-color: #000; display: block} .titre04 {color:#fff; font-size:1.6em; letter-spacing: 0.01em; line-height: 1.65em; font-weight: 300; padding-top: 0.3em} .titre05 {color:#fff; font-size:3em; line-height: 1.4em; font-weight: 300; position: relative; display: inline-block} .reduittexte {font-size: 0.85em; line-height:1.8em} .listedomaine {display: block; margin-top:4.5em} .listedomaine li {float: left; position: relative; overflow: hidden} .listedomaine .listeP1 {width:59%; margin-right:1%; height: 300px; background-color: #1a3e60; margin-bottom: 10px} .listedomaine .listeP2 {width:39%; margin-right:1%; height: 300px; background-color: #1a3e60; margin-bottom: 10px} .listedomaine .listeP3 {width:19%; margin-right:1%; height: 300px; background-color:#1a3e60; margin-bottom: 10px} .listedomaine .listePSEUL, .listedomaine .listePSEUL2 {width:19%; margin-right:1%; height: 300px; background-color:#009de2; margin-bottom: 10px} .listedomaine .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} .listedomaine li .cal {z-index: 10} .listedomaine li a {display: block; width: 100%; height: 100%; position: relative; overflow: hidden} .listedomaine li .nom {position: absolute; bottom:1.8em; left:1.5em; font-size: 1.45em; color:#fff; font-weight: 400; letter-spacing: 0.03em; z-index: 20; display: inline-block} .listedomaine .listeP3 .nom {letter-spacing: normal} .listedomaine .listePSEUL span, .listedomaine .listePSEUL2 span {color:#fff; text-align: center; font-size: 1.15em; font-weight:300; display: block; line-height: 1.8em; letter-spacing: 0.02em} .listedomaine .listePSEUL span strong, .listedomaine .listePSEUL2 span strong {font-size:1.8em; font-weight: 300} .listedomaine li b {position: absolute; bottom:1.5em; right:1.4em; font-size: 1.45em; z-index: 20; width:40px; height:40px; overflow: hidden} .listedomaine li b img {width:80px} .listedomaine li i{width:100%; height:100%; position: absolute; display: block; bottom: 0; left: 0; z-index:11; background: -moz-linear-gradient(bottom, rgba(22,28,40,0.8) 0%, rgba(22,28,40,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(bottom, rgba(22,28,40,0.8) 0%,rgba(22,28,40,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to top, rgba(22,28,40,0.8) 0%,rgba(22,28,40,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#161c28', endColorstr='#161c28',GradientType=0 ); /* IE6-9 */ } .servicesPlus {float: left; width:48%; padding-left:11%; margin-top: 3em} .depliA {font-weight:300; color:#161313; font-size: 1.3em; padding:1.3em 0; border-top:1px solid #009de2; position: relative; display: block; width:100%; line-height: 1.4em; cursor: pointer; z-index: 30} .depliAder {border-bottom:1px solid #009de2} .depliA span {display:block; margin-right: 3em; margin-left: 2.4em; letter-spacing: 0.025em} .depliA .v {width:0.9em;position: absolute; display: block; top:1.4em; left: 0; transform-origin: 50% 50%} .depliA .cerclePlus2 {width:0.9em;position: absolute; display: block; top:1.4em; right: 0; border:1px solid #fff; border-radius: 50%; transform-origin: 50% 50%} .depliA .cerclePlus2 img {display: block; width: 100%; transform-origin: 50% 50%} .depliB {padding-top:1em; padding-bottom: 3em; position: relative; z-index: 20; width:100%; font-size: 1.2em; line-height:1.8em; color:#393939} .H .depliB {display: none} .depliB p {margin: 0; padding: 0; display: block} .depliB p strong, .depliB li strong {color:#000; font-weight: 500} .depliB ul {margin:0; padding: 0; display: block; margin-bottom: 1.5em} .depliB li { padding-left:1.1em; background-image: url("../Images/fl22.png"); background-repeat: no-repeat; background-size: 0.45em; background-position: 0 0.7em} .depliB li a {color:#009de2; font-weight: 500} .bt2 {position: relative; color:#fff; padding-top:1.4em; padding-left: 1.8em; padding-bottom: 1.4em; border-radius:7px; line-height:0.85em; font-size: 0.65em; overflow: hidden; display: inline-block; background-color: #161c28} .bt2 strong {position: relative; padding-right:6em; font-weight:400; text-transform: uppercase; letter-spacing: 0.14em; z-index: 2} .bt2 strong span {display: inline-block} .bt2 strong img {display:block; width: 1.4em; position: absolute; right:2.8em; top:50%; margin-top: -0.7em} .bt2 i { display: block; border-radius: 50%; background-color:#fff;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} .bt3 {position: relative; color:#fff; padding-top:1.5em; padding-left: 1.8em; padding-bottom: 1.5em; border-radius:7px; line-height:0.85em; font-size: 0.8em; overflow: hidden; display: inline-block; background-color: #0581b8} .bt3 strong {position: relative; padding-right:6em; font-weight:500; text-transform: uppercase; letter-spacing: 0.21em; z-index: 2} .bt3 strong span {display: inline-block} .bt3 strong img {display:block; width: 1.4em; position: absolute; right:2.8em; top:50%; margin-top: -0.7em} .bt3 i { display: block; border-radius: 50%; background-color:#161c28;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} .bt4 {position: relative; color:#161313; padding-top:1.5em; padding-left: 1.8em; padding-bottom: 1.5em; border-radius:7px; line-height:0.85em; font-size: 0.8em; overflow: hidden; display: inline-block; background-color: #fff} .bt4 strong {position: relative; padding-right:6em; font-weight:500; text-transform: uppercase; letter-spacing: 0.21em; z-index: 2} .bt4 strong span {display: inline-block} .bt4 strong img {display:block; width: 1.4em; position: absolute; right:2.8em; top:50%; margin-top: -0.7em} .bt4 i { display: block; border-radius: 50%; background-color:#161313;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} .citation {float: right; width:33.5%; margin-right: 0.5%; margin-top:1.9em} .citation p {color:#161313; font-size: 1.45em; font-weight: 300; display: block; margin: 0; padding: 0; line-height: 2em} .citation .cotes{color:#009de2; font-size:1.3em; display: inline-block; line-height: 0.5em} .citation .qui{color:#009de2; font-size:1.1em; font-weight: 400; display: block; padding-top: 1em; line-height: 1.6em} .citation .qui strong {font-weight: 500} .bandeau-ext {width: 100%; position: relative; padding-top:7.5em} .bandeauG {width: 35%; padding-left: 9%; padding-right: 6%; /* ext1 82% */ background-color: #009de2; position: absolute; top: 0; left: 0; z-index: 20; padding-top: 3.7em; padding-bottom: 3.7em} .bandeauG .margeBas01 {margin-bottom: 5em} .bandeauG .margeBas02 {margin-bottom: 2em} .bandeau-fond {position: relative; overflow: hidden; z-index: 19; background-color: #19242A} .bandeauD {position: relative; margin-left: 58.5%; color: #fff; z-index: 20; padding-bottom:25em; padding-top:8.5em} .bandeauD p {font-size: 1.15em; line-height: 1.9em; color:#fff; padding:1.5em 0 0 0; margin: 0} .bandeauD ul {margin:0; padding: 0; display: block; font-size: 1.15em} .bandeauD li { padding-left:1.1em; background-image: url("../Images/fl22.png"); background-repeat: no-repeat; background-size: 0.45em; background-position: 0 0.7em; line-height: 1.9em} #references{} #references h4 {display: block; text-align: center; font-size:1.75em; font-weight:500; padding-bottom: 1.5em; letter-spacing: 0.02em} #references ul { margin-top: 4em} #references li {width: 18.8%; margin-right: 1.5%; margin-bottom: 1em; float: left} #references .der {margin-right: 0} #references li img {width: 100%; display: block} .animeTitreFlux {line-height:0.8em; display:inline-block} .animeTitreFlux span { position: relative; display:inline-block; overflow: hidden; line-height: 0.8em; padding-bottom: 0.01em; } .animeTitreFlux b {display: inline-block} .H .animeTitreFlux b {visibility:hidden} #mosaique {position: relative; margin-top: 15em} #mosaiqueG {width: 50%; float: left; position: relative; z-index: 10} .M01 {width: 40%; float: left; position: relative; overflow: hidden} .M02 {width: 20%; float: left; position: relative; overflow: hidden} .M03 {width: 20%; float: left; position: relative; overflow: hidden} #mosaiqueG img {width: 100%; position: relative; transform-origin: 50% 50%} #mosaiqueD {width: 50%; float: right; position: relative; overflow: hidden; z-index: 10} .Mnoir {width: 20%; position: absolute; top:0; right: 20%; background-color: #000000; z-index: 11; transform-origin: 0 0} .Mbleu {width: 20%; position: absolute; top:0; right: 0%; background-color: #009de2; z-index: 11; transform-origin: 100% 100%} .Mbleu2 {width: 20%; position: absolute; top:0; right: 20%; background-color: #009de2; z-index: 11; transform-origin: 0 0} #mosaiqueD .fondMD {width: 100%; position: relative; transform-origin: 50% 50%; z-index: 10} #mosaiqueD strong {font-size:5em; color:#fff; position: relative; font-weight:600; position: absolute; top: 0; right: 30%; z-index: 12} #mosaiqueD strong b {font-weight:600; line-height:0.85em; padding-bottom: 0.2em} .H #mosaiqueG, .H #mosaiqueD {visibility: hidden} #mosaique .bt5 {position: absolute; top: 0; left:50%; margin-left: -50px; z-index: 20; color:#fff; line-height:0.85em; font-size: 1.4em; display:inline-block; background-color: #009de2; overflow: hidden; } .bt5 strong {position: relative; padding-right:3.9em; font-weight:300; letter-spacing: 0.025em; padding-top:1.1em; padding-left: 1.3em; padding-bottom: 1.1em; display: inline-block; line-height: 1.6em} .bt5 strong span {display: inline-block; position: relative; z-index: 10} .bt5 strong img {display:block; width: 1em; position: absolute; right:1.8em; top:50%; margin-top: -0.5em; z-index: 10} .bt5 i { display: block; border-radius: 50%; background-color:#161313;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} /* page int */ .titreInt01 {color:#009de2; font-size:0.9em; letter-spacing: 0.03em; font-weight:500; line-height: 1.6em; text-transform: uppercase; padding-bottom: 0.8em} .titreInt02 {color:#161313; font-size:2.2em; font-weight: 300; line-height: 2em;} .titreInt03 {color:#161313; font-size:2.2em; font-weight: 300; line-height:1.6em; display: block} .titreInt05 {color:#161313; font-size:2.2em; font-weight: 300; line-height:1.6em; display: block} .titreInt05bis {color:#161313; font-size:2.2em; font-weight: 300; line-height:1.6em; display: block; position: relative; padding-left: 50px} .titreInt05bis i {width: 2px; height: 100%; background-color:#009de2; display: block; position: absolute; top: 0; left: 0} .extInt01 .ppadd50 {padding-left: 50px; display: block} .titreInt04 {color:#161313; font-size:2.2em; font-weight: 300; line-height:1.6em; display: block; text-align: center} .titreInt06 {color:#161313; font-size:1.6em; font-weight: 500; line-height:1.6em; display: block} .surligne {position: relative; display: inline-block; color:#009de2; font-weight: 300;} .surligne i {width: 100%; height: 2px; background-color: #009de2; position: absolute; bottom:0.2em; left:0; transform-origin: 0 0} .videointA {position:relative; cursor:pointer} .playvideo {width:6em; height:auto; display:block; position:absolute; top:50%; left:50%; margin-top:-3em; margin-left:-3em; z-index:9001; transform-origin: 50% 50%} .videointA video {width: 100%; height: auto; position:relative; z-index:9000; cursor:pointer} .videoCarre {width:50%; margin-left: auto; margin-right: auto} .videoCarre h4 {display: block; text-align: center; font-size:1.75em; font-weight:500; padding-bottom: 3em; letter-spacing: 0.02em} .extInt01 {width: 88%; margin-left: auto; margin-right: auto; display: block} .decale01 {margin-left: 25%} .decale02 {margin-left: 30%; margin-right: 10%} .par01 {float: left; width: 45%; margin-left: 5%; margin-top:3.7em} .extInt01 p {color:#161313; font-size: 1.15em; line-height:2.05em; font-weight: 300; padding-top:0; padding-bottom: 0; margin: 0} .extInt01 p strong {font-weight: 500; color:#009de2; position:relative; display: inline-block} .extInt01 p .coulB {color:#000} .extInt01 p .gras {font-weight: 500} .extInt01 p .gras2 {font-weight: 600} .extInt01 p strong i {width: 100%; height: 2px; background-color: #009de2; position: absolute; bottom:0.2em; left:0; transform-origin: 0 0} .extInt01 p .mini {font-size: 0.9em} .extInt01 p a.lien01 {color:#000; font-weight: 500; text-decoration: underline} .extInt01 p a.lien01:hover {color:#009de2; font-weight: 500; text-decoration:none} .extInt01 p a.lien02 {color:#009de2; font-weight: 500; text-decoration: underline} .extInt01 p a.lien02:hover {color:#000; font-weight: 500; text-decoration:none} .listesecteur { margin-top: 3em} .listesecteur li {position: relative; font-size: 1.3em; font-weight: 300; color:#161313; padding: 0.7em 2.5em 0.6em 2.2em; display: inline-block; margin-bottom:0.5em} .listesecteur li img {position: absolute; top: 0.6em; width:1.7em; left: 0; display: block} .listeE {} .listeE li {display: block; padding-bottom: 1em; line-height: 1.8em} .listeE li a {display: block; border-radius:9px; background-color: #fff; padding:1.6em 0; position: relative} .listeE li a .colE1{display:block; float: left; width: 30%; margin-left: 3%; color:#161313;font-size: 1.5em; font-weight: 300} .listeE li a .colE2{display:block; float: left; width: 22%; margin-left: 1%; color:#757575;font-size: 1em; font-weight: 300; padding-top: 0.1em} .listeE li a .colE3{display:block; float: left; width: 33%; margin-left: 1%; color:#757575;font-size: 1em; font-weight: 300; padding-top: 0.1em} .listeE li a .colE3 img {width: 1.9em; display:block; margin-right:0.3em; float: left} .listeE li a .colE3 b {display: inline-block; padding-left:0.3em; font-weight: 300} .listeE li a .colE3 i.ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} .listeE li a .flecheE {position: absolute; top:50%; right: 4%; width: 1.1em; margin-top: -0.55em; transform-origin: 50% 50%} #visuCarresExt {position: relative; width: 100%; overflow: visible; padding-bottom:2em} #visuCarres {position: relative; width: 100%; height:500px; overflow: hidden} .fondVC {width: 100%; display: block; transform-origin:50% 50%; position: relative; z-index: 5} #visuCarresExt strong {font-size:6em; color:#fff; position: relative; font-weight:600; position: absolute; bottom:0.7em; left:11%; z-index: 12} #visuCarresExt strong b {font-weight:600; line-height:0.85em; padding-bottom: 0.2em} .VCnoir {width: 12%; position: absolute; bottom:0; right: -3%; background-color: #000000; z-index: 11; transform-origin: 0 0} .VCbleu {width: 12%; position: absolute; bottom:0; right: 9%; background-color: #009de2; z-index: 11; transform-origin: 100% 100%} .VCbleu2 {width: 12%; position: absolute; bottom:0; right: -3%; background-color: #009de2; z-index: 11; transform-origin: 0 0} .VCbleu3 {width: 12%; position: absolute; top:0; left: 17%; background-color: #009de2; z-index: 11; transform-origin: 0 0} .VCbleu4 {width: 12%; position: absolute; bottom:0; left:5%; background-color: #009de2; z-index: 11; transform-origin: 0 0} .H #visuCarres {visibility: hidden} .partG {width: 45%; float: left} .partD {width: 45%; float: right} .partG2 {width: 48%; float: left} .partD2 {width: 48%; float: right} .imagefull {width: 100%; display: block} .galerieG {width: 49%; float: left} .galerieD {width: 49%; float: right} .ga {width: 100%} .gb {width: 60%} .servicesPlusInt {width:56%; margin-top: 3em} .servicesPlusInt .depliB p {margin: 0; padding: 0; display: block; font-size: 1em; line-height: 1.8em} .servicesPlusInt .depliB p strong, .servicesPlusInt .depliB li strong {color:#000; font-weight: 500} .ressources {} .ressources .col {width: 30%; margin-right: 5%;float: left; padding-top:7em} .ressources .colsansM {margin-right: 0} .imgcol {width: 100%; display: block;} .ressources h5 {color:#fff; font-weight: 500; line-height: 1.6em; padding: 0.6em 0.5em 0.6em 3.4em; font-size: 1.3em; background-color: #009de2; position: relative; display: block; margin: 1.8em 0 1.5em 0} .ressources h5 img {width: 0.9em; position: absolute; top:0.95em; left:1.5em} .ressources ul {margin:0; padding: 0; display: block; margin-bottom:0; color:#161313; font-size: 1.15em; line-height:2.05em; font-weight: 300} .ressources li { padding-left:1.1em; background-image: url("../Images/fl22.png"); background-repeat: no-repeat; background-size: 0.45em; background-position: 0 0.8em; display: block} .services { display: block; margin-top:5em; width: 100%} .services li {width:19%; margin-right:0.5%; margin-left:0.5%; display: block; float: left; margin-bottom: 1em; position: relative; overflow: hidden} .margeBservices {margin-bottom: 1em} .services li a {background-color: #fff; display: block; font-weight: 400; text-align: center; position: relative; overflow: hidden} .services li span {color:#009de2; display:inline-block; text-align: center; font-size: 1.35em; line-height: 1.8em; position: relative; z-index: 10} .services li a i{ display: block; border-radius: 50%; background-color:#009de2;width:500px; height: 500px; position: absolute; bottom:0; right:50%; transform-origin: 50% 50%; margin-bottom: -250px; margin-right: -250px; z-index: 1; visibility: hidden} .services li b {width:100%; display: block; position: relative; overflow: hidden} .services li img {width:100%; display: block; transform-origin: 50% 50%} .services .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} /* blanc */ #introBlanc {width: 100%; height: auto; position: relative} #introBlancint {width:82%; padding-top: 12em; padding-bottom: 7em; position: relative; margin-left:auto; margin-right: auto} #introBlanc h2 {font-size:3.6em; color:#1d1c1b; position: relative; font-weight:100; padding: 0; margin: 0 0 0 1em} #introBlanc h2 b {font-weight:100; line-height:1.2em} #introBlanc h2.plusfort {font-weight:500; font-size:3.2em; } #introBlanc h2.plusfort b {font-weight:500; line-height:1.4em} #introBlanc h2 .mini2 {color:#009de2; font-size: 0.25em; text-transform: uppercase; letter-spacing: 0.07em; font-weight:400} #introBlanc h2 .mini2 b {padding-bottom: 1em; font-weight:400} #introBlanc h2 strong {color:#009de2; font-weight:100} #introBlanc h2.plusfort strong {font-weight:500} .traitbleuintro {width:1px; background-color: #009ed7; height:34%; position: absolute; top:13em; left: 9%; transform-origin: 100% 100%; z-index: 2} .visuintroBlanc {width: 100%; position: relative; z-index: 1} .H #introBlanc .traitbleuintro, .H .visuintroBlanc {visibility: hidden} #introBlanccontact {padding-top: 11em} #bas {width: 100%; background-color: #161d29; position: relative; z-index: 20; -webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} .logobas {width:253px; height: auto; display: block; position: relative; margin-left:9%; float: left} .logobas img {width: 100%; display: block} .bascontact { display: inline-block; float: left; margin-left: 1.8%; border-left: 2px solid #262d38; padding-left:2.5%} .basreseaux { display: inline-block} .basreseaux li {margin-right: 1.3em; display:inline-block; float: left} .basreseaux a {width:2.9em; height: auto; border-radius: 50%; display: block; border: 1px solid #4e535c; transform-origin: 50% 50%} .basreseaux a img {width: 100%; display: block; transform-origin: 50% 50%;} .basreseaux .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} .bascoord {display:inline-block; padding-top:2.5em} .bascoord li {display: block; padding-bottom: 0.9em} .bascoord li a, .bascoord li span {color:#bfc0c0; font-size: 1.2em; font-weight:300; line-height: 1.6em; letter-spacing: 0.06em; display: inline-block} .basD {width:46%; padding-left:4%; float:right; background-color: #080a0e;padding-bottom: 5em} #basacces { display: block} #basacces li { display: block; margin-bottom: 2em} #basacces li a { display:inline-block; font-size: 1.65em; letter-spacing: 0.05em; color:#fff; font-weight: 300; position: relative; padding-left:1.35em; line-height: 1.4em} #basacces li a span {position:relative; display: inline-block; padding: 0.3em 0} #basacces li a span i {position: absolute; display: block; left:0; bottom:0.1em; height: 3px; background-color: #009de2; width:100%; transform-origin: 0 0} #basacces li a img {position:absolute; top: 0.8em; width: 0.6em; left: 0; transform-origin: 50% 50%} #basliste { position:relative; margin-top:15em; font-size:0.95em; letter-spacing: 0.025em; display: block} #basliste li { display: inline-block; float: left; padding-right:1.3em} #basliste li span, #basliste li a { color:#bfbfbf; font-weight: 400; line-height: 1.8em; padding: 0.4em 0 0.4em 0; position: relative; display: inline-block;} #basliste .ret, #basliste .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} #demande {background-color: #fff} .demandeG {width: 50%; float: left; background-color: #192b2a; position: relative} .demandeGint {width: 100%; height: 100%; position: relative; overflow: hidden; z-index:9} .demandeG .cal {z-index: 9} .demandeG h3 {color:#fff; font-size: 3.2em; font-weight: 500; line-height: 1.4em; display: inline-block; position: absolute; top: 2em; left:34%; z-index: 12} .Dnoir {width: 20%; position: absolute; top:0; left:24%; background-color: #000000; z-index: 11; transform-origin: 0 0} .Dbleu {width: 20%; position: absolute; top:0; left:4%; background-color: #009de2; z-index: 11; transform-origin: 100% 100%} .Dbleu2 {width: 20%; position: absolute; top:0; left:24%; background-color: #009de2; z-index: 11; transform-origin: 0 0} .demandeD {width: 50%; float: right; background-color: #0a2023; position: relative; overflow: hidden; z-index: 10} .demandeDint {float:left; display:block; position: relative; z-index: 10; width: 516px; margin-left: 9%; background-color: #ffffff; border-radius: 6px; margin-top: 8em; margin-bottom: 10em; padding-top: 1.8em} .demandeD .cal {z-index: 9} .H #demande {visibility: hidden} #formulaire ::-webkit-input-placeholder {color:#000000; } #formulaire :-moz-placeholder {color:#000000; opacity:1; } #formulaire ::-moz-placeholder {color:#000000;opacity:1;} #formulaire :-ms-input-placeholder {color:#000000;} #formulaire ::-ms-input-placeholder {color:#000000;} #formulaire ::placeholder {color:#000000;} #formulaire .titreformulaire {color:#1085cf; font-size: 1.1em; font-weight: 300; padding: 1.3em 0 0 0; display: block; letter-spacing: 0.04em} #formulaire .titreformulaire strong {display: inline-block; font-size: 1em; letter-spacing: 0.05em; font-weight:500} #formulaire {display:block; text-align:left; margin:0 auto 0 auto; padding-bottom:6em; padding-top: 0.5em; width:80%; font-size:1em; font-family: 'EF', 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} #formulaire .fromlong {width:100%; float:none; margin:0.6em 0 0 0; padding:0; display: block} #formulaire input.text {color:#000; font-size:1em; border:none; padding:0.4em 0; font-family: 'EF', sans-serif; font-weight:300; border-bottom:1px solid #000; background:none; border-radius:0; letter-spacing: 0.07em} #formulaire input.text:hover {color:#386793; background-color: rgba(255, 255, 255, 1);border-bottom:1px solid #386793; } #formulaire .minimargeH {margin-top: 0.5em} #formulaire .check {display: block; position: relative; width: 100%; margin-bottom: 0.2em;-webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; } #formulaire .labcheckbox {display:block; font-size: 0.95em; font-weight: 500; color:#000000; cursor: pointer;float: left; padding-left:35px; padding-bottom: 0.4em; line-height: 1.4em; padding-top: 0.4em} #formulaire .labcheckbox2 {display:block; font-size: 0.9em; font-weight:300; color:#000000; cursor: pointer; float: left; padding-left: 30px; padding-bottom: 0.4em; line-height: 1.4em; padding-top: 0.3em} .labcheckbox2 a {color:#3E3E3E; text-decoration: underline} .labcheckbox2 a:hover { text-decoration: none} #formulaire input.box {accent-color:#000; width:22px; height:22px; display:inline-block; position: absolute; top:2px; left: 0; cursor: pointer} #formulaire input.box2 {accent-color:#000; width:18px; height:18px; display:inline-block; position: absolute; top:2px; left: 0; cursor: pointer} #formulaire input.box:checked, #formulaire input.box2:checked {accent-color:#000} #formulaire .labcheckbox:hover, #formulaire .labcheckbox2:hover {color:#386793;} #envoyer {color:#fff; text-transform:uppercase; background-color:#000000; border-radius:8px;display:block; border:none; padding:0.9em 0 0.9em 14%; width:100%; font-size:1.1em; background-image:url(../Images/trait.gif); background-repeat:no-repeat; background-position:6% 50%; background-size:5%; line-height:1.2em; letter-spacing:0.2em; margin:2.2em 0 1.3em 0; cursor:pointer; text-align:left; font-weight:400; font-family: 'EF', sans-serif;} #message-requete {font-family: 'EF', 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:9999; 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 50%; 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 50%; background-size:1em} #fondmessage {background-color:#262727; z-index:9998; position:fixed; width:100%; height:100%; top:0; left:0; display:none} #introContact {width: 100%; position: relative; z-index: 10; -webkit-user-select:text; -moz-user-select:text; -khtml-user-select:text; -ms-user-select:text} #introContactG {display: block; width:50%; float: left; height:auto;overflow:hidden; position:relative; background-color: #162530} #introContactG .contactInfos {z-index: 11; position: relative; margin-left: 18%; padding-top:6.5em; color:#fff; padding-bottom:6em} #introContactG .contactFond {z-index: 10} .contactInfos h1 {color:#fff; font-size: 2.65em; letter-spacing: 0.04em; line-height: 1.4em; font-weight: 300; display: block} .contactInfos .coordonnees { margin-bottom: 3em; padding-top: 2.7em} .coordonnees li { margin-bottom: 0.1em} .coordonnees li a { display: inline-block; padding: 0.4em 0 0.5em 1.5em; position: relative; color:#fff; font-size: 1.3em; letter-spacing: 0.04em; line-height: 1.5em; font-weight: 300} .coordonnees li a img {position: absolute; top:0.8em; left: 0; width:0.6em} .contactInfos p {color:#fff; font-size: 1.1em; line-height: 1.6em; padding-top:2.7em; display: block;width: 90%; max-width:500px} .contactInfos p a {color:#fff; text-decoration: underline} .contactInfos p a:hover {color:#e77310; text-decoration: none} #introContactD {width:50%; float:right; position: relative; color:#000; background-color: #f5f7f7} #introContactDint { margin-left:7.5%; padding-top:6.5em; position: relative; z-index: 9} #introContactD h2 {color:#000; font-size: 2.65em; letter-spacing: 0.04em; line-height: 1.4em; font-weight: 300; display: block} #introContactD h2 .mini {font-size: 0.75em} #formulaire2 ::-webkit-input-placeholder {color:#45636d; } #formulaire2 :-moz-placeholder {color:#45636d; opacity:1; } #formulaire2 ::-moz-placeholder {color:#45636d;opacity:1;} #formulaire2 :-ms-input-placeholder {color:#45636d;} #formulaire2 ::-ms-input-placeholder {color:#45636d;} #formulaire2 ::placeholder {color:#45636d;} #formulaire2 .titreformulaire {color:#1085cf; font-size: 1.1em; font-weight:400; padding: 1.8em 0 0 0; display: block; letter-spacing: 0.04em} #formulaire2 .titreformulaire strong {display: inline-block; font-size: 1em; letter-spacing: 0.05em; font-weight:500} #formulaire2 {display:block; text-align:left; margin:0; padding-bottom:6em; padding-top:1.8em; width:630px; font-size:1em; font-family: 'EF', 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.15em; border:none; padding:0.4em 0 0.2em 0; font-family: 'EF', sans-serif; font-weight:300; border-bottom:1px solid #5f5e5e; background:none; border-radius:0; letter-spacing: 0.025em} #formulaire2 input.text:hover {color:#000; background-color: rgba(255, 255, 255, 1);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.15em; font-family: 'EF', 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;-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:36px; 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:20px; height:20px; display:inline-block; position: absolute; top:2px; 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:75%} .H #introContactG, .H #introContactD {visibility:hidden} #equipe { padding-top: 5.5em; padding-bottom: 5em} #equipe li .p { display: block; width: 100%; position: relative} #equipe li .p img { display: block; width: 100%; position: relative; z-index: 1} #equipe li .p div {} .H #equipe li .p div {height:100%; width: 100%; position: absolute; z-index: 2; top:0; left: 0; background-color: #009de2; color:#fff; display: none} #equipe li .p div span {font-size: 1em; letter-spacing: 0.05em; font-weight: 400; display: block; line-height: 1.6em; padding-top: 20px; padding-left: 25px;margin-right: 25px; cursor: default} #equipe li .p div strong {font-size:0.8em; letter-spacing: 0.04em; font-weight: 300; display:inline-block; line-height: 1.6em; position: relative; margin-left: 25px; padding-top:1.2em; margin-top: 0.9em; margin-right: 25px; cursor: default} #equipe li .p div strong i {position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #fff; z-index: 5; transform-origin: 0 0} #equipe li.membre {width: 18%; float: left; margin-right:1%; margin-left:1%} #equipe li.ret {width: 0; float: none; margin: 0; clear: both} #equipe li.ret2 { display: none} .H #equipe li .p {visibility:hidden } @media screen and (max-height:730px) , screen and (max-width: 1750px) { .H #load {width:40px; /*height:10px*/margin-top:-5px; margin-left:-20px;} body {font-size: 0.8em} #logo {width:202px; top:25px} .H #menu {padding-top:25px; border-bottom-left-radius:8px;} #menu li .am {padding:1em 0.9em 0.6em 0.9em} #menu li .cadre {margin-left:1em} #animAC2 {width:400px} #dok00 {width: 288px} #introdefileInt {min-height: 180px} #introdefilecontenu {margin-right: 95px} #defileFleches {width:90px} #defileSuivant {width:90px; height: 90px} #defilePrecedent {width:90px; height: 90px} #ronddefile {height:4px} .listedomaine li b {right:1.2em;width:32px; height:32px} .listedomaine li b img {width:64px} .logobas {width:202px} #basacces li a span i {height:2px} #logonav {top:25px; width:202px} .retour {width:56px; height:56px;top:20px; margin-left:-28px} .navD1 {margin-top:10em} .navD2 {margin-top:10em} .decale01 {margin-left: 23%} .par01 {float: left; width: 45%; margin-left: 5%; margin-top:3.2em} .decale02 {margin-left: 27%; margin-right: 9%} .titreInt05bis {padding-left: 40px} .extInt01 .ppadd50 {padding-left: 40px} .demandeDint {width: 412px} #formulaire .labcheckbox {padding-left:28px; padding-top: 0.4em} #formulaire .labcheckbox2 {padding-left: 24px;padding-top: 0.4em} #formulaire input.box {width:18px; height:18px} #formulaire input.box2 {width:16px; height:16px} #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} #formulaire2 {width:504px} #formulaire2 .labcheckbox2 {padding-left:29px;padding-top: 0.3em;} #formulaire2 input.box2 {width:16px; height:16px} #formulaire2 .labcheckbox {padding-left:30px;padding-top: 0.3em} #formulaire2 input.box {width:18px; height:18px} #remonte {width:37px; height:37px} #remonte img {width:16px; margin-left:-8px; margin-top:-8px} #logoHaut {width:44px; top:13px; left: 13px} #equipe li .p div span {padding-top:20px; padding-left: 20px} #equipe li .p div strong {margin-left: 20px} } @media screen and (max-height:570px) , screen and (max-width:1320px) { body {font-size: 0.72em} #logo {width:182px; top:22px; left:7%} .H #menu {padding-top:22px} #menu li .am {font-size: 1.05em;} #menu li .cadre {margin-left:1em;} .ext1 {width:86%} .listedomaine, .servicesPlus, .citation {font-size: 0.9em} .listedomaine li b {bottom:1.6em; right:1.3em;width:28px; height:28px} .listedomaine li b img {width:54px} #logonav {top:22px; width:182px; left:7%} .retour {width:50px; height:50px;top:18px; margin-left:-25px} .navD1 {margin-top:9em} .navD2 {margin-top:9em} .navD1 a {font-size:1.45em; line-height: 1.5em; letter-spacing: 0.04em;} .navD2 a {font-size:1.1em; line-height:1.5em; letter-spacing: 0.02em; } #animAC2 {width:360px} #dok00 {width: 259px} #introintAC1 {margin-left: 7%; font-size: 0.9em} #introint {margin-left: 7%; font-size: 0.9em} #introdefilecontenu {display: block; padding: 1.5em 0 0.8em 2em} #introdefile h2 {font-size: 1.15em} #introdefile p {font-size: 1.3em} #introdefileInt {min-height: 144px} #introdefilecontenu {margin-right: 78px} #defileFleches {width:72px} #defileSuivant {width:72px; height: 72px} #defilePrecedent {width:72px; height: 72px} #ronddefile {height:3px} .bandeauG {width: 36%; padding-left: 7%; padding-right: 5%; /* ext1 86% */ } .bandeauG .margeBas01 {margin-bottom:4em} .bandeauG .margeBas02 {margin-bottom: 1.5em} .bandeauD {padding-bottom:21em; padding-top:7em} #mosaique .bt5 {font-size: 1.3em} #introBlancint {width:86%; padding-top: 11em; padding-bottom: 5em} .traitbleuintro {top:12em; left: 7%} #introBlanccontact {padding-top: 10em} .titreInt05bis {padding-left:30px} .extInt01 .ppadd50 {padding-left: 30px} .logobas {width:182px; margin-left: 7%} .demandeDint {width:370px} #formulaire .labcheckbox {padding-left:26px;padding-top: 0.5em} #formulaire .labcheckbox2 {padding-left: 22px;padding-top: 0.5em} #formulaire input.box {width:16px; height:16px} #formulaire input.box2 {width:14px; height:14px} #introContactG .contactInfos {margin-left: 14%} #formulaire2 {width:453px} #formulaire2 .labcheckbox2 {padding-top: 0.4em;} #formulaire2 .labcheckbox {padding-left:26px;padding-top: 0.45em} #formulaire2 input.box {width:16px; height:16px} #logoHaut {width:39px; top:11px; left: 11px} #equipe li .p div span {padding-top:15px; padding-left: 15px; font-size: 0.9em;} #equipe li .p div strong {margin-left: 15px; font-size: 0.7em;} } @media screen and (max-height:460px) , screen and (max-width:1140px) { #MOB2 {display: block} #logo {left:5%} #menu li .am {font-size: 0.95em;} #menu li .cadre {margin-left:1em} .ext1 {width:90%} .listedomaine li b {bottom:1.7em; right:1.1em;width:25px; height:25px} .listedomaine li b img {width:50px} #logonav {left:5%} .retour {left:28%; width:42px; height:42px;top:21px; margin-left:-21px} #navG {width:28%} #navD {width: 72%;font-size: 0.9em} .navD1 {margin-top:9em} .navD2 {margin-top:9em} #contactRapideNav {width: 72%; font-size: 0.8em} #introintAC1 {margin-left: 5%; font-size: 0.8em} #introint {margin-left: 5%; font-size: 0.9em} #introdefile {font-size: 0.9em} #introdefile h2 {font-size: 1.2em; display: block} #introdefile p {font-size: 1.3em;} #introdefileInt {min-height: 132px} #introdefilecontenu {margin-right: 70px} #defileFleches {width:66px} #defileSuivant {width:66px; height: 66px} #defilePrecedent {width:66px; height: 66px} .bandeauG {width: 40%; padding-left: 5%; padding-right: 5%; /* ext1 90% */ } #mosaique .bt5 {font-size: 1.2em} #mosaiqueD strong {font-size:4.1em} .decale01 {margin-left: 20%} .par01 {float: left; width: 45%; margin-left: 5%; } .decale02 {margin-left: 25%; margin-right: 5%} .servicesPlusInt {width:62%} #visuCarresExt strong {font-size:5.3em} #introBlancint {width:90%; padding-top: 11em;} .traitbleuintro {top:11.5em; left: 5%} #introBlanc h2 {font-size: 3.2em} #introBlanc h2.plusfort {font-size:2.8em} #introBlanc h2 .mini2 {font-size: 0.3em} #introBlanccontact {padding-top: 9em} .logobas {margin-left: 5%} .bascontact {margin-left:1.8%; padding-left:2%} .bascoord li a, .bascoord li span {font-size: 1.15em; letter-spacing: 0.04em} #introContactG {width:40%} #introContactG .contactInfos {margin-left: 10%} #introContactD {width:60%} #logoHaut {width:35px; top:8px; left: 8px} #equipe li .p div span {padding-top:15px; padding-left: 15px; } #equipe li .p div strong {margin-left: 15px;} } @media screen and (max-height:400px) , screen and (max-width:980px) { /*@media screen and (max-width:980px) {*/ #MOB2 {display:none} #MOB {display: block} .retMob {display:block; clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none} #logoHaut { display: none} #btmenu {display:block; position: fixed; top:20px; right:7%; width:50px; height:50px; z-index:950; transform-origin:50% 50%; cursor: pointer; background-color: rgba(255,255,255,0.9)} #b1, #b2, #b3 {width:22px; height: 2px; background-color: #141c25; position: relative; margin-left:auto; margin-right: auto; display: block; transform-origin: 0 0} #b1 {margin-top:17px} #b2 {margin-top:5px} #b3 {margin-top: 5px} .H #btmenu, .H #btmenu i {visibility: hidden} #logo {left:6.6%} .H #menu {position:relative; right:0; top:0; border-bottom-left-radius:0;padding-right:0; padding-top:20px; padding-left:6.6%} #menu li {display:block; float: none; margin: 0; padding: 0} #menu li .am {padding:0.1em 0 0.1em 0; font-size:2.25em; margin:0} #menu span {padding-bottom: 0.4em} #menu .ret {display:block;width: 0; float: none; margin: 0; padding: 0; clear: both; height: 0; line-height: 0} #menu li .cadre {margin-left:0; margin-top:0.9em; margin-bottom:0em;padding: 1em 1.5em 0.6em 1.5em; font-size:1.6em} #menu li .cadre2 {margin-left:0; margin-top:0.9em; margin-bottom:0em;padding: 1em 1.5em 0.6em 1.5em; font-size:1.6em} #menu li .mactif {color:#009de2} #menu li.llangue {display: none} #langues {position:relative; top:0; top:unset; right:0; right:unset; background:none; box-shadow:none; border-radius:0; padding:0; margin-top: 90px; padding-left:6.6%; border-bottom: 1px solid #00374f;border-top: 1px solid #00374f; font-size: 1.3em} #langues li {display:inline-block; border:none; margin-right: 1em} #langues li.derligne {border: none; margin-right: 0} #langues li a {display:inline-block; position: relative; padding: 0.9em 13px 0.9em 2.4em; line-height: 1.3em} #langues li a img.drapeau {left:0em; margin-top:-0.7em; width: 1.4em} #langues li a span {color: #fff; font-weight:400;} #langues li a.langactif span {color: #009de2; } #navigation {width:100%; height:auto; position:relative; left:0; background-color:#141c25} .H #navigation {width:100%; height: 100%; position: fixed; left:0; top: 0; z-index:900; overflow: scroll; display: none} #logonav {left:6.6%; display: none; z-index: 900} .H #logonav {display: block} .retour, #navG { display:none} #navD {float:none; width:100%; height:auto; overflow:visible; position: relative} .H #navD, #fondnavD {display: none} #navDA, #navDB, #navDC, #navDD, #navDE {position:relative; z-index: 201} .H #navDA, .H #navDB, .H #navDC, .H #navDD, .H #navDE { display:none} .navD1 {float:none; width:95%; margin-top:1.5em; margin-bottom: 1.5em; padding-left:5%; position:relative; z-index: 201} .navD1 ul {display: block; padding-top:0.5em} .navD1 ul li {display: block} .navD1 a {display:inline-block;font-size:1.5em; color:#fff; line-height: 1.5em; padding: 0.2em 0; letter-spacing: 0.03em; font-weight:400; position: relative; overflow: hidden} .navD2 {float:none; width:95%; margin-top:0.5em; margin-bottom: 3em; padding-left:5%; position:relative; z-index: 201} .navD2 ul {display: block; padding-top:0.5em} .navD2 ul li {display: block} .navD2 a {font-size:1.5em; line-height:1.5em; padding: 0.2em 0; letter-spacing: 0.03em} .navD2 .traitnav { display: none} .navD1 strong, .navD2 strong {color:#87898c;position: relative; display: inline-block; font-weight: 400; margin-bottom:0em} .titreminiICO {position: relative; padding-left:2.8em; text-transform: uppercase; font-size:1em; letter-spacing: 0.16em; display: inline-block; line-height: 1.4em; padding-top: 0.4em; padding-bottom: 0.4em} .titreminiICO img {width:1.6em; position: absolute; top:50%; margin-top: -0.8em; left:0} .navD1 .mNAVactif {color:#009de2} .navD1 .mNAVactif i {width:100%; background-color: #009de2} .navD2 .mNAVactif {color:#009de2} .navD2 .mNAVactif i {width:100%; background-color: #009de2} #contactRapideNav {width: 100%} .H #contactRapideNav { display:none} .traitnav {display: none} #navigation #basliste { padding-left: 6.6%; margin-top: 4em; padding-bottom: 5em} .H #navigation #basliste {visibility: hidden} #intro, .H #intro {min-height:500px} #introdefile {min-width: 450px} .margeH17 {margin-top: 9em} .ext1{width:86.8%} .ext2 {width:80%} .titre02 {font-size:1.4em} .titre02 br {display: none} .titre04 {font-size:1.4em} .listedomaine .ret {display: none} .listedomaine .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} .listedomaine .listeP1, .listedomaine .listeP2, .listedomaine .listeP3{width:100%; margin-right:0; margin-left:0; height:250px; margin-bottom:15px} .listedomaine .listePSEUL {margin-bottom: 15px; width:50%; height: 250px; margin-right: 0; font-size:1em; /*display: none*/} .listedomaine .listePSEUL span, .listedomaine .listePSEUL2 span {text-align: left; font-size: 1.4em; position: absolute; bottom: 2.2em; left:2em} .listedomaine .listePSEUL2 {margin-bottom: 15px; width:100%; height: 250px; margin-right: 0; font-size:1em; /*display: none*/} .listedomaine li .nom {bottom:2em; font-size: 1.8em} .listedomaine li b {bottom:1.8em; right:1.8em; font-size: 1.8em; width:32px; height:32px} .listedomaine li b img {width:64px} .servicesPlus {width:58%; padding-left:0} .citation {width:35%; margin-right:0} .bandeauG {width: 39.4%; padding-left:6.6%; padding-right: 4%; /* ext1 86.8% */ } #mosaique {position: relative; margin-top:5em} #mosaiqueG {width:100%; float: none} #mosaiqueD {width:100%; float: none} #mosaiqueD strong {font-size:5em; right: 30%; } #mosaique .bt5 {left:40%; margin-left:0; font-size: 1.2em;} .titreInt02, .titreInt04 {font-size:2em} .titreInt03, .titreInt05 {font-size: 1.8em} .titreInt04 br {display: none} .titreInt05bis {font-size:1.8em; padding-left: 20px} .extInt01 .ppadd50 {padding-left: 20px} .titreInt06 {font-size: 1.4em} .surligne i {height:1px} .extInt01 {width:100%} .decale01 {margin-left:8%} .par01 {width: 46%; margin-left: 4%} .decale02 {margin-left: 8%; margin-right: 5%} .extInt01 p {font-size: 1.15em} .extInt01 p strong i {height:1px} #visuCarres {height:420px} #visuCarresExt strong {font-size:5.2em} .partG {width: 47%; float: left} .partD {width: 47%; float: right} .servicesPlusInt {width:70%} .ressources { font-size: 0.9em} .services { display: block; margin-top:5em} .services li {width:100%; margin-right:0%; margin-left:0%; float: none; margin-bottom:0} .margeBservices {margin-bottom:0em} .services li a {width:48%; margin-left: 1%; margin-right: 1%; float: left} .services li span {font-size: 1.7em} .services li b {width:48%; margin-left: 1%; margin-right: 1%; float: left} .services .ret {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} .listeE li a .colE1{width: 90%; margin-left: 3%; padding-bottom: 0.7em;} .listeE li a .colE2{width: 30%; margin-left: 3%; } .listeE li a .colE3{width: 60%; margin-left: 1%; } #introBlancint {width:86.8%; } .traitbleuintro {left: 6.6%} .logobas {margin-left: 6.6%} .bascontact {margin-left:10%; padding-left:5%} .bascoord li {padding-bottom: 0.7em} .bascoord li a, .bascoord li span {font-size: 1.2em; letter-spacing: 0.06em} .basD {width:93.4%; padding-left:6.6%;padding-bottom:4em; margin-top:3em} #basacces li {margin-bottom:1.5em} #basliste { margin-top:5em; font-size:1em} #demande {background-color: #fff} .demandeG {width:100%; float:none; height: 500px} .demandeGint {} .demandeG h3 {color:#fff; font-size: 4em; font-weight: 500; line-height: 1.4em; display: inline-block; position: absolute; top: 2em; left:21%; z-index: 12} .Dnoir {width:12%; position: absolute; bottom:0; left:15%; background-color: #000000; z-index: 11; transform-origin: 0 0} .Dbleu {width:12%; position: absolute; bottom:0; left:3%; background-color: #009de2; z-index: 11; transform-origin: 100% 100%} .Dbleu2 {width:12%; position: absolute; bottom:0; left:15%; background-color: #009de2; z-index: 11; transform-origin: 0 0} .demandeD {width:100%; float:none;} .demandeDint {float:left; width:420px; margin-left:6.6%; margin-top:6em; margin-bottom:7em; padding-top: 1.8em} .titreformulaire {font-size: 1.2em; padding: 1.3em 0 0 0; } #formulaire {padding-bottom:5em; padding-top: 0.4em; } #formulaire .formgauche {margin:1em 0 0 0} #formulaire .formdroite {margin:1em 0 0 6%} #formulaire .fromlong {margin:1em 0 0 0} #formulaire #envoyer {margin:1.8em 0 1em 0} #introContactG {width:40%; font-size: 0.95em} #introContactD {width:60%; font-size: 0.95em} #formulaire2 {width:90%} #formulaire2 .labcheckbox2 {padding-top: 0.5em;} #formulaire2 .labcheckbox {padding-top: 0.45em} .contactInfos h1 {font-size: 2.2em} .contactInfos .coordonnees { font-size: 0.9em} #introContactD h2 {font-size: 2.2em} #equipe li .p {margin-bottom: 3em} #equipe li .p div {} .H #equipe li .p div {height:auto; width: 100%; position: relative; top:0; left: 0; background-color:#fff; color:#009de2; display: block} #equipe li .p div span {font-size: 1.05em; padding-top: 10px; padding-left:0; letter-spacing: 0.02em; margin-right: 0} #equipe li .p div strong {font-size:0.8em; margin-left: 0; padding-top:0.5em; margin-top: 0em; margin-right: 0} #equipe li .p div strong i { display: none} #equipe li.membre {width: 30%; float: left; margin-right:1.5%; margin-left: 1.5%} #equipe li.ret2 {width: 0; float: none; margin: 0; clear: both} #equipe li.ret { display: none} } /*@media screen and (max-height:330px) , screen and (max-width:710px) {*/ @media screen and (max-width:710px) { #MOB3 {display: block} .H #load {width:32px; /*height:8px*/margin-top:-4px; margin-left:-16px} .H #intro, #intro {min-height:500px} #animAC2 {width:310px} #dok00 {width: 233px} #dok03 {font-size: 2em} #introintAC2 {left:6.6%; font-size: 0.8em} #introintAC1 {margin-left: 6.6%; font-size: 0.7em} #introintAC1 h2 #dokAC1 {width:1.7em} #introintAC1 h2 .infoAC1 {font-size: 0.65em} #introint {margin-left:6.6%; font-size: 0.7em} .H #introdefile {min-width: 86.8%; right: 6.6%} #introint br {display: none} #introint br.constant {display: block} #introint h2 .mini { display: block} .bt1 {font-size: 0.7em} #introdefile h2 {font-size: 1.15em} #introdefile p {font-size: 1.2em; min-height:4.5em} #introdefile p br {display: none} #introdefileInt {min-height: 140px} #introdefilecontenu {margin-right: 70px} #defileFleches {width:60px} #defileSuivant {width:60px; height: 60px} #defilePrecedent {width:60px; height: 60px} .ext2 {width:86.8%} .margH17 {margin-top: 8em} .paddH9 {padding-top: 7em} .titre01 {font-size: 2.3em} .titre02 {font-size:1.4em} .titre02 br {display: none} .titre03 {font-size: 2.3em} .titre04 {font-size:1.4em} .titre05 {font-size: 2.3em} .listedomaine .listeP1, .listedomaine .listeP2, .listedomaine .listeP3 {width:100%; margin-right:0; margin-left:0; height:180px} .listedomaine .listePSEUL, .listedomaine .listePSEUL2 {height: 180px} .listedomaine .listePSEUL span, .listedomaine .listePSEUL2 span {font-size:1.2em; bottom: 2.1em; left:2.2em} .listedomaine li .nom {bottom:2.1em; font-size: 1.7em; padding-right: 3em} .listedomaine .listeP3 .nom {letter-spacing: normal} .listedomaine li b {bottom:2em; right:1.4em; font-size: 1.6em; width:25px; height:25px} .listedomaine li b img {width:50px} .servicesPlus {float:none; width:100%; padding-left:0; margin-top: 3em} .citation {float:none; width:100%; margin-right:0; margin-top:2.5em} .bandeau-ext {padding-top:7.5em} .bandeauG {width: 70%; padding-left: 6.6%; padding-right: 6%; padding-top: 3.7em; padding-bottom: 3.7em} .bandeauD {margin-left: 6.6%; padding-bottom:14em; padding-top:30em/*JS*/} .bandeauD p {font-size: 1.25em} .bandeauD ul {font-size: 1.25em} .bandeauG .margeBas01 {margin-bottom:3em} .bandeauG .margeBas02 {margin-bottom:1em} .bt3 {font-size: 0.7em} .bt4 {font-size: 0.7em} #references ul { margin-top: 4em} #references li {width:31%; margin-right: 3%; margin-bottom: 1em; float: left} #references .der {margin-right:3%} #references .derMob {margin-right: 0} #mosaiqueD strong {font-size:3.5em; right: 25%; } #mosaique .bt5 {left:40%; margin-left:0; font-size:1.1em;} .titreInt02, .titreInt04 {font-size:1.7em} .titreInt03, .titreInt05,.titreInt06 {font-size: 1.6em} .titreInt02 br, .titreInt03 br, .titreInt04 br, .titreInt06 br {display: none} .titreInt06 .brmob {display:block} .decale01 {margin-left:8%} .par01 {width:100%; margin-left:0; float: none} .decale02 {margin-left: 8%; margin-right: 0%} .extInt01 p {font-size: 1.1em} .videoCarre {width:86.8%; margin-left: auto; margin-right: auto} #visuCarresExt {padding-bottom:1em} #visuCarres {height:300px} #visuCarresExt strong {font-size:2.4em; } .partG, .partD, .partG2, .partD2 {width: 100%; float:none} .margHmob04 {margin-top: 4em} .servicesPlusInt {width:100%} .gb {width: 80%} .ressources {font-size: 1em} .ressources .col {width:100%; margin-right:0;float: none; padding-top:4.5em} .ressources h5 {font-size: 1.3em; margin: 1.5em 0 1.2em 0} .ressources h5 img {width: 0.9em; position: absolute; top:0.95em; left:1.5em} .ressources ul {margin:0; padding: 0; display: block; margin-bottom:0; color:#161313; font-size: 1.15em; line-height:2.05em; font-weight: 300} .ressources li { padding-left:1.1em; background-image: url("../Images/fl22.png"); background-repeat: no-repeat; background-size: 0.45em; background-position: 0 0.8em; display: block} .services li span {font-size: 1.2em} .listeE li a .colE1{width: 80%; margin-left: 8%; padding-bottom: 0.7em;} .listeE li a .colE2{width: 80%; margin-left: 8%; } .listeE li a .colE3{width: 80%; margin-left: 8%; margin-top: 0.5em} #introBlancint {width:86.8%; padding-top: 10em; padding-bottom:4em} .traitbleuintro {top:10em; left: 6.6%} #introBlanc h2 {font-size: 2.2em} #introBlanc h2.plusfort {font-size:2.1em} #introBlanc h2 .mini2 {font-size: 0.45em} #introBlanccontact {padding-top: 9em} .logobas {width:170px} #bas .margH7 {margin-top: 5em} #bas .paddH65 {padding-top:4em} .bascontact {float:none; margin-left:6.6%; padding-left:6.6%} .basD {padding-bottom: 7em} #basacces li a {font-size: 1.5em} #basliste {margin-top:5em; font-size:0.95em; } #basliste li { display: inline-block; float: left; padding-right:1em} #basliste .ret {display:none} #basliste .retMob {clear:both; width:0; height:0; line-height:0; margin:0; padding:0; float:none; display: block} .demandeGint {} .demandeDint {width:86%; margin-left:6.6%} .demandeG h3 {font-size: 2.8em} #formulaire {font-size:1.2em; width:85%} #formulaire .fromlong {margin:1.3em 0 0 0} #formulaire .labcheckbox {padding-left:28px; padding-top: 0.4em} #formulaire .labcheckbox2 {padding-left: 24px;padding-top: 0.4em} #formulaire input.box {width:18px; height:18px} #formulaire input.box2 {width:16px; height:16px} #formulaire #envoyer {margin:2.3em 0 1.3em 0} #message-requete {font-size:1.2em; top:25px; left:5%; margin-left:0; width:78%; padding:20px 6%; background-size:15px; background-position:96% 15px;} #introContactG, #introContactD, .contactInfos .coordonnees {font-size: 1em} #introContactG {width:100%; float:none} #introContactG .contactInfos {margin-left:6.6%; padding-top:4em; padding-left:0px;padding-bottom:5em} .contactInfos h1 {font-size: 2.4em} #introContactD {width:100%; float:none} #introContactDint { margin-left:0; padding-top:5em; padding-left:6.6%;width:86.8%} #introContactD h2 {font-size: 2.4em} #formulaire2 .titreformulaire {font-size: 1.15em; margin: 1.8em 0 0 0} #formulaire2 {width:100%; font-size:1.1em;} #formulaire2 .formgauche {width:100%; float:none;margin:1.3em 0 0 0} #formulaire2 .formdroite {width:100%; float:none;margin:1.3em 0 0 0} #formulaire2 .fromlong {margin:1em 0 0 0} #formulaire2 textarea{height:13em; font-size: 1.1em} #formulaire2 .labcheckbox2 {padding-left:24px;padding-top: 0.3em} #formulaire2 input.box2 {width:16px; height:16px} #formulaire2 .labcheckbox {padding-left:30px;padding-top: 0.35em} #formulaire2 input.box {width:18px; height:18px} #formulaire2 #envoyer {margin:2.8em 0 1.3em 0} #formulaire2 .envoyerreduit {width:100%} #equipe { padding-top:3em} #equipe li.membre {width: 45%; float: left; margin-right:2.5%; margin-left: 2.5%} #equipe li .p div span {font-size: 0.9em} #equipe li .p div strong {font-size:0.8em;padding-top:0.2em} }