/* ------------------------------------basic structure------------------------------------ */

* {
	padding: 0;
	margin: 0;
}

body, html {
    background: #f7f8ea url(/images/body_bg.jpg) top repeat-x;
	color: #a4a4a4;
    font: 11px/18px "trebuchet ms", verdana, arial, sans-serif;
	text-align: left;
}

body {
    min-width: 650px;
    }

img {
	border: 0;
	}

a, a strong {
        border: 0;
	text-decoration: none;
	color: #b59c6f;
	}

div#content a:hover {
	border-bottom: 1px dotted #bddbf8;
	color: #54b7fa;
}

a img {
	border: 0;
        text-decoration: none;
	}

p {
        text-align: left;
        margin: 18px 0;
}

p.date {
        text-align: center;
}

b, strong {
	color: #90aab9;
}

#text i, #text em {
	color: #707f6d;
}

input, select, textarea {
	background: #FAEDE4;
	border-color: #D9C3B8;
	border-style: dotted;
	border-width: 1px;
	font-family: "trebuchet ms", verdana, arial, sans-serif;
	font-size: 11px;
	color: #958382;
	}

blockquote {
	margin: 0 15px;
}

blockquote p.author {
	background-image: none;
	padding: 0px 50px 0px 60px;
	text-align: right;
}

blockquote {
	background: #FAEDE4;
	border: 1px dotted #D9C3B8;
	margin: 0 25px;
    padding: 10px;
}

blockquote p {
	background-image: none;
	margin: 2px 0;
	padding: 0;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* ---------------------------------start layout------------------------------------------- */


div#container {
	background: url(/images/layout_bg.jpg) 50% -350px no-repeat;
	margin: 0 auto;
	padding: 0;
	width: 650px;
}

div#header {
	padding: 6px 0 0 0;
	width: 700px;
}

div#content {
	float: right;
	margin: 0 200px 0 0;
	width: 405px;
}


h1 {
	display: block;
	height: 85px;
	padding: 86px 0px 66px 250px;
	overflow: hidden;
	text-indent: -2000px;
	width: 155px;
}

h1 a {
	border: 0;
	display: block;
	height: 85px;
	outline-style: none;
	padding: 0;
	width: 155px;
}

div#content h1 a:hover {
	background: url(/images/layout_bg.jpg) -295px -86px no-repeat;
	border: 0;
}

div#main {
	background: #fff;
	margin: 0 0 0 5px;
	padding: 2px 10px 5px 2px;
}

div#main p {
	margin: 18px 10px;
	text-indent: 20px;
}

div#main p.update {
	text-indent: 0;
	text-align: center;
}

div#main p.update span {
	background: #e4e7fb;
	padding: 2px 5px;
}

div#main div#footer p, 
div#main p.show_lostpass_credits,
div#main p.show_join_credits,
div#main p.show_update_credits,
div#main form.show_update_form p, 
div#main form.show_lostpass_form p, 
div#main form.show_join_form p {
	text-indent: 0;
}

div#content blockquote p {
	background-image: none;
	margin: 2px 0;
	padding: 0;
}


ul#nav {
	display: block;
	float: left;
	height: 300px;
	list-style: none;
	padding: 0;
	margin: 34px 0 0 20px;
	width: 25px;
}

ul#nav li {
	display: block;
	margin: 0;
	overflow: hidden;
	text-indent: -2000px;
	width: 25px;
}

ul#nav li a {
	border: 0;
	display: block;
	outline-style: none;
	padding: 0;
	width: 25px;
}

ul#nav li#site2 a {
	height: 35px;
	margin: 21px 0 0 0;
}

ul#nav li#fanlist2 a {
	height: 63px;
	margin: 53px 0 0 0;
}

ul#nav li#ninja2 a {
	height: 59px;
	margin: 52px 0 17px 0;
}

ul#nav li#site2 a:hover {
	background: url(/images/layout_bg.jpg) -20px -55px no-repeat;
}

ul#nav li#fanlist2 a:hover {
	background: url(/images/layout_bg.jpg) -20px -143px no-repeat;
}

ul#nav li#ninja2 a:hover {
	background: url(/images/layout_bg.jpg) -20px -258px no-repeat;
}

p.intro {
	font: italic 18px/24px "century gothic";
	margin: 70px 20px 70px 350px;
	height: 125px;
}

div#sidebar {
	float: right;
	margin: 0 5px 0 0;
	padding: 10px 0;
	width: 220px;
}

h2 {
	color: #b37593;
	font: italic 28px/36px times, serif;
	letter-spacing: -1px;
	margin: 0 30px 0 10px;
	text-align: right;
	text-indent: 15px;
	text-transform: lowercase;
}

h2:first-letter {
	color: #cfaba1;
}

h3 {
    text-align: left;
	color:#89bbda;
	font: bold 1.2em Arial,Helvetica,sans-serif;
	letter-spacing:0.1em;
	text-indent: 15px;
	text-transform:uppercase;
}

p.crimson_date {
        color: #89cada;
        margin: -5px 0 0 0;
		padding: 0 10px 0 0;
        text-indent: 25px;
        text-align: right;
        text-transform: uppercase;
	font: bold 10px/14px "century gothic", arial, sans-serif;
        letter-spacing: 1px;
}

p.crimson_comment {
        text-align: right;
        font-size: 11px;
}

/* fl nav others */

div#content ul.subnavi {
	margin: 18px 13px;
}

div#content ul.subnavi li {
	border-top: 1px dotted #f2d2e1;
	float: left;
	list-style: none;
	margin: 10px 0;
	padding: 5px 0;
	text-align: center;
}

div#content ul.subnavi li a {
	border: none;
	color: #a4a4a4;
	display: block;
	outline-style: none;
	padding: 5px 10px;
	width: auto;
}

div#content ul.subnavi li a:hover {
	background: #e6e6f8;
}

div#content ul.subnavi li a span {
	color: #62aaff;
	display: block;
	font: 14px/16px "century gothic";
	letter-spacing: 1px;
	text-transform: uppercase;
}

div#content ul.subnavi li a:hover span {
	color: #9891d7;
}



div#main div#footer {
	padding: 10px 5px;
}

div#main div#footer p {
	color: #b6b2b7;
	text-indent: 0px;
	margin: 10px 0;
	padding: 5px 10px;
}

div#footer a {
	color: #8e8fa0;
	}

/* others */

div.credit p, p.number, p.noindent, div#codes p, p.center {
	text-align: center;
}

div#codes p img {
	background: #cff2fa;
	padding: 4px;
}

#fansort {
    width: 250px;
    text-align: center;
    padding: 10px 0;
    margin: 0 auto;
    border: 0;   
}

div#show_member_table table td, #fansort table td {
	line-height: 18px;
	text-align: center;
}

#fansort table td.browse_left {
	text-align: right;   
	padding-right: 10px;
	width: 55%;
}

#fansort table td.browse_right {
	width: 45%;
	text-align: left;   
	padding-left: 10px;
}

div#profile table {
	width: 325px;
	margin: 10px 0;
}

/* special Styles */



.tool-tip {
	border: 1px dotted #919697;
	color: #fff;
	width: 120px;
	z-index: 13000;
}
 
.tool-title {
	font-weight: bold;
	font-size: 11px;
	margin: 0;
	color: #fff;
	padding: 8px 8px 4px;
	background: #635f60;
	text-align: center;
}
 
.tool-text {
	font-size: 11px;
	padding: 4px 8px 8px;
	background: #635f60;
	text-align: center;
}
 
.custom-tip {
	color: #fff;
	width: 90px;
	z-index: 13000;
}
 
.custom-title {
	font-weight: bold;
	font-size: 11px;
	margin: 0;
	color: #635f60;
	padding: 8px 8px 4px;
	background: #635f60;
	border-bottom: 1px solid #919697;
	text-align: center;
}
 
.custom-text {
	font-size: 11px;
	padding: 4px 8px 8px;
	background: #635f60;
	text-align: center;
}