style.css

body {
  background-color: #BDBDBD;
  font-family: 'Roboto', sans-serif;
}

p {
  color: white;
  font-size: 3vmin;
  font-weight: 300;
  float: center;
  word-wrap: break-word;

}

.header1 {
  color: #323234;
  font-family: 'Roboto';
  font-weight: 100;
  font-size: 10vmin;
  word-wrap: break-word;
}

.header2 {
  color: #323234;
  font-weight: 300;
  font-size: 7vmin;
  word-wrap: break-word;
}

.card {
  background-color: #caa571;
  height: 50%;
}

.card-content {
  background-color: #caa571;
  color: #323234;
  word-wrap: break-word;
}

.svg {
  /*padding: inherit;*/
}


.z-depth-0 {
  -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0, 0);
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0);
  height: 50px;
}

.nav-wrapper {
  background-color: #D8D8D8;
  padding: 0 30px 0 30px;
  height: 50px;
}

.light-container {
  background-color: #BDBDBD;
  height: 100vh;
  overflow:hidden;
  padding: 10%;
  margin: 0 auto;
}

.dark-container {
  background-color: #323234;
  height: 100vh;
  overflow:hidden;
  padding: 10%;
  margin: 0 auto;
}

.screen-only
{
display: block;
}

.mobile-only
{
display: none;
}

@media screen and (max-width: 480px)

{

.screen-only
{
display: none;
}

.mobile-only
{
display: block;
}