/*
Theme Name: Willie Beamen
Theme URI: http://www.mentalworks.fr/
Author: Mental Works
Author URI: http://www.mentalworks.fr/
Description: Willie Beamen Theme
Version: 1.0
Text Domain: williebeamen
*/


/* Commons */

@font-face {
    font-family: 'proxima_nova_altblack';
    src: url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.eot');
    src: url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.woff2') format('woff2'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.woff') format('woff'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.ttf') format('truetype'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Black-webfont.svg#proxima_nova_altblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'proxima_nova_altbold';
    src: url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.eot');
    src: url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.woff2') format('woff2'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.woff') format('woff'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.ttf') format('truetype'),
         url('./fonts/Mark Simonson - Proxima Nova Alt Bold-webfont.svg#proxima_nova_altbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'EB Garamond';
    src: url('./fonts/EBGaramond-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
	font-family: "Proxima Nova Light";
	src: url("./fonts/Proxima Nova Light.eot");
	src: url("./fonts/Proxima Nova Light.svg") format("svg"),
		 url("./fonts/Proxima Nova Light.ttf") format("truetype"),
		 url("./fonts/Proxima Nova Light.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
    font-family: "Proxima Nova Regular";
    src: url("./fonts/Mark Simonson - Proxima Nova Alt Regular-webfont.eot");
    src: url("./fonts/Mark Simonson - Proxima Nova Alt Regular-webfont.svg") format("svg"),
         url("./fonts/Mark Simonson - Proxima Nova Alt Regular-webfont.ttf") format("truetype"),
         url("./fonts/Mark Simonson - Proxima Nova Alt Regular-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}


html, body {
	font-family: 'Proxima Nova Regular', sans-serif;
	position: relative;
}

img {
	max-width: 100%;
	//width: 100%;
	height: auto;
}

p {
	color:  #000000;
	font-size: 24px;
	font-size: 1.3vmax;
	font-weight: 400;
	line-height: 32px;
	line-height: 1.5vmax;
	text-align: justify;
	margin-bottom: 30px;
	margin-top: 10px;
	word-spacing: -1px;
	letter-spacing: -1px;
}

h1, h2, h3 {
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
}

iframe {
	max-width: 100%;
}

.en {
	padding-left: 5px;
}

.hidden-elem {
	opacity:0;
}
.visible{
	opacity:1;
}

.container {
	max-width: 100%;
}

body.home .main-gif {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.7s;
    -moz-transition: -moz-transform 0.7s;
    transition: transform 0.7s;
    -webkit-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    -moz-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    -webkit-transform: translateY(0);
    transform: translateY(0);
    background: #FFF;
}

body.home.loaded .main-gif {
    -webkit-transform: translateY(-100vh);
    transform: translateY(-100vh);
}

@media (max-width: 767px) {
	.main-gif.mobile-off {		
		display: none;
	}
}

.main-gif.anim-off {		
		display: none;
		-webkit-transition: -webkit-transform 0s;
		-moz-transition: -moz-transform 0s;
		transition: transform 0s;
}

.main-gif.anim-off #video_intro {
	display: none;
}

body.home .wrap-gif {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow: hidden;
}

body.home .wrap-gif video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: -999;
    overflow: hidden;
}

body.home #owl-header {
	background-color: #000;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.7s;
    -moz-transition: -moz-transform 0.7s;
    transition: transform 0.7s;
    -webkit-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    -moz-transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    transition-timing-function: cubic-bezier(0.91, 0.01, 0.6, 0.99);
    -webkit-transform: translateY(100vh);
    transform: translateY(100vh);    
}

body.home.loaded #owl-header {
    -webkit-transform: translateY(0%);
    transform: translateY(0%);    
}

#main a.toggle {
	display: none;
}

#main.fixed {
	position: relative;
	z-index: 1000;
}

#infscr-loading { 
	text-align: center;
	z-index: 100;
	position: fixed;
	left: 50%;
	bottom: 40px;
	width: 200px;
	margin-left:-100px;
	padding: 10px;
	background: #000; 
	opacity: 0.8;
	color: #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.load-more-manual {
	display: block !important;
}

.load-more-manual #page-nav {
	position: relative;
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'Proxima Nova Regular', sans-serif;
	//display:none !important;
	color: #000000;
	font-size: 25px;
	font-size: 1.3vw;
	//font-weight: 700;
	line-height: 50px;
	line-height: 3vw;
	text-align: center;
	//background-color: #0bfdde;
	width: 350px;
	//width: 33vw;
	width: fit-content;
	height: 50px;
	height: 3vw;
	display: block;
	margin: auto;
	margin-top: 40px;
	margin-bottom: 40px;
	text-decoration: none;
	text-transform: uppercase;
}

.load-more-manual #page-nav::after {
	position: absolute;
	display: none;
	content: '';
	width: 100%;
	height: 2px;	
	background: #000;
	bottom: 5px;
	left: 0;
    right: 0;
}

.load-more-manual #page-nav:hover {
	font-weight: 700;
	//color: #0bfdde;
	//background-color: #000000;
}

.load-more-manual #page-nav:hover::after {
	display: block;
}

a.goback {
	color: #000000;
    font-size: 27px;
	//font-size: 1.3vmax;
	//font-weight: 400;
    line-height: 32px;
    line-height: 1.5vmax;
	text-decoration: none;
	//display: block;
	display: inline-block;
	width: min-content; 
	width: auto; 
    position: relative;
	//margin-left: 40px;
	//width: 167px;
	width: 170px;
	position: relative;
	display: block;

    //font-family: 'proxima_nova_altblack', sans-serif;
    font-family: 'proxima_nova_altbold', sans-serif;
    // line-height: 1.5vw;
    font-weight: 900;
    text-transform: uppercase;

}

/*a.goback::before {
	content: '<<';
	position: absolute;
    padding-right: 10px;
    left: -40px;
}

a.goback:hover::after {
	display: block;
}

a.goback::after {
	position: absolute;
    display: none;
    content: '';
    width: 100%;
    height: 1px;
    background: #000000;
    left: 0;
    right: 0;
}

main.projet a.goback {
	margin-bottom: 30px;
}*/

main a.goback img.back {
	//margin-bottom: 30px;
	margin-bottom: 5px;
}

main a.goback img.back-hover {
	//margin-bottom: 30px;	
	margin-bottom: 5px;
}

main a.goback img.back-hover {	
	display: none;
}

main a.goback:hover img.back {	
	display: none;
}

main a.goback:hover img.back-hover {	
	display: inline-block;
}

@media (max-width: 991px) {
	p {
		font-size: 20px;
		line-height: 24px;
	}
	.load-more-manual #page-nav {
		font-size: 16px;
		line-height: 40px;
		height: 40px;
		width: 310px;
	}
	/*a.goback {
		font-size: 20px;
		line-height: 24px;	
	}
	a.goback img {
		width: 70%;
		height: auto;
	}*/
}

.container {
    padding-right: 45px;
    padding-left: 45px;
}

@media (min-width: 1200px) {
	.container {
		/* max-width: 1170px; */
		max-width: 1570px;
		width: 100%;
	}
}

@media (min-width: 1600px) {
	.container {
		max-width: 1920px;
		width: 100%;
	}
}

@media (max-width: 991px) {
	.container {
		padding-right: 15px;
		padding-left: 15px;
	}
}

/* Navigations */

nav.nav-top {
	position: absolute;
	top: 10px;
	left: 0;
	right: 0;
	z-index: 2;
	background: transparent !important;
}

nav.nav-top.fixed {
	position: fixed;
}


nav.nav-top .menu ul  .page_item a {
	color: white;	
}

nav.nav-top .menu ul  .page_item a::after {
	background: white;
}

nav.nav-top .social a i {
	color: white;
}

nav.nav-top .languages a {	
	color: white;
	//text-underline-position: under;
}

nav.nav-top .languages a::after {	
	background: white;
}

nav.nav-top .languages a:last-child::before {
	background: white;
}

nav.nav-top .navbar-header {
	display: none;
}

/*.page-template-template-news nav,
.post-template-default nav {
	background: #0bfdde;
}*/

.page-template-template-agence nav,
.page-template-template-contact nav {
	background: #1c1c1c;
}

.page-template-template-news nav#mainNav,
.post-template-default nav#mainNav,
.page-template-template-projets nav#mainNav,
.projet-template-default nav#mainNav,
.page-template-template-mentions nav#mainNav {
	background: white;
}

nav#mainNav {
	position: relative;
	//top: -11px;	
	top: 0;
}

nav#mainNav.parrallax {
	z-index: 200;	
}

nav#mainNav.fixed{
	position:fixed;	
    width: 100%;
	top:0 !important;
    left: 0;
    right: 0;
	z-index:1001;
	/*-moz-transition: all 1200ms ease-out;
    -webkit-transition: all 1200ms ease-out;
    -o-transition: all 1200ms ease-out;
    transition: all 1200ms ease-out; 
	opacity: 1;*/
	margin-top: 0 !important;
}

a.btn-scroll {
	position: absolute;
	top: -180px;
	left: 0;
    right: 0;
    z-index: 10;
	margin: auto;
	display: block;
	width: 50px;
	height: auto;
	text-align: center;
	text-decoration: none;
}

a.btn-scroll.fixed {
	z-index: 1;
	position: fixed;
	bottom: 50px;
	top: auto;
}

a.btn-scroll .scroll{
	color: white;
	margin-bottom: 10px;
	text-transform: uppercase;
	font-weight: 600;
	/*animation: mycolor 1s infinite;
	-webkit-animation: mycolor 1s infinite;
	-moz-animation: mycolor 1s infinite;
    -o-animation: mycolor 1s infinite;*/
}

a.btn-scroll .dot {
	border-radius: 50%;    
    width: 8px;
    height: 8px;
	margin: auto;
    margin-bottom: 10px;	
	background: white;
	//opacity: 0.5;
	animation: mycolor 1s infinite;
	-webkit-animation: mybackground 1s infinite;
	-moz-animation: mybackground 1s infinite;
    -o-animation: mybackground 1s infinite;
}

/*nav#mainNav .btn-scroll .dot:nth-child(2) {
	opacity: 1;
}*/

a.btn-scroll .dot:nth-child(3) {
	animation-delay: 500ms;
	-webkit-animation-delay: 500ms;
	-moz-animation-delay: 500ms;
	-o-animation-delay: 500ms;
}

a.btn-scroll i{
	color: white;
	opacity: 0.5;
	//font-size: 24px;
	font-size: 18px;
	position:relative;
    animation:mymove 1s infinite;
    -webkit-animation:mymove 1s infinite;
    -moz-animation:mymove 1s infinite;
    -o-animation:mymove 1s infinite;
}

@keyframes mymove {
    from {top:0;}
	50% {top:20px;}
    to {top:0;}
}
 
@-webkit-keyframes mymove {
    from {top:0;}
	50% {top:20px;}
    to {top:0;}
}
         
@-moz-keyframes mymove {
    from {top:0;}
	50% {top:20px;}
    to {top:0;}
}
         
@-o-keyframes mymove {
    from {top:0;}
	50% {top:20px;}
    to {top:0;}
}

@keyframes mycolor {
    from {color:white;}
    50%{color:transparent;}
	to {color:white;}
}
 
@-webkit-keyframes mycolor {
    from {color:white;}
    50%{color:transparent;}
	to {color:white;}
}
         
@-moz-keyframes mycolor {
    from {color:white;}
    50%{color:transparent;}
	to {color:white;}
}
         
@-o-keyframes mycolor {
    from {color:white;}
    50%{color:transparent;}
	to {color:white;}
}

@keyframes mybackground {
    from {background-color:white;}
    50% {background-color:transparent;}
	to {background-color:white;}
}
 
@-webkit-keyframes mybackground {
    from {background-color:white;}
    50% {background-color:transparent;}
	to {background-color:white;}
}
         
@-moz-keyframes mybackground {
    from {background-color:white;}
    50% {background-color:transparent;}
	to {background-color:white;}
}
         
@-o-keyframes mybackground {
    from {background-color:white;}
    50% {background-color:transparent;}
	to {background-color:white;}
}

nav .row {
	display: flex;
}

nav .left-nav {
	margin: auto;
    padding-top: 20px;
    padding-bottom: 20px;
	padding-left: 30px;
}

nav .left-nav h2.heading {
	display: none;
}

nav .left-nav .home {
	display: inline-block;
}

nav .left-nav .home .website {
	display: none;
}

nav .left-nav .home .logo.hover {
	display: none;
}

nav .left-nav .home .logo.mobile {
	display: none;
}

nav .left-nav:hover .home .logo {
	display: none;
}

nav .left-nav:hover .home .logo.hover.mobile {
	display: none;
}

nav .left-nav:hover .home .logo.hover {
	display: block;
}

nav .left-nav:hover .home .website {
	color: white;
    font-size: 18px;
    font-size: 1vw;
    font-weight: 700;
    text-align: left;
	line-height: 18px;
	line-height: 1vw;
    text-transform: uppercase;    
	padding-top: 20px;
    display: none;
}

nav .home {
	height: 100%;
    display: inline-block;
    position: relative;
    //width: 130px;
	//width: 80px;
	width: 60px;
	//z-index: 1;
	text-decoration: none;
}

nav .right-nav {
	display: inline-block;
	text-align: right;	
}

nav .menu {
	text-align: right;
	display: inline-block;
	padding-left: 30px;
    padding-right: 30px;
}

nav .menu ul {
	margin-bottom: 0;
}

nav .menu ul  .page_item {
	display: inline-block;	
}

nav .menu ul .page_item.page-item-1635,
nav .menu ul .page_item.page-item-1637 {
	display: none !important;
}

nav .menu ul .page_item a {
	//font-family: 'proxima_nova_altbblack', sans-serif;
	font-family: 'Proxima Nova Regular', sans-serif;
	color: #0c0c0c;
	//font-size: 21px;
	font-size: 18px;
	font-size: 1vw;
	font-weight: 700;
	text-align: left;
	text-transform: uppercase;	
	//padding-left: 15px;
	//padding-right: 15px;
	margin-left: 10px;
	margin-right: 10px;
	padding-top: 40px;
	padding-bottom: 40px;
	display: block;
	text-decoration: none;
	position: relative;
	//text-underline-position: under;
}

nav .menu ul  .page_item a::after {
	position: absolute;
	display: none;
	content: '';
	width: 100%;
	height: 1px;	
	background: #0c0c0c;
	left: 0;
    right: 0;
}

nav .menu ul  .page_item a:hover::after {
	display: block;
}

/*.page-template-template-news nav .menu ul  .page_item a,
.post-template-default nav .menu ul  .page_item a,*/
.page-template-template-agence nav .menu ul  .page_item a,
.page-template-template-contact nav .menu ul  .page_item a  {
	color: white;
}

/*.page-template-template-news nav .menu ul  .page_item a:hover::after,
.post-template-default nav .menu ul  .page_item a:hover::after,*/
.page-template-template-agence nav .menu ul  .page_item a:hover::after,
.page-template-template-contact nav .menu ul  .page_item a:hover::after  {
	background: white;
}

nav .social {
	display: inline-block;
	//padding-right: 20px;
}

nav .social a {
	display: inline-block;
	padding-left: 8px;
	padding-right: 8px;	
}

nav .social a i {
	font-size: 15px;
	color: #0c0c0c;
}

/*.page-template-template-news nav .social a i,
.post-template-default nav .social a i, */
.page-template-template-agence nav .social a i,
.page-template-template-contact nav .social a i {
	color: white;
}

nav .languages {	
	display: inline-block;
	position: relative;
}

nav .languages a {	
	font-family: 'Proxima Nova Light', sans-serif;
	display: inline-block;
	color: #0c0c0c;
	//font-size: 21px;
	font-size: 18px;
	font-size: 1vw;	
	text-transform: uppercase;
	text-decoration: none;
	position: relative;
	//text-underline-position: under;
}

/*nav .languages hr {
	width: 1px;
    height: 0.8vw;
    background: white;
    display: inline-block;
    position: absolute;
	margin-top: 5px;
}*/

nav .languages a.current {
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'Proxima Nova Regular', sans-serif;
	font-weight: 700;
}

nav .languages a::after {
	position: absolute;
	display: none;
	content: '';
	width: 100%;
	height: 1px;	
	background: #0c0c0c;
	left: 0;
    right: 0;
}

nav .languages a:hover::after {
	display: block;
}

nav .languages a:first-child {
	margin-right: 5px;
}

/*.page-template-template-news nav .languages a,
.post-template-default nav .languages a,*/
.page-template-template-agence nav .languages a,
.page-template-template-contact nav .languages a {
	color: white;
}

/*.page-template-template-news nav .languages a:hover::after,
.post-template-default nav .languages a:hover::after,*/
.page-template-template-agence nav .languages a:hover::after,
.page-template-template-contact nav .languages a:hover::after {
	background: white;
}

nav .languages a:last-child {
    padding-left: 0;
    margin-left: 5px;
}

nav .languages a:last-child::before {
	content: "";
	height: 17px;
	height: 0.9vw;
	width: 1px;
	background: #0c0c0c;
	position: absolute;
	display: inline-block;
	bottom: 23%;
	left: -5px;
}

/*.page-template-template-news nav .languages a:last-child::before,
.post-template-default nav .languages a:last-child::before,*/
.page-template-template-agence nav .languages a:last-child::before,
.page-template-template-contact nav .languages a:last-child::before {
	background: white;
}

@media (min-width: 992px) {
	nav .right-nav {
		top: 0 !important;
		padding-right: 25px;
	}
}

@media (max-width: 991px) {
	.page-template-template-contact nav,
	.projet-template-default nav{
		background-color: #f2f2f2;
	}		
	nav .row {
		display: block;
	}
	nav.nav-top {
		top: 0;
		z-index: 100;
		-moz-transition: all 600ms ease-out;
		-webkit-transition: all 600ms ease-out;
		-o-transition: all 600ms ease-out;
		transition: all 600ms ease-out;
		background: transparent;		
		height: 0;
	}
	nav.nav-top.grey {
		background: #f2f2f2 !important;
		height: 700px;
		width: 100%;
		-moz-transition: all 600ms ease-out;
		-webkit-transition: all 600ms ease-out;
		-o-transition: all 600ms ease-out;
		transition: all 600ms ease-out;
		display: block;
		z-index: 2000;
	}
	nav.nav-top .left-nav {
		padding-top: 30px;
		padding-left: 30px;
		width: 100%;
	}
	nav.nav-top .right-nav {
		//background : #f2f2f2;
		padding-top: 40px;	
		left: -10px;
	}
	nav .left-nav {
		padding-top: 5px;
		padding-bottom: 5px;
		min-height: 90px;
	}
	nav .left-nav .home {
		display: none;
	}
	nav.nav-top.fixed.grey .left-nav .home {
		display: inline-block;
		margin-top: 10px;
	}
	nav.nav-top.fixed.grey .left-nav .home .logo {
		display: none;
	}
	nav.nav-top.fixed.grey .left-nav .home .logo.mobile {
		display: block;
	}
	nav.nav-top.fixed.grey .left-nav .home .logo.hover.mobile {
		display: none;
	}
	nav.nav-top.fixed.grey .left-nav .home:hover .logo.hover {
		display: none;
	}
	nav.nav-top.fixed.grey .left-nav .home:hover .logo.mobile {
		display: none;
	}
	nav.nav-top.fixed.grey .left-nav .home:hover .logo.hover.mobile {
		display: block;
	}
	nav.nav-top .left-nav .home:hover .website {
		font-size: 18px;
		line-height: 18px;
	}
	nav .left-nav h2.heading {		
		color: #0c0c0c;
		font-size: 35px;
		font-size: 5vmin;
		font-weight: 700;
		min-height: 80px;
		line-height: 35px;		
		display: inline-block;
		text-transform: uppercase;
		margin-top: 0;
		margin-bottom: 0;
		padding-top: 22px;
		padding-bottom: 23px;
	}
	.post-template-default nav .left-nav h2.heading
	.page-template-template-news nav .left-nav h2.heading,	
	.page-template-template-agence nav .left-nav h2.heading {
		color: white;
	}		
	nav .right-nav {	
		display: none;
		text-align: left;		
		top: 600px;
	}	
	nav.nav-top .menu {
		padding-left: 0;
		padding-right: 0;
	}	
	nav.nav-top .menu ul .page_item {
		display: block;
		transition-property: transform,opacity;
		position: relative;
		opacity: 0;
		transform: translate3d(0,50px,0);
	}
	nav.nav-top .collapse .menu ul .page_item {
		transition-duration: .5s;
		transition-delay: 2s;
		transition-timing-function: cubic-bezier(.42,0,.58,1);
	}
	nav.nav-top.grey .collapse.in {
		display: block;
		opacity: 1;
	}
	nav.nav-top.grey .collapse.in .menu ul .page_item {	
		display: flex;
		transition-duration: .75s,.35s;
		transition-property: transform,opacity;
		transition-delay: 0s;
		transition-timing-function: cubic-bezier(.42,0,.58,1);
		opacity: 1;
		transform: translate3d(0,0,0);
	}
	nav.nav-top.grey .collapse.in .menu ul .page_item:nth-child(1) {
		transition-delay: calc(.05s * 1);
	}
	nav.nav-top .menu ul {
    	padding-left: 15px;
	}
	nav.nav-top .menu ul .page_item a {
		padding-top: 10px;
		padding-bottom: 0;
		color: #000000;
	}
	nav.nav-top .menu ul  .page_item a:hover::after {
		background: #000000;
	}	
	nav.nav-top .navbar-header,
	nav#mainNav .navbar-header {
		display: inline-block;
		float: right;
	}
	nav#mainNav .navbar-header {
		margin-top: 15px;
	}
	nav.nav-top .navbar-header .navbar-toggle.open,
	nav#mainNav .navbar-header .navbar-toggle.open {
		padding: 0 10px;	
	}
	nav.nav-top .navbar-header .navbar-toggle.close,
	nav#mainNav .navbar-header .navbar-toggle.close {
		position: relative;
		display: none;
		float: right;
		padding: 0 10px;
		margin-top: 0;
		margin-right: 15px;
		margin-bottom: 8px;
		background-color: #fff;
		background-image: none;
		border-radius: 50%;
		width: 57px;
		height: 57px;
		opacity: 1;
	}
	nav.nav-top .navbar-header .navbar-toggle.close>span,
	nav#mainNav .navbar-header .navbar-toggle.close>span {
		height: 2px;
		width: 40px;
		display: block;
		background-color: #292929;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate3d(-50%,-50%,0) rotate(-45deg);		
	}
	nav.nav-top .navbar-header .navbar-toggle.close>span:nth-child(2),
	nav#mainNav .navbar-header .navbar-toggle.close>span:nth-child(2){
		transform: translate3d(-50%,-50%,0) rotate(45deg);
	}
	nav.nav-top .navbar-header .navbar-toggle.open .icon-bar+.icon-bar,
	nav#mainNav .navbar-header .navbar-toggle.open .icon-bar+.icon-bar {
		margin-top: 12px;
	}
	nav.nav-top .navbar-header .navbar-toggle.open .icon-bar,
	nav#mainNav .navbar-header .navbar-toggle.open .icon-bar {
		background: white;
		width: 40px;		
	}
	nav#mainNav .navbar-header .navbar-toggle.open .icon-bar {
		background: #0c0c0c;
	}
	.post-template-default nav#mainNav .navbar-header .navbar-toggle.open .icon-bar,		
	.page-template-template-agence nav#mainNav .navbar-header .navbar-toggle.open .icon-bar {
		background: white;
	}
	.collapse.in {
		display: block!important;
	}
	.navbar-toggle {
		display: block;
		margin-right: 0;		
	}
	nav .menu ul  .page_item a {
		font-size: 18px;
	}
	nav.nav-top .social {
		display: block;
		padding-left: 20px;
		padding-top: 30px;
		padding-bottom: 30px;
	}
	nav.nav-top .social a i {
		font-size: 30px;
		color:  #000000;
	}
	nav.nav-top .languages {
		padding-left: 30px;		
		padding-top: 0;
		padding-bottom: 30px;
	}
	nav.nav-top .languages a {
		color: #000000;
		font-size: 18px;
	}	
	nav.nav-top .languages a:hover::after {	
		background: #000000;
	}
	nav.nav-top .languages a:last-child::before {
		background: #000000;
		height: 15px;
	}
}

@media (max-width: 560px) {
	.page-template-template-agence nav .left-nav h2.heading {
		font-size: 3vmin;
	}
}

/* Headers */

#owl-header,
#background-header {
	display: block;
	position: relative;	
}

#owl-header.fixed,
#background-header.fixed {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

#background-header .image {
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

#background-header h1 {
	position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 2;
	color:  #ffffff;
	//font-size: 62px;
	font-size: 50px;
	font-weight: 900;
	margin-bottom: 0;
    margin-top: 0;
    text-transform: uppercase;
	text-align: center;
}

.owl-carousel .owl-stage-outer {
	height: 100%;
}

.owl-carousel .owl-stage, .owl-carousel .owl-item {
	height: 100%;
}

#owl-header .owl-item .owl-video,
#owl-video .owl-item .owl-video  {
	display: block !important;
}

#owl-header.owl-carousel .owl-video-play-icon,
#owl-video.owl-carousel .owl-video-play-icon {
	top: 55%;
	display: none;
}

#owl-header .owl-item .owl-video .content,
#owl-video .owl-item .owl-video .content {
	//top: 35%;
	top: 50%;
}

#owl-header .owl-item .owl-video .content .title .view.owl-video-play-icon,
#owl-video .owl-item .owl-video .content .title .view.owl-video-play-icon {
	font-family: 'Proxima Nova Light', sans-serif;
	//text-transform: uppercase;	    
	position: relative;
    height: auto;
    width: fit-content;
	width: max-content;
    left: auto;
    top: auto;
    margin-left: 0;
    margin-top: 0;
    background: none;
	display: block !important;
	margin: auto;
	display: inline-block !important;
	width: auto;
}

#owl-header .owl-item .owl-video .content .title .view.owl-video-play-icon:hover,
#owl-video .owl-item .owl-video .content .title .view.owl-video-play-icon:hover {
	transform: none;
}

#owl-header .owl-item .owl-video .content .title .view.owl-video-play-icon::after,
#owl-video .owl-item .owl-video .content .title .view.owl-video-play-icon::after {
	position: absolute;
	display: none;
	content: '';
	width: 100%;
	height: 1px;	
	background: #ffffff;
	left: 0;
    right: 0;
}

#owl-header .owl-item .owl-video .content .title .view.owl-video-play-icon:hover::after,
#owl-video .owl-item .owl-video .content .title .view.owl-video-play-icon:hover::after {
	display: block;
}

#owl-header .owl-item .image,
#owl-video .owl-item .image,
#owl-header .owl-item video {
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transition: -webkit-transform 5s ease;
    transition: -webkit-transform 5s ease;
    transition: transform 5s ease;
    transition: transform 5s ease,-webkit-transform 5s ease;
	opacity: 1;
}

#owl-header .owl-item .content,
#owl-video .owl-item .content {
	position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
	z-index: 2;
}

#owl-header .owl-item .content .title,
#owl-video .owl-item .content .title {
	color:  #ffffff;
	text-align: center;	
}

#owl-header .owl-item .content .title  h2.heading,
#owl-video.owl-item .content .title  h2.heading {	
	color: white;
    text-align: center;
	//font-size: 62px;
	font-size: 42px;
	font-weight: 900;
	margin-bottom: 0;
    margin-top: 0;	
	text-transform: uppercase;
}

#owl-header .owl-item .content .title .view,
#owl-video .owl-item .content .title .view {	
	//font-family: 'Proxima Nova Light', sans-serif;
	font-family: 'EB Garamond', sans-serif;
	position: relative;
	//font-size: 37px;
	font-size: 23px;
	font-weight: 400;
	font-style: italic;
	margin-bottom: 0;
    margin-top: 0;
	opacity: 1;
	-webkit-transition: -webkit-opacity 4s ease;
    transition: -webkit-opacity 4s ease;
    transition: opacity 4s ease;
    transition: opacity 4s ease,-webkit-opacity 4s ease;
	//display: none !important;
	width: fit-content;
	width: max-content;
	margin: auto;
	display: inline-block;
	width: auto;
}

#owl-header .owl-item .content .title .view:hover,
#owl-video .owl-item .content .title .view:hover {
	transform: none;
}

#owl-header .owl-item .content .title .view::after,
#owl-video .owl-item .content .title .view::after {
	position: absolute;
	display: none;
	content: '';
	width: 100%;
	height: 1px;	
	background: #ffffff;
	left: 0;
    right: 0;
}

#owl-header .owl-item .content .title .view:hover::after,
#owl-video .owl-item .content .title .view:hover::after {
	display: block;
}

.owl-carousel .owl-video-frame {
	height: auto;
}

/*.owl-carousel .owl-video-frame iframe {
	height: auto;
}*/

#owl-header iframe,
#owl-video iframe {
	position: fixed;
	top: 0;	
    margin: auto;
}

.owl-nav {
	position: absolute;    
    top: 50%;
    left: 0;
    right: 0;
}

.owl-nav .owl-prev {	
    position: absolute;
	//left: 8%;
	//left: 45px;
	left: 0;
	top: 50%;	
	padding-left: 45px;
    padding-right: 45px;
}

.owl-nav .owl-prev i {
	color: #f2f2f2;
	//font-size: 24px;
	font-size: 18px;
	opacity: 0.5;
}

.owl-nav .owl-prev i:hover {
	color: #f8f8f8;
	opacity: 1;
}

.owl-nav .owl-next {
	position: absolute;
    //right: 8%;
	//right: 45px;
	right: 0;
    top: 50%;	
	padding-left: 45px;
    padding-right: 45px;
}

.owl-nav .owl-next i {
	color: #f2f2f2;	
	//font-size: 24px;
	font-size: 18px;
	opacity: 0.5;
}

.owl-nav .owl-next i:hover {
	color: #f8f8f8;	
	opacity: 1;
}

.owl-dots {
	height: 20px;
    width: 300px;
	position: absolute;
    margin: auto;
	left: 0;
    right: 0;
	bottom: 200px;
	text-align: center;
	display: inline-block;
}

.owl-dots .owl-dot {
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	width: 8px;
	height: 8px;
	margin-right: 14px;
	display: inline-block;
}	

.owl-dots .owl-dot.active {
	background-color: white;
}

@media (min-width: 1600px) {
	#owl-header,
	#background-header {
		height: 1062px;
	}
}

@media (min-width: 1100px) and (max-width: 1599px) {
	#owl-header,
	#background-header {
		height: 800px;
	}
}

@media /*(min-width: 768px) and */(max-width: 1099px) {
	#owl-header,
	#background-header {
		height: 700px;
	}
}

@media (max-width: 991px) {
	#background-header h1 {
		font-size: 50px;
		font-size: 10vmin;
	}
	#owl-header .owl-item .content .title h2.heading,
	#owl-video .owl-item .content .title h2.heading {
		font-size: 49px;
	}
	#owl-header .owl-item .content .title .view,
	#owl-video .owl-item .content .title .view {
		font-size: 30px;
	}
	.owl-nav .owl-prev {	
		left: 0;		
		padding-left: 20px;
		padding-right: 20px;
	}
	.owl-nav .owl-prev i {
		font-size: 20px;
	}
	.owl-nav .owl-next {
	    right: 0;
		padding-left: 20px;
		padding-right: 20px;
	}
	.owl-nav .owl-next i {
		font-size: 20px;
	}	
	.owl-carousel .owl-video-play-icon {
		top: 60%;
	}
}

/* Projets */

#main.projets {
	background: #f2f2f2;
}

#main .projet {
	//height: 363px;
	cursor: pointer;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    display: block;
    position: relative;
    //height: 100%;
    //width: 100%;
    overflow: hidden;
	background: #f2f2f2;
} 

@media (min-width: 1400px) {
	#main .projet {
		//height: 363px;
	}
}

@media (min-width: 768px) and (max-width: 1399px) {
	#main .projet {
		//height: 250px;
	}
}

#main .projet .image {
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease,-webkit-transform 2s ease;
}

#main .projet:hover .image {
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease,-webkit-transform 2s ease;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

#main .projet .content {
	position: absolute;
    /*top: 45%;
	bottom: 55%;
    left: 50%;
    width: 80%;*/   
	height: 100%;
	width: 100%;
	top: 50%;
	left: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	flex-direction: column;
	object-fit: cover;
	padding: 10%;
	background: transparent;
	 transition: background .4s;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
	z-index: 2;
}

#main .projet .content .title {
	color:  #ffffff;
	text-align: center;	
}

#main .projet .content .title  h2.heading {	
	font-family: 'Proxima Nova Regular', sans-serif;
	color: white;
    text-align: center;
	font-size: 40px;
	font-size: 2vw;
	//font-weight: 900;
	margin-bottom: 0;
    margin-top: 0;
	padding-top: 0;
    padding-bottom: 0;
	text-transform: uppercase;
	opacity: 0;
    -webkit-transform: translate(0,15px);
    -ms-transform: translate(0,15px);
    transform: translate(0,15px);
    -webkit-transition: -webkit-transform .4s,opacity .4s;
    transition: transform .4s,opacity .4s;
}

#main .projet:hover .content {
	 background: rgba(0, 0, 0, 0.5);
}

#main .projet:hover .content .title h2.heading {
	-webkit-transition: -webkit-transform .4s .2s,opacity .4s .2s;
    transition: transform .4s .2s,opacity .4s .2s;
	transform: translate(0,0);
    opacity: 1;
}

#main .projet .content .title h3.excerpt {	
	//font-family: 'Proxima Nova Light', sans-serif;
	font-family: 'EB Garamond', sans-serif;	
	font-style: italic;
	color: white;
    text-align: center;
	font-size: 23px;
	font-weight: 400;
	margin-bottom: 0;
    margin-top: 0;
	padding-top: 0;
    padding-bottom: 0;
	opacity: 0;
	/*text-transform: initial;
	-webkit-transition: -webkit-opacity 4s ease;
    transition: -webkit-opacity 4s ease;
    transition: opacity 4s ease;
    transition: opacity 4s ease,-webkit-opacity 4s ease;*/
	opacity: 0;
    -webkit-transform: translate(0,15px);
    -ms-transform: translate(0,15px);
    transform: translate(0,15px);
    -webkit-transition: -webkit-transform .4s,opacity .4s;
    transition: transform .4s,opacity .4s;
}

#main .projet:hover .content .title h3.excerpt {		
    /*-webkit-transition: -webkit-opacity 4s ease;
    transition: -webkit-opacity 4s ease;
    transition: opacity 4s ease;
    transition: opacity 4s ease,-webkit-opacity 4s ease;*/
	-webkit-transition: -webkit-transform .8s .4s,opacity .8s .4s;
    transition: transform .8s .4s,opacity .8s .4s;
	transform: translate(0,0);
    opacity: 1;
}

/* Projet single */

#main.projet {
	background: #f2f2f2;
}

#main.projet .zone1 {
	//padding-top: 150px;
	//padding-top: 7vw;
	//padding-bottom: 150px;
	padding-top: 100px;
	padding-top: 5vw;
}

#main.projet .zone2 {
	position: relative;
	//height: 942px;
	//height: 48vw;
	overflow: hidden;
	padding-left: 0;
	padding-right: 0;
}

#main.projet .zone3 {
	padding-top: 70px;
	padding-top: 4vw;
	padding-bottom: 70px;
	padding-top: 4vw;
}

#main.new,
#main.projet p,
#main.projet .description {
	color:  #000000;
	font-size: 24px;
	font-size: 1.5vmax; // 1.3vmax;
	font-weight: 400;
	line-height: 32px;
	line-height: 1.7vmax; // 1.5vmax;
	text-align: justify;
	margin-bottom: 30px;
	margin-top: 10px;
	word-spacing: -1px;
	letter-spacing: 1px; // -1px;
}

#main.projet .accroche {
	color:  #000000;
	font-size: 24px;
	font-weight: 400;
	line-height: 26px;
	text-transform: uppercase;
	margin-bottom: 30px;
}

#main.projet .titre {
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
    color:  #000000;
	font-size: 35px;
	font-weight: 900;
	line-height: 45px;
	text-transform: uppercase;
	margin-bottom: 40px;
}

#main.projet .description {
	margin-top: 20px;
	margin-bottom: 60px;
}

#main.projet .button {
	display: inline-block;
}

#main.projet .button button {
	background-color: #0bfdde;
	height: 50px;
	line-height: 50px;
	display: block;
	color: #000000;
	font-size: 23px; // 20px;
	font-weight: 700;
	text-align: center;	
	text-decoration: none;
	padding-left: 15px;
	padding-right: 15px;
	width: auto;
	border: none;
    //font-family: 'proxima_nova_altblack', sans-serif;
    font-family: 'proxima_nova_altbold', sans-serif;
}

#main.projet .button:hover {
	text-decoration: none;
}

#main.projet .button:hover button {
	background-color: #000000;
	color: #0bfdde;
}

#main.projet .zone1 .logo {
	text-align: left;
	//margin-bottom: 60px;
	margin-bottom: 20px;
}

#main.projet .zone1 .logo img {
	width: 170px;
}

#main.projet .zone1 .logo ul {
	padding-left: 0;
}

#main.projet .zone1 .logo ul li {
	list-style-type: none;
	margin-bottom: 30px;
	display: flex;
}

#main.projet .zone1 .logo ul li img.icone{
	max-width: 60px;
    min-width: 60px;
	margin-right: 30px;
	height: 60px;
}

#main.projet .zone1 .logo ul li .description {
	display: inline-block;
	color:  #000000;
	font-size: 20px;
	font-weight: 400;
	line-height: 26px;
	margin-bottom: 30px;
}

#main.projet .zone1 .content {
	text-align: left;
}

#main.projet .zone1 .content .introduction {
	//margin-top: 80px;
	//margin-bottom: 120px;
	//margin-bottom: 115px;
}

/*#main.projet .zone2 .image {	
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;	
    -webkit-transition: -webkit-transform 5s ease;
    transition: -webkit-transform 5s ease;
    transition: transform 5s ease;
    transition: transform 5s ease,-webkit-transform 5s ease;
	max-width: 100%;
}*/

/*#main.projet .zone2 .image:hover {
    -webkit-transition: -webkit-transform 4s ease;
    transition: -webkit-transform 4s ease;
    transition: transform 4s ease;
    transition: transform 4s ease,-webkit-transform 4s ease;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}*/

#main.projet .zone2 #owl-project .owl-item {
	height: 942px;
	height: 48vw;
}

#main.projet .zone2 #owl-project .owl-item .item .image {	
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;	
	opacity: 1;
}

#main.projet .zone2 #owl-project.owl-carousel .owl-nav .owl-prev {
	padding-top: 24vw !important;
	padding-bottom: 24vw !important;
}

#main.projet .zone2 #owl-project.owl-carousel .owl-nav .owl-next {
	padding-top: 24vw !important;
	padding-bottom: 24vw !important;
}

@media (max-width: 991px) {
	#main .projet {
		height: 300px;
	}
	#main.projet p,
	#main.projet .description {
		font-size: 20px;
		line-height: 24px;
		word-spacing: -2px;
	}
	#main.projet .zone1 {
		padding-top: 40px;
	}
	#main.projet .zone2 {
		//height: 180px;
	}
	#main.projet .zone3 {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	#main.projet .zone1 .logo {
		text-align: center;
		//margin-bottom: 30px;
		margin-bottom: 0;
	}
	#main.projet .zone1 .logo ul {
	    text-align: left;
		padding-left: 0;
	}
	#main.projet .zone1 .logo ul li {
		display: flex;
	}
	#main.projet .zone1 .logo ul li img.icone {
		margin-right: 10px;
	}
	#main.projet .zone1 .content .introduction {
		margin-top: 0;
		margin-bottom: 60px;
	}
	#main .projet .content .title h2.heading {
		font-size: 35px;
	}
	#main.projet .accroche {
		font-size: 20px;
	}
	#main.projet .titre {
		font-size: 35px;
	}
	#main.projet .button {
		font-size: 16px;
		height: 40px;
		//line-height: 40px;
		//padding-left: 10px;
		//padding-right: 10px;
	}
}

@media (max-width: 767px) {
	#main.projet a.toggle {
		display: inline-block;
		float: right;
		color: #b2b2b2;
		position: relative;
		top: 8px;
	}	
	#main.projet a.toggle i {
		color: #b2b2b2;
		font-size: 21px;
	}
	#main.projet a.toggle[aria-expanded="true"] {
		transform: rotate(180deg);
	}
	#main.projet a.toggle i:hover {
		color: #000000;		
	}	
}

/* Agence */

#main.agence {
	background-color: #f2f2f2;	
}

#main.agence .zone1 {
	padding-top: 100px;
	padding-top: 6vw;
	padding-bottom: 100px;
	padding-bottom: 6vw;
	//background-color: #d9d9d9;
	background-color: #1c1c1c;
}

#main.agence .zone1 p,
#main.agence .zone1 h3 {
	color: #fff;
}

#main.agence .zone1 h2 {
	color: #ffffff;
	text-align: left;
}


#main.agence .zone2 {
	//background-color:  #0bfdde;
	background-color: #fff;
	padding-top: 100px;
	padding-top: 6vw;
	padding-bottom: 100px;
	padding-bottom: 6vw;
}

#main.agence .zone2 p.sub {
	color: #000;
}

/*#main.agence .zone2 h3:before,
#main.agence .zone3 h3:before {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}*/

/*#main.agence .zone2 h3:after,
#main.agence .zone3 h3:after {
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}*/

#main.agence .zone6 {
	background-color: #000000;
	padding-top: 100px;
	padding-top: 6vw;
	padding-bottom: 100px;
	padding-bottom: 6vw;
}

#main.agence .zone6 p,
#main.agence .zone6 h3 {
	color: #000;
}

#main.agence .zone3 {	
	padding-top: 100px;
	padding-top: 6vw;
	padding-bottom: 60px;
	padding-bottom: 1vw;
	//background-color: #d9d9d9;
	background-color: #fff;
}

#main.agence .zone3 .row {
	display: flex;
	align-items: center;
}

#main.agence .zone3 .content .competence {
	min-width: 50%;
}

#main.agence .zone3 h4 {
	text-transform: uppercase;
}

#main.agence .zone4 {
	//background-color: #d9d9d9;
	background-color: #000;
}

#main.agence .zone4 h3 {
	color: #fff;
}

#main.agence .zone5 {
	background-color:  #000000;
	padding-top: 100px;
	padding-top: 6vw;
	padding-bottom: 100px;
	padding-bottom: 6vw;
}

#main.agence h2 {
	color:  #000000;
	font-size: 35px;
	//font-size: 2vw;
	font-weight: 600;
	line-height: 50px;
	//line-height: 3vw;
	text-align: left;
}

#main.agence .zone5 h2 {
	color: #ffffff;
}

#main.agence .zone6 h2 {
	color: #ffffff;
	text-align: left;
}

#main.agence h3 {
	position: relative;
	width: fit-content;
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
	color:  #000000;
	//font-size: 82px;
	font-size: 50px;
	font-size: 4vw;
	//font-weight: 900;
	//line-height: 76px;
	line-height: 60px;
	line-height: 3.2vw;
	text-align: left;
	text-transform: uppercase;
	//margin-left: 20px;
}

#main.agence p.sub {
	font-family: 'EB Garamond', sans-serif;
	font-style: italic;
	color: white;
	text-align: left;
	font-size: 23px;
	font-weight: 400;
}

/*#main.agence h3:before {
	content: "";
	position: absolute;
	top: -2px;
	left: -20px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	width: calc(100% + 40px);
	height: 100%;
}*/

/*#main.agence h3:after {
	content: "";
	position: absolute;
	top: -20px;
	left: -2px;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 100%;
	height: calc(100% + 40px);
}*/

#main.agence .zone5 h3 {
	//font-family: 'proxima_nova_altblack', sans-serif;
	color: #ffffff;
	text-align: center;
	margin: auto;
}

#main.agence .zone6 h3 {
	//font-family: 'proxima_nova_altblack', sans-serif;
	color: #ffffff;
	text-align: left;
}

#main.agence h4 {	
	color:  #000000;
	//font-size: 21px;
	font-size: 24px; // 16px;
	//font-size: 1vw;
	font-weight: 400;
	line-height: 21px;
	//line-height: 1vw;
	text-align: center;
	height: 40px;
}

#main.agence p {
	color:  #000000;
	font-size: 24px;
	//font-size: 1.3vw;
	font-size: 1.6vmax; // 1.2vmax;
	//font-weight: 400;
	line-height: 26px;
	//line-height: 1.8vw;
	line-height: 1.7vmax; // 1.4vmax;
	text-align: justify;
	margin-bottom: 30px;
	margin-top: 10px;
	word-spacing: -2px;
	letter-spacing: 0px; // -1px;
}

#main.agence .zone5 p {
	color: #ffffff;
	text-align: center;	
}

#main.agence .zone6 p {
	color: #ffffff;
	//text-align: left;
}

#main.agence .content {
	margin-top: 15px;
	margin-bottom: 20px;
}

#main.agence .zone3 .content {
	text-align: center;
}

#main.agence .zone3 .content .competence {
	margin-bottom: 30px;
	//min-height: 205px;
}

#main.agence .zone3 .content .competence  .picto {
	margin: auto;
	//min-height: 113px;
	margin-bottom: 10px;
	width: 80px;
	height: 80px;
}

#main.agence .zone4 .visuel {
	position: relative;
	height: 695px;
	//height: 35vw;
	height: 55vw;
	overflow: hidden;
	margin-left: -15px;
    margin-right: -15px;
}

#main.agence .zone4 .visuel .image.background {	
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;	
    -webkit-transition: -webkit-transform 5s ease;
    transition: -webkit-transform 5s ease;
    transition: transform 5s ease;
    transition: transform 5s ease,-webkit-transform 5s ease;
	max-width: 100%;
}

#main.agence .zone4 .image.background:hover {
    /*-webkit-transition: -webkit-transform 4s ease;
    transition: -webkit-transform 4s ease;
    transition: transform 4s ease;
    transition: transform 4s ease,-webkit-transform 4s ease;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);*/
}

#main.agence .zone4 #zone4-2 {
	display: flex;
	align-items: center;
	padding-top: 100px;
	//padding-top: 6vw;
	padding-top: 0;
	padding-bottom: 60px;
	padding-bottom: 1vw;
	//background-color: #d9d9d9;
	background-color: #000;
	height: 600px;
	//height: 35vw;	
	height: 40vw;
}

#main.agence .zone4 #zone4-2 .content {
	height: 420px;
	//height: 22vw;
	height: 30vw;
	position: relative;	
}

#main.agence .zone4 #zone4-2 .content .image.logos {	
	position: absolute;
	top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;	
    -webkit-transition: -webkit-transform 5s ease;
    transition: -webkit-transform 5s ease;
    transition: transform 5s ease;
    transition: transform 5s ease,-webkit-transform 5s ease;
	max-width: 100%;
}

#main.agence .zone5 .description {
	margin-top: 40px;
}

#main.agence .zone5 .associate {
	text-align: center;
	min-width: 50%;
}

#main.agence .zone5 .associate .photo {
	text-align: center;
	max-width: 100%;
	//height: 320px;
	height: 300px;
    width: 300px;
	// margin-bottom: 30px;
}

#main.agence .zone5 .associate .infos {
	text-align: center;
}

#main.agence .zone5 .associate .firstname,
#main.agence .zone5 .associate .lastname {
	color: #ffffff;
	font-size: 35px;
	font-size: 2.2vw;
	font-weight: 900;
	line-height: 35px;
	line-height: 1.5vw;
	//text-align: left;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 10px;
    //font-family: 'proxima_nova_altblack', sans-serif;
    ont-family: 'proxima_nova_altbold', sans-serif;
}

#main.agence .zone5 .associate .function {
	color: #ffffff;
	font-size: 20px;
	//font-size: 1vw;
	font-weight: 700;
	line-height: 24px;
	//line-height: 1.2vw;
	//text-align: left;
	text-align: center;
	height: 30px;
}

#main.agence .zone5 .associate .phone {
	color: #ffffff;
	font-size: 17px;
	//font-size: 1vw;
	font-weight: 400;
	line-height: 25px;
	//line-height: 1.2vw;
	//text-align: left;
	text-align: center;
	display: block;	
	height: 30px;
}

#main.agence .zone5 .associate .phone:hover {
	text-decoration: none;
}

#main.agence .zone5 .associate .mail {
	color:  #ffffff;
	font-size: 17px;
	//font-size: 0.9vw;
	font-weight: 400;
	line-height: 25px;
	//line-height: 1.2vw;
	//text-align: left;
	text-align: center;
	display: block;
	height: 30px;
}

#main.agence .zone5 .associate .mail:hover {
	text-decoration: none;
}

#main.agence .zone5 .associate .linkedin {
	background-color:  #ffffff;
	font-size: 22px;
	line-height: 40px;
	font-weight: 700;	
	text-align: center;
	display: block;
	position: relative;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	margin: auto;
	margin-top: 10px;
}

#main.agence .zone5 .associate .linkedin i {
	color: #000000;	
}

#main.agence .zone5 .associate .linkedin:hover {
	text-decoration: none;
	background-color: #0bfdde;
}

#main.agence .zone5 .associate .linkedin:hover i {
	//color: #d9d9d9;
}

@media (min-width: 992px) and (max-width: 1280px) {
	#main.agence h3 {
		font-size: 40px;
		line-height: 40px;
		font-size: 3.5vw;
		line-height: 3vw;
	}
}

@media (min-width: 768px) {
	#main.agence h2 {
		display: none !important;
	}
}	

@media (max-width: 991px) {
	#main.agence .zone1,
	#main.agence .zone2,
	#main.agence .zone6,
	#main.agence .zone3,
	#main.agence .zone5 {
		padding-top: 30px;
		padding-bottom: 30px;
	}	
	#main.agence h2 {
		font-size: 25px;
		line-height: 50px;
		margin-bottom: 0;
		display: inline-block;
	}	
	#main.agence h3 {
		font-size: 35px;
		line-height: 35px;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	#main.agence h4 {        
		font-size: 18px;
		line-height: 21px;
	}
	#main.agence p {
		font-size: 20px;
		line-height: 24px;
		word-spacing: -2px;
	}
	#main.agence .content {
		margin-top: 40px;
	}
	#main.agence .zone4 .visuel {
		height: 320px;
	}
	#main.agence .zone4 #zone4-2 {
		padding-top: 30px;
		padding-bottom: 30px;
		//background-color: #d9d9d9;
		height: 250px;		
	}
	#main.agence .zone4 #zone4-2 .content {
		height: 200px;		
	}
	#main.agence .zone5 {
	    padding-left: 20px;
		padding-right: 20px;
	}
	#main.agence .zone5 .associate {
		text-align: center;
		margin-bottom: 40px;
	}
	#main.agence .zone5 .associate .firstname,
	#main.agence .zone5 .associate .lastname {
		font-size: 32px;
		line-height: 22px;
	}
}

@media (max-width: 767px) {
	#main.agence a.toggle {
		display: inline-block;
		float: right;
		color: #b2b2b2;
		position: relative;
		top: 35px;
		z-index: 1;
	}	
	#main.agence a.toggle i {
		color: #b2b2b2;
		font-size: 21px;
	}
	#main.agence a.toggle[aria-expanded="true"] > i {
		transform: rotate(180deg);
	}
	#main.agence a.toggle i:hover {
		color: #000000;		
	}
	#main.agence .zone5 a.toggle i:hover {
		color: white;		
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	#main.agence .content {
		margin-top: 12px;
	}
}

/* News */

#main.news {
	background: #f2f2f2;
	padding-top: 80px;
	padding-bottom: 80px;
}

#main.new {
	background: #f2f2f2;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-bottom: 0;
}

.page-template-template-news #main.news.fixed {
	margin-top: 0 !important;
}

.post-template-default #main.new.fixed {
	margin-top: 0 !important;
}

.page-template-template-news #background-header,
.page-template-template-news .nav-top {
	display: none;
}

.post-template-default #background-header,
.post-template-default .nav-top {
	display: none;
}

#main.new h1,
#main.new h2,
#main.new h3 {	
	color: #000000;    
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;    
    padding-top: 30px;
    padding-bottom: 30px;
    display: block;
}

#main.new h1 {
	font-size: 30px;
}

#main.new h2 {
	font-size: 26px;
}

#main.new h3 {
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
	font-size: 24px;
}

#main.new .panel-layout {
	margin-bottom: 30px;
}

#main .grid-news .news {
    padding-right: 20px;
    padding-left: 20px;	
}

#main .grid-news .news a.thumbnail {
	cursor: pointer;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    display: block;
    position: relative;
    overflow: hidden;
	width: 100%;
	height: 320px;
	border: none;
	border-radius: 0;
}

#main .grid-news .news a.thumbnail .image {
	position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease,-webkit-transform 2s ease;
}

#main .grid-news .news a.thumbnail:hover .image {
	-webkit-transition: -webkit-transform 2s ease;
    transition: -webkit-transform 2s ease;
    transition: transform 2s ease;
    transition: transform 2s ease,-webkit-transform 2s ease;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

#main .grid-news .news .content {
	height: auto;
	border-bottom: 1px dashed #6a6a69;
	padding-bottom: 40px;
	position: relative;
	margin-bottom: 40px;
}

#main .grid-news .news .content .title {
	color:  #000000;
}

#main .grid-news .news .content .title h2.heading {
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
	font-size: 40px;
	font-size: 1.6vw;
	font-weight: 900;
	line-height: 42px;
	line-height: 1.8vw;	
	text-align: left;
}

#main .grid-news .news .content .title h3.excerpt {	
	font-family: 'Proxima Nova Regular', sans-serif;
	font-size: 24px;
	font-size: 1.4vw; // 1.3vw;
	font-weight: 400;
	line-height: 26px;
	line-height: 1.5vw; // 1.4vw;
	text-align: left;
	margin-bottom: 20px;
    letter-spacing: 0px;
}
#main .grid-news .news .content a.infos {	
	//font-family: 'proxima_nova_altblack', sans-serif;
	font-family: 'proxima_nova_altbold', sans-serif;
	font-size: 16px;
	font-weight: 900;
	line-height: 20px;
	color:  #000000;
	text-transform: uppercase;
	margin-bottom: 40px;
}

#main .grid-news .news .content a.infos:hover {
	text-decoration: underline;
}

#main .grid-news .news .content a.infos::before {
	content: "+";
	position: relative;
	display: inline-block;
	font-size: 30px;
	font-weight: 900;
	top: 5px;
}

#main .grid-news .news .content a.facebook {
	position: absolute;
	bottom: 35px;
	right: 0;
	color:  #000000;
	font-size: 22px;
}

@media (min-width: 768px) and (max-width: 1280px) {
	#main .grid-news .news .content .title h2.heading {
		font-size: 30px;
		line-height: 32px;
		font-size: 2vw;
		line-height: 2vw;
	}
}	

@media (max-width: 991px) {
	#main.news {
		padding-top: 0;
		padding-bottom: 0;
	}	
	#main .grid-news .news {
		padding-right: 0;
		padding-left: 0;
	}
	#main.news .grid-news .news .content {
		margin-left: 25px;
		margin-right: 25px;
		margin-top: 40px;
	}
	#main.news .grid-news .news .content .title h2.heading {
		font-size: 28px;
		line-height: 30px;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	#main .grid-news .news .content .title h3.excerpt {
		font-size: 20px;
		line-height: 25px;
	}	
	#main.new h2.title {
		//display: none;
	}
	.post-template-default #background-header h1 {
		font-size: 35px;
	}
	.post-template-default nav#mainNav {
		background: #0bfdde;
	}
	.post-template-default nav#mainNav .left-nav h2.heading {
		color: white;
		display: none;
	}
}

@media (max-width: 767px) {
	#main.new .heateor_sss_sharing_container {
		bottom: 18px !important;
	}
	.heateor_sss_mobile_footer {
		display: none;
	}
}

/* Mentions légales */

#main.mentions {
    background: #f2f2f2;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 0;
}

.page-template-template-mentions #main.mentions.fixed {
	margin-top: 0 !important;
}

.page-template-template-mentions #background-header, 
.page-template-template-mentions .nav-top {
    display: none;
}


/* Contact */

.page-template-template-contact #background-header,
.page-template-template-contact .nav-top {
	display: none;
}

#main.contact {
	background-color: #f2f2f2;
	padding-top: 50px;
	padding-bottom: 50px;
	display: none;
}

#main.contact h2 {
	color: #000000;
	//font-size: 82px;
	font-size: 50px;
	font-size: 3vw;
	font-weight: 900;
	line-height: 120px;
	text-align: left;
	text-transform: uppercase;
}

#main.contact .contact-form {
	padding-top: 40px;
}

#main.contact .contact-form input {
    border: none;
	border-bottom: 5px solid #0bfdde;
	background-color: #f2f2f2;
	font-size: 20px;
	line-height: 28px;
	font-weight: 400;
}

#main.contact .contact-form input:focus {
	outline: none;
}

#main.contact .contact-form textarea {    
	border: 5px solid #0bfdde;
	background-color: #f2f2f2;
	font-size: 20px;
	line-height: 23px;
	font-weight: 400;
	max-width: 100%;
	width: 100%;
}

#main.contact .contact-form span.wpcf7-form-control-wrap.your-message::before {
	content: "";
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 30px 30px 0 0;
	border-color: #0bfdde transparent transparent transparent;
	right: 40%;
    top: 20px;
}

#main.contact .contact-form span.wpcf7-form-control-wrap.your-message::after {
	content: "";
	display: block;
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 19px 19px 0 0;
	border-color: #f2f2f2 transparent transparent transparent;
	right: 40%;
    top: 19px;
	margin-right: 6px;
}

#main.contact .contact-form label {
	color: #000000;
	font-size: 25px;
	font-size: 1.5vw;
	font-weight: 900;
	line-height: 50px;
	line-height: 3vw;
	text-align: left;
	text-transform: uppercase;
	width: 100%;
}

#main.contact .contact-form input[type=submit] {
	color: #000000;
	font-size: 25px;
	font-size: 1.5vw;
	font-weight: 700;
	line-height: 50px;
	line-height: 3vw;
	background-color: #0bfdde;
	width: 155px;
	height: 50px;
	height: 3vw;
	display: block;
	margin-top: 30px;
	border-bottom: none;
}

#main.contact .contact-form input[type=submit]:hover {
	color: #0bfdde;	
	background-color: #000000;	
}

.wpcf7-form-control.g-recaptcha.wpcf7-recaptcha > div,
div.wpcf7 .wpcf7-recaptcha iframe {
	max-width: 100%;
    width: 100%;
}

@media (min-width: 992px) and (max-width: 1280px) {
	#main.contact h2 {
		font-size: 60px;
		line-height: 80px;
	}
}	

@media (max-width: 991px) {
	#main.contact {
        padding-top: 0;
		padding-bottom: 30px;
	}
	#main.contact h2 {
		display: none;
	}
	#main.contact .contact-form label {
		font-size: 20px;
		line-height: 30px;
	}
	#main.contact .contact-form input {
		width: 100%;
		max-width: 100%;
	}
	#main.contact .contact-form input[type=submit] {
		font-size: 20px;
		line-height: 45px;
		height: 45px;
	}
	#main.contact .contact-form span.wpcf7-form-control-wrap.your-message::before {
		right: 20%;
		top: 15px;
	}
	#main.contact .contact-form span.wpcf7-form-control-wrap.your-message::after {
		right: 20%;
		top: 14px;
	}
}

/* Footer */

footer {
	background-color: #000000;
	//height: 590px;
	height: auto;
	color: #ffffff;
	font-size: 16px;
	font-weight: 400;	
	padding-top: 100px;	
	padding-top: 5vw;
}

footer.fixed {
	position: relative;
	z-index: 1000;
}

footer.grey {
	background-color: #d9d9d9;
	color: #000000;
}

footer.black {
	background-color: #000000;
	color: #ffffff;
}

footer.white {
	background-color: white;
	color: #000000;
}

footer a {
	color: #ffffff;
	font-size: 16px;
	font-weight: 400;
	text-align: left;
	display: block;
	position: relative;
}

footer.black a {
	color: #ffffff;	
}

footer.grey a,
footer.white a {
	color: #000000;	
}

footer .infos {
	text-align: left;
	padding-bottom: 92px;
}

footer .footer-logo img {
	max-width: 100%;
	//width: 109px;
	width: 80px;
    height: auto;
}

footer a:hover {
	color: white;
}

footer.black a:hover {
	color: #ffffff;	
}

footer.grey a:hover,
footer.white a:hover {
	color: #000000;	
}

footer .address {
	padding-top: 30px;
}

footer .phone {
	padding-top: 40px;
}

.page-template-template-contact footer .phone {
	padding-top: 0;
}

footer .infos .contact-bloc {
	display: inline-block;	
	margin-top: 20px;
}

/*footer .infos  > .contact-bloc */
footer .infos div.contact-bloc:not(:last-child) {
	//margin-right: 50px;
	margin-right: 30px;
}

/*footer .infos  > .contact-bloc ~ .contact-bloc {
	margin-right: 0;
}*/

footer .infos .contact-bloc h4 {
	text-transform: uppercase;
	font-weight: 700;	
    font-size: 25px;
    line-height: 30px; 
   //font-family: 'proxima_nova_altblack', sans-serif;
   font-family: 'proxima_nova_altbold', sans-serif;
}


#main.contact .infos .contact-bloc h4 {
    color:  #000000;
    font-size: 35px;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 40px;
}

footer .infos .contact-bloc .mail.contact,
footer .infos .contact-bloc .mail.recrutement,
footer .infos .contact-bloc .mail.communication {
	font-family: 'EB Garamond', sans-serif;	
	font-style: italic;
	//background: #0bfdde;
	color: black;
	//font-size: 15px;
	font-size: 22px;
	//font-weight: 600;
	width: auto;
	height: 30px;
	//line-height: 30px;
    line-height: 18px;
    display: block;
    position: relative;
    //padding-left: 10px;
    //padding-right: 10px;
}

footer .social {
	text-align: right;
	position: relative;
}

footer .social a {
	display: inline-block;
	padding-left: 20px;
	padding-right: 18px;
	//margin-top: 40px;
	margin-top: 16px;
}

footer .social a.linkedin {
	padding-right: 0;
}

footer .social a i {
	font-size: 32px;
}

footer .social .legacy {
	padding-top: 120px;
}

footer .social .legacy a.privacy {
	padding-left: 0;
	padding-right: 0;
}

.page-template-template-contact footer .social .legacy {
	/*padding-top: 155px;*/
	position: absolute;
    bottom: -199px;
    right: 30px;
	width: 225px;
}

footer .container-fluid.map {
	padding-left: 0;
	padding-right: 0;
}

.acf-map {
	display: block;
    overflow: hidden;
    width: 100%;
    height: 620px;
    margin-right: auto;
    margin-left: auto !important;
    position: relative;
}

/* fixes potential theme css conflict */
.acf-map img {
   max-width: inherit !important;
}

.acf-map p,
.acf-map h4 {
   color: #000000;
}

#goToTop {
	position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 30px;
    background: #000;
    color: #ffffff;
    cursor: pointer;
	border-color: black;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -khtml-border-radius: 50%;
    text-decoration: none;
    transition: opacity 0.2s ease-out;
    -webkit-transition: opacity 0.2s ease-out;
    -moz-transition: opacity 0.2s ease-out;
    -o-transition: opacity 0.2s ease-out;
    -ms-transition: opacity 0.2s ease-out;
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
}

#goToTop:hover {
	border: 3px solid black;
	background: #ffffff;
    color: #000;
}

#goToTop.show {
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
	display: flex !important;
}

#goToTop i {	
	float: left;
    font-size: 18px;
    height: 100%;
    padding: 9px;
    width: 100%;
	display: inline-block;
    vertical-align: middle;
}

#goToTop:hover i {
	padding: 7px;
}

@media (max-width: 991px) { 
	footer {
		font-size: 16px;
		padding-top: 45px;
		padding-left: 15px;
		padding-right: 15px;
	}
	footer a {
		font-size: 16px;
	}
	footer .infos {
		padding-bottom: 45px;
	}
	footer .social {
		text-align: left;
		margin-left: -15px;
	}
	footer .social a {
		margin-top: 0;
	}
	footer .social a i {
		font-size: 24px;
	}
	footer .social .legacy,
	.page-template-template-contact footer .social .legacy {
		padding-top: 45px;
		padding-bottom: 45px;
		padding-left: 15px;
		padding-right: 15px;
		text-align: left;
		width: 255px;
		position: relative;
		left: 0;
		bottom: 0;
	}
	footer .container-fluid.map {
	    margin-left: -15px;
		margin-right: -15px;
	}
	.acf-map {
		height: 360px;
	}  
}

@media (min-width: 992px) {
	footer .infos {
		padding-left: 30px;		
	}
	footer .social {
		padding-right: 30px;
	}		
}

@media (min-width: 768px) and (max-width: 991px) { 
	footer .social {
		margin-top: 80px;
	}  
}

@media (min-width: 1270px) { 
	.page-template-template-contact footer .infos {
		width: 67% !important;
		padding-right: 0;
	}
	.page-template-template-contact footer .social {
		width: 33% !important;
		padding-left: 0;
	}  
}

@media (min-width: 1200px) and (max-width: 1269px) { 
	.page-template-template-contact footer .infos {
		width: 75% !important;
		padding-right: 0;
	}
	.page-template-template-contact footer .social {
		width: 25% !important;
		padding-left: 0;
	}  
	.page-template-template-contact footer .social .legacy {
		width: 225px;
	}
}

/* Taille texte proportionnelle
https://www.alsacreations.com/article/lire/563-gerer-la-taille-du-texte-avec-les-em.html */