<!--
.navtext {
width:100px;
font-size:8pt;
border-width:1px;
border-style:solid;
border-color:darkgray;
layer-background-color:tan;
background-color:lightblue;
color:black;
}
-->

/*--------------------------------------------------------------
						Main tags
---------------------------------------------------------------*/

body {
 background:#8b8b8b url(../img/bodybg.gif) top left repeat-y;
 color:#303030;
 font:76% Verdana,Tahoma,Arial,sans-serif;
 margin:0;
 padding:0;
 text-align:center;
}

ul {
 margin:5px 0 16px 5px;
 padding:0;
}

li {
 margin:0 0 8px 15px;
 padding:0;
}

img {
 margin:10px auto 16px auto;
 padding:1px;
 background:#ffffff;
}

a {
 color:#505050;
 font-weight:bold;
 text-decoration:none;
}

a:hover {
 color:#808080;
 text-decoration:underline;
}

a img {
 border-color:#d85d5d;
}

a img:hover {
 background:#d85d5d;
 border-color:#d85d5d;
}

p {
 line-height:1.5em;
 margin:0 0 15px;
}

/*--------------------------------------------------------------
						Main container
---------------------------------------------------------------*/

#container {
 background:#f0f0f0 url(../img/bodybg.jpg) repeat-x;
 color:#303030;
 margin:0;
 min-width:770px;
 padding:0;
 text-align:left;
 width:100%;
}

/*--------------------------------------------------------------
						Header section
---------------------------------------------------------------*/

#sitename {
 color:#ffffff;
 height:92px;
 margin:0 20px 10px;
 text-align:left;
}

#sitename h1,#sitename h2 {
 font-weight:400;
 letter-spacing:-2px;
 margin:0;
 padding:0;
}

#sitename h1 {
 font-size:2.4em;
 padding-top:20px;
}

#sitename h2 {
 font-size:1.6em;
}

/*--------------------------------------------------------------
						Horizontal menu
---------------------------------------------------------------*/

#mainmenu {
 float:left;
 margin-bottom:25px;
}

#mainmenu ul {
 font-size:16px;
 margin:0;
 padding:0;
}

#mainmenu li {
 float:left;
 height:35px;
 list-style:none;
 margin:0;
 padding:0;
}

#mainmenu a {
 border-right:1px solid #b0b0b0;
 color:#606060;
 display:block;
 font-size:0.7em;
 padding:11px 10px 10px;
 text-transform:uppercase;
}

#mainmenu a:hover {
 background:#f0f0f0 url(../img/menuhover.jpg) top left repeat-x;
 color:#505050;
 text-decoration:none;
}

#mainmenu a.current {
 background:#f0f0f0 url(../img/menuhover.jpg) top left repeat-x;
 color:#505050;
 text-decoration:none;
}

/*--------------------------------------------------------------
						Content wrap
---------------------------------------------------------------*/

#wrap {
 clear:both;
 font-size:0.9em;
 padding:0;
 width: 1220px;
}

/*--------------------------------------------------------------
						Left sidebar
---------------------------------------------------------------*/

#leftside {
 width:220px;
 background:#e0e0e0 url(../img/sidebarbg.gif) top right repeat-y;
 text-align:right;
 float:left;
}

#leftside h1 {
 margin:20px 18px 0 5px;
 color:#d85d5d;
 font-size:1.6em;
 letter-spacing:-2px;
 text-align:right;
}

#leftside h2, #leftside h3 {
 margin:0 20px 18px 5px;
 color:#808080;
 font-size:1.1em;
 font-weight:bold;
 letter-spacing:-1px;
 text-align:right;
}

#leftside h3 {
 margin:20px 18px 4px 5px;
 color:#606060;
}

#leftside p {
 margin:0 20px 18px 5px;
 color:#606060;
 font-size:0.8em;
}

#leftside a {
 color:#808080
}

/*--------------------------------------------------------------
						Navigation menu
---------------------------------------------------------------*/

#menu a {
 display:block;
 width:202px;
 padding:5px 18px 5px 0;
 color:#606060;
 background:#e0e0e0 url(../img/sidebarbg.gif) top right repeat-y;
 font-size:1.6em;
 font-weight:normal;
 text-decoration:none;
 letter-spacing:-1px;
}

#menu a:hover {
 color:#303030;
 background:#f0f0f0 url(../img/sidebarbg.gif) top right repeat-y;
}

#menu a.active {
 padding:5px 18px 5px 0;
 background:#fafafa;
 border-top:2px solid #c0c0c0;
 border-bottom:2px solid #c0c0c0;
}

#menu a.active:hover {
 color:#505050;
 background:#fafafa;
}

/*--------------------------------------------------------------
						Right sidebar
---------------------------------------------------------------*/

#extras {
 width:200px;
 float:right;
 color:#666;
}

#extras h2, #extras h3 {
 margin:10px 0 12px 0;
 color:#606060;
 font-size:1.6em;
 font-weight:400;
 letter-spacing:-1px;
 text-align:center;
}

#extras p {
 line-height:1.4em;
 margin: 0 0 15px 0;
}

/*--------------------------------------------------------------
						Content area
---------------------------------------------------------------*/

#content {
 width:750px;
 margin:0 0 0 240px;
 padding:10px 0;
 background:#fafafa;
}

#content p {
 margin:0 0 16px 0;
 line-height:1.5em;
 padding:0 10px 0 10px;
 text-align:justify;
}

#content h1 {
 margin:0;
 color:#0000ff;
 font-size:2.6em;
 letter-spacing:-2px;
 text-align:center;
}

#content h2 {
 margin:0;
 color:#808080;
 font-weight:normal;
 font-size:2em;
 letter-spacing:-1px;
 text-align:center;
}

#content h3 {
 margin:20px 0 10px 0;
 color:#d85d5d;
 font-weight:normal;
 font-size: 2em;
 letter-spacing:-2px;
}

#content h4 {
 margin:0;
 color:#ff9900;
 font-family:Comic Sans MS;
 font-weight:bold;
 font-size:1.8em;
 letter-spacing:-2px;
 padding:0 10px 0 10px;
 text-align:left;
}

#content h5 {
 margin:0;
 color:#0000ff;
 font-family:Comic Sans MS;
 font-weight:bold;
 font-size:1.5em;
 letter-spacing:-1px;
 padding:0 10px 0 10px;
 text-align:left;
}

#contentalt {
 background-color:#fafcff;
 border:1px solid #909090;
 color:#2a2a2a;
 padding:15px 20px 5px;
 margin:0 0 0 240px;
}

#contentalt h1,#contentalt h2 {
 background-color:inherit;
 color:#ff9900;
 font-size:1.8em;
 font-weight:bold;
 letter-spacing:-1px;
 margin:0 0 15px;
 padding:0;
}

#contentalt h2 {
 font-size:1.6em;
 margin-bottom:10px;
 text-align:center;
}

#contentalt img {
 border:1px solid #b0b0b0;
 margin:5px 15px 6px;
 padding:5px;
}

/*--------------------------------------------------------------
						Footer
---------------------------------------------------------------*/

#footer {
 background:#8b8b8b url(../img/footerbg.jpg) top left repeat-x;
 clear:both;
 color:#d0d0d0;
 font-size:0.9em;
 font-weight:bold;
 margin:0;
 padding:20px 0;
 text-align:center;
 width:100%;
}

#footer a {
 color:#d0d0d0;
 font-weight:bold;
}

/*--------------------------------------------------------------
						Various classes
---------------------------------------------------------------*/

.clearingdiv {
 clear:both;
 height:30px;
 width:1px;
}

.intro {
 color:#0000ff;
 font-size:1.2em;
 font-weight:bold;
 font-family:Comic Sans MS;
 font-weight:bold;
 text-align:center;
}

/*--------------------------------------------------------------
						button section
---------------------------------------------------------------*/

.BtnFriendster {
 background-image: url(../img/friendster_out.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

.BtnFriendster:hover {
 background-image: url(../img/friendster_over.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

.BtnKomuniti {
 background-image: url(../img/komuniti_pj2_out.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

.BtnKomuniti:hover {
 background-image: url(../img/komuniti_pj2_over.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

.BtnBlogxtvt {
 background-image: url(../img/blog_aktiviti_out.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

.BtnBlogxtvt:hover {
 background-image: url(../img/blog_aktiviti_over.png);
 height: 80px;
 width: 280px;
 border: 0px outset #4774B9;
 cursor: pointer;
 background-position: center center;
}

/*--------------------------------------------------------------
						image section
---------------------------------------------------------------*/

.ImgFriendster {
 background-image: url(../img/iori_yagami.jpg);
 height: 90px;
 width: 73px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

.ImgFriendster:hover {
 background-image: url(../img/iori_yagami.jpg);
 height: 270px;
 width: 219px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

.ImgKomuniti {
 background-image: url(../img/ym_ikon.jpg);
 height: 90px;
 width: 73px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

.ImgKomuniti:hover {
 background-image: url(../img/ym_ikon.jpg);
 height: 270px;
 width: 219px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

.ImgKomuniti2 {
 background-image: url(../img/gathering.jpg);
 height: 90px;
 width: 73px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

.ImgKomuniti2:hover {
 background-image: url(../img/gathering.jpg);
 height: 270px;
 width: 219px;
 cursor: pointer;
 background:#ffffff;
 background-position: center center;
}

/*--------------------------------------------------------------
						background section
---------------------------------------------------------------*/