html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: black;
}

body {
  background: url('http://feminspire.com/wp-content/uploads/2012/12/bigstock_silhouettes_of_concert_crowd_i_1565261621.jpg') no-repeat center fixed;
}

#info {
  background-color: white;
  font-size: 1.2em;
  padding: 5%;
  font-family: 'Oswald', sans-serif;
}

.footnote {
  font-size: .5em;
  color: gray;
  font-family: 'Raleway', sans-serif;
}

.error {
  background-color: white;
  padding: 2%;
  margin: 15% 15% 2% 15%;
  text-align: center;
  font-size: 1.5em;
  font-family: 'Raleway', sans-serif;
}


#nav {
  padding: 2%;
  border: 1px solid black;
  width: 96%;
  min-height: 40px;
  background-color: black;
}

#brand {
  font-size: 2em;
  float: left;
  color: white;
  font-family: 'Oswald', sans-serif;
}

#brand:hover {
  cursor: pointer;
  font-size: 2.1em;
}

#search {
  float: right;
  margin-top: 1%;
}

#map-it {
}

.green {
  color: #00cc33;
}

.content {
  margin-top: 2%;
  margin-left: 6%;
  margin-right: 6%;
}

.concert-view {
  float:left;
  width: 500px;
  height: 500px;
  margin: 2% 2% 2% 4%;
  padding: 0;
}

#map-canvas {
  float: left;
  height: 500px;
  width: 500px;
  margin: 2% 4% 2% 2%;
  padding: 0;
}

#album-image {
  width: 100%;
}

#concert-list {
  overflow: auto;
  background-color: white;
  height: 500px;

}

.event {
  padding: 3%;
  border-bottom: 2px solid black;
  font-family: 'Raleway', sans-serif;

}

.event-title {
  color: #33cccc;
  font-size: 1.1em;
  font-family: 'Oswald', sans-serif;
}

.event-ticket-status {
  font-weight: bold;
}


#view-button {
  float: left;
  clear: both;
  color: white;
  background-color: black;
  font-size: 1.2em;
  font-family: 'Raleway', sans-serif;
  margin-left: 40%;
  margin-right: 40%;
  width: 20%;
  border: 2px solid green;
}

#view-button:hover {
  border: 2px solid #33cccc;
}

/*MEDIA QUERY*/
/*1250 and up, 5000 - */
/**/

@media (max-width: 1295px) {
  .concert-view {
    width: 450px;
    height: 450px;
  }

  #map-canvas {
    height: 450px;
    width: 450px;
  }

  #concert-list {
    height: 450px;
  }

}

@media (max-width: 1165px) {
  .concert-view {
    width: 400px;
    height: 400px;
  }

  #map-canvas {
    height: 400px;
    width: 400px;
  }

  #concert-list {
    height: 400px;
  }

}

@media (max-width: 1035px) {
  .concert-view {
    width: 380px;
    height: 380px;
  }

  #map-canvas {
    height: 380px;
    width: 380px;
  }

  #concert-list {
    height: 380px;
  }

}

@media (max-width: 984px) {
  .concert-view {
    width: 400px;
    height: 400px;
    margin: 2%;
  }

  #map-canvas {
    height: 400px;
    width: 400px;
    margin: 2%;
  }

  #concert-list {
    height: 400px;
  }


  #view-button {
    font-size: 1em;
  }
}

/*@media (max-width: 890px) {
  .concert-view {
    margin: 2%;
  }

  #map-canvas {
    margin: 2%;
  }



}
*/
/*ADD MODAL FOR START INSTRUCTIONS*/