Using CSS to customize the look of a SharePoint Search Box Web Part

I recently received a request from one of our users about dropping a Search Box web part on a page of their site that would provide users with the ability to search for local content on this site.  This typically isn't a problem; however, in this situation, we already had a Search Box web part installed on the site via the master page with a rather heavily customized look.  Unfortunately, that look didn't go well at all with this new web part so, to fix the problem, I dropped an Embed Code/Script Editor web part at the bottom of their web page and added the following CSS that brought the Search Box back to a more "normal", but slightly customized look:

Here's the look they wanted (nothing really fancy, as you can see):

Here's the CSS:

<style>
   #WebPartWPQ2 #SearchBox {
      width: 650px;
   }

   #WebPartWPQ2 .ms-srch-sbLarge > .ms-srch-sb-searchLink {
      background-color: #fff;
      float: right;
      color: #fff;
      text-decoration:none;
      height: 24px;
      width: 33px;
   }


   #WebPartWPQ2 .ms-srch-sbLarge>input {
      border: 1px solid black;
      border-radius: 5px;
      font-size:16px;
      height:30px;
      width: 600px;
      margin: 0px 0px 0px 0px;
      padding: 5px 1%;
   }

   #WebPartWPQ2 .ms-srch-sbLarge-searchImg {
      position: relative;
   }
</style>

NOTE: I'm specifically targeting their web part's ID, WebPartWPQ2; therefore, you'll want to change that to reflect the ID of you web part or remove it if you want all Search Boxes to inherit that particular look.