.parallax-container {
    width: 100%;
    height: 100vh;
    position: relative;
    top: 0px;
}

.parallax-item {
    position: absolute;
    height: 100vh;
}

.none {
    display: none;
}

.vis {
    display: block;
}

body {
    background-color: #000;
    color: #FFF;
    font-family: 'Bommer Sans';
    overflow-x: hidden;
}

a {
    color: inherit;
}

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

header {
    position: absolute;
    display: block;
    width: 100%;
    background-color: #000;
    z-index: 50;
}

.backdrop-filter {
    display: none;
    width: 100%;
    height: 150vh;
    position: absolute;
    backdrop-filter: blur(5px);
}

.people-before-pixels.content {
    padding-top: 40px;
}

header .container-fluid {
    padding: 30px 15px 22px;
}

header .logo-doma {
    cursor: pointer;
    display: block;
    float: left;
    margin-top: -10px;
}

header .menu-content-wrapper a {
    color: #FFF;
}

header .menu-content-wrapper {
    float: right;
}

header .menu-content-wrapper span {
    cursor: pointer;
    padding: 5px 15px;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 4px;
}

.social-spans {
    font-size: 20px !important;
}

.home-banner {
    display: block;
    object-fit: cover;
    object-position: center top;
    width: 100%;
    height: 100vh;
}

main .container-fluid:first-child {
    padding: 0px;
}

.arrow-up {
    width: 100px;
    position: relative;
    z-index: 70;
    display: block;
    padding: 40px 15px 70px;
    margin: -137px auto 0;
    cursor: pointer;
    text-align: center;
}

.project {
    padding: 0px;
}

.project .img-filter {
    position: absolute;
    bottom: 0px;
    z-index: 1;
}

.project img {
    display: block;
    width: 100%;
}

.project .tag {
    position: absolute;
    margin-top: -122px;
    padding-left: 32px;
    padding-right: 30px;
    z-index: 2;
    width: 100%;
}

.project .tag .title {
    display: block;
    font-size: 30px;
    font-weight: bold;
    letter-spacing: 4px;
    line-height: 27px;
    position: absolute;
}

.project .tag .type {
    display: block;
    margin-top: 35px;
    font-size: 16px;
    font-weight: 300;
    position: absolute;
    bottom: -85px;
}

.people-before-pixels {
    display: none;
}

.pbp-active .people-before-pixels {}

.people-before-pixels section.content {
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.4); */
}

.people-before-pixels .banner-pbp {
    display: block;
    width: 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
}

.people-before-pixels.content .container-fluid {
    padding-top: 50px !important;
    /* background-image: url('../images/focus-bg.png'); */
}

.col-video {
    display: none;
}


/* .people-before-pixels {
    /* background-image: url('../images/home-banner-pbp.png');
    background-size: ; 
} */

.people-before-pixels p {
    font-size: 42px;
    font-weight: 300;
    text-align: right;
}

.people-before-pixels p strong {
    font-weight: bold;
}

.video {
    display: block;
    width: 100%;
}

.people-before-pixels.content p {
    margin-top: 20px;
    margin-bottom: 0px;
}

.people-before-pixels .col-images {
    height: 100%;
}

.people-before-pixels .col-images div {
    width: 100%;
    height: 20%;
    margin: 43px 0px;
}

.people-before-pixels .col-images img {
    display: block;
    margin: 0 auto;
}


/*
// PORTFILIO
*/

#view {
    background-color: #000;
    padding-top: 50px;
    padding-bottom: 50px;
}

#view .col-lg-12,
.col-md-12,
.col-sm-12,
.col-xs-12 {
    padding: 0px;
}

#view h1 {
    font-size: 20px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

#view h3 {
    font-size: 16px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

#view p {
    font-size: 14px;
    font-weight: 200;
    line-height: 26px;
    letter-spacing: 1.5px;
}

#view .bx-content {
    padding-top: 130px;
}

.bg-portfolio {
    width: 100%;
    height: 100%;
    background-position: top;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

footer {
    padding: 115px 0px 65px;
}

footer .social-spans {
    display: block;
    float: right;
}

footer .contact-spans {
    color: #FFF;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 1px;
}

footer .contact-spans strong {
    font-weight: bold;
}

footer .col-xs-12 {
    padding: 0px 45px 0px 60px;
}

footer .fa-instagram {
    padding-right: 5px;
}


/*
KHARINA
*/

.h-960 {
    height: 690px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.h-200 {
    height: 200px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: table;
}

.layer {
    position: absolute;
    z-index: 9;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.623);
    transition: 0.4s;
}

.h-400 {
    height: 400px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: table;
}

.h-800 {
    height: 800px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: table;
}

.h-400 p.wt {
    font-size: 23px !important;
    font-weight: 100 !important;
    line-height: 35px !important;
    vertical-align: middle;
    display: table-cell;
    padding: 50px;
}

.h-800 p.wt {
    font-size: 23px !important;
    font-weight: 100 !important;
    line-height: 45px !important;
    vertical-align: middle;
    display: table-cell;
    padding: 60px;
}

.h-200 p.wt {
    font-size: 23px !important;
    font-weight: 100 !important;
    line-height: 30px !important;
    text-align: center;
    vertical-align: middle;
    display: table-cell;
    padding: 60px;
    position: relative;
    z-index: 10;
}

.h-200 p.wt .prev-next {
    font-size: 14px;
}

.h-200 p.wt .pro {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

a.next-prox {
    transition: 0.3s;
    color: #ffffff;
}

a.next-prox:hover {
    color: #ffffff94;
}

@media screen and (max-width: 1300px) {
    .project .tag .title {
        font-size: 26px;
    }
    .project .tag .type {
        font-size: 15px;
    }
}

@media screen and (max-width: 1200px) {
    .project .tag {
        margin-top: -105px;
    }
    .people-before-pixels p {
        font-size: 39px;
    }
    .people-before-pixels .col-images {
        margin-top: 38px;
    }
    .people-before-pixels .col-images div {
        margin: 0px 0px 70px;
    }
    .footer-pbp .col-xs-12 {
        padding: 0px 30px 0px 45px;
    }
}

@media screen and (max-width: 1180px) {
    /* .shop-c {
        margin-top: 0px;
    } */
}

@media screen and (max-width: 1080px) {
    /* .shop-c .type , .catch-tp .type {
        margin-top: 0px;
    } */
}

@media screen and (max-width: 992px) {
    .home-banner {
        display: block;
        object-fit: initial;
        object-position: unset;
        width: 100%;
        height: unset;
    }
    #projects .container-fluid {
        padding: 0px;
    }
    main .container-fluid:first-child {
        padding: 0px 15px;
    }
    .mobile-menu-toggle {
        width: fit-content;
        position: absolute;
        right: 30px;
        top: 15px;
    }
    .mobile-menu-toggle .close-m {
        display: none;
    }
    .mobile-menu-toggle i {
        font-size: 45px;
        opacity: unset;
        color: #FFF;
    }
    .menu-content-wrapper {
        display: none;
        position: absolute;
        z-index: 10;
        top: 74px;
        right: 0px;
        padding-bottom: 20px;
        background-color: #000;
    }
    header .menu-content-wrapper span {
        display: block;
        width: 100%;
        text-align: right;
        padding: 5px 28px 5px 15px;
    }
    .people-before-pixels {
        height: auto;
        background-size: cover;
    }
    .people-before-pixels .col-images div {
        display: inline-block;
        width: 19%;
    }
    .people-before-pixels .col-images .click-img {
        width: 60%;
    }
    .people-before-pixels .col-images .mark-img {
        width: 50%;
    }
    footer .col-xs-12 {
        padding: 0px 15px;
    }
    .arrow-up {
        padding: 40px 15px 24px;
        margin: -91px auto 0;
    }
    /* parallax */
    .parallax-item {
        height: auto;
    }
    .parallax-container {
        height: auto;
        margin-top: 81px;
    }
}

@media screen and (max-width: 768px) {
    .project .tag {
        padding: 0px 15px
    }
    .people-before-pixels.content .container-fluid {
        padding-top: 0px !important;
    }
    .people-before-pixels.content p {
        font-size: 24px;
    }
    .people-before-pixels .col-images .click-img {
        width: 70%;
    }
    .people-before-pixels .col-images .mark-img {
        width: 60%;
    }
    footer {
        padding: 40px 0px 25px;
    }
    footer .col-xs-12 {
        padding-top: 0px;
    }
    footer .contact-spans,
    footer .social-spans {
        width: 100%;
        text-align: center;
    }
    footer .social-spans {
        text-align: center;
        margin-top: 15px;
        font-size: 30px !important;
    }
}