@import url(http://fonts.googleapis.com/css?family=Londrina+Shadow);
@import url(http://fonts.googleapis.com/css?family=Mystery+Quest);

body {
  background: url(http://subtlepatterns.com/images/transp_bg.png);
}
#content {
  margin: 0 auto;
  width: 360px;
}

#header {
  margin-bottom: 20px;
}

#title {
  font-family: 'Londrina Shadow', cursive;
  font-size: 100px;
}

button {
  margin-bottom: 20px;
}

.row {
  clear: both;
}

.column {
  border: 1px solid #595139;
  float: left;
  font-family: 'Londrina Shadow', cursive;
  font-size: 50px;
  height: 65px;
  margin: 5px;
  text-align: center;
  vertical-align: middle;
  width: 50px;
  transition: background-color 2s;
}

.column:hover {
  background-color: #A6977B;
}

/* when two cards match apply this class to them*/
.found {
  background-color: #595139;
  color: #FFFFFF;
}

#info {
  font-family: 'Londrina Shadow', cursive;
  font-size: 50px;
}

/* apply to every card when the user wins */
.won {
  background-color: #F2F0CE;
  border: 1px solid #83A603;
  color: #83A603;
}

#timer {
  font-family: 'Mystery Quest', cursive;
  font-size: 20px;
}