html, body{
font-family: 'Roboto Mono', monospace;
text-align:center;
padding-top: 55px;
font-size: 1rem;
scroll-behavior: smooth;
}
@media (max-width: 979px) {
  body {
    padding-top: 0px;
  }
}

@media (max-width: 990px) {
  html, body, h5, h4, h2{
    font-size: 1.5rem;
  }
span{
  font-size: 1.3rem;
}
  h3, h4{
    font-size:1.85rem;
  }
  .artistPage{
    max-width:950px;
    max-height: none;
}

#myBtn{
  font-size: 1.5rem;
}

#contentSecondary{
  background-color: #f8f9fa;
}

.logoBandcamp{
  height: 59px !important;
  width: 159px !important;
}

.logoSpotify{
  height: 59px !important;
  width: 59px !important;
}

.logoFacebook{
  height: 59px !important;
  width: 59px !important;
}

.btnmore{
  background:lightgrey !important;
}

.btn{
  font-size: 1.5rem;
}
  .row{
    padding-bottom: 20px;
  }

.video{
  width: 100%    !important;
  height: 550px   !important;
}
.pastShows{
  padding-top:10px;
}

.projectTitle{
  font-size: 1.85rem;
}

.projectDescription{
  font-size: 1.2rem;
}

.yearlist{
  font-size: 1.3rem !important;
  padding-top: 5px;
  padding-bottom: 0px;

}

  footer{
    font-size: 1.2rem;
    }
  }
}

 @media(min-width:991px){
   .artistPage{
     width:498px;
 }
 .video{
   width: 48vw;    !important;
   height: 27vw;   !important;
 }

}

@media(min-width:1140px){
  .video{
    width: 550px;    !important;
    height: 300px;   !important;
  }
 }

 @media(min-width:1129px){
   .artistPage{
     width:555px;
 }}

body#pastShows{
padding-top: 80px;
}

ul{
  list-style: none;
}

.footerNext{
  position: absolute;
  bottom: 0px;
  width: 100%;
  height: 4.5rem;
  }


.carousel-inner{
  justify-content: center;
}

.years{
  margin-top:80px;
}

#myBtn {
  font-family: 'Roboto Mono', monospace;
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #f8f9fa; /* Set a background color */
  color: black; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

.imageMain{
  width: auto;
height: auto;
position: relative;
margin: 20px;
vertical-align: middle;
}

.artistName{
  background-color: red;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0%;
        left: 0%;
        opacity: 1;  /* for demo purpose  */
        font-weight: bold;
        vertical-align: middle;
        display:none;
}

.artistName:hover{
  display:flex;
}

a{
  color:inherit;
}
a:hover{
  text-decoration:none;
  color:orange;
  transition: 0.5s;
}

body {
  padding-bottom: 20px;
}

.navbar {
  margin-bottom: 20px;
}

.mainNav{
  color: black;
}

.carousel-item{
    /* width: 100%; */
    height: 100%;
    max-height: 400px;
}
.navbar{
  text-align: left;
}

.artist{
  width:100%;
}

.pastShows{
  text-align: left;
}

.artist:hover{
-webkit-transform: scale(1.04, 1.04);
-moz-transform: scale(1.04, 1.04);
transform: scale(1.04, 1.04);
transition: 0.5s;
};

#path14:hover{
  fill:orange;
  transition: 0.5s;
}

path#facebook:hover{
  fill:#ff0000;
}

div#contentMain{
  width:840px;
	float: left;
	/* margin-right:30px; */
  background-color:;
}

div#contentSecondary{
  float:left;
  background-color:;
  text-align:left;
}
