html { 
  background: url(../img/background.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body {
	font-family: 'Playfair Display SC', serif;
}

a {
	color: #000;
	text-decoration: none;
	font-size: 2em;
	text-align: center;
	display: block;
	padding: 50px;
	border: 8px solid rgba(220,160,140,0.0);
}

span {
  font-size: 0.5em;
  line-height: 0.7em;
}

a:hover {
	color: #000;
	border: 8px solid rgba(220,160,140,0.8);
}




#child {
  position: absolute;
    width: 50%;
    height: 50px;
    top: 50%;
    left: 50%;
    margin-left: -25%; /* margin is -0.5 * dimension */
    margin-top: -60px; 
  text-align: center;
}


@media (max-width: 1000px) {

#child {
  position: absolute;
    width: 100%;
    height: 50px;
    top: 50%;
    left: 50%;
    margin-left: -50%; /* margin is -0.5 * dimension */
    margin-top: -60px; 
  text-align: center;
}

  a {
	color: #000;
	text-decoration: none;
	font-size: 1.2em;
	text-align: center;
	display: block;
	padding: 30px;
	border: 8px solid rgba(220,160,140,0.0);
}

span {
  font-size: 0.6em;
}

a:hover {
	color: #000;
	border: 8px solid rgba(220,160,140,0.8);
}
  }


@media (max-width: 600px) {

#child {
  position: absolute;
    width: 100%;
    height: 50px;
    top: 50%;
    left: 50%;
    margin-left: -50%; /* margin is -0.5 * dimension */
    margin-top: -60px; 
  text-align: center;
}

  a {
	color: #000;
	text-decoration: none;
	font-size: 0.9em;
	text-align: center;
	display: block;
	padding: 30px;
	border: 8px solid rgba(220,160,140,0.0);
}

span {
  font-size: 0.6em;
}

a:hover {
	color: #000;
	border: 8px solid rgba(220,160,140,0.8);
}
  }