@charset "utf-8";

/* Light Pink #F49D8D*/

/* General Styling */
	body {
		Font-family: "Verdana";
		color: #555555;
		margin: 0px;
		font-size: 110%;
		line-height: 200%;
	}
	
	p{
		margin: 5%;
		text-align: center;
	}
	
	ul{
		padding-left: 0px;
	}
/* End General Styling */

/* General Positioning */
	.left {
		padding: 3%;
		float: left;
		text-align: center;
		width: 50%;
	}

	img {
		display: inline;
	}

	.centered {
		text-align: center;
	}

	#space {
		height: 40px;
		display: block;
	}

	.row {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: start;
	}
/* End General Positioning */

/* Heading CSS*/
	h1 {
		font-size: 400%;
		font-family: "Times New Roman";
		font-style: italic;
		line-height: 100%;
		margin-left: 30px;
	}
	
	h2 {
		font-size:250%;
		font-family: "Times New Roman";
		font-style: italic;
		text-align: center;
		line-height: 100%;
	}
	
	h3 {
		font-size: 120%;
		margin-left: 30px;
	}

	h4 {
		font-size:250%;
		font-family: "Times New Roman";
		font-style: italic;
		line-height: 100%;
		margin-left: 30px;
	}
/* End Heading CSS*/

/* Button CSS */
	.button {
		position: fixed;
		right: 0px;
		top: 0px;
		padding: 2%;
		width: 200px;
		background-color: #F49D8D;
		text-align: center;
		font-weight: bold;
		border-bottom-left-radius: 20px;
		box-shadow: 7px -7px 18px #000;
	}
/* End Button CSS */

/*Navigation CSS*/
	#navigation {
		display: inline-block;
		background-color: #F49D8D;
		margin: 0px;
		width: 100%;
		text-align: center;
	}
	
	#navigation a{
		height: 10%;
		border-right-color:  #555555;
		border-right-width: 2px;
		border-right-style: solid;
		margin-top: 12px;
		margin-bottom: 12px;
		padding-left: 3%;
		padding-right: 3%;
		display: inline-block;
		font-size: 120%;
		font-weight: bold;
	}

	a:link {
		text-decoration: none;
		color: #555555;
	}
	
	a:active {
		text-decoration: underline;
	}
	
	a:visited {
		color: #555555
	}
	
	a:hover {
		color: #FFFFFF;
		cursor: pointer;
	}
/* End Navigation CSS*/

/* Favorites CSS */
	#favorites{
		text-align: center;
	}
	
	#favorites img{
		margin-left: 3%;
		margin-right: 3%;
		margin-top: 0px;
		margin-bottom: 0px;
	}
/* End Favorites CSS */

/* Quoteblock CSS */
	.quoteblock {
		background-color: #F49D8D;
		margin: 0px;
		width: 100%;
		display: inline-block;
		text-align: center;
		padding: 0px;
	}
/* End Quoteblock CSS */

/* Table CSS */
	table {
		padding: 2%;
		border-collapse: collapse;
		margin: auto;
	}
	
	td {
		border-style: solid;
		border-width: thin;
		border-color: #555555;
		padding: 2%;
	}
	
	td {
		text-align: center;
	}
	
	th {
		background-color: #F49D8D;
		width: 275px;
		padding: 2%;
	}

	#columnleft {
		border-top-left-radius: 5%;
	}

	#columnright {
		border-top-right-radius: 5%;
	}

	#rowtop {
		border-top-left-radius: 5%;
	}

	#rowbottom {
		border-bottom-left-radius: 5%;
	}
/* End Table CSS */

/*Form CSS */
	form {
		margin: auto;
		margin-top: 30px;
		width: 65%;
		border: 2px solid #555555;
		border-radius: 10px;
		padding: 3%;
	}
/*End Form CSS */

/* Flexbox Positioning */
	#mediaoptions {
		display: flex;
		gap: 10px;
		width: 100%;
		justify-content: space-evenly;
	}
	
	.column {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: auto;
		padding: 3%;
		text-align: left;
		list-style-type: none;
	}
	
	.column ul {
		margin-left: 50px;
	}

	.front-example {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 0;
		padding: 3%;
		text-align: center;
	}
	.front-example p {
		text-align: center;
		display: block;
		min-height: 7rem;
	}
/* End Flexbox Positioning */

/* Footer Styling */
	#footer {
		float:  left;
		clear: left;
		background-color: #F49D8D;
		margin: 0px;
		width: 100%;
	}
	
	#footer ul{
		list-style-type: none;
	}
	
	#row1 {
		margin-left: 5%;
		width: 20%;
		float: left;
		cursor: pointer;
	}
	
	#row2 {
		width: 20%;
		float: left;
		cursor: pointer;
	}
	
	#row3 {
		width: 20%;
		float: left;
	}

	#footer h3{
		margin-left: 0px;
	}
/* End Footer Styling */