/*****************************/
/*** Core html setup stuff ***/
/*****************************/

/**/

html {
  height: 100%;
  margin-bottom: 1px;
 
}

form {
  margin: 0;
  padding: 0;
}

/* page paragraph text color found here */
body {
	font-family: Helvetica,Arial,sans-serif;
	line-height: 1.3em;
	margin: 0px 0px 0px 0px;
	font-size: 12px;
	color: #fff;
}

a:link, a:visited {
	text-decoration: none;
	font-weight: normal;
}

a:hover {
	text-decoration: underline;
	font-weight: normal;
}

input.button { cursor: pointer; }

p { margin-top: 0; margin-bottom: 5px; }

img { border: 0 none; }

/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/
#page_bg {
	padding: 0px 0;*/
	margin-bottom: 1px;
}
/* this div center is the entire page 100% container this is the center hack loc: index line 35*/
div.center {
  text-align: center;
  /* use this padding to add space between the browsers menu and the image headers. */
  padding-top:10px;
  padding-bottom:10px;
  /*   use this line here in the center class to put a fixed image behind the centered website.
  background:#202020 fixed url(../images/cratesketch.png) 0 0 no-repeat;  */
  /*mystuff*/
  background-color:#202020;
}
/*this wrapper div is the page centering container that is affected by text align center loc: index line 36*/
div#wrapper {
/* what number or percentage does auto represent?  It seems like auto is like 100% it fills the space*/
	margin-left: auto;
	margin-right: auto;
	/*mystuff*/
  background-color:#660000;
}

body.width_medium div#wrapper {
	width: 950px;
}

body.width_small div#wrapper {
	width: 773px;
}

body.width_fmax div#wrapper {
	min-width: 750px;
	max-width: 1050px;
}

div#header_l {
	position: relative;
}

div#header_r {
	height: 160px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	overflow: hidden;
	text-align: center;
	z-index:2;
	/*background-color:#00FF00;
	border-style:solid;
	border-color:#66FF99;
	border-width:medium;*/
}
/* this contains the logo with a transparent background*/
div#logo {
	position: relative;
	float: left;
	height: 150px;
	width:950px;
	overflow:hidden;
	text-align:left;
	background: #000;
	margin-left:20px;
	/*background: url(../images/ca_roundedrectheader.png) 0 0 no-repeat;
	background: url(../images/mw_joomla_logo.png) 0 0 no-repeat;*/
	/* use this space to adjust the header1 image  */
	/*mystuff
	background-color:#00FF00;
	border-style:solid;
	border-color:#66FF99;
	border-width:medium;*/
}
/* these float to a side*/
div#logo2 {
left:0;
float:left;
position:relative;
background: url(../images/ca_roundedrectheader.png) 0 0 no-repeat;
z-index:5;
overflow:visible;
border-style:solid;
	border-color:#66FF99;
	border-width:medium;
}

/* these float to a side*/
div#pictlogo2 {
float:right;
position:relative;
z-index:2;
overflow:hidden;
text-align:left;
/*mystuff*/
border-style:solid;
	border-color:#66FF99;
	border-width:medium;
}
/* these are hand positioned */
div#pictlogo {
	position:absolute;
	right: 0px;
	top: 0;
	float: right;
	width: 650px;
	height: 150px;
	overflow:hidden;
	text-align:right;
	margin-left: 17px;
	margin-top: 17px;
	padding-right:3px;
	z-index:2;
	/*mystuff
	background-color:#00FF00;
	border-style:solid;
	border-color:#66FF99;
	border-width:medium;*/
}


div#newsflash {
	width: auto;
	margin-left: 350px;
	margin-right: 30px;
	border: 1px solid #00f;
}
/* thin section under header contains pill graphic index line 48 */
div#tabarea {
/*why doesn't this have to be stretched at 100% but it still fills the entire cross section? */
	background: #660000 url(../images/mw_header_b2.png) 0 -3px repeat-x;
	/*this has shortcut has the background, image, and some positioning  and repeat all in one declaration.*/
	margin-left: 11px;
	margin-right:20px;
	/*mystuff*/
}

div#tabarea_l {
/*this objects dimensions are 26 x 14*/
	background: url(../images/mw_header_l_b2.png) 0 -3px no-repeat;
	padding-left: 32px;
}

div#tabarea_r {
/* why does this have to be set at 100% height but it doesn't stretch the graphic it floats it all the way right*/
	height: 42px;
	background: url(../images/mw_header_r_b2.png) 100% -3px no-repeat;
/*when I changed the numbers to 100% and 100% it moved all the wayright and all the way down*/
	padding-right: 42px;
}

div#footer_r {
	padding-top: 10px;
	height: 47px;
	overflow: hidden;
}

div#footer_r div {
	text-align: center;
	font-size: .90em;
	color: #aaa;
}

div#footer_r a:link, div#footer_r a:visited  {
	color: #999;
}

div#footerspacer {
	height: 10px;
}
/* this style is for the breadcrumbs*/
#pathway {
	padding: 0px 10px 8px;
	width: auto;
	margin-top: -2px;
	/* I tried to have float left and margin-right to see what happened.  margin-right didn't apply because float left made the 
	container only as big as its contents so there was not left to address the limit. */
	/* original declaration before float left.*/
	/*margin-right: 250px;*/
	float: left;
	text-align: left;
	/*mystuff*/
}

#search {
	float: right;
	width:320px;
/* the bottom of the tabarea isn't at the borderline that goes through the pill graphic.  that borderline graphic is actually at the top
of the container.  the SEARCH selector has to be moved up beyond its regular margin to overlap the bottom of the tabarea container */
	margin-top: -20px;
	margin-right: 30px;
	height: 40px;
	overflow: hidden;
	text-align:right;
	/*mystuff*/
}

form#searchForm input {
	vertical-align: middle;
}

form#searchForm table {
	border-collapse: collapse;
}

form#searchForm td {
	padding:0;
}

#mod_search_searchword {
	padding-left: 3px;
}
/* creates a container for error message module index line 86 */
#area {
	padding: 0;
}
/* the whitebox container contains the left right menubars and the main content articles. template.css line 214 */
#whitebox {
	margin: 0 21px 0px 21px;
	background: #000;
	width: auto;
	/*mystuff*/
}

#whitebox div {
	text-align: left;
}

/* contains the top detail line and the divs for the left and right rounded detailed corners(racing stripes) */
#whitebox_t {
	/*background: url(../images/mw_content_t.png) 0 0 repeat-x;*/
	/*background: #fff url(../images/mw_content_t.png) 0 0 repeat-x;*/
	/*mystuff*/
}

#whitebox_tl {
	/*background: url(../images/mw_content_t_l.png) 0 0 no-repeat;*/
		/*mystuff*/
   margin-top:10px;
   padding-left:30px;
}

#whitebox_tr {
	height: 10px;
	overflow: hidden;
	/*background: url(../images/mw_content_t_r.png) 100% 0 no-repeat;*/
	/*mystuff*/
  margin-left: 30px;
}
/* This contains the page content its purpose is to complete the overall rounded border effect without using graphics*/
#whitebox_m {
	border-left: 1px solid medium #000;
	border-right: 1px solid medium #000;
	width: auto;
	padding: 1px 8px;
		/*mystuff*/
	background-color:#000000;
	
}

#whitebox_b {
	margin-top: -5px;
	/*background: url(../images/mw_content_b.png) 0 100% repeat-x;*/
}

#whitebox_bl {
	/*background: url(../images/mw_content_b_l.png) 0 100% no-repeat;*/
}

#whitebox_br {
	height: 13px;
	/*background: url(../images/mw_content_b_r.png) 100% 100% no-repeat;*/
}

/* horizontal pill menu */
table.pill {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
}

td.pill_l {
  background: url(../images/mw_menu_cap_l.png) no-repeat;
  width:  20px;
  height: 32px;

}

td.pill_m {
  background: url(../images/mw_menu_normal_bg.png) repeat-x;
  padding: 0;
  margin: 0;
  width: auto;
}

td.pill_r {
  background: url(../images/mw_menu_cap_r.png) no-repeat;
  width:  19px;
  height: 32px;
}
/* format for the text in the pill menu table */
#pillmenu {
  white-space: nowrap;
  height: 32px;
  /* i can't tell what the float is for */
  float: left;
}

#pillmenu ul {
  margin: 0;
  padding: 0;
  list-style:none;
}

/*this adds a bullet item before each listed item on the pill menu in the shape of the line graphic. contains the black line separator graphic*/
#pillmenu li {
	float: left;
	/* the custom bullets were on the right i moved them to the left just because I could.  They really need 2 grapics to look right */
	background: url(../images/mw_menu_separator.png) top left no-repeat;
	margin: 0;
	padding: 0;
}

#pillmenu a {
/* this separates the pill menu by the individual links and adds style to each one individually */
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
	float:left;
  display:block;
  height: 24px;
  line-height: 24px;
  padding: 0 20px;
  color: #ccc;
  text-decoration: none;
  /*mystuff*/ 
}

#pillmenu a#active_menu-nav {
	margin-top:2px;
	height: 21px;
	line-height: 21px;
	background-position: 0 0;
	
}

#leftcolumn {
	padding: 0;
	margin: 0;
	width: 20%;
	float:left;
}

#maincolumn,
#maincolumn_full {
	margin-left: 20%;
	padding-left: 15px;
	width: 75%;
}

#maincolumn_full {
	margin-left: 0;
	padding: 0;	
	width: 100%;
}

table.nopad {
	width: 100%;
	border-collapse: collapse;
	padding: 0;
	margin: 0;
	margin-bottom: 15px;
}

table.nopad td.middle_pad {
	width: 20px;
}

/*****************************************/
/*** Joomla! specific content elements ***/
/*****************************************/

div.offline {
	background: #fffebb;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 1.2em;
	padding: 5px;
}

span.pathway {
  display: block;
  margin: 0 20px;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
}

/* headers */
div.componentheading {
  padding-left: 0px;
}

h1 {
	padding: 0;
	font-family:Helvetica ,Arial,sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	vertical-align: bottom;
	color:#9900FF;
	text-align: left;
	width: 100%;
}
/* article titles/headers color */
h2, .contentheading {
	padding: 0;
	font-family: Arial, Helvetica,sans-serif;
	font-size: 1.4em;
	font-weight: normal;
	vertical-align: bottom;
	color:#FFCCCC;
	text-align: left;
	width: 100%;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

h4 {
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
}
/* positioning for all module titles */
h3, .componentheading, table.moduletable th, legend {
  margin: 0;
  font-weight: bold;
  font-family: Helvetica,Arial,sans-serif;
  font-size: 1.5em;
  padding-left: 0px;
	margin-bottom: 10px;
	text-align: left;
}

/* small text */
/* small written by text under component article title.  */
.small {
	font-size: .90em;
	color:#00FF00;
	font-weight: normal;
	text-align: left;
}

/*bottom modified date color */
.modifydate {
  height: 20px;
  vertical-align: bottom;
	font-size: .90em;
	color:#FF00FF;
	font-weight: normal;
	text-align: left;
}

/*upper create date color */
.createdate {
	height: 20px;
	vertical-align: top;
	font-size: .90em;
	color:#CCCC00;
	font-weight: normal;
	vertical-align: top;
	padding-bottom: 5px;
	padding-top: 0px;

}


a.readon {
	margin-top: 10px;
	display: block;
	float: left;
	background: url(../images/mw_readon.png) top right no-repeat;
	padding-right: 20px;
	line-height: 14px;
	height: 16px;
}

/* form validation */
.invalid { border-color: #ff0000; }
label.invalid { color: #ff0000; }


/** overlib **/

.ol-foreground {
	background-color: #f6f6f6;
}

.ol-background {
	background-color: #666;
}

.ol-textfont {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}

.ol-captionfont {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #f6f6f6;
	font-weight: bold;
}
.ol-captionfont a {
	color: #0B55C4;
	text-decoration: none;
	font-size: 12px;
}

.ol-closefont {}

/* menu links */
a.mainlevel:link, a.mainlevel:visited {
	padding-left: 5px;
}

a.mainlevel:hover {

}

/* spacers */
span.article_separator {
	display: block;
	height: 20px;
}

.article_column {
	padding-right: 5px;
}

/* color for dashed line between 2 articles columns*/
.column_separator {
	border-left: 1px dashed #660000;
	padding-left: 10px;
}

td.buttonheading {

}

td.buttonheading img {
	border:none;
}

.clr {
	clear: both;
	/*mystuff*/
}

td.greyline {
  width: 20px;
  background: url(../images/mw_line_grey.png) 50% 0 repeat-y;
}

div#maindivider {
  border-top: 1px solid #ddd;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  overflow: hidden;
  height: 1px;
}

table.blog span.article_separator {
	display: block;
	height: 20px;
}

/* edit button */
.contentpaneopen_edit{
	float: left;
}

/* table of contents */
table.contenttoc {
  margin: 5px;
  border: 1px solid #ccc;
  padding: 5px;
  float: right;
}

table.contenttoc td {
  padding: 0 5px;
}


/* content tables */
td.sectiontableheader {
  background: #efefef;
  color: #333;
  font-weight: bold;
  padding: 4px;
  border-right: 1px solid #fff;
}

tr.sectiontableentry0 td,
tr.sectiontableentry1 td,
tr.sectiontableentry2 td {
  padding: 4px;
}

td.sectiontableentry0,
td.sectiontableentry1,
td.sectiontableentry2 {
  padding: 3px;
}


/* content styles */
table.contentpaneopen, table.contentpane {
	margin: 0;
	padding: 0;
	width: auto;
}

table.contentpaneopen li {
	margin-bottom: 5px;
}

table.contentpaneopen fieldset {
	border: 0;
	border-top: 1px solid #ddd;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

table.contentpaneopen h4 {
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
}

.highlight {
	background-color: #fffebb;
}

/* module control elements */
table.user1user2 div.moduletable {
	margin-bottom: 0px;
}

div.moduletable, div.module {
  margin-bottom: 25px;
}

div.module_menu h3 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #eee;
	margin: -23px -4px 5px -5px;
	padding-left: 10px;
	padding-bottom: 2px;
}

div.module_menu {
	margin: 0;
	padding: 0;
	margin-bottom: 15px;
}

div.module_menu div div div {
	padding: 10px;
	padding-top: 30px;
	padding-bottom: 15px;
	width: auto;
}

div.module_menu div div div div {
	background: none;
	padding: 0;
}

div.module_menu ul {
	margin: 10px 0;
	padding-left: 20px;
}

div.module_menu ul li a:link, div.module_menu ul li a:visited {
	font-weight: bold;
}

#leftcolumn div.module {
	padding: 0 10px;
}

#leftcolumn div.module table {
	width: auto;
}

/* forms */
table.adminform textarea {
  width: 540px;
  height: 400px;
  font-size: 1em;
  color: #000099;
}

div.search input {
	width: 145px;
	border: 1px solid #ccc;
	margin: 15px 0 10px 0;
}

form#form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#form-login ul { padding-left: 20px; }

form#com-form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#com-form-login ul { padding-left: 20px; }

/* thumbnails */
div.mosimage         {  margin: 5px; }
div.mosimage_caption {  font-size: .90em; color: #666; }

div.caption       { padding: 0 10px 0 10px; }
div.caption img   { border: 1px solid #CCC; }
div.caption p     { font-size: .90em; color: #666; text-align: center; }

/* Parameter Table */
table.paramlist {
	margin-top: 5px;
}

table.paramlist td.paramlist_key {
	width: 128px;
	text-align: left;
	height: 30px;
}

table.paramlist td.paramlist_value {
}

div.message {
	font-family : "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size : 14px;
	color : #c30;
	text-align: center;
	width: auto;
	background-color: #f9f9f9;
	border: solid 1px #d5d5d5;
	margin: 3px 0px 10px;
	padding: 3px 20px;
}

/* Banners module */

/* Default skyscraper style */
.bannergroup {
}

.banneritem img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Text advert style */

.banneritem_text {
	padding: 4px;
	font-size: 11px;
}

.bannerfooter_text {
	padding: 4px;
	font-size: 11px;
	background-color: #F7F7F7;
	text-align: right;
}

/* System Messages */
/* see system general.css */

.pagination span { padding: 2px; }
.pagination a    { padding: 2px; }

/* Polls */
.pollstableborder td {
	text-align: left;
}

/* WebLinks */
span.description {
	display:block;
	padding-left: 30px;
}

/* Frontend Editing*/
fieldset {
	border: 1px solid #ccc;
	margin-top: 15px;
	padding: 15px;
}

legend {
	margin: 0;
	padding: 0 10px;
}

td.key {
	border-bottom:1px solid #eee;
	color: #666;
}

/* Tooltips */

.tool-tip {
	float: left;
	background: #ffc;
	border: 1px solid #D4D5AA;
	padding: 5px;
	max-width: 200px;
}

.tool-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: bold;
	margin-top: -15px;
	padding-top: 15px;
	padding-bottom: 5px;
	background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
	font-size: 100%;
	margin: 0;
}

/* System Standard Messages */
#system-message { margin-bottom: 20px; }

#system-message dd.message ul { background: #C3D2E5 url(../../system/images/notice-info.png) 4px center no-repeat;border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Error Messages */
#system-message dd.error ul { color: #c00; background: #E6C0C0 url(../../system/images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Notice Messages */
#system-message dd.notice ul { color: #c00; background: #EFE7B8 url(../../system/images/notice-note.png) 4px center no-repeat; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E; margin:0px; padding-left: 40px; text-indent:0px;}

#syndicate{
	float:left;
	padding-left: 25px;
}

#power_by{
	float:right;
	padding-right: 25px;
}

/* Component Specific Fixes */

#component-contact table td {
	padding: 2px 0;
}