/* Reset ------------------------------------------------------------------ */

/*
    reset.css - resets default browser styling
    http://tantek.com/log/2004/09.html#d06t2354
    http://www.vox.com/.shared/css/base.css by beausmith.com
    http://developer.yahoo.com/yui/reset/
*/

:link,:visited {
    text-decoration:none;
}
html,body,div,
ul,ol,li,dl,dt,dd,
form,fieldset,input,textarea,
h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,
th,td {
    margin:0;
    padding:0;
}
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
}
table {
    border-spacing:0;
}
fieldset,img,abbr,acronym {
    border:0;
} 
/* strict reset by uncommenting lines below */
address,caption,cite,code,dfn,em,strong,b,u,s,i,th,var {
    /* font-style:normal; */
    /* font-weight:normal; */
}

ol,ul {
    list-style:none;
}
caption,th {
    text-align:left;
}
q:before,q:after {
    content:'';
}
a {
    text-decoration:underline;
    outline:none;
}
hr {
    border:0;
    height:1px;
    background-color:#000;
    color:#000;
}
a img,:link img,:visited img {
    border:none;
}
address {
    font-style:normal;
}

/* --- Layout ------------------------------------------------------------------------ */

body{
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-family: Verdana,Arial,sans-serif;
	background-color: #ddd;
}

#container{
	position: relative;
	width: 802px;
	height: 590px;
	margin: 2px auto 0;
	background-color: #44478b;
	border: 3px solid #000346;
}



#side_bar{
	position: absolute;
	left: 0;
	width: 256px;
	height: 517px;

}


#side_bar h1{
	position: absolute;
	top: 12px;
	left: 37px;
	width: 164px;
	height: 101px;
}

#side_bar h2{
	position: absolute;
	top: 130px;
	left: 22px;
	width: 208px;
	height: 65px;
	background-image: url("images/friends_logo(Friends).gif");
	background-repeat: no-repeat;
	text-indent: -9999px;

}
#side_bar p{
	position: absolute;
	top: 225px;
	left: 30px;
	width: 200px;
	font-weight: small;
	text-align: left;

}

#action_side_bar{
	position: absolute;
	top: 380px;
	left: 0;
	width: 230px;
	height: 180px;
}

#content{
	position: absolute;
	right: 12px;
	width: 534px;
	height: 590px;
}

#content-header{
	position: relative;
	width: 534px;
	height: 81px;
}

ul{
	position: absolute;
	left: 0;
	width: 534px;
	height: 81px;
	background: url("images/friends_content_header_bg.gif") no-repeat;
}

#home_btn a{
	display: block;
	position: absolute;
	top: 10px;
	left: 6px;
	width: 73px;
	height: 38px;
	background: url("images/friends_btn(Home).gif") no-repeat bottom;
	text-indent: -9999px;
}
#home_btn a:hover{
	background-position: top;
}
	
#profile_btn a{
	display: block;
	position: absolute;
	top: 10px;
	left: 95px;
	width: 83px;
	height: 38px;
	background: url("images/friends_btn(Profile).gif") no-repeat bottom;
	text-indent: -9999px;
}
#profile_btn a:hover{
	background-position: top;
}

#weblog_btn a{
	display: block;
	position: absolute;
	top: 10px;
	left: 187px;
	width: 95px;
	height: 38px;
	background: url("images/friends_btn(Weblog).gif") no-repeat bottom;
	text-indent: -9999px;
}
#weblog_btn a:hover{
	background-position: top;
}

#movies_btn a{
	display: block;
	position: absolute;
	top: 10px;
	left: 294px;
	width: 85px;
	height: 38px;
	background: url("images/friends_btn(movies).gif") no-repeat bottom;
	text-indent: -9999px;
}
#movies_btn a:hover{
	background-position: top;
}

#action_header{
	position: absolute;
	top: 0;
	right: 0;
	width: 132px;
	height: 81px;
}

#content_body{
	position: absolute;
	top: 81px;
	left: 0;
	width: 534px;
}
#friends_list{
	height: 480px;
	background: #ddb1ed;
}
#friends_list li{
	width: 534px;
	height: 150px;
}

#chihiro a{

}

#chihiro a:hover{

}

#chihiro{

}



#content_footer{
	position: absolute;
	top: 550px;
	left: 0;
	width: 534px;
	height: 38px;
	background: url("images/friends_content_footer_bg.gif") no-repeat;
}

address{
	position: absolute;
	bottom: 0px;
	right: 10px;
	font-size: xx-small;
	font-weight: normal;
	line-height: 1.5em;
}