.mobile-rounded-image {   
    background-color: black; 
    width:   80vw;
    height:  80vw;
    border-radius: 50%;
    border: 4px solid var(--pink);
    box-shadow: 0 0 10px var(--cyan);
    z-index: 5;

}


.mobile-home-play-container{
    z-index: 6;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    font-size: 6vw;
    background-color: rgba(0, 0, 0, 0.521);
    width: 15vw;
    height: 15vw;
    border-radius: 50%;
    border: 3px solid var(--orange);
    display: flex;
    justify-content: center;
    align-items: center;
    }
    .home-play-container:hover{
    
        color: var(--orange);
        background-color: black;
    }


.mobile-cloud{
    background-color: var(--my-brow-2);
    /* background-color: rgb(255, 255, 255,.3); */
    padding: .5rem;
    border-radius: 1.2rem;
    text-align: center;   
    border: 1px solid var(--orange); 
    /* z-index: 2; */
}

.mobile-cloud:hover{
    background-color:var(--foreground);
    font-weight: 900;
    border: 3px solid var(--red);
    color:var(--purple);
}

@media only screen and (max-width: 600px){
    :root {
        --length:10vw;
        --wrench-color:var(--orange );
        /* --background-wrench:var(--background); */
        --background-wrench:var(--vampire-black);
    }

    .my-wrench{   
        border: none;      
        padding: 0px;          
    }
  
    
}

/* .mobile-app-video{
    width: 30%;
    height: 50%;
} */

.video-container {
    position: relative;
  
}

.play-pause-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    color: white;
    font-size: 3rem;
    background: rgba(0, 0, 0, 0.5);
    padding: 20px;
    border-radius: 50%;
}

/* ///////////// */

.mobile-mode-image-container{  
    position: relative;
}

.home-mobile-mode-container{
    margin-bottom: 200px;
}