/* Pagefind Modal - Final Settings */
    pagefind-modal,
    .pagefind-modal,
    :root {
        --pf-modal-max-width: 700px !important;
        --pf-modal-max-height: 52dvh !important;     /* You can change this number */
        --pf-modal-top: 14dvh !important;
        --pf-modal-backdrop: rgba(0, 0, 0, 0.32) !important;
    }

    pagefind-modal {
        --pf-result-title-font-size: 15.5px !important;
        --pf-result-excerpt-font-size: 14px !important;
    }

    .centered-box {
        max-width: 620px;
        margin: 40px auto;
        padding: 20px;
        text-align: center;
    }
	.centered-box img {
    max-width: 100%;                  /* Makes images scale down on small screens */
    height: auto;                     /* Keeps aspect ratio */
}

body 
{
background-color: grey;
color:#FFCC00;
margin-left:7px;
}

	h1 {
    font-family: "Times New Roman", Times, serif;
    color: #FFFF37;
	}
    h2 {
        font-family: "Times New Roman", Times, serif;
        color: #4B83D5;
    }
    h3 {font-family:"Times New Roman",Times,serif;}
    h4 {font-family:"Times New Roman",Times,serif; font-size:20pt; color:#7FFF00;}
    p {font-family:"Times New Roman",Times,serif; font-size:16pt; line-height:150%; max-width: 850px;}

#sabbathposter1 {background-color:#FFCC00; color:#990000; width:100%; height:180px;}
#sabbathposter2 {background-color:#FFCC00; color:#990000; width:100%; height:140px;}
#sabbathposter3 {background-color:#FFCC00; color:#990000; width:100%; height:140px;}

.poster {font-family:arial,helvetica,sans-serif; font-size:25px; font-weight:bold; text-align:center;}

    #box1
    {
    background-color:#990000;
    max-width:900px;
    border: 2px solid #FFCC00;
    margin-left:auto;
    margin-right:auto;
    padding: 30px;
    }
 
	#sunbackground2
	{
	background-image:url(gif/sunbackground2375x250.jpg);
	background-repeat:no-repeat;
	}	
 
@media screen and (max-width: 1000px) 
{
body {background-color:#990000; color:#FFCC00; margin-left:7px; overflow-wrap:break-word;}
h1 {font-family:"Times New Roman",Times,serif; color:#FFCC00;}
h2 {font-family:"Times New Roman",Times,serif; color:#669999;}
h3 {font-family:"Times New Roman",Times,serif;}
h4 {font-family:"Times New Roman",Times,serif; font-size:20pt; color:#66FF00;}
p {font-family:"Times New Roman",Times,serif; font-size:16pt; line-height:150%; max-width: 850px;}
a:link {color:#FFCC00;}    /* unvisited link */
a:visited {color:#FF9900;} /* visited link */
a:active {color:#CCCCCC;}  /* selected link */  
}

/* Fix Google Programmable Search Results Styling */
.gs-title a,
.gs-title a:visited,
.gs-snippet,
.gs-result .gs-title,
.gs-result .gs-snippet {
    color: #2c3e50 !important;           /* Dark blue-gray - easy to read */
    font-size: 1.05em !important;
}

.gs-title a:hover {
    color: #b8860b !important;           /* Nice gold hover effect */
    text-decoration: underline;
}

.gs-result {
    margin-bottom: 20px !important;
    padding: 12px !important;
    border-bottom: 1px solid #eee;
}

/* Make the search box match your site better */
.gsc-control-cse {
    background-color: transparent !important;
    border: none !important;
}

.gsc-input-box {
    border: 2px solid #2c3e50 !important;
}

/* ==================== FINAL LINK STYLES ==================== */

/* Unvisited links */
a {
    text-decoration: none !important;
    color: #FFFF37 !important;
    display: inline-block;          /* Important for background */
    padding: 3px 6px;               /* Gives background room to show */
    border-radius: 3px;             /* Optional: slight rounding */
}

/* h4 links stay green when unvisited */
h4 a,
h4 a:link {
    color: #7FFF00 !important;
}

/* Visited links */
a:visited,
h1 a:visited,
h2 a:visited,
h3 a:visited,
h4 a:visited {
    color: #C59EE2 !important;
}

/* Hover */
a:hover,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
a:visited:hover {
    color: #990000 !important;
    background-color: #4B83D5 !important;
}

/* Simple Top Navigation */
.top-nav {
	background-color: #2c3e50;        /* Dark blue-gray, professional */
	padding: 0 20px;
	box-shadow: 0 2px 5px rgba(0,0,0,0.1);
	position: sticky;                 /* Stays at top when scrolling */
	top: 0;
	z-index: 1000;
}
.nav-container {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
.site-brand {
	color: #ecf0f1;
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;
	padding: 15px 0;
}
.nav-links {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
}
.nav-links li {
	margin: 0;
}
.nav-links a {
	color: #ecf0f1;
	text-decoration: none;
	padding: 18px 16px;
	display: block;
	font-size: 1.05em;
	transition: background 0.3s;
}
.nav-links a:hover {
	background-color: #34495e;
	color: #f1c40f;               /* Soft gold highlight */
}

/* Dropdown button arrow */
.dropbtn {
    cursor: pointer;
}

/* Dropdown Content */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #34495e;
    min-width: 200px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    z-index: 1001;
    border-radius: 4px;
    top: 100%;                    /* Positions below the main link */
}

.dropdown-content li {
    margin: 0;
}

.dropdown-content a {
    padding: 12px 16px;
    white-space: nowrap;
}

.dropdown-content a:hover {
    background-color: #2c3e50;
    color: #f1c40f;
}

/* Show dropdown on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Hover effect on main links */
.nav-links a:hover,
.dropdown:hover > .dropbtn {
    background-color: #34495e;
    color: #f1c40f;
}

/* Hamburger for mobile */
.ensemble {
    display: none;
    color: white;
    font-size: 1.8em;
    padding: 15px 0;
    cursor: pointer;
}

/* Mobile styles */
@media (max-width: 768px) {
    .nav-links {
        flex-direction: column;
        width: 100%;
        display: none;
    }
    
    .nav-links.active {
        display: flex;
    }
    
    .dropdown-content {
        position: static;         /* Makes dropdowns expand inline on mobile */
        box-shadow: none;
        background-color: #2c3e50;
    }
    
    .ensemble {
        display: block;
    }
}