/* CSS Document */

body
{
margin:0;
padding:0;
font-family:"arial",verdana,tahoma,helvetica,clean,sans-serif;
font-size:11px;
background:#ccc;
}

a:link , a:visited
{
text-decoration:none;
color: #333;
}

img
{
border:0px;
}

#wrapper
{
}

#main
{
width:880px;
background-color:#7d7d7d;
min-height:694px;
}

#sidebar
{
width:159px;
float:left;
background-color:#7d7d7d;
min-height:698px;
}

#content
{
width:721px;
float:left;
background-color:#aeafb3;
}

.clear
{
clear:both;
}

#header
{

height:56px;
padding-left:10px;
}

#header .nav
{
padding:0;
margin:0;
padding-top:25px;
font-weight:bold;
color:#ffffff;
list-style:none;

}

#main_content_home
{
background:url(../images/home_img1.jpg) top left no-repeat;
width:721px;
height:240px;
}

#showcontent
{
background:url(../images/content_bg_home.jpg) top right no-repeat;
min-height:690px;

width:721px;
}



#showcontent #head h1
{
color:#5a5c62;
margin-bottom:5px;
margin-top:5px;
font-size:24px;
}

#showcontent #head #intro
{
color:#757575;
font-size:12px;
font-weight:700;
width:650px;
padding-bottom:15px;
}

#truck
{
background:url(../images/truck.jpg) no-repeat;
height:185px;
}

#bottom
{
}

#bottom #left
{
float:left;
width:457px;
color:#757575;
font-size:12px;
font-weight:700;
padding-left:30px;
padding-top:25px;
}

#bottom #right
{
float:left;
color:#757575;
font-size:12px;
font-weight:700;
padding-top:40px;
padding-left:40px;
}

.list li
{
margin-bottom:5px;
}

#navigation
{
padding:0;
margin:0;
list-style:none;
font-weight:bold;
}

#navigation li
{
background:url(../images/sidebar_bg.jpg) no-repeat;
min-height:30px;

}

#navigation li a:link, #navigation li a:visited
{
color:#bababb;
text-decoration:none;
line-height:23px;
}

#navigation li a:hover
{
color:#FF9933;
text-decoration:none;
line-height:23px;
}

.menu_list {	
	width: 159px;
}
.menu_head {
	padding: 5px 10px;
	cursor: pointer;
	position: relative;
	margin:0px;
    font-weight:bold;
    background:url(../images/sidebar_bg.jpg) no-repeat;
	height:20px;
	color:#d7d7d7;
}
.menu_body {
	display:none;
}
.menu_body
{
	color:#bababb;
		background-color:#333;
	padding:10px;
	padding-left:15px;
	text-align:left;
	height:200px;
}

#cssdropdown, #cssdropdown ul { list-style: none; }
#cssdropdown, #cssdropdown * { padding: 0; margin: 0; }

#cssdropdown li.headlink { width: 135px; float: left; margin-left: -1px;   text-align: center; }
#cssdropdown li.headlink a { display: block;  color:#ffffff; font-weight:bold; padding-top:15px; }
#cssdropdown li.headlink a:hover{color:#FF9900}

#cssdropdown li.headlink ul { display: none;  text-align: left;   z-index:1; position:absolute; padding-top:5px; padding-left:20px}
#cssdropdown li.headlink:hover ul { display: block; z-index:9999; position:absolute; background:#000000;  width:110px}
#cssdropdown li.headlink ul li a { padding: 5px; height: 17px; color:#ffffff  }
#cssdropdown li.headlink ul li a:hover { color:#FF9900 }

li.sublink ul.subul{display:none}
li.sublink:hover ul.subul{display:block; position:relative; left:100px; top:-20px}

#cssdropdown a { color: #000000; } #cssdropdown ul li a:hover { text-decoration: none; }
#cssdropdown li.headlink {  }
#cssdropdown li.headlink ul {  z-index:1}

.menu_bottom{
	color:#bababb;
	text-align:left;
}
.header_right{
float:right;  width:83px; height:113px; margin-right:46px; margin-top:20px; color:#b4b4b4;text-align:left
}
.header_right ul{ margin:0px; padding:0px; list-style:none;}
.header_right li{ padding-bottom:5px;}
.header_right li a{ color:#b4b4b4}
.header_right li a:hover{ color:#ffffff}
#ie{ height:1px; display:none; }
#NC3{ height:12px; display:none; }
.font_bottom{
	background:url(../images/footer_trans.png) repeat;

	}

#bottom_index_left
{
float:left; margin-left:33px; margin-top:8px; margin-bottom:11px; width:102px; 
}

#bottom_index_right
{
float:left; color:#000;  width:523px; margin-top:13px; margin-left:20px;
}

#index_height
{
height:auto;
}
/* menu top*/

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
	padding-top:10px;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
	text-align:left;
	background:url(../images/transparent.png) repeat;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
		font-weight:bold;
}
.sf-menu a {
	border-left:	0px solid #fff;
	border-top:		0px solid #CFDEFF;
	padding: 0.75em 5px;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:	#000;
		text-decoration:none;
}
.sf-menu li {
padding:0;
}
.sf-menu li li, .sf-menu li li a, .sf-menu li li a:visited  {
color:#b4b4b4 !important;
background:url(../images/transparent.png) repeat;
		text-decoration:none;
}
.sf-menu li li a:hover
{
color:#fff  !important;
}
.sf-menu li li li, .sf-menu li li li a, .sf-menu li li li a:visited {
color:#b4b4b4 !important;
background:url(../images/transparent.png) repeat;
		text-decoration:none;
}

.sf-menu li li li a:hover {
color:#fff !important;
}

.sf-menu li:hover a, .sf-menu li:hover a:visited, 
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:0;
	color:#ffffff;
	background:url(../images/transparent.png) repeat;
	text-decoration:none;
}

.litop
{
border-top:1px solid #4e4e4e;
}


.current a
{
	color:#fff;
}
/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	/* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}


.sep
{
position:relative;top:7px; color:#000; font-weight:bold;
}

.menu_body a:link, .menu_body a:visited
{

color:#ffffff;
text-decoration:none;
}


/* SpryAccordion.css - version 0.4 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main Accordion container. For our default style,
 * we draw borders on the left, right, and bottom. The top border of the Accordion
 * will be rendered by the first AccordionPanelTab which never moves.
 *
 * If you want to constrain the width of the Accordion widget, set a width on
 * the Accordion container. By default, our accordion expands horizontally to fill
 * up available space.
 *
 * The name of the class ("Accordion") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * Accordion container.
 */
.Accordion {
	overflow: hidden;
	width: 158px;
	font-size: .85em;
}

/* This is the selector for the AccordionPanel container which houses the
 * panel tab and a panel content area. It doesn't render visually, but we
 * make sure that it has zero margin and padding.
 *
 * The name of the class ("AccordionPanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel container.
*/
.AccordionPanel {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the AccordionPanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open a specific panel.
 *
 * The name of the class ("AccordionPanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel tab container.
 *
 * NOTE:
 * This rule uses -moz-user-select and -khtml-user-select properties to prevent the
 * user from selecting the text in the AccordionPanelTab. These are proprietary browser
 * properties that only work in Mozilla based browsers (like FireFox) and KHTML based
 * browsers (like Safari), so they will not pass W3C validation. If you want your documents to
 * validate, and don't care if the user can select the text within an AccordionPanelTab,
 * you can safely remove those properties without affecting the functionality of the widget.
 */
.AccordionPanelTab {
background:transparent url(../images/sidebar_bg.jpg) no-repeat scroll 0 0;
color:#D7D7D7;
cursor:pointer;
font-weight:bold;
height:20px;
margin:0;
padding:5px 10px;
position:relative;
font-size:11px;
}

/* This is the selector for a Panel's Content area. It's important to note that
 * you should never put any padding on the panel's content area if you plan to
 * use the Accordions panel animations. Placing a non-zero padding on the content
 * area can cause the accordion to abruptly grow in height while the panels animate.
 *
 * Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
 * Content container.
 *
 * The name of the class ("AccordionPanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * accordion panel content container.
 */
.AccordionPanelContent {
	overflow: hidden;
	margin: 0px;
	padding-top: 5px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom: 5px;
	height: 200px;
	background-color:#333333;
	color:#BABABB;
	height:239px;
	text-align:left;
	
	font-size:11px;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "AccordionPanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the Accordion.
 */
.AccordionPanelOpen .AccordionPanelTab {
	background-color: #EEEEEE;
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.AccordionPanelTabHover {

}
.AccordionPanelOpen .AccordionPanelTabHover {

}

/* This is an example of how to change the appearance of all the panel tabs when the
 * Accordion has focus. The "AccordionFocused" class is programatically added and removed
 * whenever the Accordion gains or loses keyboard focus.
 */
.AccordionFocused .AccordionPanelTab {
background:transparent url(../images/sidebar_bg.jpg) no-repeat scroll 0 0;
color:#D7D7D7;
cursor:pointer;
font-weight:bold;
height:20px;
margin:0;
padding:5px 10px;
position:relative;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
	background-color: #33CCFF;
}

.AccordionPanelContent a:link, .AccordionPanelContent a:visited
{
	color:#BABABB; text-decoration:none;
}