{

	margin: 0;

	padding: 0;

	box-sizing: border-box;

}



body {

	font-family: Arial, sans-serif;

	display: flex;

	min-height: 100vh;

}



/* Sidebar Styles */

nav {

	width: 24%;

	background-color: #ffc040;

	color: #333333;

	position: sticky;

	top: 0;

	height: 100vh;

	overflow-y: auto;

	padding: 10px 10px;

}



nav h2 {

	margin-bottom: 10px;

	font-size: 20px;

	border-bottom: 2px solid #444;

	padding-bottom: 5px;

}



nav a {

	display: block;

	color: #111111;

	font-size: 27px;

	text-decoration: none;

	margin: 6px 6px;

	line-height: 1.4;

	transition: color 0.2s ease-in-out;

}



nav a:hover {

	color: #eeeeee;

}



/* Main Content Styles */

main {

	flex: 1;

	padding: 20px;

	background-color: #ffe8c0;

}



main section {

	margin-bottom: 25px;

}



main h2 {

	font-size: 26px;

	color: #000000;

	margin-top: 15px;

	margin-bottom: 15px;

	border-bottom: 1px solid #cccccc;

}



main p {

	line-height: 1.0;

	font-size: 19px;

	color: #333333;

}



main ol {

	line-height: 1.0;

	font-size: 15px;

	color: #444444;

	margin-left: 3px;

	line-height: 1.4;

}



main ul {

	line-height: 1.0;

	font-size: 15px;

	color: #444444;

	margin-left: 3px;

	line-height: 1.4;

}



main table {

	line-height: 1.0;

	color: #0000cc;

}



/* Responsive Design */

@media (max-width: 768px) {

	body {

		flex-direction: column;

	}



	nav {

		width: 100%;

		height: auto;

		position: relative;

	}



	main {

		padding: 10px;

	}

}