#header {
  background-color: #3a6358;
  opacity: 0.8;
  text-align: center;
}

#footer {
  background-color: #3a6358;;
  opacity:0.8;
  color:white;
  bottom:0px;
  position:fixed;
  margin-right:5px;
  width:99%;
  height:40px;
  line-height:40px;
}

#footer img {
  float:left;
}

#footer a {
  position: fixed;
  right: 25px;
  color: white;
}

#logo {
  width:90%;
  max-width:500px;
  margin-top:15px;
  margin-bottom:5px;
}

#app {
  font-size:12px;
}

#app p {
  margin: 5px 0px 0px 0px;
}

#main {
  margin-top: 10px;
  margin-bottom: 40px;
}

#status div {
  margin-top: 5px;
  margin-bottom: 5px;
}

#icons {
  margin: 10px 0px !important;
}

button {
  background-color: white;
  font-size: 13px;
  display: inline-block;
  padding: 0.3em 0.5em;
  text-decoration: none;
  color: #3c4e4d;
  border: solid 2px #3b646b;
  border-radius: 3px;
  transition: .4s;
  margin: 0px 4px 5px 4px;
}

button:hover {
  background: #3b646b;
  color: white;
}

#all button {
  background-color: white;
  color: red;
  border: solid 2px red;
}

#all button:hover {
  background: red;
  color: white;
}

.list-item {
  display: inline-block;
  margin-right: 10px;
}
.list-enter-active, .list-leave-active {
  transition: all 0.5s;
}
.list-enter, .list-leave-to /* .list-leave-active for below version 2.1.8 */ {
  opacity: 0;
  transform: translateY(30px);
}

nav {
 width: 300px;
 height: 450px;
 transition: all 0.2s;
 transform: translateY(450px);
 position: fixed;
 bottom: 0px;
 left: 0px;
 z-index: 1000;
 background-color: #FFF;
}

nav.open {
 transform: translateY(-40px); 
}

.twitter {
  height:100%;
}