/* CSS HEX */

:root {
  --silver: #b0bbbfff;
  --lipstick-red: #f21b3fff;
  --charcoal-brown: #423e37ff;
  --lemon-lime: #cccc33ff;
  --jet-black: #00272bff;

  --carbonblack: #1e2019;
  --brightgold: #ffda00;
  --vibrantcoral: #ff6663;
  --tropicalteal: #2ea9af;

  /* CSS HSL */
  --silver: hsla(196, 10%, 72%, 1);
  --lipstick-red: hsla(350, 89%, 53%, 1);
  --charcoal-brown: hsla(38, 9%, 24%, 1);
  --lemon-lime: hsla(60, 60%, 50%, 1);
  --jet-black: hsla(186, 100%, 8%, 1);
}

body{


font-family: gotham, sans-serif;
font-weight: 400;
font-style: normal;

}


.bg-blue {
  background-color: blue;
  color: white;
}

section {
  min-height: 200px;
}

.header {
  background-color: var(--tropicalteal);
  min-height: 15px;
}

.navbar {
  display: flex;
  flex-direction: row;

  font-size: 1.5em;
  text-align: center;
}

.nav-left {
  background-color: #ff6663;
  width: 50%;
}

.nav-right {
  width: 50%;
  background-color: #1e2019;
  color: white;
}

/* .modal-lg{

  width:700px;

} */



.footer {
  color: white;
  margin-top: 10px;

  min-height: 25px;
  /* border-radius: 20px; */
  margin-bottom: 0;
  padding: 10px 5%;
  background-color: var(--tropicalteal);
}

#hero {
  min-height: 100px;
  text-align: center;
}

.hero {
  width: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
}
#band {
  background-color: var(--vibrantcoral);
}

.band-gallery {
  display: flex;
  flex-direction: row;
}

#releases {
  background-color: var(--brightgold);
  min-height: 300px;
  padding-bottom: 50px;
}
#patreon {
  background-color: darkgray;

  color: white;
}

@media (min-width: 992px) {
  .modal-lg {
    --bs-modal-width: 700px;
  }
}