#page4{
    min-height: 100%;
    width: 100%;
    /* margin-top: 50px; */
    /* background: #1f1365; */padding: 0 20px;
    background: #efeae3;
}

#page4 #static-video{
    position: fixed;
    top: 25%;
    left: 70%;

    opacity: 0;

    transform: translate(-50%,0);

    background: #000;
    height: 500px;
    width: 450px;
    border-radius: 25px;

    overflow: hidden;
    transition: opacity 0.1s 0.2s ease-in;
    z-index: 99;
}


#page4 #static-video video{
    height: 100%;
    width: 100%;
    object-fit: cover;
    
}

#page4 h3{
   color: rgba(0, 0, 0, 0.575);
   position: relative;
   padding-top: 30px;
   /* background: #000; */

}


#page4 h3::before{
   content: "";
   position: absolute;

   top: 50%;
   left: 0%;
   transform: translate(0,-50%);

   height: 20px;
   width: 20px;
   border-radius:50% ;
   color: #000;

 }

 #page4 .project::before{
    height: 130px;
    width: 100%;
    content: "";
    background: #FF9831;

    position: absolute;
    top: -102%;
    left: 0%;

    z-index: 1;
    transition: all 0.1s 0.2s ease-in;
   

}


#page4 .project:hover::before {
    transform: translate(0,100%);
}
#page4 .project{
    height: 130px;
    width: 100%;
position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;

    overflow: hidden;
    border-bottom:1px solid rgba(0, 0, 0, 0.164) ;
 z-index: 3;

 cursor: pointer;
}

#page4 .project h2{
    font-size: 3vw;
    z-index: 3;

}

#page4 .project .company{
    font-size: 1vw;
    font-weight: 100;
    color: #0000006d;

    z-index: 3;
}