/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 23, 2014 */



@font-face {
    font-family: 'denseregular';
    src: url('dense-regular_2-webfont.eot');
    src: url('dense-regular_2-webfont.eot?#iefix') format('embedded-opentype'),
         url('dense-regular_2-webfont.woff') format('woff'),
         url('dense-regular_2-webfont.ttf') format('truetype'),
         url('dense-regular_2-webfont.svg#denseregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

*{margin: 0; padding: 0;}
body {font-family: 'Montserrat', sans-serif; font-weight: 400;}

#homepage header {height:405px; width:100%;}
#interieur header {height: 316px; width:100%;}
header {height: 260px; width:100%;}

.wrapper {max-width:1240px; margin: auto; padding: 0px 40px;}
.content {background: #FFF;}
#homepage #img-top {height:350px;overflow: hidden;}
#img-top {height: 205px;overflow: hidden;}
a {color:#111925}
#menu {background: #111925; height:55px;}
#submenu {
border-bottom: 1px solid #ECECEC;
background: #FFF;
height:55px;
}

#submenu .wrapper {text-align: center;}

.submenu {
position: absolute;
background: #FFF;
width: 100%;
top: 259px;
left: 0;
overflow: hidden;
}

#homepage .submenu {top: 404px;}

li .submenu {height:0; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease;}
li:hover .submenu {height:56px; border-bottom: 1px solid #E2E2E2;}
li:hover.active .submenu {height:0;}

.submenu a{color:#111925 !important;}

nav ul li {display: inline-block; vertical-align: middle; height:55px;text-align: center;}
nav ul li a {text-decoration: none; color:#888c92; line-height: 55px;  font-family: 'denseregular'; font-weight: 400; font-size: 20px;padding-bottom: 13px; border-bottom: 0px solid #FFF; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;padding: 14px 20px;}
#submenu nav ul li a {text-decoration: none; color: #111925; line-height: 55px; font-size: 20px;padding-bottom: 13px; border-bottom: 0px solid #FFF; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;padding: 15px 20px; font-family: 'Montserrat', sans-serif;font-size: 12px;text-transform: uppercase;}
.submenu nav ul li a {text-decoration: none; color: #111925; line-height: 57px; font-size: 20px;padding-bottom: 13px; border-bottom: 0px solid #FFF; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;padding: 15px 20px; font-family: 'Montserrat', sans-serif;font-size: 12px;text-transform: uppercase;}
nav ul li:hover a, .active a{text-decoration: none; color:#fff;border-bottom: 5px solid #FFF;}
#submenu nav ul li a:hover, #submenu .active a{text-decoration: none; color:#111925; border-bottom: 5px solid #111925;font-weight: bold;}
.submenu nav ul li a:hover, .submenu .active a{text-decoration: none; color:#111925; border-bottom: 5px solid #111925;font-weight: bold;}
#langue {display: inline-block; vertical-align: middle; float:right}
nav {display: inline-block; vertical-align: middle;}
#langue ul li {display: inline-block; vertical-align: middle; height:55px;text-align: right;float: right;}
#langue ul li a {text-decoration: none; color:#888c92; line-height: 55px;  font-family: 'denseregular'; font-weight: 400; font-size: 20px;padding-bottom: 13px; border-bottom: 0px solid #FFF; -webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;padding: 14px 20px;}
#langue ul li a:hover, #langue ul li.active a{text-decoration: none; color:#fff;border-bottom: 5px solid #FFF;}


#homepage #bloc-logo {top: 200px; position: relative; color:#FFF; float:right; width:500px; margin-right: 100px;}
#bloc-logo {top: 50px; position: relative; color:#FFF; float:right; width:500px; margin-right: 100px;}


#logo {font-size:50px; border-right: 1px solid #FFF;width: 200px;line-height: 36px;text-align: right;padding: 10px 60px 15px 0; font-family: 'Montserrat', sans-serif; font-weight: 700;display: inline-block;}
#logo span {font-size: 35px; font-family: 'denseregular'; font-weight: 400;}

h1 {font-size: 20px;font-weight: normal; font-family: 'denseregular'; font-weight: 400;text-transform: uppercase;}
h2 {font-size: 42px; font-family: 'denseregular'; font-weight: 400; text-transform: uppercase;}
.double-col h3, .simple-col h3 {font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: 700; text-transform: uppercase;}

.big-title {
margin: 0 230px;
padding: 30px 0;
font-size: 56px;
text-align: center;
}

p {font-size:12px; margin-bottom: 15px;}

.double-col {font-size:12px; line-height:16px; margin-bottom: 15px;}

blockquote {
font-size: 18px;
line-height: 18px;
font-weight: bold;
text-transform: uppercase;
background: url('../images/blockquote.jpg') no-repeat left top;
padding-left: 35px;
}

.temoignage {margin: 45px 0 0 45px;}

.client-logo {
background: #fff;
border-top: 1px solid #e2e2e2;
}
.client-logo ul li { }

.double-col .temoignage p {margin-left:35px; margin-top:10px;}

.double-col h2 {margin-bottom:20px; line-height:32px;}
.simple-col h2 {margin-bottom:20px; line-height:32px;}

.double-col p, .double-col h3 {margin-left:45px; margin-bottom:15px;}
.simple-col p, .simple-col h3 {margin-left:45px; margin-bottom:15px;}

.simple-col p, .simple-col h3 {margin-left:0px; margin-bottom:15px;}


.titre-page {width: 170px;display: inline-block;margin-left: 60px;}

#homepage #slider {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 405px;
overflow: hidden;
z-index: -1;
text-align: center;
background: #000;
}

#slider {position: fixed;
top: 0;
left: 0;
right: 0;
height: 205px;
overflow: hidden;
z-index: -1;
text-align: center;
background: #000;
}
}

.slideshow-wrapper {
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-height: 350px;
}

.slideshow-wrapper .slideshow-content {
	position: absolute;
	min-height: 350px;
	border-top: 1px solid #111925;
	padding: 0;
	top: 0;
	z-index: 0;
	opacity: 0;
	width: 100%;
}

.no-js .slideshow-wrapper .slideshow-content {
	border-bottom: none;
}

.slideshow-wrapper .slideshow-content.cbp-qtcurrent,
.no-js .slideshow-wrapper .slideshow-content {
	position: relative; 
	z-index: 100;
	pointer-events: auto;
	opacity: 1;
}

.slideshow-wrapper .slideshow-content:before,
.slideshow-wrapper .slideshow-content:after {
	content: " ";
	display: table;
}

.slideshow-wrapper .slideshow-content:after {
	clear: both;
}

.slideshow-progress {
	position: absolute;
	background: #fff;
	height: 1px;
	width: 0%;
	top: 0;
	z-index: 1000;
	left: 0;
	display: none;
}
#homepage .slideshow-progress {display: block;}

.slideshow-wrapper .slideshow-content img {height:auto; width:100%; margin-top: 0 !important;}

.cover-container {
	border-bottom: 1px solid #ECECEC;
	background: #FFF;
	padding: 30px 0;
}

.cover {
height: auto;
overflow: hidden;
}
.covers {background: #111925; height:auto;  margin: 0;}
.cover-bloc {width:25%; height:260px; float: left; vertical-align: middle; cursor: pointer;}

#cover1 {background: url('../images/cover1.jpg') no-repeat center center; background-position: center;}
#cover2 {background: url('../images/cover1.jpg') no-repeat center center; background-position: center;}
#cover3 {background: url('../images/cover1.jpg') no-repeat center center; background-position: center;}
#cover4 {background: url('../images/cover1.jpg') no-repeat center center; background-position: center;}

.caption {opacity: 0; height:260px; margin:0 20px; text-align: center;-webkit-transition: all 200ms ease; -moz-transition: all 200ms ease; -ms-transition: all 200ms ease; -o-transition: all 200ms ease; transition: all 200ms ease;}
.caption2 {
opacity: 1;
margin: 20px 0;
text-align: left;
-webkit-transition: all 200ms ease;
-moz-transition: all 200ms ease;
-ms-transition: all 200ms ease;
-o-transition: all 200ms ease;
transition: all 200ms ease;
font-size: 12px;
}
.cover-bloc:hover .caption {opacity: 1;}

.caption h3 {font-family: 'denseregular'; color:#FFF; font-size:36px; font-weight:300;;}
.caption h3 span {font-family: 'denseregular'; color:#FFF; text-decoration: none; font-weight: 300; font-size:20px; border-top:1px solid #FFF; padding:6px 40px 0;}

.double-col {
display: inline-block;
vertical-align: top;
width: 35%;
margin: 50px 0 60px;
padding: 0 7%;
}
.simple-col {
display: inline-block;
vertical-align: top;
width: 70%;
margin: 50px 0 60px;
padding: 0 7%;
}
#homepage .simple-col {
display: block;
  vertical-align: top;
  width: 70%;
  margin: 50px auto 0px;
  padding: 0 7% 60px;
}
.simple-col.media {
display: inline-block;
vertical-align: top;
width: 100%;
margin: 50px 0 60px;
padding: 0;
}
.simple-col.media .vid:nth-child(2) {
display: inline-block;
width: 100%;
padding: 20px;
}
.simple-col.media .vid {
display: inline-block;
width: 350px;
padding: 20px;
}
.double-col.images ul li {
display: block;
margin: 0px 0 50px;
}
.double-col.ref ul {text-align: center; margin:50px 0}
.double-col.ref ul li {
display: inline-block;
margin: 0;
}
.ref ul li img {width:130px;}

.simple-col.media ul {margin:20px 0 50px;}
.simple-col.media ul li {
display: inline-block;
margin: 10px;
}
.double-col.images ul li img{width: 100%; max-width: 420px;}

#interieur .double-col {
display: inline-block;
vertical-align: top;
width: 35%;
margin: 80px 0 60px;
padding: 0 7%;
}

.client-logo {height:120px; padding:5px 0;}
.client-logo-content {  
width:810px;  
   height: 110px;  
   overflow: hidden;    
}  
.client-logo-content ul {  
    /* 439 images donc 39 x 100% */  
   width: 3900%;  
   height: 200px;  
   padding:0; margin:0;  
   list-style: none;  
}  
.client-logo-content li {  
   float: left;  
}

.client-logo-content ul li img {  
  height:110px;  
} 

footer {background: #111925; height: 23px; padding:20px 0;}
.copyright {width: 420px;display: inline-block; height: 13px;}
.menu2 {display: inline-block;float: right;}
.menu2 ul li {display: inline-block;}
.menu2 a {text-decoration: none; margin:10px;}
.menu2 li:last-child a {text-decoration: none; margin:0px;}

footer p {font-size:10px; color:#5e6167;}
footer a {color:#5e6167; font-size:10px;}
footer a:hover {color:#FFF;}

.lb-album{
	width: 900px;
	margin: 0 auto;
}
.lb-album li{
	position: relative;
}
.lb-album li > a,
.lb-album li > a img{
	display: block;
	width:100%;
}
.lb-album li > a {
width: auto;
position: relative;
}

.lb-overlay {
width: 0px;
height: 0px;
position: fixed;
overflow: hidden;
left: 0px;
top: 0px;
padding: 0px;
z-index: 99999;
text-align: center;
background: rgba(17, 25, 37, 0.85);
}
.lb-overlay > div{
	position: relative;
	color: rgba(27,54,81,0.8);
	width: 550px;
	height: 80px;
	margin: 40px auto 0px auto;
}
.lb-overlay div h3,
.lb-overlay div p{
	padding: 0px 20px;
	width: 200px;
	height: 60px;
}
.lb-overlay div h3{
	font-size: 36px;
	float: left;
	text-align: right;
	border-right: 1px solid rgba(27,54,81,0.4);
}
.lb-overlay div h3 span,
.lb-overlay div p{
	font-size: 16px;
	font-style: italic;
}
.lb-overlay div h3 span{
	display: block;
	line-height: 6px;
}
.lb-overlay div p{
	font-size: 14px;
	text-align: left;
	float: left;
	width: 260px;
}
.lb-overlay a.lb-close {
z-index: 1001;
color: #fff;
position: absolute;
top: 43px;
left: 50%;
font-size: 15px;
line-height: 26px;
text-align: center;
width: 70px;
height: 23px;
overflow: hidden;
margin-left: -35px;
opacity: 0;
text-transform: uppercase;
text-decoration: none;
}
.lb-overlay img {
max-width: 100%;
width: auto;
position: relative;
opacity: 0;
filter: alpha(opacity=0);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)";
-webkit-transition: opacity 0.5s linear;
-moz-transition: opacity 0.5s linear;
-o-transition: opacity 0.5s linear;
-ms-transition: opacity 0.5s linear;
transition: opacity 0.5s linear;
}
.lb-prev, .lb-next{
	text-indent: -9000px;
	position: absolute;
	top: -32px;
	width: 24px;
	height: 25px;
	left: 50%;
	opacity: 0.8;
	filter: alpha(opacity=80); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=80)"; /*IE8*/
}
.lb-prev:hover, .lb-next:hover{
	opacity: 1;
	filter: alpha(opacity=99); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"; /*IE8*/
}
.lb-prev{
	margin-left: -30px;
	background: transparent url(../images/arrows.png) no-repeat top left;
}
.lb-next{
	margin-left: 6px;
	background: transparent url(../images/arrows.png) no-repeat top right;
}
.lb-overlay:target {
	width: auto;
	height: auto;
	bottom: 0px;
	right: 0px;
	padding: 80px 100px 120px 100px;
}
.lb-overlay:target img,
.lb-overlay:target a.lb-close{
	opacity: 1;
	filter: alpha(opacity=99); /* internet explorer */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)"; /*IE8*/
}

/* --- TEDX ----- */

.bloc-ted{
    /* display: none; */
    height: 180px;
    background: #e62216;
    color: #FFF;
    overflow: hidden;
    position: relative;
    margin-top: 20px;
}

.img-ted {
    position: absolute;
    left: 0;
    height: 200px;
    width: 50%;
    text-align: center;
    overflow: hidden;
    background:url('../images/christophe-ambre-tedXphoto.jpg') no-repeat center center;
    background-size:cover;
}

.titre-ted {
    position: absolute;
    left: 50%;
    height: 180px;
    width: 50%;
}
.logo-ted {
    padding-left: 60px;
}
.titre-ted h2 {
    padding: 15px 60px;
    font-size: 42px;
    line-height: 0.8;
}
/* 
	100% Height for Opera as the max-height seems to be ignored, not optimal for large screens 
	http://bricss.net/post/11230266445/css-hack-to-target-opera 
*/
x:-o-prefocus, .lb-overlay img {
    height: 100%;
}

#open-menu{display: none;}
.lb-overlay p {
color:#FFF; margin:20px;
}

@media screen and (max-width: 1060px) {
.wrapper {padding: 0 10px;}
nav ul li a, #langue ul li a{padding: 14px 10px;}
.menu2 a {margin: 5px;}
}

/* Example for media query */
@media screen and (max-width: 940px) { 
	.titre-ted h2 {
    padding: 30px 60px;
    font-size: 46px;
    line-height: 0.8;
}
.
.menu2 {display: none;}
.slideshow-wrapper .slideshow-content img {height:110%; left:-30%; width:auto; max-width:none; position: absolute;}
.copyright {width: 100%;text-align: center;}
.lb-album {width:auto;margin: 0 auto;}
}
@media screen and (max-width: 820px) { 
.client-logo-content {width: auto;}
.big-title {margin: 0;}
#homepage #bloc-logo {top: 150px;float: none;margin: auto;}
#bloc-logo {top: 75px;float: none; margin: auto;}
#langue {position: absolute;z-index: 99999;top: 0;right: 0;}
.caption h3 span {padding: 6px 0px 0;}
.double-col {display: block;vertical-align: top;width: 360px;margin: 0px auto 110px;padding: 50px 0 0;}
#interieur .double-col {display: block;vertical-align: top;width: 360px;margin: 0px auto 110px;padding: 50px 0 0;}
#submenu nav ul li a {padding: 15px 10px;}
}
@media screen and (max-width: 760px) { 
	.bloc-ted{
    /* display: none; */
    height: 500px;
    background: #e62216;
    color: #FFF;
    overflow: hidden;
    position: relative;
    margin-top: 20px;
}

.img-ted {
    position: absolute;
    left: 0;
    height: 260px;
    width: 100%;
    text-align: center;
    overflow: hidden;
    background:url('../images/christophe-ambre-tedXphoto.jpg') no-repeat center center;
    background-size:cover;
}

.titre-ted {
    position: absolute;
    left: 0%;
    height: 200px;
    width: 100%;
    top: 260px;
}
.logo-ted {
    padding-left: 20px;
}
.titre-ted h2 {
    padding: 30px 20px;
    font-size: 42px;
    line-height: 0.8;
}
.cover-bloc {
    width: 100%;
    height: 260px;
    float: left;
    vertical-align: middle;
    cursor: pointer;
}
header, #interieur header, #homepage header {
height: auto;
width: 100%;
}
#menu {
background: #111925;
height: auto;
}
#open-menu{display:block;}
nav #menu-link {display: none;}

nav #open-menu li {background: #111925; border:none;}
nav #open-menu li:hover a{color:#FFF;}

nav ul li {
display: block;
vertical-align: middle;
height: auto;
text-align: center;
width: 100%;
padding: 15px 0;
background: #FFF;
border-top: 1px solid #CCC;
}
.double-col p, .double-col h4 {
margin-left: 0;
margin-bottom: 15px;
}
nav ul li a {
line-height: 65px;
font-size: 32px;
}
.submenu {
background: #FFF;
width: 100%;
left: 0;
height: auto !important;
position: static;
}
.submenu ul li {border:none;}
.submenu nav ul li a {
line-height: 60px;
font-size: 16px;
}
nav ul li:hover a, .active a {
text-decoration: none;
color: #111925;
border-bottom: none;
}
.submenu nav ul li a:hover, .submenu .active a {
text-decoration: none;
color: #111925;
border-bottom: none;
font-weight: bold;
}
#homepage #bloc-logo, #bloc-logo {
top: 80px;
float: none;
width: auto;
margin: auto;
}
#logo {
font-size: 50px;
border-bottom: 1px solid #FFF;
border-right: none;
width: auto;
line-height: 36px;
text-align: center;
padding: 10px 0px 15px 0;
font-family: 'Montserrat', sans-serif;
font-weight: 700;
display: block;
margin: 0 20px;
}
.titre-page {
width: auto;
display: block;
text-align: center;
margin: 10px 40px 0;
}

#homepage .double-col {display: block;
vertical-align: top;
width: auto;
margin: 0px auto 110px;
padding: 50px 30px 70px;
}

#interieur .double-col, .double-col {width: auto;
margin: 0px auto 110px;padding:50px 20px;}

nav {width: 100%;}
#submenu {display: none;}
#interieur .double-col {width:auto;}
#slider, #img-top {height:250px;}

.wrapper {
padding: 0;
}
.simple-col {
display: inline-block;
width: auto;
padding: 20px;
}

.lb-overlay:target {
width: auto;
height: auto;
bottom: 0px;
right: 0px;
padding: 80px 20px 120px 20px;
}


}
