.content-gallery {
    overflow: hidden;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 4px solid #A2A2A2;  /* Changed from 2px to 4px */
        
	/* dimensions for a panel in a strip */
    /*height: 420px;
    width: 560px;*/
    
    /* this is the smaller version that is used in the gallery. */
    /*height: 345px;*/
   	height: 372px;  /* added 27px for the artist-credit div */
    width: 460px;
    
    /*background-color:white;*/
    color:#FFFFFF;
    font-size:1.25em;
  	margin: auto;
  	margin-bottom:50px;
    cursor:pointer;
}

.scene-gallery {
   	height: 372px;  /* added 27px for the artist-credit div */
    /*height: 345px;*/
    width: 460px;   
    perspective: 100;
    position: relative;
    padding: 4px;  /* Changed from 2px to 4px */
    box-sizing: border-box;
}

.card-gallery {
   position: absolute;
   
   /* Reduce dimensions by 8px to account for parent's 4px border on all sides */
   height: 337px;  /* 345px - 8px */
   width: 452px;   /* 460px - 8px */
          
   background-color: #A2A2A2;
   
   /* Apply the border radius to match the parent */
   border-bottom-left-radius: 1px;  /* Reduced to accommodate larger border */
   border-bottom-right-radius: 1px;
     
   -webkit-transform-style: preserve-3d;
   -webkit-transform-style: preserve-3d;

   -webkit-transition-property: transform;
   -webkit-transition-duration: 1.5s;
   transition-property: transform;
   transition-duration: 1.5s;
}

.card-gallery.flipped {
   -webkit-transform: rotateY(180deg);
   transform: rotateY(180deg);
}

.side {
   position: absolute;
   height: inherit;
   width: inherit;
   -webkit-backface-visibility: hidden;   
   backface-visibility: hidden;
}


.card-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.back-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  /*height: 100%;*/
  width: 100%;
  background: #444;
  color: white;
  padding: 8px;
  box-sizing: border-box;
  height: 364px;  
}

.back {
   background-color:#A2A2A2;
   -webkit-transform: rotateY(180deg);
   transform: rotateY(180deg);
   height: 364px;  /* added 27px (345+27) for the artist-credit div and -8px to Reduce dimensions by 8px to account for parent's 4px border on all sides*/
}

.back-title {
  flex: 1;
  text-align: center;
  font-family: CCLegendaryLegerdemain-Reg, Arial, sans-serif;
  font-size: 18px;
  color: white;
}


.content-gallery-title {
    /*width: 560px;*/
    width: 460px;
    
    height: 85px;
    line-height: 20px;
    /*text-indent: 10px;*/
   
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background:#A2A2A2;
    font-family:CCLegendaryLegerdemain-Bold;
    display:block;
    color:#FFFFFF;
    display:block;
    border:1px solid #A2A2A2;
    /*border-bottom: 2px solid #A2A2A2;*/
    background-color: #A2A2A2;
    font-size:1.4em;
    
    margin:0 auto;
}


.artist-credit {
    background: #777;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    color:white; 
    font-family: CCLegendaryLegerdemain-Reg, Arial, sans-serif; 
    font-size:small;
    padding-top:8px;
    padding-bottom:8px;
}


.artist-credit .flip-icon-container {
    position: absolute;
    right: 10px;
    display: flex;
    justify-content: flex-end;
}


.description-text {
  flex: 1;
  overflow-y: auto;
  font-family: CCLegendaryLegerdemain-Reg, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  color: white;
  padding: 6px;
  border: 1px solid #666;
  border-radius: 4px;
  /*margin-bottom: 10px;*/
  text-align: left;
}