@charset "utf-8";

/* CSS Document */
html {background:#FFF url(../img/back.jpg) no-repeat center top;}
body {

    font: 75% Tahoma, Verdana, Arial, Helvetica, sans-serif;
    margin: 0;
    padding:20px 0;
    color: #FFF;
    text-align:center;
}

img { border:none; }

.clear {
    clear:both;
}
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

.floatLeft {
    float:left;
}
.textLeft {
    text-align:left;
}
.floatRight {
    float:right;
}
.strong {
    font-weight:bold;
}
.textRight {
    text-align:right;
}

#container{
    width:999px;
    margin:0 auto;
    background: #FFF;
    text-align:center;
}


/*START: Main Area Styles*/
#bodyContainer{
    width:960px;
    margin:0 auto;
    text-align:left;
}

/* --- top --- */
.title{
_font-size:0.1;
}
#topFlash{
    width:900px;
    height:410px;
    float:left;
}

/* --- navi --- */
.headMenu{
    margin:0;
    padding:0;
}		
.headMenu ul{
    margin:0 0 15px;
    padding:0;
	height:70px;
    width:960px;
	list-style-type:none;	
}		
.headMenu ul li{
	list-style-type:none;
	float:left;
}
.headMenu ul li a{
	height:70px;
	background: url(../img/navi.gif) no-repeat 0 0;
	display: block;
}
.headMenu li a.b1 {width:155px;background-position:0 0;}
.headMenu li a.b1:hover , .headMenu li.active a.b1{background-position:0 -70px;}
.headMenu li a.b2 {width:140px;background-position:-155px 0;}
.headMenu li a.b2:hover , .headMenu li.active a.b2{background-position:-155px -70px;}
.headMenu li a.b3 {width:145px;background-position:-295px 0;}
.headMenu li a.b3:hover , .headMenu li.active a.b3{background-position:-295px -70px;}
.headMenu li a.b4 {width:190px;background-position:-440px 0;}
.headMenu li a.b4:hover , .headMenu li.active a.b4{background-position:-440px -70px;}
.headMenu li a.b5 {width:190px;background-position:-630px 0;}
.headMenu li a.b5:hover , .headMenu li.active a.b5{background-position:-630px -70px;}
.headMenu li a.b7 {width:140px;background-position:-820px 0;}
.headMenu li a.b7:hover , .headMenu li.active a.b7{background-position:-820px -70px;}

.headMenu ul li div{
	height:70px;
	background: #FFF url(../img/navi.gif) no-repeat 0 0;
	display: block;
}
.headMenu ul li div.bn7 {width:120px;background-position: -840px 0;}

span.text_out {
	position:absolute;
	top:-5000px;
	left:-999px;
}
/*IEonly*/
* html span.text_out{
	position:static;
	visibility: hidden;
}

/* --- howto --- */
.howtoB1{
	width:960px;
	height:42px;
	background: url(../../howto/img/p3.jpg) no-repeat 0 0;
}
.howtoB2{
	width:960px;
	height:61px;
	background: url(../../howto/img/p4.jpg) no-repeat 0 0;
}

/* --- outline --- */
.outlineArea{
    text-align:center;
	background:#E7CFAD url(../../img/outline/bg.jpg) no-repeat 0 0;
}
.outline{
    width:670px;
    margin:0 auto;
    padding:0 0 60px;
    text-align:left;
    color: #000000;
    line-height:1.4;
}
.outline p{
    margin:3px 0 0;
}
.outline table{
    margin:3px 0 0;
}
.outline p.title{
    margin:17px 0 0;
    color: #660000;
    font-weight:bold;
}
.outline table.info{
    margin:20px 0 0 20px;
}

.outline a, .outline a:link, .outline a:visited, .outline a:active {
    color:#CD3100;
    font-weight:bold;
    text-decoration:none; 
}
.outline a:hover{
    text-decoration:underline;
}
.small{
    font-size:0.88em;
}


/*END: Main Area Styles*/









/*START: Header Nav Styles*/
#headerContainer {
    width: 999px; 
    margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    padding: 0;
    text-align: left; /* this overrides the text-align: center on the body element. */
}
#header {
    width:999px;
    overflow:hidden;
    margin:0;
    background: #262626;
}

ul#headerNav {
    margin:0;
    padding:8px 20px;
    float:left;
}
ul#headerNav li {
    float:left;
    margin:0;
    padding:0 10px;
    font-size:11px;
    list-style:none;
    background: url(../img/verticalGreyDivider.gif) no-repeat center left;
}
ul#headerNav li a {
    color:#e1e1e1;
    text-decoration:none;
}
ul#headerNav li a:link {
    color:#e1e1e1;
    text-decoration:none;
}
ul#headerNav li a:hover {
    color:#e1e1e1;
    text-decoration:underline;
}
ul#headerNav li a:visited:hover {
    color:#e1e1e1;
    text-decoration:underline;
}
ul#headerNav li a:visited {
    color:#e1e1e1;
    text-decoration:none;
}
ul#headerNav li a:active {
    color:#e1e1e1;
    text-decoration:none;
}
ul#headerNav li.none{
    background:none;
    padding:0 10px 0 0;
}

#topNavArea {
    padding:14px 20px;
    margin:0;
    width:959px;
    overflow:hidden;    
    background:#ffffff;
}
#topNavHolder {
    float:left;
    margin:0;
    width:630px;
    overflow:hidden;
    padding:15px 0 0 30px;
}
#logoArea {
    float:left;
    width:138px;
    height:60px;
    cursor:pointer;
}
h1.logo {
    margin:0;
    padding:0;
    width:138px;
    height:60px;
    background: url(../img/logo.gif) no-repeat;
}
h1.logo span {
    display:none;
}
/*END: Header Nav Styles*/

/*START: Top Nav Styles*/
ul#topNav {
    margin:0;
    padding:0 0 0 5px;
    float:left;
    width:100%;
}
ul#topNav li {
    float:left;
    margin:0;
    padding:2px 10px;
    font-size:11px;
    list-style:none;
    background: url(../img/verticalBlackDivider.gif) no-repeat center left;
}
ul#topNav li.none{
    background:none;
    padding:2px 10px 2px 0;
}
ul#topNav li a {
    color:#000000;
    text-decoration:none;
}
ul#topNav li a:link {
    text-decoration:none;
}
ul#topNav li a:hover {
    text-decoration:underline;
}
ul#topNav li a:visited:hover {
    text-decoration:underline;
}
ul#topNav li a:visited {
    text-decoration:none;
}
ul#topNav li a:active {
    text-decoration:none;
}
ul#topNav li.selected {
    font-weight:bold;
    color:#01467c;
}
/*END: Top Nav Styles*/



/*START: Breadcrumb Styles*/
ul#breadcrumbs {
    margin:0;
    padding:0;
    float:left;
    width:100%;
}
ul#breadcrumbs li {
    float:left;
    margin:0;
    padding:8px 15px 8px 5px;
    font-size:11px;
    list-style:none;
    color:#cccccc;
    background: url(../img/greyRightArrow.gif) no-repeat right center;
}
ul#breadcrumbs li.none {
    padding:8px 15px 8px 5px;
    background:none;
}
ul#breadcrumbs li a {
    color:#cccccc;
    text-decoration:underline;
}
ul#breadcrumbs li a:link {
    text-decoration:underline;
}
ul#breadcrumbs li a:hover {
    text-decoration:none;
}
ul#breadcrumbs li a:visited:hover {
    text-decoration:none;
}
ul#breadcrumbs li a:visited {
    text-decoration:underline;
}
ul#breadcrumbs li a:active {
    text-decoration:underline;
}
/*END: Breadcrumb Styles*/


/*START: Footer List Styles TA*/
/*bana*/
.bana{
    margin-top:18px;
}
.bana ul{
    list-style:none;
    margin:0 0 0 270px;
    padding:0;
}
.bana ul li{
    float:left;
    margin:0;
    padding:4px 14px;
    background: url(../img/bar02.gif) no-repeat right center;
}
.bana ul li.none{
    float:left;
    margin:0;
    padding:4px 14px;
    background:none;
}

#footerta {
    margin:10px auto 0;
    padding: 30px 0px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
    background:#FFFFFF url(../img/footerBg.gif) no-repeat center top;
    text-align:center;
    width:960px;
    overflow:hidden;
	font-size:11px;
_font-size:10px;
    color:#cccccc;
}
#footerta p {
    margin: 0; 
    padding: 5px 0px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */    
    color:#cccccc;
	font-size:11px;
_font-size:10px;
    text-align:center;
}
#footerta ul{
    margin: 0 0 0 225px;
    padding:0;	
}
#footerta ul li{
    list-style:none;
    float:left;
    margin:0;
    padding:0 10px;
	font-size:11px;
_font-size:10px;
    background: url(../img/blackBar.gif) no-repeat left center;
}    
#footerta ul li a
{
    color:#000000;
    text-decoration:none;
}
#footerta ul li a:link
{
    color:#000000;
    text-decoration:none;
}
#footerta ul li a:hover
{
    color:#000000;
    text-decoration:underline;
}
#footerta ul li a:visited:hover
{
    color:#000000;
    text-decoration:underline;
}
#footerta ul li a:visited
{
    color:#000000;
    text-decoration:none;
}
#footerta ul li a:active
{
    color:#000000;
    text-decoration:none;
}
#footerta ul li.none{
    padding:0 10px 0 0;
    background:none;
}  
.footerta {
	color:#cccccc;
	font-size:11px;
_font-size:10px;
	font: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	margin:15px;
}
/*END: Footer List Styles*/