@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Quicksand:wght@300;400;500;600;700&display=swap');
	body {    font-family: 'Quicksand', sans-serif; font-size: 16px}
	#wrapper {max-width: 1200px; margin: auto}
	header {background: #E75874; padding: 20px; position: relative}
	header h1 {color: #322514; font-family: 'Great Vibes', cursive; font-size: 5em; font-weight: normal; margin-top: 0}
	
	#byline {position: absolute; top: 20px; right: 20px; background: rgba(255,255,255,.50); padding: 10px}
	#byline h2 {display: inline; color: #E75874; font-weight: 500}
	nav {background: #BE1558; padding: 10px; position: absolute; bottom: 0; right: 0; width: 70%}
	nav li {display: inline}
	nav li+li {border-left: 1px solid #FFEFEF }
	nav a {padding: 5px 30px; text-decoration: none;color; color: #FFEFEF; font-size: 1.5em}
	#banner {height: 376px; background: url("images/mysite-home-banner.jpg"); border-bottom: 20px solid #BE1558; position: relative}
	#button {position: absolute; bottom: 20%; right: 15%; background: white; text-align: center; padding: 20px;  border-radius: 25px;}
	#button a {margin: 0 30px; text-decoration: none; font-weight: 500; font-size: 2em; color: #322514}
	section {background: #FFEFEF; overflow: auto}
	article {width: 70%; float: left; padding: 20px; box-sizing: border-box; background: #FFC6C7; font-size: 1.2em; color: #322514}
	article h2 {font-family: 'Great Vibes', cursive; font-size: 3.5em; font-weight: normal; text-align: center}
	hr {width: 70%; text-align: center}
	article h3 {font-family: 'Great Vibes', cursive; font-size: 2.5em; font-weight: normal; text-align: right}
	blockquote {background: white; text-align: center; padding: 20px; font-weight: bold}
	aside {width: 30%; float: left; padding: 10px; box-sizing: border-box; text-align: center}
	footer {background: #BE1558; color: white; padding: 5px; text-align: center}

/*sub page content*/

#gallery {width: 100%}
#slideshow {width: 90%; margin: auto}
.slide {float: left; width: 25%; text-align: center}
.slide img {width: 90%; height: auto}