/***************/
/*  1. GLOBAL  */
/***************/
*{padding:0; margin:0;}
body {
	font-size:90%;
	background-color:rgb(210,210,210);
	font-family:verdana,arial,sans-serif;
} /*Font-size: 1.0em = 10px when browser default size is 16px*/
.page-container {
	width:960px; 
	margin:0px auto; 
	margin-top:10px; 
	margin-bottom:10px; 
	border:solid 1px rgb(150,150,150); 
	font-size:0.8em;
}
.main {clear:both; width:960px; padding-bottom:10px; background:transparent url(../images/bg_main.jpg) repeat-y;}
.footer {clear:both; width:960px; height:50px; padding:0 0 0; background:rgb(225,225,225) url(../images/foot.jpg) no-repeat; font-size:1.0em; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} 
.main-content {display:inline; /*Fix IE floating margin bug*/; float:left; width:900px; margin:0 0 0 25px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}

.footer p {line-height:1.3em; text-align:center; color:rgb(125,125,125); font-weight:bold; font-size:110%;}
.footer p.credits {font-weight:normal;}
.footer a {text-decoration:underline; color:rgb(125,125,125);}
.footer a:hover {text-decoration:none; color:rgb(0,0,0);}
.footer a:visited {color:rgb(0,0,0);}



/* HEADER */
.header {width:960px; font-family:"trebuchet ms",arial,sans-serif;}
.header-top {
	width:960px;
	height:80px;
	background:rgb(50,50,50) url(../images/bg4.jpg);
	overflow:visible !important /*Firefox*/;
	overflow:hidden /*IE6*/;
}
.header-bottom {width:960px; height:25px; background:rgb(50,50,50) url(../images/bg4.jpg);} /*nav2 goes here*/

/*sitelog and sitename*/
.sitelogo {width:60px; height:60px; position:absolute; z-index:1; margin:10px 0 0 50px; background:url(../images/logo.png) no-repeat;}
.sitename {width:400px; height:45px; position:absolute; z-index:1; margin:20px 0 0 110px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}
.sitename h1 {font-size:170%;}
.sitename h2 {margin:-1px 0 0 0; color:rgb(235,235,235); font-size:80%;}
.sitename a {text-decoration:none; color:rgb(235,235,235);}
/*.sitename a:hover {text-decoration:none; color:rgb(50,50,50);}*/

.affiliate {width:350px; position:absolute; z-index:3; margin:15px 0 0 550px;}
.affiliate ul {float:right; padding:0 15px 0 0; font-weight:bold;}	
.affiliate li {color:rgb(200,200,200); list-style:none;}
.affiliate li a {display:block; float:left; padding:2px 5px 2px 5px; color:rgb(225,225,225); text-decoration:none; font-size:120%;}
.affiliate a:hover {text-decoration:none; color:rgb(150,150,150);}

.nav2 {
	float:left;
	width:680px;
	height:25px;
	border:none;
	color:#CCCCCC;
	font-size:1.0em;
	font-size:120%;
	background:transparent;
	overflow:visible !important /*Firefox*/;
	overflow:hidden /*IE6*/;
} /*Color navigation bar normal mode*/
.nav2 ul {list-style-type:none;}
.nav2 ul li {float:left; position:relative; z-index:1000; border-right:solid 1px rgb(175,175,175);}
.nav2 ul li ul {display:none; border:none;}
.nav2 ul li ul {margin-left:-30px; padding:0 30px 30px 30px;} /*Sticky hover zones*/
.nav2 ul li a {
	float:left;
	display:block;
	height:25px;  /*block height*/
	line-height:1.5em; /*navigation bar char position*/
	margin-right:0px !important /*Non-IE6*/;
	margin-right:-4px /*IE6*/;
	padding:0 16px 0 16px;
	text-decoration:none;
	font-weight:bold;
	color: #CCCCCC;
}
.nav2 ul li:hover {width:auto;}
.nav2 table {position:absolute; z-index:999; top:0; left:0; border-collapse:collapse; font-family:"trebuchet ms",arial,sans-serif;}

/*Non-IE6*/
.nav2 ul li:hover a {background-color:rgb(150,150,150);text-decoration:none;} /*Color main cells hovering mode*/
.nav2 ul li:hover ul {display:block; position:absolute; z-index:998; top:1.4em; margin-top:0.1em; left:0;}
.nav2 ul li:hover ul li ul {display: none;}
.nav2 ul li:hover ul li a {display:block; width:12em; height:auto; line-height:15px; margin-left:-1px; padding:4px 16px 4px 16px; border-left:solid 1px rgb(175,175,175); border-bottom: solid 1px rgb(175,175,175); background-color:rgb(137,137,137); font-weight:normal; color:rgb(50,50,50);} /*Color subcells normal mode*/
.nav2 ul li:hover ul li a:hover {
	background-color:#e9e9e9;
	text-decoration:none;
} /*Color subcells hovering mode*/

/*IE6*/
.nav2 ul li a:hover {
	background-color:#e9e9e9;
	text-decoration:none;
} /*Color main cells hovering mode*/
.nav2 ul li a:hover ul {display:block; position:absolute;z-index: 998; top:3.0em; left:0; margin-top:0.1em;}
.nav2 ul li a:hover ul li a {
	display:block;
	width:10em;
	height:0.8px;
	line-height:0.8em;
	padding:4px 16px 4px 16px;
	border-left:solid 1px rgb(175,175,175);
	border-bottom: solid 1px rgb(175,175,175);
	background-color:rgb(137,137,137);
	font-weight:normal;
	color:rgb(50,50,50);
} /*Color subcells normal mode*/
.nav2 ul li a:hover ul li a ul {visibility:hidden; height:0px; width:0px; position:absolute; z-index: 997;}
.nav2 ul li a:hover ul li a:hover {background-color:rgb(210,210,210); text-decoration:none;} /*Color subcells hovering mode*/

/** Start from here is the content display control*/
.column1-unit {width:910px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-left {float:left; width:400px;  margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column2-unit-right {float:right; width:400px;  margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column3-unit-left {float:left; width:280px; margin-bottom:10px
!important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
.column3-unit-middle {float:left; width:280px;  margin-bottom:10px
!important /*Non-IE6*/; margin-bottom:5px /*IE6*/; margin-left:40px;}
.column3-unit-right {float:right; width:280px;  margin-bottom:10px
!important /*Non-IE6*/; margin-bottom:5px /*IE6*/;}
pre {
	margin: 10px auto 10px auto;
	width: 850px;
	background: #3B3B3B url(../images/code.gif) no-repeat right bottom;
	font-size: 130%;
	color: #ffffff;
}/* for code */
pre.con {
	 margin: 10px auto 10px auto;
	 width: 850px;
	 background: #3B3B3B url(../images/shell.gif) no-repeat left top;
	 font-size: 130%;
	 color: #ffffff;
}/* for console */ 

pre em.comm {
font-size: 135%;
color: #ff0000;
}
/*********************/
/* CLEAR FLOATS  */
/*********************/
.page-container:after, .header:after, .main:after, .main-content:after{content:"."; display:block; height:0; clear:both; visibility:hidden;}
.column1-unit:after, .column2-unit-left:after, .column2-unit-right:after, .column3-unit-left:after, .column3-unit-middle:after, .column3-unit-right:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.footer:after, p:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clear-contentunit {clear:both; width:910px; height:0.1em; border:none; background:rgb(170,170,170); color:rgb(170,170,170);}

/***********************************/
/*   PRINTING and MISCELLANEOUS  */
/***********************************/
@media print {.header-top {width:950px; height:80px; background:rgb(240,240,240); overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;}}
@media print {.nav2 {float:left; width:950px; border:none; background:rgb(240,240,240); color:rgb(75,75,75); font-size:1.0em; font-size:130%;}} /*Color navigation bar normal mode*/
html {filter: expression(document.execCommand("BackgroundImageCache", false, true));} /*IE flicker hack for background images*/

/***********************/
/* 8. Main body display*/
/***********************/
.main-content h1.block {
	clear:both; 
	margin:0.5em 0 0em 0; 
	padding:2px 0 2px 2px; 
	background:rgb(190,190,190); 
	font-family:"trebuchet ms",arial,sans-serif; 
	color:rgb(65,65,65); 
	font-weight:bold; font-size:220%;
}
.main-content h1 {
	clear:both; 
	margin:1.0em 0 0 0; 
	font-family:"trebuchet ms",arial,sans-serif; 
	color:rgb(65,65,65); 
	font-weight:normal; 
	font-size:200%;
}
.main-content h2 {
	clear:both; 
	margin:0em 0 0em 0; 
	padding:2px 0 2px 2px; 
	font-family:"trebuchet ms",arial,sans-serif;
	color:rgb(65,65,65); 
	font-weight:bold; font-size:140%;
}

.main-content h2.block {
	clear:both; 
	margin:0em 0 0em 0; 
	padding:2px 0 2px 2px; 
	background:rgb(190,190,190); 
	font-family:"trebuchet ms",arial,sans-serif;
	color:rgb(65,65,65); 
	font-weight:bold; font-size:140%;
}
.main-content h3.block {
	clear:both; 
	margin:0em 0 0em 0; 
	padding:2px 0 2px 2px; 
	background:rgb(190,190,190); 
	font-family:"trebuchet ms",arial,sans-serif;
	color:rgb(65,65,65); 
	font-weight:bold; font-size:100%;
}
.main-content h3 {
	clear:both;
	margin:-0.5em 0 0.1em 0;
	font-family:"trebuchet ms",arial,sans-serif;
	color:rgb(80,80,80);
	font-weight:normal;
	font-size:100%;
}
.main-content h1.side {clear:none;}
.main-content h2.side {clear:none;}
.main-content h3.side {clear:none;}

.main-content h4 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"trebuchet ms",arial,sans-serif; font-weight:normal; font-size:170%;}
.main-content h5 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"trebuchet ms",arial,sans-serif; font-size:140%;}
.main-content h6 {margin:0.1em 0 0 0; color:rgb(80,80,80); font-family:"trebuchet ms",verdana,arial,sans-serif; font-weight:normal; font-size:140%;}
.main-content p {margin:0 0 0.5em 0.5em; line-height:1.5em; font-size:120%;}
.main-content p.center {text-align:center;}
.main-content p.right {text-align:right;}
.main-content p.details {clear:both; margin:-0.25em 0 1.0em 0; line-height:1.0em; font-size:110%;}
.main-content blockquote {clear:both; margin:0 30px 0.6em 30px; font-size:90%;}

.main-content table {clear:both; width:900px; margin:1.0em 0 0.2em 5px; table-layout: fixed; border-collapse:collapse; empty-cells:show;}
.main-content table th.top {height:3.5em; padding:0 7px 0 7px; empty-cells:show; text-align:left; color:rgb(255,255,255); font-weight:bold; font-size:110%;}
.main-content table th {height:2.0em; padding:2px 20px 2px 7px; text-align:left; color:rgb(80,80,80); font-weight:bold; font-size:110%;}
.main-content table td {height:2.0em; padding:2px 7px 2px 7px;  border:solid 2px; text-align:left; font-weight:normal; border-color:rgb(150,150,150); font-size:110%;}

.main-content table.full {clear:both; width:900px; margin:1.0em 0 0.2em 5px; table-layout: fixed; border-collapse:collapse; empty-cells:show; background-color:rgb(233,232,244);}
.main-content table.full th.top {height:3.5em; padding:0 7px 0 7px; empty-cells:show; background-color:rgb(175,175,175); text-align:left; color:rgb(255,255,255); font-weight:bold; font-size:110%;}
.main-content table.full th {height:2.0em; padding:2px 20px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; color:rgb(80,80,80); font-weight:bold; font-size:110%;}
.main-content table.full td {height:2.0em; padding:2px 7px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; font-weight:normal; color:rgb(80,80,80); font-size:110%;}
p.caption {clear:both; margin:0.5em 0 2.0em 20px; text-align:left; color:rgb(80,80,80); font-size:110%;}


.main-content ul {list-style:none; margin:0.5em 0 1.0em 0;}
.main-content ul li {margin:0 0 0.2em 2px; padding:0 0 0 12px; background:url(../img/bg_bullet_full_1.gif) no-repeat 0 0.5em; line-height:1.4em; font-size:120%;}
.main-content ol {margin:0.5em 0 1.0em 20px !important /*Non-IE6*/; margin:0.5em 0 1.0em 25px /*IE6*/;}
.main-content ol li {list-style-position:outside; margin:0 0 0.2em 0; line-height:1.4em; font-size:120%;}

.main-content a {color:rgb(70,122,167); font-weight:bold; text-decoration:none;}
.main-content h1 a {color:rgb(70,122,167); font-weight:normal; text-decoration:none;}
.main-content a:hover {color:rgb(42,90,138); text-decoration:underline;}
.main-content a:visited {color:rgb(42,90,138);}

.main-content a img {border:solid 1px rgb(150,150,150);}
.main-content a:hover img {border:solid 1px rgb(220,220,220);}

.main-content img {clear:both; float:left; margin:3px 10px 7px 0; padding:1px; border:1px solid rgb(150,150,150);}
.main-content img.center {clear:both; float:none; margin:0; padding:1px; border:1px solid rgb(150,150,150);}
.main-content img.right {clear:both; float:right; margin:3px 0 7px 10px; padding:1px; border:1px solid rgb(150,150,150);}
