/* .gifs{
    position:fixed;
    inset:0;
    pointer-events:none;
    overflow:hidden;
}

.video{
    position:absolute;

    width:120px;
    height:auto;

    opacity:0.9;

    will-change:transform;

    animation: float linear infinite;
} */

/* @media (max-width:768px){

    .video{
        width:80px;
    }

}

@keyframes float{

    0%{
        transform:translateY(0px) rotate(0deg);
    }

    50%{
        transform:translateY(-30px) rotate(5deg);
    }

    100%{
        transform:translateY(0px) rotate(0deg);
    }

} */

.gifs {
    /* display: flex; */
    /* width: ; */
    height: 100%;
    z-index: 1;
    overflow:hidden;
    top:0;
    left:0;
}

.video{
    position: absolute;
    height: 120px;
    /* width:100%; */
    box-shadow: 1 0 0 2px #9b9078;
}

.video:nth-child(1) {
    height: 100px;
    transform: rotate(10deg);
    border-radius: 10px;
    top:10%;
    left:12%;
}

.video:nth-child(2) {
    height: 140px;
    border-radius: 10px;
    top:30%;
    right:20%;
    transform: rotate(-30deg);
}

.video:nth-child(3) {
    opacity: 0.85;
    height: 145px;
    border-radius: 20px;
    top:15%;
    right: 37%;
    transform: rotate(-7deg);
}

.video:nth-child(4) {
    height: 130px;
    border-radius: 10px;
    top:30%;
    left:20%;
}

.video:nth-child(5) {
	
    border-radius: 50%;
    top:60%;
    right:15%;
}

.video:nth-child(6) {
    transform: rotate(20deg);
    border-radius: 10px;
    bottom:10%;
    left:15%;
}

.video:nth-child(7) {
    transform: rotate(-9deg);
    border-radius: 10px;
    bottom:30%;
    left:30%;
}
.video:nth-child(8) {
    height: 120px;
    transform: rotate(1deg);
    border-radius: 10px;
    bottom:55%;
    right:10%;
}
.video:nth-child(9) {
    transform: rotate(0deg);
    border-radius: 10px;
    top:15%;
    left:35%;
}