html {
  background: url("./assets/background_large_02.png") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat:no-repeat;
  font-family: 'Roboto Condensed', sans-serif;
}

.side-nav {
  background-color:#375160;
}

.side-nav li a {
  color:#BE2A28;
  text-shadow: .1em .1em #000;
}
.button-collapse i {
  font-size:300%;
}
.side-nav .background img {
  height:100%;
  width:100%;
}
.userView {
  width:100%;
  height:200px;
}
.subheader {
  padding-left:1.5em;
}

.card {
  width:40%;
  margin:auto;
  margin-top:10%;
  background-color:#375160;
  display:flex;
  flex-direction:column;
}
.card-title {
  display:flex;
  justify-content:center;
  text-decoration:underline;
}
.card-action {
  margin:auto;
}

.heading {
  color:rgba(240,240,240,.8);
  text-align:center;
}

.inputFields {
  background-color:rgba(140,140,140,.5);
  color:#fff;
  padding-bottom:3em;
}
.song-a-details, .song-b-details, .venue-a-details, .venue-b-details {
  text-align:center;
  display:none;
}

h3 {
  color:#DDD;
  text-shadow: .05em .05em #000;
  text-align:right;
}
.song-a-details h5, .song-b-details h5, .venue-a-details h5, .venue-b-details h5, h1{
  color:#BE2A28;
  text-shadow: .05em .05em #000;
}
form p {
  text-align:center;
}
.collection {
  background-color:rgba(140,140,140,.5);
  color:#FFF;
}
.button-row{
  display:flex;
  justify-content:center;
}
button {
  margin:0 2em;
}

.good {
  background-color:#37A160;
}
.bad {
  background-color:#BE2A28;
}
h6 {
  text-align:center;
}
.help {
  color: #CCC;
  display:none;
}

.help a {
  color:#2288FF;
}

@media only screen and (max-width: 414px) {
  html {
    background-image: url("./assets/mobile_bg_2.png");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat:no-repeat;
    font-family: 'Roboto Condensed', sans-serif;
  }
  .button-collapse i {
    font-size:400%;
  }
  .card {
    width:85%;
    margin:auto;
    margin-top:10%;
    background-color:#375160;
    display:flex;
    flex-direction:column;
  }
  .col {
    width:85%;
  }
  .inputFields {
    padding-bottom:0;
  }
}
/*
PHISH DONUT COLORS
teal - 375160
Red - BE2A28
P*/