html, body{
  height: 100%;
}

body {
    margin: 0px;
    background-color: #000;
    font-family: 'Montserrat', sans-serif;
    background-repeat: no-repeat;
    background-size: cover;
    font-display: swap !important;
    color: #fff;
    -webkit-tap-highlight-color: transparent !important;
    overflow-x: hidden !important;
}

img#logo {
    position: absolute;
    width: 100%;
    max-width: 260px;
    left: 130px;
    top: 70px;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    z-index: 99;
}

/* SIDE NAV START */

body.navHovered:before {
    opacity: 1;
    visibility: visible;
}

body:before {
    content: '';
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    max-width: calc(100% - 100px);
    height: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .5s cubic-bezier(0.6, 0, 0.5, 1);
    transition: all .5s cubic-bezier(0.6, 0, 0.5, 1);
    background: #000;
    z-index: 90; /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(0,0,0,0) 20%,rgba(0, 0, 0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

body.navHovered .sideNav {
    border-left-color: #000;
}

#slideIn {
    opacity: 0;
}

#slideUp {
    opacity: 0;
}

.sideNav {
    position: fixed;
    width: 100px;
    height: 100%;
    right: 0px;
    top: 0px;
    border-left: 3px solid #a11515; 
    font-family: "Montserrat";
    font-size: 12px;
    line-height: 13px;
    z-index: 90;
    background-color: #000;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.sideNav ul.navigation {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    top: 120px;
    padding: 0px;
    margin: 0px auto;
}

.sideNav ul.navigation li {
    display: block;
    list-style: none;
    padding: 10px 0px;
    font-size: 13px;
    color: #fff;
}

.sideNav ul.navigation li a {
    display: block;
    margin: 0 auto;
    padding: 15px 13px;
    position: relative;
    color: #878787;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 700;
}

@supports (-ms-ime-align:auto) {
    .sideNav ul.navigation li a {
        height: 70px;
    }
    .sideNav ul.navigation li a div {
        -webkit-writing-mode: tb-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: tb-rl;
    }
    .sideText {
        display: none;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .sideNav ul.navigation li a {
        height: 70px;
    }
    .sideNav ul.navigation li a div {
        -webkit-writing-mode: tb-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: tb-rl;
    }
    .sideText {
        display: none;
    }
}

.sideNav ul.navigation li a div {
    margin: 0px auto;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: 0.5s cubic-bezier(0.6, 0, 0.5, 1);
    transition: 0.5s cubic-bezier(0.6, 0, 0.5, 1);
}

.sideNav ul.navigation li a div.active {
    color: #fff;
}

.sideNav ul.navigation li a:after {
    content: attr(data-text);
    position: absolute;
    right: -50px;
    top: 0;
    color: #fff;
    white-space: nowrap;
    font-style: italic;
    font-family: "Montserrat";
    text-transform: uppercase;
    color: transparent;
    -webkit-text-stroke: 0.5px #fff;
    letter-spacing: -1px;
    font-weight: 900;
    font-size: 110px;
    line-height: 66px;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0.5s cubic-bezier(0.6, 0, 0.5, 1);
    transition: 0.5s cubic-bezier(0.6, 0, 0.5, 1);
}

.sideNav ul.navigation li a:hover:after {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    right: -40px;
}

.sideNav ul.navigation li a:hover div {
    opacity: 0;
    -webkit-transform: translateX(3.125vw) rotate(180deg);
    transform: translateX(3.125vw) rotate(180deg);
}

.sideNav ul.navigation li:first-child a {
    padding-top: 0
}

.sideNav ul.navigation li:last-child a {
    padding-bottom: 0
}

.sideNav ul.navigation li.active a {
    color: #000
}



/* MOBILE NAV START */

nav {
    position: fixed;
    height: 100px;
    width: 100%;
    overflow: hidden;
    background-color: #000;
    top: 0px;
    left: 0px;
    z-index: 90;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    display: none;
    border-bottom: 3px solid #a11515;
}

nav.fullpage {
    background-color: transparent;
    border: 0px;
}

.mobileNav {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0px;
    opacity: 0;
    display: none;
    background-color: #000;
    z-index: 90;
    color: #fc5668;
}

.mobileNav ul {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 0px;
    text-align: center;
    list-style: none;
}

.mobileNav ul a.active {
    -webkit-text-stroke: 0.5px #000;
    color: #fff;
}

.mobileNav ul a:hover {
    -webkit-text-stroke: 0.5px #000;
    color: #fff;
}

.mobileNav ul li {
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 900;
    font-style: italic;
    -webkit-text-stroke: 0.5px #fff;
    color: transparent;
    padding: 15px 0px;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.mobileNav ul li a {
    text-decoration: none;
    -webkit-text-stroke: 0.5px #fff;
    color: transparent;
    transition: 0.4s;
}

.overlay {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 89;
}

nav img {
    position: absolute;
    width: 100%;
    max-width: 160px;
    height: auto;
    left: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

nav .navIcon {
    position: absolute;
    right: 30px;
    top: 50%;
    outline: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}

nav .iconColor {
    background-color: #fff;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.icon-line1, .icon-line2, .icon-line3 {
    width: 30px;
    height: 3px;
    border: none;
    background-color: #000;
    margin: 5px 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    outline: 0;
    right: 0px;
    text-align: right;
}

.icon-line2 {
    position: relative;
    width: 15px;
    left: 15px;
}

.navOpen .icon-line1 {
    -webkit-transform: rotate(-45deg) translate(-4.5px, 5.5px);
        transform: rotate(-45deg) translate(-5.5px, 4.5px);
}

.navOpen .icon-line2 {opacity: 0;}

.navOpen .icon-line3 {
    -webkit-transform: rotate(45deg) translate(-4.5px, -5.5px);
        transform: rotate(45deg) translate(-6.5px, -5.5px);
}

.navOpen .mobileNav {
    display: none;
}

.pageWrap {
    position: relative;
    left: 0px;
    height: 100%;
    width: 100%;
    max-width: calc(100% - 100px);
    top: 0px;
    z-index: 80;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.pageContent {
    position: relative;
    top: 200px;
    overflow: hidden;
}

.screen {
    position: relative;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 80;
    overflow: hidden;
}

.sideText {
    position: absolute;
    left: 50px;
    bottom: 100px;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.sideText p {
    position: relative;
    color: #fff !important;
    font-style: italic;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    text-transform: uppercase !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    letter-spacing: -1px !important;
    vertical-align: middle !important;
    margin: 0px !important;
}

.sideText .line {
    position: relative;
    display: block;
    height: 70px;
    width: 2px;
    margin: 40px 8px;
    background-color: #fff;
    vertical-align: middle;
}

.center {
    position: absolute;
    left: 200px;
    top: 60%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 82;
    text-align: left;
    overflow: hidden;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.center h1 {
    color: #fff;
    font-size: 65px;
    text-transform: uppercase;
    font-weight: 800;
    font-style: italic;
    padding: 0px 10px;
    letter-spacing: -1px;
    margin: 10px auto;
    background-color: #000;
    background: rgb(27,27,27);
    background: linear-gradient(90deg, rgba(0, 0, 0,1) 0%, rgba(31,138,53,0) 47%);
    display: inline-block;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.center button {
    margin: 40px 0px;
}

button {
    position: relative;
    display: block;
    font-size: 14px;
    padding: 20px 40px;
    background-color: transparent;
    border: 2.3px solid #fff;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    outline: none;
    color: #fff;
}

a {
    text-decoration: none;
    color: inherit;
}

button:hover {
    background-color: #fff;
    color: #000;
}

.half {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 70%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.half .line {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 300px;
    background-color: #a11515;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    z-index: 81;
    background: rgb(27,27,27);
    background: linear-gradient(90deg, rgba(0, 0, 0,1) 11%, rgba(31,138,53,0) 100%);
}

.half .snow {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: repeat;
    opacity: 0.5;
    overflow: hidden;
    z-index: 81;
    
}

.half .slide {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    z-index: 80;
    
}

.pageContent {
    position: absolute;
    top: 100%;
    width: 100%;
}

.container {
    position: relative;
    margin: 50px auto;
    overflow: hidden;
    padding: 100px 0px;
    color: #000;
    width: 100%;
}

.container .inner {
    position: relative;
    width: 70%;
    margin: 0px auto;
    color: #fff;
    text-align: center;
}

.container .innerGrid {
    position: relative;
    width: 70%;
    margin: 0px auto;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 15px 5px;
    align-items: top;
}

.container h1 {
    margin: 20px auto;
    font-size: 35px;
}

.container p {
    margin: 20px auto;
    font-size: 14px;
    font-weight: 500;
    color: #ababab;
}

.container b {
    font-size: 14px;
}

.rtw {
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 800;
    font-style: italic;
}


.slick-slide {
    outline: none
}

.showreel {
    position: relative;
    margin: 30px auto;
    overflow: hidden;
    padding: 100px 0px;
    color: #000;
    width: 100%;
    background-color: 
}

.showreel .info {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 81;
    width: 90%;
    text-align: center;
}


.showreel .info h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 50px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    text-transform: uppercase;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.showreel .info button {
    margin: 20px auto;
}

.showreel .fullvideo {
    position: relative;
    opacity: 0.5;
    width: 100%;
}

.showreel .fullvideo video {
    width: 100%;
}

.showreela {
    position: relative;
    margin: 30px auto;
    overflow: hidden;
    padding: 100px 0px;
    color: #000;
    width: 100%;
    background-color: 
}

.showreela .info {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 81;
    width: 90%;
    text-align: center;
}


.showreela .info h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 50px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    text-transform: uppercase;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.showreela .info button {
    margin: 20px auto;
}

.wrap {
    position: relative;
    width: 100%;
    padding-top: 35%;
    overflow: hidden;
    pointer-events: none;
}

.showreela .fullvideo {
    position: absolute;
    opacity: 0.5;
    width: 100%;
    height: 100%;
    top: 0px;
    transform: scale(1.65);
}

.showreela .fullvideo .innervideo {
    padding-top: 56.25%;
}

.showreela .fullvideo .innervideo #playera {
    position: absolute;
    top: -25px;
    left: 0;
    width: 100%;
    height: 100%;
    outline: 0;
}

#lastwork .portfolio {
    position: relative;
    width: 70%;
    margin: 0px auto;
    grid-gap: 10px;
    transition: 0.4s;
}

#lastwork .portfolio .slidenav.left:hover {
    opacity: 1;
}

#lastwork .portfolio .slidenav.left {
    left: 0px;
    background: linear-gradient(to left, rgba(0,0,0,0) 0%,rgba(0, 0, 0,1) 100%);
}

#lastwork .portfolio .slidenav {
    position: absolute;
    width: 100px;
    height: 100%;
    z-index: 90;
    opacity: 0;
    transition: 0.4s;
}

#lastwork .portfolio .slidenav i {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 30px;
    color: #fff;
    opacity: 0.5;
    transform: translate(-50%, -50%);
}

#lastwork .portfolio .slidenav.left .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 30px;
    opacity: 0.5;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 85px;
    height: 85px;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1296 1728' style='enable-background:new 0 0 1296 1728;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Cpath class='st0' d='M494.7,846.4l258.3-258.3c4.6-4.6,10.8-7.2,17.3-7.2c6.5,0,12.7,2.5,17.3,7.2l13.2,13.2c9.5,9.5,9.5,25,0,34.6 L573,863.7L801.3,1092c4.6,4.6,7.2,10.8,7.2,17.3c0,6.5-2.5,12.7-7.2,17.3l-13.2,13.2c-4.6,4.6-10.8,7.2-17.3,7.2 c-6.5,0-12.7-2.5-17.3-7.2L494.7,881c-4.6-4.6-7.2-10.8-7.2-17.3C487.5,857.2,490.1,851,494.7,846.4z'/%3E%3C/svg%3E");
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5));
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

#lastwork .portfolio .slidenav.right .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 30px;
    opacity: 0.5;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 85px;
    height: 85px;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1296 1728' style='enable-background:new 0 0 1296 1728;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Cpath class='st0' d='M801.3,846.4L543.1,588.2c-4.6-4.6-10.8-7.2-17.3-7.2c-6.5,0-12.7,2.5-17.3,7.2l-13.2,13.2 c-9.5,9.5-9.5,25,0,34.6L723,863.7L494.7,1092c-4.6,4.6-7.2,10.8-7.2,17.3c0,6.5,2.5,12.7,7.2,17.3l13.2,13.2 c4.6,4.6,10.8,7.2,17.3,7.2c6.5,0,12.7-2.5,17.3-7.2L801.3,881c4.6-4.6,7.2-10.8,7.2-17.3C808.5,857.2,805.9,851,801.3,846.4z'/%3E%3C/svg%3E");
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5));
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

#lastwork .portfolio .slidenav.right {
    right: 0px;
    background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0, 0, 0,1) 100%);
}    

#lastwork .portfolio .slidenav.right:hover {
    opacity: 1;
}

#lastwork .portfolio .item:hover .thumba {
    transform: scale(1.05);
}

#lastwork .portfolio .item {
    position: relative;
    display: block;
    overflow: hidden;
    text-align: center;
    transition: 0.4s;
    cursor: pointer;
}

#lastwork .portfolio .item a {
    position: absolute;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 80;
}

#lastwork .portfolio .item .thumba {
    position: relative;
    width: 100%;
    padding-top: 150%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: 0.4s;
}



#lastwork .portfolio .item .thumba .far {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 20px;
    color: #fff;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

#lastwork .portfolio .item .thumba .play-icon {
    position: absolute;
    right: -7px;
    top: -7px;
    width: 100%;
    max-width: 85px;
    height: 85px;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 441.8 507.6' style='enable-background:new 0 0 441.8 507.6;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Ctitle%3ELayer 1%3C/title%3E%3Cpath class='st0' d='M277.1,244.3l-96.4-58.5c-4.4-2.7-9.8-2.8-14.2-0.3c-4.5,2.5-7.2,7.2-7.2,12.3v111.9c0,5.1,2.7,9.8,7.2,12.3 c2.1,1.2,4.5,1.8,7,1.8c2.6,0,5.1-0.7,7.3-2.1l96.5-58.5c1.5-0.9,2.8-2.2,3.7-3.7C284,254.3,282.4,247.5,277.1,244.3z M264.6,253.8 l-90.8,55.1V198.7L264.6,253.8z'/%3E%3C/svg%3E");
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5));
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}


#lastwork .portfolio .item .thumba video {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: none;
    opacity: 0;
}

#lastwork .portfolio .item .itemtitle {
    position: absolute;
    bottom: 10px;
    left: 15px;
    text-align: left;
}

#lastwork .portfolio .item .itemtitle h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 30px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

#lastwork .portfolio .item h2 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 40px;
    font-style: italic;
    font-weight: 800;
    color: #fff;
    transition: 0.4s;
    z-index: 2;
}

#lastwork .portfolio .gradient {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    opacity: 0.4;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
    z-index: 1;
    outline: 0;
}

.preproduction-icon {
    position: relative;
    width: 100%;
    max-width: 150px;
    height: 150px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1296 1728' style='enable-background:new 0 0 1296 1728;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M166.8,862.5c0-169.9-0.1-339.7,0-509.6c0.1-77.9,50.9-129.1,129.3-129.2c163.3-0.4,326.5,0.1,489.8-0.3 c39.9-0.1,73.4,13.1,101.6,41.5c66.5,67,133.2,133.7,200.2,200.1c28.5,28.3,41.3,62.4,41.3,101.8c0.1,268,0.2,536-0.1,804 c-0.1,81.3-51.4,133.3-132.1,133.4c-234,0.3-468.1,0.4-702.1,0c-79.8-0.1-128-49.3-128-129.3 C166.7,1204.2,166.8,1033.4,166.8,862.5z M724.5,310.5c-8.2-1.3-11.8-2.4-15.5-2.4c-134-0.1-268-0.8-402,0.1 c-47,0.3-57.9,13.7-57.9,63.4c-0.1,329.3-0.1,658.7,0,988c0,49.2,11.1,60.2,59.6,60.2c225.5,0,451.1,0,676.6,0 c47.8,0,56-8.1,56-55.8c0-235.9,0-471.8,0-707.7c0-8.9,0-17.8,0-27.9c-81.9,0-159.2,0-236.6,0c-60.4,0-80.3-20.2-80.3-81.5 C724.5,468.7,724.5,390.5,724.5,310.5z M1028.6,541.9c-74.1-73.8-147.9-147.4-217.9-217.2c0,67.8,0,142.4,0,217.2 C885.9,541.9,958.7,541.9,1028.6,541.9z'/%3E%3Cpath class='st0' d='M643.8,1028.5c-63.1,0-126.2,0.3-189.3-0.1c-35.6-0.2-51.9-15.2-51.2-45.5c0.6-29.2,16-42.9,50.7-43 c128.1-0.3,256.2-0.3,384.3,0c37.8,0.1,50.2,12,49.9,45.2c-0.3,30.9-13.7,43.1-49.3,43.3C773.8,1028.8,708.8,1028.6,643.8,1028.5z '/%3E%3Cpath class='st0' d='M646.9,1187.1c-64.2,0-128.4,0.2-192.6-0.1c-34.9-0.1-50.2-13.3-50.9-42.6c-0.7-29.1,14.2-45.3,48.6-45.5 c130.3-0.9,260.5-1,390.8,0.1c34.8,0.3,46.6,15.3,45.3,47.7c-1.2,30-13.2,40.3-48.7,40.4C775.3,1187.3,711.1,1187.1,646.9,1187.1z '/%3E%3Cpath class='st0' d='M648.1,866.7c-66,0-132,0.1-198-0.1c-32.8-0.1-47.1-13.3-46.6-42.5c0.4-28.3,15.5-42.2,47.8-42.2 c130.1-0.2,260.2-0.2,390.3,0c35.7,0.1,47.2,11.7,46.6,44.6c-0.5,30.3-12,40-47.8,40.1C776.3,866.7,712.2,866.7,648.1,866.7z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

.production-icon {
    position: relative;
    width: 100%;
    max-width: 150px;
    height: 140px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1296 1728' style='enable-background:new 0 0 1296 1728;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M927.3,679.4c50.1-31.9,95.4-60.6,140.6-89.4c31-19.7,61.6-40.1,92.9-59.2c28.7-17.5,59.8-15.8,84.7,3.5 c18.2,14,25.2,32.9,25.2,55.7c-0.2,183-0.3,365.9,0,548.9c0,29-11.4,50.8-36.5,64.4c-26.1,14.2-51.3,10.6-76.1-5.5 c-69.2-44.7-138.8-88.8-208.4-133c-6-3.8-12.5-6.7-22.4-11.9c0,39.6,0.1,75.9,0,112.3c-0.2,69.6-44.7,114.9-114.9,115 c-224.6,0.3-449.2-0.7-673.9,0.7c-53.8,0.3-114.1-44.1-113.2-114.9c2.4-199.3,2.4-398.6,0-597.9c-0.9-71.6,49-119.5,116.7-119.9 c223.8-1.3,447.6-1.3,671.4,0c69.6,0.4,113.9,50,114,120.1C927.4,603.2,927.3,638.1,927.3,679.4z M476,523.5 c-108.6,0-217.2-0.1-325.7,0.1c-41.5,0.1-52.3,11.1-52.3,52.1c-0.1,84.9,0,169.8,0,254.7c0,109.4-0.1,218.8,0.1,328.2 c0.1,33,9.6,44,41.8,49.2c8,1.3,16.2,1.4,24.4,1.4c208.2,0.1,416.4,0.1,624.5,0c9.7,0,19.5-0.9,29.2-2.2 c23.6-3.3,34.3-15.2,34.2-41.1c-0.9-197.6-0.5-395.1-0.5-592.7c0-42-7.1-49.4-49.8-49.5C693.2,523.4,584.6,523.5,476,523.5z M1196.7,594.2c-89.6,56.7-175.1,110.5-260,165.3c-5.6,3.6-8.9,14.6-9,22.2c-0.8,52.3,0.9,104.6-1.1,156.8 c-0.7,19.4,6.4,29.2,21.5,38.6c59.5,37,118.5,75,177.7,112.6c22.8,14.5,45.7,28.8,70.9,44.6 C1196.7,952.5,1196.7,775.7,1196.7,594.2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

.postproduction-icon {
    position: relative;
    width: 100%;
    max-width: 150px;
    height: 125px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1296 1728' style='enable-background:new 0 0 1296 1728;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M20.9,866.6c0-163.9-0.2-327.7,0.1-491.6c0.1-63.7,38.1-115.5,97.6-131.9c17-4.7,35.3-5.9,53.1-5.9 c317.8-0.3,635.6-0.1,953.3-0.3c59.7,0,108.3,20.2,135.3,76c8.7,17.9,14,39.2,14.1,59c0.8,327.7,0.8,655.5,0.5,983.2 c-0.1,79-57.9,135.5-137.7,135.9c-108.8,0.4-217.6,0.1-326.4,0.1c-215.6,0-431.2,0-646.8,0c-72.2,0-118.1-33.3-138.4-101.5 c-4.1-13.6-4.3-28.8-4.3-43.2C20.8,1186.4,20.9,1026.5,20.9,866.6z M648.7,327.2c-53.1,0-106.1,0-159.2,0 c-108.8,0-217.6-0.1-326.4,0c-33.4,0-48.6,13.6-52.5,46.6c-0.8,6.6-0.7,13.2-0.7,19.9c0,313.8,0,627.5,0,941.3 c0,4.6-0.2,9.3,0.1,13.9c2.5,38.9,17.3,53.1,56.5,53.1c321,0.1,642.1,0.1,963.1,0c38.9,0,53.8-14.4,56.1-53.6 c0.3-6,0.1-11.9,0.1-17.9c0-311.1,0-622.2,0-933.3c0-5.3,0.2-10.6-0.1-15.9c-2.4-39.9-17.5-54.1-57.6-54.1 C968.4,327.2,808.6,327.2,648.7,327.2z'/%3E%3Cpath class='st0' d='M827.4,678.1c0-54.4-0.1-108.7,0-163.1c0.1-30,11.9-41.3,42.5-41.5c33.4-0.3,47.3,11.1,47.4,41.4 c0.4,108.7,0.6,217.5-0.3,326.2c-0.1,18.3,4.7,24.4,23.2,24c32.4-0.8,65.1-1.2,97.2,2.2c34.9,3.7,57.1,29.5,57.9,64.6 c1.1,44.4,1.1,88.9,0,133.3c-1,40.5-27.8,66-68.6,67c-27.8,0.7-55.7,0.1-83.5,0.2c-25.8,0-25.8,0.1-25.8,26.8 c0,9.9,0.7,20-0.6,29.8c-3.3,26.2-18.1,35.4-52.8,33.9c-23.6-1-35.6-13.4-36.6-37.9c0-0.7,0-1.3,0-2c-1.4-50.7-1.4-50.6-51.6-50.7 c-21.2,0-42.5,0.5-63.6-0.4c-33.6-1.4-60.5-24.3-62.1-57.8c-2.3-50.2-2.1-100.7-0.1-150.9c1.2-29.8,23.3-52.3,53.3-55.1 c34.2-3.2,68.8-3,103.2-2.9c16.3,0.1,21.7-4.8,21.4-21.8C826.7,788.2,827.4,733.1,827.4,678.1z M871.3,1044.4 c38.5,0,77-0.3,115.4,0.2c13.2,0.2,19.6-3.5,18.7-18c-1-18.5-0.8-37.2-0.1-55.7c0.5-12.3-4.7-16.5-16.3-16.5 c-78.3,0.2-156.6,0.2-234.9-0.1c-13.2,0-17.3,5.8-16.8,18.2c0.7,17.9,0.9,35.9-0.1,53.7c-0.8,14.1,4.8,18.6,18.4,18.4 C794.3,1044,832.8,1044.4,871.3,1044.4z'/%3E%3Cpath class='st0' d='M468.4,1035.8c0,47.8,0.1,95.5,0,143.3c-0.1,31.9-11.7,43.5-42.7,43.7c-34,0.1-47-11.5-47.1-44.1 c-0.3-97.5-0.6-195,0.3-292.5c0.2-18.1-5.3-22.2-22.5-21.9c-33,0.6-66.4,1-99.1-2.8c-35.7-4.2-56.2-29.5-56.9-65.3 c-0.8-43.8-0.8-87.6,0-131.3c0.6-37.5,24.9-64.4,62-67.3c30.3-2.3,61-2.8,91.4-1.6c20.8,0.8,26.8-6.6,25-26.4 c-1.6-18.4-0.8-37.1-0.2-55.7c0.9-29.8,14.4-40.8,48.4-40.4c29.2,0.3,41.1,12,41.4,40.7c0.2,20.6,0.8,41.2-0.3,61.7 c-0.8,14.8,4.7,20,19.3,19.9c33.1-0.1,66.4-0.6,99.3,1.9c34.2,2.6,57.7,24.8,59.3,58.6c2.3,49.6,2.3,99.4-0.2,149 c-1.9,36.4-31.4,58.1-74.2,59.2c-28.5,0.7-57.1,0.8-85.5-0.1c-14-0.4-18.2,4.2-18,18.2C468.9,933.6,468.4,984.7,468.4,1035.8z M290.7,773.2c90,0,178.1,0,267.6,0c0-25.7,0.8-49.5-0.6-73.1c-0.3-4.9-8.9-13.2-13.7-13.2c-80.1-0.8-160.2-0.7-240.3-0.1 c-4.3,0-12.2,6.6-12.4,10.4C290.2,722.1,290.7,747.2,290.7,773.2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

.container#wwd .inner {
    position: relative;
    width: 80%;
    margin: 0px auto;
    color: #fff;
    text-align: center;
}

.container#wwd .inner .wwd {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: minmax(100px, auto);
    grid-gap: 15px 5px;
    align-items: center;
    
}

.container#wwd .inner .wwd .wwd-box i {
    font-size: 90px;
    margin: 20px auto;
}

.container#wwd .inner .wwd .wwd-box h1 {
    font-size: 25px;
    text-transform: uppercase;
    font-style: italic;
    font-weight: 800;
}

.container#wwd .inner .wwd .wwd-box p {
    font-size: 14px;
    width: 60%;
    margin: 0 auto;
}

.container .gallery {
    position: relative;
    width: 100%;
    margin: 20px auto;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0px;
    align-items: top;
}

.container .gallery .image {
    position: relative;
    width: 100%;
    padding-top: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.bts {
    position: relative;
    overflow: hidden;
}

.bts .gradient {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    opacity: 1;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(161, 21, 21,1) 100%);
    z-index: 1;
    outline: 0;
}

.bts .info {
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translate(-50%);
    z-index: 81;
    width: 90%;
    text-align: center;
}


.bts .info h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 50px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    text-transform: uppercase;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.bts .info button {
    margin: 20px auto;
}

.bts .gallery {
    position: relative;
    width: 100%;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0px;
    align-items: top;
}

.bts .gallery .image {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.container .makingof {
    position: relative;
    width: 100%;
    margin: 20px auto;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0px;
    align-items: top;
}

.container .makingof .image {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.container .makingof .image .ioverlay {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    opacity: 0;
    transition: 0.4s;
    z-index: 80;
}

.container .makingof a {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    opacity: 0;
    transition: 0.4s;
    z-index: 80;
}

.container .makingof .image a span {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #000;
    z-index: 80;
}

.container .makingof .image:hover a {
    opacity: 1;
}

.page {
    position: relative;
    width: 100%;
    top: 100px;
    color: #fff;
}

.page .sideText {
    top: 90px;
}

.page .container hr {
    border: 0;
    height: 2px;
    background-color: #a11515;
}

.page .container {
    width: 70%;
    margin: 0px auto;
    padding: 100px 0px;
    color: #fff;
}

.work {
    width: 60%;
}

.work h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 30px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.work h2 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-style: italic;
    font-weight: 800;
    color: #fff;
    transition: 0.4s;
    z-index: 2;
}

.work .videoinfo p {
    margin: 20px auto;
    font-size: 14px;
    font-weight: 500;
    color: #ababab;
}

.work .fullvideo {
    position: relative;
    width: 100%;
}

.work .fullvideo .innervideo {
    padding-top: 56.25%;
}

.work .fullvideo .innervideo #player {
    position: absolute;
    left: 0;
    top: 0px;
    width: 100%;
    height: 100%;
    outline: 0;
}

.contact .person {
    position: relative;
    width: 100%;
    margin: 50px auto;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 45px;
    align-items: center;   
}

.contact .person .image {
    width: 100%;
    height: 400px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.contact .person .info h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 50px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    text-transform: uppercase;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.contact .person .info h2 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 20px;
    font-style: italic;
    font-weight: 800;
    text-transform: uppercase;
    transition: 0.4s;
    z-index: 2;
}

.contact .person .info p {
    font-size: 12px;
    margin: 10px auto;
}

.contact .person .info ul {
    position: relative;
    padding: 0px;
    margin: 10px auto;
    list-style: none;
}

.contact .person .info ul li {
    font-size: 14px;
    font-weight: 500;
    margin: 20px auto;
}

#map {
    width: 100%;
    height: 400px;
}

#map img {
    position: relative;
    width: 100%;
    max-width: 200px;
    top: -30px;
}

.works ul {
    position: relative;
    margin: 20px auto;
    list-style: none;
    padding: 0px;
}

.works ul li {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: -1px;
    font-style: italic;
    margin: 0px;
    display: inline-block;
    padding: 10px;
    transition: 0.4s;
    cursor: pointer;
}

.works ul li.active {
    color: #a11515;
}

.works ul li:hover {
    color: #a11515;
}

.works {
    transition: 0.4;
}

.works .portfolio {
    position: relative;
    width: 100%;
    margin: 20px auto;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0px;
    align-items: top;
}

.works .portfolio .item:hover .thumba {
    transform: scale(1.05);
}

.works .portfolio .item {
    position: relative;
    display: block;
    overflow: hidden;
    text-align: center;
    transition: 0.4s;
}

.works .portfolio .item .thumba {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: 0.4s;
}

.works .portfolio .item .thumba .far {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 20px;
    color: #fff;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.portfolio .item .thumba .play-icon {
    position: absolute;
    right: -7px;
    top: -7px;
    width: 100%;
    max-width: 75px;
    height: 75px;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.4s;
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 441.8 507.6' style='enable-background:new 0 0 441.8 507.6;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FFFFFF;} %3C/style%3E%3Ctitle%3ELayer 1%3C/title%3E%3Cpath class='st0' d='M277.1,244.3l-96.4-58.5c-4.4-2.7-9.8-2.8-14.2-0.3c-4.5,2.5-7.2,7.2-7.2,12.3v111.9c0,5.1,2.7,9.8,7.2,12.3 c2.1,1.2,4.5,1.8,7,1.8c2.6,0,5.1-0.7,7.3-2.1l96.5-58.5c1.5-0.9,2.8-2.2,3.7-3.7C284,254.3,282.4,247.5,277.1,244.3z M264.6,253.8 l-90.8,55.1V198.7L264.6,253.8z'/%3E%3C/svg%3E");
    filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.5));
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: contain;
}

.works .portfolio .item .thumba video {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: none;
    opacity: 0;
}

.works .portfolio .item .itemtitle {
    position: absolute;
    bottom: 10px;
    left: 15px;
    text-align: left;
}

.works .portfolio .item .itemtitle h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 20px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.works .portfolio .item h2 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 25px;
    font-style: italic;
    font-weight: 800;
    color: #fff;
    transition: 0.4s;
    z-index: 2;
}

.works .portfolio .gradient {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    opacity: 0.6;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0, 0, 0,1) 100%);
    z-index: 1;
    outline: 0;
}

.brands {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 20px 0px;
    color: #fff;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0px;
    align-items: center;
}

.brands img {
    width: 100%;
    max-width: 100px;
    margin: 0 auto;
}

.gear {
    position: relative;
    width: 100%;
    height: 400px;
    margin: 50px auto;
    background-position: center;
    background-size: cover;
}

.gear .info {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 81;
    width: 90%;
    text-align: center;
}

.gear .info h1 {
    position: relative;
    margin: 5px auto;
    display: block;
    font-size: 50px;
    font-style: italic;
    font-weight: 800;
    color: transparent;
    text-transform: uppercase;
    -webkit-text-stroke: 0.5px #fff;
    transition: 0.4s;
    z-index: 2;
}

.gear .info button {
    margin: 20px auto;
}


.gear .image {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    opacity: 0.4;
}

.gear p {
    margin: 10px auto;
    font-size: 14px;
    font-weight: 500;
    color: #ababab;
}

footer {
    position: relative;
    width: 100%;
    background-color: #a11515;
    text-align: center;  
    transition: 0.4s;
}

.footerWrap {
    position: relative;
    width: 80%;
    margin: 0 auto;
    padding: 80px 0;
}

footer img {
    position: relative;
    width: 100%;
    max-width: 200px;
    height: auto;
}

footer .cont {
    position: relative;
    display: inline-block;
    text-align: right;
    width: 100%;
    vertical-align: top;
    max-width: calc(100% / 2.1);
}

footer .cont:first-child {
    text-align: left;
}

footer .arr {
    position: relative;
    margin: 30px auto;
}

footer .arr p {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    color: #ffb5b5;
    font-weight: 500;
}

footer .cont ul {
    display: inline-block;
    vertical-align: top;
    margin: 0 30px;
    text-align: left;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-style: italic;
    font-size: 14px;
    padding: 0px;
}
footer .cont a {
    text-decoration: none;
    color: inherit;
}

footer .cont li:hover {
    color: #ffb5b5;
}

footer .cont li {
    display: block;
    padding: 10px;
    cursor: pointer;
    color: #fff;
    border: none;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.messageBox {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
}

.messageBox h1 {
    font-size: 60px;
    margin: 30px auto;
}

.messageBox p {
    font-size: 14px;
    margin: 30px auto;
}

.messageBox button {
    margin: 30px auto;
}

.errorBox {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
}

.errorBox span {
    font-size: 200px;
    font-weight: 700;
    margin: 0 auto;
}

.errorBox h1 {
    font-size: 45px;
    margin: 0px auto;
    text-transform: uppercase;
    font-weight: 800;
}

.errorBox p {
    font-size: 14px;
    margin: 30px auto;
}

.errorBox button {
    margin: 30px auto;
}

@media screen and (max-width: 1550px) {
    .half {
        width: 60%;
    }
}

@media screen and (max-width: 1200px) {
    .bar {
        left: 120px;
    }
    .center {
        left: 120px;
    }
    .page .container#gear .gear .gearImage .image {
        width: calc(100% / 3);
    }
    .page .container#works .works .work {
        width: calc(100% / 2);
    }
}

@media screen and (max-width: 1920px) {
    .teampage .tabout h1 {
        font-size: 80px;
    }
    .teampage .tabout span {
        font-size: 14px;
    }

    .teampage .tabout p {
        font-size: 14px;
    }
}

@media screen and (max-width: 1250px) {
    .messageBox h1 {
        font-size: 40px;
    }
    .container#get-in-touch .inner {
        width: 85%;
    }
    
    .container#get-in-touch .inner .partners img {
        max-width: 100px;
    }
    .works .portfolio {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 960px) {
    .half {
        width: 100%;
    }
    .bar {
        left: 50px;
    }
    img#logo {
        left: 60px;
    }
    .center {
        left: 60px;
    }
    .center h1 {
        font-size: 50px;
    }
    .sideText {
        left: 20px;
    }
    .container#wwd .inner .wwd .wwd-box h1 {
        font-size: 20px;
    }
    .container#wwd .inner .wwd .wwd-box p {
        width: 90%;
    }
    .makingof {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media screen and (max-width: 850px) {
    .half {
        width: 100%;
    }
    .half .line {
        background: linear-gradient(180deg, rgba(25,47,84,0) 0%, rgba(0,0,0,1) 100%);
        width: 100%;
    }
    .sideNav {
        display: none;
    }
    .pageWrap {
        max-width: 100%;
        top: 100px;
    }
    #logo {
        display: none;
    }
    nav {
        display: block;
    }
    .screen {
        position: relative;
        height: auto;
        padding: 0px;
        margin: 0px;
    }
    .half {
        position: relative;
        width: 100%;
        height: 80%;
    }
    .pageContent {
        position: relative;
        top: 0px;
    }
    .screen {
        height: calc(100% - 100px);
    }
    .center {
        position: relative;
        top: -180px;
        -webkit-transform: translate(0);
        transform: translate(0);
        left: 0px;
        width: 90%;
        margin: 0 auto;
    }
    .center h1 {
        font-size: 30px;
        padding: 0px;
        background: transparent;
    }
    
    .pageContent .container {
        padding: 50px 0px;
    }

    .pageContent .container .inner {
        width: 85%;
    }
    .pageContent .container .innerGrid {
        width: 85%;
        grid-template-columns: repeat(1, 1fr);
    }
    .showreel .fullvideo {
        max-width: 100%;
    }
    #lastwork .portfolio {
        height: 600px;
        margin: 20px auto;
        width: 85%;
    }
    #lastwork .portfolio .item .thumba {
        padding-top: 0px;
        height: 600px;
    }
    .container#wwd .inner .wwd {
        grid-template-columns: repeat(1, 1fr);
    }
    .navOpen .mobileNav {
        display: block;
    }
    .screen .sideText {
        display: none;
    }
    .sideText {
        display: block;
        position: relative;
        top: 0px;
        left: 0px;
    }
    .sideText p {
        -webkit-writing-mode: horizontal-tb;
        -ms-writing-mode: lr-tb;
        writing-mode: horizontal-tb;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        display: inline-block;
    }
    .sideText .line {
        width: 50px;
        height: 2px;
        margin: 20px auto;
        display: inline-block;
    }
    .gallery {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .page {
        top: 0px;
        padding: 0px 0px;
    }
    footer .footerWrap {
        margin: 0 auto;
        width: 100%; 
    }
    footer .cont:first-child {
        margin: 0 auto;
        text-align: center;
        display: block !important;
    }
    footer .cont ul {
        margin: 0 20px;
    }
    footer .cont {
        max-width: 100% !important;
        margin: 0 auto !important;
        text-align: center !important;
        display: block !important;
    }
    .showreel {
        display: none;
    }
    .page .container#workpage ul li {
        display: block;
        margin: 10px auto;
    }
    .messageBox h1 {
        font-size: 35px;
    }
    .messageBox p {
        font-size: 13px;
    }
    .page .container {
        width: 85%;
    }
    .works .portfolio {
        grid-template-columns: repeat(1, 1fr);
    }
    .works ul li {
        font-size: 12px;
        padding: 5px;
        margin: 
    }
    .contact .person {
        grid-template-columns: repeat(1, 1fr);
    }
    
    .contact .person .image {
         grid-row: 1 / 2;
    }
}


@media screen and (max-width: 580px) {
    .page .container#gear .gear .gearImage .image {
        width: calc(100% / 2);
    }
    .errorBox span {
        font-size: 120px;
    }
    .errorBox h1 {
        font-size: 25px;
    }
    .page .container#works ul.cat {
        text-align: center;
    }
    .page .container#works ul.cat li {
        margin: 0px auto;
        padding: 10px;
    }
    .workpage .workinfo h1 {
        font-size: 35px;
    }
    .workpage .workinfo {
        bottom: 10px;
    }
    .makingof {
        grid-template-columns: repeat(1, 1fr) !important;
    }
    .gear .info h1 { 
        font-size: 30px;
    }
}

@media screen and (max-width: 450px) {
    .page .container#gear .gear .gearImage .image {
        width: 100%;
    }
    .page .container#works ul.cat li {
        display: block;
    }
    .showreela .info h1 {
        font-size: 30px;
    }
    .workpage .workinfo h1 {
        font-size: 30px;
    }
    .container#get-in-touch .inner .partners {
        
        grid-template-columns: repeat(2, 1fr);
    }
    .container#get-in-touch .inner .partners img {  
    }
}

.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -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;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}