/*
Theme Name: LR
Theme URI: http://lamoureux-ricciotti.com
Description: A WordPress theme developed for Lamoureux & Ricciotti
Version: 1.0.0
Author: Mathieu Cattan
Tags: Ingénierie, construnction
License: MIT
License URI: http://opensource.org/licenses/mit-license.php
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
overflow-x: hidden;
}
html, body
{
height: auto;
overflow-x: hidden;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a, a:hover, a:focus, a:active, a:visited {
text-decoration: none;
color: #070233;
}
a:hover {
text-decoration: underline;
color: #070233;
}
*, *:after, *:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
#wpadminbar {
display:none;
}
/* ------------------------------------
TYPO
-------------------------------------*/
@font-face{font-family:"PDR";src:url(fonts/PlayfairDisplay-Regular.otf);}
@font-face{font-family:"PDI";src:url(fonts/PlayfairDisplay-Italic.otf);}
@font-face{font-family:"PDBB";src:url(fonts/PlayfairDisplay-Black.otf);}
@font-face{font-family:"OSB";src:url(fonts/Montserrat-Bold.otf);}
@font-face{font-family:"OSEB";src:url(fonts/Montserrat-Black.otf);}
@font-face{font-family:"OSL";src:url(fonts/Montserrat-Light.otf);}
@font-face{font-family:"OSEL";src:url(fonts/Montserrat-Hairline.otf);}
@font-face{font-family:"OSR";src:url(fonts/Montserrat-Regular.otf);}
/* ------------------------------------
ALL - ALL
-------------------------------------*/
section.toggle {
text-align: center
}
.mask {
position: fixed;
top: 0;
left: 0;
z-index: 15;
width: 100%;
height: 100%;
background: rgba(20, 20, 20, 0);
}
/* ------------------------------------
HOME
-------------------------------------*/
#home {
position: absolute;
width: 100%;
height: 100%;
top: 0;
right: 0;
background: #fff;
}
.cover-home {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 80%;
z-index: 100000;
overflow: hidden;
}
@-webkit-keyframes left-home {
from {
width: 100%;
}
to {
width: 0;
}
}
@-moz-keyframes left-home {
from {
width: 100%;
}
to {
width: 0;
}
}
.cover-home:after {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: #efefef;
content: "";
animation: left-home 1.6s ease forwards ;
-webkit-animation: left-home 1.6s ease forwards ;
-moz-animation: left-home 1.6s ease forwards ;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
.main-home--spe {
position: absolute;
width: 100%;
height: 80%;
top: 0;
left: 0;
display: inline-table;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
/*filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);*/
z-index:100;
opacity:.9;
}
/*.main-title {
position: absolute;
width: 50vw;
height: 85vh;
background: #efefef;
top: 0;
right: 0;
}*/
.main-title {
position: absolute;
width: 100vw;
height: 80vh;
background: none;
top: 0;
right: 0;
z-index:1000;
}
.main-title ul li:nth-child(1){
font: 1.4rem/1 "OSB";
letter-spacing: .3rem;
text-align:center;
margin-bottom:.3rem;
color:#fff;
}
.main-title ul li:nth-child(2){
font: 1.1rem/1 "OSR";
letter-spacing: .1rem;
text-align:center;
color:#fff;
}
.main-title ul {
display: flex;
flex-direction: column;
height: 100%;
align-content: center;
justify-content: center;
}
/*.main-title ul li{
margin-left: 6rem;
}
.main-title ul li:nth-child(1){
font: 1.1rem/1 "times";
color: #000;
letter-spacing: .3rem;
}
.main-title ul li:nth-child(2){
font: 1.1rem/1.5 "times";
color: #000;
margin-left: 7rem;
letter-spacing: .3rem;
}
.main-title ul li:nth-child(3){
position: relative;
font: 5.2rem/1.5 "times";
color: #000;
margin-left: 6rem;
letter-spacing: .3rem;
}
.main-title ul li:nth-child(3):before{
content: "";
position: absolute;
top: 50%;
left: -210px;
width: 200px;
height: 1px;
background: #000;
}
.main-title ul li:nth-child(4){
font: .9rem/1.5 "times";
color: #000;
margin-left: 8rem;
}*/
.main-home, .main-agency, .main-bfuhp, .main-projets, .main-article {
position: absolute;
width: 100%;
height: 80%;
top: 0;
left: 0;
display: inline-table;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
/*filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);*/
}
.main-home--spe {
background-image: url(images/lamoureux-ricciotti-mucem-home.jpg);
}
.main-projets {
background-image: url(images/centreculturelgenevilliers-lamoureux-ricciotti.jpg);
}
.main-agency {
background-image: url(images/lamoureux-ricciotti-republique-agence2.jpg);
}
.main-bfuhp {
background-image: url(images/lamoureux-ricciotti-voussoir.jpg);
}
.main-article {
background-image: url(images/lamoureux-ricciotti-iter-bfupV2.jpg);
}
.left-cover-black, .right-cover-black {
position: absolute;
width: 50%;
height: 100%;
top: 0;
background: /*#141327*/#000;
opacity: 0;
}
.left-cover-black {
left: 0;
}
.right-cover-black {
right: 0;
}
.main-home h2, .main-home h1, .main-agency h1, .main-bfuhp h1, .main-projets h1, .main-article h1 {
position: relative;
z-index: 2;
}
.title-align {
display: table-cell;
vertical-align: middle;
}
.main-home h1 {
font-family:"OSEB";
font-size: 1.5rem;
letter-spacing: 0.5rem;
line-height: 1.8rem;
color: #fff;
text-align: center;
}
.main-agency h1, .main-bfuhp h1, .main-projets h1, .main-article h1 {
font-family:"OSEB";
font-size: 1.5rem;
letter-spacing: 0.5rem;
line-height: 1.8rem;
color: #fff;
text-align: left;
transform: translate(50%);
-webkit-transform: translate(50%);
-moz-transform: translate(50%);
text-transform:uppercase;
}
.main-home h2 {
font-family:"OSR";
font-size: 0.9rem;
letter-spacing: 0.2rem;
line-height: 2.5rem;
color: #fff;
text-align: center;
text-transform: uppercase;
}
.menu-home {
position: absolute;
width: 100%;
height: 20%;
bottom: 0px;
}
/*.menu-home {
position: fixed;
top: 20px;
right: 20px;
z-index: 1000000000;
}*/
.menu-home p {
text-align: center;
}
.menu-home p svg {
width: 200px;
height: 200px;
}
.menu-home ul.bloc-nav-home {
position: relative;
width: 180px;
height: 100px;
margin: 50px auto;
background: #fff;
}
.menu-home ul.bloc-nav-home li {
width: 100%;
height: 20px;
text-align: center;
}
.menu-home ul.bloc-nav-home li a {
font-family:"times";
text-transform: uppercase;
font-size: 0.8rem;
color: #000;
letter-spacing: 0.2rem;
text-decoration: none;
background: #fff;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.menu-home ul.bloc-nav-home li a:hover {
opacity: 0.2;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
ul.bloc-nav-home2{
display:flex;
flex-column:row;
position:absolute;
top:20px;
right:20px;
z-index:1000000;
}
ul.bloc-nav-home2 li a {
font-family:"OSR";
font-size: 0.8rem;
color: #fff;
letter-spacing: 0.2rem;
padding: 0.2rem;
text-decoration: none;
opacity: 0.4;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.menu-home ul.bloc-nav-home {
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.menu-home ul.bloc-nav-home2 {
display: flex;
flex-direction: row;
justify-content: flex-end;
}
ul.bloc-nav-home2 li {
margin-left: 1rem;
}
.menu-home ul.bloc-nav-home li {
text-align: center;
}
.menu-home ul.bloc-nav-home li a {
font-family:"OSR";
text-transform: uppercase;
font-size: 0.8rem;
color: #000;
letter-spacing: 0.2rem;
padding: 0.2rem;
text-decoration: none;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.menu-home ul.bloc-nav-home2 li a {
font-family:"";
font-size: 0.8rem;
color: #000;
letter-spacing: 0.2rem;
padding: 0.2rem;
text-decoration: none;
opacity: 0.4;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.menu-home ul.bloc-nav-home li a:hover {
opacity: 0.2;
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.half-bloc-nav {
position: relative;
opacity: 0.3;
}
.scroll {
position: absolute;
bottom: 25vh;
right: 20px;
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
color:#fff;
z-index:100000;
font: 0.6rem "OSR";
}
.scroll:before {
content: "";
position: absolute;
top: 50%;
left: -55px;
width: 50px;
height: 1px;
background: #fff;
}
.half-bloc-nav {
position: absolute;
width: 100%;
height: 50%;
top: 0px;
/* border-bottom: 1px solid #000; */
border-left:50px solid #fff;
border-right:50px solid #fff;
opacity: 0.1;
}
/* ------------------------------------
HOME - MAIN CONTENT
-------------------------------------*/
#wrapper {
position: absolute;
width: 100%;
z-index: 10;
left: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
height: auto;
top: 100%;
background: #fff;
}
.bkg-geometrix {
position: absolute;
top: 200px;
left: 0px;
width: 1000px;
height: 1000px;
background-image: url(images/lring-jean-bouin-geometrie_homepage.jpg);
background-repeat: no-repeat;
background-size: 90%;
opacity: 0.6;
}
.main, .main-to-news {
position: relative;
width: 1200px;
margin: 0 auto;
}
.main-to-news {
/* height: 900px; */
height: auto;
}
.main {
height: 3700px;
}
.line-one, .line-two, .line-three, .line-four, .horizontal-line-one, .horizontal-line-two, .horizontal-line-three, .mainline-one, .mainline-two, .mainline-three, .mainline-four, .bfuhp-mainline-one, .bfuhp-mainline-two, .bfuhp-mainline-three, .bfuhp-mainline-four {
position: absolute;
background: #322e2f;
z-index: -1;
opacity: 0.2;
}
.white-mainline-one, .white-mainline-two, .white-mainline-three, .white-mainline-four {
position: absolute;
background: #fff;
z-index: 10;
opacity: 0.2;
}
.line-one {
top: 15%;
left: 0;
width: 1px;
height: 80%;
}
.white-mainline {
position: absolute;
width: 1200px;
left: 50%;
margin-left: -600px;
height: 1900px;
}
.white-mainline-one {
top: 0%;
left: 0;
width: 1px;
height: 100%;
}
.white-mainline-two {
top: 0%;
left: 100px;
width: 1px;
height: 100%;
}
.white-mainline-three {
top: 0%;
right: 100px;
width: 1px;
height: 100%;
}
.white-mainline-four {
top: 0%;
right: 0px;
width: 1px;
height: 100%;
}
.mainline-one {
top: 3%;
left: 0;
width: 1px;
height: 70%;
z-index: 10;
}
.bfuhp-mainline-one {
top: 3%;
left: 0;
width: 1px;
height: 95%;
z-index: 10;
}
.line-two {
top: 10%;
left: 100px;
width: 1px;
height: 90%;
}
.mainline-two {
top: 0;
left: 100px;
width: 1px;
height: 76%;
z-index: 10;
}
.bfuhp-mainline-two {
top: 0;
left: 100px;
width: 1px;
height: 98%;
z-index: 10;
}
.line-three {
top: 12%;
left: 1100px;
width: 1px;
height: 85%;
}
.mainline-three {
top: 5%;
left: 1100px;
width: 1px;
height: 72%;
z-index: 10;
}
.bfuhp-mainline-three {
top: 5%;
left: 1100px;
width: 1px;
height: 100%;
z-index: 10;
}
.line-four {
top: 17%;
left: 1200px;
width: 1px;
height: 75%;
}
.mainline-four {
top: 10%;
left: 1200px;
width: 1px;
height: 65%;
z-index: 10;
}
.bfuhp-mainline-four {
top: 10%;
left: 1200px;
width: 1px;
height: 95%;
z-index: 10;
}
.horizontal-line-one {
width: 100px;
height: 1px;
top: 2204px;
left: -100px;
}
.horizontal-line-two {
width: 100px;
height: 1px;
top: 1554px;
right: -100px;
}
.horizontal-line-three {
width: 100px;
height: 1px;
top: 3104px;
right: -100px;
}
.rect-line-two {
position: absolute;
top: 2200px;
left: -100px;
width: 1400px;
height: 500px;
opacity: 0.5;
}
.rect-line-one {
position: absolute;
top: 1450px;
left: -100px;
width: 1400px;
height: 500px;
opacity: 0.5;
}
.hat-text {
float: left;
width: 100%;
height: auto;
margin-top: 200px;
margin-bottom: 400px;
}
.hat {
position: relative;
width: 50%;
margin: 0px auto;
}
.hat p {
position: relative;
font-size: .9rem;
text-align: right;
margin-top: 1rem;
}
.hat h1{
font-family:"OSB";
font-size: 3rem;
line-height: 3rem;
color:/*#070233#322e2f*/#000;
letter-spacing: -0.2rem;
text-align:left;
}
.hat h1 b{
font-family:"";
}
.element-down {
position:absolute;
width: 1200px;
height: 100px;
margin-bottom: 300px;
}
.element-down svg {
position: absolute;
width: 200px;
left: 50%;
margin-left: -100px;
}
span {
position: absolute;
width: 50px;
height: 2px;
background: #000;
margin: 10px;
left: 0;
}
.news {
position: relative;
float: left;
width: 100%;
height: 800px;
}
p.before-title {
font-family:"OSR";
font-size: 1rem;
padding: 10px;
}
h3.hl-title {
font-family: "OSB";
text-transform: uppercase;
font-size: 2.1rem;
color: #000;
letter-spacing: 0.1rem;
line-height:1.8rem;
padding-left: 10px;
}
p.minimize-txt {
font-family:"PDR";
font-size: 0.8rem;
color: #322e2f;
padding: 10px 15px;
line-height: 1.2rem;
text-indent: 50px;
font-style:italic;
letter-spacing:0.1rem;
}
.left {
float: left;
}
.right {
float: right;
}
.hl-projets {
position: relative;
width: 575px;
height: 700px;
z-index: 4;
margin-bottom: 50px;
}
.hl-projets:nth-of-type(2n+1) {
float: right;
}
.hl-projets:nth-of-type(2n+1) .decal-left {
float: right!important;
margin-right: -50px;
}
/*
.decal-up-first {
margin-top: -50px;
}
*/
.decal-up-second {
margin-top: 50px;
}
.decal-up-three {
margin-top: 50px;
}
.decal-left {
margin-left: -50px;
}
.decal-right {
margin-right: -50px;
}
a.focus {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index:20;
}
.hl-text {
position: relative;
width: 450px;
height: 150px;
background: #fff;
-webkit-transition: all 0.9s ease;
-moz-transition: all 0.9s ease;
-o-transition: all 0.9s ease;
transition: all 0.9s ease;
margin-top: -15px;
z-index: 2;
}
.bloc-one {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.bloc-one-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/pont_de_la_republique-lamoureux-ricciotti-homepage_couleur.jpg);*/
background-size: cover;
}
.bloc-two-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/mucem-lamoureux-ricciotti-homepage-couleur.jpg);*/
background-size: cover;
}
.bloc-three-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/jean-bouin-resille-lamoureux-ricciotti-homepage_couleur.jpg);*/
background-size: cover;
}
.bloc-four-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/siege-iter-cadarache-lamoureux-ricciotti-homepage-couleur.jpg);*/
background-size: cover;
}
.bloc-five-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/passerelle_saint_laurent-lamoureux-ricciotti-homepage_couleur.jpg);*/
background-size: cover;
}
.bloc-six-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background-image: url(images/villa_navarra-lamoureux-ricciotti-homepage_couleur.jpg);*/
background-size: cover;
}
a:focus .bloc-one {
border: 0px solid #000;
}
a.focus:hover .bloc-one {
border: 1px solid #000;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.focus .bloc-one-img, a.focus .bloc-two-img, a.focus .bloc-three-img, a.focus .bloc-four-img, a.focus .bloc-five-img, a.focus .bloc-six-img {
border: 0px solid #fff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
a.focus:hover .bloc-one-img, a.focus:hover .bloc-two-img, a.focus:hover .bloc-three-img, a.focus:hover .bloc-four-img, a.focus:hover .bloc-five-img, a.focus:hover .bloc-six-img {
border: 5px solid #fff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
filter: none;
-webkit-filter: none;
-ms-filter: none;
-o-filter: none;
}
a.focus:hover .hl-text, a.focus:hover .txt-news {
border: 5px solid #050128;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.focus .hl-text, a.focus .txt-news {
border: 0px solid #000;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.focus:hover .p-one, a.focus:hover .p-two, a.focus:hover .p-three, a.focus:hover .p-four, a.focus:hover .bkg-highlight-news {
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.focus .p-one, a.focus .p-two, a.focus .p-three, a.focus .p-four, a.focus .bkg-highlight-news {
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.over {
position: absolute;
width: 400px;
height: auto;
top: 350px;
left: 100px;
}
.over-archive {
position: absolute;
width: 400px;
height: auto;
top: 80px;
right: 50px;
}
.over-news {
position: absolute;
width: 300px;
height: auto;
top: 450px;
left: 450px;
}
a.focus p.over-project {
position: absolute;
top: 5px;
left: 50px;
opacity: 0;
text-transform: uppercase;
color: #000;
font-family: "OSL";
font-size: 1rem;
letter-spacing: 0.1rem;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
z-index: 50;
}
a.focus:hover p.over-project {
position: absolute;
top: 5px;
left: 120px;
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a.focus span.over-line {
width: 1px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 0;
}
a.focus:hover span.over-line {
width: 100px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 1;
z-index: 50;
}
a.focus span.down-line {
height: 1px;
width: 1px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 0;
background: #fff;
}
a.focus:hover span.down-line {
height: 100px;
width: 1px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 1;
z-index: 50;
}
a.focus p.down-project {
position: absolute;
top: 0px;
left: -20px;
opacity: 0;
font-size: 0.9rem;
color: #000;
text-transform: uppercase;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
z-index: 50;
}
a.focus:hover p.down-project {
position: absolute;
top: 100px;
left: -20px;
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.down {
position: absolute;
width: 1px;
height: auto;
top: 350px;
left: 240px;
}
a:hover .ricciotti-img, a:hover .lamoureux-img {
opacity:0.5 ;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
/*.separator {
width: 200px;
height: 5px;
background: #000;
margin: 10px;
}*/
.padd-hl-text {
padding-top: 10px;
}
.p-one, .p-two, .p-three, .p-four{
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
z-index: 1;
}
.p-one {
/*background-image: url(../images/jean-bouin-resille-lamoureux-ricciotti-homepage_couleur.jpg);*/
}
.p-two {
/*background-image: url(../images/mucem-lamoureux-ricciotti-homepage.jpg);*/
}
.p-three {
/*background-image: url(../images/siege-iter-cadarache-lamoureux-ricciotti-homepage.jpg);*/
}
.p-four {
/*background-image: url(../images/passerellefortsaintjean-lamoureux-ricciotti-homepage.jpg);*/
}
.last {
position: relative;
width: 200px;
height: auto;
/* margin: 200px auto 200px; */
margin: 100px auto 100px;
}
.contain-last {
position: relative;
width: 100%;
/*height: 600px;*/
background: none repeat scroll 0% 0% rgb(255, 255, 255);
display: flex;
justify-content: center;
align-items: center;
}
.contain-project {
background: #fff;
border: 10px solid #fff;
}
/* ------------------------------------
HOME - ACTU
-------------------------------------*/
.mucem-homepage {
position: relative;
width: 100%;
height: 1050px;
background-image: url(images/mucem-lisa-ricciotti-homepage.jpg);
background-repeat: no-repeat;
background-size: cover;
margin-top: -200px;
z-index: -10;
}
.box-news {
position: relative;
width: 1201px;
height: 800px;
margin-top: -50px;
background-color: #fff;
border-left: 1px solid #efefef;
}
.box-article a {
position: absolute;
width: 400px;
height: 400px;
padding: 20px;
}
.box-article a:hover {
text-decoration: none;
}
.box-article {
position: relative;
float: left;
width: 400px;
height: 400px;
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
}
p.date-article {
font-family: "OSR";
font-size: 0.8rem;
letter-spacing: 0.1rem;
}
h5.title-article {
font-family: "OSB";
color: #000;
font-size: 1.4rem;
line-height: 1.6rem;
margin-bottom: 20px;
letter-spacing: 0.1rem;
margin-top: 5px;
}
.width-article {
width: 300px;
}
p.normal-article {
font-family: "PDR";
color: #666;
font-size: 0.9rem;
line-height: 1rem;
letter-spacing: 0.05rem;
}
/*.bkg-article-one {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(../images/article-gare-montpelier.jpg);
opacity: 0.1;
}*/
/* ------------------------------------
DOT - ALL ALL
-------------------------------------*/
.allprojects {
position: relative;
float: left;
width: 500px;
height: 200px;
margin:150px 0px;
z-index: 1000000000;
}
.allprojects a {
position: absolute;
width: 500px;
height: 200px;
top: 0;
left: 0;
z-index: 100000000;
}
path.prout {
transition: stroke .4s ease;
stroke:red;
stroke-dasharray:500px;
stroke-width:10px;
}
a:hover path.prout {
stroke:yellow;
transition: stroke .4s ease;
stroke-dasharray:0px;
stroke-width:200px;
}
.allprojects-under {
position: absolute;
top: 0px;
left: 0px;
float: left;
width: 500px;
height: 200px;
}
a.multi, a.navi {
position: fixed;
top: 20px;
cursor: pointer;
z-index: 100000;
mix-blend-mode: difference;
}
a.navi {
left: 20px;
}
a.multi {
right: 20px;
}
.dot {
position: relative;
width: 40px;
height: 40px;
margin: 50px auto 0px;
}
.dot-menu {
position: absolute;
width: 50px;
height: 45px;
top: 0;
z-index: 10000000;
background: transparent;
display: flex;
justify-content: center;
align-self: center;
align-items: center;
}
.dot-menu path {
stroke:#fff!important;
}
a .dot-menu-one {
position: relative;
width: 100%;
height: 5px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a .dot-one {
float: left;
width: 10px;
height: 10px;
border: 1px solid #070233;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
a:hover .dot-one, a:hover .dot-menu-one {
background: #070233;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.separator {
position: relative;
width: 300px;
height: 1px;
background: #070233;
margin: 20px auto;
}
.allprojects p.lecture {
font-family:"OSL";
font-size: 1rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
text-align: center;
text-transform: uppercase;
}
.allprojects p.lecture_pdf {
font-family: "PDBB";
letter-spacing: 0.1rem;
line-height: 1.2rem;
text-align: center;
text-transform: uppercase;
margin-top: 80px;
}
/* ------------------------------------
AGENCE - ALL ALL
-------------------------------------*/
/*.bkg-all {
background: #FBFBFB;
}*/
.bfuhp-main-line {
position: absolute;
width: 1200px;
left: 50%;
margin-left: -600px;
height: 6400px;
margin-top: 100px;
}
.main-line {
position: absolute;
width: 1200px;
left: 50%;
margin-left: -600px;
height: 6400px;
margin-top: 100px;
}
.contain {
position: relative;
width: 1200px;
margin: 0 auto;
height:auto;
margin-top: 200px;
}
/*.bkg-all {
background-image: url(../images/bkg-allall.png);
}*/
.hat-text-agency {
width: 100%;
height: auto;
margin-bottom: 50px;
}
.under-hat {
width: 750px;
height: auto;
margin: 0px 225px 100px;
font-family: "OSL";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
}
p.normal-txt {
font-family:"OSL";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
}
.normal-width {
width: 100%;
height: auto;
}
.reward {
position: relative;
width: 100%;
height: auto;
margin: 200px auto 0px;
background-color: #fff;
border-top:1px solid #efefef;
border-bottom:1px solid #efefef;
z-index: 500;
}
.reward ul {
position: relative;
width: 1200px;
/* height: 400px; */
}
.reward ul {
display: flex;
justify-content: center;
position: relative;
width: 100%;
/* height: 400px; */
/* display: inline-table; */
margin-bottom: 120px;
}
.reward ul li {
/* display: table-cell; */
width: 25%;
/* height: 400px; */
/* padding-top: 80px; */
padding-left: 2rem;
padding-right: 2rem;
}
.big_award li {
/* display: table-cell; */
width: 50%!important;
}
.reward ul li h3 {
font-family:"PDBB";
text-transform: uppercase;
font-size: 1.0rem;
text-align: center;
letter-spacing: 0.1rem;
/* margin-top: 50px; */
}
.reward ul li p {
font-family:"OSL";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
text-align: center;
margin-top: 10px;
}
.rew-separator{
position: relative;
width: 50px;
height: 2px;
background: #000;
margin: 10px auto;
}
.rect-line {
position: absolute;
top: -100px;
left: 25%;
}
.theme-line {
position: relative;
width: 1400px;
height: 700px;
background: #111;
background-image: url("images/theme-pont-republique-lamoureux-ricciotti.jpg");
background-size: contain;
background-position: left bottom;
background-repeat: no-repeat;
margin: 0 auto
}
.text-theme {
position: absolute;
width: 500px;
height: 500px;
top: -50px;
right: 200px;
background: #000;
}
.text-theme h2 {
font-family: "OSEB";
font-size: 1.1rem;
color: #FFF;
letter-spacing: 0.2rem;
text-transform: uppercase;
padding: 60px 0px 0px 60px;
line-height: 1.3rem;
}
.t-t {
padding: 60px;
color: #fff;
}
.theme-line ul {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.theme-line ul li {
width: 100%;
position: relative;
font-family: "OSL";
font-size: 0.8rem;
color: #fff;
letter-spacing: 0.2rem;
margin-bottom: 0.4rem;
line-height: 1rem;
}
.theme-line ul li:nth-child(2) h2 {
font-family: "OSL";
font-size:1rem;
color: #fff;
letter-spacing: 0.2rem;
line-height: 1.5rem;
text-transform: uppercase;
text-align: left;
}
.theme-line ul li:nth-child(2) p {
font-family: "OSL";
font-size:0.8rem;
color: #fff;
letter-spacing: 0.1rem;
line-height: 1.5rem;
text-align: left;
margin-bottom: 20px;
}
.img-agency {
float: left;
width: 90%;
height: 1000px;
margin: 0 5%;
}
.img-ag-2x {
float: left;
width: 35%;
height: 900px;
margin-top: 50px;
}
.img-ag-one, .img-ag-two, .img-ag-three, .img-ag-four, .lamoureux-img, .ricciotti-img {
background-repeat: no-repeat;
background-size: contain;
}
.img-ag-one {
float: left;
width: 100%;
height: 400px;
background-image: url(images/rectorat-dijon-lamoureux-ricciotti.jpg);
border-right: 10px solid #fff;
border-bottom: 10px solid #fff;
background-position: center;
}
.img-ag-two {
float: right;
width: 90%;
height: 500px;
background-image: url(images/sdis-boulbon-lamourexu-ricciotti.jpg);
border-top: 10px solid #fff;
border-right: 10px solid #fff;
background-position: center;
}
.img-ag-three {
float: left;
width: 35%;
height: 900px;
background-image: url(images/stade-jean-bouin-lamoureux-ricciotti.jpg);
border-left: 10px solid #fff;
border-right: 10px solid #fff;
background-position: top;
}
.img-ag-four {
float: left;
width: 30%;
height: 900px;
background-image: url(images/site-iter-lamoureux-ricciotti_v2.jpg);
border-left:10px solid #fff;
background-position: center;
}
.boss-box {
position: relative;
width: 1200px;
height: 1300px;
margin: -100px auto;
}
.lamoureux-box {
position: relative;
width: 1200px;
margin: 0px auto;
}
.lamoureux-txt {
position: absolute;
top: 950px;
left: 500px;
width: 500px;
height: auto;
padding: 20px;
z-index: 40;
background: #fff;
}
.ricciotti-txt {
position: absolute;
top: 0px;
width: 500px;
height: auto;
left: 200px;
padding: 20px;
z-index: 20;
background: #fff;
}
.lamoureux-txt h4, .ricciotti-txt h4 {
position: relative;
font-family:"OSEB";
font-size: 4rem;
color:/*#070233*/#000;
text-transform: uppercase;
letter-spacing: 0.1rem;
line-height: 3.2rem;
z-index: 2;
}
.lamoureux-txt p, .ricciotti-txt p {
position: relative;
font-family: "OSL";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.1rem;
z-index: 2;
}
.lamoureux-txt p, .ricciotti-txt p {
margin-top: 10px;
}
.lamoureux-txt p, .lamoureux-txt h4 {
text-align: left;
}
.ricciotti-txt p, .ricciotti-txt h4 {
text-align: right;
}
.lamoureux-img-box {
position: absolute;
top: 500px;
left: 100px;
width: 40%;
height: 700px;
background: #000;
}
.lamoureux-img {
background-image: url(images/LRING_romain-ricciotti_v2.jpg);
z-index: 2;
}
.ricciotti-img-box {
position: absolute;
top: 0;
right: 100px;
width: 40%;
height: 700px;
background: #000;
}
.ricciotti-img, .lamoureux-img {
position: relative;
width: 100%;
height: 700px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.ricciotti-img {
position: relative;
width: 100%;
height: 700px;
background-image: url(images/LRING_guillaume-lamoureux_v2.jpg);
}
.ricciotti-img, .lamoureux-img {
opacity:1 ;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.link {
position: absolute;
top: 350px;
left: -120px;
font-family: "OSEB";
font-size: 10rem;
}
.cita-box {
position: relative;
width: 800px;
height: auto;
margin: 200px auto 300px;
}
.twisted {
position: absolute;
width: 100%;
height: 800px;
z-index: -1;
top: 3100px;
}
.cita-box p {
text-align: center;
margin: 0px auto 100px;
}
.cita-box p:nth-child(3) {
text-align: center;
margin: 100px auto 200px;
}
.cita-box h3 {
font-family: "PDR";
font-size:3rem;
letter-spacing: 0.1rem;
line-height: 3.2rem;
text-align: center;
}
.bkg-stade {
position: relative;
background: 100%;
height: 1000px;
background-image: url(images/travaux-stade-jean-bouin-lamoureux-ricciotti.jpg);
z-index: -2;
margin-top: -500px;
}
.staff-box {
position: relative;
width: 1200px;
height: auto;
margin: 0px auto 50px;
border-top: 10px solid #000;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
ul.line-staff {
display: inline-table;
width: 100%;
height: auto;
padding: 20px;
-ms-flex: 0 0 calc((100% / 3) - 0.6rem);
flex: 0 0 calc((100% / 3) - 0.6rem);
max-width: calc((100% / 3) - 0.6rem);
}
ul.line-staff li {
display: table-cell;
width: 33.33%;
height: auto;
}
ul.line-staff li h5 {
font-family: "OSEB";
text-transform: uppercase;
padding-top: 50px;
letter-spacing: 0.1rem;
}
ul.line-staff li b {
font-family: "PDR";
font-size: 0.9rem;
line-height: 3rem;
font-style: italic;
}
.inc-projects {
position: relative;
width: 100%;
height: 400px;
border-bottom: 1px solid #efefef;
border-top: 1px solid #efefef;
}
.inc-projects .allprojects {
position: relative;
width: 20%;
margin-left: 40%;
}
/* ------------------------------------
BFUHP - ALL ALL
-------------------------------------*/
.mb {
margin-bottom:200px;;
}
.geometrix-stade {
position: relative;
width: 1200px;
height: 800px;
margin-top: 200px;
margin: 300px auto 0;
z-index: -2;
}
img.geo-img {
position: absolute;
top: 0;
left: 0;
width: 1200px;
height: 1367px;
background-image: url(../images/grille-stade-jean-bouin-lamoureux-ricciotti2.jpg);
background-size: contain;
background-position: center bottom;
background-repeat: no-repeat;
border-bottom: 1px solid #efefef;
}
.circle {
position: absolute;
border-radius: 50%;
width: 200px;
height: 200px;
border: 2px dotted #000;
z-index: 5;
background: #fff;
top: 250px;
left: 300px;
}
p.pos_modele {
position: absolute;
z-index: 10;
top: 80px;
left: 20px;
}
p.pos_rep {
position: absolute;
z-index: 10;
top: 200px;
left: 60%;
}
p.pos_iter {
position: absolute;
z-index: 10;
top: 400px;
left: 20%;
}
.meca, .box-pdf {
position: relative;
width: 1200px;
height: auto;
margin: 0px auto;
display: flex;
align-items: center;
flex-direction: column;
}
.partenaires-box {
position: relative;
width: 80%;
margin-top: 80px;
margin-bottom: 100px;
margin-left: 10%;
}
ul.partenaires-line {
width: 100%;
}
ul.partenaires-line img{
object-fit: contain;
filter: grayscale(100%);
}
ul.partenaires-line li {
width: 25%;
float: left;
margin-bottom: 6rem;
}
ul.partenaires-line li p {
text-align: center;
margin-top: 1rem;
}
ul.meca-line, ul.reco-line, ul.perf-line {
display: inline-table;
position: relative;
width: calc( 100% - 200px );
height: auto;
margin-bottom: 100px;
padding-left: 1rem;
padding-right: 1rem;
}
ul.meca-line li, ul.reco-line li, ul.perf-line li {
display: table-cell;
width: 50%;
}
ul.meca-line li h3 {
font-family: "OSEB";
font-size: 4rem;
letter-spacing: -0.1rem;
text-align:
}
ul.meca-line li h3 i, ul.reco-line li h3 i {
font-family: "PDR";
font-size: 1rem;
letter-spacing: 0.1rem;
font-style: italic;
}
ul.meca-line li p, ul.perf-line li p {
font-family: "PDR";
text-transform: uppercase;
font-size: 1rem;
}
ul.perf-line li p {
font-family: "PDBB";
text-transform: uppercase;
font-size: 1rem;
letter-spacing: 0.1rem;
}
ul.perf-line li h4 {
font-family: "PDL";
font-size: 0.9rem;
text-indent: 20px;
letter-spacing: 0.1rem;
/* font-style: italic; */
}
ul.perf-line li h4:nth-child(2) {
margin-top: 20px;
}
ul.reco-line li h3 {
font-family: "OSEB";
font-size: 2.6rem;
text-align:
}
span.inline-bfuhp {
display: inline;
}
ul.info-line {
display: inline-table;
width: 100%;
}
ul.info-line li {
display: table-cell;
}
ul.info-line li.title-line {
width: 10%;
border-top: 1px solid #EFEFEF;
font-family: "OSB";
text-transform: uppercase;
padding-left: 50px;
padding-top: 10px;
padding-bottom: 20px;
font-size: 1.3rem;
letter-spacing: 0.1rem;
}
.sub-meca {
position: relative;
width: 100%;
height: 1900px;
background: #000;
color: #fff;
}
.optimisation-box {
position: relative;
width: 1200px;
height: 700px;
margin: 0 auto;
}
.opti-img {
position: absolute;
width: 480px;
height: 700px;
background: #000;
}
.pos-opti-left {
top: -50px;
left: 100px;
}
.pos-opti-right {
top: -100px;
right: 100px;
}
.pos-top {
top: -150px;
right: 100px;
}
.opti-img-one, .opti-img-two, .opti-img-three {
position: relative;
width: 100%;
height: 100%;
opacity: 1;
}
.opti-img-one {
background-image: url(images/pontdudiable-lamoureux-ricciotti.jpg);
}
.opti-img-two {
background-image: url(images/jeanbouin-lamoureux-ricciotti-bfuhp.jpg);
}
.opti-img-three {
background-image: url(images/navarra-lamoureux-ricciotti.jpg);
}
.opti-box-txt {
position: absolute;
width: 480px;
height: 600px;
padding: 10px;
background: #000;
z-index: 2;
padding: 20px;
}
.pos-txt-left {
text-align: left;
left: 525px;
}
.pos-txt-right {
text-align: right;
top: 0px;
right: 525px;
}
.opti-box-txt h5 {
font-family: "OSEB";
font-size: 1.5rem;
letter-spacing: 0.2rem;
line-height: 1.5rem;
color: #FFF;
text-transform: uppercase;
}
.normal-width-txt {
width: 400px;
height: auto;
}
.normal-top {
margin-top: 30px;
}
.inc-projects ul {
position: relative;
display: inline-table;
width: 100%;
height: 100%;
background: #eaeaea;
}
.inc-projects ul li {
position: relative;
display: table-cell;
width: 50%;
height: 200px;
padding: 50px;
}
.inc-projects ul li+li {
background: #eaeaea;
}
p.lecture {
font-family:"PDR";
font-size: 1rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
text-align: center;
text-transform: uppercase;
}
.border-dot {
border: 1px solid #000;
}
.box-pdf {
position: relative;
width: 1200px;
height: 150px;
margin: -50px auto;
background: #fff;
color:#fff;
z-index: 1;
}
.box-pdf ul {
display: inline-table;
position: relative;
width: 960px;
height: 150px;
margin: 0px 120px;
}
.box-pdf ul li {
display: table-cell;
width: 330px;
height: auto;
position: relative;
}
.box-pdf ul li hr {
background: #000;
position: absolute;
width: 330px;
top: 70px;
}
.box-pdf ul li p {
font-family: "OSR";
display: block;
text-align: right;
padding-top: 55px;
padding-right: 10px;
color: #000;
}
.box-pdf ul li img {
position: absolute;
top: 32px;
left: 10px;
}
/*.box-pdf-black {
position: absolute;
width: 50%;
height: 300px;
top: 5118px;
right: 0px;
background: #000;
z-index: -10;
}*/
.pdlr {
position: relative;
width: 100%;
height: 1000px;
background-image: url(images/pont-de-la-republique-lamoureux-ricciotti_v3.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size: cover
}
.dragdealer {
position: relative;
height: 30px;
}
.dragdealer .handle {
position: absolute;
top: 0;
left: 0;
}
#structures {
position: relative;
width: 1200px;
height: 600px;
margin: 0 auto 200px;
border-bottom:1px solid #efefef;
}
#structures .handle {
width: 400%;
height: 100%;
border-radius: 0;
}
#structures .handle .str-contain {
float: left;
position: relative;
width: 25%;
height: 600px;
background-repeat: no-repeat;
background-position: center center;
}
#structures .handle .str-size{
position: relative;
width: 25%;
height: 100%;
float: left;
}
#structures .handle .str-contain .str-img-one {
position: relative;
width: 700px;
height: 450px;
margin-left: 250px;
margin-top: 80px;
background-image: url(../images/rectorat-dijon-lamoureux-ricciotti.jpg);
}
.str-one {
position: absolute;
width: 200px;
height: auto;
bottom: 450px;
}
/*.str-one h2 {
font-family: "OSEB";
text-transform: uppercase;
color: #fff;
font-size: 5rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
margin-top: 20px;
z-index: 20;
}
.str-one p {
position: absolute;
font-family: "OSL";
text-transform: uppercase;
font-size: 3.8rem;
letter-spacing: 0.1rem;
line-height: 4rem;
margin-top: 50px;
z-index: 20;
color: #fff;
}*/
.angle-box {
width: 200%;
height: 1px;
position: absolute;
background: #fff;;
-ms-transform: rotate(30deg); /* IE 9 */
-webkit-transform: rotate(30deg); /* Chrome, Safari, Opera */
transform: rotate(30deg);
left: -800px;
top: 2400px;
border-top:1px solid #efefef;
z-index: -1;
}
#image-carousel {
height: 600px;
border-radius: 0;
border-bottom:1px solid #efefef;
width: 1200px;
}
#image-carousel .handle {
width: 4800px;
height: 100%;
border-radius: 0;
}
#image-carousel .handle .slide {
float: left;
position: relative;
width: 25%;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
}
#image-carousel .handle .img1 {
background-image: url(../images/rectorat-dijon-lamoureux-ricciotti.jpg);
}
#image-carousel .handle .img2 {
background-image: url(../images/rectorat-dijon-lamoureux-ricciotti.jpg);
}
#image-carousel .handle .img3 {
background-image: url(../images/rectorat-dijon-lamoureux-ricciotti.jpg);
}
#image-carousel .handle .img4 {
background-image: url(../images/rectorat-dijon-lamoureux-ricciotti.jpg);
}
#image-carousel .handle .slide .info {
position: absolute;
top: 450px;
left: 28%;
padding: 50px;
background: #fff;
border: 5px solid black;
}
#image-carousel .handle .slide .info p {
margin: 0;
}
#image-carousel .handle .slide .info .title {
font-family: "OSEB";
font-size: 1rem;
text-align: center;
}
#image-carousel .handle .slide .info .description {
font-family: "OSL";
font-size: 1rem;
text-align: center;
}
/* ------------------------------------
PROJECT - ALL ALL
-------------------------------------*/
.select-pdf {
display: flex;
justify-content: space-between;
text-align: left;
font-family: "OSL";
text-transform: uppercase;
font-size: 1rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
margin-top: 100px;
}
.select-pdf ul {
display: flex;
}
.select-pdf ul li:last-child {
margin-right: 4rem;
}
.select-pdf ul li:last-child a {
padding: 1rem;
border: 3px solid black;
}
.select-pdf ul li:last-child a:hover {
background: #000;
color:#fff;
text-decoration: none!important;
}
.ip-header {
position: fixed;
top: 0;
z-index: 100;
width: 100%;
height: 100%;
background: transparent;
}
.bkg-one, .bkg-two, .bkg-three, .bkg-four {
position: relative;
float: left;
width: 350px;
height: 100%;
background: #fff;
border: 1px solid #efefef;
}
.bkg-one, .bkg-three, .bkg-four {
background: #fff;
border: 1px solid #efefef;
}
.bkg-two {
background: transparent;
border: 1px solid #efefef;
}
.bkg-project {
position: absolute;
width: 100%;
height: 100%;
background-image: url(../images/projet-navarra.jpg);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
opacity: 0.1;
}
.left-project, .right-project {
position: relative;
width: 50%;
height: 100%;
border-right:1px solid #efefef;
}
.left-project {
float: left;
}
.right-project {
float: right;
overflow-y: scroll;
background: #000;
}
.right-project img {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
opacity: 0.5;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
overflow: hidden;
}
.right-project img:hover {
opacity: 1;
transform: scale(1.05);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
}
.ip-main h2 {
font-family: "OSEB";
font-size: 2em;
font-size: 2vw;
letter-spacing: -0.2rem;
padding: 20px;
}
.ip-main p.normal-txt {
width: 600px;
padding: 20px;
}
.control-project {
position: absolute;
width: 50px;
height: 100%;
top: 0;
right: 0;
border-left: 1px solid #efefef;
}
/* ------------------------------------
ARCHIVE - PROJECTS
-------------------------------------*/
.select {
font-family: "OSL";
text-transform: uppercase;
font-size: 1rem;
letter-spacing: 0.1rem;
line-height: 1.2rem;
padding-left: 4rem;
}
.projects-archive {
position: relative;
width: 100%;
height: auto;
margin-top: 100px;
margin-bottom: 100px;
background: #000;
border-bottom: 1px solid #efefef;
}
.bloc-projects {
position: relative;
width: 100%;
height: 200px;
background: #fff;
overflow: hidden;
}
.bloc-projects a {
text-decoration: none;
}
.img-projects {
position: absolute;
float: left;
width: 30%;
height: 200px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
}
.img-p-one {
background-image: url(../images/siege-iter-cadarache-lamoureux-ricciotti-homepage.jpg);
}
.img-p-two {
background-image: url(../images/mucem-lamoureux-ricciotti-homepage.jpg);
}
.img-p-three {
background-image: url(../images/stade-jean-bouin-lamoureux-ricciotti.png);
}
.img-p-four {
background-image: url(../images/siege-iter-cadarache-lamoureux-ricciotti-homepage.jpg);
}
.img-p-five {
background-image: url(../images/passerellefortsaintjean-lamoureux-ricciotti-homepage.jpg);
}
.img-p-six {
background-image: url(../images/navarra-lamoureux-ricciotti.jpg);
}
.projects-details {
position: relative;
float: right;
width: 70%;
height: 100%;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
border-top: 1px solid #efefef;
}
.projects-details ul {
display: inline-table;
position: relative;
width: 100%;
height: 100%;
}
.projects-details ul li {
display: table-cell;
position: relative;
vertical-align: middle;
width: 50%;
height: 100%;
}
.bloc-projects a.focus:hover{
border: 5px solid #000;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
}
.bloc-projects a{
border: 0px solid #000;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
overflow: hidden;
}
.projects-details h1 {
position: relative;
font-family: "OSL";
font-size: 1.5rem;
color: #000;
letter-spacing: 0.1rem;
margin-left: 100px;
text-transform: uppercase;
}
.projects-details p {
position: relative;
font-family: "OSL";
font-style: italic;
font-size: 0.9rem;
color: #000;
letter-spacing: 0.1rem;
margin-left: 10px;
text-align: center;
}
.halle {
position: relative;
width: 100%;
height: 1000px;
background-image: url(images/halle-bordeaux--lamoureux-ricciotti.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}
/* ------------------------------------
ARCHIVE - ARTICLE
-------------------------------------*/
.last-article {
position: relative;
width: 200px;
height: 100px;
margin: 100px auto 200px;
}
.bloc-article {
position: relative;
width: 100%;
height: auto;
background: #fff;
overflow: hidden;
}
.article-details {
position: relative;
float: left;
width: 100%;
/*height: 100%;*/
height: 26vh;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
border-top: 1px solid #efefef;
}
a.afocus {
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
z-index: 20;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border: 0px solid #000;
}
a.afocus:hover {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border: 5px solid #000;
}
.article-title {
position: relative;
float: left;
width: 50%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.article-txt {
position: relative;
float: left;
width: 50%;
height: 100%;
display: flex;
align-items: center;
}
.article-title h1 {
position: relative;
font-family: "OSL";
text-transform: uppercase;
font-size: 1.1rem;
color: #000;
letter-spacing: 0.1rem;
line-height: 1.8rem;
margin-left: 4rem;
}
.article-title ul{
display: flex;
margin-left: 4rem;
}
.article-title ul li:nth-child(1){
font-family: "OSB" !important;
text-transform: uppercase;
}
.article-title ul li:nth-child(2){
margin-left: 2rem;
text-transform: uppercase;
}
.article-title p, .article-txt p {
position: relative;
font-size: 0.9rem;
color: #000;
line-height: 1.5rem;
padding: 0;
}
.article-txt p {
margin-right: 4rem;
font-family: "OSR";
}
.article-title p {
position: relative;
font-size: 0.9rem;
color: #000;
line-height: 1.5rem;
padding: 0;
text-transform:uppercase;
}
p.date-article {
padding: 0px;
}
/*.img-article {
position: absolute;
float: left;
width: 100%;
height: 250px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
opacity: 0;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
border-top: 1px solid #efefef;
}
.img-a-one {
background-image: url(../images/siege-iter-cadarache-lamoureux-ricciotti-homepage.jpg);
}*/
.over-article {
position: absolute;
width: 400px;
height: auto;
bottom: 30px;
left: 90px;
}
a.focus p.over-direct {
position: absolute;
top: -2px;
left: 0px;
opacity: 0;
font-family: "OSB";
font-size: 0.7rem;
color: #000;
text-transform: uppercase;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
z-index: 50;
margin-top:0;
}
a.focus:hover p.over-direct {
position: absolute;
top: -2px;
left: 50px;
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.iter {
position: relative;
width: 100%;
height: 1000px;
background-image: url(images/iter-lamoureux-ricciotti.jpg);
background-position:right bottom;
background-repeat: no-repeat;
background-size: cover;
}
/* ------------------------------------
SINGLE - ARTICLE
-------------------------------------*/
.home-article.video {
height: 100%;
z-index: 0;
}
.contain-article.video {
display: none;
}
.customize-support {
height: auto!important;
}
#wrapper.video .project-title, #wrapper.actu .project-title {
position: relative;
}
.video .img-article {
position: relative;
width: 50%;
height: auto;
margin-bottom: 0;
background-image: none;
margin: 0 auto;
}
.video .a-contain {
position: relative;
}
.video .plyr {
height: 100%;
}
#article-wrapper {
position: relative;
width: 100%;
z-index: 10;
left: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
height: auto;
margin-top: 600px;
}
#single-article {
position: absolute;
width: 100%;
height: 500px;
top: 0;
left: 0;
background: #fff;
}
.main-single {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #000;
}
.main-single h1 {
position: relative;
font-family: "PDBB";
text-transform: uppercase;
font-size: 1.5rem;
color: #fff;
letter-spacing: 0.3rem;
line-height: 2.1rem;
margin-left: 40%;
margin-top: 150px;
}
.main-single h2 {
position: relative;
font-family: "OSL";
margin-left: 40%;
margin-top: 5%;
font-size: 1.1rem;
color: #fff;
letter-spacing: 0.1rem;
}
.article-contain {
position: relative;
width: 1000px;
height: auto;
margin: 0px auto;
}
.info-article {
position: relative;
float: left;
width: 300px;
height: auto;
}
.article-body {
position: relative;
float: left;
width: 700px;
height: auto;
}
.info-article h3 {
font-family: "OSEB";
font-size: 1rem;
letter-spacing: 0.1rem;
margin-bottom: 10px;
}
.info-article p {
font-family: "OSL";
font-size: 0.8rem;
letter-spacing: 0.1rem;
}
.info-article p:nth-child(2) {
margin-bottom: 100px;
}
.first-img-article {
width: 100%;
height: 400px;
background-image: url(../images/article-gare-montpelier.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.article-body-txt {
position: relative;
font-family: "OSL";
line-height: 1.5rem;
font-size: 0.8rem;
color: #000;
letter-spacing: 0.1rem;
margin-top: 100px;
margin-bottom: 200px;
}
.nav-others {
position: relative;
width: 100%;
height: 300px;
border-top: 1px solid #efefef;
}
.all-projects, .all-share, .all-articles {
position: relative;
float: left;
width: 33.33%;
height: 100%;
text-align: center;
border-left: 1px solid #efefef;
z-index: 1;
}
.all-projects a, .all-share a, .all-articles a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-decoration: none;
z-index: 2;
}
.nav-others p {
font-family: "OSL";
text-transform: uppercase;
font-size: 1rem;
letter-spacing: 0.1rem;
line-height: 1.5rem;
text-align: center;
margin-bottom: 20px;
}
.nav-others i img {
margin-top: 40px;
}
/* ------------------------------------
FOOTER
-------------------------------------*/
.info-footer {
position: relative;
width: 100%;
height: 500px;
background: #000;
z-index: 99999999;
float: left;
background:#000;
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
}
.info-footer h1 {
position: relative;
font-family:"OSB";
font-size: 1rem;
letter-spacing: 0.5rem;
line-height: 1rem;
color: #fff;
text-align: center;
padding-top: 130px;
}
.info-footer h2 {
font-family:"OSR";
font-size: 0.7rem;
letter-spacing: 0.2rem;
line-height: 2.5rem;
color: #fff;
text-align: center;
text-transform: uppercase;
margin-bottom: 60px;
}
.info-footer .bloc-info {
position: relative;
width: 70%;
height: auto;
margin:0 0 0 15%;
}
.info-footer .bloc-loc {
position: relative;
width: 100%;
height: auto;
float: left;
}
.info-footer .bloc-loc {
color: #fff;
}
.info-footer .bloc-loc a {
color: #fff;
}
.info-footer .bloc-loc h3 {
font-family: "PDBB";
font-size: 0.8rem;
letter-spacing: 0.3rem;
text-transform: uppercase;
color: #fff;
text-align: center;
}
.info-footer .bloc-loc p {
font-family: "OSL";
font-size: 0.7rem;
letter-spacing: 0.1rem;
line-height: 1rem;
color: #fff;
text-align: center;
}
.heigh-line {
position: relative;
width: 1px;
height: 10px;
margin: 10px auto;
background: #fff;
}
/* ------------------------------------------------------------ *\
|* ------------------------------------------------------------ *|
|* Toggle Buttons
|* ------------------------------------------------------------ *|
\* ------------------------------------------------------------ */
a.nav-toggler .dot-one {
border:1px solid #fff;
}
a.nav-toggler:hover .dot-one, a:hover .dot-menu-one {
background-color: #fff;
}
/* ------------------------------------
MISE EN FORME - NAV - PROJETS
-------------------------------------*/
.black-nav {
position: absolute;
width: 100%;
height: auto;
top: 0px;
background: #fff;
}
.bloc-projets {
position: relative;
float: left;
width: 810px;
height: 300px;
background: #fff;
overflow: hidden;
border-left:1px solid #efefef;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
}
.bloc-p-one {
position: absolute;
top: 0;
right: 0;
width: 100px;
height: 100%;
background-image: url(../images/lamoureux-ricciotti-pontdelarepublique-p-one.jpg);
background-size: cover;
background-repeat: no-repeat;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
.bloc-projets a {
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
border-bottom: 1px solid #efefef;
}
.bloc-projets a:hover {
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
border: 5px solid #000;
}
.bloc-projets a .bloc-p-one {
-webkit-transition: all 1.8s ease;
-moz-transition: all 1.8s ease;
-o-transition: all 1.8s ease;
transition: all 1.8s ease;
opacity: 0.1;
}
.bloc-projets a:hover .bloc-p-one {
-webkit-transition: all 2.3s ease;
-moz-transition: all 2.3s ease;
-o-transition: all 2.3s ease;
transition: all 2.3s ease;
transform: scale(1.1);
opacity: 0.7;
}
/*.bloc-projets a h1, .bloc-projets a p {
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
transform: scale(1);
opacity: 1;
}
.bloc-projets a:hover h1, .bloc-projets a:hover p {
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;
opacity: 0;
}*/
.bloc-projets h1 {
position: absolute;
font-family: "OSEB";
color: #000;
top: 100px;
left: 20px;
}
.bloc-projets p {
position: absolute;
font-family:"PDI";
text-transform: none;
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.0rem;
color: #000;
top: 190px;
left: 20px;
}
/*.menu-line {
position: absolute;
width: 50%;
height: 100%;
border-right: 1px solid #efefef;
top: 0;
left: 0;
}*/
nav.menu ul.under-menu-one {
position: relative;
font-family: "OSEB";
font-size: 36px;
background: #fff;
width:50%;
}
nav.menu ul li.link-projets {
position: relative;
margin: 0 auto;
width: 100%;
}
nav.menu ul li.link-projets h1 {
position: relative;
font-family: "OSR";
color: #000;
font-size: 36px;
text-align: right;
text-transform:uppercase;
letter-spacing:0.2rem;
}
.under-menu-two {
position: relative;
margin-top: 10px;
height: auto;
/*padding-right: 50px;*/
width:50%;
}
ul.under-menu-two li {
width: 100%;
position: relative;
padding: 10px;
background: #fff;
}
/*.under-menu-two ul li img {
position: absolute;
right: -20px;
top: 2px;
}
.under-menu-two ul li.under-tel img {
position: absolute;
right: -20px;
top: 4px;
}
.under-menu-two ul li.under-mail img {
position: absolute;
right: -20px;
top: 8px;
}*/
ul.under-menu-two li p, ul.under-menu-one li p {
font-family: "PDR";
font-size: 0.9rem;
color: #000;
letter-spacing: 0.05rem;
line-height: 1.1rem;
text-align: right;
}
/*ul.under-menu-one li p {
margin-bottom:50px;
}*/
ul.under-menu-two a {
text-decoration: none;
}
.menu-all {
position:relative;
width:100%;
height:auto;
display:table-cell;
vertical-align:middle;
}
p.under-menu-nav {
font-family: "OSEB";
font-size: 1rem;
position: absolute;
padding: 5px;
top: 80px;
text-align: right;
right: 50%;
}
/* ------------------------------------
TEMPLATE - PROJECTS
-------------------------------------*/
.ip-main {
position: absolute;
top: 0;
height: 0;
}
.header {
position: relative;
width: 1400px;
height: 400px;
}
.header h1{
font-family:"OSEB";
font-size: 3.3rem;
color:/*#070233#322e2f*/#000;
text-transform: uppercase;
letter-spacing: -0.3rem;
line-height: 2.8rem;
margin: 50px 350px 50px;
padding: 20px;
width: 350px;
}
.header p{
position: absolute;
font-family:"PDR";
width: 50%;
height: auto;
font-size: 0.7rem;
letter-spacing: 0.1rem;
line-height: 1.0rem;
margin: 0 25% ;
padding: 20px;
z-index: 10;
-webkit-column-gap: 40px;
-webkit-column-count: 2;
-moz-column-gap: 40px;
-moz-column-count: 2;
top: 0;
left: 25%;
}
.header p.sub-title{
position: relative;
font-family:"PDR";
width: 50%;
height: auto;
font-size: 0.7rem;
letter-spacing: 0.1rem;
line-height: 1.0rem;
margin: -50px 0 ;
padding: 20px;
z-index: 10;
-webkit-column-gap: 40px;
-webkit-column-count: 2;
-moz-column-gap: 40px;
-moz-column-count: 2;
}
.img-one {
position: relative;
width: 100%;
height: 1200px;
background-image: url(../images/projet3_02.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.white-bloc {
position: absolute;
width: 25%;
height: 100px;
top: 0;
left: 25%;
background-color: #fff;
z-index: 2;
}
.content-two {
position: relative;
width: 100%;
height: 700px;
}
.img-two {
float: left;
width: 75%;
height: 100%;
background-image: url(../images/projet3_03.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.bloc-text-one, .bloc-text-two, .content-four-transparent, .bloc-text-three {
float: left;
width: 25%;
height: 100%;
}
.content-three {
position: relative;
width: 100%;
height: 500px;
}
.content-three-transparent {
float: left;
width: 25%;
height: 100%;
}
.img-three, .img-six {
float: left;
width: 50%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.img-six {
background-image: url(../images/projet3_12.jpg);
}
.info-left-project {
position: absolute;
width: 100%;
height: 40%;
min-height: 400px;
top: 50px;
}
.info-left-project ul {
position: relative;
width: 100%;
height: 100%;
display: inline-table;
}
.info-left-project ul li {
display: table-cell;
padding: 20px;
}
.info-left-project h5 {
font-family: "OSEB";
font-size: 2rem;
letter-spacing: -0.2rem;
padding: 20px;
opacity: 1;
}
.info-left-project ul li h3 {
font-family: "OSB";
font-size: 0.8rem;
letter-spacing: 0.01rem;
text-transform: uppercase;
}
.info-left-project ul li p {
font-family: "PDI";
font-size: 0.8rem;
letter-spacing: 0.1rem;
padding:none;
margin-top: 0px;
margin-bottom: 30px;
}
.content-four {
position: relative;
width: 100%;
height: 300px;
}
.img-four {
float: left;
width: 25%;
height: 100%;
background-image: url(../images/projet3_08.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.content-four-drag {
float: left;
width: 25%;
height: 100%;
margin-left: 25%;
}
.content-four-drag p {
font-family: "PDR";
font-size: 0.7rem;
letter-spacing: 0.1rem;
padding: 20px;
}
.content-five {
position: relative;
width: 100%;
height: 500px;
}
.img-five {
float: left;
width: 25%;
height: 300px;
background-image: url(../images/projet3_10.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.contain-line {
position: relative;
width: 100%;
height: 3400px;
}
.project-line-one, .project-line-two, .project-line-three {
position: absolute;
width: 1px;
height: 100%;
background-color: #000;
top: 0;
opacity: 0.2;
z-index: -2;
}
.project-line-two {
left: 50%;
}
.project-line-one {
left: 25%;
}
.project-line-three {
left: 75%;
}
.link-pdf {
position: relative;
float: left;
width: 100%;
height: 400px;
}
.redirect {
position: relative;
width: 520px;
height: 500px;
margin: 0 auto;
}
.b-project, .n-project {
float: left;
width: 25%;
height: 100%;
}
.b-project {
border-right: 1px solid #efefef;
}
.n-project {
border-left: 1px solid #efefef;
}
.all-project {
float: left;
width: 50%;
height: 100%;
}
.others {
position: relative;
width: 1400px;
height: 200px;
margin-top: 100px;
}
/* ------------------------------------
SVG
-------------------------------------*/
.illustration {
position: absolute;
top: 0;
left: 0;
max-height: 100%;
max-width: 100%;
opacity: 0;
}
.show {
opacity: 1;
}
.hide {
opacity: 0;
}
.line-drawing,
.illustration {
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
}
.line-drawing {
position: absolute;
top: 0;
left: 0;
}
.line-drawing.hide {
opacity: 1!important;
}
.line-drawing path {
fill: none;
stroke: #000;
stroke-width: 1;
}
path.line-round {
stroke-linecap: round;
}
path.stroke-medium {
stroke-width: 2;
}
path.stroke-thin {
stroke-width: 1;
}
a.focus:hover .line-drawing {
opacity: 0;
}
/* ------------------------------------
type de projets
-------------------------------------*/
.all-contain {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: auto;
background: none repeat scroll 0% 0% #000;
}
.home-project {
position: relative;
width: 100%;
z-index: 2;
background: none repeat scroll 0% 0% #000;
height: 100vh;
margin: 0 auto 0px;
}
.main-project {
position: relative;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -5;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
background-position: center top;
background-repeat: no-repeat;
opacity: 0.1;
background-size: cover;
background-attachment: fixed;
}
.project-title {
position: absolute;
top: 0%;
left: 0px;
width: 100%;
height: 60vh;
display: inline-table;
background: #000;
}
.project-title .scroll {
bottom: 5vh!important;
}
.p-title {
/*
position: relative;
z-index: 20;
width: 100%;
text-align: center;
display: table-cell;
vertical-align: middle;
*/
position: relative;
z-index: 20;
width: 100%;
text-align: center;
display: flex;
/* vertical-align: middle; */
flex-direction: column;
height: 100%;
justify-content: space-around;
padding-top: 6rem;
}
.p-title-block {
align-self: center;
width: 50%;
}
.project-title h1 {
font-family: "OSEB";
font-size: 3.2rem;
color: #fff;
letter-spacing: 0.2rem;
line-height: 4.5rem;
text-transform: uppercase;
}
.project-title p {
font-family: "OSL";
font-size: 0.7rem;
color: #fff;
letter-spacing: 0.2rem;
text-align: center;
}
.project-title h2 {
font-family: "OSL";
font-size: 0.9rem;
color: #fff;
letter-spacing: 0.2rem;
text-align: center;
text-transform: uppercase;
margin-top: 10px;
}
h3.credits-photo {
position: relative;
font-family: "OSL";
font-size: 0.7rem;
letter-spacing: 0.1rem;
color: #fff;
padding: 10px;
z-index: 10;
}
.project-title ul {
position: absolute;
display: inline-table;
width: 50%;
height: auto;
top: 0;
right: 0%;
z-index: 21;
}
.project-title ul.project-nav li {
display: table-cell;
width: 33.33%;
height: auto;
text-align: center;
font-family: "OSL";
font-size: 0.6rem;
padding: 20px;
color: #fff;
letter-spacing: 0.1rem;
text-transform: uppercase;
}
.project-title ul.project-nav li a, .project-title ul.project-nav li a:hover {
color: #fff;
}
.contain-all {
position: relative;
width: 100%;
max-width: 1400px;
height: auto;
/* background: none repeat scroll 0% 0% #FFF;*/
margin: -20% auto 100px;
z-index: 2;
/* border: 10px solid #fff;*/
overflow:hidden;
}
.img-project-first {
position: relative;
width:100%;
height: 1000px;
background:#3db6b8 url(../images/projet-navarra.jpg);
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}
.propos-contain {
position: relative;
width: 100%;
height: 100%;
margin: 0px auto;
background: #fff;
display: inline-table;
padding-top: 4rem;
padding-bottom: 4rem;
}
.special-padding {
padding-top: 8rem!important;
padding-bottom: 8rem!important;
}
.detail-contain {
position: relative;
width: 100%;
/* height: 600px;*/
}
.p-propos {
position: relative;
width: 100%;
/* height: 600px;*/
margin: 100px auto;
display: table-cell;
/* vertical-align: middle;*/
}
.maitrise {
padding-left: 3rem;
padding-right: 3rem;
vertical-align: middle;
}
.p-propos a {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0:
}
.p-propos p.apropos {
font-family:"OSB";
text-transform: uppercase;
font-size: 0.8rem;
letter-spacing: 0.3rem;
text-align: center;
color: #313131;
margin-bottom: 40px;
}
.p-propos p.numpropos {
font-family:"OSR";
text-transform: uppercase;
font-size: 0.5rem;
letter-spacing: 0.1rem;
text-align: center;
color: #313131;
position: relative;
margin: 0 auto;
}
.contain-all {
list-style-type: none;
counter-reset: figure;
}
.numpropos:before {
counter-increment: figure 1;
content: counter(figure, decimal-leading-zero);
}
.bloc-duo {
position: relative;
width: 100%;
height: 1200px;
}
.duo-img {
width: 60%;
height: 50%;
background-image: url(../images/projet1.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom:5px solid #fff;
}
.duo-txt {
width: 40%;
height: 600px;
border-bottom:5px solid #fff;
}
.fl {
float: left;
}
.fr {
float: right;
}
.propos-contain p {
font-family: "PDR";
font-size: 0.9rem;
line-height: 1.4rem;
text-align: center;
max-width: 600px;
margin: 0px auto;
width: 100%;
color: #666;
letter-spacing: 0.05rem;
}
.contain-one-img {
position: relative;
width: 100%;
height: 1000px;
}
.c-img-one {
position: relative;
width: 100%;
height: 1000px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom: 5px solid #fff;
}
.detail-contain ul {
position: relative;
width:100%;
/* height: 600px;*/
display: flex;
justify-content: space-around;
}
.detail-contain ul li {
position: relative;
width:33.33%;
padding-top: 0rem!important;
padding-bottom: 0rem!important;
/* height: 600px;*/
display:table-cell;
vertical-align: middle;
}
p.mission {
font-family:"OSB";
font-size: 1.3rem;
letter-spacing: 0.1rem;
line-height: 1.4rem;
}
.next-p {
position: relative;
width: 100%;
height: 100px;
background: none repeat scroll 0% 0% #111;
}
.next-title {
position: relative;
float: left;
display: inline-table;
width: 100%;
height: 100%;
}
.next-title a {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
padding: 40px 30% 40px 40px;
text-align: right;
color:#fff;
}
.next-title a:hover {
text-decoration:none;
}
.next-title h2 ~ img {
opacity:0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.next-title h2:hover ~ img {
opacity:1;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.next-title h2 {
font-family: "OSB";
text-transform: uppercase;
font-size: 0.8rem;
letter-spacing: 0.1rem;
width: 40%;
height: 100%;
text-align: center;
display: table-cell;
vertical-align: middle;
color: #FFF;
}
.next-title h4 {
font-family: "OSL";
font-size: 0.9rem;
letter-spacing: 0.1rem;
width: 100%;
height: 100%;
display: table-cell;
vertical-align: middle;
color: #FFF;
}
.next-title img {
position: absolute;
right: 20px;
top: 25px;
}
.contain-duo, .contain-duo-pdf {
width: 100%;
height: 50%;
}
.contain-duo .fl, .contain-duo-pdf .fl{
height: 100%;
}
.contain-duo, .contain-duo-pdf {
display: flex;
}
.contain-two-img {
position: relative;
width: 100%;
height: 1400px;
}
.contain-three-img {
position: relative;
width: 100%;
height: 1000px;
}
.contain-four-img {
position: relative;
width: 100%;
height: 1200px;
}
.c-nine-img, .c-ten-img {
position: relative;
width: 50%;
height: 50%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom:5px solid #fff;
}
.c-nine-img {
border-right:5px solid #fff;
}
.c-eleven-img {
position: relative;
width: 60%;
height: 50%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.contain-four-txt {
position: relative;
width: 40%;
height: 50%;
}
.c-height-img {
position: relative;
width: 100%;
height: 100%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.c-one-one, .c-one-two, .c-two-one, .c-two-two{
position: relative;
float: left;
width: 50%;
height: 100%;
}
.c-one-one {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.c-two-img, .c-three-img {
position: relative;
float: left;
width: 100%;
height: 50%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.c-four-img, .c-seven-img {
position: relative;
float: left;
width: 100%;
height: 600px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.c-four-img {
border-right:5px solid #fff;
border-bottom:5px solid #fff;
}
.c-five-img, .c-six-img {
position: relative;
float: left;
width: 100%;
height: 800px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom:5px solid #fff;
}
.c-five-img {
border-right:5px solid #fff;
}
.last-img {
position: relative;
width: 100%;
height: 1200px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.last-img, .img-project-first, .duo-img, .c-img-one, .c-four-img, .c-seven-img, .c-five-img, .c-six-img, .c-height-img, .c-nine-img, .c-ten-img, .c-eleven-img {
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
.last-img:hover, .img-project-first:hover, .duo-img:hover, .c-img-one:hover, .c-four-img:hover, .c-seven-img:hover, .c-five-img:hover, .c-six-img:hover, .c-height-img:hover, .c-nine-img:hover, .c-ten-img:hover, .c-eleven-img:hover {
filter: none;
-webkit-filter: none;
filter: none;
-ms-filter: none;
-o-filter: none;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
.citation-contain {
position: relative;
width: 100%;
height: 600px;
}
.citation-contain ul {
position: relative;
display:inline-table;
width: 80%;
height: 600px;
margin: 0 auto;
}
.citation-contain ul li{
position: relative;
display:table-cell;
vertical-align: middle;
width: 50%;
height: 400px;
}
.citation-contain ul li:nth-child(1){
font-family: "OSB";
font-size: 20rem;
text-align: right;
}
.citation-contain ul li:nth-child(2){
font-family: "PDR";
font-size: 2rem;
letter-spacing: 0.1rem;
color: #000;
}
/* ------------------------------------
NAV
-------------------------------------*/
/* general style for all menus */
nav.menu {
position: fixed;
z-index: 20;
background-color: #fff;
/*background-image: url(../images/lamoureux-ricciotti-mucem-nav.jpg);
background-size: cover;
background-repeat: no-repeat;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);*/
border-right: 1px solid #fff;
overflow: hidden;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
button.close-menu {
background-color: #3184a1;
color: #fff;
}
button.close-menu:focus {
outline: none
}
/* slide menu left and right, push menu left and right */
nav.slide-menu-right, nav.push-menu-right {
width: 820px;
height: 100%;
overflow-y: scroll;
}
nav.slide-menu-left ,nav.push-menu-left {
width: 80%;
height: 100%;
background:#fff;
z-index: 100000000;
}
nav.slide-menu-left li,
nav.slide-menu-right li,
nav.push-menu-left li,
nav.push-menu-right li {
display: block;
text-align: right;
}
nav.slide-menu-left li:first-child,
nav.slide-menu-right li:first-child,
nav.push-menu-left li:first-child,
nav.push-menu-right li:first-child {
border-top: none
}
nav.slide-menu-left li:last-child,
nav.slide-menu-right li:last-child,
nav.push-menu-left li:last-child,
nav.push-menu-right li:last-child {
border-bottom: none
}
nav.slide-menu-left a,
nav.slide-menu-right a,
nav.push-menu-left a,
nav.push-menu-right a {
display: block;
padding: 0px;
}
/*nav.slide-menu-left button.close-menu,
nav.slide-menu-right button.close-menu,
nav.push-menu-left button.close-menu,
nav.push-menu-right button.close-menu {
margin: 10px 0;
padding: 10px 30px;
background-color: #3184a1;
color: #fff;
}*/
nav.slide-menu-left,
nav.push-menu-left {
left: -80%;
display:inline-table;
border-right:1px solid #000;
}
nav.slide-menu-right,
nav.push-menu-right {
right: -820px;
}
body.sml-open nav.slide-menu-left,
body.pml-open nav.push-menu-left {
left: 0;
top:0;
}
body.smr-open nav.slide-menu-right,
body.pmr-open nav.push-menu-right {
right: -20px
}
body nav.push-menu-right .bloc-p-one {
right: -300px
}
body.pmr-open nav.push-menu-right .bloc-p-one {
right: 0px
}
body.pml-open #wrapper, body.pml-open .home {
left: 15%;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
body.pmr-open #wrapper, body.pmr-open .home, body.pmr-open .all-contain {
left: -200px;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
body #wrapper, body .home {
left: 0px;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
z-index: 0;
}
.animate-time {
stroke-dasharray: 1000;
stroke-dashoffset: 1000;
stroke:#000;
-webkit-animation: dash 5s ease forwards ;
-moz-animation: dash 5s ease forwards ;
}
body.pml-open .path {
stroke-dasharray: 1000;
stroke-dashoffset: 1000;
stroke:#000;
fill:none;
-webkit-animation: dash 20s ease forwards ;
-moz-animation: dash 20s ease forwards ;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
body.pml-open a:hover .path {
fill:#000;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-ms-transition: all 0.9s;
-o-transition: all 0.9s;
transition: all 0.9s;
}
@-webkit-keyframes dash {
from {
stroke-dashoffset: 1000;
fill:none;
}
to {
stroke-dashoffset: 900;
fill:#000;
}
}
@-moz-keyframes dash {
from {
stroke-dashoffset: 1000;
fill:none;
}
to {
stroke-dashoffset: 900;
fill:#000;
}
}
/* ------------------------------------
type de BLOG
-------------------------------------*/
.home-article {
position: absolute;
width: 100%;
z-index: 2;
background: none repeat scroll 0% 0% #000;
height: 60vh;
margin: 0 auto 0px;
background: #000;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
.a-title {
position: relative;
z-index: 20;
width: 80%;
height: auto;
color: #FFF;
margin: 100px 10%;
}
.a-title h1 {
font-family: "OSL";
color: #FFF;
letter-spacing: 0.2rem;
line-height: 2.5rem;
text-transform: uppercase;
font-size: 2.5rem;
}
.a-contain {
position: absolute;
bottom: 0;
left: 10%;
width: 80%;
height: 200px;
}
.a-contain h2 {
width:500px;
height:auto;
font-family:"OSB";
text-transform: uppercase;
font-size: 0.8rem;
letter-spacing: 0.1rem;
text-align: left;
color: #fff;
text-align: left;
}
.a-contain b.info-txt {
margin-top:10px;
font-family:"OSL";
font-size: 0.7rem;
letter-spacing: 0.1rem;
line-height: 1.4rem;
margin-left: 20px;
text-align: left;
color: #fff;
}
.a-contain ul.article-info {
position: relative;
width:100%;
height: 200px;
display:inline-table;
}
.a-contain ul.article-info li {
position: relative;
width:33.33%;
height: 200px;
display:table-cell;
vertical-align: middle;
text-align: center;
}
.contain-article {
position: relative;
width: 800px;
height: auto;
margin: 100px auto 0;
}
.img-article.actu {
position: relative;
width: 100%;
height: 500px;
margin-bottom: 100px;
background:url(../images/article-gare-montpelier.jpg);
background-position: center top;
background-repeat: no-repeat;
}
.corpus-article {
position: relative;
width: 100%;
height: auto;
margin-bottom: 200px;
overflow:hidden;
border-top:1px solid #000;
}
.size-full {
max-width: 100%;
height: auto;
}
.corpus-article h1, .corpus-article h2, .corpus-article h3 {
font-family: "OSB";
font-size: 1.1rem;
line-height: 1.3rem;
padding: 20px;
text-align: justify;
letter-spacing: 0.05rem;
color:#000;
}
.corpus-article p {
font-family: "OSL";
font-size: 0.9rem;
line-height: 1.1rem;
padding: 20px;
text-align: justify;
letter-spacing: 0.05rem;
color:#666;
}
.id_mobile {
display:none;
}
/* ------------------------------------
page contact
-------------------------------------*/
.main-contact {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #000;
overflow: hidden;
}
.main-contact h1 {
font-family:"OSL";
font-size: 1.5rem;
letter-spacing: 0.1rem;
line-height: 1.8rem;
color: #efefef;
text-align: left;
margin-top: 5%;
margin-left: 20%;
width: 50%;
display: block;
padding: 30px;
border: 5px solid #fff;
}
.main-contact h1 a{
font-family:"OSB";
font-size: 1.5rem;
letter-spacing: 0.1rem;
line-height: 1.8rem;
color: #efefef;
}
.main-contact .bloc-total-info {
position: relative;
width: 50%;
height: auto;
margin-left: 20%;
margin-top: 5%;
}
.bloc-adress {
position: relative;
width: 60%;
height: auto;
float: left;
}
.bloc-adress p {
font: 12px "OSR";
color: #fff;
margin-top: 20px;
}
.bloc-mail-tel {
position: relative;
width: 40%;
height: auto;
float: left;
}
.bloc-adress h2 {
font-family:"OSR";
font-size: 2rem;
letter-spacing: 0.2rem;
line-height: 2.5rem;
color: #fff;
display: inline-block;
padding-top: 10px;
padding-bottom: 10px;
border-bottom: 5px solid #fff;
}
.bloc-mail-tel h3 {
font-family: "OSEB";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.8rem;
color: #FFF;
padding: 10px;
text-transform: uppercase;
}
.bloc-mail-tel p a {
font-family: "PDR";
font-size: 0.8rem;
letter-spacing: 0.1rem;
line-height: 1.8rem;
color: #FFF;
padding: 10px;
}
.mt {
margin-top: 50px;
}
a.contact-closed {
position: absolute;
top: 20px;
right: 20px;
font-family:"OSL";
font-size: 2rem;
color: #fff;
text-decoration: none;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
a:hover.contact-closed {
opacity: 0.5;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn:after {
display: none;
clear: both;
height: 0;
content: "";
}
.dpsp-networks-btns-wrapper.dpsp-column-6 li {
width: 16.6666%;
filter: grayscale(100%);
}
.dpsp-share-text {
margin-bottom: 10px;
font-weight: 100;
border-top: 1px solid black;
text-transform: uppercase;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook:not(:hover):not(:active) {
color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-twitter:not(:hover):not(:active) {
color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-pinterest:not(:hover):not(:active) {
color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-linkedin:not(:hover):not(:active) {
color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-email:not(:hover):not(:active) {
color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook:focus, .dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook:focus .dpsp-network-icon, .dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook:hover, .dpsp-networks-btns-wrapper .dpsp-network-btn.dpsp-facebook:hover .dpsp-network-icon {
border-color: transparent!important;
color: transparent!important;
background: transparent!important;
}
.dpsp-network-icon-inner {
background:transparent!important;
}
.dpsp-hover .dpsp-network-icon-inner {
border-color: transparent!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn:focus, .dpsp-networks-btns-wrapper .dpsp-network-btn:hover {
border: 0px solid;
outline: none;
box-shadow: 0!important;
box-shadow: 0!important;
}
.dpsp-networks-btns-wrapper .dpsp-network-btn:focus, .dpsp-networks-btns-wrapper .dpsp-network-btn:hover {
border: 0px solid;
outline: none;
box-shadow: 0!important;
box-shadow: 0!important;
}
.dpsp-facebook, .dpsp-twitter, .dpsp-pinterest, .dpsp-linkedin, .dpsp-email {
/* --networkAccent: #334d87; */
/* --networkColor: #3a579a; */
--networkHover: transparent!important;
}
/* ------------------------------------
social
-------------------------------------*/
.dpsp-networks-btns-wrapper {
display:flex!important;
justify-content:center!important;
}
/* ------------------------------------
MEDIA QUERIES
-------------------------------------*/
@media screen and (max-width: 1024px) {
.contain-all {
margin: -20% auto 0!important;
}
.special-padding {
padding-top: 2rem!important;
padding-bottom: 2rem!important;
}
.contain-duo, .contain-duo-pdf {
display: flex;
flex-direction: column!important;
}
.detail-contain ul{
flex-direction: column;
}
.project-title .scroll {
bottom: 14vh!important;
right: 0vh!important;
}
.p-title-block {
align-self: center;
width: 100%!important;
}
.select-pdf {
flex-direction: column-reverse;
padding-left: 2rem;
}
ul.line-staff {
-ms-flex: 0 0 calc((100% / 2) - 0.6rem);
flex: 0 0 calc((100% / 2) - 0.6rem);
max-width: calc((100% / 2) - 0.6rem);
}
.hl-projets:nth-of-type(2n+1) .decal-left {
float: left;
margin-right: 0;
width: 100%;
}
.bkg-stade {
margin-top: 0;
}
.text-theme {
height: auto;
top: 0;
padding-top: 4rem;
padding-bottom: 4rem;
padding-left: 2rem;
padding-right: 4rem;
right: 0;
}
.rect-line {
display: none;
}
.article-details {
height: auto;
}
.img-article.actu {
/* background-size: contain!important; */
background-size: cover!important;
}
.a-contain ul.article-info {
display: flex;
justify-content: center;
flex-direction: column;
padding-left: 5%;
}
.siez-full {
width: 100%;
}
.hl-text {
height: auto;
}
.hl-projets:nth-of-type(2n+1) .decal-left {
margin-right: 0;
}
.box-article a {
height: 100%;
}
.propos-contain p {
font-size: 0.7rem;
line-height: 1.1rem;
}
.contain-article {
position: relative;
width: 100%;
height: auto;
margin: 100px auto 0;
padding: 20px;
}
.img-article {
height: 300px;
width: 100%;
margin-top: 100px;
}
.p-title {
text-align: left;
padding-left: 20px;
}
.corpus-article {
margin-bottom: 100px;
}
.corpus-article {
border-top: 1px dotted #000;
}
.main-contact {
overflow: initial;
}
.main-contact h1 {
font-family: "OSL";
font-size: 1.1rem;
letter-spacing: 0.1rem;
line-height: 1.1rem;
color: #efefef;
text-align: left;
margin-top: 5%;
margin-left: 0;
width: 100%;
display: block;
padding: 20px;
border: 5px solid #fff;
margin-right: 0;
margin: 10px;
width: 90%;
}
.main-contact .bloc-total-info {
position: relative;
width: 100%;
height: auto;
margin-left: 0;
margin-top: 5%;
}
.bloc-adress {
position: relative;
width: 100%;
height: auto;
float: left;
padding: 20px;background: #000;
}
.bloc-mail-tel {
position: relative;
width: 100%;
height: auto;
float: left;
padding-right: 20px;
padding-top: 20px;
padding-left: 20px;
padding-bottom: 100px;
background: #000;
}
.contain-four-txt {
position: relative;
width: 100%;
height: auto;
}
.cita-box h3 {
font-family: "PDR";
font-size: 1.3rem;
letter-spacing: 0.1rem;
line-height: 1.8rem;
text-align: center;
}
.duo-img {
width: 100%;
}
.duo-txt {
width: 100%;
height: auto;
border-bottom: 5px solid #fff;
}
.contain-one-img {
position: relative;
width: 100%;
height: auto;
}
.contain-two-img {
position: relative;
width: 100%;
height: auto;
}
.c-one-one, .c-one-two, .c-two-one, .c-two-two {
position: relative;
float: left;
width: 100%;
height: 100%;
}
.main-home--spe {
height: 100%;
top: 0;
}
#home {
height: 100%;
}
#wrapper {
top: 100%;
}
.contain {
margin-top: 0;
}
.main-agency h1, .main-bfuhp h1, .main-projets h1, .main-article h1 {
font-size: 3.1rem;
letter-spacing: 0.3rem;
line-height: 3.0rem;
transform: translate(20px);
-webkit-transform: translate(20px);
-moz-transform: translate(20px);
}
.text-theme {
position: absolute;
width: 100%;
}
.text-theme h2 {
padding: 0;
}
.t-t {
padding: 0;
}
.cita-box p:nth-child(3) {
text-align: center;
margin: 20px auto 20px;
}
.cita-box {
width: 100%;
margin: 20px auto 20px;
padding: 20px;
}
.cita-box p {
text-align: center;
margin: 0;
}
.main {
height:auto;
}
nav.slide-menu-left, nav.push-menu-left {
left: -80%;
}
nav.slide-menu-left, nav.push-menu-left {
width: 80%;
}
.id_mobile {
display:visible;
}
.main-home, .main-agency, .main-bfuhp, .main-projets, .main-article {
height: 100%;
background-attachment: scroll;
}
.dot-menu {
position: absolute;
width: 50px;
height: 45px;
top: 0;
z-index: 10000000;
background: transparent;
padding: 8px;
}
.menu-all {
position: relative;
width: 100%;
height: 100%;
/* display: table-cell; */
vertical-align: middle;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}
nav.menu ul li.link-projets h1 {
font-size: 1.2rem;
}
p.under-menu-nav {
top: 40px;
}
.scroll {
bottom:5vh!important;
}
.bkg-geometrix {
display:none;
}
.hat-text {
margin-top: 0px;
margin-bottom: 100px;
}
.menu-home {
display:none;
}
.main, .main-to-news {
width: 100%;
}
.hl-projets {
width: 100%;
height:400px;
}
.hl-text {
width: 100%;
height:auto;
}
.decal-left {
margin-left: 0;
}
.decal-right {
margin-right: 0px;
}
.right, .left {
float:left;
}
.mucem-homepage {
display:none;
}
.line-one, .line-two, .line-three, .line-four, .horizontal-line-one, .horizontal-line-two, .horizontal-line-three, .mainline-one, .mainline-two, .mainline-three, .mainline-four, .bfuhp-mainline-one, .bfuhp-mainline-two, .bfuhp-mainline-three, .bfuhp-mainline-four {
display:none;
}
a.focus:hover .bloc-one-img, a.focus:hover .bloc-two-img, a.focus:hover .bloc-three-img, a.focus:hover .bloc-four-img, a.focus:hover .bloc-five-img, a.focus:hover .bloc-six-img {
border: 5px solid #fff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,#grayscale");
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
svg.line-drawing {
display:none;
}
.illustration {
opacity:1;
}
.allprojects {
width:100%;
margin: 0px 0px 0px 0px;
}
.box-news {
width:100%;
}
.box-article, .box-article a, .width-article {
width:100%;
}
.box-article {
position: relative;
float: left;
width: 100%;
height: auto;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 0px solid #000;
border-right: 0px solid #000;
padding: 120px;
}
a.alt-mobile-project {
position: relative;
float: left;
width: 100%;
height: auto;
background: #000;
text-align: center;
display: inline-table;
margin-bottom: 100px;
padding:50px;
}
a.alt-mobile-project p {
font-family: "OSL";
font-size: 0.5rem;
letter-spacing: 0.2rem;
color: #fff;
vertical-align: middle;
display: table-cell;
text-transform:uppercase;
}
.allprojects, .allprojects-under {
display:none;
}
.info-footer {
padding: 30px;
height:auto;
}
.info-footer .bloc-info {
width: 100%;
margin: 0px 0px 0px 0%;
}
.info-footer h1 {
text-align: left;
}
.info-footer h2 {
text-align: left;
margin-bottom: 40px;
}
.info-footer .bloc-loc {
width: 100%;
margin: 0px 0px 0px 0%;
}
.info-footer .bloc-loc h3 {
margin-bottom: 10px;
margin-top:10px;
}
.info-footer .bloc-loc h3, .info-footer .bloc-loc p {
text-align: left;
}
.info-footer .bloc-loc p {
font-size: 0.9rem;
line-height: 1.2rem;
}
.heigh-line {
display:none;
}
.last {
display:none;
}
.decal-up-three, .decal-up-first, .decal-up-second {
margin-top: 0px;
}
.white-mainline {
display:none;
}
.contain {
position: relative;
width: 100%;
}
.optimisation-box {
width:100%;
height: auto;
}
.pos-opti-left {
left: 0px;
}
.pos-opti-right {
right: 0px;
}
.opti-img {
position: relative;
width: 100%;
height: 80vh;
}
.pos-top {
top: 0;
right:0;
}
.pos-opti-right {
top:0;
right: 0;
}
.pos-opti-left {
top:0;
}
.bfuhp-main-line {
width: 100%;
}
.geometrix-stade {
display:none;
}
#main svg {
display:none;
}
.normal-width-txt {
width: 100%;
}
.hat-text-agency {
width: 100%;
height: auto;
margin-bottom: 50px;
padding: 20px;
}
.hat {
width: 100%;
}
.hat h1 {
padding:10px;
margin-top: 100px;
}
.under-hat {
width: 100%;
height: auto;
margin: 0px 0px 40px;
padding: 20px;
}
.select {
padding-bottom: 80px;
padding-top: 80px;
padding-left:0rem!important;
}
.projects-details ul {
display: block;
position: relative;
width: 100%;
height: 100%;
}
.projects-details ul li {
display: block;
position: relative;
vertical-align: middle;
width: 100%;
height: 100%;
}
.projects-details h1 {
position: relative;
font-family: "OSL";
font-size: 1.5rem;
color: #000;
letter-spacing: 0.1rem;
margin-left: 0;
text-transform: uppercase;
padding: 10px;
}
.projects-details p {
position: relative;
font-family: "OSL";
font-style: italic;
font-size: 0.9rem;
color: #000;
letter-spacing: 0.1rem;
margin-left: 0;
text-align: left;
padding: 10px;
}
.project-title ul.project-nav li {
display: table-cell;
width: 25%;
height: auto;
text-align: center;
font-family: "OSL";
font-size: 0.4rem;
padding: 20px;
color: #fff;
letter-spacing: 0.1rem;
text-transform: uppercase;
}
.project-title ul {
position: fixed;
display: inline-table;
width: 70%;
height: auto;
top: 0;
right: 0%;
z-index: 21;
background: #000;
}
.project-title h1 {
font-family: "OSEB";
font-size: 2.8rem;
color: #fff;
letter-spacing: 0.2rem;
line-height: 2.6rem;
text-transform: uppercase;width: 80%;
}
.home-project {
height: 80vh;
}
.project-title h2 {
font-family: "OSL";
font-size: 0.6rem;
color: #fff;
letter-spacing: 0.2rem;
text-align: left;
text-transform: uppercase;
margin-top: 0;
padding-left: 0px;
padding-right: 20px;
padding-top: 0px;
padding-bottom: 0px;
}
.a-contain h2 {
width: 100%;
}
.img-project-first {
height: 400px;
}
.projects-archive {
margin-top: 0;
}
ul.info-line li.title-line {
width: 10%;
border-top: 1px solid #EFEFEF;
font-family: "OSB";
text-transform: uppercase;
padding-left: 20px;
padding-top: 10px;
padding-bottom: 20px;
font-size: 1.3rem;
letter-spacing: 0.1rem;
}
.p-propos {
position: relative;
width: 100%;
height: auto;
margin: 100px auto;
display: table-cell;
vertical-align: middle;
padding: 0;
padding-top: 40px;
padding-bottom: 40px;
padding-left: 20px;
padding-right: 20px;
}
.c-img-one {
height: 600px;
border-bottom: 5px solid #fff;
}
.detail-contain ul li {
position: relative;
width: 100%;
height: auto;
display: block;
vertical-align: middle;
}
.propos-contain {
position: relative;
width: 100%;
height: auto;
margin: 0px auto;
background: #fff;
display: inline-table;
padding-top: 1rem;
padding-bottom: 1rem;
}
.detail-contain {
position: relative;
width: 100%;
height: auto;
}
.c-four-img, .c-seven-img {
height: 400px;
}
.c-five-img, .c-six-img {
height: 400px;
}
.sub-meca {
height: auto;
}
.opti-box-txt {
position: relative;
width: 100%;
padding: 10px;
background: #000;
z-index: 2;
padding: 20px;
}
.contain-three-img {
position: relative;
width: 100%;
height: 600px;
margin-bottom: 4rem;
}
.citation-contain ul {
position: relative;
display: inline-table;
width: 100%;
height: auto;
margin: 0 auto;
}
.citation-contain ul li:nth-child(1) {
font-family: "OSB";
font-size: 4rem;
text-align: right;
}
.citation-contain ul li {
position: relative;
display: table-cell;
vertical-align: middle;
width: auto;
height: auto!important;
}
.citation-contain ul li:nth-child(2) {
font-family: "PDR";
font-size: 1.3rem;
letter-spacing: 0.1rem;
color: #000;
}
.contain-four-img {
position: relative;
width: 100%;
height: 1200px;
margin-top: 4rem;
}
.citation-contain {
position: relative;
width: 100%;
height: auto!important;
}
.c-nine-img, .c-ten-img {
position: relative;
width: 100%;
height: 400px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom: 5px solid #fff;
}
.contain-four-txt {
position: relative;
width: 100%;
height: 400px;
}
.last-img {
height: 600px;
}
.contain-last {
position: relative;
width: 100%;
height: 0;
background: none repeat scroll 0% 0% rgb(255, 255, 255);
padding: 0;
margin-bottom: 0;
padding-bottom: 40px;
}
.article-title {
position: relative;
float: left;
width: 100%;
height: 100%;
}
.article-title h1 {
padding: 20px;
}
.article-title p, .article-txt p {
padding: 20px;
}
.article-txt {
position: relative;
float: left;
width: 100%;
height: 100%;
}
.article-details {
padding-bottom: 20px;
padding-top: 20px;
}
.project-title h1 {
font-size: 1.3rem;
letter-spacing: 0.1rem;
line-height: 1.3rem;
padding-top: 20px;
padding-bottom: 20px;
}
.project-title {
height: 80vh;
}
.project-title p {
text-align: left;
}
.a-contain ul.article-info li {
position: relative;
width: auto;
height: auto;
display: block;
vertical-align: middle;
text-align:left;
}
.a-title {
position: relative;
z-index: 20;
width: 100%;
height: auto;
color: #FFF;
margin: 100px 20px;
}
.a-contain {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 200px;
}
.next-title a {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
padding: 20px;
text-align: left;
color: #fff;
}
.next-title h2 {
font-size: 1rem;
letter-spacing: 0.1rem;
width: 100%;
height: 100%;
}
.c-eleven-img {
position: relative;
width: 100%;
height: 400px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
p.normal-txt {
padding:20px;
}
.opti-img-one, .opti-img-two, .opti-img-three {
background-repeat: no-repeat;
background-size:cover;
}
.pos-txt-left, .pos-txt-right {
left:0px;
right:0;
text-align:left;
}
ul.info-line li.title-line {
width: 100%;
}
ul.info-line li.title-line br {
display:none;
}
.meca, .box-pdf {
width: 100%;
}
ul.meca-line, ul.reco-line, ul.perf-line {
width: 100%;
margin-left:0px;
display: block;
padding: 20px;
margin-bottom: 40px;
}
ul.meca-line li, ul.reco-line li, ul.perf-line li {
display: block;
margin-bottom:20px;
}
.pdlr {
display:none;
}
.partenaires-box {
width:100%;
height:auto;
margin-bottom: 40px;
margin-left: 0%;
}
ul.partenaires-line {
display: block;
width: 100%;
}
ul.partenaires-line li {
display: block;
width: 100%;
padding:40px;
margin-bottom: 0;
}
ul.meca-line li, ul.reco-line li, ul.perf-line li {
width: 100%;
}
.mb {
margin-bottom: 40px;
}
.main-line {
width: 100%;
}
.theme-line {
width: 100%;
height: 100vh;
}
.cita-box {
width:100%;
margin: 100px auto 100px;
padding:20px;
}
.cita-box h3 {
font-family: "PDR";
font-size: 2rem;
letter-spacing: 0.1rem;
line-height: 2.2rem;
text-align: center;
}
.bkg-stade {
position: relative;
background: 100%;
background-image: none;
/* height: 400px;*/
background-image: url(images/travaux-stade-jean-bouin-lamoureux-ricciotti.jpg);
z-index: -2;
margin-top: -500px;
}
ul.reco-line li h3 {
font-family: "OSEB";
font-size: 2.1rem;
text-align: ;
}
.main-home--spe {
background-attachment: inherit;
}
.lamoureux-txt h4, .ricciotti-txt h4 {
font-size: 2rem;line-height: 2.2rem;
}
.ricciotti-txt p, .ricciotti-txt h4 {
text-align: left;
}
.hat h1 {
letter-spacing: 0;
}
ul.line-staff li {
display: block;
width: 100%;
height: auto;
}
.boss-box {
width: 100%;
height: auto;
}
.lamoureux-box{
display: flex;
flex-direction: column-reverse;
}
.ricciotti-box {
display: flex;
flex-direction: column;
}
.ricciotti-img, .lamoureux-img {
height: 100%!important;
background-position:top!important;
}
.lamoureux-box, .ricciotti-box {
width: 100%;
padding:20px;
margin-bottom: 80px;
}
.lamoureux-txt p, .lamoureux-txt h4 {
text-align: left;
padding: 20px;
}
.lamoureux-txt {
width: 100%;
/* height: 400px; */
padding: 0px;
z-index: 40;
background: none repeat scroll 0% 0% #FFF;
position: relative;
top: 0px;
left: 0px;
margin-bottom: 40px;
}
.ricciotti-txt {
/* height: 400px; */
z-index: 20;
background: none repeat scroll 0% 0% #FFF;
position: relative;
padding: 20px;
left: 0px;
position: relative;
top: 0px;
width: 100%;
margin-bottom: 40px;
}
.lamoureux-img-box {
position: relative;
top: 0;
left: 0;
width: 100%;
height: 400px;
background: #000;
}
.ricciotti-img-box {
position: relative;
top: 0;
left: 0;
width: 100%;
height: 400px;
background: #000;
}
.angle-box {
display:none;
}
.reward {
width: 100%;
height: auto;
}
.reward ul {
position: relative;
width: 100%;
height: auto;
display: block;
margin-bottom: 40px;
}
.reward ul li, .big_award li {
display: block;
width: 100%!important;
height: auto;
padding-top: 0px;
padding:40px;
}
.staff-box {
width: 100%;
}
.img-boss-two {
position:relative;
width:100%;
height:400px;
background-image:url(images/lamoureux-ricciotti-agence-duo.jpg);
background-position: center top;
background-size:cover;
background-repeat:no-repeat;
}
}
@media screen and (max-width: 700px) {
.select-pdf {
flex-direction: column-reverse;
}
.bloc-nav-home2 {
flex-direction: column!important;
}
.bloc-nav-home2 li {
margin-left: 0rem!important;
}
.bloc-nav-home2 li:not(:last-child) {
margin-bottom: 0rem!important;
}
ul.line-staff {
display: inline-table;
width: 100%;
height: auto;
padding: 20px;
-ms-flex: 0 0 calc((100% / 1) - 0.6rem);
flex: 0 0 calc((100% / 1) - 0.6rem);
max-width: calc((100% / 1) - 0.6rem);
}
.main-agency h1, .main-bfuhp h1, .main-projets h1, .main-article h1 {
font-size: 2.1rem;
letter-spacing: 0.2rem;
line-height: 2.0rem;
}
.over {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.box-news {
height:auto;
}
.box-article {
width: 100%;
height: 500px;
padding: 20px;
}
.hat h1 {
font-size: 1.5rem;
line-height:1.6rem;
padding:10px;
}
.normal-width {
padding:20px;
}
.hat {
width:100%;
pading:20px;
}
/*.hat h1 br {
display:none;
}*/
h3.hl-title {
font-family: "OSEB";
text-transform: uppercase;
font-size: 1.4rem;
color: #000;
letter-spacing: 0.1rem;
line-height: 1.4rem;
padding: 10px;
}
/*
.hl-text {
display:none;
}
*/
/*
.reward {
display:none;
}
*/
}
/* PLYR */
.plyr--video .plyr__controls {
padding: 0!important;
}
.plyr button {
background: transparent;
border:none;
width: 4rem !important;
height: 4rem !important;
}
.plyr button svg {
width: 100%;
height: 100%;
fill: #fff;
}
.plyr__volume--display {
display: none;
}
.plyr--video .plyr__controls {
justify-content: space-between !important;
background: linear-gradient(rgba(0,0,0,0),rgb(0, 0, 0));
}
@keyframes plyr-progress{to{background-position:25px 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:auto;-webkit-font-smoothing:subpixel-antialiased;direction:ltr;font-family:Avenir,"Avenir Next","Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif;font-variant-numeric:tabular-nums;font-weight:500;line-height:1.7;max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease}.plyr audio,.plyr video{border-radius:inherit;height:auto;vertical-align:middle;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4f5b5f;border-radius:2px;color:#fff;font-size:9px;line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;color:#fff;display:none;font-size:14px;left:0;padding:10px;position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions .plyr__caption{background:rgba(0,0,0,.8);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__captions .plyr__caption div{display:inline}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:16px;padding:20px}}@media (min-width:768px){.plyr__captions{font-size:18px}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(-40px)}.plyr__control{background:0 0;border:0;border-radius:3px;color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;pointer-events:none;width:18px}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{box-shadow:0 0 0 5px rgba(26,175,255,.5);outline:0}a.plyr__control{text-decoration:none}a.plyr__control::after,a.plyr__control::before{display:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#1aafff;color:#fff}.plyr--video .plyr__control svg{filter:drop-shadow(0 1px 1px rgba(0, 0, 0, .15))}.plyr--video .plyr__control.plyr__tab-focus,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#1aafff;color:#fff}.plyr__control--overlaid{background:rgba(26,175,255,.8);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15);color:#fff;display:none;left:50%;padding:15px;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#1aafff}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__menu,.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls .plyr__volume,.plyr__controls>.plyr__control{margin-left:5px}.plyr__controls .plyr__menu+.plyr__control,.plyr__controls .plyr__progress+.plyr__control,.plyr__controls>.plyr__control+.plyr__control,.plyr__controls>.plyr__control+.plyr__menu{margin-left:2px}.plyr__controls>.plyr__control:first-child,.plyr__controls>.plyr__control:first-child+[data-plyr=pause]{margin-left:0;margin-right:auto}.plyr__controls:empty{display:none}@media (min-width:480px){.plyr__controls .plyr__menu,.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls .plyr__volume,.plyr__controls>.plyr__control{margin-left:10px}}.plyr--audio .plyr__controls{background:#fff;border-radius:inherit;color:#4f5b5f;padding:10px}.plyr--video .plyr__controls{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.7));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;left:0;padding:20px 5px 5px;position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:35px 10px 10px}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4f5b5f;font-size:16px;margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border-top-color:rgba(255,255,255,.9);content:'';height:0;position:absolute;right:15px;top:100%;width:0}.plyr__menu__container [role=menu]{padding:7px}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4f5b5f;display:flex;font-size:14px;padding:4px 11px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:28px}.plyr__menu__container .plyr__control--forward::after{border-left-color:rgba(79,91,95,.8);right:5px}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:500;margin:7px;margin-bottom:3px;padding-left:28px;position:relative;width:calc(100% - 14px)}.plyr__menu__container .plyr__control--back::after{border-right-color:rgba(79,91,95,.8);left:7px}.plyr__menu__container .plyr__control--back::before{background:#b7c5cd;box-shadow:0 1px 0 #fff;content:'';height:1px;left:0;margin-top:4px;overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px}.plyr__menu__container .plyr__control[role=menuitemradio]::after,.plyr__menu__container .plyr__control[role=menuitemradio]::before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]::before{background:rgba(0,0,0,.1);content:'';display:block;flex-shrink:0;height:16px;margin-right:10px;transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]::after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{background:#1aafff}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover::before{background:rgba(0,0,0,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;overflow:hidden;padding-left:25px;pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:26px;color:#1aafff;display:block;height:19px;margin:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:2.5px;height:5px;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);height:13px;position:relative;transition:all .2s ease;width:13px;-webkit-appearance:none;margin-top:-4px}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:2.5px;height:5px;transition:box-shadow .3s ease;-moz-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);height:13px;position:relative;transition:all .2s ease;width:13px}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;height:5px}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:2.5px;height:5px;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:2.5px;height:5px;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:2.5px;height:5px;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);height:13px;position:relative;transition:all .2s ease;width:13px;margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{box-shadow:0 0 0 5px rgba(26,175,255,.5);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{box-shadow:0 0 0 5px rgba(26,175,255,.5);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{box-shadow:0 0 0 5px rgba(26,175,255,.5);outline:0}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr__poster{background-color:#000;background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr__time{font-size:14px}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px}@media (max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr--video .plyr__time{text-shadow:0 1px 1px rgba(0,0,0,.15)}.plyr__tooltip{background:rgba(255,255,255,.9);border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4f5b5f;font-size:14px;font-weight:500;left:50%;line-height:1.3;margin-bottom:10px;opacity:0;padding:5px 7.5px;pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.9);bottom:-4px;content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:16px}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:16px;transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr--video{background:#000;overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;border-radius:inherit;overflow:hidden;position:relative;z-index:0}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;height:100%;left:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr__progress{flex:1;left:6.5px;margin-right:13px;position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-right:-6.5px;width:calc(100% + 13px)}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:14px;left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:5px;left:0;margin-top:-2.5px;padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;transition:width .2s ease}.plyr--video .plyr__progress__buffer{box-shadow:0 1px 1px rgba(0,0,0,.15);color:rgba(255,255,255,.25)}.plyr--audio .plyr__progress__buffer{color:rgba(183,197,205,.66)}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(47,52,61,.6) 25%,transparent 25%,transparent 50%,rgba(47,52,61,.6) 50%,rgba(47,52,61,.6) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25)}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(183,197,205,.66)}.plyr__volume{align-items:center;display:flex;flex:1;position:relative}.plyr__volume input[type=range]{margin-left:5px;position:relative;z-index:2}@media (min-width:480px){.plyr__volume{max-width:90px}}@media (min-width:768px){.plyr__volume{max-width:110px}}.plyr--is-ios .plyr__volume{display:none!important}.plyr--is-ios.plyr--vimeo [data-plyr=mute]{display:none!important}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}.plyr:-ms-fullscreen .plyr__captions{font-size:21px}.plyr:fullscreen .plyr__captions{font-size:21px}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;width:100%}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:rgba(47,52,61,.8);border-radius:2px;bottom:10px;color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:5px;left:0;margin:-2.5px 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr__preview-thumb{background-color:rgba(255,255,255,.9);border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);margin-bottom:10px;opacity:0;padding:3px;pointer-events:none;position:absolute;transform:translate(0,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0,0) scale(1)}.plyr__preview-thumb::before{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.9);bottom:-4px;content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#b7c5cd;border-radius:2px;overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img{height:100%;left:0;max-height:none;max-width:none;position:absolute;top:0;width:100%}.plyr__preview-thumb__time-container{bottom:6px;left:0;position:absolute;right:0;white-space:nowrap;z-index:3}.plyr__preview-thumb__time-container span{background-color:rgba(0,0,0,.55);border-radius:2px;color:#fff;font-size:14px;padding:3px 6px}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;-o-object-fit:contain;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important}