/*************THREE-COLUMN-LAYOUT FOR DIVAS SHOW PAGE*******************/

/* General Styles */
/*body {
  font-family: Arial, sans-serif;
  line-height: 1.6;
  color: #fff;
  background-color: #000;
  margin: 0;
  padding: 0;
}

/* Page Wrapper */
#pagewrap {
  max-width: 950px;
  margin: 0px auto;
  font-family: Arial, sans-serif;
  font-size: 0.8em;
  line-height: 1.25;
  color: #000;
  padding: 5px;
  display: flex;
  flex-wrap: wrap;
  background-color: #FFFFCC;
  gap: 10px; /* Space between columns */
  	a:visited {
    color: #8F0853	} /* Visited link color */
}
h1 { /*THIS IS AN ALTERNATIVE FONT TYPE, WHICH GIVES A NICE "CITY LIGHTS TEXT"*/
	-o-text-shadow: 0 0 5px #8F0853, 0 0 10px #8F0853, 0 0 15px #8F0853, 0 0 20px #8F0853, 0 0 30px #FF00FF, 0 0 40px #FF00FF, 0 0 50px #FF00FF, 0 0 75px #FF00FF, 0 0 100px #FF00FF;
	-moz-text-shadow: 0 0 5px #8F0853, 0 0 10px #8F0853, 0 0 15px #8F0853, 0 0 20px #8F0853, 0 0 30px #FF00FF, 0 0 40px #FF00FF, 0 0 50px #FF00FF, 0 0 75px #FF00FF, 0 0 100px #FF00FF;
	-ms-text-shadow: 0 0 5px #8F0853, 0 0 10px #8F0853, 0 0 15px #8F0853, 0 0 20px #8F0853, 0 0 30px #FF00FF, 0 0 40px #FF00FF, 0 0 50px #FF00FF, 0 0 75px #FF00FF, 0 0 100px #FF00FF;
	-webkit-text-shadow: 0 0 5px #8F0853, 0 0 10px #8F0853, 0 0 15px #8F0853, 0 0 20px #8F0853, 0 0 30px #FF00FF, 0 0 40px #FF00FF, 0 0 50px #FF00FF, 0 0 75px #FF00FF, 0 0 100px #FF00FF;
	text-shadow: 0 0 5px #8F0853, 0 0 10px #8F0853, 0 0 15px #8F0853, 0 0 20px #8F0853, 0 0 30px #FF00FF, 0 0 40px #FF00FF, 0 0 50px #FF00FF, 0 0 75px #FF00FF, 0 0 100px #FF00FF;
	/*Standard text-shadow last b/c it's the one that is used last; so if it's applicable then it will be used after all others*/
	/*Now for IE*/
	filter:
        progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=0, Color='#8F0853'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#8F0853'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=180, Color='#8F0853'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=270, Color='#8F0853'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=0, Color='#FF00FF'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=90, Color='#FF00FF'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=180, Color='#FF00FF'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=270, Color='#FF00FF');
 	color: #fff;
	letter-spacing: 5px;
	font: 50px 'MisoRegular';
	text-align: center;
	font-weight: 400
}

/* Main Content */
#content {
	flex: 0 0 250px; /* Width of the left column */
	padding: 10px;
	border: 2px solid #000000;
}

/* Middle Article */
#middle {
  flex: 1; /* Take up remaining space */
  padding: 10px;
  border: 2px solid #000000;
}

/* Aside (Right Column) */
#right {
  flex: 0 0 200px; /* Width of the right column */
  padding: 10px;
  border: 2px solid #000000;
}

/* Video Container */
.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
/*  padding-bottom: 75%; /* 4:3 aspect ratio */
  height: 0;
  overflow: hidden;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 97.5%; 
  height: 97.5%;
  border: 2px solid #000000;
}

/* Image Styling */
.divas-img img {
  max-width: 100%;
  height: auto;
  border: 2px solid #CBCED1;
  display: block; /* Removes extra space below image */
  margin: 0 auto;
}
/* Headings */
h2-80s {
  color: #8F0853;
  font-size: 1.7em;
  margin-bottom: 10px;
  text-align: center;
}
h2-country {
  color: #8F0853;
  font-size: 1.4em;
  margin-bottom: 10px;
  text-align: center;
}
/* Headings */
h3 {
  color: #8F0853;
  font-size: 1.4em;
  margin-bottom: 10px;
  text-align: center;
}

h4 {
  color: #8F0853;
  font-size: 1.2em;
  margin-bottom: 5px;
  text-align: center;
}
strong{
 font-weight:bold;
}
/* Content Divas */
.content-divas {
  text-align: justify;
}

/* Character List */
#right .character-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.character-item {
  width: 45%; /* Adjust for desired width */
  margin-bottom: 10px;
  text-align: center;
}

.character-item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  text-decoration: none;
}

.character-item img {
  width: 50px;
  height: 50px;
  border: 2px solid #fff;
  margin-bottom: 5px;
}
.cher-right-songs {
/*  width: 45%; /* Adjust for desired width */
  text-align: left;
  font-size: 1em;	
}
/* Responsive adjustments */
@media (max-width: 768px) {
  #pagewrap {
    flex-direction: column; /* Stack columns on smaller screens */
  }

  #content,
  #middle,
  #right {
    flex: 1; /* Each takes full width */
    min-width: 100%;
  }

  .character-item {
    width: auto; /* Allow full width for character items */
  }
}