.section-top{
    padding-top: 20px;
}
.top-box{
    align-items: flex-end;
}
.cloud-mask .video{
    position: relative;
}
.cloud-mask-top .video::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #FF6949;
    mix-blend-mode: darken;
    z-index: 1;
    pointer-events: none;
}
.section-top .bolls{
    position: absolute;
    left: 0;
    top: 0;
    max-width: 56%;
}
.mask-shadow{
    position: absolute;
    z-index: 2;
}
.image-previe{
    position: absolute;
    transform: scale(1.005);
}
.cloud-mask-top .video{
    width: 842px;
    clip-path: url(#cloudClip-top);
    -webkit-clip-path: url(#cloudClip-top);
}
.cloud-mask-top video{
    width: 842px;
    height: 590px;
    z-index: 1;
    position: relative;
}

.section-video .h1{
    margin: 24px 0;
    font-size: 54px;
}
.section-video .text{
    margin-bottom: 24px;
}
.video-grid{
    align-items: center;
}

.cloud-mask1 .video{
    width: 730px;
    clip-path: url(#cloudClip);
    -webkit-clip-path: url(#cloudClip);
}
.cloud-mask2 .video {
    width: 830px;
    clip-path: url(#cloudClip2);
    -webkit-clip-path: url(#cloudClip2);
}
.cloud-mask1 video{
    width: 730px;
    height: 550px;
}
.cloud-mask2 video {
    width: 830px;
    height: 590px;
    object-position: left;
}

@media screen and (max-width: 1300px) {
    .cloud-mask .video video {
        width: 600px;
        height: 450px;
    }
    .cloud-mask-top .video{
        width: 600px;
        clip-path: url(#cloudClip-medium-top);
        -webkit-clip-path: url(#cloudClip-medium-top);
    }

    .section-video .h1{
        font-size: 44px;
    }
    .cloud-mask1 .video {
        width: 600px;
        clip-path: url(#cloudClip-medium);
        -webkit-clip-path: url(#cloudClip-medium);
    }
    .cloud-mask2 .video {
        width: 600px;
        clip-path: url(#cloudClip2-medium);
        -webkit-clip-path: url(#cloudClip2-medium);
    }
}
@media screen and (max-width: 1100px) {
    .section-video .h1{
        font-size: 40px;
        letter-spacing: 1px;
    }
}
@media screen and (max-width: 700px) {
    .section-video .h1{
        font-size: 32px;
    }
}	
@media screen and (max-width: 850px) {
    .section-top{
        padding-top: 0;
    }
    .cloud-mask-top{
        margin: -20px 0 -40px;
        z-index: -1;
    }
    .section-top .bolls {
        left: -20px;
        top: 245px;
        min-width: 450px;
    }
} 
@media screen and (max-width: 500px) {
    .section-top .bolls {
        top: 165px;
    }
    .cloud-mask .video video {
        width: 400px;
        height: 300px;
    }
    .cloud-mask-top .video{
        width: 400px;
        clip-path: url(#cloudClip-small-top);
        -webkit-clip-path: url(#cloudClip-small-top);
    }
    .cloud-mask1 .video {
        width: 400px;
        clip-path: url(#cloudClip-small);
        -webkit-clip-path: url(#cloudClip-small);
    }
    .cloud-mask2 .video {
        width: 400px;
        clip-path: url(#cloudClip2-small);
        -webkit-clip-path: url(#cloudClip2-small);
    }
}

@media screen and (max-width: 420px) {
    .section-top .bolls {
        top: 206px;
    }
}

@media screen and (max-width: 400px) {
    .section-top .bolls {
        top: 232px;
    }
}