/*
D’après sennep.com
*/

/* CSS RESET */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,acronym,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

fieldset,img {
border: 0;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,img,object,embed,iframe {
display: block
}

address,caption,cite,code,dfn,th,var {
font-style: normal;
font-weight: normal;
}

nav ul,nav li {
list-style: none;
}

caption,th {
text-align: left;
}

h1,h2,h3,h4,h5,h6 {
font-size: 100%;
font-weight: normal;
width: auto
}

q:before,q:after {
content: "";
}

abbr,acronym {
font-variant: normal;
}

sup {
vertical-align: text-top;
}

sub {
vertical-align: text-bottom;
}

input,textarea,select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
}

legend {
color: #333;
}

a,a:hover,a:visited:hover,a:active,a:active:hover {
outline: none
}

a,a:hover,a:visited:hover,a:visited {
text-decoration: none;
color: #333
}

::selection {
background: #ddd;
}

::-moz-selection {
background: #ddd;
}

::-webkit-selection {
background: #ddd;
}

/* WEB FONTS */

@font-face {
font-family: 'FrenteH1';
src: url('fonts/FrenteH1-Regular-webfont.eot?') format('eot'),
url('fonts/FrenteH1-Regular-webfont.woff') format('woff'),
url('fonts/FrenteH1-Regular-webfont.ttf') format('truetype'),
url('fonts/FrenteH1-Regular-webfont.svg#Avenir') format('svg');
font-weight: normal;
font-style: normal;
}

html {
overflow-x: hidden;
}

html.hideScroll {
overflow: hidden;
}

body {
font: 16px/22px "FrenteH1", sans-serif;
text-align: left;
background: #f2f2f2;
color: #333;
-webkit-tap-highlight-color: #ddd;
-webkit-text-size-adjust: none;
overflow-x: hidden;
}

.touch body {
-webkit-text-size-adjust: none;
    
}

body.home {
overflow-y: hidden;
}

body.seeds {
background: #1b1b1b;
color: #fff;
}

html.fake_fixed body {
background: #f2f2f2 url("../img/white-bar.png") 0 0 repeat-y;
}

html.fake_fixed body.seeds {
background: #1b1b1b url("../img/black-bar.png") 0 0 repeat-y;
}

p {
margin: 0 0 23px 0;
font-family:'PT sans narrow';
}

p:empty {
display: none;
}

a,
a:visited {
color: #9e9e9e;
text-decoration: none;
}

.about .info a,
.about .info a:visited {
color: #333;
background: #fdec00;
padding: 0 2px;
-webkit-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: all .4s linear;
transition: all .4s cubic-bezier(0, 0, 0.25, 1);
}

.no-touch .about .info a:hover,
.no-touch .about .info a:visited:hover {
color: #f2f2f2;
background: #333;
}

body.seeds a,
body.seeds a:visited {
color: #777;
}

.no-touch a:hover,
.no-touch a:visited:hover {
color: #333;
text-decoration: none;
}

.no-touch body.seeds a:hover,
.no-touch body.seeds a:visited:hover {
color: #fff;
}

.c1,
.c2,
.c3,
.c4 {
margin-right: 34px;
float: left;
position: relative;
text-align:justify;
font-family:'PT sans narrow';
}

.c1 {
width: 168px;
}

.c2 {
width: 370px;
}

.c3 {
width: 572px;
}

.c4 {
width: 774px;
}

h5,
h5 a,
h5 a:visited {
color: #333;
}

h2,
h3,
h4,
.header {
font-size: 24px;
line-height: 30px;
-webkit-font-smoothing: antialiased;
}

.content h2,
.content h3,
.description .c1 {
margin-bottom: 23px;
}

.content h2.intro {
margin-bottom: 24px;
margin-top: -2px;
}

/*.description h2,*/
.content h4,
.description h3 {
margin: 0 0 3px;
}

.content .c2 :last-child {
margin-bottom: 0;
}

/*.meta h2,*/
.meta h3,
.meta h4,
.content header h2 {
margin: 0;
}

h1,
p.grey {
color: #9e9e9e;
}

p.small_grey {
font-size: 13px;
line-height: 19px;
color: #9e9e9e;
}

.header,
header {
padding: 48px 0 46px 0;
margin: 0;
float: none !important;
height: 90px;
}

header,
.header {
padding: 0;
height: 186px;
display: table-cell;
vertical-align: middle;
overflow: hidden;
}

header {
display: none;
}

.maintenance header {
display: table-cell;
}

.maintenance {
padding-top: 0 !important;
}

blockquote {
font-style: italic;
}

.menu {
behavior: url(../js/pie.htc);
background: #ededed;
/* #f2f2f2; */
z-index:5;
width: 182px;
height: 100%;
position: fixed;
top: 0px;
left: 0px;
text-align: left;
/*box-shadow: 0 0 15px #ccc;*/
-webkit-transition: background .8s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: background .8s cubic-bezier(0, 0, 0.25, 1);
-o-transition: background .8s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: background .8s linear;
transition: background .8s cubic-bezier(0, 0, 0.25, 1);
}

/* uncomment to show shadow */

/*
.no-csstransforms .menu
{
-webkit-box-shadow:0 0 20px #bfbfbf;
-moz-box-shadow:0 0 20px #bfbfbf;
-ms-box-shadow:0 0 20px #bfbfbf;
-o-box-shadow:0 0 20px #bfbfbf;
box-shadow:0 0 20px #bfbfbf;
}
*/

.shadow {
behavior: url(../js/pie.htc);
/* change to block to show shadow */
display: none;
width: 91px;
height: 100%;
position: fixed;
z-index: 4;
top: 0px;
left: 80px;
-webkit-box-shadow: 0 0 55px #bfbfbf;
-moz-box-shadow: 0 0 55px #bfbfbf;
-ms-box-shadow: 0 0 55px #bfbfbf;
-o-box-shadow: 0 0 55px #bfbfbf;
box-shadow: 0 0 55px #bfbfbf;
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
-ms-transform: rotate(1deg);
-o-transform: rotate(1deg);
transform: rotate(1deg);
}

.no-csstransforms .shadow {
display: none;
}

.triangle {
display: none;
width: 182px;
height: 180px;
-webkit-backface-visibility: hidden;
}

.triangle canvas,
.canvas .triangle {
display: block;
}

.triangle canvas {
width: 182px;
height: 180px;
}

body.seeds .menu {
background: #333;
}

.menu ul {
display: block;
padding: 0;
}

.menu li {
display: block;
padding: 0 0 32px 0;
margin: 0 50px;
background: transparent url("../img/menu-line.png") left bottom no-repeat;
}

.menu .work {
background: transparent url("../img/cut-bg-menu.png") left bottom no-repeat;
z-index: 10;
position: relative;
}

.menu .home, .menu .about, .menu .contact{
background: transparent url("../img/cut-bg-menu.png") left bottom no-repeat;
position:relative;
z-index:9;
}

.menu .find{
background:transparent;
position:relative;
z-index:9;
}

.find a {
margin-top: -69px;
}

.work .find a {
margin-top: 0;
}

body.seeds .menu li {
background-image: url("../img/line-dark-grey.png");
}


.menu li a,
.menu li a:visited {
font-family:'PT sans narrow';
display: block;
padding: 10px 5px 5px;
line-height: 22px;
background-color: #ededed;
/* #f2f2f2 */
}

.menu li.work a,
.menu li.work a:visited {
padding: 5px;
}

.menu li:not(.home) a,
.menu li:not(.home) a:visited {
-webkit-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: all .4s linear;
transition: all .4s cubic-bezier(0, 0, 0.25, 1);
}

.menu li a.selected,
.menu li a.selected:visited {
color: #333;
}

.careers .menu li a.selected,
.careers .menu li a.selected:visited {
color: #9e9e9e;
}

body.seeds .menu li a.selected,
body.seeds .menu li a.selected:visited {
color: #fff;
}

.menu li.home {
padding: 0;
margin: 0;
background: transparent;
overflow: hidden;
}

.menu li.home a,
.menu li.home a:visited {
display: block;
padding: 0;
position: relative;
height: 180px;
}

.canvas .menu li.home a {
background: transparent;
}

.menu li.home span {
width: 82px;
height: 86px;
display: block;
line-height: 86px;
position: absolute;
top: 0;
left: 0;
z-index: 10;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
-khtml-opacity: 0;
-moz-opacity: 0;
opacity: 0;
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity 0.25s linear;
transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
}

body.seeds .menu li.home span {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
}

.loader {
width: 359px;
height: 186px;
position: fixed;
z-index: 100;
left: 182px;
top: 0;
padding: 0 34px;
background: transparent;
display: none;
opacity: .2;
-webkit-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: all .4s linear;
transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-webkit-animation-name: blinkload;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-moz-animation-name: blinkload;
-moz-animation-duration: 2s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
animation-name: blinkload;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}

.filter-open .loader {
left: 541px;
}

@-webkit-keyframes blinkload {
0% {
opacity: .2
}

50% {
opacity: 1
}

100% {
opacity: .2
}
}

@-moz-keyframes blinkload {
0% {
opacity: .2
}

50% {
opacity: 1
}

100% {
opacity: .2
}
}

@keyframes blinkload {
0% {
opacity: .2
}

50% {
opacity: 1
}

100% {
opacity: .2
}
}

.loader h3 {
padding: 30px 0;
color: #9e9e9e;
}

.filter {
width: 359px;
height: 100%;
position: fixed;
z-index: 3;
left: 182px;
top: 0;
padding: 0 0 0 34px;
margin-left: -427px;
margin-right: 34px;
background: #f2f2f2;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
-khtml-opacity: 0;
-moz-opacity: 0;
opacity: 0;
-webkit-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity .4s linear;
transition: opacity .4s cubic-bezier(0, 0, 0.25, 1);
/*-webkit-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: margin-left .4s linear, opacity .4s linear;
transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .4s cubic-bezier(0, 0, 0.25, 1);*/
}

.just_opacity {
-webkit-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1) !important;
-moz-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1) !important;
-o-transition: opacity .4s cubic-bezier(0, 0, 0.25, 1) !important;
-ms-transition: opacity .4s linear !important;
transition: opacity .4s cubic-bezier(0, 0, 0.25, 1) !important;
}

.touch .filter {
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}

.filter-open .filter {
margin-left: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
}

.filter-open iframe {
pointer-events: none;
}

.filter .selected,
.filter .selected:visited {
color: #333;
}

.filter ul {
background: #f2f2f2;
line-height: 23px;
}

.filter .scroller {
background: #f2f2f2;
width: 100%;
display: block;
/*margin-bottom: 34px;*/
position: relative;
overflow: hidden;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
-khtml-opacity: 0;
-moz-opacity: 0;
opacity: 0;
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity 0.25s linear;
transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
/*-webkit-backface-visibility: hidden;*/
}

.filter ul {
display: block;
width: 100%;
z-index: 1;
padding-bottom: 34px;
}

.filter .open {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
}

.content {
width: 808px;
margin: 0 0 0 216px;
position: relative;
}

.single article.content,
.text_page article.content,
.about article.content,
.contact article.content {
padding-top: 34px;
}

.content img {
-ms-interpolation-mode: bicubic;
}

#frame {
background: #f2f2f2;
overflow: hidden;
-webkit-transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity 0.4s linear;
transition: opacity 0.4s cubic-bezier(0, 0, 0.25, 1);
}

.js .frame {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
-khtml-opacity: 0;
-moz-opacity: 0;
opacity: 0;
}

#map {
width: 774px;
height: 516px;
position: relative;
}

.thumbs {
margin: 34px 22px 22px 216px;
position: relative;
overflow: hidden;
}

.ielt9 .thumbs {
margin-right: 0;
}

.content,
.thumbs {
-webkit-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .8s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .8s cubic-bezier(0, 0, 0.25, 1);
-o-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .8s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: margin-left .4s linear, opacity .8s linear;
transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1), opacity .8s cubic-bezier(0, 0, 0.25, 1);
}

.transition_height {
-webkit-transition: height .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: height .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: height .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: height .4s linear;
transition: height .4s cubic-bezier(0, 0, 0.25, 1);
}

.filter-open .content,
.filter-open .thumbs,
.touch .filter-open .thumbs {
margin-left: 609px;
}

.filter-open #frame {
/*cursor: w-resize;*/
}

.filter-open .content {
-khtml-opacity: .4;
-moz-opacity: ;
opacity: .4;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
}

.thumbs article {
float: left;
margin: 0 12px 12px 0;
width: 381px;
height: 254px;
overflow: hidden;
display: block;
}

.isotope {
}

.fixed_thumbs {
position: fixed !important;
width: 100%;
}

.isotope .isotope-item {
-webkit-transition: top 0.4s cubic-bezier(0, 0, 0.25, 1), left 0.4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: top 0.4s cubic-bezier(0, 0, 0.25, 1), left 0.4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: top 0.4s cubic-bezier(0, 0, 0.25, 1), left 0.4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: top 0.4s linear, left 0.4s linear;
transition: top 0.4s cubic-bezier(0, 0, 0.25, 1), left 0.4s cubic-bezier(0, 0, 0.25, 1);
}

.thumbs article img {
margin: 0;
}

.thumbs a {
display: block;
position: relative;
width: 100%;
text-decoration: none;
}

.thumbs h2 {
padding: 27px 31px;
position: relative;
z-index: 1;
color: #fff;
zoom: 1;
}

.thumbs h2 span {
color: #9e9e9e;
}

.thumbs .hover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: #fff;
z-index: 1;
-khtml-opacity: 0;
-moz-opacity: 0;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
display: block;
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity 0.25s linear;
transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
}

body.seeds .thumbs .hover {
color: #fff;
}

.thumbs .hover .angle {
width: 100%;
height: 100%;
background: #000;
display: block;
position: absolute;
top: 0;
left: 0;
-khtml-opacity: .85;
-moz-opacity: .85;
opacity: .85;
-webkit-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-o-transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: opacity 0.25s linear;
transition: opacity 0.25s cubic-bezier(0, 0, 0.25, 1);
}

.no-touch .thumbs a:hover .hover {
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
}

.thumbs a.visible,
.thumbs a.visible span {
width: 460px;
height: 306px;
}

/* SHOW TITLES FOR TOUCH DEVICES */

.touch .thumbs {
margin: 34px 22px 0 216px;
overflow: visible;
}

.touch .thumbs article {
height: auto;
margin: 0 12px 0 0;
}

.touch .thumbs h2 {
padding: 9px 0 31px 0;
font-size: 17px;
line-height: 23px;
/*-webkit-font-smoothing: subpixel-antialiased;*/
color: #333;
}

.touch .thumbs .hover {
position: relative;
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
width: 100%;
height: auto;
}

.touch .hovered .hover .angle,
.touch .thumbs .hover .angle {
-webkit-transform: none;
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
transform: none;
top: auto;
left: auto;
display: none;
}

.description {
margin: 50px 0;
z-index: 10;
}

.text_page .description,
.about .description,
.contact .description {
margin: 151px 0 34px 0;
}

.description,
.fixed-meta {
-webkit-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: margin-left .4s linear;
transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
}

.meta {
padding-bottom: 136px;
background: transparent url("../img/line-black.png") 0 bottom no-repeat;
z-index: 1;
/*float:right;*/
-webkit-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: margin-left .4s linear;
transition: margin-left .4s cubic-bezier(0, 0, 0.25, 1);
}

.text_page .meta,
.about .meta,
.contact .meta,
.maintenance .meta {
padding-bottom: 0;
background: transparent;
}

.text {
z-index: 1;
position: relative;
}

/*h1
{
margin-top: -4px;
}*/

.diagonal-line {
width: 370px;
height: 136px;
background: transparent url("../img/line-black.png") 0 bottom no-repeat;
margin-bottom: 34px;
}

.diagonal-mask {
width: 370px;
height: 600px;
position: absolute;
bottom: 1px;
left: 0;
background: transparent url("../img/cut-bg.png") 0 bottom no-repeat;
margin: 0 !important;
display: none;
}

.meta p {
margin-top: 13px;
color: #9e9e9e;
}

.text_page .meta p {
color: #333;
}

.meta span {
display: block;
color: #9e9e9e;
}

.images {
position: relative;
}

.description .meta,
.description .info,
.images div,
iframe {
margin-bottom: 34px;
}

.images .clear,
.description .c2,
.c4 iframe {
margin-bottom: 0;
}

.end-line {
height: 282px;
width: 100%;
background: transparent url("../img/line-grey.png") 0 bottom no-repeat;
-webkit-transition: all 0.5s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: all 0.5s cubic-bezier(0, 0, 0.25, 1);
-o-transition: all 0.5s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: all 0.5s linear;
transition: all 0.5s cubic-bezier(0, 0, 0.25, 1);
display: none;
}

body.seeds .end-line {
background-image: url("../img/line-dark-grey.png");
}

.content p,
.content blockquote,
.content ul,
.content ol {
margin-bottom: 22px;
}

.content p:last-child {
margin-bottom: 0;
}

.content ol {
margin-left: 20px;
}

.content li {
margin-bottom: 12px;
padding-left: 12px;
list-style: disc;
}

.paging ul,
.paging li {
margin: 0;
padding: 0;
display: inline;
list-style: none;
}

.paging {
margin: 0 0 34px 0;
color: #9e9e9e;
}

.paging li {
margin: 0 24px 0 0;
}

/* home slideshow */

#slider {
overflow: hidden;
}

.slider a,
.slider a:visited {
color: #333;
-moz-opacity: .5;
opacity: .5;
-webkit-font-smoothing: subpixel-antialiased;
display: inline-block;
}

.ielt9 .slider a,
.ielt9 .slider a:visited {
color: #999;
}

.slidernav {
position: absolute;
bottom: 22px;
left: 40px;
overflow: hidden;
}

.slidernav a,
.slidernav a:visited {
float: left;
padding: 10px;
display: block;
}

.no-touch .slider a:hover,
.no-touch .slider a:visited:hover,
.slider a.selectedSlide,
.slider a.selectedSlide:visited {
-moz-opacity: 1;
opacity: 1;
color: #333;
}

.latest {
margin: 34px 0 0 0 !important;
list-style: none;
position: relative;
overflow: hidden;
-webkit-transition: left .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: left .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: left .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: left .4s linear;
transition: left .4s cubic-bezier(0, 0, 0.25, 1);
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}

.latest li {
list-style: none;
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
float: left;
}

.latest .image {
width: 100%;
height: 100%;
background: #fff;
}

.latest .c2 {
position: absolute;
left: 50px;
top: 151px;
z-index: 10;
width: 320px;
}

.scaleImage img.abs {
position: absolute;
top: 0;
left: 50%;
}

.latest h3 a {
-webkit-font-smoothing: antialiased;
}

/* video */

.video {
margin-bottom: 0 !important;
}

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 0;
height: 0;
overflow: hidden;
}

.fourbythree {
padding-bottom: 75%;
}

.video iframe,
.video video {
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}

.play {
position: absolute;
padding: 25px;
width: 65px;
height: 40px;
top: 50%;
left: 50%;
margin: -45px 0 0 -58px;
z-index: 1;
cursor: pointer;
}

.play span {
background: #000 url("../img/devices.png") center -380px no-repeat;
display: block;
width: 65px;
height: 40px;
behavior: url../js/pie.htc);
border-radius: 4px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
-khtml-opacity: .8;
-moz-opacity: .8;
opacity: .8;
-webkit-box-shadow: 0 4px 2px -4px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 4px 2px -4px rgba(0, 0, 0, .4);
-ms-box-shadow: 0 4px 2px -4px rgba(0, 0, 0, .4);
-o-box-shadow: 0 4px 2px -4px rgba(0, 0, 0, .4);
box-shadow: 0 4px 2px -4px rgba(0, 0, 0, .4);
}

/* browsers & devices */

.browser:after,
.iphone:after,
.iphone:before,
.ipad:after,
.ipad:before,
.ipad_landscape:after,
.ipad_landscape:before,
.ipad_small:after,
.ipad_small:before {
content: "";
background-image: url("../img/devices.png");
background-repeat: no-repeat;
background-color: transparent;
width: 100%;
position: absolute;
left: 0;
display: block;
z-index: 1;
}

.browser {
padding-top: 24px;
background-color: #ccc;
border-radius: 5px 5px 0 0;
behavior: url(../js/pie.htc);
}

.browser:after {
top: 0;
height: 24px;
background-position: 6px -254px;
}

.c2.browser:after {
top: 0;
height: 14px;
background-position: 3px -278px;
}

.c2.browser {
padding-top: 14px;
border-radius: 3px 3px 0 0;
}

.browser img {
border-top: 1px solid #bbb;
}

.iphone {
background: #000;
border-radius: 10px;
behavior: url(../js/pie.htc);
}

.iphone:before {
top: 0;
height: 59px;
background-position: center 0;
}

.iphone:after {
bottom: 0;
height: 59px;
background-position: center -59px;
}

.iphone img {
padding: 59px 12px;
}

.bottom_left_iphone {
position: absolute;
left: 0;
bottom: 0;
}

.ipad {
background: #000;
border-radius: 23px;
behavior: url(../js/pie.htc);
}

.ipad:before {
top: 0;
height: 68px;
background-position: center -118px;
}

.ipad:after {
bottom: 0;
height: 68px;
background-position: center -186px;
}

.ipad img {
padding: 68px 58px;
}

.ipad_landscape {
background: #000;
border-radius: 24px;
behavior: url(../js/pie.htc);
}

.ipad_landscape:before {
top: 50%;
left: 36px;
width: 8px;
height: 8px;
margin-top: -4px;
background-position: -20px -157px;
}

.ipad_landscape:after {
top: 50%;
left: auto;
right: 18px;
width: 33px;
height: 33px;
margin-top: -16px;
background-position: -9px -204px;
}

.ipad_landscape img {
padding: 61px 71px;
}

.ipad_small {
background: #000;
border-radius: 16px;
behavior: url../js/pie.htc);
}

.ipad_small img /* 294x392 */ {
padding: 44px 38px;
}

.ipad_small:before {
top: 0;
height: 44px;
background-position: center -292px;
}

.ipad_small:after {
bottom: 0;
height: 44px;
background-position: center -336px;
}

input,
textarea {
background: #fff;
border: 0;
-webkit-appearance: caret;
-moz-appearance: none;
appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

input {
width: 100%;
margin: 0 0 5px 0;
padding: 10px 15px;
line-height: 18px;
}

.submit {
background: #fdec00;
color: #000;
border: 0;
cursor: pointer;
margin: 0;
line-height: 18px;
height: 40px;
text-align: left;
-webkit-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-moz-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-o-transition: all .4s cubic-bezier(0, 0, 0.25, 1);
-ms-transition: all .4s linear;
transition: all .4s cubic-bezier(0, 0, 0.25, 1);
}

.no-boxsizing .input {
width: 340px;
}

.no-touch .submit:hover,
.touch .submit:active {
background-color: #000;
color: #f2f2f2;
}

.no_transition {
-webkit-transition: none 0s linear !important;
-moz-transition: none 0s linear !important;
-o-transition: none 0s linear !important;
-ms-transition: none 0s linear !important;
transition: none 0s linear !important;
}

.hide_scroll {
overflow: hidden !important;
}

.hidden {
display: none !important;
}

.clear {
width: 100%;
overflow: hidden;
position: relative;
}

/*.clear:last-child div
{
margin-bottom: 0 !important;
}*/

.ielt8 .images .clear {
padding-bottom: 34px;
}

.vcard {
display: inline-block;
}

.float_left {
float: left;
}

.float_right {
float: right;
}

.text_right {
text-align: right;
}

.opacityON {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100) !important;
-khtml-opacity: 1 !important;
-moz-opacity: 1 !important;
opacity: 1 !important;
}

.opacityOFF {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)" !important;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0) !important;
-khtml-opacity: 0 !important;
-moz-opacity: 0 !important;
opacity: 0 !important;
}

@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {

.menu li.home a {
}

.menu .work {
background-image: url("../img/cut-bg-menu-hd.png");
background-size: 90px 100px;
}

.diagonal-mask {
background-image: transparent url("../img/cut-bg");
background-size: 350px 620px;

}

.menu li {
background-image: url("../img/menu-line-hd.png");
background-size: 82px 32px;
}

.meta,
.diagonal-line {
background-image: url("../img/line-black-hd.png");
background-size: 370px 136px;
}

.browser:after,
.iphone:after,
.iphone:before,
.ipad:after,
.ipad:before,
.ipad_landscape:after,
.ipad_landscape:before,
.ipad_small:after,
.ipad_small:before,
.play span {
background-image: url("../img/devices-hd.png");
background-size: 50px 420px;
}
}

@media only screen and (max-width: 1405px) {

.info {
padding-top: 0px !important;
}
}

@media only screen and (min-width: 1406px) {
/* 1428px */

.work .description {
position: absolute;
/*top:186px;*/
top: 41px;
left: 808px;
width: 404px;
width: 370px;
/* optimise for 1440 res */
margin: 0;
}

.work .description .c2 {
margin-bottom: 34px;
margin-right: 0;
/* optimise for 1440 res */
}

.work .images {
margin-top: 34px;
/*padding-bottom: 318px;*/
}

.work .end-line {
width: 1178px;
height: 433px;
position: absolute;
bottom: 0;
left: 0;
}

.work .meta {
position: fixed;
left: 1024px;
/*top:186px;*/
top: 41px;
}

.filter-open .meta {
margin-left: 393px;
}

.diagonal-mask {
display: block;
}

.info {
/*margin-top: -3px;*/
}

.latest img {
margin: 0 auto;
}
}

@media only screen and (min-width: 1832px) {

.work .description {
width: 808px;
position: fixed;
left: 1024px;
}

.work .description .c2 {
margin-right: 34px;
}

.work .description .meta {
/*float: right;*/
}

.work .end-line {
width: 1582px;
height: 580px;
position: absolute;
bottom: 0;
left: 0;
}

.work .meta {
position: relative;
left: auto;
top: auto;
}

.filter-open .meta {
margin-left: 0;
}

.filter-open .description {
margin-left: 393px;
}
}

@media only screen and (min-width: 1024px) {

.lightText,
.lightText a,
.lightText a:visited,
.no-touch .lightText a:hover,
.no-touch .lightText a:visited:hover,
.slider .lightText a.selectedSlide,
.slider .lightText a:visited.selectedSlide {
color: white !important;
}
}

/* iPad portrait */

@media only screen and (max-width: 1023px) {

html.fake_fixed body,
html.fake_fixed body.seeds {
background-position: -38px 0;
}

.triangle,
.triangle canvas,
.menu {
width: 144px;
}

.menu li:not(.home) {
margin: 0 31px;
}

.shadow {
left: 38px;
}

.images div,
iframe,
.paging {
margin-bottom: 30px;
}

article.content {
padding-top: 30px;
}

.c1,
.c2,
.c3,
.c4 {
margin-right: 30px;
float: left;
}

.meta {
/*float: right;*/
padding-bottom: 100px;
}

.text_page .meta,
.about .meta p,
.contact .meta p {
padding-bottom: 0;
}

.diagonal-line {
width: 267px;
height: 99px;
}

.c1 {
width: 168px;
}

.c2 {
width: 267px;
}

.c3,
.c4 {
width: 564px;
}

.content {
width: 594px;
margin: 0 0 0 174px;
}

.bottom_left_iphone {
position: relative;
}

.content img {
max-width: 564px;
height: auto;
}

.work iframe,
.work object,
.work embed,
.work video {
max-width: 564px;
}

.c2 img {
max-width: 267px;
}

.clear .iphone:nth-child(3) {
clear: both;
}

.ipad img {
padding: 68px 54px;
}

.ipad_landscape img {
max-width: 468px;
height: auto;
padding: 60px 48px;
}

.ipad_small img {
max-width: 211px;
height: auto;
padding: 32px 28px;
}

.end-line {
height: 206px;
}

.thumbs,
.touch .thumbs {
margin: 30px 18px 18px 174px;
}

.filter-open .content,
.filter-open .thumbs,
.touch .filter-open .thumbs {
margin-left: 462px;
}

.thumbs article,
.thumbs article img {
width: 276px;
height: 184px;
}

.touch .thumbs article {
height: auto;
}

.thumbs h2 {
padding: 23px 28px;
position: relative;
z-index: 1;
font-size: 17px;
line-height: 23px;
/*-webkit-font-smoothing: subpixel-antialiased;*/
}

.touch .thumbs h2 {
padding: 9px 0 31px 0;
}

/*.thumbs .hover .angle
{
top:-36px;
left: -50px;
}

/*.hovered .hover .angle
{
top:-115px;
left: -50px;
}*/

.filter {
left: 144px;
padding: 0 0 0 31px;
margin-right: 31px;
width: 257px;
margin-left: -319px;
}

.ipad_landscape:before {
left: 23px;
}

.ipad_landscape:after {
right: 8px;
}

.ipad_small:before {
height: 32px;
background-position: center -298px;
}

.ipad_small:after {
height: 32px;
background-position: center -342px;
}

.text_page .description,
.about .description,
.contact .description {
margin: 152px 0 34px 0;
}

.content .latest {
margin: 0 !important;
}

.latest .c2 {
position: relative;
top: auto;
left: auto;
width: 564px;
margin-bottom: 30px;
}

.latest .image {
background: transparent !important;
margin-bottom: 30px;
}

.slidernav {
display: none;
}
}

/* iPhone Landscape */

@media only screen and (max-width: 767px) {

html.fake_fixed body,
html.fake_fixed body.seeds {
background: transparent;
}

body {
font-size: 15px;
line-height: 21px;
}

h2,
h3,
.header {
font-size: 21px;
line-height: 27px;
}

.text_page .meta h3,
.about .meta h3,
.contact .meta h3 {
margin-bottom: 20px;
}

#find,
#filter {
display: none;
}

.triangle,
.triangle canvas {
width: 81px;
height: 83px;
}

.shadow {
display: none;
}

.menu {
width: 100%;
position: relative;
/* remove to show shadow */
/*
-webkit-box-shadow:0 0 20px #bfbfbf;
-moz-box-shadow:0 0 20px #bfbfbf;
-ms-box-shadow:0 0 20px #bfbfbf;
-o-box-shadow:0 0 20px #bfbfbf;
box-shadow:0 0 20px #bfbfbf;
*/
}

.menu ul {
width: auto;
overflow: hidden;
}

.menu li,
.menu li.home {
padding: 0;
margin: 20px 20px 20px 0 !important;
float: left;
background: transparent;
}

.menu .work {
background: transparent;
}

.menu li.find {
display: none;
}

.menu li.home {
width: 81px;
height: 83px;
margin: 0 !important;
}

.menu li a,
.menu li a:visited {
display: inline-block;
padding: 10px 0 9px !important;
}

.menu li.home a,
.menu li.home a:visited {
height: 83px;
background-size: 41px 43px;
background-position: center 20px;
padding: 0 !important;
}

body.seeds .menu li.home a,
body.seeds .menu li.home a:visited {
background-position: -46px 0;
}

.content {
width: auto;
margin: 0 20px !important;
}

article.content {
padding-top: 20px;
}

.filter-open .content {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-khtml-opacity: 1;
-moz-opacity: 1;
opacity: 1;
}

.thumbs,
.touch .thumbs {
width: auto;
margin: 20px 8px 8px 20px !important;
}

.header, header {
padding: 20px 0 20px 0;
}

header {
height: auto;
}

.c2,
.latest .c2,
.c3,
.c4 {
width: 100%;
/*float:none;*/
position: relative;
margin-right: 0;
}

.c1:not(.iphone) {
width: 144px;
display: inline-block;
margin-right: 20px;
}

.single article.content,
.text_page article.content,
.about article.content,
.contact article.content {
padding-top: 20px;
}

.content img,
.content .c2 img {
width: auto;
max-width: 100%;
height: auto;
}

.iphone img {
width: 144px;
}

.ipad img,
.ipad_landscape img {
left: 50px;
right: 50px;
}

.work iframe,
.work object,
.work embed,
.work video,
#map {
max-width: 100%;
}

.description div,
.text_page .meta,
.about .meta,
.contact .meta,
.images div,
iframe,
.paging,
.latest .c2,
.content .latest,
.latest .image {
margin-bottom: 20px;
}

.text_page .description,
.about .description,
.contact .description {
margin: 0 0 20px 0 !important;
}

.home iframe {
margin-top: 20px;
}

.description {
margin: 20px 0 !important;
}

.meta {
/*margin-top: 20px;*/
background-size: 791px 289px;
float: none;
margin-bottom: 34px;
padding-bottom: 0;
background: transparent;
}

.diagonal-line {
display: none;
}

.end-line {
background-size: 791px 289px;
}

.browser {
padding-top: 14px;
border-radius: 3px 3px 0 0;
}

.browser:after {
background-position: 3px -278px;
}

.iphone,
.ipad,
.ipad_landscape,
.ipad_small {
float: left;
/*padding: 0;
background: transparent;*/
}

.ipad,
.ipad_landscape,
.ipad_small {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.ipad,
.ipad_small {
padding: 51px 40px;
border-radius: 18px;
}

.ipad_landscape {
padding: 45px 36px;
border-radius: 18px;
}

.ipad img,
.ipad_landscape img,
.ipad_small img {
padding: 0;
}

.thumbs .hover {
color: #333;
}

.touch .thumbs h2 {
padding: 9px 0 17px 0;
}

.no-touch .thumbs h2 {
padding: 15px 17px;
}

.thumbs article,
.thumbs article img,
.touch .thumbs article,
.touch .thumbs article img {
width: 214px;
height: 143px;
}

.touch .thumbs article {
height: auto;
}

.ipad:after,
.ipad:before,
.ipad_landscape:after,
.ipad_landscape:before {
background-size: 25px 146px;
}

/*.iphone:after,
.iphone:before,*/
.ipad:after,
.ipad:before,
.ipad_landscape:after,
.ipad_landscape:before,
.ipad_small:after,
.ipad_small:before {
display: none;
}
}

/* iPhone Portrait */

@media only screen and (max-width: 479px) {

.thumbs article,
.thumbs article img,
.touch .thumbs article,
.touch .thumbs article img {
width: 280px;
height: 186.5px;
}

.thumbs article,
.touch .thumbs article {
height: auto;
}

.iphone {
margin-left: auto;
margin-right: auto;
clear: both;
float: none;
}

.ipad,
.ipad_small {
padding: 34px 27px;
border-radius: 12px;
}

.ipad_landscape {
padding: 30px 24px;
border-radius: 12px;
}
}

.selectedjob {
color: #333333 !important;
}
