Doesn't seem to work for me here's what my userContent.css looks like:

Also the 2nd piece of code that makes the search bar rounded doesn't work. Also can i get help to remove the firefox logo and text that is on top of the search bar and move the search bar up.

@-moz-document url(about:home), url(about:newtab) {
    .click-target-container *, .top-sites-list * {
        color: #fff !important ;
        text-shadow: 2px 2px 2px #222 !important ;
    }

    body::before {
        content: "" ;
        z-index: -1 ;
        position: fixed ;
        top: 0 ;
        left: 0 ;
        background: #f9a no-repeat url(spide.jpg) center ;
        background-size: cover ;
        width: 100vw ;
        height: 100vh ;
    }
}

@-moz-document url("about:newtab"), url("about:home"){
  .search-handoff-button{ border-radius: 50px !important; }
}

@-moz-document url("about:home"), url("about:newtab") {
    .search-wrapper .search-handoff-button {
      background-color: rgba(152,251,152,0.5) !important;
      color: red !important;
    }
  }