﻿/* CSS Document */


/* -- //

---------------------------------------------------------------------------

King Comics.com Basic Global Style 
Created by : Syfolink Innotech Limited
Date of Modification : 29 May 2009
Verison :  0.2

---------------------------------------------------------------------------
Copyright 2008 Syfolink Innotech Ltd. All right reserved 


==================== Content =========================
01) Imported Control CSS
02) Global Style 
03) Global Structure 
04) Global Header
05) global Content Section
06) Global Footer
======================================================

//------ */

/*
*************************************************************************

Global Style 

*************************************************************************
*/

body{
	margin:0px;
	padding:0px;
	font-family:新細明體, "Arial Unicode MS";
	color:#333333;
	font-size:11px;
	line-height:18px;
}
h1,h2,h3,h4
{
	line-height:normal;
	}

/*
img{
	display:block;
}*/

/*
*************************************************************************

Global Structure 

*************************************************************************
*/

#globalwrapper{	
	width:1000px;
	margin:auto;
}
#globalheaderwrapper{
	width:1000px;
	background-image: url('../images/global/header/headerbackground.jpg');
	background-repeat:repeat-x;
	height:106px;
	z-index:100;
	position:relative;
	top: 0px;
	left: 0px;
}
#globalfooterwrapper{
	width:1000px;
	height:26px;
	position:relative;
}
#globalcontentwarpper{
	width:1000px;
	min-height:400px;
}
#globalcontentwarpper2{
	width:810px;
	margin:auto;
	margin-top:10px;
	min-height:400px;
	height:auto !important;
	height:400px;
}


/*
*************************************************************************

Global Header 

*************************************************************************
*/
/*
========================================================================
Header Section
========================================================================
*/
#globalheaderwrapper #logo{
	width:152px;
	height:61px;
	position:absolute;
	top: 5px;
	left: 20px;
}
#headeradv{
	width:470px;
	height:60px;
	overflow:hidden;
	position:absolute;
	top: 4px;
	left: 517px;
}
#globalheaderwrapper #welcomemsg{
	width:100px;
	height:14px;
	color:white;
	font-weight:bold;
	position:absolute;
	top: 68px;
	left: 23px;
	right: 877px;
}
/* Additional Menu 1 
--------------------------------------------------------------------*/
#addmenu1{ /* control the position */
	height:15px;
	position:absolute;
	top: 86px;
	left: 24px;
}

#addmenu1 .item{ 
	padding-left:3px;
	padding-right:5px;
	border-right:1px blue solid;
	color:blue;
}
/* Additional Menu 2 Structure
--------------------------------------------------------------------*/
#addmenu2{/*control the position */
	width:527px;
	background-color:#ED1C24;
	position:absolute;
	height:30px;
	top: 74px;
	left: 205px;
	right: 268px;
	z-index:500;
}
/* Additional Menu 2 Style
--------------------------------------------------------------------*/
#addmenu2 .staticmenuitems{
	color:white;
	font-size:12px;
	padding-right:5px;
}
#addmenu2 .dynmenubkg{
	background-color:#cc0000;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
}
#addmenu2 .dynmenuitems{
	color:white;
	margin-bottom:10px;
	
}


/* Searching 
--------------------------------------------------------------------*/
#search{
	width:226px;
	height:25px;
	background-image: url('../images/global/header/searchbkg.jpg');
	background-repeat:no-repeat;
	position:absolute;
	top: 75px;
	left: 759px;
	vertical-align:middle;
}
#search .textbox{
	width:125px;
	margin-left:40px;
	float:left;
}
#search .searchbtn{
	float:right;
	width:38px;
	height:23px;
}

/*
========================================================================
Menu Section
========================================================================
*/
#menu{
	width:100%;
	background-image:url('../images/global/header/menubackground.jpg');
	background-repeat:repeat-x;
	height:20px;
	padding-top:3px;
	padding-bottom:3px;
	position:absolute;
	bottom:0px;
	left:0px;
	text-align:center;
}

#menu .itemwrapper 
{
    width:500px;
	height:15px;
	margin:auto;
}

#menu .item
{
    color:White;
    font-size:14px;
    font-weight:bold;
    padding-right:20px;
}
#menu .item a
{
    color:White;
    text-decoration:none;
}
#menu .item a:hover
{
    color:White;
    text-decoration:underline;
}

/***** [ Menu Item Style ] ****/

.menu
{	
	padding:8px;
	margin:0px;
	background-color:Transparent;
	line-height:11px;
	color:White;
	font-weight:bold;
	width:auto;
	
}
.mainmenuitem
{
	padding:8px;
	margin:0px;
	background-color:Transparent;
	line-height:11px;
	color:White;
	font-weight:bold;
	width:auto;
	
	}
.submenuitem
{
	padding:8px;
	margin:0px;
	background-color:#516378;
	line-height:11px;
	border:1px solid;
	text-decoration:none;
	color:White;
	width:120px;
	display:block;

	
	}
/*
*************************************************************************

Global Content Section

*************************************************************************
*/

#rollingbar{
	width:1000px;
	overflow:hidden;
}
/*
========================================================================
Left Content Section
========================================================================
*/

/* Structure
----------------------------------------*/
.leftcontent{
	width:185px;
	vertical-align:top;
}
/* Additional Menu 4 Items Structure
----------------------------------------*/
#addmenu4{
	width:165px;
	padding-left:20px;
	background-image:url('../images/global/content/leftcontent/addmenu4_bkg.jpg');
	background-repeat:repeat-y;
	position:relative;
	top:0;
	z-index:500;
	/*overflow:hidden;*/
}

#addmenu4 .top{
	width:185px;
	height:60px;
	margin-left:-20px;
	margin-bottom:15px;
	background-image:url('../images/global/content/leftcontent/main_corner1.jpg');
	position:relative;	
}
#addmenu4 .top .logo{
	position:absolute;
	top: 2px;
	left: 27px;
	width: 145px;
	overflow:hidden;
}

/* Additional Menu 4 Items Style
----------------------------------------*/
#addmenu4 .staticmenuitems
{
    color:White;
    margin-bottom:10px;
    background-color:Black;
    font-size:12px;
    font-weight:bold;
    padding:5px;
}

#addmenu4 .dynamicmenubkg
{
    background-color:#cc0000;
    padding:10px;
    padding-top:5px;
    padding-bottom:0px;
}

#addmenu4 .dynamicmenuitems
{
    color:White;
    margin-bottom:10px;
    font-size:12px;
}


/* Advertisment (Left)
----------------------------------------*/
#advertleft{
	width:179px;
	margin-left:6px;
	margin-top:5px;
	overflow:hidden;
}

#advertleft .item
{
    display:block;
    margin-bottom:10px;
}
/* Categories
----------------------------------------*/
#cate{
	width:169px;
	padding-left:10px;
	margin-left:6px;
	background-color:#231f20;
	margin-top:5px;
	color:white;
	overflow:hidden;
}
#cate .top{
	width:179px;
	margin-left:-10px;
	height:24px;
	overflow:hidden;
	background-image:url('../images/global/content/leftcontent/categoryheader.jpg');
	
}

/* Recommendation Area
----------------------------------------*/
#recommendationwrapper{
	width:480px;
	padding-top:4px;
	padding-left:4px;
	padding-right:4px;
	margin-left:10px;
	background-color:#BE1E2D;
}
#recommendationcontainer {
	width:479px;
	margin-top:3px;
	text-align:center;
	color:white;
}
#recommendationcontainer img{
	clear:both;
	display:block;
}

#recommendationcontainer .recom1{
	width:234px;
	vertical-align:top;
	background-color:#00adef;
	padding:3px;
	text-align:center;
}
#recommendationcontainer .recom1 .contentholder{
	width:225px;
	vertical-align:top;
	padding:3px;
	text-align:center;
}

#recommendationcontainer .recom1 .contentholder .textwrapper
{
	width:100%;
	text-align:left;
}
#recommendationcontainer .recom1 .top{
	width:240px;
	margin:-3px;
	margin-bottom:3px;
	height:25px;
	overflow:hidden;
	background-image: url('../images/global/content/central/recommendation/recom_header_1.jpg');
}

#recommendationcontainer .recom2{
	width:234px;
	vertical-align:top;
	background-color:#f69429;	
	padding:3px;
	text-align:left;
}
#recommendationcontainer .recom2 .top{
	width:240px;
	height:25px;
	margin:-3px;
	margin-bottom:3px;
	overflow:hidden;
	background-image: url('../images/global/content/central/recommendation/recom_header_2.jpg');
}

#recommendationcontainer .recom2 .contentholder{
	width:225px;
	vertical-align:top;
	padding:3px;
	text-align:center;
}

#recommendationcontainer .recom2 .contentholder .textwrapper
{
	width:100%;
	text-align:left;
}

#recommendationwrapper .item
{
    padding:5px;
    }

#recommendationbottom{
	width:490px;
	height:29px;

	margin-left:-4px;
	margin-right:-4px;

	background-color:White;
	background-image:url('../images/global/content/central/recommendation/recom_bottom.jpg');
	background-repeat:no-repeat;
}



/*
========================================================================
Central Content Section
========================================================================
*/
/* Structure
----------------------------------------*/
.contentcontainer{
	width:515px;
	vertical-align:top;
}

/* Extented Searching
----------------------------------------*/
#exsearch{
	width:100%;
	height:93px;
	background-image: url('../images/global/content/central/exserach_bkg.jpg');
	background-repeat:no-repeat;
	position: relative;
	top:0px;
	left:0px;
	z-index:0;
}
#exsearch #advert{
	width:467px;
	height:60px;
	overflow:hidden;
	position:absolute;
	top: 5px;
	left: 23px;
	z-index:0;
}
#exsearch .searchbox{
	width:129px;
	height:13px;
	font-size:11px;
	position:absolute;
	z-index:0;
}
#exsearch .exsearchbtn{
	width:34px;
	height:16px;
	background: url('../images/global/content/central/search_btn.jpg');
	display:block;
	position:absolute;
	top:73px;
	right:165px;
	border:0px;
	z-index:0;
}
/* Latest Articles
----------------------------------------*/
#latestart{
	width:500px;
	margin-left:10px;
	margin-top:-10px;
	margin-bottom:10px;
	position: relative;
	top:0px;
	left:0px;
	z-index:100;
}

#latestart .top{
	width:186px;
	height:21px;
}

#latestart .top .staticmenuitems{
	width:85px;
	height:21px;
	/*background-color:#b61a20;*/
	color:White;
	font-size:12px;
	text-align:center;
}
#latestart .top .selectedmenuitems{
	width:80px;
	height:21px;
	/*background-color:#ed1b24;*/
	color:White;
	font-size:12px;
}

#latestart .content{
	width:490px;
	height:205px;
	/*
	background-color:#ec1d25;
*/

}

/* Rolling Items 
----------------------------------------*/
#rollingitems{
	width:95%;
	margin-left:15px;
}
.rollitems{
	padding-left:5px;
	padding-right:5px;
}

/*
========================================================================
Right Content Section
========================================================================
*/
/* Structure
----------------------------------------*/
.rightcontent{
	width:300px;
	overflow:hidden;
	vertical-align:top;
}
/* Login Area 
----------------------------------------*/
#loginwrapper{
	width:300px;
	height:114px;
	overflow:hidden;
	margin-bottom:3px;
}
#loginwrapper #inputarea{
	width:212px;
	height:114px;
	overflow:hidden;
	background-image:url('../images/global/content/rightcontent/loginbkg.jpg');
	background-repeat:no-repeat;
	background-color:#c0262e;
	float:left;
	position:relative;
}
#forgetpasw{
	position:absolute;
	top: 74px;
	left: 157px;
}
#forgetpasw a{
	color:white;
}

#newcomers{
	width:112px;
	position:absolute;
	top: 7px;
	left: 82px;
	height: 15px;
}
#newcomers img{
	display:inline;
}

.inputbox1{
	width:88px;
	height:12px;
	font-size:11px;
	position:absolute;
	top: 5px;
	left: 108px;
}
.inputbox2{
	width:88px;
	height:12px;
	font-size:11px;
	position:absolute;
	top: 30px;
	left: 108px;
}
#additionalinfo{
	width:212px;
	height:25px;
	overflow:hidden;
	position:absolute;
	bottom:0px;
	padding-left:1px;
	left:0px;
	background-color:white;
}

#datainput{
	width:200px;
	position:absolute;
	top: 20px;
	left:3px;
}


#loginwrapper #loginbtn{
	width:83px;
	overflow:hidden;
	float:right;
}

/* Active Login Area 
----------------------------------------*/
#activeloginwrapper
{   width:300px;
    background-image:url('../images/global/content/rightcontent/activeloginbkg.gif');
    background-repeat:no-repeat;
	height:98px;
	margin-bottom:3px;
	position:relative;
}
#activeloginwrapper .bottom
{   width:300px;
    position:absolute;
    left:0;
    bottom:0;    
}
#activeloginwrapper .welcomemsg
{   width:280px;
    height:15px;
    color:white;
    font-size:12px;
    font-weight:bold;
    position:absolute;
    left:9px;
    top:14px;    
}
#activeloginwrapper .menuoption
{   width:280px;
    height:15px;
    color:white;
    font-size:12px;
    font-weight:bold;
    position:absolute;
    left:9px;
    top:31px;    
}
#activeloginwrapper .menuoption ul
{   
    margin:0px;
    padding:0px;  
}
#activeloginwrapper .menuoption li
{   
    float:left;
    padding-left:3px;
    padding-right:3px;  
    border-right: 1px white solid;
    color:White;
    font-weight:normal;
}
#activeloginwrapper .menuoption a
{   
    color:White;
    font-weight:normal;
    text-decoration:none;
}
#activeloginwrapper .menuoption a:hover
{   
    color:White;
    font-weight:normal;
    text-decoration:underline;
}
/* Recommendation 1 
----------------------------------------*/
.rightcontent #recom1{
	width:300px;
	overflow:hidden;
	height: 115px;
}

.rightcontent #recom1 .item
{
    display:block;
    padding:0px;
    margin:0px;
    border:0px;
    border-collapse:collapse;
}

.rightcontent #recom1 .bottom{
	width:300px;
	height:25px;
	overflow:hidden;
	background-image:url('../images/global/content/rightcontent/recommendation/recom1_bottom.jpg');
	background-repeat:no-repeat;
}

/* Recommendation 2 
----------------------------------------*/
.rightcontent #recom2{
	width:300px;
	overflow:hidden;
}
.rightcontent #recom2 .bottom{
	width:300px;
	height:36px;
	overflow:hidden;
	background-image: url('../images/global/content/rightcontent/recommendation/recom_news_bkg.gif');
	background-repeat:no-repeat;
}

/* News Section
----------------------------------------*/
#news{
	width:280px;
	padding-left:10px;
	padding-right:10px;
	padding-top:10px;
	overflow:hidden;
	background-color:#00aeef;
	margin-bottom:5px;
}
#news .date
{
	width:60px;
	color: White;
	font-size:12px;
	vertical-align:top;
	padding-bottom:10px;
}
#news .content{
	color: White;
	font-size:12px;
	padding-bottom:10px;
	vertical-align:top;
}

/* Linkage Section
----------------------------------------*/
#linkage{
	width:300px;
	overflow:hidden;
	background-color:#ed1c24;
	margin-bottom:5px;
}
#linkage .top{
	width:300px;
	height:25px;
	background-image:url('../images/global/content/rightcontent/linkage/linkage_header.gif');
	background-repeat:no-repeat;
}
#linkage .item
{
    margin:5px;
}

/*
*************************************************************************

Global Footer 

*************************************************************************
*/
#addmenu3{
	width:500px;
	background-image:url('../images/global/header/menubackground.jpg');
	background-repeat:repeat-x;
	height:28px;
	padding-top:6px;
	padding-bottom:3px;
	color:white;
	float:left;	
}
#addmenu3 .item
{
    color:White;
    font-size:14px;
    font-weight:bold;
    padding-right:10px;
    padding-left:10px;
}
#addmenu3 .item a
{
    color:White;
    text-decoration:none;
}
#addmenu3 .item a:hover
{
    color:White;
    text-decoration:underline;
}

#copyright{
	float:right;
	padding-top:10px;
}

/*
*************************************************************************

GM Date Picker

*************************************************************************
*/

.calDayStyle{
	background-color:#EFEFFF;
	Font-size:12px;	   
	color:#425563;
	
}

.calTodayStyle{
	font-weight:bold;
	color:black;	
}

.calDayHeaderStyle{
	background-color:#BDDFFF;
	Font-size:14px;
}

.calTitleStyle{
	background-color:#73758C;
	Font-size:14px;
}

.calWeekendStyle{
	color:#8C6A7C;
	Font-Size:12px;
	
}

.calSelectedDayStyle{
	border:solid 1px Black;
	font-weight:bold;
}

.calFooterStyle{	
	border: 1px #4D5763 solid;
}

.calOtherMonthDayStyle{	
	background-color:#DFDFFF;
	Font-Size:12px;
	color:#425563;
}
