/*****************************************************************************
**  Container (clearfix)
*/

.container:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.container {
	display: inline-block;
}
 
html[xmlns] .container {
	display: block;
}
 
* html .container {
	height: 1%;
}

/*****************************************************************************
**  Shared definitions used everywhere.
*/

body {
	background: #2A88CA; /*url("../graphics/background.png") repeat; */
	margin: 0;
	padding: 0;
	font: 12px "Helvetica", Verdana, Arial, sans-serif;
	color: #FFF;
}
	.page {
		background-color: #D5D5D5;
		width: 1071px;
		margin: 0 auto;
	}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
}

img {
	border: none;
}

a:link { color: #CDE; text-decoration: underline; }
a:visited { color: #CDE; text-decoration: underline; }
a:hover { color: #FFF; text-decoration: underline; }
a:active { color: #F99; text-decoration: underline; }

/*****************************************************************************
**  The header used on all pages.
*/

.page-header {
	position: relative;
	top: 0;
	left: 0;
}
	.page-header h1 {
		margin: 0;
		padding: 0;
		background: url("../graphics/header.png") no-repeat;
		width: 100%;
		height: 86px;
	}
		.page-header h1 .text {
			display: none;
		}
	.page-header .pw-ad {
		visibility: visible;
		position: absolute;
		top: 4px;
		right: 6px;
		padding: 3px;
		background-color: #FFF;
	}
	.page-header .main-menu-bar {
		background-color: #9a9a9a;
		width: 100%;
		height: 35px;
	}
		.page-header .main-menu-bar ul {
			display: block;
			margin: 0;
			padding: 0;
		}
			.page-header .main-menu-bar ul li {
				display: block;
				float: left;
				list-style: none;
				margin: 0;
				padding: 5px 0 5px 7px;
			}

/*****************************************************************************
**  The footer used on all pages.
*/

.page-footer {
	background-color: #000;
	width: 100%;
}
	.page-footer .indicia {
		text-align: center;
		padding: 5px;
	}

/*****************************************************************************
**  The content wrapper for all page content on every page.
*/

.page-content {
	background-color: #7B7B7B;
	margin: 5px;
}
	.page-common .page-content {
		padding: 6px 8px;
	}

/*****************************************************************************
**  Front page:  The comic.
*/

.page-front {
}
	.page-front .page-content {
	}
		.page-front .page-content .comic {
			padding: 5px;
			float: left;
			width: 1040px;
			background-color: #d5d5d5;
			margin: 5px;
			border-radius: 7px;
			-moz-border-radius: 7px;
			-webkit-border-radius: 7px;
		}
		.page-front .page-content .comic2 {
			float: left;
			width: 1040px;
			background-color: #000;
			text-align: center;
		}
		
		
/*****************************************************************************
**  Front page:  Comic navigation.
*/

.page-front {
}
	.page-front .page-content {
	}
		.page-front .page-content .meta {
			float: left;
			width: 1050px;
			margin: 5px;
		}
			.page-front .page-content .meta .comic-info {
				border-radius: 7px;
				-moz-border-radius: 7px;
				-webkit-border-radius: 7px;
				border: 1px solid #000;
				font-size: 14px;
				color: #FFF;
				background-color: #000;
				padding: 3px 6px;
				margin: 0 0 4px 0;
			}
			.page-front .page-content .meta .story-nav,
				.page-front .page-content .meta .comic-nav {
				margin: 0 0 4px 0;
				text-align: right;
			}
				.page-front .page-content .meta .story-nav .first-story,
					.page-front .page-content .meta .story-nav .previous-story,
					.page-front .page-content .meta .comic-nav .first-comic,
					.page-front .page-content .meta .comic-nav .previous-comic {
					float: left;
					display: block;
					margin: 0 4px 0 0;
				}
				.page-front .page-content .meta .story-nav .next-story,
					.page-front .page-content .meta .story-nav .current-story,
					.page-front .page-content .meta .comic-nav .next-comic,
					.page-front .page-content .meta .comic-nav .current-comic {
					margin: 0;
				}
			.page-front .page-content .meta .comic-nav {
				margin: 0 20px;
			}

			.page-front .page-content .meta .btf_left {
				width: 475px;
				clear: right;
				float: left;
			}

			.page-front .page-content .meta .btf_right {
				width: 565px;
				float: right;
			}

/*****************************************************************************
**  Widgets (content boxes that can be dropped on a page).
*/

.widget {
	text-align: left;
	margin: 4px 0;
	padding: 3px 6px;
	color: #222;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
}
	.widget h3 {
		font-size: 24px;
		font-weight: bold;
		margin: 0 0 15px 0;
	}

/*****************************************************************************
**  Twitter feed widget.
*/

.widget.twitter-feed {
	border: 1px solid #dfbc3f;
	background-color: #dfbc3f;
}

/*****************************************************************************
**  Recent news widget.
*/

.widget.recent-news {
	border: 1px solid #a4dfa5;
	background-color: #a4dfa5;
}
	.widget.recent-news ul {
		display: block;
		margin: 0;
		padding: 0;
	}
		.widget.recent-news ul li {
			display: block;
			margin: 1em 1em 1em 3em;
			text-indent: -2em;
			padding: 0;
			list-style: none;
		}
		.widget.recent-news ul li .date {
			font-style: italic;
		}
		.widget.recent-news ul li a:link {
			color: #009900;		}
		.widget.recent-news ul li a:hover {
			color: #006600;		}
		.widget.recent-news ul li a:visited {
			color: #003300;}

/*****************************************************************************
**  Comic-comments widget.
*/

.widget.comic-comments {
	border: 1px solid #bcceff;
	background-color: #bcceff;
}
	.widget.comic-comments ul {
		display: block;
		margin: 0;
		padding: 0;
	}
		.widget.comic-comments ul li {
			display: block;
			margin: 1em;
			padding: 0;
			list-style: none;
		}
			.widget.comic-comments ul a {
				text-decoration: underline;
				color: #6384bf;
			}
			.widget.comic-comments ul a:hover {
				text-decoration: underline;
				color: #65696e;
			}
			.widget.comic-comments ul a:visted {
				text-decoration: underline;
				color: #31476d;
			}
	.widget.comic-comments .no-comic-comments {
		margin: 1em;
		text-style: italic;
	}
/*****************************************************************************
**  Project Wonderful ads widget.
*/

.widget.pwads {
	visibility: hidden;
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #dfdda4;
	background-color: #dfdda4;
	text-align: center;
}

/*****************************************************************************
**  Comic-comments widget.
*/

.widget.cons {
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #cdcdcd;
	background-color: #cdcdcd;
}
	.widget.cons ul {
		display: inline;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
	}
		.widget.cons ul li {
			margin-left: auto;
			margin-bottom: 1em;
			margin-right: auto;
			margin-top: 1em;
			display: inline;
			padding: 0;
			list-style: none;
		}
			.widget.cons ul a {
				text-decoration: underline;
				color: #6384bf;
			}
			.widget.cons ul a:hover {
				text-decoration: underline;
				color: #65696e;
			}
			.widget.cons ul a:visted {
				text-decoration: underline;
				color: #31476d;
			}
	.widget.cons .no-cons {
		margin: 1em;
		text-style: italic;
	}

/*****************************************************************************
**  Front page:  Visitor comments.
*/

.widget.reader-comments {
	border: 1px solid #fed1ff;
	background-color: #fed1ff;
}

/*****************************************************************************
**  menu Rollovers.
*/

#menu_home {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/df/HomeButton.png);
	width: 61px;
	height: 23px;
	display: block;
}

#menu_home:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/HomeButton.png);
}

#menu_home span {
	display: none;
}

#menu_about {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/df/AboutButton.png);
	width: 61px;
	height: 23px;
	display: block;
}

#menu_about:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/AboutButton.png);
}

#menu_about span {
	display: none;
}
#menu_archives {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/df/ArchivesButton.png);
	width: 72px;
	height: 23px;
	display: block;
}

#menu_archives:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/ArchivesButton.png);
}

#menu_archives span {
	display: none;
}

#menu_commissions {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/df/CommissionsButton.png);
	width: 111px;
	height: 23px;
	display: block;
}

#menu_commissions:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/CommissionsButton.png);
}

#menu_commissions span {
	display: none;
}

#menu_store {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/df/StoreButton.png);
	width: 61px;
	height: 23px;
	display: block; 
}

#menu_store:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/StoreButton.png);
}

#menu_store span {
	display: none;
}

#menu_facebook {
	background-repeat: no-repeat;
	float: left;
	background-image: url(/templates/ac/graphics/MainMenu/df/facebookButton.png);
	width: 23px;
	height: 23px;
	display: block;
}

#menu_facebook:hover {
	background-repeat: no-repeat;
	background-image: url(/templates/ac/graphics/MainMenu/mo/facebookButton.png);
}

#menu_facebook span {
	display: none;
}

#menu_classic {
	background-image: url(/templates/ac/graphics/MainMenu/df/classicButton.png);
	width: 90px;
	height: 23px;
	display: block;
}

#menu_classic:hover {
	background-image: url(/templates/ac/graphics/MainMenu/mo/classicButton.png);
}

#menu_classic span {
	display: none;
}



/* for future expansion
#menu_ {
	background-image: url(/templates/ac/graphics/MainMenu/df/Button.png);
	width: 61px;
	height: 23px;
	display: block;
}

#menu_:hover {
	background-image: url(/templates/ac/graphics/MainMenu/mo/Button.png);
}

#menu_ span {
	display: none;
}

*/

div#about_title_graphic {
	width: 100%;
	text-align: center;
	padding-bottom: 10px;
}

div#about_Alex{
	width: 100%;
	float: left;
}

div#about_Sam {
	width: 100%;
	float: left;
}

div#about_Lenny {
	width: 100%;
	float: left;
}

img.imageWrap {
	float: left;
	margin-right: 10px;
	margin-bottom:10px;
}
img.imageWrapRt {
	float: right;
	margin-right: 10px;
	margin-bottom:10px;
}
div.about_text {
	float: left;
}