/* CSS Document */
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 1.5;
}
#container {
	width: 95%;
	margin: 0 auto;
	max-width: 1200px;
	background-color: #fff;
}
header {
	background: #baeaea url("VivaTonk_Crystal_Ball_Cutout.jpg") left center no-repeat;
	min-height: 120px;
	text-align: center;
}
header h1 {
	font-size: 20px;
	font-weight: bold;
	color: #1C7B7F;
	margin: 0 10px 15px 140px;
	line-height: 1.0;
}
header h2 {
	font-size: 16px;
	margin: 0 10px 0 140px;
}
header h3 {
	font-size: 14px;
	margin: 0 10px 0 140px;
}
header h4 {
	font-size: 13px;
	margin: 0 10px 0 140px;
}
/*The rule below lets images adjust in size to their containers. Since no width is set for 
the images in html or css, the images will display the full width of their container
up to their native resolution which is 360px by 360px. They won't go larger than this and
will contenttain their aspect ratio as long as no other sizes are set in css or html. 
Image divs containing flower images do this. */
div#content a:link {
	color: #1C7B7F;
}
div#content a:visited {
	color: #1C7B7F;
}
header a:link {
	color: #1C7B7F;
}
header a:visited {
	color: #1C7B7F;
}
footer a:link {
	color: #1C7B7F;
}
footer a:visited {
	color: #1C7B7F;
}
nav {
	background-color: #1C7B7F;
	border-top: 1px solid #000;
	font-family: "Comic Sans MS";
	font-size: 13px;
}
nav ul { /* removes default margins and padding from ul */
	margin: 0 0 0 0;
	padding: 0;
}
nav li {
	list-style: none; /* removes bullet */
	height: 25px;
	margin: 0;
	line-height: 25px; /* centers text vertically in nav button */
}
nav li a {
	text-decoration: none; /* removes underline */
	display: block;	/* makes clickable area fill the button */
}
nav a {
	background: #1C7B7F;
	color: #baeaea;
}
nav a:hover {
	background-color: #baeaea;
	color: #1C7B7F;
}
p.caption {
	margin: 5px 0 40px 0;
	font-weight: bold;
	color: #033;
}
footer {
	text-align: center;	
	padding: 0;
	font-size: 12px;
	clear: both; /* Clears any floated elements from above and starts new line */
}
table {
	margin: 10px;
	padding: 10px;
	border-collapse: collapse;
	width: 100%;
}
/* ---------- content Div ---------- */
div#content h3 {
	font-size: 15px;
	margin: 0 0 0 0px;
}
div#content {
	width: auto;
}
div#content img {
	border: 3px double #584608;
	padding-right: 0;
}
div#content .new img {
	border: 0px;
}
div#content {
	margin: 0 1em 1em 1em;
	padding: 0;
	clear: both;
	background-color: white;
}
div#content h4 {
	font-weight: bold;
}
div#content .heading {
	font-weight: bold;
}
/* ---------- content Table ---------- */
div#content table {
	text-align: left;
	width: 100%;
	overflow: visible;
	clear: both;
}
div#content th, td {
	padding: 0;
	border-bottom: 1px solid #000000;
}
div#content td {
	vertical-align: top;
}
div#content thead th {
	vertical-align: bottom;
	text-align: left;
	white-space: normal;
}
div#content td {
	text-align: left;
}
div#content a {
	color: #1C7B7F;
}
/* ---------- Question & Answers---------- */
div#content .QA img {
	float: left;
	margin-right: 1em;
}
div#content p.question {
	font-weight: bold;
}
div#content .answer {
	padding-left: 10px;
	font-weight: normal;
}
/* ---------- Home Page ---------- */
div#tw, #activites {
	float: left;
	width: 48%;
	margin: .5em 0 0 .5em;
}
div#tonks, #buying {
	float: left;
	width: 46%;
	margin: 1em 0 0 .5em;
}
div#tw, #tonks {
	margin-right: 1em;
}
div#tw .photoa {
	margin-right: 1em;
}
div#tonks {
	margin-right: 2em;
	margin-top: 1em;
}
.photoa {
	float: right;
	margin-left: 1em;
}
.photob {
	float: left;
	margin-right: 1em;
}
/* ---------- Simple Address  List ---------- */
div#content ul.addresslist {
	list-style: none;
	padding: 0;
	margin: 0;
	margin-left: 0.5em;
}
/* ---------- Tonk Logo Sites ---------- */
div.logo {
	float: left;
	width: 100%;
}
div#tonksites img {
	float: left;
	padding: 0;
	margin: 0;
	padding-right: 10px;
	padding-bottom: 10px;
	border: 0;
}
div#tonksites a img {
	border: 0;
}
/* ---------- Boxout ---------- */
div#boxout {
	float: right;
	width: 200px;
	padding: 1em;
	margin-bottom: 5px;
	margin-left: 5px;
	border: 1px solid black;
}
div#boxout p {
	clear: both;
	padding-top: 5px;
}
div#boxout img {
	float: left;
	padding: 0;
	margin: 0;
	padding-right: 10px;
	border: 0;
}
div#boxout a img {
	border: 0;
}
/* ---------- Large groups of photos ---------- */
div.pic {
	margin: 5px;
	text-align: left;
	padding: 0;
	clear: both;
}
div.pic img {
	border: 3px double #584608;
	margin: 0 0 1em 1em;
	float: right;
	margin: 5px 0px 0px 0px;
	padding: 0;
}
div.new img {
	margin: 0 0 1em 1em;
	padding: 0;
}
div.pic ul {
	margin: 0 10px 10px 0;
	padding: 0.5em;
	float: left;
}
div.pic ul {
	background: #FAF2D8;
	border: 3px double #584608;
}
div.pic td {
	border-bottom: none;
}
div.pic li {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
}
div.pic li.title {
	font-weight: bold
}
/* ---------- Clear Div ---------- */
div.invisSeperator {
	height: 0;
	clear: both;
}
img {
	width: auto;
	max-width: 100%;
	height: auto;
}
#content img {
	float: right;
	margin: 0px 5px 5px 5px;
}
ul {
	padding: 0px 0px 0px 1em;
	margin: 0px;
}
.heading {
	font-size: 15px;
}
.prefooter {
	text-align: center;
	font-size: 15px;
}
