/***
 * PANEL
 * =====
 */

/*
 * Layout
 */
.panel {
	position:relative;
	z-index:2;
	-webkit-transform:translateZ(1px);
	        transform:translateZ(1px);

	display:table;
	table-layout:fixed;
	height:100%;
	width:100%;
	overflow:hidden;

	/*max-height:2000px;*/

	color:#fff;
}

.panel__content {
	position:relative;
	z-index:2;

	display:table-cell;
	vertical-align:middle;
	padding:60px 40px;
	width:100%;
	height:100%; /* ensure children can inherit height */
	-webkit-transform:translateZ(1px);
	        transform:translateZ(1px);
}

.target_agency .panel__intro-title-polygon--2,
.target_agency .panel__intro-title-polygon--1{
  display: none;
}

@media all and (max-width:800px) {
	.panel__content {
		padding:20px;
	}
}

/*
 * Content animation
 */
@media all and (min-width:1025px) {
	.panel--strat .panel__content,
	.panel--design .panel__content,
	.panel--medias .panel__content,
	.panel--dev .panel__content,
	.panel--mobile .panel__content,
	.panel--social .panel__content,
	.panel--solutions .panel__content,
	.panel--insights .panel__content,
	.panel--strategy .panel__content,
	.panel--realisation .panel__content {
		opacity:0;
		-ms-transform:translateY(2%);
		-webkit-transform:translateY(2%) translateZ(1px);
		        transform:translateY(2%) translateZ(1px);
		-webkit-transition:all .5s ease;
		     -o-transition:all .5s ease;
		        transition:all .5s ease;
	}

	/*.panel--design:after,*/
	.panel--mobile:after,
	.panel--medias:after,
	.panel--strat:after,
	.panel--dev:after,
	.panel--social:after,
	.panel--solutions:after {
		opacity:0;
		-webkit-transition:all .5s ease;
		     -o-transition:all .5s ease;
		        transition:all .5s ease;
	}

	/*.panel--insights .panel__content,
	.panel--realisation .panel__content { transform:translateX(-1%); }
	.panel--strategy .panel__content { transform:translateX(1%); }*/

	.panel.show .panel__content {
		opacity:1;
		-ms-transform:translateY(0);
		-webkit-transform:translateY(0) translateZ(1px);
		        transform:translateY(0) translateZ(1px);
	}

}


/*
 * Colors
 */
.panel--who,
.panel--design,
.panel--insights,
.panel--realisation,
.panel--historic {
	background:#fff;
	color:#16242f;
}

.panel--solutions {
	color:#272b33;
}

.panel--strategy {
	background-image:url(../images/bg-metho.jpg);
	background-position:0 0;
	background-repeat:no-repeat;
	background-color:#16242f;
}

/* BG colors */
.panel--strat        { background-color:#ff6464; }
.panel--clients      { background-color:#ff6464; }
.panel--medias       { background-color:#ff6464; }
.panel--dev          { background-color:#135758; }
.panel--mobile       { background-color:#efbe4b; }
.panel--social       { background-color:#16242f; }
.panel--solutions    { background-color:#ebebeb; }
.panel--clients-dark {
	background-color:#111b22;
	background-image:-webkit-radial-gradient(center, ellipse, rgba(107,145,175,.2) 0%, rgba(107,145,175,.1) 30%, rgba(107,145,175,0) 75%, rgba(107,145,175,0) 100%);
	background-image:radial-gradient(ellipse at center, rgba(107,145,175,.2) 0%,rgba(107,145,175,.1) 30%,rgba(107,145,175,0) 75%,rgba(107,145,175,0) 100%);
	background-size:700px 700px;
	background-repeat:no-repeat;
	background-position:center -350px;
}

/* BG images */
.panel--strat:after,
/*.panel--design:after,*/
.panel--dev:after,
.panel--mobile:after,
.panel--social:after,
.panel--medias:after,
.panel--solutions:after {
	position:absolute;
	top:0;
	bottom:0;
	z-index:1;

	width:58%;
	width:50%\0; /* IE */
	max-width:900px;
	content:"";

	background-repeat:no-repeat;
	background-position:50% center;
	background-size:100% auto;
}

.panel--strat:after     { background-image:url(../images/strat.jpg);     }
/*.panel--design:after    { background-image:url(../images/design.jpg);    }*/
.panel--dev:after       { background-image:url(../images/dev.jpg);       }
.panel--mobile:after    { background-image:url(../images/mobile.jpg);    }
.panel--social:after    { background-image:url(../images/social.jpg);    }
.panel--medias:after    { background-image:url(../images/medias.jpg);    }
.panel--solutions:after { background-image:url(../images/solutions.jpg); }

.panel--strat:after,
.panel--dev:after,
.panel--social:after,
.panel--solutions:after {
	right:50%;
	-webkit-transform:scale(.9) translateX(20%);
	    -ms-transform:scale(.9) translateX(20%);
	     -o-transform:scale(.9) translateX(20%);
	        transform:scale(.9) translateX(20%);
}

/*.panel--design:after,*/
.panel--mobile:after,
.panel--medias:after {
	left:50%;
	-webkit-transform:scale(.9) translateX(-20%);
	    -ms-transform:scale(.9) translateX(-20%);
	     -o-transform:scale(.9) translateX(-20%);
	        transform:scale(.9) translateX(-20%);
}

/*.panel--design.show:after,*/
.panel--mobile.show:after,
.panel--medias.show:after {
	opacity:1;
	-webkit-transform:scale(1) translateX(-20%);
	    -ms-transform:scale(1) translateX(-20%);
	     -o-transform:scale(1) translateX(-20%);
	        transform:scale(1) translateX(-20%);
}

.panel--strat.show:after,
.panel--dev.show:after,
.panel--social.show:after,
.panel--solutions.show:after {
	opacity:1;
	-webkit-transform:scale(1) translateX(20%);
	    -ms-transform:scale(1) translateX(20%);
	     -o-transform:scale(1) translateX(20%);
	        transform:scale(1) translateX(20%);
}

/*.panel--design:after {
	left:43%;
	width:50%;
}*/

/*
 * Childrens
 */
.panel__picture {
	margin:0 auto;
	display:block;
	max-width:100%;
	height:auto;
}

.panel__title {
	position:relative;
	margin:0 0 30px;

	font-size:80px;
	line-height:.7em;
	font-family: "clone-rounded-latin",sans-serif;
  font-weight:500;
	text-transform:uppercase;
}

.panel__title strong {
	color:#ff6464;
	font-weight:normal;
}

.panel__title:before {
	margin-bottom:.2em;
	display:block;

	content:"0" attr(data-nr) ".";
	font-family: "clone-rounded-latin",sans-serif;
	/*font-size:75px;*/
	font-size:0.8em;
  font-weight: 100;
}

/*.panel__title:after {
	position:absolute;
	top:-80px;
	left:5px;

	content:"";
	width:0;
	height:120px;

	opacity:.5;
	border-left:1px solid;
	transform:rotate(45deg);
	transform-origin:100% 100%;
}*/

.panel__title--small {
	font-size:50px;
	line-height:.8em;
}

.panel__text {
	max-width:650px;

	font-size:14px;
	line-height:1.6em;
}

.panel__text p {
	margin:0 0 16px;
	opacity:.5;
}

.panel--mobile .panel__text p {
	opacity:.9;
}

.panel__text p:first-child {
	opacity:1;
	font-weight:normal;
	font-size:21px;
  font-weight:500;
}

.panel__text p:first-child strong {
	font-weight:normal;
}

.panel__text img {
	margin:35px 0;
}

.panel__text:last-child {
	margin-bottom:0;
}

@media all and (max-width:1200px) {
	.panel__title { font-size:64px; }
	.panel__title--small { font-size:44px; }
	.panel__text { font-size:13px; }
}

@media all and (max-width:1024px) {
	.panel__title { font-size:54px; }
	.panel__title--small { font-size:40px; }
	.panel__text { font-size:12px; }
}

@media all and (max-width:1024px) {
	.panel__title { font-size:40px; }
}

/*
 * Decorated title
 */
.panel__decorated-title {
	margin:0 0 .9em;

	padding:40px 0 35px;
	background:url("../images/title-bg-top.png") center top no-repeat, url("../images/title-bg-bottom.png") center bottom no-repeat;

	font-size:60px;
	line-height:.9em;
	font-weight:500;
	text-transform:uppercase;
	text-align:center;
}

/*
 * Responsive
 */
@media all and (max-width:1024px) {
	.panel--strat .rack__item.size--2-5,
	.panel--design .rack__item.size--2-5,
	.panel--dev .rack__item.size--2-5,
	.panel--mobile .rack__item.size--2-5,
	.panel--social .rack__item.size--2-5,
	.panel--medias .rack__item.size--2-5,
	.panel--solutions .rack__item.size--2-5 {
		width:60% !important;
	}

	.panel--strat .panel__content,
	.panel--design .panel__content,
	.panel--medias .panel__content,
	.panel--dev .panel__content,
	.panel--mobile .panel__content,
	.panel--social .panel__content,
	.panel--solutions .panel__content,
	.panel--insights .panel__content,
	.panel--strategy .panel__content,
	.panel--realisation .panel__content {
		opacity:1;
		-webkit-transform:translateY(0);
		    -ms-transform:translateY(0);
		     -o-transform:translateY(0);
		        transform:translateY(0);
	}

	/*.panel--strat:after,
	.panel--design:after,
	.panel--dev:after,
	.panel--mobile:after,
	.panel--social:after,
	.panel--medias:after,
	.panel--solutions:after {
		width:53%;
	}*/

	.panel--strat:after,
	.panel--dev:after,
	.panel--social:after,
	.panel--solutions:after {
		right:56%;
	}

	.panel--design:after,
	.panel--mobile:after,
	.panel--medias:after {
		left:56%;
	}

	/*.panel--design:after {
		left:49%;
		width:47%;
	}*/

}

@media all and (max-width:768px) {
	.panel {
		height:auto;
	}

	.panel--strat:after,
	.panel--design:after,
	.panel--dev:after,
	.panel--mobile:after,
	.panel--social:after,
	.panel--medias:after,
	.panel--solutions:after {
		display:none;
	}

	.panel--strat .rack__item.size--3-5,
	.panel--design .rack__item.size--3-5,
	.panel--dev .rack__item.size--3-5,
	.panel--mobile .rack__item.size--3-5,
	.panel--social .rack__item.size--3-5,
	.panel--medias .rack__item.size--3-5,
	.panel--solutions .rack__item.size--3-5 {
		display:none !important;
	}

	.panel--strat .layout,
	.panel--design .layout,
	.panel--dev .layout,
	.panel--mobile .layout,
	.panel--social .layout,
	.panel--medias .layout,
	.panel--solutions .layout {
		padding:10px 20px;
	}

	.panel--insights .rack__item,
	.panel--strategy .rack__item,
	.panel--realisation .rack__item {
		display:block !important;
		width:100% !important;
	}

	.panel__picture {
		margin-left:auto;
		margin-right:auto;
		width:80%;
	}
}

@media all and (max-width:480px) {
	.panel__picture { width:90%; }
	.panel__content .layout {
		padding-left:0;
		padding-right:0;
	}
}

@media all and (max-width:400px) {
	.panel__picture { width:100%; }
}
/***
 * PANEL INTRO
 * ===========
 */

.panel--intro {
	position:relative;
	z-index:1;

	height:810px;
	-moz-box-sizing:border-box;
	     box-sizing:border-box;

	-webkit-transform:translateZ(1px);

	        transform:translateZ(1px);
	cursor:pointer;
}
 @media(max-width:1600px){
     .panel--intro{
         height:648px;
     }
 }
/*.panel--intro .panel__content { padding:5%; }*/

/*
 * Scroll indication
 */
.panel--intro:after {
	position:absolute;
	bottom:20px;
	left:50%;
	margin-left:-100px;

	width:200px;
	height:16%;
	max-height:120px;
	content:"";
	display:block;

	background:url(../images/scroll.png) no-repeat center center;
	background-size:auto 100%;
	opacity:0;
	-ms-transform:translateY(35%) translateZ(1px);
	-webkit-transform:translateY(35%) translateZ(1px);
	        transform:translateY(35%) translateZ(1px);
}

.panel--intro.show:after {
	opacity:1;
	-ms-transform:translateY(0) translateZ(1px);
	-webkit-transform:translateY(0) translateZ(1px);
	        transform:translateY(0) translateZ(1px);
	-webkit-transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 0.770) 1.5s;
	     -o-transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 0.770) 1.5s;
	        transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 0.770) 1.5s;
}

/*
 * Parallaxed background
 */
.panel--intro__bg {
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;

	background:#16242f url(../images/panel-intro-bg.jpg);
}

/*
 * Top right glow
 */
.panel--intro__bg:before {
	position:absolute;
	right:0;
	top:0;

	content:"";
	height:1100px;
	width:1100px;

	background-position:550px -550px;
	background-image:-webkit-radial-gradient(center, ellipse, rgba(107,145,175,.35) 0%, rgba(107,145,175,.1) 30%, rgba(107,145,175,0) 75%, rgba(107,145,175,0) 100%);
	background-image:radial-gradient(ellipse at center, rgba(107,145,175,.35) 0%,rgba(107,145,175,.1) 30%,rgba(107,145,175,0) 75%,rgba(107,145,175,0) 100%);
	background-repeat:no-repeat;
}

/*
 * Page Title / Image
 */

.panel__intro-title {
	margin:-5% auto 0;
	position:relative;
	z-index:3;

	width:40%;
	max-width:600px;

	visibility:hidden;
	-webkit-transform:translateZ(1px);
	        transform:translateZ(1px);
	/*transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .5s ease;*/
}

.panel__intro-title:before {
	content:"";
	display:block;
	width:100%;
	padding-top:75%;
}

.show-video .panel__intro-title {
	opacity:0;
	-ms-transform:scale(.5);
	-webkit-transform:scale(.5) translateZ(1px);
	        transform:scale(.5) translateZ(1px);
}

/* Diagonal line */
.panel__intro-title-line {
	position:absolute;
	/*top:58.5%;*/
	top:50%;
	left:50%;
	z-index:2;

	height:0%;
	width:1px;

	opacity:0;
	-ms-transform:rotate(45deg) translateY(-50%) translateX(-50%);
	-webkit-transform:rotate(45deg) translateY(-50%) translateX(-50%) translateZ(1px);
	        transform:rotate(45deg) translateY(-50%) translateX(-50%) translateZ(1px);
	/*transform:rotate(45deg) translateY(-50%) translateX(-50%);*/
	-webkit-transform-origin:0 0;
	    -ms-transform-origin:0 0;
	     -o-transform-origin:0 0;
	        transform-origin:0 0;
	background:#596670;

	-webkit-transition:all .25s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease;

	     -o-transition:all .25s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease;

	        transition:all .25s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease;
}

.panel__intro-title--home .panel__intro-title-line { display:none; }

@media all and (max-width:540px) {
	.panel__intro-title--home .panel__intro-title-line { display:block; }
}

.show .panel__intro-title-line {
	top:63%;
	height:160%;
	opacity:1;
}

.panel__intro-title-line:before,
.panel__intro-title-line:after {
	position:absolute;
	left:-5px;

	display:block;
	content:"";

	width:11px;
	height:11px;

	border-radius:100%;
	background:#596670;
}

.panel__intro-title-line:before { top:-5px; }
.panel__intro-title-line:after  { bottom:-5px; }

@media all and (max-width:1024px) {
	.panel__intro-title-line:before,
	.panel__intro-title-line:after {
		width:9px;
		height:9px;

		left:-4px;
	}

	.panel__intro-title-line:before { top:-4px; }
	.panel__intro-title-line:after  { bottom:-4px; }
}

@media all and (max-width:540px) {
	.panel__intro-title-line:before,
	.panel__intro-title-line:after {
		width:7px;
		height:7px;

		left:-3px;
	}

	.panel__intro-title-line:before { top:-3px; }
	.panel__intro-title-line:after  { bottom:-3px; }
}

/* Double polygon */
.panel__intro-title-polygon {
	position:absolute;
	top:50%;
	left:50%;
	z-index:1;

	margin-top:21px;

	width:50%;
	padding-top:50%;
	opacity:0;

	-ms-transform:translateY(-50%) translateX(-50%) rotate(-120deg) scale(.2);
	-webkit-transform:translateY(-50%) translateX(-50%) rotate(-120deg) scale(.2) translateZ(1px);
	        transform:translateY(-50%) translateX(-50%) rotate(-120deg) scale(.2) translateZ(1px);
	background:url(../images/intro-polygon.png) no-repeat center center;
	background-size:100% 100%;
}

.show .panel__intro-title-polygon {
	opacity:1;
}

.show .panel__intro-title-polygon--1 {
	-ms-transform:translateY(-50%) translateX(-50%);
	-webkit-transform:translateY(-50%) translateX(-50%) translateZ(1px);
	        transform:translateY(-50%) translateX(-50%) translateZ(1px);
}

.show .panel__intro-title-polygon--2 {
	-ms-transform:translateY(-50%) translateX(-50%) rotate(22deg);
	-webkit-transform:translateY(-50%) translateX(-50%) rotate(22deg) translateZ(1px);
	        transform:translateY(-50%) translateX(-50%) rotate(22deg) translateZ(1px);
}

/* Page icon */
.panel__intro-title-icon {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:4;

	opacity:0;
	-ms-transform:scale(.2);
	-webkit-transform:scale(.2) translateZ(1px);
	        transform:scale(.2) translateZ(1px);

	background-size:100% 100%;
}

.show .panel__intro-title-icon {
	opacity:1;
	-ms-transform:scale(1);
	-webkit-transform:scale(1) translateZ(1px);
	        transform:scale(1) translateZ(1px);
}

/* Page text */
.panel__intro-title-text {
	position:absolute;
	left:50%;
	bottom:-4%;
	z-index:5;

	width:125%;

	height:37.0370370366%; /* Crazy number to respect aspect ratio */

	opacity:0;
	-ms-transform:translateY(25%) scale(.6) translateX(-50%);
	-webkit-transform:translateY(25%) scale(.6) translateX(-50%) translateZ(1px);
	        transform:translateY(25%) scale(.6) translateX(-50%) translateZ(1px);
	-webkit-transform-origin:0 0;
	    -ms-transform-origin:0 0;
	     -o-transform-origin:0 0;
	        transform-origin:0 0;

	background-size:100% 100%;
}

.panel__intro-title--home .panel__intro-title-text {
	bottom:1%;
}

.show .panel__intro-title-text {
	opacity:1;
	-ms-transform:translateY(0) scale(1) translateX(-50%);
	-webkit-transform:translateY(0) scale(1) translateX(-50%) translateZ(1px);
	        transform:translateY(0) scale(1) translateX(-50%) translateZ(1px);
}

/* Triangle */
.panel__intro-title-triangle {
	position:absolute;
	top:9%;
	left:50%;
	z-index:5;

	width:3.333%;

	opacity:0;
	-ms-transform:translateY(500%) translateX(-50%);
	-webkit-transform:translateY(500%) translateX(-50%) translateZ(1px);
	        transform:translateY(500%) translateX(-50%) translateZ(1px);
	background:url(../images/intro-triangle.png) no-repeat;
	background-size:100% auto;
}

/*.panel__intro-title--home .panel__intro-title-triangle { top:0%; }*/

.panel__intro-title-triangle:before {
	content:"";
	display:block;

	padding-top:100%;
}

.show .panel__intro-title-triangle {
	opacity:1;
	-ms-transform:translateY(0) translateX(-50%);
	-webkit-transform:translateY(0) translateX(-50%) translateZ(1px);
	        transform:translateY(0) translateX(-50%) translateZ(1px);
}


/* Animations */
.panel__intro-title-line      { -webkit-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.25s, opacity 0.50s ease 0.25s; -o-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.25s, opacity 0.50s ease 0.25s; transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.25s, opacity 0.50s ease 0.25s; }
.panel__intro-title-triangle  { -webkit-transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.25s, opacity 1.00s ease 0.50s; -o-transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.25s, opacity 1.00s ease 0.50s; transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.25s, opacity 1.00s ease 0.50s; }
.panel__intro-title-polygon   { -webkit-transition:all 1.25s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.00s, opacity 0.50s ease 0.00s; -o-transition:all 1.25s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.00s, opacity 0.50s ease 0.00s; transition:all 1.25s cubic-bezier(0.770, 0.000, 0.175, 1.500) 0.00s, opacity 0.50s ease 0.00s; }
.panel__intro-title-icon      { -webkit-transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.50s, opacity 0.50s ease 0.50s; -o-transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.50s, opacity 0.50s ease 0.50s; transition:all 1.00s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.50s, opacity 0.50s ease 0.50s; }
.panel__intro-title-text      { -webkit-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.75s; -o-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.75s; transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.250) 0.75s; }

/* Hide texte */
.panel__intro-title span {
	position:absolute;
	bottom:100%;
	visibility:hidden;
}

/*
 * Tagline - sub text
 */
.panel__tagline {
	position:relative;
	z-index:2;
	margin:-.45% auto 1em;
	width:80%;
	max-width:720px;
	visibility:hidden;
	-ms-transform:translateY(30%);
	-webkit-transform:translateY(30%) translateZ(1px);
	        transform:translateY(30%) translateZ(1px);
	-webkit-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.000) 1.25s;
	     -o-transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.000) 1.25s;
	        transition:all 0.75s cubic-bezier(0.770, 0.000, 0.175, 1.000) 1.25s;
	opacity:0;
	font-size:21px;
	color:#6e7e8b;
	text-shadow:0 0 .1em #16242f;
	text-shadow:0 0 .1em #16242f, 0 0 2px #16242f, 2px 2px 2px #16242f, 2px 2px 2px #16242f, -2px -2px 2px #16242f, -2px -2px 2px #16242f;
	text-align:center;
}

.show .panel__tagline {
	opacity:1;
	-ms-transform:translateY(0);
	-webkit-transform:translateY(0) translateZ(1px);
	        transform:translateY(0) translateZ(1px);
}

/*
 * Responsive
 */
@media all and (max-width:1340px) {
	.panel__tagline { font-size:17px; }
}

@media all and (max-width:1200px) {
	.panel__tagline { font-size:16px; }
}

@media all and (max-width:1024px) {
	.panel__intro-title {
		margin-bottom:5%;
	}

	.panel__intro-title--home { margin-bottom:0; }

	.panel--intro {
		margin-top:-107px;
		padding-top:107px;
	}

	.panel__intro-title { width:50%; }
	.panel__tagline { display:none; }
}

@media all and (max-width:960px) {
	.panel__tagline { font-size:14px; }
}

@media all and (max-width:768px) {
	.panel--intro {margin-top:90px; height:auto; padding-top:0; }
	.panel--intro:after { display:none; }

	.panel__intro-title {
		margin-top:5%;
		margin-bottom:15%;
		width:60% !important;
	}
}

@media all and (max-width:600px) {
	.panel__intro-title { width:70% !important; }
}

@media all and (max-width:540px) {
	.panel__intro-title {
		margin-bottom:17.5%;
		width:75% !important;
	}
}

@media all and (max-width:360px) {
	.panel__intro-title { width:85% !important; }
}
/***
 * PANEL AGENCY
 * ============
 */

.panel--agency {
	height:auto;
}
/***
 * PANEL CLIENTS
 * =============
 */

.panel--clients {}
.panel--clients-dark { height:auto; }
/***
 * PANEL WHO
 * =========
 */

.panel--who {}
.panel--who img { position:relative; top:-2px; }

@media all and (max-width:800px) {
	.panel--who .panel__decorated-title { font-size:50px; }
	.panel--who .rack { display:block !important; }
	.panel--who .rack__item { display:block !important; width:100% !important; }
	.panel--who img { margin:40px auto 0; left:10px; }
}

@media all and (max-width:600px) {
	.panel--who .panel__decorated-title { font-size:40px; }
	.panel--who .panel__text p:first-child { font-size:16px; }
}

@media all and (max-width:540px) {
	.panel--who .panel__decorated-title { font-size:32px; }
	.panel--who .panel__text p:first-child { font-size:15px; }
}

@media all and (max-width:380px) {
	.panel--who .panel__decorated-title { font-size:28px; }
	.panel--who .panel__text p:first-child { font-size:14px; }
}
/***
 * PANEL HOME
 * ==========
 */

.panel--home {}
/***
 * PANEL 404
 * =========
 */

.panel--404 {
	border-bottom:1px solid #bebebe;
	border-bottom:1px solid rgba(255,255,255,.1);

	text-align:center;
}

.panel--404 h1 {
	font-family:"gentona-medium", sans-serif;
	font-weight:normal;
	text-transform:uppercase;

	font-size:40px;
}
/***
 * REVEAL
 * ======
 */



/***
 * VIDEO HP
 * ========
 */

.video-hp {
	position:absolute;
	z-index:2;
	top:50%;
	left:0;
	right:0;

	-webkit-transform:translateY(-50%);

	    -ms-transform:translateY(-50%);

	     -o-transform:translateY(-50%);

	        transform:translateY(-50%);
	overflow:hidden;
	height:0;
}

@media all and (max-width:540px) {
	.video-hp { display:none; }
}

.video-hp__outer {
	position:absolute;
	z-index:1;
	top:50%;
	left:50%;

	text-align:center;
}

.video-hp__video {
	margin:0 auto;

	display:block;

	outline:0;
	background-color:#0e171e;
	background-image:-webkit-radial-gradient(center, ellipse, rgba(35,58,74,1) 0%, rgba(31,51,66,1) 20%, rgba(15,25,33,1) 73%, rgba(14,23,30,1) 100%);
	background-image:radial-gradient(ellipse at center, rgba(35,58,74,1) 0%,rgba(31,51,66,1) 20%,rgba(15,25,33,1) 73%,rgba(14,23,30,1) 100%);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% 125%;
}

.video-hp iframe {
	width:100%;
	height:100%;
}

/*
 * Icons
 */
.video-hp__icons {
	position:absolute;
	top:50%;
	left:50%;
}

@media all and (max-width:1024px) {
	.video-hp__icons { display:none; }
}

/*
 * Transerval line
 */
.video-hp__line {
	position:absolute;
	top:50%;
	left:50%;
	z-index:1;

	width:1px;

	height:0%;
	opacity:0;

	-webkit-transform:rotate(45deg) translateY(-50%) translateX(-50%);

	    -ms-transform:rotate(45deg) translateY(-50%) translateX(-50%);

	     -o-transform:rotate(45deg) translateY(-50%) translateX(-50%);

	        transform:rotate(45deg) translateY(-50%) translateX(-50%);
	-webkit-transform-origin:0 0;
	    -ms-transform-origin:0 0;
	     -o-transform-origin:0 0;
	        transform-origin:0 0;
	background:#596670;
}

.video-hp__line:before,
.video-hp__line:after {
	position:absolute;
	left:-5px;

	display:block;
	content:"";

	width:11px;
	height:11px;

	border-radius:100%;
	background:#596670;
}

.video-hp__line:before { top:-5px; }
.video-hp__line:after  { bottom:-5px; }

.show .video-hp__line {
	height:165%;
	opacity:1;
}

/*
 * Shards
 */
.video-hp__shard {
	position:absolute;
	z-index:3;
	background:url(../images/video-hp-shard-sprite.png) no-repeat -99px -99px;
	opacity:0;
}

.video-hp__shard--1 {
	top:-5.5%;
	left:-7.5%;

	background-position:0 0;
	width:41px;
	height:19px;

	-webkit-transform:translate(40px, 40px) rotate(10deg);

	    -ms-transform:translate(40px, 40px) rotate(10deg);

	     -o-transform:translate(40px, 40px) rotate(10deg);

	        transform:translate(40px, 40px) rotate(10deg);
}

.video-hp__shard--2 {
	bottom:-11%;
	right:1%;

	background-position:-41px 0;
	width:27px;
	height:37px;
	-webkit-transform:translate(-40px, -45px) rotate(-10deg);
	    -ms-transform:translate(-40px, -45px) rotate(-10deg);
	     -o-transform:translate(-40px, -45px) rotate(-10deg);
	        transform:translate(-40px, -45px) rotate(-10deg);
}

.show .video-hp__shard--1,
.show .video-hp__shard--2 {
	opacity:1;
	-webkit-transform:translate(0) rotate(0);
	    -ms-transform:translate(0) rotate(0);
	     -o-transform:translate(0) rotate(0);
	        transform:translate(0) rotate(0);
}

/*
 * Circles
 */
.video-hp__circle {
	position:absolute;
	border-radius:100%;
	opacity:0;
	z-index:4;
}

.video-hp__circle--1 {
	left:-6%;
	bottom:15%;

	height:9px;
	width:9px;
	border:2px solid #1f6867;
	-webkit-transform:translate(200px, -100px);
	    -ms-transform:translate(200px, -100px);
	     -o-transform:translate(200px, -100px);
	        transform:translate(200px, -100px);
}

.video-hp__circle--2 {
	top:12%;
	right:-9%;
	height:7px;
	width:7px;
	border:1px solid #ff6464;
	-webkit-transform:translate(-200px, 100px);
	    -ms-transform:translate(-200px, 100px);
	     -o-transform:translate(-200px, 100px);
	        transform:translate(-200px, 100px);
}

.video-hp__circle--3 {
	top:52%;
	right:-6%;
	height:7px;
	width:7px;
	background:#fff;
	-webkit-transform:translate(-300px, 40px);
	    -ms-transform:translate(-300px, 40px);
	     -o-transform:translate(-300px, 40px);
	        transform:translate(-300px, 40px);
}

.video-hp__circle--4 {
	top:44%;
	right:-6%;
	width:35px;
	height:35px;
	border-radius:0;
	overflow:hidden;
	-webkit-transform:translate(-200px, 40px) rotate(-360deg) scale(2);
	    -ms-transform:translate(-200px, 40px) rotate(-360deg) scale(2);
	     -o-transform:translate(-200px, 40px) rotate(-360deg) scale(2);
	        transform:translate(-200px, 40px) rotate(-360deg) scale(2);
}

.video-hp__circle--4:after {
	content:"";
	display:block;
	height:70px;
	width:70px;
	-moz-box-sizing:border-box;
	     box-sizing:border-box;

	border-radius:100%;
	border:1px solid #ff6464;
}

.video-hp__circle--5 {
	top:30%;
	left:-10%;
	width:70px;
	height:35px;
	overflow:hidden;
	border-radius:0;
	-webkit-transform:translate(240px, 50px) rotate(270deg) scale(1.5);
	    -ms-transform:translate(240px, 50px) rotate(270deg) scale(1.5);
	     -o-transform:translate(240px, 50px) rotate(270deg) scale(1.5);
	        transform:translate(240px, 50px) rotate(270deg) scale(1.5);
}

.video-hp__circle--5:after {
	position:relative;
	top:-35px;
	content:"";
	display:block;

	height:70px;
	width:70px;
	-moz-box-sizing:border-box;
	     box-sizing:border-box;

	opacity:.4;
	border-radius:100%;
	border:1px solid #fff;
}

.show .video-hp__circle--1 { opacity:1; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); }
.show .video-hp__circle--2 { opacity:1; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); }
.show .video-hp__circle--3 { opacity:1; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); }
.show .video-hp__circle--4 { opacity:1; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); }
.show .video-hp__circle--5 { opacity:1; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); }

/*
 * Lines
 */
.video-hp__stroke {
	position:absolute;
	width:1px;
	height:60px;
	background:#6d3235;
	opacity:0;
}

.video-hp__stroke--1 {
	right:104%;
	top:102%;
	-webkit-transform:translate(100px, -100px) rotate(25deg);
	    -ms-transform:translate(100px, -100px) rotate(25deg);
	     -o-transform:translate(100px, -100px) rotate(25deg);
	        transform:translate(100px, -100px) rotate(25deg);
}

.video-hp__stroke--2 {
	left:106%;
	top:82%;
	-webkit-transform:translate(-100px, -100px) rotate(-25deg);
	    -ms-transform:translate(-100px, -100px) rotate(-25deg);
	     -o-transform:translate(-100px, -100px) rotate(-25deg);
	        transform:translate(-100px, -100px) rotate(-25deg);
}

.show .video-hp__stroke--1 { opacity:1; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); }
.show .video-hp__stroke--2 { opacity:1; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }

/*
 * Transitions
 */
.video-hp           { -webkit-transition:height .35s cubic-bezier(0.770, 0.000, 0.175, 1.000); -o-transition:height .35s cubic-bezier(0.770, 0.000, 0.175, 1.000); transition:height .35s cubic-bezier(0.770, 0.000, 0.175, 1.000); }
.video-hp__line     { -webkit-transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; -o-transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; transition:all .35s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; }
.video-hp__shard    { -webkit-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; -o-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; }
.video-hp__shard--1 { -webkit-transition-delay:.15s; -o-transition-delay:.15s; transition-delay:.15s; }
.video-hp__circle   { -webkit-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; -o-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; }
.video-hp__stroke   { -webkit-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; -o-transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; transition:all .5s cubic-bezier(0.770, 0.000, 0.175, 1.000), opacity .25s ease; }