body {
font-family: 'Arial, sans-serif';
background-color: #121212;
color: #e0e0e0;
margin: 0;
padding: 0;
font-size: 18px; /* Increased from default */
}

header, footer {
background-color: #1e1e1e;
color: #e0e0e0;
padding: 20px;
text-align: center;
}

header h2, footer p {
margin: 0;
}

header nav, footer nav {
margin: 10px 0;
}

header nav a, footer nav a {
color: #ffcc00;
text-decoration: none;
margin: 0 10px;
}

header nav a:hover, footer nav a:hover {
text-decoration: underline;
}

.container {
max-width: 1200px;
margin: 50px auto;
padding: 20px;
background-color: #1e1e1e;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
border-radius: 10px;
}

h1 {
text-align: center;
color: #ffcc00;
font-size: 2.5em; /* Reduced from 3em */
margin-bottom: 20px;
}

.container > p {
font-size: 1em; /* Reduced from 1.2em */
line-height: 1.6; /* Slightly increased for better readability */
}

.first-paragraph {
font-size: 1.2em !important; /* Slightly larger than other paragraphs */
line-height: 1.6; /* Slightly increased for better readability */
}

.business-listing {
display: flex;
flex-direction: column;
gap: 20px;
}

.business-item {
position: relative;
display: flex;
align-items: center;
padding: 20px;
border: 1px solid #333;
border-radius: 10px;
background-color: #2a2a2a;
}

.business-item img {
width: 100%; /* Full width for portrait mode */
height: auto; /* Maintain aspect ratio */
border-radius: 10px;
margin-right: 20px;
}

.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%; /* Full width for portrait mode */
height: auto; /* Maintain aspect ratio */
background: rgba(0, 0, 0, 0);
z-index: 10;
cursor: pointer;
}

.business-item h2 {
margin: 0;
color: #ffcc00;
font-size: 2em; /* Increased from default */
}

.business-item p {
margin: 10px 0;
line-height: 1.6; /* Slightly increased for better readability */
font-size: 1.1em; /* Increased from default */
}
.back-button {
	position: relative;
z-index: 10000000000;
	
	
	
}
.button {
display: inline-block;
padding: 10px 20px;
margin-top: 10px;
color: #121212;
background-color: #ffcc00;
text-decoration: none;
border-radius: 5px;
font-weight: bold;
position: relative;
z-index: 10000000000;
font-size: 1.1em; /* Increased from default */
}

.button:hover {
background-color: #e6b800;
}

@media (max-width: 768px) {
.container {
padding: 10px;
}
h1 {
font-size: 2em;
}
.business-item {
flex-direction: column;
align-items: flex-start;
}
.business-item img {
margin-bottom: 10px;
}
.button {
padding: 8px 16px;
}
}

@media (min-width: 769px) {
.business-item img {
width: 50%; /* Adjust this value as needed for laptops */
height: auto; /* Maintain aspect ratio */
}
.overlay {
width: 50%; /* Adjust this value as needed for laptops */
height: auto; /* Maintain aspect ratio */
}
}

@media (orientation: landscape) {
.business-item img {
width: 400px; /* Increased for landscape mode */
height: 225px; /* Increased for landscape mode */
}
.overlay {
width: 400px; /* Increased for landscape mode */
height: 225px; /* Increased for landscape mode */
}
}


iframe {
width: 50%;
	left: 25%;

height: 50vh;
border: none;
}
@media (max-width: 850px) and (orientation: landscape) {

iframe {
width: 50%;
	left: 25%;
	height: 300%;
}
}
@media (max-width: 850px) and (orientation: portrait) {

iframe {
width: 100%;
	left: 0%;
}
}
@media (orientation: landscape) {
body {
height: 200% !important;
}
iframe {
height: 100% !important; /* Full height minus header and footer */
position: relative;

}
}

/* Ensure the body and html take up the full height */
html, body {
height: 110% !important;
}

/* Flexbox layout to push footer to the bottom */
body {
display: flex;
flex-direction: column;
}

/* Main content area should take up remaining space */
.container {
flex: 1;
}

@media (orientation: portrait) {
.men {
display: none !important;
}
.burger {
display: block !important;
background-color: #ffcc00;
color: #121212;
border: none;
padding: 10px 20px;
font-size: 18px;
cursor: pointer;
position: absolute;
top: 5px;
left: 20px;
z-index: 1000;
}

}

.burger {
display: none; /* Hide burger button by default */
}

.drawer-menu {
height: 100%;
width: 0;
position: fixed;
top: 0;
left: 0;
background-color: #1e1e1e;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
z-index: 999;
}

.drawer-menu a {
padding: 10px 15px;
text-decoration: none;
font-size: 18px;
color: #ffcc00;
display: block;
transition: 0.3s;
}

.drawer-menu a:hover {
background-color: #575757;
}

.drawer-menu .close-btn {
position: absolute;
top: 20px;
right: 25px;
font-size: 36px;
}
.email {
display: inline-block;
background-color: blackgray; /* Black background */
color: #ffcc00; /* Yellow text color */
padding: 40px 40px; /* Increased padding for a larger square */
font-size: 18px;
font-weight: bold;
border: 2px solid #ffcc00; /* Visible yellow border */
border-radius: 5px;
margin: 20px auto; /* Center the element */
text-align: center;
position: absolute; /* Positioning */
top: 70%; /* Middle of the page */
left: 50%; /* Center horizontally */
transform: translate(-50%, -50%); /* Adjust for exact centering */
}