/* CSS Document */

/*
---------------------------------------------------------------------------

Syfolink Golbal Basic Style Sheet 
Created by : Syfolink Innotech Limited
Date of Modification : 20 Feb 2009
Verison :  2.0 

---------------------------------------------------------------------------

Copyright 2008 Syfolink Innotech Ltd. All right reserved 


==================== Content =========================
01) Imported Control CSS
02) Global Style 
03) Header Section 
04) Menu Section
05) Content Section
06) Page Content section 
07) Left Page Section
08) Bottom Section
09) Admin Page 
======================================================

*/

/*
*************************************************************************

Imported Imported CSS 

*************************************************************************
*/

@import url(hacker.css);

/*
*************************************************************************

Global Style 

*************************************************************************
*/

body{	
	background-image: url('../images/header/header_wrapper.jpg');
	background-repeat:repeat-x;
	background-color:black;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333333;
	margin:0px;
	padding:0px;
}

a
{
    color:#3a85e2;
	text-decoration:none;
}

a:hover{
	text-decoration: underline;
}
img 
{
    display:block;
}

/*
*************************************************************************

Header Section

*************************************************************************
*/

/* ============[ Structure ]======================= */

#globalheaderwrapper{ /*--// This is the outermost headerwrapper of the site //--*/
	margin:0px;
	padding:0px;
	width:100%;
	height:86px;
	background-image: url('../images/header/header_wrapper.jpg');
	background-repeat:repeat-x;
	z-index:1000;
	position:relative;
	top:0px;
}
#headercontentcontainer{
	margin:auto;
	width:950px;
	height:86px;
	background-image: url('../images/header/header_container.jpg');
	background-repeat:no-repeat;
	position:relative;
    /*top: 0px;
    left: 0px;*/
}



/* ============[ News Section ]======================= */

#headercontentcontainer #news{ /* --// It controls the absolute position of the news section  // --*/
	width:453px;
	height:16px;
	position:absolute;
	top: 4px;
	left: 107px;
	color:white;
	font-size:11px;
	overflow: hidden;
}
#news a{
	color:#fff;
	text-decoration:none;
}
#news a:hover{
	text-decoration: underline;
}
#news #newsContent{
	overflow: hidden;
}
#news #newsMessage{
	text-align:left;
	font-size:11px;
	line-height:14px;
}



/* ============[ Indicator Section ]======================= */

#headercontentcontainer  #indicator{ /* --// It controls the absolute position of the indicator  // --*/
	width:197px;
	height:26px;
	padding-top:3px;
	padding-left:8px;
	padding-right:8px;
	position:absolute;
	color:White;
	/*
	color:#f1c53e;
    */
	font-size:14px;
	text-align:center;
	top: 86px;
	right:-8px;
	background-image: url('../images/header/comindicator_bkg.png');
	background-repeat:no-repeat;
}


/* ============[ Logo ]======================= */

#logo{ /* --// It controls the absolute position of the logo // --*/
	width:146px;
	height:41px;
	background-image: url('../images/header/logo.jpg');
	background-position:top top;
	background-repeat:no-repeat;
	position: absolute;
	z-index:2000;
	top: 35px;
	left: 800px;
}



/*
*************************************************************************

Menu Section

*************************************************************************
*/

/* ============[ Structure]======================= */

#menubar{ /* --// It controls the absolute position of the menu bar  // --*/
	width:621px;
	height:25px;
	padding-left:15px;
	padding-right:10px;
	position:absolute;
	top: 50px;
	left: 0px;
}

/* ============[ Static Menu Style]======================= */

#menubar .globalstaticmenu{
	margin-left:-10px;
}

#menubar .globalstaticmenuitems{
	color:#999999;
	font-size:12px;
	padding:5px;
	text-decoration:none;
}

#menubar .staticglobalmenuhover{
	background-color:black;
	color:white;
}
#menubar .hovermenuitems a{
	text-decoration:none;
}
#menubar .selectedglobalmenuitems{
	color:white;
	text-decoration:none;
	
}


/* ============[ Dynamic Menu Style ]======================= */

#menubar .dynamicmenu{
	width:200px;
	background-color:white;
	
}
#menubar .dynamicmenuitems{
	width:200px;
	height:25px;
	overflow:hidden;
	background-color: transparent;
	color:#989898;
	font-weight:normal;
	border-bottom:1px #e1dede solid;
}
#menubar .dynamicmenuitems a{

}
#menubar .dynamichovermenuitems{
	color:#610000;
}
#menubar .dynamichovermenuitems a{
	text-decoration:none;
}

/*
*************************************************************************

Content Section 

*************************************************************************
*/

/* ============[ Basic structure ]======================= */

#globalcontentwrapper{ /*--// This is the outermost wrapper area of Content of the site //--*/
	margin:0px;
	padding:0px;
	width:100%;
	background-image: url('../images/content/content_wrapper.jpg');
	background-repeat:repeat-x;
	background-color: black;
	z-index:1010;
}
#globalcontentcontainer{
	margin:auto;
	width:950px;
	padding-left:19px;
	padding-right:19px;
	/*min-height:218px;*/
	background-image: url('../images/content/content_container.jpg');
	background-repeat:no-repeat;
	background-color:black;
	z-index:1000;
}
.globalcontentbackground
{
    width:950px;
    background-image:url('../images/content/content_background.jpg');
    background-repeat:repeat-y;
}
    
#globalindexpromotion{
	width:950px;
	overflow:hidden;
	padding:0px;
	margin:0px;
}






/*
*************************************************************************

Page Content Section 

*************************************************************************
*/


/* ---// Description on the Content Section: 

The content section is divided into TWO ( Left and Right )sections by div. 

(1) Left hand side. This is the "Promotion Area". Its width is controlled by the 
class "additionalareawrapper" below. 

(2) Right hand side. This is the dynamic content area. 

-----//*/

/* ============[ Basic Structure ]======================= */

.pagecontentcontainer{/*--// This control the outermost table that wrap the content //--*/
	width:100%;
	border-collapse:collapse;
	border:0px;
	padding:0px;
	margin:0px;
	z-index:900;
}
.pagecontentleft
{
	float:left;
}
.pagecontentright
{
	float:right;
}

/*
*************************************************************************

Imported Imported CSS 

*************************************************************************
*/

/* ============[ Basic Structure ]======================= */


.additionalareawrapper{/*--// This control the div that wrap the additional infromation area //--*/
	width:260px;
	overflow:hidden;
}

/* ============[ Promotion Area ]======================= */

.pagepromcontentwrapper{/*--// This control the div that wrap the content //--*/
	width:260px;
	background-image: url('../images/content/page/promote_content.jpg');
	background-repeat: repeat-y;
}

/* Structure
-------------------------------------------------------*/
.pagepromcontentwrapper .container{ /* Control the style of the table container*/
	width:260px;
	min-height:60px;
	background-image:url('../images/content/page/promote_items_bkg.jpg');
	background-repeat:no-repeat;
}



/* Picture Section 
-------------------------------------------------------*/
.pagepromcontentwrapper .pic{
	width:75px;
	overflow:hidden;
	text-align:center;
	float:left;
	margin-top:1px;
}

/* Pcontent Section Style 
-------------------------------------------------------*/
.pagepromcontentwrapper .contentcontainer{ 
    float:right;
}
.pagepromcontentwrapper .contentitems{ /* Control the style of the containeritems*/
	vertical-align:top;
	width:178px;
}
.pagepromotiontitle{
	font-size:11px;
	color:#910000;
	font-weight:bold;
	padding-right:15px;
	padding-top:8px;
	padding-left:5px;
}
.pagepromotiontext{
	font-size:10px;
	color:#333333;
	padding-right:10px;
	padding-top:5px;
	padding-left:5px;
}
.pagepromotiondetail{
	text-align:right;
	padding-right:20px;
	padding-top:3px;
	padding-bottom:5px;
}

#pagepromotebottomwrapper{
	width:260px;
	height:10px;
	background-image:url('../images/content/page/promote_content_bottom.jpg');
	background-repeat:no-repeat;
	padding-bottom:8px;
}
	
/* ============[ Additional Information]======================= */

/* Strcuture
-------------------------------------------------------*/
#pageadditionalfunction{
	width:260px;
	display:block;
	padding-bottom:5px;
}
#pageadditionalfunctiontop{
	width:260px;
	height:1px;
	_margin-bottom:-15px;
	background-image: url('../images/content/page/addfunction_content_top.jpg');
	background-repeat:no-repeat;
	background-position:top;
}
.pageadditionalfitems{
	width:260px;
	height:39px;
	overflow:hidden;
	background-image: url('../images/content/page/addfunction_content.jpg');
	background-repeat:no-repeat;
	background-position:bottom;
	text-align:right;
	color:white;
	font-size:10px;
	font-weight:bold;
	padding-left:35px;
	padding-right: 35px;
}
.pageadditionalfitems a{
	color:white;
	font-size:11px;
	font-weight:bold;
	display:block;
	text-decoration:none;	
}
.pageadditionalfitems a:hover{
	color:Black;
	text-decoration:none;	
}



/* GlobalContent Area 
--------------------------------------------------------*/
.globalcontentwrapper{
	background-color:white;
	vertical-align:top;
}
/* GlobalClear
--------------------------------------------------------*/
.clear
{
	clear:both;
}




/*
*************************************************************************

Bottom Section 

*************************************************************************
*/

/* ============[ Basic structure ]======================= */
#globalbottomwrapper{
	width:100%;
	overflow:hidden;
	background-image: url('../images/bottom/footerbkg.jpg');
	background-repeat:repeat-x;
}
#globalbottomcontainer{
	width:950px;
	padding-top:2px;
	margin:auto;
	background-color:#202020;
	position:relative;
	color:#b4b4b4;
	height:19px;
	font-size:09px;
	margin-top:1px;
}

/* ============[ Additional Messages ]======================= */
#messagepromotion{
	width:743px;
	padding-left:5px;
	padding-top:5px;
	position:absolute;
	top:0px;
	left:0px;
}

/* ============[ Site Map ]======================= */
#sitemap{
	width:150px;
	position:absolute;
	top:0px;
	right:0px;
	padding-right:5px;
	padding-top:5px;
	text-align:right;
}

/* ============[CopyRight]======================= */
#copyright{
	padding-top:10px;
	text-align:center;
	font-size:09px;
}





/*
*************************************************************************

Admin Page Style 

*************************************************************************
*/

#headercontentcontainer_admin{
	margin:auto;
	width:950px;
	height:86px;
	background-image: url('../images/header/header_container_admin.jpg');
	background-repeat:no-repeat;
	position:relative;
}

/* ============[ System Message ]======================= */

#headercontentcontainer #SysMsg{ /* --// It controls the absolute position of the System Message section  // --*/
	width:458px;
	height:16px;
	position:absolute;
	top: 3px;
	left: 107px;
	color:white;
	font-size:11px;
	overflow: hidden;
}
#SysMsg a{
	color:#fff;
	text-decoration:none;
}
#SysMsg a:hover{
	text-decoration: underline;
}
#SysMsg #SysMsgContent{
	overflow: hidden;
}
#SysMsg #SysMsgMessage{
	text-align:left;
}

#headercontentcontainer_admin  #indicator{ /* --// It controls the absolute position of the indicator  // --*/
	width:181px;
	height:16px;
	position:absolute;
	color:#f1c53e;
	font-size:10px;
	font-weight:bolder;
	text-align:center;
	top: 4px;
	left: 588px;
}

/* UserAuth
-------------------------------------------------------*/
#headercontentcontainer  #UserAuth{ /* --// It controls the absolute position of the UserAuth  // --*/
	width:150px;
	height:32px;
	background-image: url('../images/header/header_userauth_bg1.gif');
	position:absolute;
	top: -20px;
	left: 788px;
}

#UserAuth .UserAuthShow{ /* --// It controls the absolute position of the UserAuth  // --*/
	width:150px;
	height:32px;
	background-image: url('../images/header/header_userauth_bg0.gif');
	position:absolute;
	top: 0px;
	left: 788px;
}

#UserAuth .UserAuthHide{ /* --// It controls the absolute position of the UserAuth  // --*/
	width:150px;
	height:32px;
	background-image: url('../images/header/header_userauth_bg1.gif');
	position:absolute;
	top: -20px;
	left: 788px;
}

#UserAuth #UserAuthContent
{
	color:white;
	font-size:10px;
	text-align:center;
}


/* --[ Menu_Admin Section ]---*/

#menubar_admin{ /* --// It controls the absolute position of the menu_admin bar  // --*/
	padding:15px 0px 15px 45px;
}
#menubar_admin .globalstaticmenu{
	margin-left:-10px;
}

#menubar_admin .globalstaticmenuitems{
	color:#888888;
	font-size:12px;
	padding:5px;
	text-decoration:none;
}

#menubar_admin .staticglobalmenuhover{
	background-color:#FFDF72;
	color:white;
}
#menubar_admin .hovermenuitems a{
	text-decoration:none;
}
#menubar_admin .selectedglobalmenuitems{
	color:white;
	text-decoration:none;
}

/* --[ Dynamic Menu_Admin Items ]
--------------------------------------------------------*/
#menubar_admin .dynamicmenu{
	width:150px;
	background-color:white;
	border:1px gray solid;
	border-bottom:none;
	border-top:none;
	
}
#menubar_admin .dynamicmenuitems{
	width:150px;
	height:25px;
	overflow:hidden;
	background-color: transparent;
	color:#989898;
	font-weight:normal;
	border-bottom:1px #e1dede solid;
}
#menubar_admin .dynamicmenuitems a{

}
#menubar_admin .dynamichovermenuitems{
	color:#CCCA51;
}
#menubar_admin .dynamichovermenuitems a{
	text-decoration:none;
}