@charset "utf-8";
html, body {
 width: 100%;
 min-height: 100%;
}
body {
 font-family: "Montserrat", Helvetica, Arial, sans-serif;
 font-size: calc(14px + 0.25vw);
 font-weight: 300;
 text-rendering: optimizeLegibility;
 min-width: 320px;
 margin: 0;
 background: #fff;
 overflow-x: hidden
}
html {
 text-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
}
h1, h2, h3, h4, h5, h6 {
 font-weight: 300
}
h1, h2, h3 {
 text-transform: uppercase
}
a {
 color: #000
}
a:hover, a:focus {
 outline: none
}
ol, ul {
 list-style: none;
 padding: 0 0 0 10px
}
b, strong {
 font-weight: 500
}
em {
 padding-right: 3px
}
img, object {
 display: block;
 width: 100%;
 height: auto;
 vertical-align: middle
}
hr {
 border-top-color: #ddd
}
sup {
 text-transform: none
}
.container {
 position: relative;
}
.clearfix {
 zoom: 1
}
.clearfix:before, .clearfix:after {
 content: "";
 display: table;
 clear: both
}
.clearfix:after {
 clear: both
}
.margin-20 {
 margin-bottom: 20px
}
.margin-30 {
 margin-bottom: 30px
}
.margin-40 {
 margin-bottom: 40px
}
.margin-50 {
 margin-bottom: 50px
}
.margin-70 {
 margin-bottom: 70px
}
.margin-80 {
 margin-bottom: 80px
}
.margin-90 {
 margin-bottom: 90px
}
.margin-100 {
 margin-bottom: 100px
}
.no-margin {
 margin: 0 !important
}
.no-left-margin {
 margin-left: 0
}
.no-right-margin {
 margin-right: 0
}
.no-top-margin {
 padding-top: 0
}
.no-bottom-margin {
 margin-bottom: 0
}
.padding-10 {
 padding-top: 10px;
 padding-bottom: 10px
}
.padding-20 {
 padding-top: 20px;
 padding-bottom: 20px
}
.padding-30 {
 padding-top: 30px;
 padding-bottom: 30px
}
.padding-40 {
 padding-top: 40px;
 padding-bottom: 40px
}
.padding-50 {
 padding-top: 50px;
 padding-bottom: 50px
}
.padding-70 {
 padding-top: 70px;
 padding-bottom: 70px
}
.padding-80 {
 padding-top: 80px;
 padding-bottom: 80px
}
.padding-90 {
 padding-top: 90px;
 padding-bottom: 90px
}
.padding-100 {
 padding-top: 100px;
 padding-bottom: 100px
}
.no-padding {
 padding: 0 !important
}
.no-left-padding {
 padding-left: 0
}
.no-right-padding {
 padding-right: 0
}
.no-top-padding {
 padding-top: 0
}
.no-bottom-padding {
 padding-bottom: 0
}
.border {
 border: 1px solid rgba(0, 0, 0, .2)
}
.no-border {
 border: none !important
}
.border-right {
 border-right: 1px solid rgba(0, 0, 0, .2)
}
.vcenter, .hcenter, .vhcenter {
 position: relative
}
.vcenter {
 top: 50%;
 -webkit-transform: translateY(-50%);
 -moz-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 -o-transform: translateY(-50%);
 transform: translateY(-50%)
}
.hcenter {
 left: 50%;
 -webkit-transform: translateX(-50%);
 -moz-transform: translateX(-50%);
 -ms-transform: translateX(-50%);
 -o-transform: translateX(-50%);
 transform: translateX(-50%)
}
.vhcenter {
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 -moz-transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 -o-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%)
}
.clear {
 clear: both
}
.flexbox {
 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex
}
.flexbox .col {
 position: relative
}
.flexbox .col:nth-child(1) {
 order: 1
}
.flexbox .col:nth-child(2) {
 order: 2
}
.flexbox .col:nth-child(3) {
 order: 3
}
.flexbox .col:nth-child(4) {
 order: 4
}
.flexbox .col:nth-child(5) {
 order: 5
}
.flexbox .col:nth-child(6) {
 order: 6
}
.flexbox .col:nth-child(7) {
 order: 7
}
.flexbox .col:nth-child(8) {
 order: 8
}
.flexbox .col:nth-child(9) {
 order: 9
}
.flexbox .col:nth-child(10) {
 order: 10
}
.flexbox .col:nth-child(11) {
 order: 11
}
.flexbox .col:nth-child(12) {
 order: 12
}
a, .anim, .md-content button.md-close, .slick-prev::before, .slick-next::before {
 -webkit-transition: all 0.25s ease-in-out;
 -moz-transition: all 0.25s ease-in-out;
 transition: all 0.25s ease-in-out
}
@-webkit-keyframes fadeIn {
 from {
  opacity: 0
 }
 to {
  opacity: 1
 }
}
@-moz-keyframes fadeIn {
 from {
  opacity: 0
 }
 to {
  opacity: 1
 }
}
@keyframes fadeIn {
 from {
  opacity: 0
 }
 to {
  opacity: 1
 }
}
.fade-in {
 opacity: 0;
 -webkit-animation: fadeIn ease-in 1;
 -moz-animation: fadeIn ease-in 1;
 animation: fadeIn ease-in 1;
 -webkit-animation-fill-mode: forwards;
 -moz-animation-fill-mode: forwards;
 animation-fill-mode: forwards;
 -webkit-animation-duration: 1s;
 -moz-animation-duration: 1s;
 animation-duration: 1s;
 -webkit-animation-delay: 1s;
 -moz-animation-delay: 1s;
 animation-delay: 1s
}
body:after {
 content: "";
 position: fixed;
 width: 100%;
 height: 100%;
 left: 0;
 bottom: 0;
 background: url(../img/layout/loader.svg) no-repeat center;
 background-size: 200px auto;
 transition: opacity 500ms linear;
 opacity: 0;
 z-index: -1
}
#header {
 position: absolute;
 left: 0;
 top: 0;
 width: 100%;
 z-index: 999
}
#header.fixed {
 position: fixed;
 background: #000;
 opacity: .95
}
#header.fixed a {
 font-weight: 300;
 padding: 15px 0;
 color: #fff
}
.navbar {
 margin-bottom: 0
}
.navbar-default {
 background-color: transparent;
 border: none
}
.navbar-default .navbar-nav > li > a {
 position: relative;
 font-variant: small-caps;
 font-weight: 500;
 text-shadow: none;
 letter-spacing: .2em;
 padding-top: 25px;
 padding-bottom: 15px
}
.navbar-default .navbar-right > li > a:focus, .navbar-default .navbar-right > li > a:hover {
 color: #ddd
}
.navbar-default .navbar-right > li > a {
 color: #ddd
}
.navbar-default .navbar-nav > li > a:before, .fixed a.active:before {
 position: absolute;
 left: 0;
 bottom: 0;
 content: "";
 width: 0;
 height: 4px;
 background-color: #ea2e2b;
 transition: all 0.5s ease-in-out
}
.navbar-default .navbar-nav > li > a:hover:before, .fixed a:hover:before, .navbar-default .navbar-nav > li > a.active:before {
 width: 100%
}
.fixed .navbar-default {
 background-color: #000
}
.fixed .navbar-default .navbar-nav > li > a {
 font-size: calc(12px + 0.25vw);
 padding-top: 15px;
 padding-bottom: 15px;
 color: #fff
}
.navbar-content .navbar-nav {
 width: 100%;
 text-align: center;
 justify-content: center;
 display: flex;
}
.navbar-content .navbar-nav .btn {
 position: relative;
 background-color: #FFF;
 border: none;
 padding: 20px 2rem 2rem 40px;
 margin: 15px;
 font-weight: 500;
 font-size: calc(9px + 0.25vw);
 color: #000;
}
.navbar-content .navbar-nav .btn:after {
 position: absolute;
 left: 0;
 top: 50%;
 content: "→";
 -webkit-transform: translateY(-50%);
 -moz-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 -o-transform: translateY(-50%);
 transform: translateY(-50%)
}
@media screen and (min-width:768px) {
 .navbar-brand-centered {
  position: absolute;
  left: 50%;
  display: block;
  width: 190px;
  height: auto;
  text-align: center
 }
 .navbar > .container .navbar-brand-centered, .navbar > .container-fluid .navbar-brand-centered {
  margin-left: 0;
  padding: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%)
 }
 #nav .navbar-brand-centered a {
  position: relative;
  display: block;
  font-variant: small-caps;
  font-weight: 500;
  text-decoration: none;
  text-shadow: none;
  letter-spacing: .2em;
  padding: 20px 15px;
  border-bottom: none;
  width: 100%;
  height: 100%
 }
 #nav .navbar-brand-centered a i {
  display: inline-block;
  font-size: 35px;
  color: #ea2e2b;
  margin-left: -4px;
  transform: rotate(180deg)
 }
 #nav .navbar-brand-centered a:hover i {
  color: #ccc
 }
 #nav .navbar-brand-centered a img {
  display: none
 }
 #nav .navbar-brand-centered a i {
  display: block
 }
}
.fixed #nav .navbar-brand-centered {
 background: #000;
 width: 120px
}
.fixed #nav .navbar-brand-centered a {
 display: block;
 width: 100%;
 height: 100%;
 padding: 0
}
.fixed #nav .navbar-brand-centered a img {
 display: block;
 margin-top: 5px
}
.fixed #nav .navbar-brand-centered a i {
 display: none
}
.navbar-default .navbar-toggle {
 border: 1px solid #000;
 border-radius: 0
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
 background-color: #fff
}
.navbar-default .navbar-toggle .icon-bar {
 background-color: #fff;
 border: 1px solid #000;
 height: 3px
}
.navbar-default .navbar-toggle:focus .icon-bar, .navbar-default .navbar-toggle:hover .icon-bar {
 background-color: #000
}
#footer {
 position: relative;
 background: #000;
 background-image: url(../img/layout/cubist-bg.jpg);
 background-repeat: no-repeat;
 background-position: center;
 background-size: cover;
 width: 100%;
 color: #fff
}
#footer:before {
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 content: "";
 background-color: rgba(0, 0, 0, .85);
 z-index: 0
}
#footer p {
 font-size: calc(9px + 0.25vw);
 margin-bottom: 0
}
#footer p.instruction {
 font-size: calc(7px + 0.25vw);
 margin-bottom: 10px
}
#footer a {
 color: #fff
}
#footer a img {
 cursor: default;
}
#footer a.link {
 text-decoration: underline;
 color: #fff
}
#footer a.link:hover {
 color: #ea2e2b
}
#footer .contact-area {
 padding-top: 50px;
 transition: opacity 500ms ease-in-out;
 opacity: 1
}
#footer.hidden .contact-area {
 opacity: 0
}
#footer .contact-area .logo {
 max-width: 150px;
}
#footer .contact-area .contacts {
 text-align: left
}
#footer .contact-area .contacts .phone p {
 font-size: calc(16px + 0.25vw);
 font-weight: 500
}
#footer .contact-area .contacts address {
 margin-top: 20px
}
#footer .contact-area .contact-form {
 text-align: left
}
#footer .contact-area .social {
 padding-top: 2rem
}
#footer .contact-area .social ul {
 padding: 0;
 margin: 0
}
#footer .contact-area .social li {
 display: inline-block
}
#footer .contact-area .social li a {
 display: block;
 padding: 0 15px
}
#footer .contact-area .social li a i {
 font-size: calc(32px + 0.25vw);
 color: #ccc
}
#footer .contact-area .social li a:hover i {
 color: #fff
}
#footer .bottom-bar {
 position: relative;
 text-align: center;
 background: #000
}
#footer .bottom-bar p {
 font-size: calc(6px + 0.25vw);
 text-transform: uppercase;
 letter-spacing: .2em;
 margin-bottom: 0
}
#footer .bottom-bar a {
 color: #ea2e2b
}
.visual-container {
 position: relative;
 overflow: hidden
}
.visual-container img {
 position: relative;
 vertical-align: top;
 width: auto;
 height: 100%;
 transform: translate3d(0, 0, 0);
 transform-style: preserve-3d;
 will-change: transform;
 opacity: 0
}
.visual-container.loaded img {
 transition: opacity 1500ms ease-in-out;
 opacity: 1
}
.visual-container img.fly {
 position: absolute;
 left: 0;
 top: 0;
 opacity: 0;
 z-index: 2
}
.visual-container .image-frame {
 position: relative;
 display: block;
 height: 100%;
 transition: left 1800ms ease-in-out, top 500ms ease-in-out;
 transform-style: preserve-3d;
 will-change: transform;
 overflow: hidden
}
.visual-container .left-section .image-frame {
 background-color: #FFF
}
.visual-container .right-section .image-frame {
 background-color: #000
}
.visual-container .title {
 transition: opacity 500ms ease-in-out;
 opacity: 1;
 display: none
}
.visual-container.active-left .left-section img.fly, .visual-container.active-right .right-section img.fly, .visual-container.hovered .hovered img.fly, .visual-container .left-section:hover img.fly, .visual-container .right-section:hover img.fly {
 opacity: 1
}
.visual-container.active-right .info-default {
 opacity: 0
}
.visual-container.active-left .info-default {
 opacity: 0
}
.visual-container .frame {
 position: relative;
 overflow: hidden
}
.visual-container .frame .left-section {
 position: relative;
 float: left;
 width: 50%;
 overflow: hidden;
 height: 100%;
 margin: 0;
 background-color: #FFF;
 transition: width 1800ms ease-in-out, height 500ms ease-in-out;
 transform-style: preserve-3d;
 will-change: transform;
}
.visual-container .frame .right-section {
 position: relative;
 float: left;
 width: 50%;
 overflow: hidden;
 height: 100%;
 margin: 0 -100px 0 0;
 background-color: #000;
 transition: width 1800ms ease-in-out, height 500ms ease-in-out;
 transform-style: preserve-3d;
 will-change: transform;
}
.visual-container .overlay {
 position: absolute;
 z-index: 4;
 left: 0;
 right: 0;
 bottom: 0;
 top: 0
}
.active-left .left-section .info-box, .active-right .right-section .info-box {
 opacity: 1
}
.active-right .info-default p, .active-left .info-default p {
 opacity: 0
}
.active-left .left-section .lining {
 right: 0;
 display: block
}
.active-right .right-section .lining {
 left: 0;
 display: block
}
.lining {
 width: 200px;
 height: 100%;
 position: absolute;
 top: 0;
 background: transparent;
 z-index: 7;
 display: none
}
.page {
 position: relative;
 width: 100%;
 overflow: hidden;
 transition: opacity 500ms ease-in-out;
 opacity: 1
}
.tab-container {
 position: relative;
 float: left
}
.content-tabset {
 width: 99999px;
 float: left
}
.mobile-content {
 position: absolute;
 width: 100%;
 left: -9999px;
 top: -9999px
}
#wrapper {
 position: relative;
 width: 100%
}
#main {
 position: relative;
 background: #fff;
 z-index: 9
}
#main:after {
 position: absolute;
 left: 50%;
 bottom: -20px;
 content: "";
 width: 20px;
 height: 20px;
 background-color: #ea2e2b;
 transform: translateX(-50%) translateY(-50%)
}
#content {
 position: relative;
 display: grid;
 width: 100%;
 min-height: 100%;
}
section {
 position: relative
}
.top-line-left:before, .top-line-right:before {
 position: absolute;
 top: 0;
 content: "";
 width: 50%;
 height: 120px;
 border-top: 1px solid #999
}
.top-line-left:before {
 border-right: 1px solid #999;
 left: 1px
}
.top-line-right:before {
 border-left: 1px solid #999;
 right: 0
}
.bottom-line-center::after {
 position: absolute;
 left: 50%;
 bottom: 0;
 content: "";
 border-left: 1px solid #999;
 margin-left: 0;
 width: 1px;
 height: 50px
}
.next.down {
 position: absolute;
 left: 50%;
 bottom: 0;
 text-transform: uppercase;
 text-decoration: none;
 color: #fff;
 height: 100px;
 width: 220px;
 transform: translateX(-50%);
 z-index: 99
}
.next.down:after, .next.down:before {
 position: absolute;
 left: 50%;
 content: "";
 width: 0;
 height: 0;
 border-style: solid;
 transform: translateX(-50%)
}
.next.down:before {
 border-width: 0 100px 100px;
 border-color: transparent transparent #222
}
.next.down:after {
 border-width: 50px 50px 0;
 border-color: #ea2e2b transparent transparent;
 top: 20px;
 -webkit-transition: all 0.25s ease-in-out;
 -moz-transition: all 0.25s ease-in-out;
 transition: all 0.25s ease-in-out
}
.next.down:hover:after {
 border-color: #111 transparent transparent
}
.next.down > span {
 display: block;
 width: 100px;
 height: 50px;
 text-align: center;
 z-index: 9
}
.next i {
 color: #fff
}
.bg-light {
 background-color: #F2F2F2
}
.bg-dark {
 background-color: #000;
 color: #fff
}
.bg-dark .heading-effect:before {
 border-right: 1px solid #fff
}
.bg-dark .heading-effect:after {
 background-color: #fff
}
.info-box {
 position: absolute;
 bottom: 15%;
 left: 50px;
 font-size: calc(12px + 0.25vw);
 color: #fff;
 padding: 20px;
 width: 100%;
 width: 480px;
 transition: opacity 250ms ease-in-out;
 opacity: 0;
 z-index: 3
}
.info-box p {
 margin: 0
}
.info-default {
 position: absolute;
 left: 0;
 top: 50%;
 text-align: center;
 width: 100%;
 margin: 0;
 transition: all 1800ms ease-in-out;
 transform-style: preserve-3d;
 will-change: transform;
 -webkit-transform: translateY(-50%);
 -moz-transform: translateY(-50%);
 -ms-transform: translateY(-50%);
 -o-transform: translateY(-50%);
 transform: translateY(-50%);
 z-index: 3
}
.info-default .logo {
 position: relative;
 display: inline-block;
 vertical-align: top;
 width: 442px;
 height: 250px;
 text-indent: -9999px;
 overflow: hidden
}
.logo-holder {
 position: relative;
 display: inline-block;
 vertical-align: top;
 overflow: hidden
}
.info-default .logo .logo-left, .info-default .logo .logo-right {
 position: absolute;
 top: 0;
 height: 250px;
 display: block;
 text-indent: -9999px;
 background-repeat: no-repeat;
 background-size: 415px 100%;
 -webkit-transition: opacity 500ms linear;
 -moz-transition: opacity 500ms linear;
 -ms-transition: opacity 500ms linear;
 -o-transition: opacity 500ms linear;
 transition: opacity 500ms linear;
 opacity: 1;
 -ms-opacity: 1;
 filter: alpha(opacity=100);
 overflow: hidden
}
.info-default .logo .logo-left {
 left: 27px;
 width: 194px
}
.info-default .logo .logo-left img {
 left: 0
}
.info-default .logo .logo-right img {
 right: 0
}
.info-default .logo .logo-right {
 right: 0;
 width: 221px
}
.info-default .logo img {
 position: absolute;
 top: 0
}
.info-default p {
 background-color: #fff;
 margin: 0 25%;
 padding: 20px;
 transition: opacity 500ms ease-in-out;
 opacity: 1
}
.left-section .info-box {
 left: auto;
 right: 50px;
 text-align: right;
 background-color: #000;
 border-right: 8px solid #ea2e2b;
 color: #fff
}
.right-section .info-box {
 right: auto;
 left: 50px;
 text-align: left;
 background-color: #fff;
 border-left: 8px solid #ea2e2b;
 color: #000
}
.fly {
 position: absolute;
 left: 0;
 top: 0
}
.services img {
 max-width: 90px;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 20px;
}
.section-header {
 position: relative;
 text-transform: uppercase;
 letter-spacing: .2em
}
.section-header h2 {
 font-size: calc(32px + 0.25vw)
}
.fade-title-left {
 position: absolute;
 top: 0;
 left: 0;
 text-transform: lowercase;
 text-shadow: none;
 font-size: 10.8em;
 font-weight: 500;
 line-height: 1;
 color: #F7F7F7;
 transform: translate(0, -50%);
 z-index: -1
}
.fade-title-left-small {
 position: absolute;
 top: 0;
 left: 0;
 text-transform: lowercase;
 text-shadow: none;
 font-size: 5.8em;
 font-weight: 500;
 line-height: 0.8;
 color: #F7F7F7;
 transform: translate(0, -50%);
 z-index: -1
}
.fade-title-center {
 position: absolute;
 top: 0;
 left: 50%;
 text-transform: lowercase;
 text-shadow: none;
 font-size: 10.8em;
 font-weight: 500;
 line-height: 1;
 color: #F7F7F7;
 transform: translateX(-50%) translateY(-50%);
 z-index: -1
}
.fade-title-center-small {
 position: absolute;
 top: 0;
 left: 50%;
 text-transform: lowercase;
 text-shadow: none;
 font-size: 5.8em;
 font-weight: 500;
 line-height: 0.8;
 color: #F7F7F7;
 transform: translateX(-50%) translateY(-50%);
 z-index: -1
}
.heading-effect {
 top: -10px;
 display: inline-block;
 height: 120px;
 width: 120px;
 margin: -120px auto 0
}
.heading-effect:before, .heading-effect:after {
 position: absolute;
 left: 50%;
 bottom: 0;
 content: "";
 transform: translateX(-50%);
 z-index: 9
}
.heading-effect:before, .heading-effect:after {
 height: 1px;
 border-bottom: 1px solid #999
}
.heading-effect:before {
 width: 30px
}
.heading-effect:after {
 width: 20px
}
.heading-effect:after {
 transform: translateX(-50%) rotate(45deg)
}
.col-title {
 position: relative;
 font-size: calc(24px + 0.25vw);
 font-weight: 500;
 text-transform: lowercase;
 margin-top: 0;
 margin-bottom: 1.1em
}
.col-title:before {
 display: inline-block;
 content: ":";
 color: #ea2e2b
}
.square {
 height: 0;
 padding-bottom: 100%;
 width: 100%;
 overflow: hidden
}
.line {
 width: 120px;
 height: 5px;
 margin: 20px 0 50px;
 display: block
}
.line:after {
 position: absolute;
 left: 10px;
 width: 5px;
 height: 5px;
 content: "";
 background: #fff
}
.line:before {
 position: absolute;
 height: 5px;
 content: "";
 width: 120px;
 background-color: #ea2e2b
}
.line.center:before {
 left: 50%;
 transform: translateX(-50%)
}
.line.left:before {
 left: 0;
 transform: translateX(0)
}
.line.right:before {
 right: 0;
 transform: translateX(0)
}
.bg-main-dark {
 position: relative;
 background-image: url(../img/layout/cubist-bg.jpg);
 background-attachment: fixed;
 background-size: 100%;
 padding: 20px;
 height: 100%;
 overflow: hidden
}
.bg-main-dark .line:before {
 position: absolute;
 left: 15px;
 background-color: #ccc;
 transform: translateX(0)
}
.bg-main-dark .line:after {
 left: 25px
}
.team-item {
 background: #fff
}
.team-item {
 height: 100%;
 padding: 50px
}
.team-item .team-photo {
 margin-bottom: 40px;
 max-width: 155px
}
.team-item .team-txt {
 font-size: calc(10px + 0.2vw);
 line-height: 1.5
}
.team-item .team-txt i {
 margin-left: -15px;
 margin-right: 5px;
 color: #ccc
}
.team-item .team-name {
 font-size: calc(10px + 0.25vw);
 color: #555
}
.team-item .team-name strong {
 font-size: calc(14px + 0.25vw);
 display: block
}
.team-item .team-role {
 font-size: calc(10px + 0.25vw);
 font-style: italic
}
.team {
 padding-top: 50px;
}
.team .team-icon {
 float: left;
 max-width: 90px;
 margin-bottom: 7rem;
 margin-right: 2rem;
}
.team .team-element h4 {
 font-weight: 700;
}
.text-parallax {
 display: block;
 font-size: calc(200px + 0.25vw);
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: -.05em;
 line-height: 1;
 height: 100%;
 background-attachment: fixed;
 background-color: #000;
 background-image: url(../img/layout/cubist-bg.jpg);
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover
}
.mask-overlay {
 text-shadow: none;
 background-color: #fff;
 color: #333;
 padding-right: 5px;
 mix-blend-mode: screen;
}
.experience-info {
 position: absolute;
 left: 0;
 bottom: 30px;
 width: 100%;
 padding-right: 15px;
 padding-left: 15px
}
.experience-info h2 {
 font-size: calc(inherit + 0.25vw);
 text-transform: uppercase
}
.experience-info strong {
 color: #ea2e2b
}
.experience-info span {
 display: block
}
.services h4, .services h5 {
 text-transform: uppercase;
 font-weight: 500;
 letter-spacing: .2em;
 margin-top: 5px
}
.gallery {
 display: inline-block;
 width: 100%;
}
.gallery a {
 color: #fff
}
.gallery figure {
 border-right: 1px solid #fff;
 border-bottom: 1px solid #fff
}
.hovereffect {
 width: 100%;
 height: 100%;
 float: left;
 overflow: hidden;
 position: relative;
 text-align: center;
 cursor: pointer
}
.hovereffect .overlay {
 position: absolute;
 overflow: hidden;
 width: 80%;
 height: 80%;
 left: 10%;
 top: 10%;
 border-bottom: 1px solid #FFF;
 border-top: 1px solid #FFF;
 -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
 transition: opacity 0.5s, transform 0.5s;
 -webkit-transform: scale(0);
 -ms-transform: scale(0);
 transform: scale(0)
}
.hovereffect:hover .overlay {
 opacity: 1;
 filter: alpha(opacity=100);
 -webkit-transform: scale(1);
 -ms-transform: scale(1);
 transform: scale(1)
}
.hovereffect img {
 display: block;
 position: relative;
 -webkit-transition: all 0.35s;
 transition: all 0.35s;
 -webkit-filter: brightness(1) grayscale(1);
 -moz-filter: brightness(1) grayscale(1);
 filter: brightness(1) grayscale(1)
}
.hovereffect:hover img {
 filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="0.6" /><feFuncG type="linear" slope="0.6" /><feFuncB type="linear" slope="0.6" /></feComponentTransfer></filter></svg>#filter');
 filter: brightness(.6) grayscale(0);
 -webkit-filter: brightness(.6) grayscale(0)
}
.hovereffect h2, .hovereffect h3 {
 text-align: center;
 position: relative;
 color: #FFF;
 opacity: 0;
 filter: alpha(opacity=0);
 -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
 transition: opacity 0.35s, transform 0.35s;
 -webkit-transform: translate3d(0, -100%, 0);
 transform: translate3d(0, -100%, 0)
}
.hovereffect h2 {
 font-size: calc(18px + 0.25vw);
 font-weight: 500
}
.hovereffect h2 small {
 color: #FFF;
}
.hovereffect h3 {
 font-size: calc(14px + 0.25vw)
}
.hovereffect a, .hovereffect p {
 color: #FFF;
 padding: 1em 0;
 opacity: 0;
 filter: alpha(opacity=0);
 -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
 transition: opacity 0.35s, transform 0.35s;
 -webkit-transform: translate3d(0, 100%, 0);
 transform: translate3d(0, 100%, 0)
}
.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2, .hovereffect h3 {
 opacity: 1;
 filter: alpha(opacity=100);
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0)
}
.hovereffect p {
 font-size: 12px;
 text-transform: uppercase
}
.cursor-default {
 cursor: default !important
}
.contact-container .contact-item-right, .contact-container .contact-item-left {
 position: relative;
 display: inline-block;
 vertical-align: middle
}
.active-right .btns-area .btn-right, .active-left .btns-area .btn-left {
 display: inline-block
}
.active-right .contact-container .contact-item-right, .active-left .contact-container .contact-item-left {
 text-align: center
}
form, fieldset {
 margin: 0;
 padding: 0;
 border-style: none
}
input, textarea, select {
 width: 100%
}
input [type="email"], input [type="tel"], input[type="search"], input[type="text"], input[type="password"], input[type="file"], textarea {
 font-size: calc(10px + 0.25vw);
 border: 1px solid rgba(255, 255, 255, .5);
 background: none;
 padding: 10px;
 margin: 5px 0;
 vertical-align: middle;
 color: #fff;
 border-radius: 0
}
input:hover, textarea:hover {
 border: 1px solid rgba(255, 255, 255, 1)
}
input:focus, textarea:focus {
 border: 1px solid #ea2e2b
}
input[type="submit"]:hover {
 background-color: #fff;
 border-color: #ea2e2b;
 color: #ea2e2b
}
input::placeholder, textarea::placeholder {
 font-size: calc(10px + 0.25vw);
 color: white
}
.nicescroll-rails {
 position: relative
}
.nicescroll-rails > div {
 margin-right: 0
}
.nicescroll-rails:before {
 position: absolute;
 right: 4px;
 top: 0;
 content: "";
 width: 1px;
 height: 100%;
 border-right: 1px solid #999
}
/*.hifen-list li {
 font-size: calc(10px + 0.25vw)
}*/
.hifen-list li:before {
 position: relative;
 content: "- ";
 margin-left: -9px
}
.btn {
 font-size: calc(10px + 0.25vw);
 text-transform: uppercase;
 letter-spacing: .2em;
 background: none;
 margin: 5px 0;
 padding: 10px 40px;
 width: auto;
 background-color: #ea2e2b;
 border: 1px solid #ea2e2b;
 border-radius: 0;
 color: #fff;
 vertical-align: middle;
 overflow: hidden
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
 background-color: #000;
 border-color: #000;
 color: #fff
}
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover {
 background-color: #fff;
 border-color: #ea2e2b;
 color: #ea2e2b
}
@media only screen and (max-width:810px) {
 .visual-container .frame {
  display: none
 }
 .mobile-content {
  position: relative;
  display: block;
  left: auto;
  top: auto
 }
 .mobile-content img {
  width: auto;
  height: 100%
 }
 .mobile-content .left-content, .mobile-content .right-content {
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0
 }
 .mobile-content .default-state {
  opacity: 1;
  position: relative;
  z-index: 1;
  height: 100%
 }
 .mobile-content .left-content, .mobile-content .right-content, .mobile-content .default-state {
  transition: opacity 500ms ease-in-out
 }
 .mobile-content .default-state .right-link, .mobile-content .default-state .left-link {
  position: absolute;
  text-indent: -9999px;
  overflow: hidden;
  z-index: 2;
  width: 50%;
  top: 0;
  left: 0;
  height: 100%;
  bottom: 0
 }
 .mobile-content .default-state .right-link {
  left: 50%
 }
 .active-left .mobile-content .left-content {
  opacity: 1
 }
 .active-left .mobile-content .right-content, .active-left .mobile-content .default-state {
  opacity: 0
 }
 .active-right .mobile-content .right-content {
  opacity: 1
 }
 .active-right .mobile-content .left-content, .active-right .mobile-content .default-state {
  opacity: 0
 }
 .next-section {
  bottom: 2%
 }
 .active-right .mobile-content .default-state .right-link {
  display: none
 }
 .active-right .mobile-content .default-state .left-link {
  width: 25%
 }
 .active-left .mobile-content .default-state .left-link {
  display: none
 }
 .active-left .mobile-content .default-state .right-link {
  width: 25%;
  left: 75%
 }
 .active-left .mobile-content .left-content img {
  float: right;
  margin: 0 0 0 -500px !important
 }
 .active-right .mobile-content .right-content img {
  margin: 0 !important
 }
}
@media only screen and (max-width:767px) {
 #nav ul {
  font-size: 14px;
  line-height: 16px
 }
 #nav li {
  padding: 0 3px
 }
 .navbar-content .navbar-nav {
  width: auto;
  justify-content: none;
  display: block;
 }
 .info-default {
  margin: 0
 }
 .info-default .logo {
  display: none
 }
 .visual-container .frame .right-section, .visual-container .frame .left-section {
  width: 100% !important;
  float: none;
  height: 50%
 }
 .next-section {
  bottom: 3%
 }
 .info-box {
  opacity: 1;
  bottom: 14%
 }
 .info-box p {
  display: none
 }
 .info-box p {
  display: none
 }
 .active-right .right-section .info-box p, .active-left .left-section .info-box p {
  display: block
 }
 .lining {
  height: 30%;
  width: 100%
 }
 .active-left .left-section .lining {
  top: auto;
  bottom: 0;
  left: 0
 }
 .active-right .right-section .lining {
  left: 0;
  display: block
 }
 .visual-container {
  overflow: visible
 }
}
@media only screen and (max-width:497px) {
 .container h1 {
  font-size: 24px;
  line-height: 28px
 }
 .contact-container .plus {
  display: none
 }
 .contact-container .contact-item-right, .contact-container .contact-item-left {
  text-align: right
 }
 .contact-item-left, .contact-item-right {
  text-align: right;
  padding: 0 40px 10px 0
 }
 .container .section.left, .container .section.right {
  text-align: center
 }
}
@media only screen and (max-height:400px) {
 .mobile-content .left-content, .mobile-content .right-content {
  top: 0
 }
}
.slick-slider {
 position: relative;
 display: block;
 -moz-box-sizing: border-box;
 box-sizing: border-box;
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 -ms-touch-action: none;
 touch-action: none;
 -webkit-tap-highlight-color: transparent
}
.slick-list {
 position: relative;
 overflow: hidden;
 display: block;
 margin: 0;
 padding: 0
}
.slick-list:focus {
 outline: none
}
.slick-list.dragging {
 cursor: pointer;
 cursor: hand
}
.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img {
 -webkit-transform: translate3d(0, 0, 0);
 -moz-transform: translate3d(0, 0, 0);
 -ms-transform: translate3d(0, 0, 0);
 -o-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0)
}
.slick-track {
 position: relative;
 left: 0;
 top: 0;
 display: block;
 zoom: 1
}
.slick-track:before, .slick-track:after {
 content: "";
 display: table
}
.slick-track:after {
 clear: both
}
.slick-loading .slick-track {
 visibility: hidden
}
.slick-slide {
 float: left;
 height: 100%;
 display: none
}
.slick-slide p {
 display: block;
 text-align: center;
 margin-top: 10px;
}
.slick-slide img {
 display: block;
 width: 100%;
 max-width: 930px;
 max-height: 640px;
 height: auto;
 margin-left: auto;
 margin-right: auto
}
.slick-slide.slick-loading img {
 display: none
}
.slick-slide.dragging img {
 pointer-events: none
}
.slick-initialized .slick-slide {
 display: block;
 border-bottom: 1px solid #999;
}
.slick-loading .slick-slide {
 visibility: hidden
}
.slick-vertical .slick-slide {
 display: block;
 height: auto;
 border: 1px solid transparent
}
.arrows {
 display: none
}
.slick-prev, .slick-next {
 position: absolute;
 display: block;
 height: 20px;
 width: 20px;
 line-height: 0;
 font-size: 0;
 cursor: pointer;
 background: transparent;
 color: transparent;
 top: 50%;
 margin-top: -10px;
 padding: 0;
 border: none;
 outline: none
}
.slick-prev:focus, .slick-next:focus {
 outline: none
}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
 opacity: .25
}
.slick-prev:before, .slick-next:before {
 display: block;
 background: #ea2e2b;
 font-size: 20px;
 height: 40px;
 color: white;
 opacity: .85;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale
}
.slick-prev:hover:before, .slick-next:hover:before {
 background: #000
}
.slick-prev {
 left: -25px
}
.slick-prev:before {
 font-family: "Ionicons";
 content: "\f124"
}
.slick-next {
 right: -25px
}
.slick-next:before {
 font-family: "Ionicons";
 content: "\f125"
}
.slick-dots {
 position: absolute;
 bottom: -45px;
 list-style: none;
 display: block;
 text-align: center;
 padding: 0;
 width: 100%
}
.slick-dots li {
 position: relative;
 display: inline-block;
 height: 20px;
 width: 20px;
 margin: 0 5px;
 padding: 0;
 cursor: pointer
}
.slick-dots li button {
 border: 0;
 background: transparent;
 display: block;
 height: 20px;
 width: 20px;
 line-height: 0;
 font-size: 0;
 color: transparent;
 padding: 5px;
 cursor: pointer;
 outline: none
}
.slick-dots li button:focus {
 outline: none
}
.slick-dots li button:before {
 position: absolute;
 top: 0;
 left: 0;
 content: "\2022";
 width: 20px;
 height: 20px;
 line-height: 20px;
 text-align: center;
 color: black;
 opacity: .25;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale
}
.slick-dots li.slick-active button:before {
 opacity: .75
}
.slick_container {
 width: 100%;
 margin: 0 auto;
 position: relative
}
.slides .slick-prev, .slides .slick-next {
 width: 60px;
 height: 40px
}
.slides .slick-prev:before, .slides .slick-next:before {
 line-height: 40px
}
html.apfm-open, html.apfm-open > body {
 width: 100%;
 height: 100%
}
.apfm-container {
 position: fixed;
 visibility: hidden;
 opacity: 0;
 z-index: -1;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
 -webkit-transform: scale(.8);
 -moz-transform: scale(.8);
 -ms-transform: scale(.8);
 -o-transform: scale(.8);
 transform: scale(.8)
}
.apfm-open .apfm-container {
 visibility: visible;
 z-index: 1
}
.apfm-container.apfm-open {
 opacity: 1;
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 -o-transform: scale(1);
 transform: scale(1);
 z-index: 9999999
}
.apfm-container, .apfm-container * {
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 -o-user-select: none;
 user-select: none
}
.apfm-container p {
 max-width: 930px;
 margin-left: auto;
 margin-right: auto;
}
.apfm-container .apfm-wrapper, .wrapper {
 position: relative;
 width: 100%;
 height: 100%;
 overflow: auto
}
.apfm-container .apfm-close-button {
 position: absolute;
 top: 50px;
 right: 50px;
 width: 50px;
 height: 50px;
 cursor: pointer;
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 -webkit-tap-highlight-color: transparent;
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 z-index: 999
}
.apfm-container .apfm-close-button::before, .apfm-container .apfm-close-button::after {
 content: "";
 position: absolute;
 left: 0;
 top: 50%;
 width: 100%;
 height: 2px;
 background-color: #bbb;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 -o-transform: rotate(45deg);
 transform: rotate(45deg);
 -webkit-transition: background-color .2s;
 -moz-transition: background-color .2s;
 -ms-transition: background-color .2s;
 -o-transition: background-color .2s;
 transition: background-color .2s
}
.apfm-container .apfm-close-button::after {
 -webkit-transform: rotate(-45deg);
 -moz-transform: rotate(-45deg);
 -ms-transform: rotate(-45deg);
 -o-transform: rotate(-45deg);
 transform: rotate(-45deg)
}
.apfm-container .apfm-close-button:hover::before, .apfm-container .apfm-close-button:hover::after {
 background-color: #555
}
.modal-content {
 border: none;
 height: 100%;
 -webkit-box-shadow: none;
 box-shadow: none
}
@media (min-width:20em) and (max-width:29em) {
 .navbar-default .navbar-nav > li > a {
  color: #777
 }
 .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  color: #000
 }
 .navbar-collapse {
  background-color: #fff;
  text-align: center
 }
 .navbar-brand {
  position: relative;
  padding: 0;
  width: 50%
 }
 .navbar-brand img {
  width: auto;
  height: 100%;
  max-height: 34px;
  margin: 8px;
  opacity: 0;
  -webkit-animation: fadeIn ease-in 1;
  -moz-animation: fadeIn ease-in 1;
  animation: fadeIn ease-in 1;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  animation-delay: 0.2s;
  filter: invert(50%);
 }
 .navbar-brand a.active img {
  display: none;
 }
 .navbar-brand i {
  display: none
 }
 .fixed #nav .navbar-brand {
  padding: 0 15px
 }
 .section-header h2 {
  font-size: calc(24px + 0.25vw)
 }
 #header.fixed a {
  color: #000
 }
 #main {
  margin-bottom: 0
 }
 .experience-info {
  bottom: -30px;
  text-align: center
 }
 .experience-info h2 {
  font-size: calc(24px + 0.25vw)
 }
 .team-item .team-txt {
  font-size: calc(12px + 0.25vw)
 }
 .apfm-container .apfm-close-button {
  top: 15px;
  right: 25px;
  width: 25px;
  height: 25px;
  background-color: #000;
  padding: 5px
 }
 .apfm-container .apfm-close-button::before, .apfm-container .apfm-close-button::after {
  background-color: #fff
 }
 .apfm-container .apfm-close-button:hover::before, .apfm-container .apfm-close-button:hover::after {
  background-color: #ea2e2b
 }
 .hifen-list li {
  font-size: calc(12px + 0.25vw)
 }
 #footer {
  position: relative
 }
 #footer .contact-area .logo {
  margin-left: auto;
  margin-right: auto
 }
 #footer .contact-area .contacts {
  text-align: center
 }
 #footer .contact-area .contact-form {
  text-align: center
 }
 #footer .contact-area .social {
  padding-top: 20px
 }
 #footer .bottom-bar span {
  display: block
 }
 .flexbox {
  display: block
 }
}
@media (min-width:30em) and (max-width:39em) {
 .team-item .team-txt {
  font-size: calc(12px + 0.25vw)
 }
 #footer .contact-area .social {
  padding-top: 20px
 }
}
@media (min-width:40em) and (max-width:59em) {
 .team-item .team-txt {
  font-size: calc(12px + 0.25vw)
 }
 #footer .contact-area .social {
  padding-top: 20px
 }
}
.col-xs-15, .col-sm-15, .col-md-15, .col-lg-15 {
 position: relative;
 min-height: 1px;
 padding-right: 10px;
 padding-left: 10px
}
.col-xs-15 {
 width: 20%;
 float: left
}
@media (min-width:768px) {
 .col-sm-15 {
  width: 20%;
  float: left
 }
}
@media (min-width:992px) {
 .col-md-15 {
  width: 20%;
  float: left
 }
}
@media (min-width:1200px) {
 .col-lg-15 {
  width: 20%;
  float: left
 }
}