/*
Moore Design Portfolio
Author: Casey Moore
Date: 12/14/2025
*/
header {background-color: #7f5504;
	color: #fee6b7;
	font-size: 200%;
	font-weight: bold;
	margin-top: 50px;
	min-height: 50px;
	height: 5%;
	padding-left: 5%;
	padding-top: 2em;}/*makes the background of the header black, inserts an image of a design that is on the right and does not repeat*/
header a:link {color: #ffffff}/*makes links white*/
header a:visited {color: #ffffff}/*makes visited links white*/
header a:hover {color: #fee6b7}/*makes links light orange when hovered over*/
nav {font-weight: bold;
	text-align: right;
	background-color: #fee6b7;
	position: fixed;
	top: 0;
	z-index: 9999;
	height: auto;
	width: 100%}/*affects the navigation text, bold text, aligns text on the right, background of the navigation section is orange, no margin, adds padding around the text, fixed position, no offset, configure the stacking order*/
nav a {text-decoration: none}/*Removes line under links*/
nav ul {list-style-type: none;
	font-size: 1.2em;
	margin: auto;
	padding-right: 2em;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-end;}/*Styles the unordered list*/
nav li {padding-left: .5em;
	display: inline;}/*Style the unordered list items*/
nav a:link {color:#7f5504}/*changes the color of a link*/
nav a:visited {text-decoration: none;
	color: #7f5504}/*changes the color of a visited link*/
nav a:hover {color: #523703}/*changes the color of a link when hovering over it*/
body  {color: #523703;
	background-color: #7f5504;
	font-family: Verdana, Arial, sans-serif;
	margin: 0;}/*text color is dark brown, background is off white, font is clarified*/
#mepainting {height: 300px;
	width: 300px;
	background-image: url(mepainting.jpeg);
	background-size: 100%;
	float: right;
	display: block;}/*formats the picture on the home page size and position*/
#wrapper {background-color: #fff8ec;
	padding: 2em;
	min-height: 300px;}/*wraps around entire page*/
table {margin: auto;
	border: 5px solid #7f5504;}/*formats the price table*/
td, th {border: 2px solid #7f5504;}/*formats the inside of the table*/
tr:nth-of-type(even) {background-color: #ffffff}
form {flex-direction: column;
	flex-wrap: nowrap;
	display: flex;}/*formats the contact form*/
form {display: grid;
	grid-template-rows: auto;
	grid-template-columns: 8em 1fr;
	gap: .5em;
	width: 80%;
	max-width: 60em;}/*Configures a two column form*/
input[type="submit"] {grid-column: 2/3;
	width: 7em;
	margin-bottom: 0.5em;}
textarea {margin-bottom: 0.5em;}/*configure the text box of the form*/
input {margin-bottom: 0.5em;}
h2 {font-weight: bold;
	font-size: 2em;
	margin: 0;}/*makes any text labeled with h2 formatted*/
footer {text-align: center;
	font-size: small;
	font: italic;}/*Makes the footer small and centered*/
#grad {height: 400px;
	width: 250px;
	background-image: url(grad.png);
	background-size: 100%;
	float: right;
	display: block;}/*picture insert in about me*/
#section {text-align: left;}/*Makes the text go around the image*/
#gallery {display: flex;
	flex-flow: row wrap;
	justify-content: space-around;}/*formats the images*/
video {width: 20%;
	height: auto;
	min-width: 300px;}/*sizes the video*/
@media (min-width: 1024) {
	header {font-size: 200%;
		height: 30vh;
		padding-left: 2em;}
	#wrappper {margin: auto;
		width: 80%;}
	nav ul {padding-right: 2em;}
	}