Hugo's Dribbble invite

HTML

<script src="http://wildwebwatch.com/js/prefixfree.min.js"></script>
<link rel="stylesheet" href="http://tank-a-faire.com/codePen/fontAwesome/font-awesome.css">
<div class="wrapper">
  <div class="topContent">
    <div class="ball">
      <span class="ball-element be1"></span>
      <span class="ball-element be2"></span>
    </div>
    <h1>I would like to join the <span>Dribbble</span> community.</h1>
    <hr>
  </div>
  <div class="bottomContent">
    
    <div class="simpleContainer">
      <p>Could you <span>invite</span> me please ?</p>
      <a class="btn" id="yes" href="#"><i class="icone icon-thumbs-up"></i></a>
      <a class="btn" id="no" href="#"><i class="icone icon-thumbs-down"></i></a>
      <hr>
    </div>
  </div>
</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Pacifico);
@import url(http://fonts.googleapis.com/css?family=Ubuntu);
@import url(http://fonts.googleapis.com/css?family=Karla);

* { box-sizing: border-box; }

hr { visibility: hidden; clear:both; } 

body {
     background: #333 url(http://codepen.io/images/classy_fabric.png); 
  -webkit-font-smoothing: antialiased;
  font-family: 'Ubuntu', sans-serif;
  color: #FAFAFA;
  font-size: 16px;
  line-height: 1.4;
  text-shadow: 0 -1px 0 black;
}

.wrapper {
  width: 350px;
  margin: 30px auto;
  padding: 20px;
  position: relative;
  
  border-radius: 0.4em;
  border: 1px solid black;
  background: #353535;
  background: linear-gradient(45deg, #151515, #383838);
  box-shadow: 
    0 0 10px 3px rgba(0,0,0,0.4),
    0 0 150px 50px rgba(155,155,155,0.1);
}

.wrapper:after {
     content: "";
  position: absolute;
  height: 1px;
  width: 96%;
  background: white;
  background: -moz-linear-gradient(left, #151515, #464647 5%, #fff 20%, #4a4a4a 70%);
  background: -ms-linear-gradient(left, #151515, #464647 5%, #fff 20%, #4a4a4a 70%);
  background: -o-linear-gradient(left, #151515, #464647 5%, #fff 20%, #4a4a4a 70%);
  background: -webkit-gradient(linear, 0 0, 100% 0, from(#151515), color-stop(0.05, #464647), color-stop(0.2, #fff), color-stop(0.7, #4a4a4a));
  background: -webkit-linear-gradient(left, #151515, #464647 5%, #fff 20%, #4a4a4a 70%);
  background: linear-gradient(left, #151515, #464647 5%, #fff 20%, #4a4a4a 70%);
  top: 0;
  left: 2%;
}

.wrapper:before,
.topContent:before {
     content: "";
  position: absolute;
  width: 38px;
  height: 1px;
  background: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.7), rgba(0,0,0,0));
  background: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.7), rgba(0,0,0,0));
  background: -o-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.7), rgba(0,0,0,0));
  background: -webkit-gradient(linear, 0 0, 100% 0, from(rgba(0,0,0,0)), color-stop(0.5,...

JavaScript

// Elements
var button_yes = $('#yes'),
    button_no = $('#no'),
    content_area = $('.bottomContent'),
    loader = $('<div class="loader"><ul><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul></div>'),
    response = $('<p></p>');

// Messages
var message_yes = 'Thank you! <br><br> Please send me your invite to <span>hugo.giraudel gmail.com</span>',
    message_no = '*Sad panda* <br><br> <span>{x}</span> persons don\'t like me!';

/**
 * Holds the elements to be changed.
 */
var Container = {
    el : $('.simpleContainer'),
    
    hide : function() {
        this.el.addClass('hideMe');
    },
    
    setContent : function(content) {
        this.el.html('');
        this.el.append(content);
        this.el.removeClass('hideMe');
    }
}

button_yes.click(function(e) {
    request({answer : 1});
});

button_no.click(function(e) {
    request({answer : 0});
});

/**
 * Handle the answer: 
   - update database count
   - remove current content 
   - add content based on the given answer
 */
function request(args) {
    
    Container.hide();
    
    setTimeout(function() {
        Container.setContent(loader);
    
        $.ajax({
            dataType: 'jsonp', 
            jsonp: 'jsonp',
            data: { answer: args.answer },
            
            // Just an ultra simple script to increase the answer count
            url: 'http://timpietrusky.koding.com/codepen/hugos-dribbble-invite',
            success: function(data) {
                
                Container.hide();
                
                setTimeout(function() {
                    if (data.success) {
                        // Yes
                        if (args.answer) {
                            message_yes = message_yes.replace('{x}', data.data.yes);
                            response.html(message_yes);
                        // No
                        } else {
                            message_no =...