/* (C) Copyright 2006-2008 Long2 Consulting. All Rights Reserved */
/* Start Layout CSS. This top section of CSS is what is used to layout each of the pages. To change general styles, look for the Start General Styles section below. We strongly urge you not to change the Layout styles unless you have an advanced knowledge of CSS. We cannot help you if you mess it up. */

html {
	margin: 0px;
	padding: 0px;
}

body {
	margin: 0px 0px 8px 0px;
	padding: 0px;
	font: 76.4% Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	background: #000152 url('../images/template/bg.gif') repeat-x;
}

/* Start General Styles */

img {
	border: none;
}

table {
	border-collapse: collapse;
	font-size: 10pt;
}

td {
	vertical-align: top;
}

ul {
	list-style-image: url('../images/template/bullet.gif');
	line-height: 145%;
}

p {
	line-height: 130%;
	margin: 0;
	font-size: 125%;
	padding: 8px 0 8px 0
}

.center {
	margin: 0px auto;
	text-align: center;
}

/*  The items below the properties for the links that appear in the
main text area as well as in the sidebar of the pages  */

a:link, a:visited {
	color: #026B00; 
}

a:hover, a:active {
	color: #000152;
}

hr {
border-bottom: 2px solid #000152;
}

/*  The items below set the properties for the fonts, sizes, and
colors used for headings 1 through 6. Typically h1 - h3 are used
in the main content area and h4 - h6 are used in the sidebar  */

h1 { 
	color: #000152;
	font-size: 230%;
	font-family: "Georgia", "Times New Roman", Times, serif;
	padding: 12px 2px 0px 0px;
	margin: 0;
	text-align: left;
	font-style: italic;
	font-weight: bold;
}

h2 {	
	font-size: 195%;
	color: #000152;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 4px 2px 2px 2px;
	text-align: left;
	font-style: italic;
	font-weight: bold;
}

h3 {	
	font-size: 175%;
	color: #cc0000;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 4px 2px 2px 2px;
	text-align: left;
	font-style: italic;
	font-weight: bold;
}

h4 { 
	font-size: 155%;
	color: #cc0000;
	padding: 4px;
	font-family: Georgia, "Times New Roman", Times, serif;
	border-bottom: 2px solid #cc0000;
	font-style: italic;
	font-weight: bold;
}

h5 { 
	font-size: 135%;
	color: #000152;
	padding: 4px;
	font-family: Georgia, "Times New Roman", Times, serif;
	border-bottom: 2px solid #000152;
	font-style: italic;
	font-weight: bold;
}

h6 { 
	font-size: 135%; 
	color: #000152;
	padding: 4px;
	font-family: Georgia, "Times New Roman", Times, serif;
	border-bottom: 2px solid #026B00;
	font-style: italic;
	font-weight: bold;
}

.h2right {
	font-size: 175%;
	color: #000152;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 4px 2px 2px 2px;
	text-align: right;
	font-style: italic;
	font-weight: bold;
}

/*  These classes and items are for extra layout boxes.  */

blockquote {
  background: #C2C5C8 url("../images/quoteleft.gif") no-repeat 10px 10px;
  padding: 10px;
  border-top: 2px solid #323232;
  border-bottom: 4px solid #323232;
  font-style: italic;
  color: #000;
}

blockquote div {
  padding: 0 48px;
  background: transparent url("../images/quoteright.gif") right bottom no-repeat;
}

p.alert {
	background-color: #026B00;
    text-align: left;
    padding: 5px 20px 5px 45px;
    border-top: 2px solid #000152;
    border-bottom: 4px solid #000152;
	color: #fff;
}

p.info {
    background-color: #000152;
    text-align: left;
    padding: 5px 20px 5px 45px;
    border-top: 2px solid #026B00;
    border-bottom: 4px solid #026B00;
	color: #fff;
}

p.warn {
    background-color: #cc0000;
    text-align: left;
    padding: 5px 20px 5px 45px;
    border-top: 2px solid #000152;
    border-bottom: 4px solid #000152;
	color: #fff;
}

/*  These classes can be used for headings in the left or right side columns.  */

.newsheading1 {
	font-size: 105%;
	font-weight: bold;
	color: #ffffff;
	padding: 4px;
    border-top: 2px solid #000;
    border-bottom: 4px solid #000;
   	background-color: #990000;
    text-align: center;
}

.newsheading2 {
	font-size: 105%;
	font-weight: bold;
	color: #ffffff;
	padding: 4px;
    border-top: 2px solid #990000;
    border-bottom: 4px solid #990000;
   	background-color: #000000;
    text-align: center;
}

/*  This class can be applied to your buttons to create uniform submit or shopping cart buttons without using graphics.  */

.submitbuttons {
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	font-size: 100%;
	font-family: Verdana, Arial, sans-serif;
	border-top: 1px solid #026B00;
	border-right: 5px solid #026B00;
	border-bottom: 1px solid #026B00;
	border-left: 1px solid #026B00;
	background-color: #000152;
	width: 155px;
	height: 30px;
}

a.submitbuttons {
	color: #ffffff;
	text-decoration: none;
	padding: 6px;
}

a:hover.submitbuttons {
	color: #ffffff;
	text-decoration: underline;
}

/*  The items below set the properties of the top header.  */

.headerleftcontent {
	padding: 3px 0px 0px 22px;
	font-weight: bold;
	color: #990000;
	text-align: left;
	font-size: 32pt;
	font-variant: small-caps;
	font-family: "Times New Roman", "Georgia", sans-serif;
}

.headerrightcontent {
	padding: 12px 10px 0px 10px;
}

.message {
	padding: 12px 10px 0 0;
	font-family: "Times New Roman", "Georgia", sans-serif;
	font-size: 200%;
	color: #000152;
	font-weight: bold;
	font-style: italic;
	text-align: right;
}


/*  The items below set the properties of the horizontal navigation links.  */

.topnavlinks {
	padding: 15px 10px 6px 8px;
	text-align: right;
	font-size: 78%;
	font-weight: bold;
}

.topnavlinks a:link, .topnavlinks a:visited {
	padding: 6px 10px 6px 10px;
	color: #fff;
	text-decoration: none;
	background-color: #000152;
}
	
.topnavlinks a:hover, .topnavlinks a:active {
	color: #fff;
	text-decoration: none;
	background-color: #026B00;
}

/*  The items below set the properties of the horizontal navigation links.  */

#tabs {
      float:left;
      width:100%;
      background:#ffffff;
	font-size: 100%;
	font-weight: bold;
      line-height:normal;
}

#tabs ul {
	margin:0;
	padding:2px 10px 0 250px;
	list-style:none;
	list-style-image: none;
}

#tabs li {
      display:inline;
      margin:0;
      padding:0;
}

#tabs a {
      float:left;
      background:url("../images/template/tableft.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
}

#tabs a span {
      float:left;
      display:block;
      background:url("../images/template/tabright.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#fff;
}
    
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}
    /* End IE5-Mac hack */
#tabs a:hover span {
      color:#fff;
      }
#tabs a:hover {
      background-position:0% -42px;
      }
#tabs a:hover span {
      background-position:100% -42px;
      }


/*  The items below sets the properties for the middle graphic area.  */

.middleleftcontent {
	padding: 5px 10px 10px 10px;
}

.mainimage {
	border: 4px solid #ffffff;
}

.middlerightcontent {
	padding: 35px 10px 10px 5px;
}




/* Used in single column layouts */
.bodycolumncontent {
	padding: 0px 20px 5px 20px;
}

/* Used in two column left nav layouts */
.body1content {
	padding: 0px 20px 5px 10px;
}

.body2content  {
	padding: 0px 0px 5px 8px;
}

/* Used in three column layouts */
.body1bcontent {
	padding: 0px 4px 5px 4px;
}

.body2bcontent {
	padding: 0px 0px 5px 8px;
}

.body3content {
	padding: 45px 8px 5px 4px;
}

/*  The items below sets the properties for the top left-side navigation items.  */

.menuheader1 {
	width: 200px;
	height: 30px;
	background: url('../images/template/menuheader.gif') no-repeat;
	text-align: center;
    padding: 8px 0px 0px 0px;
    margin: 4px 0 0 0;
	color: #fff;
}

.menuheader1 a:link, .menuheader1 a:visited {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

.menuheader1 a:hover, .menuheader1 a:active {
	color: #cccccc;
	text-decoration: none;
	font-weight: bold;
}

.menuheader2 {
	width: 185px;
	background-color: #026B00;
    text-align: left;
    padding: 4px;
    margin: 4px 0 0 0;
	color: #fff;
}

.menuheader2 a:link, .menuheader2 a:visited {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

.menuheader2 a:hover, .menuheader2 a:active {
	color: #cccccc;
	text-decoration: none;
	font-weight: bold;
}

.sidelinks {
	margin: 0px 0px 2px 0px;
	padding: 0px;
	text-align: left;
	font-weight: bold;
	font-size: 90%;
}

.sidelinks a:link, .sidelinks a:visited {
	padding: 0px 10px 0px 4px;
	display: block; 
	line-height: 18pt;
	width: 180px;
	border-right: 4px solid #ffffff;
	color: #000152;
	background-color: #fff;
	text-decoration: none;
}
	
.sidelinks a:hover, .sidelinks a:active {
	color: #026B00;
	background-color: #EEE6DD;
	border-right: 4px solid #026B00;
}

/*  The items below sets the properties for the footer.  */

.footercontent {
	padding: 12px 10px 0px 10px;
	color: #000152;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	font-size: 80%;
}

.footercontent a:link, .footercontent a:visited  {
	padding: 4px 4px;
	color: #000152;
	text-decoration: underline;
}

.footercontent a:hover, .footercontent a:active {
	padding: 4px 4px;
	color: #EEE6DD;
	text-decoration: underline;
}

.clear {
	clear: both;
}

.tiny {
	font-size: 80%;
}

.imageleft {
	float: left;
	padding: 8px;
}

.imageright {
	float: right;
	padding: 0 0 0 20px;
}


/*  All of the items below change the layout of the template. We advise that you don't change any of these settings unless you are an advanced CSS user. If you change these settings and mess up the template, we cannot provide support for the template.  */

/*  To keep the content centered on the page, all of the areas
are placed within a wrapper. The item below defines this wrapper.  */

#wrapper {
	margin: 0px auto; /* fix to center in firefox */
	width: 1004px;
	background: #000152 url('../images/template/wrapper.gif') repeat-y;
}

#header {
	text-align: center;
	margin: 0px auto; /* fix to center in firefox */
	width: 1004px;
	height: 103px;
	background: #000152 url('../images/template/header.gif') no-repeat;
}

#headerleft {
	float: left;
	width: 400px;
	height: 103px;
}

#headerright {
	float: right;
	width: 600px;
	height: 103px;
}

#headerrighttop {
	width: 600px;
	height: 60px;
}
#headerrightbottom {
	width: 600px;
	height: 37px;
}

#middle {
	margin: 0px auto; /* fix to center in firefox */
	background: #e4dace url('../images/template/middle.gif') no-repeat;
	width: 1004px;
	height: 330px;
}

#middleleft {
	float: left;
	width: 600px;
	height: 330px;
}

#middleright {
	float: right;
	width: 385px;
	height: 330px;
}

#footer {
	clear: both;
	margin: 0px auto; /* fix to center in firefox */
	height: 56px;
	width: 1004px;
	background: #000152 url('../images/template/footer.gif') no-repeat;
}


/* Used in single column layouts */
#bodycolumn {
	width: 1004px;
	clear: both;
	background: url('../images/template/bodycolumn.gif') no-repeat;
}

/* Used in two column layout with left navigation */
#body1 {
	width: 775px;
	float: right;
}

#body2 {
	float: left;
	width: 225px;
	min-height: 375px;
}

/* Used in two column layout with right navigation */
#body1a {
	width: 775px;
	float: left;
}

#body2a {
	float: right;
	width: 225px;
	min-height: 375px;
}

/* Used in three column layouts */
#body1b {
	width: 775px;
	float: left;
}

#body1c { 
	width: 550px;
	float: right;
}

#body2b {
	width: 225px;
	min-height: 375px;
	float: left;
}

#body3 {
	width: 225px;
	float: right;

}

/* End of Layout CSS */