@charset "utf-8";

/*
    New Perspectives on HTML and CSS3, 8th Edition
    CTI-110-01H - Web, Pgm, & Db Foundation
    Build Your Own Home Page
    
    Style Sheet for the Layout of the Home Page
    Author: Eunice Van Delden 
    Date:   04/26/2026
    Filename: styles.css

*/



/* Body Styles */
html {background-color: hsl(85, 36%, 50%);}
body 
{
	margin-left: auto;
	margin-right: auto;
	max-width: 1860px;
	min-width: 640px;
	width: 90%;
}



/* Body Header Styles */
body > header > img 
{
    display: block;
	width: 100%;
	height: 300px;
}
body > header > nav li 
{width: 20%;}



/* Horizontal Navigation Styles */
nav li 
{
	display: block;
	float: left;
}
nav a 
{
	background-color: hsl(82, 39%, 30%);
	display: block;
	text-align: center;
}
h1
{
	text-align: center;
	font-size: 40px;
}


/* Left Column Styles */
section#leftColumn 
{
	clear: left;
	float: left;
	width: 33%;
	padding: 1.5em;
	text-align: center;
}

section#leftColumn img
{
    display: block;
    width: 100%;
}

section#leftColumn aside
{
	display: block;
	height: fit-content;
	width: fit-content;
	border: 4px groove hsl(82, 39%, 30%);
	border-radius: 20px;
	box-shadow: 5px 5px 10px 2px hsl(82, 39%, 30%) ;
}



/* Right Column Styles */
section#rightColumn 
{
	float: left;
	width: 67%;
}
section#rightColumn img 
{
	display: block;
	width: 100%;
}
section#rightColumn > nav li 
{width: 25%;}



/* Div Styles */
div#Photo1
{
	display: block;
	top: 35px;
	left: 10%;
}



/* Footer Styles */
footer{
	clear: left;
	background-color: hsl(82, 39%, 30%);
    text-align: center;
}

footer::after{
	clear: both;
	content: "";
	display: table;
}