style.css

body{
            
    font-family: arial;
    background-color: rgb(29, 29, 29);
    color:white;
   
    margin-left: 20px;
}
#main-buttons{
    display: flex;
    justify-content: space-around;    
    min-width: 390px;
}

#rock-button-img,#paper-button-img, #scissors-button-img{
    background-color:rgb(28, 28, 28);
    width: 50%;
    cursor: pointer;
                
}

#rock-button ,#paper-button,#scissors-button{
    width: 27%;
    max-width: 200px;
    box-shadow: -4px -2px 10px 4px rgb(26, 240, 30);         
    background-color: rgb(28, 28, 28);
    /* {border: 1px solid white;} == { border-width:1px ; border: solid; border-color:white; } */
    border: solid;
    border-color: rgb(15, 176, 221);
    border-radius: 60px;
    cursor: pointer;
    
}
#rock-button:focus{
    outline: none;
}
#heading-para{
    margin-top: 10px;
    margin-bottom: 65px;
    color: rgb(31, 233, 16);
    font-size: 40px;
    font-weight: 900;
    text-align: center;
    text-decoration: underline;
    text-underline-offset: 10px;
    
}

#whatresult{
   font-size: xx-large;
   font-weight: 600;
   
   
}
#result-para{
    display: flex;
    justify-content: center;
    margin-top: 50px;
   font-size: 30px;
   font-weight: 700;
   color: rgb(84, 192, 250);
}


#result-full{
   display: flex;
   justify-content: center;
   align-items: center;
   color: rgb(255, 255, 255);
   display: none;
   font-size: x-large;
   margin-top: 50px;

   margin-bottom:50px ;
}
#your-img{
    width: 13%;
    max-width: 120px;
    background-color: rgb(28, 28, 28);
}
#pc-img{
    max-width: 120px;

    width: 13%;
    background-color: rgb(28, 28, 28);
}
#reset-button,#autoPlay-button{
    font-size: 20px;
    font-weight: 600;
    padding:0.9%;
    margin-left: 15px;
    border-radius: 8px;
    background-color: rgb(18, 165, 47);
    border: solid;
    border-color: rgb(151, 151, 206);
}
#howto{
    display: block;
    height: 200px;
    font-size: xx-large;
    margin-bottom: 70px;
    font-style: italic;
    font-family: 'Times New Roman', Times, serif;
    color: rgb(255, 255, 255);
    opacity: 1;
    transition: opacity 2s ease , height 5s ease , margin 5s ease ;
    
}

#keyboard-shortcuts{
    
    margin-left: 20px;
    margin-top: 20px;
    font-size: large;
    color: rgb(49, 249, 34);
   
   
}
.keyboard-shortcuts-span{
    
    margin-top: 3px;
    margin-bottom: 5px;
  
    
}

.middot-css{
    font-size: 24px;
    font-weight: 900;
   
}

#final-buttons{
    display: flex;
    justify-content: center;
    margin-top: 50px;
}