/*
Normal Contact Pages
*/
#contacts {
  width: 100%;
}

#contacts thead td {
  width: 25%; 
  padding: 5px;
  font-weight: bold;
  color: black;
  text-align: center;
  background-color: #DCE9EA;
}

#contacts tbody td{
  font-size: 14px;
  text-align: center;
  vertical-align: top;
  padding: 5px;
}
#contacts tfoot td {
  width: 25%; 
  padding: 5px;
  font-weight: bold;
  color: black;
  text-align: center;
  background-color: #DCE9EA;
}

/*
Admin Contacts Page
*/
#admin-contacts {
  width: 100%;
}

#admin-contacts .contactHeader {
  font-weight: bold;
  color: black;
  text-align: center;
  background-color: #DCE9EA;
}

#admin-contacts td.contactTitle {
    font-size: 10px;
    width: 25%; 
}

#admin-contacts td.contactPhone {
    font-size: 10px;
    width: 25%; 
}
#admin-contacts td.contactName {
    font-size: 10px;
    width: 25%; 
}
#admin-contacts td.contactEmail {
    font-size: 10px;
    width: 25%; 
}
#admin-contacts thead {
  font-weight: bold;
  color: black;
  text-align: center;
  background-color: #DCE9EA;
}

#admin-contacts tbody td{
  font-size: 14px;
  text-align: left;
  vertical-align: top;
  padding: 5px;
  
}
#admin-contacts tfoot td {
  font-size: 12px;
  width: 33%; 
  padding: 5px;
  font-weight: bold;
  color: black;
  text-align: center;
  background-color: #DCE9EA;
}

/*  Big Button. Requires an <a> tag wrapped around an empty <span> tag.  */
#bigButton{
  background: #DCE9EA;
  position: relative;
  font-weight: bold;
  font-size: 25px;
  float: left;
  height: 200px;
  width: 300px;
  display: flex;
  justify-content: center; /* align horizontal */
  align-items: center; /* align vertical */
  border-radius: 30px;
  margin: 5px
}

#bigButton:hover{
  background: #FFC600;
}

#bigButton span{
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  /* edit: added z-index */
  z-index: 1;

  /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('empty.html');
}