/* Structure */

#wrap {
  padding: 20px;
  font-family: Open Sans;
  color: #fff;
  background: #212121;
  border-radius:7px;
}

#wrap #content {
  background:url(/static/f5ab3a02a9c71ad6449a9c0abacab785.jpg) no-repeat;
  border-radius:7px;
  height:410px;
  text-align:center;
  border:1px solid #212121;
}

/* CONTENT */

#wrap #content div.title {
  font-size: 30px;
  font-weight: 400;
  margin-top:100px;
}

#wrap #content div.text {
  font-size: 16px;
  margin:0 20px 30px 20px;
}


/* BUTTONS */

#wrap button {
  background: #8a3ba6;
  border: none;
  outline: none;
  color: white;
  padding: 13px 20px;
  margin: 0px 0px 20px 0px;
  font-size: 16px;
  font-weight:bold;
}

#wrap button:hover {
  background: #ffffff;
  color: #8a3ba6;
}

#wrap button:hover, #wrap button {
  cursor: pointer;
  -webkit-transition: all 3s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

@media all and (min-device-width: 320px) and (max-width: 414px) {
  #wrap #content {
    min-width:100% !important;
    background-position:center;
  }
  #wrap #content div.title {
    font-size: 21px;
    padding:10px;
  }
  #wrap #content div.text {
    font-size: 14px;
  }
}