body { 
  background: #455e6f; /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, #455e6f, #d9dcde); /* Chrome 10-25, Safari 5.1-6 */
  background: -webkit-gradient(linear, left bottom, left top, from(#455e6f), to(#d9dcde));
  background: -o-linear-gradient(to bottom, #455e6f, #d9dcde);
  background: linear-gradient(to bottom, #455e6f, #d9dcde); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */   
  min-height: 580px;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  position: relative;
}

/* Top */
#title h1 {
  color: #FFFCCA;
  text-align: center;
  font-family: 'Bowlby One SC', cursive;
  font-size: 80px;
}

#title h2 {
  text-align: center;
  font-family: 'Stalemate', cursive;
  color: #3fdb06;
  font-size: 56px;
  margin-top: -30px;
  margin-bottom: 50px;
}

/* Quotebox */
.message {
  background-color: #FFF;
  opacity: .7;
  text-align: center;
}

.fa-commenting {
  color: #3fdb06;
  padding-bottom: 10px;
}

#actualQuote {
  font-family: 'Arimo', sans-serif;
  font-size: 20px;
}

#actualName {
  font-family: 'Stalemate', cursive;
  font-size: 35px;
}

.buttons {
  text-align: center;
  padding-bottom: 2em;
}

.buttons a {
  padding: 0.5em;
  font-family: 'Arimo', sans-serif;
  font-size: 20px;
  color: #fff;
  background-color: #FFF;
  border-radius: 3px;
  background: #0c9c0d -webkit-gradient(linear, left top, left bottom, from(#82d18d), to(#0c9c0d));
  background: #0c9c0d -webkit-linear-gradient(#82d18d, #0c9c0d);
  background: #0c9c0d -o-linear-gradient(#82d18d, #0c9c0d);
  background: #0c9c0d linear-gradient(#82d18d, #0c9c0d);
  -webkit-box-shadow: inset #72de26 0 -1px 1px, inset 0 1px 1px #98ff98, #3caa3c 0 0 0 1px, rgba(0,0,0,.3) 0 2px 5px;
          box-shadow: inset #72de26 0 -1px 1px, inset 0 1px 1px #98ff98, #3caa3c 0 0 0 1px, rgba(0,0,0,.3) 0 2px 5px;
}

.fa-twitter-square {
  color: #fff;
  padding-right: 5px;
}

.fa-refresh {
  color: #fff;
  padding-right: 5px;
}

/* Footer */
.main-photo {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -20;
  width: 100%; 
}

/* Logotip */
.developer {
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 0.7;
}

.logo-footer {
  padding: 15px 0;
  float: left;
}

.dev {
  display: inline-block;
  padding: 5px 10px 5px; 
  margin-top: 10px;
}

.created {
  color: #fff;
  font-size: 13px;
  letter-spacing: 2px;
  font-family: "Open Sans", sans-serif;
}

.dev:hover {
  color: #fff;
  cursor: pointer;
  text-decoration: underline;
}

@media only screen and (max-width : 480px) {
  .developer {
    display: block;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
  body {
    min-height: 680px;
  }
}

@media only screen and (max-width : 380px) {
  .developer {
    display: none;
  }
}