@charset "UTF-8";
/* CSS Document */

*{
	margin:0px;
	padding:0px;
}
img{
	margin:0px;
}
body{
	background-color:#2ec8ca;
	background-image:url(images/bg.jpg);
	background-repeat:repeat-x;
	font-size:13px;
	font-family:Arial, Helvetica, sans-serif;
}
a{
	color:#000;
}
#main{
	margin-left:auto;
	margin-right:auto;
	width:950px;
}

.login{
	display:block;
	width:60px;
	height:19px;
	background-image:url(images/btn_login.gif);
	background-position:0px 19px;	
	margin-right:16px;
	float:left;
	}
.login:hover{
	background-position:0px 0px;
}
.jhint{
	font-size:12px;
	color:#5b6361;
	display:block;
	margin-top:2px;
}
.join{
	display:block;
	margin-top:4px;
	width:218px;
	height:43px;
	background-image:url(images/btn_join.gif);
	background-position:0px 43px;	
	margin-right:6px;
	float:left;
	}
.join:hover{
	background-position:0px 0px;
}
#cnt{
	width:950px;
	background-color:#e4f7f3;

	padding-top:12px;
}
.isl{
	width:579px; 
	height:138px; 
	background-image:url(images/island.jpg);
	color:#FFF;
}
.isl p{
	display:block;
	width:510px;
	padding-top:36px;
	margin-left:40px;
	font-size:17px;
}
.isl a{
	color:#FFF;
}
#reg, #log {
	width:287px; 
	height:250px;
	background-image:url(images/reg_bg.gif);
	padding:10px;
	color:#FFF;
}
#log2 {
	width:287px; 
	height:349px;
	background-image:url(ads/images/reg_bg.gif);
	padding:10px;
	color:#FFF;
}
#logged {
	width:287px; 
	height:330px;
	background-image:url(images/logged_bg.gif);
	padding:10px;
	color:#FFF;
}

/* text fields */
.txt{
	margin-top:5px;
	margin-bottom:10px;
}
.txt2{
	margin-top:5px;
	margin-left:8px;
	margin-bottom:10px;
}
.lft{
	float:left; 
	width:7px;
	height:38px;
	background-image:url(images/txt_left.png);
}
.lft-red{
	float:left; 
	width:7px;
	height:38px;
	background-image:url(images/txt_left_red.png);
}
.ctr{
	float:left;
	width:270px;
	padding-top:3px;
	height:35px;	
	background-image:url(images/txt_bg.gif);	
}
.ctr input{
	width:268px;
	height:32px;
	border:0px;
	font-size:16px;
	color:#4b7c6f;
}

.ctr2{
	float:left;
	width:190px;
	padding-top:3px;
	height:35px;	
	background-image:url(images/txt_bg.gif);	
}
.ctr2 input{
	width:188px;
	height:32px;
	border:0px;
	font-size:16px;
	color:#4b7c6f;
}
.ctr-red{
	float:left;
	width:270px;
	padding-top:3px;
	height:35px;	
	background-image:url(images/txt_bg_red.gif);	
}
.ctr-red input{
	width:188px;
	height:32px;
	border:0px;
	font-size:16px;
	color:#4b7c6f;
}
.rght{
	float:left; 
	width:7px;
	height:38px;	
	background-image:url(images/txt_right.png);

}
.rght2{
	float:left; 
	width:5px;
	height:38px;	
	background-image:url(images/txt_right2.gif);

}
.rght3{
	float:left; 
	width:5px;
	height:38px;	
	background-image:url(images/txt_right3.gif);
}
.rght-red{
	float:left; 
	width:5px;
	height:38px;	
	background-image:url(images/txt_right_red.png);
}
/* end of text fields */
label{
	font-size:12px;
	color:#FFF;
}
label a{
	color:#FFF;
}
.regb{
	display:block;
	width:218px;
	height:43px;
	background-image:url(images/btn_reg.gif);
	background-position:0px 43px;
	margin-left:35px;
	margin-top:5px;
	margin-bottom:5px;
	float:left;
	}
.regb:hover{
	background-position:0px 0px;
}
.logb{
	display:block;
	width:218px;
	height:43px;
	background-image:url(images/btn_loginb.gif);
	background-position:0px 43px;
	margin-left:35px;
	margin-top:15px;
	float:left;
	}
.logb:hover{
	background-position:0px 0px;
}
.stats{
	float:left;
	width:144px;
	height:109px;
	background-image:url(images/stat_bg.gif);
	margin-bottom:20px;
}
.stats span{
	display:block;
	text-align:center;
	font-size:12px;
	padding-top:8px;
	color:#7f5f19;
}
.stats strong{
	display:block;
	text-align:center;
	font-size:16px;
	padding-top:22px;
	height:20px;
}

/* example bar */
.mag{
	width:890px;
	height:139px;
	margin-top:20px;
	margin-bottom:20px;
}
.m1{
	float:left;
	width:250px;
	height:139px;
	text-align:center;
}
.m1 img{
	margin-top:30px;
}
.m2{
	float:left;
	width:4px;
	background-image:url(images/mag_l.gif);
	height:139px;	
}
.m3{
	float:left;
	width:630px;
	background-image:url(images/mag_bg.gif);
	height:136px;
	padding-top:3px;
}
.m4{
	float:left;
	width:4px;
	background-image:url(images/mag_r.gif);	
	height:139px;	
}
.mend{
	width:1px;
	clear:both;
}

.exm{
	margin-left:20px; 
	margin-top:10px;	
}
.exm span{
	font-size:12px;
	color:#FFF;
}
.exm img{
	margin-top:5px;
}
.ex1{
	float:left; 
	width:263px;	
}

.ex3{
	float:left; 
	width:312px;
	margin-left:10px;
}



.magl{
	width:890px;
	height:215px;
	margin-top:20px;
	margin-bottom:20px;
}
.m1l{
	float:left;
	width:250px;
	height:215px;
	text-align:center;
	
}
.m1l img{
	margin-top:30px;
}
.m2l{
	float:left;
	width:4px;
	background-image:url(images/mag_long_l.gif);
	height:215px;	
}
.m3l{
	float:left;
	width:630px;
	background-image:url(images/mag_long_bg.gif);
	height:215px;	
}
.m4l{
	float:left;
	width:4px;
	background-image:url(images/mag_long_r.gif);	
	height:215px;	
}

/* end of example bar */

th{
	background-image:url(images/thbg.gif);
	height:25px;
}
td{
	font-size:15px;
}
.mtd{
	background-color:#dee9e7;
}
.mtdl{
	background-color:#dee9e7;
/*	line-height:18px;*/
}
.regs{
	display:block;
	width:112px;
	height:24px;
	background-image:url(images/btn_reg_s.gif);
	background-position:0px 24px;	
	float:left;
	}
.regs:hover{
	background-position:0px 0px;
}
.logs{
	display:block;
	width:71px;
	height:24px;
	background-image:url(images/btn_login_s.gif);
	background-position:0px 24px;	
	float:left;
	}
.logs:hover{
	background-position:0px 0px;
}
.out{
	display:block;
	width:100px;
	height:14px;
	background-image:url(images/out.png);
	background-repeat:no-repeat;
	padding-left:15px;
	color:#FFF;
	font-size:12px;
	text-decoration:none;
}
.out:hover{
	text-decoration:underline;	
}
.lstats{
	width:269px;
	height:56px;
	margin-left:8px;
	background-image:url(images/log_stats.gif);
}
.lstats span{
	display:block;
	width:100px;
	height:50px;
	float:left;
	padding-top:6px;
	text-align:right;
	font-size:12px;
	padding-top:4px;
	color:#7f6319;
}
.lstats strong{
	display:block;
	width:140px;
	padding-left:20px;
	height:50px;
	padding-top:18px;
	text-align:center;
	font-size:16px;
	color:#000;
	float:left;
}
.number{
	width:259px;
	height:26px;
	margin-top:5px;
	margin-left:8px;
	color:#000;
	background-image:url(images/number_bg.gif);
	padding-top:10px;
	padding-left:10px;
}
.edit{
	display:block;
	width:20px;
	height:20px;
	background-image:url(images/edit.gif);
}
.delete{
	display:block;
	width:20px;
	height:20px;
	background-image:url(images/delete.gif);
}
#ppadd{
	background-image:url(images/pp_bg.png);
	width:307px;
	height:148px;
}


/* popup text field */
.pptxt{
	margin-top:15px;
	margin-left:10px;
	margin-bottom:10px;
}
.pplft{
	float:left; 
	width:7px;
	height:38px;
	background-image:url(images/pp_txt_l.gif);
}
.ppctr{
	float:left;
	width:270px;
	padding-top:3px;
	height:35px;	
	background-image:url(images/pp_txt_bg.gif);	
}
.ppctr input{
	width:268px;
	height:32px;
	border:0px;
	font-size:16px;
	color:#4b7c6f;
}
.pprght{
	float:left; 
	width:7px;
	height:38px;	
	background-image:url(images/pp_txt_r.gif);

}
/* end of popup text field */

.ppaddbtn{
	display:block;
	width:116px;
	height:28px;
	background-image:url(images/pp_btn_add.gif);
	background-position:0px 28px;
	margin-left:100px;
}
.ppaddbtn:hover{
	background-position:0px 0px;
}
.ok{
	display:block;
	float:left;
	margin-top:7px;
	margin-left:7px;
	width:24px;
	height:24px;
	background-image:url(images/btn_ok.gif);
	background-position:0px 24px;
}
.ok:hover{
	background-position:0px 0px;
}
.cancel{
	display:block;
	float:left;	
	margin-top:7px;
	margin-left:3px;	
	width:24px;
	height:24px;
	background-image:url(images/btn_cancel.gif);
	background-position:0px 24px;
}
.cancel:hover{
	background-position:0px 0px;
}
#contact{
	width:605px;
	height:436px;
	background-image:url(images/fcbg.png);
	padding-top:14px;
	padding-left:20px;
}
#feedback{
	width:605px;
	height:436px;
	background-image:url(images/fcbg.png);
	padding-top:14px;
	padding-left:20px;
}
#reg_finish{
	width:605px;
	height:338px;
	background-image:url(images/regbg.png);
	padding-top:14px;
	padding-left:20px;
}
/* text fields */
.txtarea{
	margin-top:5px;
	margin-bottom:10px;
}
.lfta{
	float:left; 
	width:6px;
	height:161px;
	background-image:url(images/tarea_l.gif);
}
.ctra{
	float:left;
	width:570px;
	padding-top:3px;
	height:158px;	
	background-image:url(images/tarea_bg.gif);	
}
.ctra textarea{
	width:568px;
	height:150px;
	border:0px;
	font-size:16px;
	color:#4b7c6f;
}
.rghta{
	float:left; 
	width:6px;
	height:161px;	
	background-image:url(images/tarea_r.gif);

}
/* end of text fields */
.send{
	margin-left:460px;
	display:block;
	width:119px;
	height:28px;
	background-image:url(images/btn_send.gif);
	background-position:0px 28px;	
	float:left;
	}
.send:hover{
	background-position:0px 0px;
}
.close{
	display:block;
	width:23px;
	position:relative;
	top:-3px;
	height:24px;
	background-image:url(images/pp_x.gif);
	background-position:0px 24px;	
	}
.close:hover{
	background-position:0px 0px;
}
.video{
	display:block;
	width:231px;
	height:63px;
	background-image:url(images/video.png);
	background-position:0px 63px;
	position:relative;
	top:-50px;
	left:270px;
}
.video:hover{
	background-position:0px 0px;
}

/* banners */
.bnr1{
	display:block;
	float:left;
	width:228px;
	height:74px;
	background-image:url(images/bnr_facebook.gif);
	background-position:0px 74px;

}
.bnr1:hover{
	background-position:0px 0px;
}
.bnr2{
	display:block;
	float:left;
	width:228px;
	height:74px;
	background-image:url(images/bnr_myspace.gif);
	background-position:0px 74px;

}
.bnr2:hover{
	background-position:0px 0px;
}
.bnr3{
	display:block;
	float:left;
	width:228px;
	height:74px;
	background-image:url(images/bnr_skype.gif);
	background-position:0px 74px;

}
.bnr3:hover{
	background-position:0px 0px;
}
.bnr4{
	display:block;
	float:left;
	width:228px;
	height:74px;
	background-image:url(images/bnr_wb.gif);
	background-position:0px 74px;

}
.bnr4:hover{
	background-position:0px 0px;
}
/* end of banners */
.twitter{
	display:block;
	width:307px;
	height:40px;
	margin-bottom:19px;
	background-image:url(images/bnr_twitter.gif);
	background-position:0px 40px;	
}
.twitter:hover{
	background-position:0px 0px;
}
.ppok{
	display:block;
	width:119px;
	height:28px;
	margin-top:20px;
	background-image:url(images/btn_closepp.gif);
	background-position:0px 28px;	
}
.ppok:hover{
	background-position:0px 0px;
}
.ppchange{
	display:block;
	width:126px;
	height:28px;
	margin-top:20px;
	background-image:url(images/btn_change.gif);
	background-position:0px 28px;	
}
.ppchange:hover{
	background-position:0px 0px;
}

.example{
	width:892px;
	background-color:#f9df9f;
	border:1px solid #fbb302;
	padding:10px;
	color:#543d05;
	font-style:italic;
	}
.example2{
	width:802px;
	background-color:#f9df9f;
	border:1px solid #fbb302;
	padding:10px;
	color:#543d05;
	font-style:italic;
	margin-left:35px;
	}	

.qux{
	float:left;
	width:380px;

	background-color:#f9df9f;
	border:1px solid #fbb302;
	padding:10px;
	margin-top:3px;
}
.qux strong{
	display:block;
	margin-bottom:10px;

}
/* share */
.sh_fb{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_fb.gif);
	background-position:0px 33px;
}
.sh_fb:hover{
	background-position:0px 0px;
}
.sh_tw{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_tw.gif);
	background-position:0px 33px;
}
.sh_tw:hover{
	background-position:0px 0px;
}
.sh_ms{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_ms.gif);
	background-position:0px 33px;
}
.sh_ms:hover{
	background-position:0px 0px;
}
.sh_wp{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_wp.gif);
	background-position:0px 33px;
}
.sh_wp:hover{
	background-position:0px 0px;
}
.sh_bl{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_bl.gif);
	background-position:0px 33px;
}
.sh_bl:hover{
	background-position:0px 0px;
}
.sh_dl{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_dl.gif);
	background-position:0px 33px;
}
.sh_dl:hover{
	background-position:0px 0px;
}
.sh_dg{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_dg.gif);
	background-position:0px 33px;
}
.sh_dg:hover{
	background-position:0px 0px;
}
.sh_bz{
	display:block;
	width:33px;
	height:33px;
	background-image:url(images/i_bz.gif);
	background-position:0px 33px;
}
.sh_bz:hover{
	background-position:0px 0px;
}
/* share */
.top_fb{
	display:block;
	width:106px;
	height:16px;
	background-image:url(images/top_fb.gif);
	background-position:0px 16px;
/*	float:left;*/
}
.top_fb:hover{
	background-position:0px 0px;
}
.top_tw{
	display:block;
	width:93px;
	height:16px;
	background-image:url(images/top_tw.gif);
	background-position:0px 16px;
/*	float:left;
	margin-left:5px;*/
}
.top_tw:hover{
	background-position:0px 0px;
}

.contest{
	display:block;
	width:77px;
	height:70px;
	background-image:url(images/comp.png);
	background-position:0px 70px;
}
.contest:hover{
	background-position:0px 0px;
}
