body {
text-align:center;
font-family:"Comic Sans MS";
background-image:url("Images/cd.png");
background-size:20%;
color:white;
}

.home {
    background-color: #a2cdf2;
    color: black;
    border: none;
    margin: 20px;
    height:50px;
    width:100px;
    text-align: center;
    text-decoration:none;
    display: inline-block;
    position:fixed;
    top:0;
    left:0;
    transition-duration: 0.3s;
    overflow:hidden;
    }

.home:hover{
    background-color: #94c2eb;
    cursor: pointer;
    overflow:hidden;
    }
    
.container {
  display:flex;
  justify-content:center;
  gap:8px;
}

.flip-container{
  height:200px;
  width:200px;
  perspective:1000px;
  }
  
.flip-inner {
  width: 100%;
  height: 100%;
  position:relative;
  transition:transform 1200ms;
  transform-style:preserve-3d;
}
  
.flip-container:hover .flip-inner{
  cursor:pointer;
  transform: rotateY(180deg);
  transform-style:preserve-3d;
}

#bvsc, #bvsctext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#bvsctext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#bvsc {
  background-image:url("Images/cd/bvsc.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#barryult, #barryulttext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#barryulttext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#barryult {
  background-image:url("Images/cd/barryult.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#bennygoodman, #bennygoodmantext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#bennygoodmantext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#bennygoodman {
  background-image:url("Images/cd/bennygoodman.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#indigogirlsrites, #indigogirlsritestext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#indigogirlsritestext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#indigogirlsrites {
  background-image:url("Images/cd/indigogirlsrites.png");
  background-size:cover;
  transform: rotateY(0deg);
}

#indigogirls, #indigogirlstext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#indigogirlstext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#indigogirls {
  background-image:url("Images/cd/indigogirls.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#indigogirlsall, #indigogirlsalltext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#indigogirlsalltext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#indigogirlsall {
  background-image:url("Images/cd/indigogirlsall.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#w, #wtext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#wtext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#w {
  background-image:url("Images/cd/w.jpeg");
  background-size:cover;
  transform: rotateY(0deg);
}

#johnD, #johnDtext {
  width: 100%;
  height: 100%;
  position:absolute;
  backface-visibility:hidden;
}

#johnDtext {
  background-color:white;
  color:black;
  font-size:13px;
  text-align:center;
  transform:rotateY(180deg);
  padding:2px;
  display:flex;
  justify-content:center;
  align-items:center
}

#johnD {
  background-image:url("Images/cd/johnD.jpeg");
  background-size:cover;
}