/*  
Theme Name: Metta Red Mod
Theme URI: http://www.subdevide.com/
Description: This is a modificaiton of the Metta Red theme.
Version: 1.1 (MODIFIED BY MGS)
Original Author: Aleksandar Rodic'
Author URI: http://www.subdevide.com/

MGS
I've also made some modifications
8/15/15 - Widened the below-mentioned fixed width to accomodate 2015 issues
8/2/06 - Changed width of content to fixed
8/6/06 - Replaced #header and #sidebar to remove top banner

*/


/* ==== THE BACKGROUND OF THE PAGE ================================================ */

	body{
	font-family: "Trebuchet MS", "Bitstream Vera Serif", Utopia, "Times New Roman", times, serif;
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	background-color:#afafaf; /* light grey */
	/*background-color: #F0F0F0; */ /* whitesmoke */

	/* If you want the old textured background image on the header, un-comment the below and comment out the background-color */
	/*background-image:url(images/back_black.gif); */
	}

/* ==== THE HEADER OF THE PAGE ================================================ */
	#header{
	
	/* If you want the old textured background image on the header, un-comment the below and comment out the background-color */
	/*background-image:url(images/header.gif);*/
	/*background-color: #F0F0F0; */ /* whitesmoke */
	background-color:#DCDCDC; /* light grey */
	
	/* background-color:#F0F8FF;*/ /* light grey-blue */
	border-bottom: 1px solid #666666;
	position:static;
	width:100%;
	height:64px;
	}

/* PRE 2026 SIDEBAR */
/*
	#sidebar{
	position:absolute; top:64px; left:0px;
	width:160px;
	height:auto;
	}
*/

/* 2026 SIDEBAR SUGGESTED BY CHAT GPT */
/*
#sidebar{
float:left;
position:static;
width:160px;
margin:13px 0px 5px 5px;
height:auto;
}
*/


/* Hacked versions - removes header */

/*
	#header{
	border-bottom: 1px solid #666666;
	position:static;
	width:100%;
	height:0px;
	}
	#sidebar{
	position:absolute; top:1px; left:0px;
	width:160px;
	height:auto;
	}
*/

		
/* This is the big box that contains the comic. Sorry to use all this technological terminology */

/* PRE 2026 #CONTENT */
/*		
	#content{
	position:static;
	margin:13px 5px 5px 170px;
	padding:0px 0px 0px 0px;
	width:970px;
	height:auto;
	color:#EFEFEF;
	}
	
*/

/* 2026 CONTENT SUGGESTED BY CHAT GPT */

#content{
margin:13px 5px 5px 175px;
padding:0px 0px 0px 0px;
width:auto;
max-width:970px;
height:auto;
color:#EFEFEF;
}


	
/* --------------------------Header-------------------------- */
	#title{
	position: absolute; top:5px; left:0px;
	float:left;
	margin: 0px 0px 0px 5px;
	padding: 0px 5px 0px 5px;
	height:24px;
	width:auto;
	/*font-weight:bolder;*/
	/*font-size:18px;*/
	font-size:20px;
	/*text-transform:capitalize;*/
	/*letter-spacing: 0.8em;*/
	}


	#pages{
	position: absolute; top:34px; left:0px;
	float:left;
	margin: 0px 0px 0px 5px;
	height:24px;
	width:auto;
	background:transparent;
	border:1px solid #CCCCCC;
	border-top:1px solid #777777;
	border-bottom:1px solid #EEEEEE;
	}
		#pages a {
		color: #FFFFFF;
		padding:0px 12px 2px 12px;
		background:transparent;
		font-weight:bold;
		}
		#pages a:hover {
		padding:0px 12px 2px 12px;
		background-image:url(images/bar_white.gif);
		color: #000000;
		}
		#pages li {
		display:inline;
		}

	#search {
	position: relative; top:35px; right:12px;
	margin: 0px 24px 0px 24px;
	float:right;
	height:24px;
	}
	#search input {
		background:transparent;
		border:1px solid #CCCCCC;
		border-top:1px solid #777777;
		border-bottom:1px solid #FFFFFF;
		font-size: 14px;
		font-weight: bold;
		color: #FFFFFF;
		padding: 4px 5px 3px 5px;
		width: 164px;
		}
		
/* ==== THE POST (COMIC) ITSELF  ================================================ */

		.post{
		position:static;
			/* If you want the old textured background image on the header, un-comment the below and comment out the background-color */
		/*background-image:url(images/back_white.gif);*/
		/*background-color: #FFFFFF; *//* white */
		background-color: #F0F0F0; /* whitesmoke */

		color: #FFFFFF;
		border:1px solid #000000;
		margin: 10px 5px 0px 0px; 
		padding: 10px 10px 0px 10px;
		width:auto;
		height:auto;
		color:#000000;
		}
		.post a{
		color:#FF6633;
		}

		.headline{
		position:relative; top:-20px;
		float:left;
	/*	background-image:url(images/back_burgundy2.gif);*/
	/*	background-color: #734520; /* old brown */
		background-color: brown;
		border:1px solid #000000;
		margin:0px 0px 0px 5px;
		padding:0px 0px 0px 0px;
		width:auto;
		height:18px;
		color: #FFFFFF;
		font-size:13px;
		font-weight:bold;
		}
			.headline a {
			color: #FFFFFF;
			padding: 0px 5px 0px 5px;
			}
			.headline a:hover{
			color:#FFFFFF;
			background-color:#FFCC00;
			/*background-color:red;*/
			padding: 0px 5px 3px 5px;
			}

		
		.bottomline{
		float:right;
		background-image:url(images/back_white.gif);
		border:1px solid #000000; border-top:0px;
		margin:0px 0px 0px 20px;
		padding:0px 10px 0px 10px;
		width:auto;
		height:17px;
		text-align:right;
		font-size:10px;
		z-index:3;
		}
			.bottomline a{
			color:#FF0000;
			}

		.text{
		position:static;
		text-align:left;
		margin: 20px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}

		/* Derived from "text" */
		.comic{
		position:static;
		text-align:center;
		margin: 20px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}
 
		/* For navigation icons - mgs */
		.navicons{
		position:static;
		text-align:center;
		margin: 20px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}
		
		.navicons-bottom{
		position:static;
		text-align:center;
		margin: 7px 0px 7px 0px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}


		/* Before I started mucking with it */
		.text-orig{
		position:static; top:-10px;
		text-align:left;
		margin: 20px 5px 0px 5px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}


/* --------------------------commentform-------------------------- */

	.commentform{
	background-image:url(images/back_gray.gif);
	border:1px solid #000000;
	color:#000000;
	position:static;
	margin: 20px 5px 10px 0px;
	padding: 10px 10px 10px 10px;
	width:auto;
	height:auto;
	}
		.comment_headline{
		position:relative; top:-20px;
		float:left;
		background-image:url(images/back_white.gif);
		border:1px solid #000000;
		margin:0px 5px 0px 5px;
		padding:0px 5px 0px 5px;
		width:auto;
		height:18px;
		color: #000000;
		font-size:13px;
		font-weight:bold;
		}
			.comment_headline a {
			color:#FF6600;
			padding: 0px 5px 0px 5px;
			}
			.comment_headline a:hover{
			color:#FF6600;
			background-color:#FFCC00;
			}


/* --------------------------Sidebar-------------------------- */
			
		.sideblock{
		position:static;
		/*background-image:url(images/back_white.gif);*/
		background-color: #FFFFFF; /* white */
		/*background-color: #F0F0F0;*/ /* whitesmoke */

		border:1px solid #000000;
		margin: 13px 0px 5px 5px;
		padding: 5px 0px 5px 0px;
		width:auto;
		height:auto;
		}
		
		.sidetitle{
		position:relative; top:-15px;
		float:left;
	/*	background-image:url(images/back_burgundy2.gif);*/
	/*	background-color:#734520; */  /* This is the old dark brown */
		/*background-color: #800000;*/  /* This is an alt color */
		background-color: brown; /* This is actually the same dark red as the words "Joe the Circle" */

		border:1px solid #000000;
		margin:0px 0px 0px 5px;
		padding:0px 5px 0px 5px;
		width:auto;
		height:18px;
		color: #FFFFFF;
		font-size:13px;
		font-weight:bold;
		}
		.sidelinks{
		position:relative; top:-10px;
		margin: 20px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		height:auto;
		width:auto;
		}
			.sidelinks li {
			list-style-type: none;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			}
			.sidelinks a {
			color: #000000;
			text-decoration: none;
			font-weight: bold;
			padding: 0px 5px 0px 5px;
			margin: 0px 0px 0px 5px;
			}
	/*		.sidelinks a:hover{
			text-decoration: underline;
			}*/
			.sidelinks a:hover{
			color:#FFFFFF;
			background-color:#FFCC00;
			}



		
/* --------------------------Footer-------------------------- */

	#footer{
	background-image: url(images/header.gif);
	/*border:1px solid #FFFFFF;*/
	border-top:1px solid #000000;

	position:static;
	height:auto;
	width:auto;
	margin: 25px 0px 0px 0px;
	padding:2px 2px 2px 2px;
 
	/* This below margin indents the footer so that it clears the sidebar */
	/*margin: 25px 0px 0px 170px;*/

	text-align:center;
	color:#000000;
	clear:both;
	}
		#footer a {
		color: #FF6600;
		padding:0px 5px 0px 5px;
		}
		#footer a:hover {
		color: #FFFFFF;
		}
		#footer li {
		display:inline;
		}
		.navigation{
		position:static;
		margin: 10px 10px 0px 10px;
		padding: 0px 10px 0px 10px;
		width:auto;
		height:auto;
		color:#FFFFFF;
		text-align:right;
		}
		.navigation a{
		color:#FFFFFF;
		font-weight:bold;
		font-size:18px;
		}

/* --------------------------General-------------------------- */
h1 {
	color:#FF3300;
	font-size:20px;
	letter-spacing: 0.4em;
	margin: 15px 0 2px 0;
	padding-bottom: 2px;
}

h2 {
	color:#FF3300;
	font-size:18px;
	letter-spacing: 0.3em;
	margin: 15px 0 2px 0;
	padding-bottom: 2px;
}

h3 {
	color:#FF3300;
	font-size:15px;
	letter-spacing: 0.2em;
	margin-top: 0;
}
a {
	text-decoration: none;
	}
img {
	border: 0px ;
	/*border: 1px solid #FFFFFF;*/ 
	/* Got rid of this, because it added a white border to everything! */
	}
blockquote {
	border: 1px solid #666666;
	margin-left: 1.5em;
	padding-left: 5px;
}
cite {
	font-size: 90%;
	font-style: normal;
}
/* ---------------------------Clear--------------------------- */

div.both {
	height:0px;
	width:0px;
	clear: none;
	}
	
	
	
/* TEMP OVERRIDES */

#sidebar {
    position: static !important;
    float: left !important;
    width: 160px !important;
    margin: 13px 0 5px 5px !important;
}


#content {
    margin: 13px 5px 5px 175px !important;
    width: auto !important;
    max-width: 970px !important;
}

#footer {
    clear: both !important;
}

	
	/* TEST */
/*	
body {
    background: lime !important;
}

#sidebar {
    border: 8px solid red !important;
    background: yellow !important;
}

#content {
    border: 8px solid blue !important;
    background: white !important;
}

*/