Create Button that reveals mailing list option's in HTML

Question

Im trying to create a button which once clicked gives the user the option to subscribe to the mailing list, Using HTML and CSS.

Instead of having the subscribe option already loaded on the page. I want it so the user has to click on the button which says 'Join mailing list' which will then open up the subscribe window which requires the user to enter the email address of their choice.

I'm using Mailchimp for the subscribe option,

Thanks In advance,

Here is the code from Mailchimp which I have customised a little bit to give it a personalised look,

<a href="" target="_top"> Join Mailing list</a>
<a href="" target="_top">Pre-order</a>
<a href="about.html" target="_top">About</a>
<a href="" target="_top"> Join Mailing list</a>
<!-- Begin MailChimp Signup Form -->
<link href="./pakut London._files/slim-081711.css" rel="stylesheet" type="text/css">
<style type="text/css">
  #mc_embed_signup {
    clear: left;
    font: 14px;
  }
  
  #mc_embed_signup input.email {
    display: block;
    padding: 8px 0;
    margin: 30px 4% 10px 0;
    text-indent: 5px;
    width: 100%;
    min-width: 130px;
  }
  
  #mc_embed_signup input.button {
    display: block;
    width: 200px;
    margin: 0 auto;
    float: initial;
  }
  
  #mailinglist {
    cursor: pointer;
  }
  
  input#mc-embedded-subscribe {
    width: 200px;
    margin: 0 auto;
  }
  
  input#mce-EMAIL {
    color: #000;
  }
</style>
<div id="mc_embed_signup" style=" width: 100%; margin: 0 auto; 
                  text-align: center; ">
  <form action="http://akuto.us10.list-manage.com/subscribe/post?
                  u=874a60bd5ea2dc324b56e1c45&amp;id=edabb3e674" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-
                  form" class="validate" target="_blank" novalidate="">
    <div id="mc_embed_signup_scroll">
      <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required="">
      <!-- real people should not fill this in and expect good 
                      things - do not remove this or risk form bot signups-->
      <div style="position: absolute; left: -5000px;"><input type="text" name="b_874a60bd5ea2dc324b56e1c45_edabb3e674" tabindex="-1" value=""></div>
      <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">
      </div>
    </div>
  </form>
</div>