/*!
 * 
 * 
 * 
 *      Autor: Tomasz Hycnar
 * 
 * 
 * 
 */
/*
Oswald, 
Khand, Athiti*/
body {
    background-color: #000;
}


/*
    INTRO
*/
.intro {
    background: #000;
    position:fixed;
    z-index: 9999;
    top:0;
    left:0;
    right: 0;
    width:100%;
    height:100%;
    -webkit-transform:translateZ(0);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 1400ms ease-in-out;
    transition: all 1400ms ease-in-out;
    /*    -webkit-transition-delay: 1s;
        transition-delay: 1s;*/
}
.intro.show {
    opacity: 1;
    visibility: visible;
}
.intro ul{
    position:relative;
    z-index:1;
    overflow:hidden;
    width:100%;
    height:100%;
    -webkit-transform:translateZ(0);
    margin: 0;
    padding: 0;
}
.intro li{
    width:100%;
    height:100%;
    position:absolute;
    overflow:hidden;
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    top:0;
    left:0;
    right: 0;
    opacity:0;
    -webkit-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;
}

.intro li div {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center center;
}
.intro li img {

}


/*
    Main Header
*/
#main-header {
    position: relative;
    float: left;
    width: 100%;
    z-index: 2;
    height: 80px;
}
@media(max-width: 768px) {
    #main-header {
        z-index: 3;
    } 
}
@media(min-width: 768px) {
    #main-header {
        height: 150px
    }
}
@media(min-width: 992px) {
    #main-header {
        height: 170px;
    }
}

/*
    Main Footer
*/
#bottom-content {
    position: fixed;
    z-index: 2;
    bottom: 0;
    left: 0;
    right: 0;
}
#bottom-content #map {
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 75vh;
    opacity: 0;
    -webkit-transition: opacity 250ms ease-in-out;
    transition: opacity 250ms ease-in-out;
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}
.open-kontakt #bottom-content #map {
    opacity: 1;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms;
}
#bottom-content .address-list {
    list-style: none;
    padding: 0;
    margin: 0;
    letter-spacing: 0;
}
#bottom-content .address-list .icon {
    width: 45px;
    margin-right: 5px;
    display: inline-block;
}
#bottom-content .address-list li {
    padding-right: 15px;
    opacity: 0;
    -webkit-transition: opacity 500ms ease-in-out;
    transition: opacity 500ms ease-in-out;
}
.open-kontakt #bottom-content .address-list li {
    opacity: 1;
}
#bottom-content .address-list li:last-child {
    padding-right: 0;
}
#bottom-content .address-list p {
    display: inline-block;
    /*line-height: 45px;*/
    color: #000;
    font-weight: 500;
    white-space: nowrap;
}
#bottom-content .address-list a {
    color: #000;
    -webkit-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;
}
#bottom-content .address-list a:hover {
    color: #e53012;
}
.btn-hide-bottom-content {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 50%;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
    -moz-transform:translateX(-50%);
    -o-transform:translateX(-50%);
    width: 50px;
    height: 38px;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
}
.open-kontakt .btn-hide-bottom-content {
    opacity: 1;
    visibility: visible;
    top: -38px;
    -webkit-transition-delay: 800ms;
    transition-delay: 800ms;
}
.btn-hide-bottom-content:hover .inner {
    background-color: #FFFFFF;
}
.btn-hide-bottom-content .inner {
    background-color: #e34a1b;
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 5px 0 3px 0;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
.btn-hide-bottom-content .inner svg {
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    width: 14px;
}
.btn-hide-bottom-content svg path,
.btn-hide-bottom-content svg rect,
.btn-hide-bottom-content svg polygon {
    fill: #FFFFFF;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
.btn-hide-bottom-content:hover svg path,
.btn-hide-bottom-content:hover svg rect,
.btn-hide-bottom-content:hover svg polygon {
    fill: #000000;
}
@media(max-width: 768px) {
    #bottom-content {
        z-index: 3;
        top: 0;
        background-color: rgba(0, 0, 0, 0.85);
        visibility: hidden;
        opacity: 0;
        -webkit-transition: opacity 250ms, visibility 250ms 0s;
        transition: opacity 250ms, visibility 250ms 0s;
    }

    #bottom-content .box {
        position: absolute;
        top: 25vh;
        left: 0;
        right: 0;
        padding: 0 30px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: opacity 250ms, visibility 250ms 0s;
        transition: opacity 250ms, visibility 250ms 0s;
    }
    .open-kontakt #bottom-content .box {
        opacity: 1;
        visibility: visible;
    }
    #bottom-content .navigation {
        background: transparent;
        opacity: 1;
        /*visibility: visible;*/
        -webkit-transition: opacity 250ms, visibility 250ms 0s;
        transition: opacity 250ms, visibility 250ms 0s;
    }
    .open-kontakt #bottom-content .navigation {
        opacity: 0;
        visibility: hidden;
    }
    #bottom-content .address-list a,
    #bottom-content .address-list p {
        color: #cecece;
    }
    #bottom-content #map {
        display: none;
    }
    .is-open-nav #bottom-content {
        visibility: visible;
        opacity: 1;
    }
    #bottom-content .menu {
        position: relative;
        top: 15px;  
        opacity: 0;
        -webkit-transition: all 300ms ease-in-out;
        transition: all 300ms ease-in-out;
    }
    .is-open-nav #bottom-content .menu {
        top: 0;
        opacity: 1;
        -webkit-transition-delay: 150ms;
        transition-delay: 150ms;
    }
}
@media(max-width: 768px) and (max-height: 360px) {
    #bottom-content {
        padding-top: 30px; 
    }
}
@media(max-width: 768px) and (min-height: 361px) {
    #bottom-content {
        padding-top: 20vh; 
    }
}
@media(min-width: 1px) {
    #bottom-content .address-list {
        display: block;
    }
    #bottom-content .address-list li {
        display: block;
    }
    #bottom-content .address-list li:last-child {
        padding-left: 55px;
    }
}
@media(min-width: 768px) {
    #bottom-content {
        bottom: -47px;
        height: 47px;
        -webkit-transition: all 800ms ease-in-out;
        transition: all 800ms ease-in-out;
    }
    .pageLoaded #bottom-content {
        bottom: 0;
    }
    .open-kontakt #bottom-content {
        height: 75vh;
    }
    .open-kontakt #main-logo {
        /*opacity: 0;*/
    }
    #bottom-content .navigation {
        background-color: rgba(0,0,0, 0.9);
        overflow: hidden;
        -webkit-transition: background 300ms ease-in-out;
        transition: background 300ms ease-in-out;
    }
    .open-kontakt #bottom-content .navigation {
        background-color: rgba(0,0,0, 1);
    }
    #bottom-content .box {
        background-color: rgba(255,255,255, 0.9);
    }
    .open-kontakt #bottom-content .box {
    }
    #bottom-content .address-list li:nth-child(1) {
        -webkit-transition-delay: 600ms;
        transition-delay: 600ms;
    }
    #bottom-content .address-list li:nth-child(2) {
        -webkit-transition-delay: 700ms;
        transition-delay: 700ms;
    }
    #bottom-content .address-list li:nth-child(3) {
        -webkit-transition-delay: 800ms;
        transition-delay: 800ms;
    }
    #bottom-content .address-list li:nth-child(4) {
        -webkit-transition-delay: 900ms;
        transition-delay: 900ms;
    }
}
@media(min-width: 992px) {
    #bottom-content {
        /*height: 44px;*/
    }
    #bottom-content .address-list {
        display: flex;
    }
    #bottom-content .address-list li {
        flex: 1;
    }
    #bottom-content .address-list li:last-child {
        padding-left: 30px;
        line-height: 50px;
    }
}
@media(min-width: 1200px) {
    #bottom-content {
        bottom: -57px;
        height: 57px;
    }    
    #bottom-content .address-list li:last-child {
        padding-left: 55px;
    }
}


/*
    Main Logo
*/
#main-logo {
    position: fixed;
    top: 0;
    padding-left: 15px;
    padding-right: 15px;
}
#main-logo h1 {
    font-size: 1px;
    letter-spacing: 0px;
    text-indent: 0px;
    margin: 0 auto;
    padding: 0;
}
#main-logo h2 {
    color: #FFFFFF;
    display: block;
    font-size: 14px;
    line-height: 18px;
    font-weight: 200;
    padding: 0;
    margin: 18px 0 0 0;
    text-align: center;
}
#main-logo a {
    display: block;
    min-height: 30px;
    opacity: 1;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}

#main-logo svg path {
    fill: #FFFFFF;
}

@media(max-width: 768px) {
    #main-logo h2 {
        display: none;
    }
}
@media(min-width: 1px) {
    #main-logo {
        left: 15px;
    }
    #main-logo h1 {
        width: 120px;
    }
}
@media(min-width: 768px) {
    #main-logo {
        background-color: #000;
        width: 140px;
        height: 150px;
        left: 50px;
        -webkit-transition: all 150ms ease-in-out;
        transition: all 150ms ease-in-out;
    }
    #main-logo h1 {
        overflow: hidden;
        width: 50px;
        -webkit-transition: all 250ms ease-in-out;
        transition: all 250ms ease-in-out;
    }
    #main-logo:hover h1 {
        width: 100%;
    }
    #main-logo svg {
        width: 228px;
        -webkit-transition: all 250ms ease-in-out;
        transition: all 250ms ease-in-out;
    }
    #main-logo:hover svg {
        width: 100%;
    }
    #main-logo svg path.land {
        opacity: 0;
        -webkit-transition: all 250ms ease-in-out;
        transition: all 250ms ease-in-out;

    }
    #main-logo:hover svg path.land {
        opacity: 1;
        -webkit-transition-delay: 150ms;
        transition-delay: 150ms;
    }
}
@media(min-width: 992px) {
    #main-logo {
        left: 75px;
        height: 170px;
    }
}

/*
    KSW logo
*/
#ksw-logo {
    position: fixed;
    top: 0;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #000;
}
#ksw-logo h2 {
    color: #FFFFFF;
    display: block;
    font-size: 13px;
    line-height: 18px;
    font-weight: 200;
    padding: 0;
    margin: 18px 0 0 0;
    text-align: center;
}
#ksw-logo a {
    display: block;
    min-height: 30px;
    opacity: 1;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}

#ksw-logo img {
    width: 100%;
    max-width: 100px;
    padding-left: 5px;
    padding-right: 5px;
}
@media(max-width: 768px) {
    #ksw-logo {
        display: none;
    }
}
@media(min-width: 768px) {
    #ksw-logo {
        right: 50px;
        width: 140px;
        height: 150px;
    }
}
@media(min-width: 992px) {
    #ksw-logo {
        right: 75px;
        height: 170px;
    }
}


/*
    Main Content
*/
#main-content {
    position: relative;
    /*    -webkit-transition: all 250ms ease-in-out;
        transition: all 250ms ease-in-out;*/
}
@media(min-width: 1px) {
    #main-content {
        z-index: 2;
        padding-top: 60px;
    }
}
@media(min-width: 768px) {
    #main-content {
        padding-top: 160px;
    }
}
@media(min-width: 992px) {
    body {
        /*overflow: hidden;*/
        min-height: 100.1vh;
    }
    #main-content {
        z-index: 1;
        position: absolute;
        padding-top: 180px;
        top: 0;
        left: 0;
        right: 0;

        /*height: 100%;*/
        /*        overflow: hidden;
                overflow: auto;*/
        /*height: 100%;*/
        /*margin-right: -18px;*/
    }
}

/*
    Box square
*/
.square-boxes {
    position: relative;
    width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: flex-end;
    align-content: flex-end;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;

}
.square-boxes .item {
    text-align: center;
    max-width: 440px;
    padding-left: 30px;
    padding-right: 30px;
    width: 100%;
    margin-bottom: 30px;
}
.square-boxes .item h2 {
    line-height: 95%;
    font-weight: 500;
    word-spacing: 300px;
}
.square-boxes .item h2::after {
    display: block;
    content: '';
    height: 8px;
    width: 138px;
    background-color: #e34a1b;
    margin: 15px auto 20px auto;
}
.square-boxes .item h2 a {
    display: block;
    color: #FFFFFF;
    -webkit-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;
}
.square-boxes .item h2 a:hover {
    color: #e34a1b;
}
.square-boxes .item .square {
    position: relative;
    float: left;
    width: 100%;
    /*border: 5px solid #FFFFFF;*/
    padding: 15px;
    display: block;
}

.square-boxes .item .square::before,
.square-boxes .item .square::after {
    box-sizing: border-box;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.square-boxes .item .square::before,
.square-boxes .item .square::after {
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    transform-origin: center;
}

.square-boxes .item .square::before {
    border-top: 5px solid #FFFFFF;
    border-bottom: 5px solid #FFFFFF;
    transform: scale3d(0,1,1);
}

.square-boxes .item .square::after {
    border-left: 5px solid #FFFFFF;
    border-right: 5px solid #FFFFFF;
    transform: scale3d(1,0,1);
}

.square-boxes .item.selected .square::before,
.square-boxes .item.selected .square::after,
.square-boxes .item .square:hover::before,
.square-boxes .item .square:hover::after {
    transform: scale3d(1,1,1);
    transition: transform 0.6s;
}
.square-boxes .item .square .square-content {
    position: relative;
    z-index: 2;
}



@media(min-width: 768px) {
    .square-boxes {
        padding-bottom: 100px;
    }
    .square-boxes .item .square {
        height: 300px;
    }
    .square-boxes .item .square .square-content {
        position: absolute;
        left: 15px;
        right: 15px;
        top: 50%;
        transform:translateY(-50%);
        -webkit-transform:translateY(-50%);
        -moz-transform:translateY(-50%);
        -o-transform:translateY(-50%);
    }
}  
@media(min-width: 992px) {   
    .square-boxes .item.col-4 {
        width: 33.33333%
    }
    .square-boxes .item.col-6 {
        width: 50%
    }
    .square-boxes .item .square {
        height: 380px;
    }
}

@media(min-width: 1px) {
    .square-boxes {
        padding-left: 0;
        padding-right: 0;
    }
}
@media(min-width: 768px) {
    .square-boxes {
        padding-left: 35px;
        padding-right: 35px;
    }
}
@media(min-width: 992px) {
    .square-boxes {
        padding-left: 50px;
        padding-right: 50px;
    }

}
@media(min-width: 1200px) {
    .square-boxes {
        padding-left: 90px;
        padding-right: 90px;
    }
}
@media(min-width: 1600px) {
    .square-boxes {
        padding-left: 200px;
        padding-right: 200px;
    }
}


/*
    Scroll square logo
*/
#scroll-square-logo {
    position: absolute; top: 40vh;bottom: 0;left:0;right:0;
}

#scroll-square-logo .box {
    width: 100px;
    height:100px;
    margin:0 auto;
    background-color: #000;
    text-align: center;
    transform: matrix(0.7071, 0.7071, -0.7071, 0.7071, 0, 0);
}
#scroll-square-logo .box:after {
    content: '';
    display: block;
    border: 1px solid #cecece;
    position: absolute;
    top: -10px;
    left:-10px;
    right: -10px;
    bottom:-10px;
    opacity: 0.8;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}

#scroll-square-logo .box-logo {
    width: 100px;
    height:100px;
    margin:0 auto;
    text-align: center;
}
#scroll-square-logo .box-logo img {
    margin-top: -100px;
}
#scroll-square-logo .box-logo img.scrollicon {
    margin-top: 30px;
    width: 130px;
    position: absolute;
    left: -15px;
    right: 0;
    -webkit-animation-name: hvr-bob-float, hvr-bob;
    animation-name: hvr-bob-float, hvr-bob;
    -webkit-animation-duration: .3s, 1.5s;
    animation-duration: .3s, 1.5s;
    -webkit-animation-delay: 0s, .3s;
    animation-delay: 0s, .3s;
    -webkit-animation-timing-function: ease-out, ease-in-out;
    animation-timing-function: ease-out, ease-in-out;
    -webkit-animation-iteration-count: 1, infinite;
    animation-iteration-count: 1, infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-direction: normal, alternate;
    animation-direction: normal, alternate;
}

#scroll-square-logo .box.no-border:after {
    opacity: 0;
}

/*
    Portfolio, Portfolio Project
*/
@media(min-width: 1px) {
    #portfolio-project #main-content,
    #portfolio #main-content {

    }
}
@media(min-width: 992px) {
    #portfolio-project #main-content,
    #portfolio #main-content {

    }
}
@media (max-width: 768px) {
    #portfolio-project .text-right {
        text-align: left;
    }  
}

.project-desc {
}
.project-desc .text {

}
.project-desc .image {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 250px;
}
.project-desc .image a {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
}
.project-desc .image a:first-child {
    display: block;
}
.project-desc {

}




.bg-desc-wall {
    background: rgba(0,0,0, 0.5);
/*    background-size: cover;
    background-position: center;*/
}


/*
    Subpage
*/
@media (max-width: 768px) {
    #subpage .text-right {
        text-align: left;
    }  
}

/* Content Offset (left, right) */
@media(min-width: 1px) {
    .content-offset {
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media(min-width: 768px) {
    .content-offset {
        padding-left: 50px;
        padding-right: 50px;
    }
}
@media(min-width: 992px) {
    .content-offset {
        padding-left: 90px;
        padding-right: 90px;
    }
}
@media(min-width: 1600px) {
    .content-offset {
        padding-left: 230px;
        padding-right: 230px;
    }
}

/*
    Show Photo
*/
.show-photo {
    position: relative;
    display: block;
}
.show-photo::after {
    position: absolute;
    font-family: "FontAwesome";
    content: '\f002';
    color: rgba(255, 255, 255, 0.8);
    font-size: 3.5em;
    top: 45%;
    left: 0;
    right: 0;
    opacity: 0;
    transform:translateY(-50%) scale(0.9);
    -webkit-transform:translateY(-50%) scale(0.9);
    -moz-transform:translateY(-50%) scale(0.9);
    -o-transform:translateY(-50%) scale(0.9);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    text-align: center;
}
.show-photo:hover::after {
    opacity: 1;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}

/*
    Show Video
*/
.show-video {
    position: relative;
    display: block;
}
.show-video::after {
    position: absolute;
    font-family: "FontAwesome";
    /*content: '\f16a';*/
    content: url(../../images/layout/icons/svg/play.svg); 
    width: 100px;
    top: 50%;
    left: 50%;
    right: 0;
    opacity: 1;
    transform:translate(-50%, -50%) scale(1);
    -webkit-transform:translate(-50%, -50%) scale(1);
    -moz-transform:translate(-50%, -50%) scale(1);
    -o-transform:translate(-50%, -50%) scale(1);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    text-align: center;
}
.show-video:hover::after {
    transform:translate(-50%, -50%) scale(1.1);
    -webkit-transform:translate(-50%, -50%) scale(1.1);
    -moz-transform:translate(-50%, -50%) scale(1.1);
    -o-transform:translate(-50%, -50%) scale(1.1);
}

/*
    Menu
*/
.menu {
    margin: 0;
    padding: 0;
    list-style: none;
}
.menu li {
    text-transform: uppercase;
    font-weight: 300;
}
.menu li .bg,
.menu li .bg-color {
    display: none;
}
.menu li a {
    display: block;
    color: #FFFFFF;
    -webkit-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;
}
.menu li.current a,
.menu li:hover a {
    color: #e53012;
}

/*
    Main Menu
*/
#main-menu {
    position: relative;
    min-height: 1px;
    display: block;
    float: left;
}
#main-menu .menu li {
    display: inline-block;
    font-size: 1.2em;
}
#main-menu .menu li:last-child {
    padding-right: 0;
}
#main-menu .menu li a {
    color: #cecece;
}
#main-menu .menu li.current a,
#main-menu .menu li:hover a {
    color: #e34a1b;
}
@media(max-width: 768px) {
    #main-menu {
        width: 100%;
        text-align: center;
    }
    #main-menu .menu li {
        display: block;
        padding-right: 0px;
    }   
    #main-menu .menu li a {
        line-height: 10vh;
    }
}
@media(min-width: 769px) {
    #main-menu {
        padding-top: 13px;
        padding-bottom: 13px;
    }
    #main-menu .menu li {
        padding-right: 40px;
    }
    #main-menu .menu li a:after {
        position: relative;
        content: '';
        display: block;
        background-color: #ac3916;
        height: 1px;
        width: 0%;
        -webkit-transition: all 300ms ease-in-out;
        transition: all 300ms ease-in-out;
    }
    #main-menu .menu li.current a:after {
        width: 100%;
    }
}
@media(min-width: 992px) {
    #main-menu .menu li a:after {
        /*top: 0px;*/
    }
    #main-menu .menu li {
        padding-right: 80px;
    }
}
@media(min-width: 1200px) {
    #main-menu .menu li a:after {
        top: -4px;
    }
}

/*
    Social Menu
*/
#social-menu {
    position: relative;
    min-height: 1px;
    display: block;
    float: left;
}
#social-menu .menu li {
    display: inline-block;
    padding-right: 40px;
    font-size: 1.2em;
}
#social-menu .menu li:last-child {
    padding-right: 0;
}

#social-menu .menu li a {
    color: #cecece;
}
#social-menu .menu li:hover a {
    color: #e34a1b;
}
@media(max-width: 768px) {
    #social-menu {
        width: 100%;
        margin-top: 5vh;
        text-align: center;
    }
    #social-menu .menu li {
        /*display: block;*/
        padding-right: 30px;
    }
}
@media(min-width: 768px) {
    #social-menu {
        padding-top: 13px;
        padding-bottom: 13px;
    }
}
/*
    Lang Menu
*/
#lang-menu {
    position: relative;
    min-height: 1px;
    display: block;
    float: left;
}
#lang-menu .menu li {
    display: inline-block;
    padding-right: 10px;
    font-size: 1em;
}
#lang-menu .menu li:last-child {
    padding-right: 0;
}

#lang-menu .menu li a {
    color: #8f8f8f;
}
#lang-menu .menu li.current a {
    color: #cecece;
}
#lang-menu .menu li:hover a {
    color: #e34a1b;
}
@media(max-width: 768px) {
    #lang-menu {
        width: 100%;
        margin-top: 5vh;
        text-align: center;
    }
    #lang-menu .menu li {
        /*display: block;*/
        padding-right: 30px;
    }
}
@media(min-width: 768px) {
    #lang-menu {
        margin-left: 0;
        padding-top: 13px;
        padding-bottom: 13px;
    }
}
@media(min-width: 992px) {
    #lang-menu {
        margin-left: 40px;
    }
}


/*
    Menu Hamburger
*/
.btn-toggle-nav {
    position: fixed;
    display: none;
    z-index: 9999;
    top: 30px;
    right: 15px;
}
@media(max-width: 768px) {
    .btn-toggle-nav {
        display: block;
    }
}


/*
    Background Container
*/
.background-container {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
}
.background-container ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.background-container ul li {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    /*opacity: 0;*/
    -webkit-transition: all 800ms ease-in-out;
    transition: all 800ms ease-in-out;
}
.background-container ul li.notLoaded {
    opacity: 0;
}
.background-container ul li.loaded {
    opacity: 1;
}
.background-container ul li .bg {
    background-position: bottom center;
    background-size: cover;
    height: 100%;
}

/*
    Background Shadow
*/
.background-shadow {
    position: fixed;
    left: 0;
    right: 0;
    /*min-height: 100px;*/

    height: 20vh;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 2s, visibility 2s 0s;
    transition: opacity 2s, visibility 2s 0s;
}
.pageLoaded .background-shadow {
    opacity: 0.8;
    visibility: visible;
}
.background-shadow.disabled {
    opacity: 0;
    visibility: hidden;
}
.background-shadow.top {
    top: 0;
    max-height: 200px;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0.5) 0%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0.5) 0%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom,  rgba(0,0,0,0.5) 0%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00ffffff',GradientType=0 );
}
.background-shadow.bottom {
    bottom: 0;
    max-height: 100px;
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 );
}
/* #portfolio-project .background-shadow.bottom,
#portfolio .background-shadow.bottom {
    background: -moz-linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(187, 187, 187, 0.2) 100%);
    background: -webkit-linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(187, 187, 187, 0.2) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(187, 187, 187, 0.2) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#bbbbbb',GradientType=0 );
} */
@media(max-width: 768px) {
    .background-shadow.top {
        z-index: 2;
    }
}


/*
    Litera EM
*/
.draw-svg.show,
#litera-em.show {
    opacity: 1;
}
.draw-svg,
#litera-em {
    position: relative;
    opacity: 0;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}
#litera-em {
    z-index: -2;
}
#litera-em svg {
    position: fixed;
    bottom: 0;
    right: 0;
    max-width: 70vw;
    max-height: 100%;
    opacity: 0.8;
}
.draw-svg svg polygon,
.draw-svg svg path,
.draw-svg svg rect,
#litera-em svg path {
    /*fill: #808080;*/
    fill: transparent;
    stroke: #fe5a29;
}
.draw-svg.show svg path,
.draw-svg.show svg polygon,
.draw-svg.show svg rect {
    fill-opacity: 0; 
    stroke-dasharray: 1400;
    stroke-dashoffset: 1400;
    /*animation: draw 5s infinite linear;*/
    animation-name: drawSvg;
    animation-duration: 5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
}

#litera-em.show svg path, 
#litera-em.show polygon {
    fill-opacity: 0; 
    stroke-dasharray: 6400;
    stroke-dashoffset: 6400;
    /*animation: draw 5s infinite linear;*/
    animation-name: drawSvg;
    animation-duration: 4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
}

@-webkit-keyframes drawSvg {
    90% {
        stroke-dashoffset: 0;
        stroke-width: 3;
        fill-opacity: 0;
    }
    100% {
        stroke-dashoffset: 0;
        stroke-width: 3;
        fill-opacity: 1;
    }
}

@keyframes drawSvg {
    90% {
        stroke-dashoffset: 0;
        stroke-width: 3;
        fill-opacity: 0;
    }
    100% {
        stroke-dashoffset: 0;
        stroke-width: 3;
        fill-opacity: 1;
    }
}


/*
    Text slider - homepage
*/
.text-slider {
    position: fixed;
    top: 55%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}
.text-slider ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.text-slider ul li {
    position: absolute;
}
.text-slider ul li .text {
    margin: 0;
}
.text-slider ul li .text,
.text-slider ul li .subtext {
    opacity: 0;
    margin-bottom: 0;
    -webkit-transition: -webkit-transform 0.5s, opacity 0.5s ease-in-out;
    transition: transform 0.5s, opacity 0.5s ease-in-out;
    -webkit-transform: translate3d(-15px, 0px, 0);
    transform: translate3d(-15px, 0px, 0);
}
.text-slider ul li.active .text,
.text-slider ul li.active .subtext {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}
.text-slider ul li .text {
    font-size: 3em; 
    font-weight: 900;
}
.text-slider ul li .text,
.text-slider ul li .subtext {
    color: #FFFFFF;
}
@media(min-width: 1px) {
    .text-slider {
        left: 30px;
        right: 30px;
    }
}
@media(min-width: 768px) {
    .text-slider {
        left: 50px;
        right: 50px;
    }
}
@media(min-width: 992px) {
    .text-slider {
        left: 30%;
        right: 90px;
    }
}
@media(min-width: 1200px) {
    .text-slider {
        left: 55%;
    }
}
@media(min-width: 1600px) {
    .text-slider {
        left: 63%;
    }
}

/*
    Tools bar
*/
.tools-bar {
    position: fixed;
    z-index: 3;
    left: 5px;
    bottom: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none; 
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.tools-bar:after,
.tools-bar .inner {
    content: '';
    clear: both;
    display: block;
}
.tools-bar .inner {
    position: relative;
    width: 100px;
    height: 30px;
}
.tools-bar .inner p {
    line-height: 25px;
    font-size: 13px;
    font-weight: 300;
    display: inline-block;
    /*text-shadow: 0 0 8px #000;*/
    text-align: center;
}
.tools-bar .inner p,
.tools-bar .inner a {
    color: #000;
    font-weight: 600;
}
.tools-bar .inner a {
    display: block;
}
@media(min-width: 1px) {
    .tools-bar {
        padding-bottom: 30px;
    }
}
@media(min-width: 768px) {
    .tools-bar {
        padding-bottom: 100px;
    }
}
/*@media(min-width: 992px) {
    .tools-bar {
        padding-left: 90px;
        padding-right: 90px;
    }
}
@media(min-width: 1440px) {
    .tools-bar {
        padding-left: 170px;
        padding-right: 170px;
    }
}*/

/*
    Grid switcher
*/
.gird-switcher {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 80px;
    height: 30px;
}
.gird-switcher .switch-btn {
    position: absolute;
    height: 30px;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    cursor: pointer;
    -webkit-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
    /*    -webkit-transition-delay: 150ms;
        transition-delay: 150ms;*/
    transform:scale(0); -webkit-transform:scale(0); 
    -moz-transform:scale(0); -o-transform:scale(0);
}
.gird-switcher .switch-btn svg,
.gird-switcher .switch-btn img {
    position: absolute;
    top: 50%;
    width: 40px;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}
.gird-switcher .switch-btn svg path,
.gird-switcher .switch-btn svg rect,
.gird-switcher .switch-btn svg polygon {
    fill: #000000;
    -webkit-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}
.grid-slider .gird-switcher .switch-btn svg path,
.grid-slider .gird-switcher .switch-btn svg rect,
.grid-slider .gird-switcher .switch-btn svg polygon {
    fill: #FFFFFF;
}
.gird-switcher .switch-btn:hover svg path,
.gird-switcher .switch-btn:hover svg rect,
.gird-switcher .switch-btn:hover svg polygon {
    fill: #e34a1b;
}
.gird-switcher .switch-btn.on {
    opacity: 1;
    visibility: visible;
    transform:scale(1); -webkit-transform:scale(1); 
    -moz-transform:scale(1); -o-transform:scale(1);
}

/*
    Projects List
*/
#projects-list {
    position: relative;
    float: left;
    width: 100%;
}
#projects-list .projects {
    position: relative;
    width: 100%;
    /*    opacity: 0;
        -webkit-transition: opacity 0.35s;
        transition: opacity 0.35s;*/
}
#projects-list .projects .project {
    /*    -webkit-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;*/
    float: left;
    width: 100%;
}
#projects-list .projects .project .inner .cover-img {
    width: 100%;
    max-width: 100%;
}
#projects-list .projects .project .inner .caption h2,
#projects-list .projects .project .inner .caption p {
    opacity: 0;
    color: #FFFFFF;
    /*text-shadow: 0 0px 40px #333;*/
}
#projects-list .projects .project .inner .caption .title {
    font-weight: 500;
}
#projects-list .projects .project a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

/* Slider */
#projects-list.grid-slider {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

#projects-list.grid-slider .projects .project {
    position: relative;
    overflow: hidden;
}
#projects-list.grid-slider .projects,
#projects-list.grid-slider .projects .project a {
    /*cursor: -webkit-grab;*/
}
#projects-list.grid-slider .projects .owl-item.active.center .project a {
    cursor: pointer;
}
#projects-list.grid-slider .projects .project .inner {
    -webkit-transition: background 500ms;
    transition: background 500ms;
}
#projects-list.grid-slider .projects .owl-item.active.center .project .inner {
    background: #2f3238;
}
#projects-list.grid-slider .projects .project .inner .caption {
    position: absolute;
    left: 0;
}

#projects-list.grid-slider .projects .project .inner .caption h2,
#projects-list.grid-slider .projects .project .inner .caption p {
    opacity: 0;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
    -webkit-transition: opacity 500ms, -webkit-transform 500ms;
    transition: opacity 500ms, transform 500ms;
}

#projects-list.grid-slider .projects .owl-item.active.center .project .inner .caption h2,
#projects-list.grid-slider .projects .owl-item.active.center .project .inner .caption p {
    opacity: 1;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}

#projects-list.grid-slider .projects .project .inner .caption {
    /*padding: 30px 40px;*/
}
#projects-list.grid-slider .projects .project .inner .caption h2 {
    margin: 0 0 20px 0;
    font-size: 6vmin;
}
#projects-list.grid-tiles .projects .project .inner .caption p {
    margin: 0;
    font-size: 15px;
    font-weight: 300;
}
#projects-list.grid-slider .projects .project .inner .cover-img {
    margin: 0 auto;
    opacity: 1;
    -webkit-transition: opacity 500ms ease-in-out;
    transition: opacity 500ms ease-in-out;
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}
#projects-list.grid-slider .projects .owl-item.active.center .project .inner .cover-img {
    opacity: 1;
}
#projects-list.grid-slider .projects .owl-item.active.center .project:hover .inner .cover-img {
    opacity: 1;
}
@media(min-width: 1px) {
    #projects-list.grid-slider .projects .project .inner .caption {
        padding: 0 60px;
        right: 0;
        text-align: center;
    }
}
@media(max-width: 768px) {
    #projects-list.grid-slider .projects .project .inner .caption {
        top: 50%;
        transform:translateY(-50%);
        -webkit-transform:translateY(-50%);
        -moz-transform:translateY(-50%);
        -o-transform:translateY(-50%);
    }
}
@media(min-width: 768px) {
    #projects-list.grid-slider .projects .project .inner .caption {
        text-align: left;
    }
}
@media(min-width: 992px) {
    #projects-list.grid-slider .projects .project .inner .caption {
        padding: 0 15px 0 90px;
        right: auto;
        width: 50%;
        bottom: 25vh;
    }
}

/* Arrows - left, right */
.owl-nav {
    position: absolute;
    top: 43%;
    left: 0;
    right: 0;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -o-transform:translateY(-50%);
}
.owl-nav .owl-prev,
.owl-nav .owl-next {
    position: absolute;
    z-index: 10;
}
.owl-nav .owl-prev {
    left: 0;
}
.owl-nav .owl-next {
    right: 0;
}
.owl-nav .arrow {
    font-size: 6vmin;
    padding: 30px;
}
.owl-nav div:hover .arrow {
    color: #e53012 !important;
}
@media(min-width: 1px) {
    .owl-nav .arrow {
        color: rgba(255,255,255, 1);
    }
}
@media(min-width: 768px) {
    .slider .owl-nav .arrow,
    #projects-list.grid-slider .owl-nav .arrow {
        color: rgba(255,255,255, 0);
        -webkit-transition: color 0.35s;
        transition: color 0.35s;
    }
    .slider:hover .owl-nav .arrow,
    #projects-list.grid-slider:hover .owl-nav .arrow {
        color: rgba(255,255,255, 1);
    }
    .slider .owl-nav .owl-prev,
    #projects-list.grid-slider .owl-nav .owl-prev {
        left: 20px;
    }
    .slider .owl-nav .owl-next,
    #projects-list.grid-slider .owl-nav .owl-next {
        right: 20px;
    }
}
@media(min-width: 992px) {
    .slider .owl-nav .owl-prev,
    #projects-list.grid-slider .owl-nav .owl-prev {
        left: 60px;
    }
    .slider .owl-nav .owl-next,
    #projects-list.grid-slider .owl-nav .owl-next {
        right: 60px;
    }
}
/*@media(min-width: 1200px) {
    #projects-list.grid-slider .owl-nav .owl-prev {
        left: 90px;
    }
    #projects-list.grid-slider .owl-nav .owl-next {
        right: 90px;
    }
}*/

/* Dots */
#projects-list.grid-slider .owl-dots {
    position: fixed;
    bottom: 0;
    z-index: 1;
    height: 50px;
}
#projects-list.grid-slider .owl-dots .owl-dot {
    position: relative;
    display: inline-block;
    background-color: #f7f7f7;
}
#projects-list.grid-slider .owl-dots .owl-dot:last-child {
    margin-right: 0;
}
#projects-list.grid-slider .owl-dots .owl-dot::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 0%;
    -webkit-transition: width 400ms ease-in-out;
    transition: width 400ms ease-in-out;
    background-color: #df2f12;
}
#projects-list.grid-slider .owl-dots .owl-dot.active::after {
    width: 100%;
}
@media(min-width: 1px) {
    #projects-list.grid-slider .owl-dots {
        bottom: 10vh;
        left: 50%;
        transform:translateX(-50%);
        -webkit-transform:translateX(-50%);
        -moz-transform:translateX(-50%);
        -o-transform:translateX(-50%);
    }
    #projects-list.grid-slider .owl-dots .owl-dot {
        width: 10px;
        height: 3px;
        margin-right: 8px;
    }
}
@media(min-width: 480px) {
    #projects-list.grid-slider .owl-dots .owl-dot {
        width: 15px;
        height: 3px;
        margin-right: 8px;
    }
}
@media(min-width: 768px) {
    #projects-list.grid-slider .owl-dots {
        bottom: 15vh;
        left: 70px;
        transform:translateX(0%);
        -webkit-transform:translateX(0%);
        -moz-transform:translateX(0%);
        -o-transform:translateX(0%);
    }
    #projects-list.grid-slider .owl-dots .owl-dot {
        width: 20px;
        height: 3px;
        margin-right: 10px;
    }
}
@media(min-width: 992px) {
    #projects-list.grid-slider .owl-dots {
        left: 90px;
    }
    #projects-list.grid-slider .owl-dots .owl-dot {
        width: 20px;
        height: 3px;
        margin-right: 10px;
    }
}



/* Tiles */
#projects-list.grid-tiles .projects {
    /*    opacity: 1;*/
    position: relative;
    float: left;
    width: 100%;
}
#projects-list.grid-tiles .projects .project {
    position: relative;
    float: left;
}
#projects-list.grid-tiles .projects .project .inner {
    position: relative;
    overflow: hidden;
    -webkit-transition: background 0.35s;
    transition: background 0.35s;
    background-color: rgba(0, 0, 0, 0);
}
#projects-list.grid-tiles .projects .project:hover .inner {
    background: #000;
}
#projects-list.grid-tiles .projects .project .inner .cover-img {
    opacity: 0.5;
}
#projects-list.grid-tiles .projects .project:hover .inner .cover-img {
    opacity: 0.5;
}
#projects-list.grid-tiles .projects .project .inner .caption {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 5px;
    overflow: hidden;
}
#projects-list.grid-tiles .projects .project .inner .caption .category {
    margin-top: 20px;
    text-transform: uppercase;
}
#projects-list.grid-tiles .projects .project .inner .caption h2 {
    margin-top: 10px;
    margin-bottom: 15px;
}
#projects-list.grid-tiles .projects .project .inner .caption p {
    margin: 0;
}

/* Projects List - Grid Tiles */
@media(min-width: 1px) {
    #projects-list.grid-tiles .projects {
        padding-left: 15px;
        padding-right: 15px;
    }
    #projects-list.grid-tiles .projects .project {
        width: 100%;
        margin-bottom: 30px;
    }
    #projects-list.grid-tiles .projects .project .inner .caption h2 {
        font-size: 20px;
    }
}
@media(max-width: 768px) {
    #projects-list.grid-tiles .projects .project .inner {
        background: #2f3238;
    }
    #projects-list.grid-tiles .projects .project .inner .cover-img {
        opacity: 0.3;
    }
}
@media(min-width: 768px) {
    #projects-list.grid-tiles .projects {
        padding-left: 35px;
        padding-right: 35px;
    }
    #projects-list.grid-tiles .projects .project {
        width: 50%;
        padding-left: 15px;
        padding-right: 15px;
        margin-bottom: 30px;
    }
}
@media(min-width: 992px) {
    #projects-list.grid-tiles .projects {
        padding-left: 70px;
        padding-right: 70px;
    }
    #projects-list.grid-tiles .projects .project {
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom: 40px;
    }
    #projects-list.grid-tiles .projects .project .inner .caption h2 {
        font-size: 25px;
    }
}
@media(min-width: 1200px) {
    #projects-list.grid-tiles .projects {
        padding-left: 90px;
        padding-right: 90px;
    }
    #projects-list.grid-tiles .projects .project {
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 60px;
    }
}
@media(min-width: 1440px) {
    #projects-list.grid-tiles .projects .project {
        width: 33.33333333%;
        padding-left: 30px;
        padding-right: 30px;
        margin-bottom: 60px;
    }
}
@media(min-width: 1600px) {
    #projects-list.grid-tiles .projects {
        padding-left: 200px;
        padding-right: 200px;
    }
}
@media(min-width: 1800px) {
    #projects-list.grid-tiles .projects .project {

    }
}



/*---------------*/
/***** Ming *****/
/*---------------*/

#projects-list.grid-tiles .projects .project figure.effect-ming img {
    opacity: 0.9;
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
}

/*#projects-list.grid-tiles .projects .project figure.effect-ming figcaption::before {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    border: 1px solid #fff;
    box-shadow: 0 0 0 30px rgba(255,255,255,0.2);
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: scale3d(1.4,1.4,1);
    transform: scale3d(1.4,1.4,1);
}*/
#projects-list.grid-tiles .projects .project figure.effect-ming figcaption::before,
#projects-list.grid-tiles .projects .project figure.effect-ming figcaption::after {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}

/*#projects-list.grid-tiles .projects .project figure.effect-ming figcaption::before {
    border-top: 1px solid rgba(255,255,255, 0.5);
    border-bottom: 1px solid rgba(255,255,255, 0.5);
    -webkit-transform: scale(0,1);
    transform: scale(0,1);
}

#projects-list.grid-tiles .projects .project figure.effect-ming figcaption::after {
    border-right: 1px solid rgba(255,255,255, 0.5);
    border-left: 1px solid rgba(255,255,255, 0.5);
    -webkit-transform: scale(1,0);
    transform: scale(1,0);
}*/

#projects-list.grid-tiles .projects .project figure.effect-ming h2 {
    padding: 0 25px;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}

#projects-list.grid-tiles .projects .project figure.effect-ming p {
    padding: 0 25px;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}

#projects-list.grid-tiles .projects .project figure.effect-ming:hover h2 {
    opacity: 1;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}

#projects-list.grid-tiles .projects .project figure.effect-ming:hover figcaption::after,
#projects-list.grid-tiles .projects .project figure.effect-ming:hover figcaption::before,
#projects-list.grid-tiles .projects .project figure.effect-ming:hover p {
    opacity: 1;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}


#projects-list.grid-tiles .projects .project figure.effect-ming:hover figcaption {
    background-color: rgba(58,52,42,0);
}

#projects-list.grid-tiles .projects .project figure.effect-ming:hover img {
    opacity: 0.4;
}
@media(max-width: 768px) {
    #projects-list.grid-tiles .projects .project figure.effect-ming h2 {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }

    #projects-list.grid-tiles .projects .project figure.effect-ming figcaption::after,
    #projects-list.grid-tiles .projects .project figure.effect-ming figcaption::before,
    #projects-list.grid-tiles .projects .project figure.effect-ming p {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }

    #projects-list.grid-tiles .projects .project figure.effect-ming figcaption {
        background-color: rgba(58,52,42,0);
    }

    #projects-list.grid-tiles .projects .project figure.effect-ming img {
        opacity: 0.4;
    } 
}

/*
    Gallery Slider
*/
.gallery-slider::after {
    content: '';
    clear: both;
    display: block;
    width: 100%;
}
.gallery-slider ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.gallery-slider h3,
.gallery-slider p {
    color: #000;
}
.gallery-slider .slider img {
    height: 50vh;
    min-height: 250px;
    width: 100%;
    object-fit: cover;
}


/*
    Background transparent, Background transparent before
*/
.bg-black-trans, .bg-black-trans-before:before {
    background-color: rgba(0,0,0, 0.8);
}

.bg-black-trans-before:before {
    content: '';
    position: absolute;
    top: 0;
    z-index: -1;
    display: block;
    bottom: 0;
    left: 0;
    right: 0;
}
@media(min-width: 992px) {
    .bg-black-trans-before:before {
        /*top: -5vh;*/
        top: -25vh;
    }
}

/*
    Side Slider
*/
#side-slider {
    display: none;
    position: fixed;
    z-index: 2;
    top: 0;
    bottom: 0;
    right: -165px;
    width: 165px;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
#side-slider.open {
    right: 0px;
}
#side-slider::after,
#side-slider::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
}
#side-slider::after {
    /*    bottom: 0;
        max-height: 50px;
        background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
        background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
        background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 );*/
}
#side-slider .box {
    position: relative;
    background-color: rgba(255,255,255, 1);
    width: 100%;
    height: 100%;
}
#side-slider .box .btn-nav {
    position: absolute;
    left: 0;
    right: 0;
    background-color: #FFFFFF;
    text-align: center;
    cursor: pointer;
}
#side-slider .box .btn-nav.toggle {
    z-index: 3;
    top: 0;
    right: 165px;
    left: auto;
    padding: 15px 15px 11px 15px;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    background-color: #e34a1b;
}
#side-slider .box .btn-nav.toggle:hover {
    background-color: #FFFFFF;
}
#side-slider.open .box .btn-nav.toggle {
    right: 0;
    background-color: #FFFFFF;
}
#side-slider .box .btn-nav.toggle svg {
    width: 12px;
}
#side-slider .box .btn-nav.up {
    display: none;
    top: 0;
    padding-top: 7vmin;
    padding-bottom: 20px;
}
#side-slider .box .btn-nav.down {
    display: none;
    bottom: 0;
    padding-top: 20px;
    padding-bottom: 7vmin;
}
#side-slider .box .btn-nav svg {
    width: 25px;
}
#side-slider .box .btn-nav svg polygon,
#side-slider .box .btn-nav svg rect {
    fill: #FFFFFF;
    -webkit-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}
#side-slider.open .box .btn-nav svg polygon,
#side-slider.open .box .btn-nav svg rect,
#side-slider .box .btn-nav:hover svg polygon,
#side-slider .box .btn-nav:hover svg rect {
    fill: #000;
}
#side-slider.open .box .btn-nav:hover svg polygon,
#side-slider.open .box .btn-nav:hover svg rect {
    fill: #e34a1b;
}

#side-slider .box .items {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    height: 80%;
    width: 100%;
    display: block;
    overflow: hidden;
}
#side-slider .box .items,
#side-slider .box .optiscroll-content {
    padding: 0 20px; 
}
#side-slider .box .optiscroll-v {
    visibility: visible;
}
#side-slider .box .optiscroll-vtrack {
    width: 9px;
    right: 4px;
    cursor: pointer;
    opacity: 0;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}
#side-slider:hover .box .optiscroll-vtrack {
    opacity: 1;
}
#side-slider .box .items .slider {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}
#side-slider .box .items::after,
#side-slider .box .items::before {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    content: '';
    height: 50px;
}
#side-slider .box .items::before {
    top: 0;
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}
#side-slider .box .items::after {
    bottom: 0;
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
}
#side-slider .box .items .item {
    width: 100%;
    display: block;
    opacity: 0.3;
    -webkit-transition: opacity 150ms ease-in-out;
    transition: opacity 150ms ease-in-out;
}
#side-slider .box .items .item:hover {
    opacity: 1;
}
#side-slider .box .items .item img {
    width: 100%;
    max-width: 100%;
}
@media(min-width:768px) {
    #side-slider {
        display: block;
    }
}

/*
    Load animation
*/
.load-anim-1 {
    opacity: 0;
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    -webkit-transition: opacity 900ms, -webkit-transform 800ms;
    transition: opacity 900ms, transform 800ms;
}
.load-anim-1.loaded {
    opacity: 1;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}



.fadeView.ng-enter {
    -webkit-animation: enter_sequence 800ms linear;
    -moz-animation: enter_sequence 800ms linear;
    -o-animation: enter_sequence 800ms linear;
    animation: enter_sequence 800ms linear;
    /*    -webkit-animation-delay: 600ms;
        animation-delay: 600ms;*/
}
@-webkit-keyframes enter_sequence {
    from { opacity:0; }
    to { opacity:1; }
}
@-moz-keyframes enter_sequence {
    from { opacity:0; }
    to { opacity:1; }
}
@-o-keyframes enter_sequence {
    from { opacity:0; }
    to { opacity:1; }
}
@keyframes enter_sequence {
    from { opacity:0; }
    to { opacity:1; }
}


/*
    Row Height
*/
.row-height {
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
}
.col-height {
    display: table-cell;
    float: none;
    height: 100%;
}
.col-top {
    vertical-align: top;
}
.col-middle {
    vertical-align: middle;
}
.col-bottom {
    vertical-align: bottom;
}

@media (min-width: 480px) {
    .row-xs-height {
        display: table;
        table-layout: fixed;
        height: 100%;
        width: 100%;
    }
    .col-xs-height {
        display: table-cell;
        float: none;
        height: 100%;
    }
    .col-xs-top {
        vertical-align: top;
    }
    .col-xs-middle {
        vertical-align: middle;
    }
    .col-xs-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 768px) {
    .row-sm-height {
        display: table;
        table-layout: fixed;
        height: 100%;
        width: 100%;
    }
    .col-sm-height {
        display: table-cell;
        float: none;
        height: 100%;
    }
    .col-sm-top {
        vertical-align: top;
    }
    .col-sm-middle {
        vertical-align: middle;
    }
    .col-sm-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 992px) {
    .row-md-height {
        display: table;
        table-layout: fixed;
        height: 100%;
        width: 100%;
    }
    .col-md-height {
        display: table-cell;
        float: none;
        height: 100%;
    }
    .col-md-top {
        vertical-align: top;
    }
    .col-md-middle {
        vertical-align: middle;
    }
    .col-md-bottom {
        vertical-align: bottom;
    }
}

@media (min-width: 1200px) {
    .row-lg-height {
        display: table;
        table-layout: fixed;
        height: 100%;
        width: 100%;
    }
    .col-lg-height {
        display: table-cell;
        float: none;
        height: 100%;
    }
    .col-lg-top {
        vertical-align: top;
    }
    .col-lg-middle {
        vertical-align: middle;
    }
    .col-lg-bottom {
        vertical-align: bottom;
    }
}



body[class*="fp-viewing"] #main-content {
    padding-top: 0 !important;
}


@media(max-width: 768px) {
    .fp-tableCell, .fp-section {
        height: auto !important;
        display: block !important;
    }
    .fp-section {
        margin-top: 60px;
    }
}
@media(min-width: 1px) {
    .oferta .section .black {
        background-color: rgba(0,0,0,1);
    }
}
@media(min-width: 768px) {
    .fp-section {
        overflow: hidden;
    }
    .oferta .section .anim-1,
    .oferta .section .anim-2,
    .oferta .section .anim-3 {
        position: relative;
        transform:scale(0.8); 
        -webkit-transform:scale(0.8); 
        -moz-transform:scale(0.8); 
        -o-transform:scale(0.8);
        -webkit-transition: all 1000ms ease-in-out;
        transition: all 1000ms ease-in-out;
        -webkit-transition-delay: 500ms;
        transition-delay: 500ms;
    }
    .oferta .section.active .anim-1,
    .oferta .section.active .anim-2,
    .oferta .section.active .anim-3 {
        -webkit-transition-delay: 400ms;
        transition-delay: 400ms;
        transform:scale(1); -webkit-transform:scale(1); 
        -moz-transform:scale(1); -o-transform:scale(1);
    }

    .oferta .section .black {
        background-color: rgba(0,0,0,0);
        -webkit-transition: background 800ms ease-in-out;
        transition: background 800ms ease-in-out;
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms; 
    }
    .oferta .section.active .black {
        background-color: rgba(0,0,0,1);
        -webkit-transition-delay: 1000ms;
        transition-delay: 1000ms; 
    }
}


.oferta .section .text {
    position: relative;
}
.oferta .section p {
    line-height: 200%;
}
.oferta .section h2 span {
    color: #e34a1b;
}
.oferta .section h2,
.oferta .section h3 {
    font-weight: 500;
}
/*.oferta .section.active h2,
.oferta .section.active h3 {
    
}*/


/*.oferta .section:nth-child(1) .row {
    text-align: center;
}
.oferta .section:nth-child(1) img {
    position: relative;
    opacity: 0;
    visibility: hidden;
    width: 160px;
    bottom: -50vh;
    -webkit-transition: all 1000ms ease-in-out;
    transition: all 1000ms ease-in-out;
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}
.oferta .section:nth-child(1).active img {
    bottom: 0;
    opacity: 0.6;
    visibility: visible;
    -webkit-transition-delay: 400ms;
    transition-delay: 400ms;
    -webkit-animation-name: hvr-bob-float, hvr-bob;
    animation-name: hvr-bob-float, hvr-bob;
    -webkit-animation-duration: .3s, 1.5s;
    animation-duration: .3s, 1.5s;
    -webkit-animation-delay: 0s, .3s;
    animation-delay: 0s, .3s;
    -webkit-animation-timing-function: ease-out, ease-in-out;
    animation-timing-function: ease-out, ease-in-out;
    -webkit-animation-iteration-count: 1, infinite;
    animation-iteration-count: 1, infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-direction: normal, alternate;
    animation-direction: normal, alternate;
}*/
@-webkit-keyframes hvr-bob {
    0% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }
    100% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}
@keyframes hvr-bob {
    0% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }
    100% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}



.oferta .section:nth-child(1) h2 {
    margin: 0;
}
@media(min-width: 1px) {
    .oferta .section:nth-child(1) h2 {
        padding: 0 30px;
    }
    .oferta .section:nth-child(1) .text {
        padding: 30px;
    }
}
@media(min-width: 768px) {
    .oferta .rotate-left {
        -ms-transform: rotate(-90deg);
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }
    .oferta .section:nth-child(1) h2 {
        position: absolute;
        top: 3px;
        right: -146px;
        font-size: 130px;
        padding: 0;
    }
    .oferta .section:nth-child(1) .text {
        display: table;
        padding-top: 30px;
        padding-bottom: 30px;
        padding-left: 60px;
        padding-right: 60px;
        height: 223px;
    }
    .oferta .section:nth-child(1) .anim-1 {
        opacity: 0;
        visibility: hidden;
        margin-top: 100%;
    }
    .oferta .section:nth-child(1).active .anim-1 {
        opacity: 1;
        visibility: visible;
        margin-top: 0;
    }
    .oferta .section:nth-child(1) .anim-2 {
        opacity: 0;
        right: -100%;
    }
    .oferta .section:nth-child(1).active .anim-2 {
        opacity: 1;
        right: 0;
    }
    .oferta .section:nth-child(1) .text p {
        display: table-cell;
        vertical-align: middle;
    }
}
@media(min-width: 992px) {
    .oferta .section:nth-child(1) h2 {
        position: absolute;
        top: -11px;
        right: -137px;
        font-size: 120px;
        padding: 0;
    }
    .oferta .section:nth-child(1) .text {
        height: 223px;
    }
}






.oferta .section:nth-child(2) h2 {
    margin: 0;
}
@media(min-width: 1px) {
    .oferta .section:nth-child(2) .text:first-child {
        padding-top: 0;
    }
    .oferta .section:nth-child(2) .text {
        padding: 30px;
    }
}
@media(min-width: 768px) {
    .oferta .section:nth-child(2) h2 {
        font-size: 79px;
    }
    .oferta .section:nth-child(2) .text {
        padding-top: 15px;
        padding-bottom: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .oferta .section:nth-child(2) p {
        text-align: right;
        margin-top: 15px;
    }
    .oferta .section:nth-child(2) .anim-1 {
        opacity: 0;
        visibility: hidden;
        top: -50vh;
    }
    .oferta .section:nth-child(2).active .anim-1 {
        opacity: 1;
        visibility: visible;
        top: 0;
        /*        -webkit-transition-delay: 600ms;
                transition-delay: 600ms;*/
    }
    .oferta .section:nth-child(2) .anim-2 {
        opacity: 0;
        visibility: hidden;
        bottom: -50vh;

    }
    .oferta .section:nth-child(2).active .anim-2 {
        opacity: 1;
        visibility: visible;
        bottom: 0;
    }
}
@media(min-width: 992px) {
    .oferta .section:nth-child(2) h2 {
        font-size: 107px;
    }
}
@media(min-width: 1200px) {
    .oferta .section:nth-child(2) h2 {
        font-size: 130px;
    }
}




.oferta .section:nth-child(3) h2 {
    margin: 0;
}
.oferta .section:nth-child(3) h3 {
    margin: 0;
    line-height: 100%;
}
@media(min-width: 1px) {
    .oferta .section:nth-child(3) h2 {
        padding: 0 30px;
    }
    .oferta .section:nth-child(3) h3 {
        padding: 0 30px;
    }
    .oferta .section:nth-child(3) .text {
        padding: 30px;
    }
}
@media(min-width: 768px) {
    .oferta .section:nth-child(3) h3 {
        font-size: 59px;
        padding: 0;
    }
    .oferta .section:nth-child(3) h2 {
        position: absolute;
        top: 74px;
        right: -100px;
        font-size: 80px;
        padding: 0;
    }
    .oferta .section:nth-child(3) .text {
        display: table;
        padding: 15px 0;
        height: 120px;
    }
    .oferta .section:nth-child(3) .text p {
        display: table-cell;
        vertical-align: top;
    }

    .oferta .section:nth-child(3) .anim-1 {
        opacity: 0;
        visibility: hidden;
        left: -50%;
    }
    .oferta .section:nth-child(3).active .anim-1 {
        opacity: 1;
        visibility: visible;
        left: 0%;
    }
    .oferta .section:nth-child(3) .anim-2 {
        opacity: 0;
        visibility: hidden;
        top: -50vh;
    }
    .oferta .section:nth-child(3).active .anim-2 {
        opacity: 1;
        visibility: visible;
        top: 0;
    }
    .oferta .section:nth-child(3) .anim-3 {
        opacity: 0;
        visibility: hidden;
        bottom: -50vh;
    }
    .oferta .section:nth-child(3).active .anim-3 {
        opacity: 1;
        visibility: visible;
        bottom: 0;
    }
}
@media(min-width: 992px) {
    .oferta .section:nth-child(3) h3 {
        font-size: 78px;
    }
    .oferta .section:nth-child(3) h2 {
        top: 86px;
        right: -117px;
        font-size: 94px;
    }
    .oferta .section:nth-child(3) .text {
        height: 120px;
    }
}
@media(min-width: 1200px) {
    .oferta .section:nth-child(3) h3 {
        font-size: 96px;
    }
    .oferta .section:nth-child(3) h2 {
        top: 97px;
        right: -130px;
        font-size: 105px;
    }
}





.oferta .section:nth-child(4) h2 {
    margin: 0;
}
@media(min-width: 1px) {
    .oferta .section:nth-child(4) h2 {
        padding: 0 30px;
    }
    .oferta .section:nth-child(4) .text {
        padding: 15px;
        width: 55%;
        float:right;
    }
}
@media(min-width: 768px) {
    .oferta .section:nth-child(4) h2 {
        font-size: 75px;
        text-align: right;
        padding: 0;
        line-height: 100%;
    }
    .oferta .section:nth-child(4) .text {
        display: table;
        padding: 15px;
        width: 150px;
        height: 150px;
        text-align: center;
        margin-bottom: -75px;
        float:none;
    }
    .oferta .section:nth-child(4) .text p {
        display: table-cell;
        vertical-align: middle;
    }
    .oferta .section:nth-child(4) .anim-1 {
        opacity: 0;
        visibility: hidden;
        left: -50vw;
    }
    .oferta .section:nth-child(4).active .anim-1 {
        opacity: 1;
        visibility: visible;
        left: 0%;
    }
    .oferta .section:nth-child(4) .anim-2 {
        opacity: 0;
        visibility: hidden;
        bottom: -50vh;
    }
    .oferta .section:nth-child(4).active .anim-2 {
        opacity: 1;
        visibility: visible;
        bottom: 0;
    }
}
@media(min-width: 992px) {
    .oferta .section:nth-child(4) h2 {
        font-size: 100px;
    }
    .oferta .section:nth-child(4) .text {
        width: 200px;
        height: 200px;
        margin-bottom: -100px;
    }
}
@media(min-width: 1200px) {
    .oferta .section:nth-child(4) h2 {
        font-size: 123px;
    }
    .oferta .section:nth-child(4) .text {
        width: 240px;
        height: 240px;
        margin-bottom: -120px;
    }
}



.oferta .section:nth-child(5) h2 {
    margin: 0;
}
@media(min-width: 1px) {
    .oferta .section:nth-child(5) h2 {
        padding: 0 30px;
    }
    .oferta .section:nth-child(5) .text {
        padding: 15px;
        width: 55%;
        float:right;
    }
}
@media(min-width: 768px) {
    .oferta .section:nth-child(5) h2 {
        font-size: 92px;
        padding: 0;
        line-height: 100%;
    }
    .oferta .section:nth-child(5) .text {
        display: table;
        padding: 15px;
        width: 100%;
        float:none;
    }
    .oferta .section:nth-child(5) .text p {
        display: table-cell;
        vertical-align: middle;
    }
    .oferta .section:nth-child(5) .anim-1 {
        opacity: 0;
        visibility: hidden;
        top: -50vh;
    }
    .oferta .section:nth-child(5).active .anim-1 {
        opacity: 1;
        visibility: visible;
        top: 0;
    }
    .oferta .section:nth-child(5) .anim-2 {
        opacity: 0;
        visibility: hidden;
        bottom: -50vh;
    }
    .oferta .section:nth-child(5).active .anim-2 {
        opacity: 1;
        visibility: visible;
        bottom: 0;
    }
}
@media(min-width: 992px) {
    .oferta .section:nth-child(5) h2 {
        font-size: 122px;
    }
}
@media(min-width: 1200px) {
    .oferta .section:nth-child(5) h2 {
        font-size: 149px;
    }
}