.bekker .holder{
    overflow-x: hidden;
}

.bekker-header{
    height: 100vh;
    background: url(../../i/portfolio/bekker/header-bg.png) no-repeat center top/cover;
}
.bekker-header-top{
    display: flex;
    justify-content: space-between;
}
.bekker-header-top .menu a{
    color: #cdcad3 !important;
    border-bottom: 1px dashed #fff !important;
    font-size: 12px;
}
.bekker-header-top .logo-back{
    background: url(../../i/portfolio/bekker/navback.png) no-repeat center;
}
.bekker-logo{
    margin: 20vh auto;
    max-width: 20vh;
}
.bekker-logo img{
    width: 100%;
}
.bekker-comp-block{
    position: relative;
    top:-40vh ;
    perspective-origin: 0;
    perspective: 8px;
    transform-style: preserve-3d;
}
.bekker-comp-img{
    width: 75%;
    display: block;
    margin: 0 auto;
    z-index: 2;
    position: relative;
}
.bekker-veg{
    width: 50%;
    position: absolute;
    top: 20%;
    left: 0%;
    z-index: 1;
}
.bekker-spoon{
    position: absolute;
    top: 60%;
    right: 2%;
    width: 200px;

}
.bekker-pelmen{
    position: absolute;
    top: 7%;
    left: 17%;
    z-index: 2;
    width: 120px;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
    transform: translateZ(-1px);
}

.bekker-manti{
    position: absolute;
    top: 30%;
    right: 5%;
    z-index: 2;
    width: 120px;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
    transform: translateZ(-1px);
}
.bekker-b2{
    background: #020100;
    position: relative;
    padding-bottom: 100px;
}
.bekker-b2 .holder{
    overflow: initial;
}
.b-2-text{
    color: #fff;
    margin: 0 auto;
    text-align: center;
    width: 50%;
    margin-top: -30vh;
}
.flex{
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}
.bekker-title{
    font-size: 32px;
    margin-bottom: 10px;
    color: #fff;
    text-align: center;
}
.bekker-g-text{
    color: #a2a2a2;
    font-size: 16px;
}
.bekker-dashed{
    color: #a2a2a2;
    border-bottom: 1px dashed #a2a2a2;
}
.bekker-sub-title{
    margin-bottom: 5px;
    font-size: 20px;
}
.bekker-img-box{
    display: flex;
    justify-content: space-between;
    margin-top: 70px;
    width: 100%;
}
.bekker-img{
    width: 20%;
    position: relative;
}
.bekker-donut{
    position: absolute;
    top: -15%;
    right: 0;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
}
.food-type{
    width: 100%;
}

.bekker-tomato{
    position: absolute;
    bottom: -15%;
    right: 0;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
}
.bekker-gr{
    position: absolute;
    top: 0;
    left: 0;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
}
.bekker-s-pelmeni{
    position: absolute;
    top: -15%;
    right: 15%;
    transition: 1s;
    perspective: 1000px;
    transform-style: inherit;
    transform-origin: center;
}
.bekker-b3{
    background: url(../../i/portfolio/bekker/b3-bg.png) no-repeat center/cover;
    padding: 140px 0 250px;
    position: relative;
}
.bekker-b3 .holder{
    overflow-x: initial;
}
.bekker-about{
    margin: 0 auto;
    text-align: center;
}
.bekker-about p{
    margin: 30px auto;
    line-height: 1.8;
    width: 50%;
    font-size: 16px;
}
.bekker-title-2{
    font-size: 20px;
}
.bekker-b3-img{
    position: relative;
    width: 100%;
}

.b-b3-image{
    display: block;
    margin: 0 auto;
    width: 60%;
    z-index: 2;
    box-shadow: 0px 0px 25px #000;
    margin-top: 80px;
}
.b-b3-about{
    position: absolute;
    top: 42%;
    left: 2%;
    width: 30%;
    z-index: 1;
    box-shadow: 0 0 25px #000;
}
.b-b3-history{
    position: absolute;
    top: -10%;
    right: 2%;
    width: 30%;
    z-index: 3;
    box-shadow: 0 0 25px #000;
}
.b-b3-mobile-1{
    position: absolute;
    top: -25%;
    left: 7%;
    width: 10%;
    box-shadow: 0 0 25px #000;
}
.b-b3-mobile-2{
    position: absolute;
    top: 36%;
    right: 14%;
    width: 10%;
    z-index: 4;
    box-shadow: 0 0 25px #000;
}
.b-b3-tomato-b{
    position: absolute;
    top: 23%;
    left: 0%;
    width: 7%;
    z-index: 4;
    animation: float 5s ease-in-out infinite;
}
.b-b3-tomato-s{
    position: absolute;
    top: -15%;
    right: 0%;
    width: 5%;
    z-index: 4;
    animation: float 10s ease-in-out infinite;
}
.b-b3-chilli{
    position: absolute;
    top: 15%;
    right: 20%;
    width: 10%;
}
.b-b3-brokkoli{
    position: absolute;
    top: 35%;
    left: 19%;
    width: 5%;
    z-index: 4;
    animation: float 15s ease-in-out infinite;
}
.bekker-link{
    text-decoration: none;
    text-align: center;
    display: block;
    width: min-content;
    margin: 0 auto;
}
.bekker-b4 .holder{
    overflow-x: initial;
}
.bekker-b4{
    position: relative;
    background: url(../../i/portfolio/bekker/b-4.png) no-repeat center/cover;
    padding-bottom: 200px;

}
.b-b4-last{
    width: 40%;
    text-align: center;
    margin: 0 auto;
    color: #fff;
}
.b-b4-last .bekker-g-text{
    margin-top: 10px;
}
.b-b4-fish{
    position: relative;
    width: 60%;
    margin-top: -10%;
    margin: 0 auto;
    margin-top: -10%;
}

.b-b4-sausages{
    position: absolute;
    top: 5%;
    left: 20%;
    width: 7%;
    animation: float 5s ease-in-out infinite;

}
.b-b4-salat{
    position: absolute;
    top: 70%;
    left: 0%;
    width: 7%;
    animation: float 7s ease-in-out infinite;

}
.b-b4-stake{
    position: absolute;
    top: 30%;
    right: 0%;
    width: 28%;
}
.b-b4-ukrainen{
    position: absolute;
    top: 30%;
    left: 0%;
    width: 25%;
}
.b-b4-burger{
    position: absolute;
    top: 10%;
    right: 10%;
    width: 7%;
    animation: float 10s ease-in-out infinite;
}
.b-b4-tree{
    position: absolute;
    bottom: 0;
    width: 100%;
}
.bekker-b4 .bekker-title{
    margin: 80px 0;
}
.bekker-bottom-logo{
    margin-top: 80px;
    display: block;
}



@keyframes float {
    0% {
       transform: translateY(0px);
    }
    50%{
        transform: translateY(-15px);
    }
    100%{
        transform: translateY(0px);
    }
}


