/* CSS Document Resetting browser default styles All Grid Header Top menu Post block Articles filter Articles list Intro block Info block Steps block Work list Overview list Video block Home work wrap Bottom services block Work info Work img list Work quote Work pages Outdated process Process slider Process phase 1 Process phase 2 Process phase 3 Project success Contact cols About slider We are block Team list Brands list Footer Project planner Copyright Media Queries */ @font-face {font-family: 'HaasGrotesk';src: url('fonts/NHaasGroteskDSPro55Rg.eot');src: url('fonts/NHaasGroteskDSPro55Rg.eot') format('embedded-opentype'), url('fonts/NHaasGroteskDSPro55Rg.woff2') format('woff2'), url('fonts/NHaasGroteskDSPro55Rg.woff') format('woff'), url('fonts/NHaasGroteskDSPro55Rg.ttf') format('truetype'), url('fonts/NHaasGroteskDSPro55Rg.svg#HaasGrotesk') format('svg');font-weight: normal;font-style: normal;} @font-face {font-family: 'HaasGrotesk';src: url('fonts/NHaasGroteskDSPro25Th.eot');src: url('fonts/NHaasGroteskDSPro25Th.eot') format('embedded-opentype'), url('fonts/NHaasGroteskDSPro25Th.woff2') format('woff2'), url('fonts/NHaasGroteskDSPro25Th.woff') format('woff'), url('fonts/NHaasGroteskDSPro25Th.ttf') format('truetype'), url('fonts/NHaasGroteskDSPro25Th.svg#HaasGrotesk') format('svg');font-weight: 300;font-style: normal;} @font-face {font-family: 'HaasGrotesk';src: url('fonts/NHaasGroteskDSPro65Md.eot');src: url('fonts/NHaasGroteskDSPro65Md.eot') format('embedded-opentype'), url('fonts/NHaasGroteskDSPro65Md.woff2') format('woff2'), url('fonts/NHaasGroteskDSPro65Md.woff') format('woff'), url('fonts/NHaasGroteskDSPro65Md.ttf') format('truetype'), url('fonts/NHaasGroteskDSPro65Md.svg#HaasGrotesk') format('svg');font-weight: 600;font-style: normal;} @font-face {font-family: 'HaasGrotesk';src: url('fonts/NHaasGroteskDSPro75Bd.eot');src: url('fonts/NHaasGroteskDSPro75Bd.eot') format('embedded-opentype'), url('fonts/NHaasGroteskDSPro75Bd.woff2') format('woff2'), url('fonts/NHaasGroteskDSPro75Bd.woff') format('woff'), url('fonts/NHaasGroteskDSPro75Bd.ttf') format('truetype'), url('fonts/NHaasGroteskDSPro75Bd.svg#HaasGrotesk') format('svg');font-weight: 700;font-style: normal;} /* Resetting browser default styles */ html, body {min-height:100%;-webkit-text-size-adjust:100%;overflow-x:hidden;} body {font:18px/24px 'Playfair Display', sans-serif;color:#0f0f0f;background:#fff;} div, html, body, p, ul, ol, li, a, form, img, table, td, h1, h2, h3, h4, h5, h6, blockquote, header, section, footer, aside, nav, article, figure, figcaption, dt, dd, dl {margin:0;padding:0;} body {padding:160px 70px 0 70px;} header, section, footer, aside, nav, article, figure, figcaption {display: block;} table {border-collapse:collapse;} img {border:none;max-width:100%;height:auto;} iframe, object, embed {max-width:100%;} ul, li {list-style:none;} input {vertical-align:middle;} input:focus, textarea:focus {outline:none;} button, input[type="submit"] {cursor:pointer;-webkit-appearance:none;} a, a:active, a:visited {text-decoration:none;color:#5b2680;-webkit-transition:color linear .2s;transition:color linear .2s;} a:hover {text-decoration:none;color:#5b2680;} /* All */ .wrapper {width:1400px;margin:0 auto;position:relative;} .clear:after, .wrapper:after {content:'';display:block;height:0;clear:both;} *[data-cover] {background:url(../images/blank.gif) center center no-repeat;background-size:cover;} .cover {display:none;} .bx-controls {font-size:0;line-height:0;} .bx-controls .bx-pager {text-align:center;position:absolute;bottom:-37px;left:0;width:100%;z-index:999;} .bx-controls .bx-pager .bx-pager-item {display:inline-block;vertical-align:top;padding:0 6px;} .bx-controls .bx-pager .bx-pager-item .bx-pager-link, .bx-controls .bx-pager .bx-pager-item .bx-pager-link:visited {display:block;width:7px;height:7px;border-radius:50%;background:#c0c0c0;-webkit-transition:background-color linear .2s;transition:background-color linear .2s;} .bx-controls .bx-pager .bx-pager-item .bx-pager-link:hover, .bx-controls .bx-pager .bx-pager-item .active, .bx-controls .bx-pager .bx-pager-item .active:visited {background:#000;} .bx-controls .bx-prev, .bx-controls .bx-next {display:block;width:50px;height:50px;background:#27282a url(../images/icons/next.png) center center no-repeat;position:absolute;top:50%;right:-70px;margin-top:-25px;z-index:999;-webkit-transition:background-color linear .2s;transition:background-color linear .2s;} .bx-controls .bx-prev {right:auto;left:-70px;background-image:url(../images/icons/prev.png);} .bx-controls .bx-prev:hover, .bx-controls .bx-next:hover {background-color:#5b2680;} .animation_fadeup {position:relative;top:100px;-webkit-transition:top ease-in-out .5s, opacity linear .5s;transition:top ease-in-out .5s, opacity linear .5s;opacity:0;-webkit-transition-delay: .2s;transition-delay: .2s;} .animation_fadeup.in-view {top:0;opacity:1;} .animation_fadeleft {position:relative;left:-100px;-webkit-transition:left ease-in-out .5s, opacity linear .5s;transition:left ease-in-out .5s, opacity linear .5s;opacity:0;-webkit-transition-delay: .2s;transition-delay: .2s;} .animation_fadeleft.in-view {left:0;opacity:1;} .animation_faderight {position:relative;right:-100px;-webkit-transition:right ease-in-out .5s, opacity linear .5s;transition:right ease-in-out .5s, opacity linear .5s;opacity:0;-webkit-transition-delay: .2s;transition-delay: .2s;} .animation_faderight.in-view {right:0;opacity:1;} .preload {position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;z-index:9999999;-webkit-transition:top ease-in-out .5s, background ease-in-out .3s;transition:top ease-in-out .5s, background ease-in-out .3s;} .preload.hide {top:-200%;} .button, .button:visited {color:#000;padding:0 10px;min-width:250px;min-height:70px;font:600 18px/70px 'HaasGrotesk';border:2px solid #000;opacity:1;border-radius:0;background:#fff;display:inline-block;vertical-align:middle;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all linear .2s;transition:all linear .2s;} .button:hover {color:#fff;background:#000;} .button:active {opacity:0.8;} .button.button_red, .button.button_red:visited {color:#5b2680;border-color:#5b2680;} .button.button_red:hover {color:#fff;background:#5b2680;} .button.button_dark, .button.button_dark:visited {color:#fff;border-color:#fff;background:none;} .button.button_dark:hover {color:#000;background:#fff;} .button.button_gray, .button.button_gray:visited {color:#828384;border-color:#828384;background:none;} .button.button_gray:hover {color:#000;background:#fff;border-color:#fff;} .button.button_play, .button.button_play:visited {min-width:80px;min-height:80px;background:url(../images/optimized/play.png) 35px center no-repeat;border:1px solid #fff;} .button.button_play:hover {background-color:#fff;background-image:url(../images/icons/play2.png);} .button.button_pin, .button.button_pin:visited {min-width:80px;min-height:80px;background:url(../images/icons/pin.png) center center no-repeat;border:1px solid #fff;} .button.button_pin:hover {background-color:#fff;background-image:url(../images/icons/pin2.png);} .button.button_transparent, .button.button_transparent:visited {background:transparent;border-color:#fff;color:#fff;} .button.button_transparent:hover {color:#000;background:#fff;} .link_arrow, .link_arrow:visited {color:#5b2680;padding:0 60px 0 17px;min-height:44px;font:600 18px/44px 'HaasGrotesk';border:none;opacity:1;border-radius:0;background:url(../images/optimized/arrow_next.png) right center no-repeat;display:inline-block;vertical-align:middle;-webkit-transition:all linear .2s;transition:all linear .2s;} .link_arrow:hover {color:#fff;background-color:#5b2680;background-image:url(../images/optimized/arrow_next2.png);} .link_arrow:active {opacity:0.8;} .link_arrow.link_arrow_dark, .link_arrow.link_arrow_dark:visited {color:#fff;background-color:none;background-image:url(../images/optimized/arrow_next2.png);} .link_arrow.link_arrow_dark:hover {color:#fff;background-color:#5b2680;background-image:url(../images/optimized/arrow_next2.png);} .link_arrow.link_arrow_prev {padding:0 17px 0 60px;background-image:url(../images/icons/arrow_prev.png);background-position:left center;} .link_arrow.link_arrow_prev:hover {background-image:url(../images/icons/arrow_prev2.png);} .link_line, .link_line:visited {color:#000;padding:0 0 0 45px;min-height:44px;font:600 18px/44px 'HaasGrotesk';border:none;opacity:1;border-radius:0;background:none;display:inline-block;vertical-align:middle;-webkit-transition:all linear .2s;transition:all linear .2s;position:relative;} .link_line:hover {color:#000;padding-left:65px;} .link_line:before {content:'';display:block;width:20px;height:1px;background:#000;-webkit-transition:width linear .2s;transition:width linear .2s;position:absolute;top:22px;left:0;} .link_line:hover:before {width:40px;} .link_line_light, .link_line_light:visited, .link_line_light:hover {color:#fff;} .link_line_light:before {background:#fff;} h1 {font:700 100px/105px 'HaasGrotesk';padding-bottom:10px;} h2 {font:700 80px/85px 'HaasGrotesk';padding-bottom:10px;} h3 {font:700 60px/65px 'HaasGrotesk';padding-bottom:5px;} h4 {font:700 36px/36px 'HaasGrotesk';padding-bottom:50px;} h5 {font:300 36px/36px 'HaasGrotesk';} h6 {font:600 18px 'HaasGrotesk';padding-bottom:20px;} p {padding-bottom:30px;} .list {margin-bottom:15px;} .list li {font:600 16px 'HaasGrotesk';padding:0 0 15px 50px;position:relative;} .list li:before {content:'';display:block;width:20px;height:1px;background:#000;position:absolute;top:9px;left:0;} .o_list {margin-bottom:15px;} .o_list li {font:600 16px 'HaasGrotesk';padding:0 0 15px 50px;position:relative;counter-increment:step-counter;} .o_list li:before {content:counter(step-counter);color:#5b2680;font:16px 'Playfair Display';position:absolute;top:-5px;left:0;} blockquote p {font:italic 48px 'Playfair Display';} blockquote p:nth-child(2) {font:15px/22px 'HaasGrotesk';padding-top:30px;} blockquote p:nth-child(2) strong {color:#5b2680;font-size:14px;text-transform:uppercase;} .small {font-size:16px;} /* Grid */ .grid_row {margin-bottom:20px;} .grid_row:after {content:'';display:block;height:0;clear:both;} .grid_row [class^="grid_"] {float:left;} .grid_row_pad {margin:0 -10px;} .grid_row_pad [class^="grid_"] {padding:0 10px 20px 10px;} .grid_row .grid_centered {clear:both;margin:0 auto 20px auto;float:none;} .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {-webkit-box-sizing:border-box;box-sizing:border-box;} .grid_1 {width:8.333%;} .grid_2 {width:16.666%;} .grid_3 {width:25%;} .grid_4 {width:33.332%;} .grid_5 {width:41.665%;} .grid_6 {width:50%;} .grid_7 {width:58.334%;} .grid_8 {width:66.667%;} .grid_9 {width:75%;} .grid_10 {width:83.334%;} .grid_11 {width:91.667%;} .grid_12 {width:100%;} .grid_offset_1 {margin-left:8.333%;} .grid_offset_2 {margin-left:16.666%;} .grid_offset_3 {margin-left:25%;} .grid_offset_4 {margin-left:33.332%;} .grid_offset_5 {margin-left:41.665%;} .grid_offset_6 {margin-left:50%;} .grid_offset_7 {margin-left:58.334%;} .grid_offset_8 {margin-left:66.667%;} .grid_offset_9 {margin-left:75%;} .grid_offset_10 {margin-left:83.334%;} .grid_offset_11 {margin-left:91.667%;} /* Header */ .header {height:125px;padding:35px 0 0 0;position:fixed;top:0;left:0;width:100%;background:#fff;z-index:9999;text-align:center;font-size:0;line-height:0;-webkit-transition:top linear .2s;transition:top linear .2s;} .header .wrapper {min-height:54px;} .header .logo {display:inline-block;position:relative;top:-15px;-webkit-transition:top linear .2s;transition:top linear .2s;} .header .logo img {width:100px;-webkit-transition:width linear .2s;transition:width linear .2s;} .header .phone, .header .phone:visited {display:inline-block;position:absolute;top:3px;right:0;font:600 12px 'HaasGrotesk';text-transform:uppercase;color:#000;letter-spacing:1px;padding:0 0 0 27px;background:url(../images/icons/phone.png) left center no-repeat;background-image:url(../images/icons/phone.svg), none;background-size:14px 14px;-webkit-transition:top linear .2s;transition:top linear .2s;} .header .phone:hover {color:#5b2680;} .header .social_icons {position:absolute;top:0;left:0;} .header .social_icons li {float:left;padding:0 30px 0 0;} .header .social_icons li a {display:block;height:16px;opacity:1;-webkit-transition:opacity linear .2s;transition:opacity linear .2s;} .header .social_icons li a:hover {opacity:0.6;} .header .social_icons li .twitter {width:17px;background:url(../images/icons/twitter.png) left center no-repeat;background-image:url(../images/icons/twitter.svg), none;background-size:17px 14px;} .header .social_icons li .facebook {width:7px;background:url(../images/icons/facebook.png) left center no-repeat;background-image:url(../images/icons/facebook.svg), none;background-size:7px 16px;} .header .social_icons li .google {width:19px;background:url(../images/icons/google.png) left center no-repeat;background-image:url(../images/icons/google.svg), none;background-size:19px 13px;} @-webkit-keyframes loader {0% {width:0;} 100% {width:100%;}} @keyframes loader {0% {width:0;} 100% {width:100%;}} .loader {width:100%;position:fixed;top:0;left:0;padding:0 70px;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:99999999999;} .loader:before {content:'';display:block;width:0px;height:3px;background:#5b2680;-webkit-animation:loader 1.3s;animation:loader 1.3s;} .mobile_menu {display:none;} /* Top menu */ .menu_trigger {width:20px;height:15px;background:url(../images/optimized/menu_trigger.png) no-repeat;top:25px;right:35px;position:absolute;cursor:pointer;display:none;} .menu_trigger.active {width:17px;height:17px;background-image:url(../images/icons/close.png);} .header nav {border-top:1px solid #ccc;padding-top:27px;} .header nav ul li {display:inline-block;vertical-align:middle;font:600 12px 'HaasGrotesk';text-transform:uppercase;padding:0 23px;letter-spacing:1px;} .header nav ul li a, .header nav ul li a:visited {color:#000;} .header nav ul li.selected a, .header nav ul li.selected a:visited, .header nav ul li a:hover {color:#5b2680;} /* scroll */ .header_small {top:-90px;} .header_small .phone {top:82px;-webkit-transition-delay: 1.2s;transition-delay: 1.2s;} .header_small .logo {top:60px;left:0;-webkit-transition-delay: 1.2s;transition-delay: 1.2s;} .header_small2 .logo {position:absolute;} .header_small .logo img {width:100px;} /* Post block */ .post_block {padding:145px 0 0 0;background:url(../images/demo/bg.jpg);position:relative;} .post_block .wrapper {max-width:1030px;} .post_block article p {font-size:20px;line-height:32px;} .post_block article > p:first-of-type:first-letter {color:#5b2680;font:700 100px 'HaasGrotesk';float:left;margin:10px 20px 0 0;} .post_block article header {text-align:center;margin:0 -105px 80px -105px;} .post_block article header p {max-width:650px;margin:0 auto;} .post_block article header .date {font:700 12px 'HaasGrotesk';text-transform:uppercase;padding-bottom:50px;margin-bottom:40px;background:url(../images/optimized/wave.png) center bottom no-repeat;letter-spacing:1px;} .post_block article header img {margin-top:55px;} .post_block article h6 {font:700 24px 'HaasGrotesk';padding-top:20px;position:relative;} .post_block article h6:before {content:'';display:block;width:43px;height:1px;background:#5b2680;position:absolute;top:35px;left:-90px;} .post_block article blockquote {border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;padding:40px 0 10px 0;margin:25px 0;} .post_block article blockquote p {font:italic 48px 'Playfair Display';} .post_block article figure {padding:25px 0;} .post_block article figure figcaption {color:#666;font-size:14px;font-style:italic;padding-top:10px;} .post_block article footer {border-top:1px solid #e1e1e1;padding:25px 0;margin:35px 0 10px 0;position:relative;} .post_block article footer img {border-radius:50%;vertical-align:middle;margin-right:25px;} .post_block article footer p {display:inline-block;vertical-align:middle;font:14px 'HaasGrotesk';color:#666;padding:0;} .post_block article footer p strong {color:#0f0f0f;font-size:16px;} .post_block article footer ul {float:right;font-size:0;line-height:0;margin-top:15px;} .post_block article footer ul li {display:inline-block;vertical-align:middle;font:14px 'HaasGrotesk';color:#666;padding-right:10px;} .post_block article footer ul li:first-child {padding-right:30px;} .post_block article footer ul li a {display:inline-block;vertical-align:middle;border:1px solid #a5a5a5;width:38px;height:38px;border-radius:50%;font-size:0;line-height:0;opacity:1;-webkit-transition:opacity linear .2s;transition:opacity linear .2s;} .post_block article footer ul li a:hover {opacity:0.6;} .post_block article footer ul li .twitter {background:url(../images/icons/twitter2.png) center center no-repeat;background-image:url(../images/icons/twitter2.svg), none;background-size:17px 14px;} .post_block article footer ul li .facebook {background:url(../images/icons/facebook2.png) center center no-repeat;background-image:url(../images/icons/facebook2.svg), none;background-size:7px 16px;} .post_block article footer ul li .google {background:url(../images/icons/google2.png) center center no-repeat;background-image:url(../images/icons/google2.svg), none;background-size:19px 13px;} .post_block .grid_row {margin:0;} .post_block .post_navigation {text-align:center;background:#242526;} .post_block .post_navigation h4 a {color:#fff;} .post_block .post_navigation p:first-of-type {color:#666;font:600 12px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;} .post_block .post_navigation figure {position:relative;height:550px;} .post_block .post_navigation figure > div {display:block;width:100%;height:100%;position:absolute;top:0;left:0;opacity:0.1;} .post_block .post_navigation figure figcaption {position:absolute;top:50%;left:0;width:100%;padding:0 15%;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-box-sizing:border-box;box-sizing:border-box;} /* Articles filter */ .articles_filter {background:#242526;} .articles_filter.fixed {position:fixed;left:0;width:100%;z-index:999;top:70px;} .articles_filter ul {margin:0 -15px;} .articles_filter ul li {float:left;text-transform:uppercase;font:700 12px 'HaasGrotesk';letter-spacing:1px;} .articles_filter ul li:last-child {float:right;} .articles_filter ul li a, .articles_filter ul li a:visited {color:#a9a9a9;display:block;padding:30px 10px;margin:0 5px;position:relative;} .articles_filter ul li a:hover {color:#fff;} .articles_filter ul li.selected a:before {content:'';display:block;width:100%;height:3px;background:#5b2680;position:absolute;bottom:0;left:0;} .articles_filter ul li:last-child a {padding-right:37px;background:url(../images/icons/arrow_more.png) right center no-repeat;} .articles_filter ul li{ position: relative;display: inline-block;} .articles_filter ul li .sub{ display: none; position: absolute; min-width: 374px; background: #242526; right: 0; z-index:999; border-top:1px solid #4d4e4f; } .articles_filter ul li:hover .sub{ display: block; } .articles_filter ul li .sub li{ float:none; display:block; padding:21px 29px; border:1px solid #4d4e4f; } .articles_filter ul li .sub li a{ margin:0; padding:0; background:none; } .articles_filter ul li .sub li:hover{ background-color:#3f3f40; } /* Articles list */ .articles_list {background:url(../images/demo/bg.jpg);padding:70px 0 120px 0;} .articles_list .article_preview {padding:50px 75px;min-height:400px;background:#fff;position:relative;-webkit-transition:color linear .2s;transition:color linear .2s;} .articles_list .article_preview [data-cover] {-webkit-filter: grayscale(100%) brightness(50%);filter: grayscale(100%) brightness(50%);} .articles_list .article_preview header {margin-bottom:45px;position:relative;z-index:1;} .articles_list .article_preview header img {vertical-align:middle;width:41px;border-radius:50%;margin:0 27px 0 0;} .articles_list .article_preview header p {display:inline-block;vertical-align:middle;font:600 14px 'HaasGrotesk';padding:0;} .articles_list .article_preview header p span {font-size:12px;text-transform:uppercase;opacity:.45;} .articles_list .article_preview h4 {padding-bottom:20px;position:relative;z-index:1;} .articles_list .article_preview p {font-size:20px;line-height:28px;padding-bottom:40px;position:relative;z-index:1;} .articles_list .article_preview .link_arrow {font-size:16px;position:relative;z-index:1;} .articles_list .article_preview:hover {color:#fff;} .articles_list .article_preview > div {position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;opacity:0;-webkit-transition:opacity linear .2s;transition:opacity linear .2s;} .articles_list .article_preview:hover > div {opacity:1;} .articles_list .article_preview > div:before {content:'';background:#000;position:absolute;top:0;left:0;width:100%;height:100%;display:block;opacity:.5;} .articles_list .posts > div:nth-child(2n+1) {clear: left;} .load_more {text-align:center;padding-top:60px;} /* Intro block */ .intro_block {position:relative;min-height:570px;} .intro_block figure {max-height:1000px;position:relative;text-align:center;overflow:hidden;background:#27282a;} .intro_articles_block figure {min-height:650px;} .intro_block.transparent figure {background:transparent;} .intro_block figure > div {position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;opacity:.2;background-attachment:fixed;background-position:center top;} .intro_block figure > div.videobg {position:absolute;top:50%;left:50%;min-width:120%;min-height:120%;width:120%;height:auto;-webkit-transform: translate(-50%, -50%);transform:translate(-50%, -50%);opacity:1;z-index:-1;background-color:#27282a;} .intro_block figure > div.videobg video {position:absolute;top:0;left:0;min-width:100%;min-height:100%;width:auto;height:auto;} .intro_block figure > div.videobg .poster {position:absolute;top:0;left:0;width:100%;height:100%;} .intro_block figure figcaption {padding:5% 10px 85px 10px;color:#fff;max-width:1200px;margin:0 auto;position:relative;} .intro_block > figure > figcaption {position:absolute;top:50%;left:50%;width:100%;-webkit-transform: translate(-50%, -52%);transform:translate(-50%, -52%);-webkit-box-sizing:border-box;box-sizing:border-box;} .intro_block figure figcaption p {color:#d0cfcf;font-size:20px;padding-bottom:55px;} .intro_block figure figcaption p, .intro_block figure figcaption h1, .intro_block figure figcaption h2 {opacity:0;-webkit-transition:opacity linear .2s, top linear .3s;transition:opacity linear .2s, top linear .3s;position:relative;top:30px;} .intro_block figure figcaption h1 + p, .intro_block figure figcaption h2 + p {max-width:670px;margin:0 auto;} .intro_block figure figcaption p.show, .intro_block figure figcaption h1.show, .intro_block figure figcaption h2.show {opacity:1;top:0;} .intro_block figure figcaption p:first-of-type {color:#fff;font:700 12px 'HaasGrotesk';text-transform:uppercase;padding-bottom:50px;margin-bottom:40px;background:url(../images/optimized/wave.png) center bottom no-repeat;letter-spacing:1px;} .intro_block figure figcaption p:first-of-type.icon-blue {background:url(../images/icons/wave_blue.png) center bottom no-repeat !important;} .intro_block li figure {padding-bottom:110px;} .intro_block li figure figcaption {padding-bottom:0;} .intro_block .bx-controls .bx-pager {bottom:130px;} .intro_block .bx-controls .bx-pager .bx-pager-item .bx-pager-link, .intro_block .bx-controls .bx-pager .bx-pager-item .bx-pager-link:visited {background:rgba(255,255,255,.2);} .intro_block .bx-controls .bx-pager .bx-pager-item .bx-pager-link:hover, .intro_block .bx-controls .bx-pager .bx-pager-item .active, .intro_block .bx-controls .bx-pager .bx-pager-item .active:visited {background:#fff;} .intro_block .bx-controls .bx-prev, .intro_block .bx-controls .bx-next {width:71px;height:71px;background-image:url(../images/icons/next3.png);right:-35px;margin-top:-35px;} .intro_block .bx-controls .bx-prev {right:auto;left:-35px;background-image:url(../images/icons/prev3.png);} @-webkit-keyframes slidedown { 0% { margin-bottom:0;} 50% { margin-bottom:-15px;} 100% { margin-bottom:0;}} @keyframes slidedown { 0% { margin-bottom:0;} 50% { margin-bottom:-15px;} 100% { margin-bottom:0;}} .intro_block .scroll_down {width:20px;height:26px;background:url(../images/optimized/arrow_down.png) center top no-repeat;cursor:pointer;position:absolute;bottom:52px;left:50%;margin-left:-10px;-webkit-animation:slidedown 1.5s infinite linear;animation:slidedown 1.5s infinite linear;z-index:100;} .intro_block .scroll_down:hover {background-image:url(../images/icons/arrow_down2.png);} .intro_block .work_nav {position:fixed;top:50%;right:50%;width:100%;height:72px;text-align:center;z-index:99;color:#b4b4b4;font:700 12px/72px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;background:#fff;-webkit-transition:background-color linear .2s;;transition:background-color linear .2s;} .intro_block .work_nav a, .intro_block .work_nav a:visited {color:#000;} .intro_block .work_nav a:before {content:'';display:block;width:100%;height:100%;position:absolute;top:0;left:0;} .intro_block .work_nav.next_work {right:auto;left:50%;-webkit-transform:rotate(90deg);transform:rotate(90deg);margin-left:-36px;} .intro_block .work_nav.prev_work {-webkit-transform:rotate(-90deg);transform:rotate(-90deg);margin-right:-36px;} .intro_block_404 figure > div {opacity:1;z-index:0 !important;} .intro_block_404 h1 {font-size:240px;line-height:240px;padding:0;} .intro_block_404 .button {margin:0 10px 10px 10px;} .intro_block_thankyou figure > div {opacity:1;} .intro_block_thankyou figure figcaption p:first-of-type {color:#f5d2d1;font:40px 'Playfair Display';text-transform:none;padding:30px 0 60px 0;max-width:1000px;margin-bottom:0 !important;background:none;} /* Info block */ .info_block {padding:210px 0 180px 0;background:url(../images/demo/bg.jpg);} .info_block .grid_row p {font-size:36px;line-height:52px;} .info_block .grid_row h4 {padding:11px 0 30px 0;position:relative;margin-bottom:30px;} .info_block .grid_row h4:before {content:'';display:block;width:53px;height:2px;background:#5b2680;position:absolute;bottom:0;left:0;-webkit-transition:width linear .2s;transition:width linear .2s;} .info_block .grid_row h4:hover:before {width:100px;} .info_block_dark {background:#212122;} .info_block_dark2 {background:#211f1f;} .info_block_dark .grid_row h4 {color:#fff;} .info_block_dark .grid_row p {color:#ccc;} .info_home_block {background:#5b2680;color:#fff;position:relative;padding-bottom:400px;} .info_home_block .grid_row h4:before {background:#fff;} .info_home_block .list {margin-top:20px;} .info_home_block .list li {font-size:18px;float:left;width:25%;padding-left:0;-webkit-box-sizing:border-box;box-sizing:border-box;} .info_home_block .list li a, .info_home_block .list li a:visited {color:#fff;} .info_home_block .list li a:before {background:#fff;} .info_home_block .list li:before {display:none;} .info_contact_block {padding:165px 0 70px 0;} .info_contact_block .grid_row .grid_row {padding-top:40px;} .info_contact_block .grid_row .grid_row p {font-size:20px;line-height:32px;} .info_contact_block .grid_row .grid_row .list li {font-size:12px;line-height:20px;text-transform:uppercase;padding-bottom:40px;letter-spacing:1px;} .info_contact_block .grid_row .grid_row .list li:before {background:#5b2680;} .info_contact_block .grid_row .grid_row .list li span {display:block;padding-bottom:5px;color:#5b2680;} /* Steps block */ .steps_block {padding:230px 0 180px 0;background-color:#1b1b1b;color:#fff;} .steps_block_top_pad {padding-top:410px;} .steps_block .grid_row p {line-height:28px;padding-bottom:25px;max-width:540px;color:#fff;opacity:.8;} .steps_block .order {font:italic 90px/90px 'Playfair Display';display:inline-block;position:relative;margin:-30px 0 0 0;} .steps_block .order div {position:absolute;top:490px;left:-190px;width:450px;white-space:nowrap;text-transform:uppercase;font:700 12px 'HaasGrotesk';-webkit-transform:rotate(-90deg);transform:rotate(-90deg);padding:0 17px 0 0;text-align:right;} .steps_block .order div:before {content:'';width:150px;height:1px;background:#fff;opacity:0.2;position:absolute;top:6px;left:100%;} .steps_block_dark, .steps_block_dark .grid_row p {color:#0f0f0f;} .steps_block_dark .order div:before {background:#0f0f0f;} /* Work list */ .work_list {background:#242526;} .work_list .grid_row {margin:0;} .work_list figure {min-height:530px;position:relative;overflow:hidden;} .work_list figure *[data-cover] {position:absolute;top:0;left:0;width:100%;height:100%;} .work_list figure.fullwidth {min-height:730px;} .work_list figure.fullheight {min-height:1060px;} .work_list figure .link {display:block;width:100%;height:100%;position:absolute;top:0;left:0;z-index:4;} .work_list figure figcaption {color:#fff;position:absolute;bottom:0;left:0;padding:0 0 75px 80px;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:3;} .work_list figure figcaption:before {content:'';display:block;width:100%;height:100%;position:absolute;bottom:-150%;left:0;background:#27282a;-webkit-transition:bottom ease-in-out .2s;transition:bottom ease-in-out .2s;z-index:1;padding-top:30px;} .work_list figure:hover figcaption:before {bottom:0;} .work_list figure.uthermic figcaption:before {background:#e15c00;} .work_list figure.njoy figcaption:before {background:#7014a5;} .work_list figure.wayfare figcaption:before {background:#ddf19c;} .work_list figure.davinci figcaption:before {background:#da3263;} .work_list figure.koolaid figcaption:before {background:#fed831;} .work_list figure.whistle-pig figcaption:before {background:#c0b49c;} .work_list figure.fighting-golf figcaption:before {background:#d61c27;} .work_list figure.duracell figcaption:before {background:#009cd2;} .work_list figure.agm figcaption:before {background:#fd4f00;} .work_list figure.titan figcaption:before {background:#e82e0a;} .work_list figure.bodyshake figcaption:before {background:#17191c;} .work_list figure.norrona figcaption:before {background:#861626;} .work_list figure.houser figcaption:before {background:#3f444e;} .work_list figure.execute figcaption:before {background:#f64eb4;} .work_list figure.phos figcaption:before {background:#99a2c7;} .work_list figure.little figcaption:before {background:#333;} .work_list figure.victory figcaption:before {background:#ffcd23;} .work_list figure.revivo figcaption:before {background:#ff6600;} .work_list figure.dee figcaption:before {background:#81279e;} .work_list figure.pwnage figcaption:before {background:#3c00b4;} .work_list figure.kevin figcaption:before {background:#0d699a;} .work_list figure.max figcaption:before {background:#322927;} .work_list figure.smashpack figcaption:before {background:#9bab37;} .work_list figure.cyclone figcaption:before {background:#ed1c24;} .work_list figure.gfuel figcaption:before {background:#f64eb4;} .work_list figure figcaption * {z-index:2;} .work_list figure figcaption .link_trigger {position:absolute;bottom:0;left:0;display:block;width:100%;height:100%;z-index:3;padding-top:30px;} .work_list figure figcaption .view_link, .work_list figure figcaption .view_link:visited {color:#fff;padding-right:60px;font:600 18px/44px 'HaasGrotesk';background:url(../images/optimized/arrow_next2.png) right center no-repeat;display:inline-block;vertical-align:middle;position:absolute;bottom:-65px;left:0;opacity:0;-webkit-transition:all ease-in-out .3s;transition:all ease-in-out .3s;} .work_list figure:hover figcaption .view_link {bottom:-50px;opacity:1;-webkit-transition-delay:.2s;transition-delay:.2s;} .work_list figure.dark figcaption {color:#2d2d2d;} .work_list figure.dark figcaption .view_link, .work_list figure.dark figcaption .view_link:visited {color:#2d2d2d;background-image:url(../images/icons/arrow_next3.png);} .work_list figure figcaption p, .work_list figure figcaption h3, .work_list figure figcaption h4 {padding:5px 0 0 0;} .work_list .view_more {padding:45px 0 75px 0;text-align:center;display:none;} .work_list figure.fullscreen {overflow:visible;z-index:999;} .work_list figure.fullscreen:before {content:'';display:block;width:100%;height:100%;position:fixed;top:0;left:0;border-left:70px solid #fff;border-right:70px solid #fff;z-index:20;-webkit-box-sizing:border-box;box-sizing:border-box;} .work_list figure.fullscreen figcaption:before, .work_list figure.fullscreen:hover figcaption:before {width:2000%;height:2000%;bottom:-1000%;left:-1000%;-webkit-transition:bottom ease-in-out 1.2s, left ease-in-out 1.2s, height ease-in-out 1.2s, width ease-in-out 1.2s;transition:bottom ease-in-out 1.2s, left ease-in-out 1.2s, height ease-in-out 1.2s, width ease-in-out 1.2s;} .work_list figure.fullscreen figcaption * {opacity:0;-webkit-transition:opacity ease-in-out .6s;transition:opacity ease-in-out .6s;-webkit-transition-delay:.3s;transition-delay:.3s;} .workbg .preload {display:none;} .workbg:before {content:'';opacity:1;display:block;width:100%;height:100%;position:absolute;top:0;left:0;z-index:999;-webkit-transition:opacity ease-in-out .6s;transition:opacity ease-in-out .6s;-webkit-transition-delay:.3s;transition-delay:.3s;} .workbg.workbghide:before {opacity:0;} .workbg:after {content:'';display:block;width:100%;height:100%;position:fixed;top:0;left:0;border-left:70px solid #fff;border-right:70px solid #fff;z-index:1000;-webkit-box-sizing:border-box;box-sizing:border-box;} .workbg.workbgzindex:before, .workbg.workbgzindex:after {z-index:-1;} .work_list.work_list2 figure {min-height:420px;} .work_list.work_list2 h3 {font-size:50px;padding-bottom:0;padding-right:35px;} .work_list.work_list2 figure.uthermic figcaption:before {background:rgba(232,62,39,.8);} .work_list.work_list2 figure.njoy figcaption:before {background:rgba(242, 8, 58, 0.8);} .work_list.work_list2 figure.wayfare figcaption:before {background:rgba(144,172,101,.8);} .work_list.work_list2 figure.davinci figcaption:before {background:rgba(218, 50, 99, .8);} .work_list.work_list2 figure.koolaid figcaption:before {background:rgba(254, 216, 49, .8);} .work_list.work_list2 figure.duracell figcaption:before {background:rgba(6,38,49,.8);} .work_list.work_list2 figure.whistle-pig figcaption:before {background:rgba(28,20,17,.8);} .work_list.work_list2 figure.fighting-golf figcaption:before {background:rgba(215,28,39,.8);} .work_list.work_list2 figure.agm figcaption:before {background:rgba(86,36,41,.8);} .work_list.work_list2 figure.titan figcaption:before {background:rgba(204,70,29,.8);} .work_list.work_list2 figure.bodyshake figcaption:before {background:rgba(4,5,9,.8);} .work_list.work_list2 figure.norrona figcaption:before {background:rgba(75,28,50,.8);} .work_list.work_list2 figure.houser figcaption:before {background:rgba(55,52,51,.8);} .work_list.work_list2 figure.execute figcaption:before {background:rgba(247, 78, 174, 0.8);} .work_list.work_list2 figure.phos figcaption:before {background:rgba(80,108,161,.8);} .work_list.work_list2 figure.little figcaption:before {background:rgba(29,29,29,.8);} .work_list.work_list2 figure.victory figcaption:before {background:rgba(255,191,26,.8);} .work_list.work_list2 figure.revivo figcaption:before {background:rgba(248,152,34,.8);} .work_list.work_list2 figure.dee figcaption:before {background:rgba(170,68,217,.8);} .work_list.work_list2 figure.pwnage figcaption:before {background:rgba(49,38,225,.8);} .work_list.work_list2 figure.kevin figcaption:before {background:rgba(18,42,66,.8);} .work_list.work_list2 figure.max figcaption:before {background:rgba(9,2,0,.8);} .work_list.work_list2 figure.smashpack figcaption:before {background:rgba(194,210,40,.8);} .work_list.work_list2 figure.cyclone figcaption:before {background:rgba(241,26,27,.8);} /* Overview list */ .overview_list {font-size:0;line-height:0;margin:130px -9px -480px -9px;white-space:nowrap;position:relative;z-index:10;} .overview_list li {width:33.33%;min-width:335px;display:inline-block;vertical-align:top;padding:0 9px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;white-space:normal;color:#0f0f0f;} .overview_list li figure {background:#fff;padding:50px 30px;min-height:485px;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;} .overview_list li figure:before {content:'01';background:#5b2680;width:51px;height:51px;text-align:center;font:700 20px/51px 'HaasGrotesk';position:absolute;top:-4px;left:20px;color:#fff;} .overview_list li:nth-child(2) figure:before {content:'02';} .overview_list li:nth-child(3) figure:before {content:'03';} .overview_list li figure figcaption h6 {padding-top:55px;font-weight:700;position:relative;} .overview_list li figure figcaption h6:before {content:'';display:block;width:24px;height:1px;background:#f16764;position:absolute;top:30px;left:50%;margin-left:-12px;} .wrapper .overview_list li figure figcaption p {font-size:16px;line-height:24px;color:#0f0f0f;} .overview_list li figure figcaption .scroll_down {width:20px;height:26px;background:url(../images/icons/arrow_down2.png) center bottom no-repeat;position:relative;cursor:pointer;margin:0 auto;-webkit-transition:padding linear .2s;transition:padding linear .2s;} .overview_list li figure figcaption .scroll_down:hover {background-image:url(../images/icons/arrow_down3.png);padding-top:5px;} .overview_list .mobile_slider {display:none;max-width:335px;margin:0 auto;} .overview_list .mobile_slider li {width:100%;min-width:1px;display:block;padding:0;} .overview_list .mobile_slider li figure {padding:50px 15px;} /* Video block */ .video_block {position:fixed;top:-200%;opacity:0;left:0;min-height:100%;height:100%;max-height:100%;width:100%;background:#000;z-index:99999;overflow:auto;padding:120px;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:opacity ease-in-out .5s;transition:opacity ease-in-out .5s;} .video_block.show {top:0;opacity:1;} .video_block .close {width:78px;height:78px;border:1px solid rgba(255,255,255,.2);background:url(../images/optimized/close4.png) center center no-repeat;cursor:pointer;position:absolute;top:119px;right:119px;z-index:99;-webkit-transition:background linear .2s;transition:background linear .2s;} .video_block .close:hover {background-color:#000;} .videoContainer {position:relative;overflow:hidden;background:#0f0f0f;color:#fff;height:100%;top:-200%;-webkit-transition:top ease-in-out .5s;transition:top ease-in-out .5s;} .show .videoContainer {top:0;-webkit-transition-delay: .5s;transition-delay: .5s;} .videoContainer video {position:absolute;top:0;left:0;min-width:100%;min-height:100%;width:auto;height:auto;max-width:100%;} .videoContainer .caption {position:absolute;bottom:25px;left:25px;color:#fff;font:700 12px 'HaasGrotesk';text-transform:uppercase;} .videoContainer .control {position:absolute;bottom:0;left:0;width:100%;z-index:5;display:none;} .videoContainer .topControl {height:6px;} .videoContainer .progress {width:100%;height:6px;position:relative;cursor:pointer;background:rgba(255,255,255,.2);} .videoContainer .progress span {height:100%;position:absolute;top:0;left:0;display:block;} .videoContainer .timeBar {z-index:10;width:0;background:#5b2680;} .videoContainer .bufferBar {z-index:5;width:0;background:rgba(255,255,255,.3);} .videoContainer .time {position:absolute;top:-35px;right:45px;color:#fff;font:700 12px 'HaasGrotesk';z-index:10;} .videoContainer .loading {display:none;} .videoContainer .btnPlay {position:absolute;top:50%;left:50%;margin:-52px 0 0 -52px;width:104px;height:104px;z-index:2;background:url(../images/optimized/play3.png) 52% center no-repeat;cursor:pointer;display:none;border:1px solid rgba(255,255,255,.4);border-radius:50%;-webkit-transition:background-color linear .4s;transition:background-color linear .4s;} .videoContainer .btnPlay:hover {background-color:#000;} .videoContainer .btnPlay.show {display:block;} .videoContainer .btnPlay.paused {display:none;} .videoContainer #init {position:absolute;top:50%;left:50%;margin:-52px 0 0 -52px;width:104px;height:104px;z-index:2;display:none;background:url(../images/icons/play3.png) 52% center no-repeat;cursor:pointer;border:1px solid rgba(255,255,255,.4);border-radius:50%;-webkit-transition:background-color linear .4s;transition:background-color linear .4s;} .videoContainer #init:hover {background-color:#000;} /* Home work wrap */ .home_work_wrap {padding:0 0 120px 0;background:url(../images/demo/bg.jpg);margin-top:-255px;} .home_work_wrap blockquote {text-align:center;max-width:1110px;margin:0 auto;} .home_work_wrap .work_list {background:none;} .home_work_wrap .work_list figure {background-color:#333;} .home_work_wrap .work_list figure figcaption {padding:0 0 40px 50px;-webkit-transition:padding ease-in-out .2s;transition:padding ease-in-out .2s;} .home_work_wrap .work_list figure:hover figcaption {padding-bottom:75px;} .home_work_wrap .work_list .grid_row [class^="grid_"]:first-of-type {margin-top:-70px;} .home_work_wrap .work_list + p {position:relative;text-align:center;padding:150px 0 100px 0;} .home_work_wrap .work_list + p:before {content:'';display:block;width:1px;height:70px;position:absolute;top:22px;left:50%;background:#000;} /* Bottom services block */ .bottom_services_block {background:#242527 url(../images/demo/bottom_services_bg.jpg) center bottom no-repeat;position:relative;overflow:hidden;padding:125px 0 190px 0;color:#fff;} .bottom_services_block h5 {text-align:center;max-width:1110px;padding:50px 50px 0 50px;margin:0 auto 110px auto;min-height:230px;background:url(../images/demo/circle.png) center center no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box;} .bottom_services_block h4 {padding-bottom:40px;} .bottom_services_block .list li:before {background:#fff;} .bottom_services_block .tabs_wrap {display:none;} .bottom_services_block .tab_select li {float:left;padding:0 25px 35px 0;} .bottom_services_block .tab_select li a, .bottom_services_block .tab_select li a:visited {display:block;float:left;padding:0 8px 20px 8px;font:700 18px 'HaasGrotesk';color:#505151;border-bottom:3px solid transparent;} .bottom_services_block .tab_select li.active a, .bottom_services_block .tab_select li.active a:visited {color:#fff;border-color:#5b2680;} .bottom_services_block .tab_select li a:hover {color:#fff;} .bottom_services_block .tab_content {clear:both;} .bottom_services_block .tab_content ul {padding:20px 0;} .bottom_services_block .tab_content ul li {float:left;width:50%;font:600 14px 'HaasGrotesk';padding:0 0 15px 0;} .bottom_services_block .tab_content ul li:nth-child(2n+1) {clear:both;} /* Work info */ .work_info {background:#111820;color:#fff;padding:145px 0 100px 0;} .work_info .grid_row h4 {padding:0 0 30px 0;position:relative;margin-bottom:30px;color:#33ccff;} .work_info .grid_row h4:before {content:'';display:block;width:53px;height:2px;background:#33ccff;position:absolute;bottom:0;left:0;-webkit-transition:width linear .2s;transition:width linear .2s;} .work_info .grid_row h4:hover:before {width:100px;} .work_info .list li:before {background:#33ccff;} .work_info p {font-size:20px;line-height:28px;} /* Work img list */ .work_img_list {font-size:0;line-height:0;} .work_img_list li img {width:100%;} .work_img_list .text-format{ background-color:#ffffff;padding: 150px 0; } .work_img_list li h1{ font-family: 'Playfair Display', sans-serif; font-size: 118px; display: block; font-weight: 300; color: #000000; text-align: center; font-style:italic; } /* Work quote */ .work_quote {background:#272727;text-align:center;color:#f0f0f0;padding:160px 0 110px 0;} .work_quote blockquote {max-width:990px;margin:0 auto;} .work_quote blockquote p:nth-child(2) strong {color:#fff;} /* Work pages */ /* victory */ .victory .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_yellow.png);} .victory .work_info .grid_row h4 {color:#ffcd23;} .victory .work_info .grid_row h4:before, .victory .work_info .list li:before {background:#ffcd23;} .victory .work_quote {background:#ffcd23 url(../images/demo/bg_victory.jpg) center top no-repeat;background-size:cover;color:#342903;} .victory .work_quote blockquote p:nth-child(2) strong {color:#000;} .victory.workbg .work_img_list, html.victory, .victory.workbg:before {background:#ffcd23;} .victory.work_nav:hover {background:#ffcd23;} /* dee */ .dee .work_quote {background:#282828 url(../images/demo/bg_dee.jpg) center top no-repeat;background-size:cover;color:#fff;} .dee.workbg .work_img_list, html.dee, .dee.workbg:before {background:#81279e;} .dee.work_nav:hover {background:#81279e;} /* max */ .max .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_green.png);} .max .work_info .grid_row h4 {color:#99cc33;} .max .work_info .grid_row h4:before, .max .work_info .list li:before {background:#99cc33;} .max .work_quote {background:#2d2525 url(../images/demo/bg_max.jpg) center top no-repeat;background-size:cover;} .max.workbg .work_img_list, html.max, .max.workbg:before {background:#322927;} .max.work_nav:hover {background:#322927;} /* njoy */ .njoy .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_white.png);} .njoy .work_info .grid_row h4 {color:#0099ff;} .njoy .work_info {background:#021b3b;} .njoy .work_info .grid_row h4:before, .njoy .work_info .list li:before {background:#0099ff;} .njoy .work_quote {background:#2d2525 url(../images/demo/bg_njoy.jpg) center top no-repeat;background-size:cover;} .njoy.workbg .work_img_list, html.njoy, .njoy.workbg:before {background:#7014a5;} .njoy.work_nav:hover {background:#7014a5;} /* phos */ .phos .work_info {background:#192932;} .phos .work_quote {background:#9e2b2c url(../images/demo/bg_phos.jpg) center top no-repeat;background-size:cover;} .phos.workbg .work_img_list, html.phos, .phos.workbg:before {background:#99a2c7;} .phos.work_nav:hover {background:#99a2c7;} /* revivo */ .revivo .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_orange.png);} .revivo .work_info .grid_row h4 {color:#ff6600;} .revivo .work_info .grid_row h4:before, .revivo .work_info .list li:before {background:#ff6600;} .revivo .work_quote {background:#ff6600;} .revivo.workbg .work_img_list, html.revivo, .revivo.workbg:before {background:#ff6600;} .revivo.work_nav:hover {background:#ff6600;} /* titan */ .titan .work_quote {background:#3b3b3a url(../images/demo/bg_titan.jpg) center top no-repeat;background-size:cover;} .titan.workbg .work_img_list, html.titan, .titan.workbg:before {background:#e82e0a;} .titan.work_nav:hover {background:#e82e0a;} /* wayfare */ .wayfare .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_white.png);} .wayfare .work_info .grid_row h4 {color:#fff;} .wayfare .work_info {background:#2476d9;} .wayfare .work_info .grid_row h4:before, .wayfare .work_info .list li:before {background:#5b98e3;} .wayfare .work_quote {background:#e4366b;} .wayfare.workbg .work_img_list, html.wayfare, .wayfare.workbg:before {background:#ddf19c;} .wayfare.work_nav:hover {background:#ddf19c;} /* whistle-pig */ .whistle-pig .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_brown.png);} .whistle-pig .work_info .grid_row h4 {color:#8d7249;} .whistle-pig .work_info {background:#363636;} .whistle-pig .work_info .grid_row h4:before, .whistle-pig .work_info .list li:before {background:#8d7249;} .whistle-pig .work_quote {background:#c0b49c;} .whistle-pig.workbg .work_img_list, html.whistle-pig, .whistle-pig.workbg:before {background:#c0b49c;} .whistle-pig.work_nav:hover {background:#c0b49c;} /* fighting-golf */ .fighting-golf .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_white.png);} .fighting-golf .work_info .grid_row h4 {color:#d61c27;} .fighting-golf .work_info {background:#111820;} .fighting-golf .work_info .grid_row h4:before, .fighting-golf .work_info .list li:before {background:#d61c27;} .fighting-golf .work_quote {background:#d61c27;} .fighting-golf.workbg .work_img_list, html.fighting-golf, .fighting-golf.workbg:before {background:#d61c27;} .fighting-golf.work_nav:hover {background:#d61c27;} /* bodyshake */ .bodyshake .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_yellow2.png);} .bodyshake .work_info .grid_row h4 {color:#fff100;} .bodyshake .work_info .grid_row h4:before, .bodyshake .work_info .list li:before {background:#fff100;} .bodyshake .work_quote {background:#662c90;} .bodyshake.workbg .work_img_list, html.bodyshake, .bodyshake.workbg:before {background:#17191c;} .bodyshake.work_nav:hover {background:#17191c;} /* execute */ .execute .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_green2.png);} .execute .work_info .grid_row h4 {color:#99ff00;} .execute .work_info .grid_row h4:before, .execute .work_info .list li:before {background:#99ff00;} .execute .work_quote {background:#99ff00;color:#000;} .execute .work_quote blockquote p:nth-child(2) strong {color:#000;} .execute.workbg .work_img_list, html.execute, .execute.workbg:before {background:#7dbb07;} .execute.work_nav:hover {background:#7dbb07;} /* agm */ .agm .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_orange2.png);} .agm .work_info .grid_row h4 {color:#fd4f00;} .agm .work_info {background:#363636;} .agm .work_info .grid_row h4:before, .agm .work_info .list li:before {background:#fd4f00;} .agm.workbg .work_img_list, html.agm, .agm.workbg:before {background:#fd4f00;} .agm.work_nav:hover {background:#fd4f00;} /* cyclone */ .cyclone .work_info .grid_row h4 {color:#ed1c24;} .cyclone .work_info {background:#363636;} .cyclone .work_info .grid_row h4:before, .cyclone .work_info .list li:before {background:#ed1c24;} .cyclone.workbg .work_img_list, html.cyclone, .cyclone.workbg:before {background:#ed1c24;} .cyclone.work_nav:hover {background:#ed1c24;} /* gfuel */ .gfuel .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_purple.png);} .gfuel .work_info .grid_row h4 {color:#f64eb4;} .gfuel .work_info {background:#1B1B1B;} .gfuel .work_info .grid_row h4:before, .gfuel .work_info .list li:before {background:#f64eb4;} .gfuel.workbg .work_img_list, html.gfuel, .gfuel.workbg:before {background:#f64eb4;} .gfuel.work_nav:hover {background:#f64eb4;} .gfuel .work_quote {background-image:url(../images/demo/work_gfuel_img16.jpg);padding: 140px 0px 90px 0px;} /* kevin */ .kevin .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_blue.png);} .kevin .work_info .grid_row h4 {color:#296c77;} .kevin .work_info {background:#363636;} .kevin .work_info .grid_row h4:before, .kevin .work_info .list li:before {background:#296c77;} .kevin.workbg .work_img_list, html.kevin, .kevin.workbg:before {background:#0d699a;} .kevin.work_nav:hover {background:#0d699a;} /* pwnage */ .pwnage .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_green.png);} .pwnage .work_info .grid_row h4 {color:#8cc63f;} .pwnage .work_info {background:#363636;} .pwnage .work_info .grid_row h4:before, .pwnage .work_info .list li:before {background:#8cc63f;} .pwnage.workbg .work_img_list, html.pwnage, .pwnage.workbg:before {background:#3c00b4;} .pwnage.work_nav:hover {background:#3c00b4;} /* smashpack */ .smashpack .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_purple.png);} .smashpack .work_info .grid_row h4 {color:#7d4974;} .smashpack .work_info {background:#363636;} .smashpack .work_info .grid_row h4:before, .smashpack .work_info .list li:before {background:#7d4974;} .smashpack.workbg .work_img_list, html.smashpack, .smashpack.workbg:before {background:#9bab37;} .smashpack.work_nav:hover {background:#9bab37;} /* uthermic */ .uthermic .intro_block figure figcaption p:first-of-type {background-image:url(../images/icons/wave_yellow.png);} .uthermic .work_info .grid_row h4 {color:#ffcd07;} .uthermic .work_info {background:#363636;} .uthermic .work_info .grid_row h4:before, .uthermic .work_info .list li:before {background:#ffcd07;} .uthermic.workbg .work_img_list, html.uthermic, .uthermic.workbg:before {background:#e15c00;} .uthermic.work_nav:hover {background:#e15c00;} /* norrona */ .norrona .work_info .grid_row h4 {color:#ed1c24;} .norrona .work_info {background:#363636;} .norrona .work_info .grid_row h4:before, .norrona .work_info .list li:before {background:#ed1c24;} .norrona.workbg .work_img_list, html.norrona, .norrona.workbg:before {background:#861626;} .norrona.work_nav:hover {background:#861626;} /* houser */ .houser .work_info .grid_row h4 {color:#ed1c24;} .houser .work_info {background:#363636;} .houser .work_info .grid_row h4:before, .houser .work_info .list li:before {background:#ed1c24;} .houser.workbg .work_img_list, html.houser, .houser.workbg:before {background:#3f444e;} .houser.work_nav:hover {background:#3f444e;} /* little */ .little.workbg .work_img_list, html.little, .little.workbg:before {background:#333;} .little.work_nav:hover {background:#333;} /* duracell */ .duracell.workbg .work_img_list, html.duracell, .duracell.workbg:before {background:#009cd2;} .duracell.work_nav:hover {background:#009cd2;} /* Outdated process */ .outdated_process {background:#211f1f;padding:0 0 120px 0;margin-top:-70px;position:relative;} .outdated_process:before {content:'';display:block;width:2px;height:112px;background:#b9b9b9;position:absolute;bottom:0;left:50%;margin:0 0 -56px -1px;z-index:100;} .outdated_process h5 {color:#fff;text-align:center;margin-bottom:115px;} .outdated_process h5 span {font-weight:600;position:relative;} .outdated_process h5 span:before {content:'';display:block;width:100%;height:5px;background:#5b2680;position:absolute;bottom:-10px;left:0;} .outdated_process ul {font-size:0;line-height:0;max-width:890px;margin:0 auto;} .outdated_process ul li {display:inline-block;vertical-align:top;width:33.33%;} .outdated_process ul li:nth-child(2) {text-align:center;} .outdated_process ul li:nth-child(3) {text-align:right;} .outdated_process ul li figure {display:inline-block;} .outdated_process ul li:first-child figure {width:180px;} .outdated_process ul li:nth-child(3) figure {width:140px;} .outdated_process ul li figure > img {margin-bottom:30px;} .outdated_process ul li figure figcaption {color:#fff;text-align:center;text-transform:uppercase;font:700 14px 'HaasGrotesk';position:relative;padding-bottom:150px;} .outdated_process ul li figure figcaption .no_yes {position:absolute;bottom:0;left:-25px;width:100%;white-space:nowrap;background:#211f1f;z-index:1;padding:0 45px 0 25px;} .outdated_process ul li figure figcaption .no_yes img {vertical-align:middle;} .outdated_process ul li figure figcaption .no_yes img:last-child {margin-left:-16px;} .outdated_process ul li figure figcaption .not_awesome {position:absolute;top:5px;right:-90px;} .outdated_process ul li:first-child .arrow {height:56px;border-bottom:2px dotted #a9a9a9;width:370px;position:absolute;top:65px;left:85px;} .outdated_process ul li:first-child .arrow:before {content:'';display:block;background:url(../images/icons/arrow_outdated_up.png) no-repeat;width:10px;height:56px;position:absolute;top:0;left:-4px;} .outdated_process ul li:first-child .arrow span {position:absolute;bottom:-10px;left:35%;color:#a7a7a7;background:#211f1f;padding:0 13px;} .outdated_process ul li:nth-child(2) .arrow {background:url(../images/icons/arrow_outdated_down.png) no-repeat;width:10px;height:37px;position:absolute;top:30px;left:50%;margin-left:-5px;} .outdated_process ul li:nth-child(3) .arrow {height:56px;border-bottom:2px dotted #a9a9a9;width:370px;position:absolute;top:65px;right:67px;} .outdated_process ul li:nth-child(3) .arrow:before {content:'';display:block;background:url(../images/icons/arrow_outdated_up.png) no-repeat;width:10px;height:56px;position:absolute;top:0;right:-4px;} /* Process slider */ .process_slider {background:#5b2680 url(../images/demo/process_slider_bg.jpg) center top no-repeat;background-size:cover;padding:0 150px;position:relative;} .process_slider li {color:#fff;text-align:center;padding:220px 0 310px 0;} .process_slider li p {font-size:30px;line-height:42px;padding:0 0 15px 0;max-width:1010px;margin:0 auto;} .process_slider li p:first-child {text-transform:uppercase;font:700 12px 'HaasGrotesk';letter-spacing:1px;} .process_slider li div {position:absolute;top:50%;left:0;margin-top:-287px;color:#e73f3c;font:700 575px/575px 'HaasGrotesk';width:100%;text-shadow:rgba(0,0,0,.15) 0 15px 64px;z-index:-1;opacity:.6;} .process_slider .bx-controls {font-size:0;line-height:0;} .process_slider .bx-controls .bx-pager {bottom:145px;} .process_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link, .process_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link:visited {background:rgba(255,255,255,.2);} .process_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link:hover, .process_slider .bx-controls .bx-pager .bx-pager-item .active, .process_slider .bx-controls .bx-pager .bx-pager-item .active:visited {background:#fff;} .process_slider .bx-controls .bx-prev, .process_slider .bx-controls .bx-next {width:24px;height:44px;background:url(../images/icons/next2.png) center top no-repeat;right:100px;margin-top:-22px;} .process_slider .bx-controls .bx-prev {right:auto;left:100px;background-image:url(../images/icons/prev2.png);} .process_slider .bx-controls .bx-prev:hover, .process_slider .bx-controls .bx-next:hover {background-color:transparent;background-position:center bottom;} .phase_number {width:51px;height:51px;background:#e53f3b;text-align:center;position:absolute;bottom:-190px;left:50%;margin:0 0 0 -25px;z-index:100;font:700 20px/51px 'HaasGrotesk';color:#fff;} .phase_number:before {content:'';display:block;width:2px;height:200px;background:#b9b9b9;position:absolute;bottom:51px;left:25px;} /* Process phase 1 */ .process_phase_1 {padding:230px 0 80px 0;position:relative;} .process_phase_1 .phase_number:before {height:740px;} .process_phase_1 header {text-align:center;max-width:650px;margin:0 auto 80px auto;} .process_phase_1 header p {font-size:48px;line-height:53px;padding-bottom:10px;} .process_phase_1 header p:first-child {text-transform:uppercase;font:700 12px 'HaasGrotesk';color:#e53f3b;letter-spacing:1px;} .process_phase_1 .grid_row [class^="grid_"] > div {max-width:620px;margin:0 auto;text-align:center;} .process_phase_1 .grid_row [class^="grid_"] h6 {padding-top:90px;font:700 24px 'HaasGrotesk';background:url(../images/icons/wave2.png) center 45px no-repeat;} .process_phase_1 .grid_row [class^="grid_"] p {padding:0 35px;font-size:20px;line-height:28px;opacity:0.8;} /* Process phase 2 */ .process_phase_2 {padding:230px 0 275px 0;position:relative;background:url(../images/demo/bg2.jpg);} .process_phase_2:before {content:'';width:100%;height:100%;position:absolute;bottom:0;right:0;background:url(../images/demo/process_phase_2_bg.jpg) right bottom no-repeat;} .process_phase_2 .phase_number:before {height:270px;} .process_phase_2 header {text-align:center;max-width:760px;margin:0 auto 120px auto;} .process_phase_2 header p {font-size:48px;line-height:53px;padding-bottom:10px;} .process_phase_2 header p:first-child {text-transform:uppercase;font:700 12px 'HaasGrotesk';color:#e53f3b;letter-spacing:1px;} .process_phase_2 header + div {max-width:620px;} .process_phase_2 header + div h6 {font:700 24px 'HaasGrotesk';} .process_phase_2 header + div p {font-size:20px;line-height:28px;opacity:0.8;} /* Process phase 3 */ .process_phase_3 {padding:230px 0 185px 0;position:relative;background-color:#302e2e;} .process_phase_3:before {content:'';display:block;width:2px;height:130px;background:#b9b9b9;position:absolute;bottom:0;left:50%;margin:0 0 -65px -1px;z-index:100;} .process_phase_3 header {text-align:center;max-width:850px;margin:0 auto 180px auto;} .process_phase_3 header p {font-size:48px;line-height:53px;padding-bottom:10px;color:#fff;} .process_phase_3 header p:first-child {text-transform:uppercase;font:700 12px 'HaasGrotesk';color:#e53f3b;letter-spacing:1px;} .process_phase_3 ul {font-size:0;line-height:0;text-align:center;} .process_phase_3 ul li {width:37.5%;display:inline-block;vertical-align:top;position:relative;} .process_phase_3 ul li:nth-child(2) {width:25%;} .process_phase_3 ul li figure figcaption {color:#fff;} .process_phase_3 ul li figure figcaption p {font-size:20px;line-height:28px;opacity:0.6;} .process_phase_3 ul li figure figcaption h6 {padding-top:90px;font:700 24px 'HaasGrotesk';background:url(../images/icons/wave2.png) center 45px no-repeat;} .process_phase_3 ul li .circle {font:700 18px 'HaasGrotesk';color:#fff;width:217px;height:132px;padding-top:85px;border-radius:50%;border:2px solid rgba(133,132,132,.2);margin:0 auto;position:relative;} .process_phase_3 ul li .circle:before {content:'';width:235px;height:235px;border-radius:50%;border:2px solid rgba(133,132,132,.1);position:absolute;top:-11px;left:-11px;} .process_phase_3 ul li .circle:after {content:'';width:253px;height:253px;border-radius:50%;border:2px solid rgba(133,132,132,.05);position:absolute;top:-20px;left:-20px;} .process_phase_3 ul li .no_yes {position:absolute;bottom:-280px;left:0;width:100%;white-space:nowrap;z-index:1;} .process_phase_3 ul li .no_yes img {vertical-align:middle;} .process_phase_3 ul li .no_yes img:last-child {margin-left:-16px;} .process_phase_3 ul li:first-child .arrow {position:absolute;top:105px;right:0;width:115px;border-bottom:2px dotted #a9a9a9;} .process_phase_3 ul li:first-child .arrow:before {content:'';display:block;position:absolute;top:-4px;right:-4px;width:8px;height:10px;background:url(../images/icons/arrow_right_simple.png) no-repeat;} .process_phase_3 ul li:nth-child(2) .arrow {position:absolute;top:270px;left:50%;height:115px;border-left:2px dotted #a9a9a9;} .process_phase_3 ul li:nth-child(2) .arrow:before {content:'';display:block;position:absolute;bottom:-4px;left:-6px;width:10px;height:8px;background:url(../images/icons/arrow_bottom_simple.png) no-repeat;} .process_phase_3 ul li:nth-child(3) .arrow {position:absolute;top:105px;left:0;width:115px;border-bottom:2px dotted #a9a9a9;} .process_phase_3 ul li:nth-child(3) .arrow:before {content:'';display:block;position:absolute;top:-4px;left:-4px;width:8px;height:10px;background:url(../images/icons/arrow_left_simple.png) no-repeat;} /* Project success */ .project_success {background:#161616;padding:195px 0 220px 0;text-align:center;color:#fff;} .project_success p:first-child {text-transform:uppercase;font:600 12px 'HaasGrotesk';padding-bottom:30px;letter-spacing:1px;} .project_success P:last-child {font:48px 'HaasGrotesk';position:relative;min-height:55px;} .project_success P:last-child span {position:absolute;top:0;right:50%;margin-right:80px;} .project_success P:last-child span.equal {color:#5b2680;padding:0;margin-right:-12px;} .project_success P:last-child strong {font-weight:600;position:absolute;top:0;left:50%;margin-left:80px;} /* Contact cols */ .contact_cols {position:relative;text-align:center;background:#212123 url(../images/demo/contact_cols.jpg);} .contact_cols:before {content:'';display:block;width:1px;height:100%;background:#3a3b3c;position:absolute;top:0;left:50%;z-index:1;} .contact_cols [class^="grid_"] > div h4 {padding-bottom:20px;color:#fff;} .contact_cols [class^="grid_"] > div h4 a {color:#fff;} .contact_cols [class^="grid_"] > div p {color:#aaa;font-size:20px;line-height:28px;} .contact_cols [class^="grid_"] > div p:first-of-type {color:#666;font:600 12px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;} .contact_cols [class^="grid_"] > div figure {position:relative;height:620px;} .contact_cols [class^="grid_"] > div figure > div {display:block;width:100%;height:100%;position:absolute;top:0;left:0;opacity:0.1;} .contact_cols [class^="grid_"] > div figure figcaption {position:absolute;top:50%;left:0;width:100%;padding:0 15%;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-box-sizing:border-box;box-sizing:border-box;} .contact_cols [class^="grid_"] > div figure figcaption .button, .contact_cols [class^="grid_"] > div figure figcaption .button:visited {background:transparent;margin-top:20px;} .contact_cols [class^="grid_"] > div figure figcaption .button:hover {background:#5b2680;} /* About slider */ .about_slider {background:#212122 url(../images/demo/about_slider.jpg) repeat-x;padding:170px 0 390px 0;text-align:center;position:relative;} .about_slider .bx-viewport {overflow:visible !important;} .about_slider li figure {position:relative;} .about_slider li figure img {position:relative;z-index:1;margin-top:-56px;} .about_slider li figure:before {content:'';display:block;width:446px;height:100%;background:url(../images/demo/about_slider_grid.png) center top no-repeat;position:absolute;top:0px;left:50%;margin-left:-223px;} .about_slider li figure:after {content:'';display:block;width:446px;height:21px;background:url(../images/demo/about_slider_grid2.png) center top no-repeat;position:absolute;top:100%;left:50%;margin-left:-223px;} .about_slider li figure figcaption {padding:60px 0 75px 0;} .about_slider li figcaption p:first-child {color:#fff;font:600 12px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;position:relative;z-index:1;} .about_slider li figcaption p:last-child {font-size:24px;line-height:30px;color:#bdbdbd;max-width:330px;margin:0 auto;position:relative;z-index:1;} .about_slider li figcaption h2 {color:#fff;font:72px/72px 'Playfair Display';padding-bottom:50px;} .about_slider li figcaption h2 strong {font-weight:700;font-family:'HaasGrotesk';position:relative;} .about_slider li figcaption h2 strong:before {content:'';display:block;width:100%;height:5px;background:#5b2680;position:absolute;bottom:-5px;left:0;} .about_slider li figcaption h2 span {display:inline-block;position:relative;} .about_slider li figcaption h2 span:before {content:'';border-bottom:1px dashed #fff;width:1000px;height:1px;position:absolute;top:43px;left:100%;margin-left:50px;} .about_slider li figcaption h2 span:after {content:'';border-bottom:1px dashed #fff;width:1000px;height:1px;position:absolute;top:43px;right:100%;margin-right:50px;} .about_slider .bx-controls .bx-pager {bottom:440px;} .about_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link, .about_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link:visited {background:rgba(255,255,255,.2);} .about_slider .bx-controls .bx-pager .bx-pager-item .bx-pager-link:hover, .about_slider .bx-controls .bx-pager .bx-pager-item .active, .about_slider .bx-controls .bx-pager .bx-pager-item .active:visited {background:#fff;} /* We are block */ .we_are_block {padding:0 0 80px 0;background:url(../images/demo/bg2.jpg);} .we_are_block blockquote {text-align:center;max-width:1110px;margin:0 auto;} .we_are_block .grid_row {margin:-240px 0 140px 0;} .we_are_block .grid_row > div > div {background:#fff;padding:80px 180px 65px 50px;} .we_are_block .grid_row > div > div p {font-size:20px;line-height:28px;max-width:350px;opacity:.8;padding-bottom:55px;} .we_are_block .grid_row > div:first-of-type > div {background:#e43e32 url(../images/demo/we_are_bg.jpg) center top no-repeat;background-size:cover;color:#fff;} .we_are_block .grid_row > div:last-of-type > div {background:#fff url(../images/demo/we_are_bg2.jpg) right bottom no-repeat;} /* Team list */ .team_list {font-size:0;line-height:0;padding:140px 0 170px 0;text-align:center;} .team_list li {display:inline-block;vertical-align:middle;width:25%;height:615px;position:relative;} .team_list li figure {overflow:hidden;position:relative;height:615px;} .team_list li figure:before {content:'';display:block;opacity:1;width:100%;height:100%;position:absolute;top:0;left:0;background:rgba(0,0,0,.5);-webkit-transition:all linear .3s;transition:all linear .3s;z-index:1;} .team_list li:hover figure:before {opacity:0;} .team_list li > div {position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transition:all linear .3s;transition:all linear .3s;} .team_list li:hover > div:before {content:'';width:100%;height:190px;position:absolute;bottom:0;left:0;background:url(../images/demo/team_bg.png) left bottom repeat-x;} .team_list li:hover > div {-webkit-transform:scale(1.08);transform:scale(1.08);z-index:2;} .team_list li figure figcaption {position:absolute;bottom:-100px;left:0;width:100%;opacity:0;-webkit-transition:all linear .3s;transition:all linear .3s;z-index:2;} .team_list li:hover figure figcaption {bottom:0;opacity:1;} .team_list li figure figcaption h4 {color:#fff;padding:0 0 10px 0;} .team_list li figure figcaption p {color:#a9a9a9;font:600 14px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;padding:0 0 20px 0;} /* Brands list */ .brands_list {text-align:center;} .brands_list p {color:#fff;font:600 12px 'HaasGrotesk';text-transform:uppercase;letter-spacing:1px;padding-bottom:20px;} .brands_list h5 {color:#f0f0f0;} .brands_list ul {font-size:0;line-height:0;margin-top:50px;} .brands_list ul li {vertical-align:top;width:25%;display:inline-block;height:100px;line-height:100px;margin-top:40px;} .brands_list ul li img {vertical-align:middle;} /* Footer */ .footer {text-align:center;top:50px;padding:120px 0 80px 0;position:relative;} .footer:before {content:'';display:block;width:60px;height:60px;background:#5b2680 url(../images/optimized/p.png) center center no-repeat;position:absolute;top:0;left:50%;margin:-30px 0 0 -30px;z-index:10;} .footer h3 {color:#343434;} .footer p {padding-bottom:40px;} .footer p + h3 {margin:-40px 0 40px 0;} /* Project planner */ .noscroll {overflow:hidden;max-height:100%;} .project_planner {position:fixed;top:-200%;left:0;min-height:100%;height:100%;width:100%;background:#fff;z-index:99999;overflow:auto;-webkit-transition:top linear .6s;transition:top linear .6s;} .project_planner.show {top:0;} .project_planner .close {width:71px;height:71px;background:#27282a url(../images/optimized/close2.png) center center no-repeat;cursor:pointer;position:absolute;top:0;right:0;z-index:99;} .project_planner header {text-align:center;padding:270px 0 150px 0;position:relative;} .project_planner header:before {content:'';display:block;width:60px;height:60px;background:#5b2680 url(../images/optimized/p.png) center center no-repeat;position:absolute;top:120px;left:50%;margin:0 0 0 -30px;} .project_planner header h2 {color:#343434;padding-bottom:15px;} .project_planner header p {font-size:24px;line-height:32px;} .project_planner .grid_row {margin-bottom:100px;} .project_planner .grid_row h4 {padding:0 0 30px 0;position:relative;margin:-5px 0 30px 0;} .project_planner .grid_row h4:before {content:'';display:block;width:53px;height:2px;background:#5b2680;position:absolute;bottom:0;left:0;} .project_planner .grid_row h4 + p {opacity:.67;padding-bottom:30px;} .planner_form { z-index: 2; position: relative; } .project_planner .planner_form p {font-size:24px;line-height:32px;position:relative;padding:0 250px 40px 0;} .project_planner .planner_form p strong {position:absolute;top:0;right:0;font:700 32px 'HaasGrotesk';} .project_planner .planner_form .input_list {margin:-15px -20px 0 -20px;} .project_planner .planner_form .input_list li {position:relative;padding:0 20px 40px 20px;width:50%;float:left;-webkit-box-sizing:border-box;box-sizing:border-box;} .project_planner .planner_form .input_list li:last-child {clear:both;float:none;width:auto;} .project_planner .planner_form .input_list li input {width:100%;height:65px;padding:0 40px 0 0;border:none;border-bottom:1px solid #aaa;-webkit-box-sizing:border-box;box-sizing:border-box;color:#0f0f0f;font:24px 'Playfair Display';} .project_planner .planner_form .input_list li label {color:#a5a5a5;position:absolute;top:16px;left:20px;font:24px 'Playfair Display';-webkit-transition:all linear .2s;transition:all linear .2s;} .project_planner .planner_form .input_list li input:focus + label, .project_planner .planner_form .input_list li input.focused + label {color:#000;font-size:14px;top:0;} .project_planner .planner_form .input_list li .error_close {display:none;width:30px;height:30px;background:#5b2680 url(../images/optimized/close3.png) center center no-repeat;position:absolute;top:20px;right:20px;border-radius:50%;cursor:pointer;} .project_planner .planner_form .input_list li.error .error_close {display:block;} .project_planner .planner_form .input_list li.error label, .project_planner .planner_form .input_list li.error input:focus + label, .project_planner .planner_form .input_list li.error input.focused + label {color:#5b2680;} .project_planner .planner_form .check_list {margin-bottom:75px;} .project_planner .planner_form .check_list li {float:left;width:25%;font:600 18px 'HaasGrotesk';} .project_planner .planner_form .check_list li input[type="checkbox"] {display:none;} .project_planner .planner_form .check_list li input[type="checkbox"] + label {cursor:pointer;padding:15px 0 15px 50px;background:url(../images/optimized/checkbox_unchecked.png) 0 center no-repeat;display:inline-block;vertical-align:middle;} .project_planner .planner_form .check_list li input[type="checkbox"] + label:hover {background-image:url(../images/icons/checkbox_hover.png);} .project_planner .planner_form .check_list li input[type="checkbox"]:checked + label, .project_planner .planner_form .check_list li input[type="checkbox"] + label.checked, .project_planner .planner_form .check_list li input[type="checkbox"] + label:active {background-image:url(../images/icons/checkbox_checked.png);color:#5b2680;} .project_planner .planner_form textarea {width:100%;height:200px;border:1px solid #ccc;border-radius:6px;padding:20px 30px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#a5a5a5;font:24px 'Playfair Display';} .project_planner .planner_form textarea:hover {color:#0f0f0f;} .project_planner .planner_form .dropzone {border:2px dashed #d4d4d4;border-radius:6px;text-align:center;padding:90px 10px 80px 10px;background:url(../images/icons/drop.png) center 50px no-repeat;position:relative;} .project_planner .planner_form .dropzone:after {content:'10mb Max File Size';position:absolute;bottom:50px;left:0;width:100%;text-align:center;color:#bababa;font:600 12px 'HaasGrotesk';} .project_planner .planner_form .dropzone .dz-image {margin:10px;} .project_planner .planner_form .dropzone .dz-success-mark, .project_planner .planner_form .dropzone .dz-error-mark {display:none;} .project_planner .planner_form .submit {margin:130px 0 0 220px;display:inline-block;text-align:center;} .project_planner .planner_form .submit .button {margin-bottom:25px;} .project_planner .planner_form .submit .button:hover {color:#000;border-color:#000;background-color:#fff;} .project_planner .planner_form .rangewrap {margin:10px 0 175px 0;} /* Copyright */ .copyright {border-top:1px solid #ccc;min-height:70px} .copyright p {float:left;padding:27px 0 0 0;color:#666;font:13px 'HaasGrotesk';} .copyright ul {position:absolute;top:0;right:0;} .copyright ul li {float:left;} .copyright ul li a {display:block;border-right:1px solid #e5e5e5;width:70px;height:70px;font-size:0;line-height:0;opacity:1;-webkit-transition:opacity linear .2s;transition:opacity linear .2s;} .copyright ul li a:hover {opacity:0.6;} .copyright ul li:first-child a {border-left:1px solid #e5e5e5;} .copyright ul li .twitter {background:url(../images/icons/twitter2.png) center center no-repeat;background-image:url(../images/icons/twitter2.svg), none;background-size:17px 14px;} .copyright ul li .facebook {background:url(../images/icons/facebook2.png) center center no-repeat;background-image:url(../images/icons/facebook2.svg), none;background-size:7px 16px;} .copyright ul li .google {background:url(../images/icons/google2.png) center center no-repeat;background-image:url(../images/icons/google2.svg), none;background-size:19px 13px;} /* Media Queries */ /* Desktop */ @media only screen and (min-width: 1750px) { /* Bottom services block */ .bottom_services_block {background-size:cover;} } @media only screen and (min-width: 1400px) { /* Intro block */ /*.intro_block figure > div.videobg video {width:100%;height:100%;}*/ } /* Desktop */ @media only screen and (min-width: 1150px) and (max-width: 1540px) { body {padding-left:30px;padding-right:30px;} .work_list figure.fullscreen:before, .workbg:after {border-left-width:30px;border-right-width:30px;} .wrapper {width:1150px;} .bx-controls .bx-next {right:-30px;} .bx-controls .bx-prev {left:-30px;} /* Header */ .loader {padding:0 30px;} .header nav ul li {padding:0 18px;} /* Intro block */ .intro_block .work_nav {height:32px;line-height:32px;} .intro_block .work_nav.next_work {margin-left:-16px;} .intro_block .work_nav.prev_work {margin-right:-16px;} /* Post block */ .post_block article h6:before {width:30px;left:-50px;} /* Process slider */ .process_slider .bx-controls .bx-next {right:70px;} .process_slider .bx-controls .bx-prev {left:70px;} /* Process phase 1 */ .process_phase_1 .grid_row [class^="grid_"] > div {max-width:500px;} /* Process phase 2 */ .process_phase_2:before {background-size:75% auto;} /* Process phase 3 */ .process_phase_3 ul li:first-child .arrow, .process_phase_3 ul li:nth-child(3) .arrow {width:100px;} /* Overview list */ .overview_list > ul {margin-left:-33%;} } @media only screen and (min-width: 960px) and (max-width: 1209px) { body {padding-left:0;padding-right:0;} .work_list figure.fullscreen:before, .workbg:after {display:none;} .wrapper {width:960px;} /* Header */ .loader {padding:0;} .header nav ul li {padding:0 13px;} /* scroll */ .header_small .phone {top:3px;} .header_small nav {padding-left:140px;} /* Post block */ .post_block .wrapper {max-width:100%;} .post_block article {padding:0 40px;} .post_block article header {margin:0 -40px 80px -40px;} /* Intro block */ .intro_block .bx-controls .bx-next {right:0;} .intro_block .bx-controls .bx-prev {left:0;} .intro_block .work_nav {display:none;} /* Info block */ .info_home_block .list li {width:50%;} /* Project planner */ .project_planner .planner_form .check_list li {width:33.33%;} /* Process slider */ .process_slider li div {font-size:475px;} .process_slider .bx-controls .bx-next {right:70px;} .process_slider .bx-controls .bx-prev {left:70px;} /* Process phase 1 */ .process_phase_1 .grid_row [class^="grid_"] > div {max-width:400px;} /* Process phase 2 */ .process_phase_2:before {background-size:75% auto;right:-15%;bottom:5%} /* Process phase 3 */ .process_phase_3 ul li:first-child .arrow {right:20px;width:50px;} .process_phase_3 ul li:nth-child(3) .arrow {left:20px;width:50px;} /* Project success */ .project_success P:last-child {font-size:38px;} /* Overview list */ .overview_list > ul {margin-left:-33%;} } /* Tablets and mobiles */ @media only screen and (max-width: 959px) { body {padding:70px 0 0 0;font-size:16px;line-height:22px;} .work_list figure.fullscreen:before, .workbg:after {display:none;} .wrapper {width:100%;padding-left:40px;padding-right:40px;-webkit-box-sizing:border-box;box-sizing:border-box;} .button, .button:visited {min-height:56px;font-size:16px;line-height:56px;} .link_arrow, .link_arrow:visited {font-size:16px;} .bx-controls .bx-next {right:-40px;} .bx-controls .bx-prev {left:-40px;} /* Header */ .header {height:auto;padding:25px 0 0 0;text-align:left;} .header .wrapper {min-height:45px;} .header .logo img {width:177px;} .loader {padding:0;} .header .phone, .header .social_icons, .header nav {display:none;} .mobile_menu {display:block;} .active_menu {overflow:hidden;max-height:100%;} .active_menu .header {height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:auto;} .active_menu .header .mobile_menu .phone, .active_menu .header .mobile_menu .phone:visited {display:block;position:static;width:170px;height:56px;font-size:14px;line-height:56px;border:2px solid #e5e5e5;padding:0 0 0 76px;background-position:35px center;margin:0 auto 85px auto;} /* Top menu */ .menu_trigger {display:block;} .active_menu .mobile_menu nav {display:block;} .header nav {border-top:none;padding:10% 0;text-align:center;} .header nav ul li {display:block;font:700 30px 'HaasGrotesk';padding:15px 0;letter-spacing:0;} /* scroll */ .header_small {top:0;} .header_small .logo {position:absolute;top:60px;left:40px;} .header_small .logo img {width:100px;} /* Post block */ .post_block .wrapper {max-width:100%;} /* Info block */ .info_home_block {padding-bottom:10px;} .info_home_block .list li {font-size:16px;width:50%;} .intro_block .bx-controls .bx-next, .intro_block .bx-controls .bx-prev {display:none;} .intro_block .work_nav {display:none;} /* Work list */ .work_list .view_more {display:block;} .work_list figure figcaption {-webkit-transition:padding ease-in-out .2s;transition:padding ease-in-out .2s;} .work_list figure:hover figcaption {padding-bottom:75px;} /* Home work wrap */ .home_work_wrap {padding:0 0 40px 0;margin-top:0;} .home_work_wrap .work_list {background:none;} .home_work_wrap .work_list figure {min-height:280px;} .home_work_wrap .work_list figure figcaption {padding:0 10px 25px 35px;} .home_work_wrap .work_list .grid_row {margin:0 -40px;} .home_work_wrap .work_list .grid_row [class^="grid_"] {padding:0;} .home_work_wrap .work_list .grid_row [class^="grid_"]:first-of-type {margin-top:0;} .home_work_wrap .work_list + p {padding:115px 0 60px 0;} /* Bottom services block */ .bottom_services_block {padding:75px 0 90px 0;} .bottom_services_block h5 {margin-bottom:55px;} .bottom_services_block h4 {padding-bottom:25px;} /* Project planner */ .project_planner .close {width:60px;height:60px;} .project_planner header {padding:225px 0 55px 0;} .project_planner header:before {top:100px;} .project_planner header h2 {font-size:44px;padding-bottom:0;} .project_planner header p {font-size:18px;line-height:26px;} .project_planner .grid_row {margin-bottom:40px;} .project_planner .planner_form p {font-size:18px;line-height:26px;padding:0 200px 40px 0;} .project_planner .planner_form p strong {font-size:30px;} .project_planner .planner_form .input_list {margin:0 -12px;} .project_planner .planner_form .input_list li {padding:0 12px 20px 12px;} .project_planner .planner_form .input_list li input {height:55px;font-size:18px;} .project_planner .planner_form .input_list li label {top:15px;left:12px;font-size:18px;} .project_planner .planner_form .input_list li input:focus + label, .project_planner .planner_form .input_list li input.focused + label {font-size:12px;} .project_planner .planner_form .input_list li .error_close {top:12px;right:12px;} .project_planner .planner_form .check_list {margin-bottom:55px;} .project_planner .planner_form .check_list li {width:33.33%;font-size:16px;} .project_planner .planner_form textarea {height:185px;font-size:20px;} .project_planner .planner_form .submit {margin:60px 0 0 0;display:block;} .project_planner .planner_form .submit .button {margin-bottom:15px;} .project_planner .planner_form .rangewrap {margin:10px 0 155px 0;} /* Outdated process */ .outdated_process h5 {margin:0 auto 75px auto;max-width:490px;} .outdated_process h5 span:before {height:3px;bottom:-3px;} .outdated_process ul li figure figcaption .not_awesome {top:15px;right:-30px;width:97px;} .outdated_process ul li:first-child .arrow {width:200px;} .outdated_process ul li:first-child .arrow span {left:20%;} .outdated_process ul li:nth-child(3) .arrow {width:200px;} /* Process slider */ .process_slider {padding:0 30px;} .process_slider li {padding:200px 0 230px 0;} .process_slider li p {font-size:26px;line-height:34px;} .process_slider li div {font-size:525px;} .process_slider .bx-controls .bx-pager {bottom:120px;} .process_slider .bx-controls .bx-prev, .process_slider .bx-controls .bx-next {display:none;} .phase_number {bottom:-110px;} .phase_number:before {height:115px;} /* Process phase 1 */ .process_phase_1 {padding:155px 0 60px 0;} .process_phase_1 .phase_number:before {height:550px;} .process_phase_1 header p {font-size:40px;} .process_phase_1 .grid_row [class^="grid_"] > div {padding:0 20px;} .process_phase_1 .grid_row [class^="grid_"] h6 {padding-top:70px;font-size:18px;background-position:center 40px;} .process_phase_1 .grid_row [class^="grid_"] p {padding:0;font-size:16px;line-height:24px;} /* Process phase 2 */ .process_phase_2 {padding:170px 0 600px 0;} .process_phase_2:before {background-size:100% auto;} .process_phase_2 .phase_number:before {height:120px;} .process_phase_2 header {margin-bottom:40px;} .process_phase_2 header p {font-size:40px;} .process_phase_2 header + div h6 {font-size:20px;} .process_phase_2 header + div p {font-size:18px;line-height:24px;} /* Process phase 3 */ .process_phase_3 {padding:150px 0 200px 0;} .process_phase_3:before {height:115px;margin-bottom:-57px;} .process_phase_3 header {margin-bottom:60px;} .process_phase_3 header p {font-size:40px;} .process_phase_3 ul li figure > img {width:160px;} .process_phase_3 ul li figure figcaption p {font-size:16px;line-height:24px;} .process_phase_3 ul li figure figcaption h6 {padding-top:70px;font-size:18px;background-position:center 40px;} /* Project success */ .project_success {padding:95px 0;} .project_success P:last-child {font-size:30px} .project_success P:last-child span {margin-right:50px;} .project_success P:last-child strong {margin-left:50px;} /* Contact cols */ .contact_cols:before {width:100%;height:1px;top:50%;left:0;} .contact_cols [class^="grid_"] {margin-bottom:0;} .contact_cols [class^="grid_"] > div p {font-size:18px;line-height:28px;} .contact_cols [class^="grid_"] > div figure {padding:65px 0;height:auto;} .contact_cols [class^="grid_"] > div figure figcaption {position:static;width:auto;padding:0 40px;-webkit-transform:translateY(0%);transform:translateY(0%);} /* About slider */ .about_slider li figcaption h2 {font-size:60px;line-height:60px;} /* We are block */ .we_are_block .grid_row {margin-bottom:80px;} .we_are_block .grid_row > div > div p {font-size:18px;line-height:24px;} .we_are_block .grid_row > div > div a {font-size:15px;} /* Team list */ .team_list {padding:70px 0 75px 0;} .team_list li {width:50%;height:380px;} .team_list li figure {height:380px;} .team_list li figure:before {display:none;} .team_list li > div:before {content:'';width:100%;height:190px;position:absolute;bottom:0;left:0;background:url(../images/demo/team_bg.png) left bottom repeat-x;} .team_list li figure figcaption {bottom:10px;opacity:1;} /* Brands list */ .brands_list ul li {width:33.33%;} } /* Tablets */ @media only screen and (min-width: 768px) and (max-width: 959px) { .work_img_list li h1{ font-size:90px; } h1 {font-size:72px;line-height:77px;} h2 {font-size:60px;line-height:65px;} h3 {font-size:44px;line-height:50px;} h4 {font-size:30px;line-height:36px;padding-bottom:30px;} h5 {font-size:30px;line-height:36px;} p {padding-bottom:20px;} blockquote p {font-size:36px;line-height:39px;} /* Grid */ .grid_tablet_clear {clear:both;} .grid_tablet_1 {width:8.333%;} .grid_tablet_2 {width:16.666%;} .grid_tablet_3 {width:25%;} .grid_tablet_4 {width:33.332%;} .grid_tablet_5 {width:41.665%;} .grid_tablet_6 {width:50%;} .grid_tablet_7 {width:58.334%;} .grid_tablet_8 {width:66.667%;} .grid_tablet_9 {width:75%;} .grid_tablet_10 {width:83.334%;} .grid_tablet_11 {width:91.667%;} .grid_tablet_12 {width:100%;} .grid_tablet_offset_0 {margin-left:0;} .grid_tablet_offset_1 {margin-left:8.333%;} .grid_tablet_offset_2 {margin-left:16.666%;} .grid_tablet_offset_3 {margin-left:25%;} .grid_tablet_offset_4 {margin-left:33.332%;} .grid_tablet_offset_5 {margin-left:41.665%;} .grid_tablet_offset_6 {margin-left:50%;} .grid_tablet_offset_7 {margin-left:58.334%;} .grid_tablet_offset_8 {margin-left:66.667%;} .grid_tablet_offset_9 {margin-left:75%;} .grid_tablet_offset_10 {margin-left:83.334%;} .grid_tablet_offset_11 {margin-left:91.667%;} /* Post block */ .post_block {padding-top:75px;} .post_block article header h2 {padding-left:40px;padding-right:40px;} .post_block article header {margin:0 -40px 60px -40px;} .post_block article p {font-size:18px;line-height:24px;} .post_block article > p:first-of-type:first-letter {font-size:87px;margin:10px 20px 0 0;} .post_block article header img {margin-top:45px;} .post_block article h6 {font-size:20px;} .post_block article h6:before {display:none;} .post_block article blockquote p {font-size:36px;line-height:39px;} .post_block .post_navigation figure {height:280px;} .post_block .post_navigation figure figcaption {padding:0 10%;} .post_block .post_navigation figure figcaption h4 {font-size:20px;line-height:26px;} .post_block .post_navigation figure figcaption h4 + p {padding-bottom:0;} /* Articles filter */ .articles_filter ul {margin:0 -10px;} .articles_filter ul li a, .articles_filter ul li a:visited {padding:30px 5px;} /* Articles list */ .load_more {padding-top:40px;} /* Intro block */ .intro_block figure figcaption {padding-top:8%;} .intro_block figure figcaption p {font-size:18px;} .intro_block figure figcaption p:first-of-type {margin-bottom:70px;} .intro_block_404 h1 {font-size:140px;line-height:140px;} .intro_block_thankyou figure figcaption p:first-of-type {font-size:35px;line-height:43px;padding:30px 0 60px 0;} /* Info block */ .info_block {padding:75px 0 100px 0;} .info_block .grid_row p {font-size:26px;line-height:36px;} .info_contact_block {padding:45px 0 40px 0;} .info_contact_block .grid_row .grid_row {padding-top:10px;} .info_contact_block .grid_row .grid_row p {font-size:18px;line-height:24px;} .info_contact_block .grid_row .grid_row .list li {float:left;width:50%;-webkit-box-sizing:border-box;box-sizing:border-box;margin-top:30px;} /* Steps block */ .steps_block {padding:55px 0 100px 0;} .steps_block_top_pad {padding-top:315px;} .steps_block.our_difference_block {padding-top:55px;padding-bottom:670px;background-position:right bottom;background-size:auto 1000px;background-color:#242527;} .steps_block.market_research_block {position:relative;overflow:hidden;padding-bottom:500px;background-position:right bottom;background-size:auto 775px;} .steps_block.market_research_block:before {content:'';display:block;width:100%;height:100%;background:url(../images/demo/bg2.jpg);position:absolute;bottom:700px;left:0;} .steps_block.architecture_block {padding-bottom:670px;background-position:right bottom;background-size:auto 775px;background-color:#1A1A1C;} .steps_block .grid_row p {line-height:26px;padding-bottom:20px;} .steps_block .order {font-size:60px;line-height:60px;margin:0 0 45px 0;display:block;} .steps_block .order div {position:absolute;top:32px;left:0;width:100%;-webkit-transform:rotate(0deg);transform:rotate(0deg);padding:0 0 0 0;text-align:right;opacity:0.8;} .steps_block .order div:before {width:67%;opacity:0.4;top:6px;left:12%;} /* Overview list */ .overview_list {margin:40px 0 -25px 0;} .strategy_difference_block .overview_list {margin-bottom:-360px;} .overview_list > ul {display:none;} .overview_list .mobile_slider {display:block;} /* Work list */ .work_list figure, .work_list figure.fullwidth, .work_list figure.fullheight {min-height:460px;} .work_list figure figcaption {padding:0 0 40px 50px;} .work_list.work_list2 figure {min-height:420px;} /* Video block */ .video_block {padding:70px;} .video_block .close {width:58px;height:58px;top:69px;right:69px;} .videoContainer {margin-bottom:70px;} .videoContainer .btnPlay, .videoContainer #init {margin:-37px 0 0 -37px;width:74px;height:74px;} /* Work info */ .work_info {padding:65px 0 30px 0;} .work_info .list {padding-top:30px;} .work_info .list li {float:left;width:50%;-webkit-box-sizing:border-box;box-sizing:border-box;} /* Work quote */ .work_quote {padding:80px 0;} /* Process phase 3 */ .process_phase_3 ul li .circle {font-size:16px;width:164px;height:109px;padding-top:55px;} .process_phase_3 ul li .circle:before {width:174px;height:174px;top:-7px;left:-7px;} .process_phase_3 ul li .circle:after {width:184px;height:184px;top:-14px;left:-14px;} .process_phase_3 ul li .no_yes {bottom:-415px;} .process_phase_3 ul li:first-child .arrow {top:85px;width:30px;right:15px;} .process_phase_3 ul li:nth-child(2) .arrow {top:200px;height:260px;} .process_phase_3 ul li:nth-child(3) .arrow {top:85px;width:30px;left:15px;} /* Footer */ .footer {padding:95px 0 30px 0;} } /* Mobile portrait and landscape modes */ @media only screen and (max-width: 767px) { body {padding:60px 0 0 0;font-size:14px;line-height:20px;} .wrapper {padding-left:30px;padding-right:30px;} .bx-controls .bx-next {right:-30px;} .bx-controls .bx-prev {left:-30px;} h1 {font-size:44px;line-height:50px;} h2 {font-size:44px;line-height:50px;} h3 {font-size:30px;line-height:35px;} h4 {font-size:30px;line-height:36px;padding-bottom:30px;} h5 {font-size:26px;line-height:32px;} p {padding-bottom:20px;} blockquote p {font-size:26px;line-height:32px;} /* Header */ .header {padding-top:20px;} .header .wrapper {min-height:40px;} .header_small .logo {left:30px;} /* Top menu */ .menu_trigger {top:22px;right:30px;} .header nav ul li {font-size:18px;padding:15px 0;} /* Grid */ .grid_mobile_clear {clear:both;} .grid_mobile_1 {width:8.333%;} .grid_mobile_2 {width:16.666%;} .grid_mobile_3 {width:25%;} .grid_mobile_4 {width:33.332%;} .grid_mobile_5 {width:41.665%;} .grid_mobile_6 {width:50%;} .grid_mobile_7 {width:58.334%;} .grid_mobile_8 {width:66.667%;} .grid_mobile_9 {width:75%;} .grid_mobile_10 {width:83.334%;} .grid_mobile_11 {width:91.667%;} .grid_mobile_12 {width:100%;} .grid_mobile_offset_0 {margin-left:0;} .grid_mobile_offset_1 {margin-left:8.333%;} .grid_mobile_offset_2 {margin-left:16.666%;} .grid_mobile_offset_3 {margin-left:25%;} .grid_mobile_offset_4 {margin-left:33.332%;} .grid_mobile_offset_5 {margin-left:41.665%;} .grid_mobile_offset_6 {margin-left:50%;} .grid_mobile_offset_7 {margin-left:58.334%;} .grid_mobile_offset_8 {margin-left:66.667%;} .grid_mobile_offset_9 {margin-left:75%;} .grid_mobile_offset_10 {margin-left:83.334%;} .grid_mobile_offset_11 {margin-left:91.667%;} /* Post block */ .post_block {padding-top:50px;} .post_block article header h2, .post_block article header p {padding-left:30px;padding-right:30px;} .post_block article header {margin:0 -30px 35px -30px;} .post_block article p {font-size:16px;line-height:22px;} .post_block article > p:first-of-type:first-letter {font-size:16px;margin:0;float:none;color:#0f0f0f;} .post_block article header img {margin-top:30px;} .post_block article header .date {padding-bottom:35px;margin-bottom:20px;} .post_block article h6 {font-size:18px;} .post_block article h6:before {display:none;} .post_block article blockquote {padding:30px 0 10px 0;margin:15px 0;} .post_block article blockquote p {font-size:26px;line-height:32px;} .post_block article figure {margin:0 -30px;padding:15px 0;} .post_block article figure figcaption {display:none;} .post_block article footer {padding:15px 0;margin-top:15px;} .post_block article footer img {width:41px;margin-right:15px;} .post_block article footer p strong {font-size:14px;} .post_block article footer ul {float:none;border-top:1px solid #e1e1e1;padding-top:20px;text-align:right;position:relative;} .post_block article footer ul li:first-child {padding-right:0;position:absolute;top:32px;left:0;} .post_block .post_navigation figure {height:375px;} .post_block .post_navigation figure figcaption {padding:0 10%;} .post_block .post_navigation figure figcaption h4 {font-size:26px;line-height:29px;} .post_block .post_navigation figure figcaption h4 + p {padding-bottom:0;} /* Articles filter */ .articles_filter.fixed {top:60px;} .articles_filter ul li {display:none;} .articles_filter ul li:last-child {float:none;display:block;} .articles_filter ul li a, .articles_filter ul li a:visited {padding:25px 10px;} /* Articles list */ .articles_list {padding:30px 0 80px 0;} .articles_list .article_preview {padding:30px;min-height:1px;} .articles_list .article_preview header {margin-bottom:25px;} .articles_list .article_preview h4 {padding-bottom:30px;} .articles_list .article_preview p {display:none;} .load_more {padding-top:30px;} /* Intro block */ .intro_block figure > div.videobg .poster {z-index:1;} .intro_block figure figcaption {padding-top:10%;} .intro_articles_block figure {min-height:700px;} .intro_articles_block figure figcaption {padding:50px 0 !important;} .intro_block figure figcaption p {font-size:18px;} .intro_block figure figcaption p:first-of-type {margin-bottom:25px;padding-bottom:35px;} .intro_block li figure {padding-bottom:160px;} .intro_block li figure figcaption {padding-top:0;} .intro_block_404 h1 {font-size:90px;line-height:90px;} .intro_block_thankyou figure figcaption p:first-of-type {font-size:25px;line-height:33px;padding:15px 0 30px 0;} /* Info block */ .info_block {padding:50px 0 75px 0;} .info_block .grid_row p {font-size:22px;line-height:29px;} .info_home_block {padding-bottom:30px;} .info_home_block .list li {width:auto;float:none;} .info_contact_block {padding:30px 0 60px 0;} .info_contact_block .grid_row .grid_row {padding-top:10px;} .info_contact_block .grid_row .grid_row p {font-size:16px;line-height:22px;} .info_contact_block .grid_row .grid_row .list li {margin-top:30px;padding-bottom:10px;} /* Steps block */ .steps_block {padding:35px 0 260px 0;} .steps_block_top_pad {padding-top:35px;} .steps_block.our_difference_block {padding-bottom:380px;background-position:right bottom;background-size:auto 500px;background-color:#242527;} .steps_block.market_research_block {position:relative;overflow:hidden;padding:240px 0 340px 0;background-position:right bottom;background-size:auto 470px;} .steps_block.market_research_block:before {content:'';display:block;width:100%;height:100%;background:url(../images/demo/bg2.jpg);position:absolute;bottom:400px;left:0;} .steps_block.architecture_block {padding-bottom:400px;background-position:right bottom;background-size:auto 450px;background-color:#1A1A1C;} .steps_block.consumer_testing_block {background-position:right bottom;background-size:auto 350px;background-color:#e03e3a;} .steps_block .grid_row p {line-height:24px;padding-bottom:20px;} .steps_block .order {font-size:48px;line-height:48px;margin:0 0 45px 0;display:block;} .steps_block .order div {position:absolute;top:27px;left:0;width:100%;-webkit-transform:rotate(0deg);transform:rotate(0deg);padding:0 0 0 0;text-align:right;opacity:0.8;} .steps_block .order div:before {width:30%;opacity:0.4;top:6px;left:25%;} /* Overview list */ .overview_list {margin:40px 0 -25px 0;} .strategy_difference_block .overview_list {margin-bottom:-450px;} .overview_list > ul {display:none;} .overview_list .mobile_slider {display:block;} /* Work list */ .work_list figure, .work_list figure.fullwidth, .work_list figure.fullheight {min-height:280px;} .work_list figure figcaption {padding:0 0 30px 30px;} .work_list.work_list2 figure {min-height:270px;} .work_list.work_list2 h3 {font-size:32px;padding-right:15px;} .work_list.work_list2 figure figcaption {padding-bottom:55px;} .work_list.work_list2 figure figcaption .view_link {font-size:12px;padding-right:33px;background-size:25px auto;} .work_list.work_list2 figure:hover figcaption .view_link {bottom:-40px;} /* Video block */ .video_block {padding:10px;} .video_block .close {width:40px;height:40px;top:9px;right:9px;background-size:12px auto;} .videoContainer {margin-bottom:10px;} .videoContainer video {width:100%;height:100%;} .videoContainer .caption {bottom:12px;left:10px;font-size:11px;} .videoContainer .time {top:-20px;right:10px;font-size:11px;} .videoContainer .btnPlay, .videoContainer #init {margin:-25px 0 0 -25px;width:50px;height:50px;} /* Home work wrap */ .home_work_wrap {padding-bottom:25px;} .home_work_wrap .work_list .grid_row {margin:0 -30px;} .home_work_wrap .work_list + p {padding:55px 0;} .home_work_wrap .work_list + p:before {display:none;} /* Bottom services block */ .bottom_services_block {padding:45px 0 50px 0;} .bottom_services_block h5 {margin-bottom:55px;} .bottom_services_block h4 {padding-bottom:25px;} .bottom_services_block .grid_row {display:none;} .bottom_services_block .tabs_wrap {display:block;} /* Work info */ .work_info {padding:45px 0 30px 0;} .work_info p {font-size:18px;line-height:24px;} /* Work quote */ .work_quote {padding:70px 0;} /* Outdated process */ .outdated_process {padding-bottom:70px;margin-top:-45px;} .outdated_process:before {height:74px;margin-bottom:-37px;} .outdated_process h5 {margin-bottom:50px;} .outdated_process h5 span:before {display:none;} .outdated_process ul {max-width:280px;} .outdated_process ul li {display:block;width:auto;text-align:center;} .outdated_process ul li:nth-child(3) {text-align:center;} .outdated_process ul li figure {padding-left:130px;} .outdated_process ul li:first-child figure, .outdated_process ul li:nth-child(3) figure {width:auto;} .outdated_process ul li figure > img {margin-bottom:20px;width:auto;height:105px;} .outdated_process ul li figure figcaption {padding-bottom:50px;} .outdated_process ul li figure figcaption .no_yes {bottom:20px;left:-180px;white-space:normal;padding:0;} .outdated_process ul li figure figcaption .no_yes img:last-child {margin:-16px 0 0 -2px;} .outdated_process ul li figure figcaption .not_awesome {width:auto;top:15px;right:-65px;} .outdated_process ul li:first-child .arrow {height:160px;border-bottom:none;border-left:2px dotted #a9a9a9;width:54px;top:-85px;left:-110px;} .outdated_process ul li:first-child .arrow:before {-webkit-transform:rotate(90deg);transform:rotate(90deg);top:-25px;left:20px;} .outdated_process ul li:first-child .arrow span {bottom:35px;left:-23px;padding:10px 0;} .outdated_process ul li:nth-child(2) .arrow {-webkit-transform:rotate(90deg);transform:rotate(90deg);top:-50px;left:-50px;z-index:1;} .outdated_process ul li:nth-child(3) .arrow {height:70px;border-bottom:none;border-left:2px dotted #a9a9a9;width:54px;top:-115px;right:auto;left:-126px;} .outdated_process ul li:nth-child(3) .arrow:before {top:42px;right:auto;left:20px;-webkit-transform:rotate(90deg);transform:rotate(90deg);} /* Process slider */ .process_slider {padding:0;} .process_slider li {padding:105px 20px 160px 20px;} .process_slider li p {font-size:16px;line-height:23px;} .process_slider li p:first-child {padding-bottom:5px;} .process_slider li div {margin:-215px 0 0 -40px;font-size:430px;line-height:430px;} .process_slider .bx-controls .bx-pager {bottom:115px;} .phase_number:before {height:70px;bottom:81px;} /* Process phase 1 */ .process_phase_1 header {margin-bottom:0;} .process_phase_1 header p {font-size:30px;line-height:36px;} .process_phase_1 .grid_row [class^="grid_"] > div {margin-top:30px;} .process_phase_1 .phase_number:before {height:70px;} /* Process phase 2 */ .process_phase_2 {padding:150px 0 450px 0;} .process_phase_2:before {background-size:140% auto;background-position:center bottom;} .process_phase_2 .phase_number:before {height:70px;} .process_phase_2 header p {font-size:30px;line-height:36px;} .process_phase_2 header + div p {font-size:16px;line-height:24px;} /* Process phase 3 */ .process_phase_3 {padding:150px 0 20px 0;background:#211f1f !important;} .process_phase_3:before {display:none;} .process_phase_3 header {margin-bottom:30px;} .process_phase_3 header p {font-size:30px;line-height:36px;} .process_phase_3 ul li {width:auto;display:block;padding-bottom:20px;} .process_phase_3 ul li:nth-child(2) {width:auto;padding:40px 0 80px 0;} .process_phase_3 ul li .no_yes {bottom:auto;top:0;left:50%;white-space:normal;} .process_phase_3 ul li .no_yes img {position:absolute;top:125px;left:-150px;vertical-align:middle;} .process_phase_3 ul li .no_yes img:last-child {top:120px;left:85px;margin-left:0;width:70px;} .process_phase_3 ul li:first-child .arrow {top:100%;right:50%;width:auto;height:85px;border-bottom:none;border-left:2px dotted #a9a9a9;} .process_phase_3 ul li:first-child .arrow:before {top:auto;bottom:-4px;width:10px;height:8px;background-image:url(../images/icons/arrow_bottom_simple.png);} .process_phase_3 ul li:nth-child(2) .arrow {display:none;} .process_phase_3 ul li:nth-child(3) .arrow {top:-120px;left:50%;width:auto;height:85px;border-bottom:none;border-left:2px dotted #a9a9a9;} .process_phase_3 ul li:nth-child(3) .arrow:before {left:-6px;width:10px;height:8px;background:url(../images/icons/arrow_top_simple.png);} /* Project success */ .project_success {padding:65px 0 90px 0;} .project_success p:first-child {color:#e53f3b;} .project_success P:last-child {font-size:30px;line-height:36px;min-height:1px;} .project_success P:last-child span {position:static;margin-right:0;display:block;} .project_success P:last-child span.equal {color:#fff;font-size:33px;margin-right:0;} .project_success P:last-child strong {position:static;margin-left:0;} /* Contact cols */ .contact_cols [class^="grid_"] > div p {font-size:16px;line-height:24px;} .contact_cols [class^="grid_"] > div figure {padding:50px 0;} .contact_cols [class^="grid_"] > div figure figcaption {padding:0 10px;} /* About slider */ .about_slider {padding:100px 0 90px 0;} .about_slider li figure img {width:85px;margin-top:-40px;} .about_slider li figure:before {width:275px;background-image:url(../images/demo/about_slider_grid3.png);margin-left:-137px;} .about_slider li figure:after {width:275px;height:11px;background-image:url(../images/demo/about_slider_grid4.png);margin-left:-137px;} .about_slider li figure figcaption {padding:30px 0 60px 0;} .about_slider li figcaption p:last-child {font-size:18px;line-height:22px;max-width:200px;} .about_slider li figcaption h2 {font-size:30px;line-height:30px;} .about_slider li figcaption h2 strong:before {height:4px;bottom:-8px;} .about_slider li figcaption h2 span:before, .about_slider li figcaption h2 span:after {display:none;} .about_slider .bx-controls .bx-pager {bottom:120px;} /* We are block */ .we_are_block {padding:0 0 30px 0;} .we_are_block .grid_row {margin:0 -40px 60px -40px;} .we_are_block .grid_row > div {padding-bottom:0;} .we_are_block .grid_row > div > div {padding:50px 40px 40px 30px;} .we_are_block .grid_row > div > div p {font-size:16px;line-height:24px;max-width:100%;padding-bottom:35px;} .we_are_block .grid_row > div:last-of-type > div {background-size:150px auto;} /* Team list */ .team_list {padding:30px 0 50px 0;} .team_list li {width:100%;max-width:375px;margin:0 auto;} /* Brands list */ .brands_list ul {;margin-top:20px;} .brands_list ul li {width:50%;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 40px;margin-top:5px;} /* Footer */ .footer {padding:75px 0 20px 0;} /* Project planner */ .project_planner .close {width:50px;height:50px;background-size:13px auto;} .project_planner header {padding:175px 0 30px 0;} .project_planner header:before {top:70px;} .project_planner header h2 {font-size:30px;line-height:38px;} .project_planner .planner_form p {padding:0 0 40px 0;} .project_planner .planner_form p strong {display:block;position:static;font-size:28px;} .project_planner .planner_form .input_list {margin:0;} .project_planner .planner_form .input_list li {padding:0 0 20px 0;float:none;width:auto;} .project_planner .planner_form .input_list li label {left:0;white-space:nowrap;} .project_planner .planner_form .input_list li .error_close {right:0;} .project_planner .planner_form .check_list {border-bottom:1px solid #ccc;padding-bottom:25px;margin-bottom:30px;} .project_planner .planner_form .check_list li {width:auto;float:none;} .project_planner .planner_form textarea {padding:12px 15px;font-size:18px;} .project_planner .planner_form .rangewrap {margin:0 0 40px 0;border-bottom:1px solid #ccc;padding-bottom:80px;} /* Copyright */ .copyright p {font-size:0;line-height:0;} .copyright p span {font-size:12px;line-height:17px;} } /* Mobile landscape mode */ @media only screen and (min-width: 480px) and (max-width: 767px) { /* Steps block */ .steps_block .order div:before {width:57%;left:13%;} .work_img_list li h1{ font-size:50px; } .work_img_list .text-format{ padding: 60px 0; } } /* Mobile portrait mode */ @media only screen and (max-width: 479px) { /* Grid */ .grid_row [class^="grid_"] {float:none;} .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {width:100%;} .work_img_list li h1{ font-size:50px; } .work_img_list .text-format{ padding: 60px 0; } .articles_filter ul li .sub{ min-width:100%; z-index:2; } } /*Modifications*/ .formError{ position: absolute; display: block; top: auto !important; bottom: 101%; left: 20px !important; margin-top: -48px !important; width: 100%; padding-right: 40px; /* background: #ccc; */ box-sizing: border-box; text-align: center; opacity: 1 !important; z-index: 999; } .formErrorContent { display: inline-block; padding: 3.25px 19.5px; background-color: #5b2680; border-radius: 3px; color: #FFF; position: relative; } .formErrorContent br { border-bottom: 1px solid rgba(255, 255, 255, 0.7); display: block; height: 1px; content: ''; } .formErrorContent:before { border: 9px solid transparent; border-top-color: #5b2680; bottom: -17px; content: ""; display: block; left: 50%; margin-left: -9px; position: absolute; z-index: 1; } .dz-error .dz-error-message{ margin: 4px; padding: 3.25px 19.5px; background-color: #5b2680; border-radius: 3px; color: #FFF; } .check_list li{ position: relative; } .project_planner .planner_form .check_list li input[type="checkbox"], .hiding-checkbox { display: block; position: absolute; z-index: -1; opacity: 0; } .pos-relative{ position: relative; } .pos-relative .formError{ bottom: 10px; } .planner_form .pos-relative{ height: 1px; } .project_planner .planner_form .submit { margin: 130px 0 220px 0; display: block; text-align: center; } .hidden{ display: none !important; } /*button animation*/ .btn-animation-container { height:50px; width:40px; display: block; margin:10px auto; position: relative; } .container::after { content:'Sending'; color:#5b2680; font-weight:700; position:absolute; bottom:-50px; left:-10px; } .box { position:relative; height:50px; width:40px; animation: box 5s infinite linear; } .border { background:#5b2680; position:absolute; } .border.one { height:4px; top:0; left:0; animation: border-one 5s infinite linear; } .border.two { top:0; right:0; height:100%; width:4px; animation: border-two 5s infinite linear; } .border.three { bottom:0; right:0; height:4px; width:100%; animation: border-three 5s infinite linear; } .border.four { bottom:0; left:0; height:100%; width:4px; animation: border-four 5s infinite linear; } .line { height:4px; background:#5b2680; position:absolute; width:0%; left:25%; } .line.one { top:25%; width:0%; animation: line-one 5s infinite linear; } .line.two { top:45%; animation: line-two 5s infinite linear; } .line.three { top:65%; animation: line-three 5s infinite linear; } @keyframes border-one { 0% {width:0;} 10% {width:100%;} 100% {width:100%;} } @keyframes border-two { 0% {height:0;} 10% {height:0%;} 20% {height:100%;} 100% {height:100%;} } @keyframes border-three { 0% {width:0;} 20% {width:0%;} 30% {width:100%;} 100% {width:100%;} } @keyframes border-four { 0% {height:0;} 30% {height:0%;} 40% {height:100%;} 100% {height:100%;} } @keyframes line-one { 0% {left:25%;width:0;} 40% {left:25%;width:0%;} 43% {left:25%;width:50%;} 52% {left:25%;width:50%;} 54% {left:25%;width:0% } 55% {right:25%;left:auto;} 63% {width:10%;right:25%;left:auto;} 100% {width:10%;right:25%;left:auto;} } @keyframes line-two { 0% {width:0;} 42% {width:0%;} 45% {width:50%;} 53% {width:50%;} 54% {width:0% } 60% {width:50%} 100% {width:50%;} } @keyframes line-three { 0% {width:0;} 45% {width:0%;} 48% {width:50%;} 51% {width:50%;} 52% {width:0% } 100% {width:0%;} } @keyframes box { 0% {opacity:1;margin-left:0px;height:50px;width:40px;} 55% {margin-left:0px;height:50px;width:40px;} 60% {margin-left:0px;height:35px;width:50px;} 74% {msthin-left:0;} 80% {margin-left:-50px;opacity:1;} 90% {height:35px;width:50px;margin-left:50px;opacity:0;} 100% {opacity:0;} } .articles_filter ul li a.hidden-mobile { display: none; } .articles_filter ul li a.visible-mobile { display: block; } .articles_filter ul li .sub li.visible-mobile { display: block; } @media screen and ( min-width: 768px ) { .articles_filter ul li a.hidden-mobile { display: block; } .articles_filter ul li a.visible-mobile { display: none; } .articles_filter ul li .sub li.visible-mobile { display: none; } }