/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}


/* Set core root defaults */
html:focus-within {
  scroll-behavior: smooth;
}

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Vollkorn+SC:wght@600&display=swap');
/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

footer{
  padding-bottom: 15px;
}
.my-nav{
  position: absolute;
  z-index: 10;
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-weight:400;
  text-transform: uppercase;
  }

.bg-black{
  background-color: black;
}

.navbar-light .navbar-toggler {
  color: rgb(255, 255, 255);
  border-color: rgb(255, 255, 255);
}

.navbar-light .navbar-toggler-icon {
  background-image: url(../images/icons/menu.png);
}

.navbar-light .navbar-nav {
  margin: 10px;
}

.navbar-light .navbar-nav .nav-link {
    color: white;
}

.navbar-light .navbar-nav .nav-link:visited {
  color: white;
}
.navbar-light .navbar-nav .nav-link.active {
    color: #8c806a;
    font-weight: 700;
    text-decoration: line-through;
    text-decoration-thickness: 2px;
}

.navbar-light .navbar-nav .nav-link:hover {
  color: rgba(255, 255, 255, 0.514);
}

header{
  padding-top: 120px;
}

.hero-text {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-family: 'Open Sans', sans-serif;
}

.band img{
  padding-top: 70px;
}

.biotext p {
  color:white;
  text-shadow: 0px 0px 3px #8c806a;
  padding: 25px 200px 0px 200px;
  font-size:20px;
  text-align: justify;
  font-family: 'Open Sans', sans-serif;
}

.biotext{

  background-image: url(../images/background/bg-star.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size:contain ;
  margin-top: 50px;
}

.biotitle p{
  color: white;
  font-size: 5vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
  letter-spacing: 35px;
}

.biotitle p::after{
  content: url(../images/icons/menu.png);
}

/* hover effect */


.band-members {
  width:100%;
  background-color:black;
  display:block;
  overflow:hidden;
  -webkit-box-shadow: 0px 0px 31px -19px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 31px -19px rgba(0,0,0,0.75);
box-shadow: 0px 0px 31px -19px rgba(0,0,0,0.75);
}
.band-members:hover > .band-members-image {
  margin-top:-100px;
}
.band-members-image {
  background-color:rgb(0, 0, 0);
  transition:0.5s;
}
.band-members-image img {
  height:100%;
}
.band-members-name {
  color:#fff;
  font-weight:bold;
  padding:5px;
}
.band-members-name h1 {
  font-size:30px;
}
.band-members-name span {
  font-size:20px;
  color:white;
  padding:0px;
}

.fab{

  color: white;
}


.fab:hover{
  color: #8c806a;
}

footer p{

  color: white;
}

footer a{

  color: white;
  text-decoration: none;
}

footer a:hover{

  color: #8c806a;
}

.hide {
  display: none;
}
    
.myDIV:hover + .hide {
  display: block;
  color: white;
}

video {
  z-index: -1;
  opacity: 0.78;
  width: 100%;
  padding-top: 130px;
}

.discography img{

  width: 200;
}
.discography p{
  color: white;
  font-size: 5vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
  letter-spacing: 35px;
}

.musicplatforms{
  padding-top: 20px;
}

.musicplatforms .fab{
  font-size: 60px;
 letter-spacing: 35px;
}

.listenbutton {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    color: rgb(248, 249, 250);
    border-color: rgb(248, 249, 250);
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.listenbutton:hover {
	background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
	background-color:#e9e9e9;
  color: black;
}

.mediabanner{
  padding-top: 100px;
}

.media p{
  color: white;
  font-size: 5vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
  letter-spacing: 35px;
}

.shop p{
  color: white;
  font-size: 5vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
}
.mediaplatforms .fab{
  font-size: 45px;
  letter-spacing: 35px;
}

.blogbutton {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color:#707070;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  color: rgb(0, 0, 0);
  border-color: rgb(248, 249, 250);
  border-radius: 0.25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.blogbutton:hover {
background-color:#707070a9;
color: black;
}


.shop-card {
  position: relative;
  text-align: center;
  border-radius: 30px;
  background: #f5f5f5;
  transition: 0.3s ease-out;
  overflow: hidden;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
}

.shop-card:hover{
  background-color:#707070a9;
  animation-name: boxhover;
  animation-duration: 0.8s;
}

@keyframes boxhover {
  from {background-color: white;}
  to {background-color: #707070a9;}
}


.form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
} 

.form-container{
  padding-top: 50px;
  padding-left: 300px;
  padding-right: 300px;
}

.interested-btn {
  padding: 10px 10px;
  background: #023a68;
  color: #fff;
  font-size: 15px;
  text-transform: uppercase;
  border: none;
}
.btn-s{
  margin-right: 15rem;
}

.fab{

  font-size: 2rem;
  margin-left: 10px;

}

.artwok{
  padding-bottom: 20px;
}


.artwok2{
  padding-bottom: 20px;
}

.footericons{
  padding-bottom: 10px;
}

.embedtool {
  position: relative;
  height: 0;
  padding-top: 56%;
  overflow: hidden;
  max-width: 100%;
 }
 .embedtool iframe, .embedtool object, .embedtool embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }
 .embedtool .fluid-vids {
  position: initial !important
 }

@media only screen and (max-width : 600px) { 
 
.logo{

  width: 100px; 
}

.form-container{
  padding-left: 25px;
  padding-right: 25px;
}

.biotext p {
  color: white;
  text-shadow: 0px 0px 3px #8c806a;
  padding: 5px 20px 0px 20px;
  font-size: 14px;
  text-align: justify;
  font-family: 'Open Sans', sans-serif;
}

.biotitle p {
  color: white;
  font-size: 9vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
  letter-spacing: 10px;
}

.band-members-name h1 {
  font-size: 10px;
}
.band-members-name span {
  font-size: 10px;
  color: white;
  padding: 0px;
}

.fab {
  font-size: 1rem;
  margin-left: 2px;
}
footer p {
  color: white;
  font-size: 15px;
}
.navbar-light .navbar-nav .nav-link {
  color: white;
  font-size: 30px;
  text-align: center; 
}
.navbar-collapse {
  flex-basis: 100%;
  flex-grow: 1;
  align-items: center;
  width: 100%;
  height: 100vh;
  background-color: black;
}

.discography p {
  color: white;
  font-size: 5vw;
  text-transform: uppercase;
  font-family: 'Vollkorn SC', serif;
  letter-spacing: 10px;
}
.musicplatforms .fab{
  font-size: 2rem;
  letter-spacing: 10px;
}
.artwok{
  padding-bottom: 40px;
}

.artwok2{
  padding-bottom: 0px;
}
.biotext {
  background-image: url(../images/background/bg-star.jpg);
  background-position: center;
  background-repeat: space;
  background-size: 250px;
}
.band-members:hover > .band-members-image {
  margin-top:-50px;
}
 }
 

 @media only screen and (min-device-width : 768px) and (max-device-width : 1023px){

  .band-members-name h1 {
    font-size: 20px;
}

.biotext{

  background-image: url(../images/background/bg-star.jpg);
  background-position: center;
  background-repeat: space;
  background-size:contain ;
}
.biotext p {
  color: white;
  text-shadow: 0px 0px 3px #8c806a;
  padding: 25px 40px 0px 40px;
  font-size: 20px;
  text-align: justify;
  font-family: 'Open Sans', sans-serif;
}
 }


 @media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2){
    
    .biotext p {
      color: white;
      text-shadow: 0px 0px 3px #8c806a;
      padding: 25px 70px 0px 140px;
      font-size: 20px;
      text-align: justify;
      font-family: 'Open Sans', sans-serif;
  }
    
  }