/*------------------------------------------------------------
 Base style sheet used in development.
 Only basic elements and class styles should be defined here.
 Application or component specific should have their own css.
 Following the convention guide to add your styles 
 - HTML tag: upper case.
 - Class: uses Camel convention.
--------------------------------------------------------------*/

/*-------------------------------------*/
/* HTML element style				   */
/* All HTML element style must be here */
/*-------------------------------------*/

BODY {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 11px;	
	line-height: 1.3em;
	color:#222222;
	background: #fff url(../img/bg_body.gif);
	margin: 0;
	padding: 0;
	text-align: center;
}



#wrap {
	margin: 40px auto 0 auto;
	padding: 0;
	width: 800px;
	background: white;
	border: solid 1px #B4BADE;
	text-align: left;
}

#top {
	margin: 10;
	padding: 0;
	background: white url(../img/side1.jpg) no-repeat right;
}

#topname 
{
	margin: 0;
	padding: 35px;
	font-size: 28px;
	font-weight: bold;
	color: White;
}

#toppic 
{
	filter:blendTrans(duration=6);
	height:88px;
	width: 780px;
	background: transparent url(../img/side1.jpg) no-repeat right;
	margin: 0;
	padding: 0;	
}



#left {
	float:left;
	width: 170px;
	margin: 0 0 0 10px;
	display: inline;
	padding: 0;
}

#right {
	margin: 0 0 0 200px;
	color: #444;
	width:580px;
}

#browser
{
	width:100%;
	padding: 0px;
	border: solid 1px #999;
	background-color: #efefef;
	text-align: center;
	font-weight: bold;
	display: block;
}

.spacer {
	height: 30px;
}

.center {
	text-align: center;
}

.blockimg
{
	display: inline;
	padding: 10px
}


.clear {
	clear: left;
	height: 10px;
	/*background: transparent url(../img/white_bottom.gif) repeat-y 20px 0;*/
}

#bottom_left {
	height: 20px;
	float: left;
	width: 130px;
	display: none;
}

#bottom_right {
	height: -2px;
	width: 99%;
	
}

#copy {
	margin: 1px auto 0 auto;
	padding: 0;
	width: 798px;
	text-align: right;
	font-size: 9px;	
	color: #999;
}

#menu span, #shop span, #contact span
{
	color: #333;
	display: block;
	font-size: 11px;
	padding: 1px;
	text-align: center;
	border: solid 1px #ccc;
	height: 35px;
}

#menu span
{
	background:url('../img/nav1.jpg') repeat-x 0 bottom;
}

#shop span
{
	background:url('../img/nav2.jpg') repeat-x 0 bottom;
}

#contact span
{
	background:url('../img/nav3.jpg') repeat-x 0 bottom;
}


#menu, #shop, #contact 
{
	font-size: 10px;
	text-transform: uppercase;
	background: #fff;
	padding-bottom: 20px;
	padding: 1px;
	border: solid 1px #B4BADE;
}

#menu ul, #shop ul, #contact ul
{
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid #eee;
}

#menu ul li a, #shop ul li a, #contact ul li a{
	padding-left: 5px;
	display: block;
	color: #444;
	height: 20px;
	text-decoration: none;
	text-transform: uppercase;
	line-height: 20px;
	
	/*background: #fff url(../img/new_bg_menu.gif) no-repeat;*/
	border: solid 1px white;
	border-bottom: 1px solid #eee;
	
}

#menu ul li a:hover, #shop ul li a:hover, #contact ul li a:hover {
	/*background-position: -399px 1px;*/
	border: solid 1px #FFE7a3;
	background-color: #FFFDDE;
}

#menu ul li.selected a, #shop ul li.selected a, #contact ul li.selected a {
	background-position: -399px 1px;
	font-weight: bold;
	color: black;
}

#menu ul li.selected a:hover, #shop ul li.selected a:hover, #contact ul li.selected a:hover {
	background-color: #666;
}

#menu ul li a span, #shop ul li a span, #contact ul li a span {
	background: #000;
	color: #fff;
}

#menu ul li a.submenu, #shop ul li a.submenu, #contact ul li a.submenu
{
	/*margin: 0 0 0 10px;*/
	padding-left: 20px;
}


/*
#top { background: transparent url(../img/bg_top.gif) no-repeat bottom right; }

#main { background: transparent url(../img/bg_left.gif) no-repeat top left; }

#bottom_left { background: transparent url(../img/bg_leftdown.gif) no-repeat top left; margin-right: -5px; }

#bottom_right { background: transparent url(../img/bg_rightdown.gif) no-repeat top right; margin: 0; }

#main_inner { background: transparent url(../img/bg_right.gif) no-repeat top right; }
*/

h2, h2 span {
	font-size: 13px;
	font-weight: bold;
	margin: 18px 0;
	text-align: right;
}

h2.start {
	margin-top: 0;
	text-transform: uppercase;
}

h3 {
	font-size: 13px;
	font-weight: bold;
	margin: 18px 0;
}

h3.start {
	margin-top: 0;
}

.hidden {
	display: none;
	visibility: hidden;
}


/*        */

TD, DIV, SPAN, P {
	letter-spacing:-0.5pt;
}

TD, DIV, SPAN, P,INPUT, TEXTAREA {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:#222222;
}

P {
	margin-top:		8pt;
	margin-bottom:	8px;
}

/* Links */
A {
	color: 			 #2222AA;
	text-decoration: none;
}
A:hover {
	text-decoration: none;
	color: 			 #AA2222;
}
A.Underlined
{
	text-decoration: underline;
}

SELECT {
	font-family: 	Verdana, Arial, Helvetica;
	font-size: 		10pt;
	border:			#999999 1px solid; 
	color:			#333333; 
	padding:		0px; 
	margin:			0px; 
}

INPUT.TextBox
{
	padding:		2px;
	margin:			2px; 
	
	background-position: top; 
	border:			#999999 1px solid; 
	color:			#333333; 
}

TEXTAREA
{
	padding:		2px; 
	margin:			2px; 	
	background-position: top; 
	border:			#999999 1px solid; 
	color:			#333333; 
}

INPUT.TextBox
{
	height:			22px; 
}

IMG 
{
	border:			none;
	display: block;
}

BUTTON, INPUT.button, Button, INPUT.submit
{
	cursor: hand;
	border:#999999 1px solid;
	border-top:#CCCCCC 1px solid;
	border-left:#CCCCCC 1px solid;
	background-color:#FFFFFF;	
	background-position: 	bottom;
	color:#666666;
	text-align: center;
	text-decoration:none;
	letter-spacing:-0.5pt;
	background: url('../img/icon_tab.gif');
	height:22px;
	font-size: 				8pt;
	font-family: 			Verdana, Arial, Helvetica;
	margin:			2px; 
}

INPUT.file
{
	border:#999999 1px solid;	
	letter-spacing:-0.5pt;
	width: 315px;
	height:22px;
	font-size: 				8pt;
	font-family: 			Verdana, Arial, Helvetica;
	margin:			2px; 
}

FORM
{
	margin-top: 0px;
}

/*-------------------------------------*/
/* Font behaviours					   */
/*-------------------------------------*/
.italic {
	font-style: 		italic;
}

.bold {
	font-weight:		bold;
}

.fixedfont {
	font-family: 		Lucida Console;
	font-size: 			8pt;
}

.tableDefault
{
	color: #333;
	background-color: #fff;
	border: solid 1px #999;
	padding: 3px;	
	vertical-align:top;
}

.tableHeader
{
	background:url('../img/icon_tab.gif');
	color: #333;
	font-weight: bold;
	border-left: solid 0px #ddd;
	border-right: solid 0px #ddd;
	border-bottom: solid 1px #999;
	border-top: solid 0px #ddd;
	height: 25px;
	white-space:nowrap;	
	margin: 0;
	padding: 0;	
}

/*--------------------------------------------------------------------------------------------------*/
/* Pacman  - Grid styles are used for the amp:datagrid                                                                           */
/*--------------------------------------------------------------------------------------------------*/
.gridDefault
{
	color: #333;
	background-color: #fff;
}

.gridTitle, .gridFooter {
	height: 24px;
	background-color: #EEEEEE;
	font-weight:bold;
	color: #666666;
	padding: 3px;
	border-bottom: #CCCCCC 1px solid;
	border-top: #CCCCCC 1px solid;
}

.gridFoundCount {
	height: 24px;
	background-color: #EEEEEE;
	font-weight:bold;
	color: #666666;
	padding: 0px 3px 3px 3px;
	border-bottom: #CCCCCC 1px solid;
}

.gridHeader {
/*
	border:solid #DDDDDD 1px; 
	background-color:#DDDDDD;
	color:			#555555;
	letter-spacing:-0.5pt; 
	padding:5px; 
*/
}

.gridDefault TD {
	border-top: 1px solid #fff;	
	border-bottom: 1px solid #ddd;	
	padding: 3px;	
	vertical-align:top;
}

.gridExportExcel TD {
	border-top: 1px solid #ddd;	
	border-bottom: 1px solid #ddd;	
	padding: 3px;	
	vertical-align:top;
	border-left: 1px solid #ddd;	
	border-right: 1px solid #ddd;	
}

.ExportExcelHeader
{
	background-color : LightBlue;
	font : bold;
}

.gridHeader TD
{
	background:url('../img/icon_tab.gif');
	color: #333;
	font-weight: bold;
	border-left: solid 1px #ddd;
	border-right: solid 0px #ddd;
	border-bottom: solid 1px #999;
	border-top: solid 1px #ddd;
	height: 25px;
	white-space:nowrap;		
}

.gridHeader TD A
{
	color: #3399cc;
	text-decoration:underline;
}

.gridSubHeader {
	font-family: Verdana, Arial, Helvetica;
	font-size: 8pt;
	height: 20px;
	background-color: #EBF5FE;
	color: #105294;
	padding: 1px;
}

.gridData {
	padding: 3px;
	background-color: white;		
}

.gridButton {

}

.gridExport {

	padding: 3px;
	background-color: white;
	text-align : right;
}

.gridHigh {
	background-color: #fafafa;
	
}

.gridLow {
		background-color: #fff;
}

.gridHover TR
{
	border: #ccc 1px solid;
}
.gridHover TD
{
	background-color: #EEF6FA;
	cursor: hand;
}

.noHand {	
	cursor:default;		
}


/*core drop shadow rules*/
.dropouter, .dropbottomleft, .droptopright {
	display:inline-table;
	/* \*/display:block;/**/}

.dropouter {float:left; background: transparent url(../img/shadow.gif) right bottom no-repeat; width: 100%; }
.dropbottomleft {background: transparent url(../img/corner_bl.gif) -14px 100% no-repeat;}
.droptopright {
	padding:0 8px 8px 0;
	background: transparent url(../img/corner_tr.gif) 100% -14px no-repeat;
	}
.droppadding {
	padding:16px;
	border: solid 1px #ccc;
	background: white;
	}