<span class="loading style-1"></span>

<span class="loading style-2"></span>

<span class="loading style-3"></span>

.loading {
  display: inline-block;
  margin: 5em;
  border-width: 30px;
  border-radius: 50%;
  -webkit-animation: spin 1s linear infinite;
     -moz-animation: spin 1s linear infinite;
       -o-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  }

.style-1 {
  border-style: solid;
  border-color: #444 transparent;
  }

.style-2 {
  border-style: double;
  border-color: #444 transparent;
  }

.style-3 {
  border-style: double;
  border-color: #444 #fff #fff;
  }

@-webkit-keyframes spin {
  100% { -webkit-transform: rotate(359deg); }
  }

@-moz-keyframes spin {
  100% { -moz-transform: rotate(359deg); }
  }

@-o-keyframes spin {
  100% { -moz-transform: rotate(359deg); }
  }

@keyframes spin {
  100% {  transform: rotate(359deg); }
  }

/* Base styles */
html {
  background: #eee url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/billie_holiday.png');
  text-align: center;
  }