/* Basic Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
	font-family: 'Merriweather', serif; /* Apply Merriweather font */
}

body {
    line-height: 1.6;
    background-color: #0D0D0D; /* Dark background */
    color: #DADADA; /* Light text for contrast */
}

h1 {
    font-family: 'Merriweather', serif; /* Assuming Merriweather is your chosen font */
    color: #C59A5C; /* Amber color, similar to the color of beer */
    font-size: 2.5em; /* Adjust size as needed */
    margin-bottom: 0.5em;
    text-align: center; /* Centered text, adjust as needed */

    /* Text shadow for depth - optional */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);

    /* Additional styling - optional */
    padding-bottom: 10px;
    border-bottom: 2px solid #8C6E4B; /* Border color that matches the button hover */
    margin-bottom: 20px;
}


/* Navbar */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background-color: #222;
    color: #E0E0E0;
}

.navbar .logo {
    display: flex;
    align-items: center;
    font-size: 1.2rem; /* Adjust the font size as needed */
    font-weight: bold;
}

.navbar .logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
	color: #F1C40F;
	font-size: 1.7rem;
    font-weight: bold;
}

.navbar .logo img {
    height: 100px !important; /* Set the logo height */
    margin-right: 10px;
}

.navbar .menu a {
    color: #E0E0E0;
    text-decoration: none;
    margin-left: 1rem;
}

.navbar .menu a:hover {
    color: #F1C40F;
}

.navbar .logo a:hover {
	text-decoration: none;
	color: #F1C40F;
}

.navbar .logo a:visited {
	text-decoration: none;
	color: #F1C40F;
}

/* Hero Section */
#hero {
    background: url('hero-image.jpg') no-repeat center center/cover;
    color: white;
    text-align: center;
    padding: 2rem;
}

/* Sections */
section {
    padding: 2rem;
    background-color: #1A1A1A; /* Dark background for sections */
    border-bottom: 1px solid #333; /* Subtle border for separation */
}

section h2 {
    color: #F1C40F; /* Gold color for headings */
}

#news-section {
    background-color: #4A2E19; /* Rich Brown background */
    color: #FAF3E0; /* Creamy Off-white text */
    padding: 20px;
}

.news-item {
    display: inline-flex;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid #8C6E4B; /* Warm Medium Brown border */
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.news-item:last-child {
    border-bottom: none;
}

.news-item img {
    max-width: 33%;
    height: auto;
    max-height: 300px;	
    margin-right: 15px;
}

.news-text p {
    color: #FAF3E0; /* Maintaining the creamy off-white for text */ 
    flex: 1; /* Allow the text container to fill the available space */
    padding: 10px;
    word-wrap: break-word; /* Break long words that could overflow */
}

.news-text h3 {
    color: #C59A5C; /* Amber for titles */
    margin-bottom: 10px;
}

/* Ensure other elements in the news section inherit these colors */
#news-section a, #news-section a:visited {
    color: #C59A5C;
}

#news-section a:hover, #news-section a:focus {
    color: #FAF3E0;
}


.button {
    display: inline-block;
    padding: 10px 20px;
    background-color: #C59A5C; /* Amber color, resembling beer */
    color: #FAF3E0 !important; /* Creamy Off-white for text */
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    border: none;
    transition: background-color 0.3s, color 0.3s;

    /* Add a slight shadow for depth */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.button:hover, .button:focus {
    background-color: #8C6E4B; /* A darker shade for hover effect */
    color: #FFFFFF; /* White text on hover */
    text-decoration: none; /* Ensure no underline on hover */
}




/* Footer */
footer {
    text-align: center;
    padding: 1rem;
    background-color: #222;
    color: #E0E0E0;
}

@media screen and (max-width: 768px) {
    .navbar .menu {
        display: none; /* Hide for mobile */
    }
}