html {
	box-sizing: border-box;
	margin: 0;
}
*, *:before, *:after { box-sizing: inherit; }

body {
	text-align: center;
	line-height: 1.6;
	font-family: 'Libre Baskerville', serif;
	font-size: 16px; 
	text-align: center;
	margin: 0px;
	background-color: #eee;
	background-image: url(images/bg.jpg);
	color: #4a6f8b;
}

img {border-style: none;}

#top {
	height: 700px;
	background-image: url(images/top_bg.jpg);
	background-repeat: repeat-x;
	background-position: top right;
	text-align: right;
}
#top-img {
	position: absolute;
	top: 0;
	right: 0;
}
table, tr, td {
    margin: 0;
    padding: 0;
}
table img { display: block; }

#main {
	position: absolute;
	top: 400px;
	right: 510px;
	width: 640px;
}

#nav {
	position: absolute;
	top: 280px;
	right: 580px;
	width: 580px;
}
#nav a {
	font-family: 'Seaweed Script', cursive;
	text-align: left;
	display: inline-block;
	font-size: 2.3em;
	line-height: 1.2em;
	color: #e9cdc0;
	padding: 0 10px;
}
#nav a:hover {
	background-image: none;
	color: #e14f27;
	font-style: italic;
}

#footer {
	font-size: .8em;
	margin: 50px 0 0 0;
}
#footer p { text-align: center; }

h1 {
	color: #e58266;
	font-size: 3em;
	font-weight: 400;
	text-align: right;
	font-family: 'Meddon', serif;
	text-transform: lowercase;
	line-height: 1em;
	margin: 15px auto;
	padding-right: 50px;
}

p { margin: 5px 0 15px; text-align: left; }
p:first-letter { color: #0093c7; font-style: italic; padding-right: 2px; }
p.rules:first-letter { color: inherit; font-style: normal; padding-right: 0; }

i, em { color: #c38e65; }
b, strong { background-color: #ebfafa; }

blockquote {
	color: #3894b7;
	font-size: 1.4em;
	margin: 30px 70px;
	padding: 10px;
	background-image: url(images/bg2.jpg);
	border-radius: 20px;
}
blockquote i { color: inherit; }

.code img, .middle {
	border: 2px solid #e6925d;
	margin: 2px;
	padding: 3px;
}
.code img:hover, .middle:hover { border: 3px solid #e44a18; padding: 2px; }

input, select, textarea {
	background-color: #effefe;
	border: 2px solid #69c588;
	border-radius: 5px;
	padding: 8px;
	margin: 5px 2px 5px 0;
	font-family: inherit;
	font-size: 1em;
	color: #1e5a6d;
}
input:hover, select:hover, textarea:hover { border: 2px solid #95e89f; }
input[type=submit], input[type=reset] { background-color: #d8e9c5; }
input[type=submit]:hover, input[type=reset]:hover { background-color: #e0f5e1; cursor: pointer; }

a { color: #e14f27; text-decoration: none; }
a:hover { color: #1d84b0; background-image: url(images/bg2.jpg); }
p a:hover { border-bottom: 2px solid #e85f36; }

@media screen and (max-width: 1200px) {
	#main {
		top: 620px;
		right: 50px;
		width: 640px;
		max-width: 100%;
	}
	#nav {
		top: 460px;
		right: 500px;
		width: 200px;
	}
	#nav a {
		font-size: 2em;
		color: #60b389;
		padding: 0 10px;
	}
	h1 {
		text-align: left;
	}
}