#container {
  width: 100%;
position: relative;
  display: flex;
  justify-content: center;
height: 20vh;
    overflow-x:clip;
}

#submit_button {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    filter:drop-shadow(5px 5px 3px rgba(0, 0, 0, 0.20)) drop-shadow(-5px -5px 3px rgba(0, 0, 0, 0.05));
    visibility: visible;
    width:50%;
    z-index: 2;
    transition: width 1s ease-out, visibility 1s ease-out;
}
#submit_button:hover {
    
    filter:drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.20)) drop-shadow(-2px -2px 3px rgba(0, 0, 0, 0.05))
}
#rocket{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    filter:drop-shadow(5px 5px 3px rgba(0, 0, 0, 0.20)) drop-shadow(-5px -5px 3px rgba(0, 0, 0, 0.05));
    visibility:hidden;
    height:0;
    transition: visibility 1s ease-out, height 0.5s ease-out;
}
#fire{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    filter:drop-shadow(5px 5px 3px rgba(0, 0, 0, 0.20)) drop-shadow(-5px -5px 3px rgba(0, 0, 0, 0.05));
    z-index:-1;
    width: 0;
    transform: translate(-50% , -50%) rotate(0turn);
    transition: transform 0.5s linear, width 1s ease-out;
}
#container_rocket {
    z-index: 1;
    height:100%;
    position:relative;
    top:50%;
    transform:translate(0,-50%);
    width:100%;
}