/* Global Styles */
body {
    font-family: 'Lora', serif; /* Changed to Lora font */
    margin: 0;
    padding: 0;
    background-color: #000; 
    color: #FFD700; 
}

/* Header */
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #000; 
    padding: 1rem 2rem;
    color: #FFD700; 
}

header img {
    height: 50px;
}

nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

nav ul li {
    display: inline;
    margin-left: 20px;
}

nav ul li a {
    color: #FFD700; 
    text-decoration: none;
}

nav ul li a:hover {
    color: #FFD700; 
}

/* Hero Section */
#home {
    background-color: #FFD700; 
    color: #000; 
    text-align: center;
    padding: 100px 20px;
}

#home h1 {
    font-size: 48px;
    font-weight: 700; /* Bold */
}

#home p {
    font-size: 20px;
    margin-top: 10px;
}

/* About Section */
#about {
    padding: 50px 20px;
    text-align: center;
    color: #FFD700; 
}

#about h2 {
    font-size: 36px;
    font-weight: 700; /* Bold */
}

#about p {
    font-size: 18px;
    margin-top: 10px;
}

/* Audition Section */
#audition {
    background-color: #000; 
    color: #FFD700; 
    padding: 50px 20px;
    text-align: center;
}

#audition h2 {
    font-size: 36px;
    font-weight: 700; /* Bold */
}

#audition p {
    margin: 20px 0;
}

.button {
    background-color: #FFD700; 
    color: #000; 
    padding: 10px 20px;
    text-decoration: none;
    font-size: 18px;
    border-radius: 5px;
}

.button:hover {
    background-color: #000; 
    color: #FFD700; 
}

/* Gallery Section */
#gallery {
    padding: 50px 20px;
    text-align: center;
    color: #FFD700; 
}

#gallery h2 {
    font-size: 36px;
    font-weight: 700; /* Bold */
}

/* Slideshow Styles */
.slideshow-container {
    position: relative;
    max-width: 100%;
    margin: auto;
}

.mySlides {
    display: none;
}

.slide-image {
    width: 100%;
    border-radius: 10px;
}

/* Add animation for fading effect */
.fade {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes fade {
    from {opacity: .4} 
    to {opacity: 1}
}

@keyframes fade {
    from {opacity: .4} 
    to {opacity: 1}
}

/* Contact Section */
#contact {
    background-color: #FFD700; 
    padding: 50px 20px;
    text-align: center;
    color: #000; 
}

#contact h2 {
    font-size: 36px;
    font-weight: 700; /* Bold */
}

#contact p {
    font-size: 18px; /* Original font size for paragraph */
}

/* Updated styles for contact info and social media */
#contact ul {
    list-style-type: none;
    padding: 0;
}

#contact ul li {
    font-size: 20px; /* Change this to your desired size */
    font-family: 'Lora', serif; /* Change to a different font if desired */
    font-weight: 600; /* Make the text bold */
    margin: 10px 0; /* Add some spacing between items */
}

#contact ul a {
    font-size: 20px; /* Change this to your desired size */
    font-family: 'Lora', serif; /* Change to a different font if desired */
    font-weight: 600; /* Make the links bold */
    color: #000; /* Set link color */
    text-decoration: none;
}

#contact ul a:hover {
    color: #FFD700; /* Change the color on hover */
}

/* Footer */
footer {
    background-color: #000; 
    color: #FFD700; 
    text-align: center;
    padding: 20px;
}

footer a {
    color: #FFD700; 
    text-decoration: none;
}

footer a:hover {
    color: #FFD700;
}
