@import url('https://fonts.googleapis.com/css?family=Dosis|Open+Sans|Raleway');

* {
  box-sizing: border-box;
}

body, html {
  background-color: #ffb7c5;
  height: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-family: Dosis;
  color: #ffffff;
  text-align: center;
}

p, ol, ul {
  font-family: Open Sans;
  font-size: 20px;
  color: #5d5b6a;
}

.box {
  text-align: left;
}

a. {
  font-family: Open Sans;
  font-size: 20px;
  color: #598234;
}

 /* unvisited link */
a:link {
  font-family: Open Sans;
  font-weight: bold;
  font-size: 20px;
  color: #034C52;
  text-decoration: none;
}

/* visited link */
a:visited {
  font-family: Open Sans;
  font-size: 20px;
  font-weight: bold;
  color: #ffffff;
  text-decoration: none;
}

/* mouse over link */
a:hover {
  font-family: Open Sans;
  font-size: 20px;
  color: #017075;
  font-style: none;
  font-weight: bold;
  text-decoration: none;
}

/* selected link */
a:active {
  font-family: Open Sans;
  font-size: 20px;
  color: #017075;
  font-weight: bold;
  text-decoration: none;
} 

/* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .leftcolumn, .rightcolumn {   
    width: 100%;
    padding: 0;
  }
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 400px) {
  .topnav a {
    float: none;
    width: 100%;
  }
}


/* Banded table for conversations */
table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  text-align: left;
  padding: 8px;
}