/*-------------reset--------------*/
body, div, dl, dt, dd, ul, li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, th, td { padding: 0; margin: 0; }
header, nav, section, article, aside, footer{ display:block; } 
table { border-collapse: collapse; border-spacing: 0; }
img { border: 0;}
ul { list-style: none;}

/* --------text-------- */
.f12{ font-size:12px;}
.f14{ font-size:14px;}
.f16{ font-size:16px;}
.f18{ font-size:18px;}
.f20{ font-size:20px;}
.f24{ font-size:24px;}
.f30{ font-size:30px;}
.f36{ font-size:36px;}
.f48{ font-size:24px;}
.f60{ font-size:60px;}
.f72{ font-size:72px;}
.fb{ font-weight:bold;}

/* --------align-------- */
.tl{ text-align:left;}
.tc{ text-align:center;}
.tr{ text-align:right;}

/* --------float-------- */
.fl{ float:left;}
.fr{ float:right;}
.cl{ clear:both;}

/* --------color-------- */
.c_white{ color:#FFF;}
.c_gray{ color:#EEE;}
.c_blue{ color:#39C;}
.c_green{ color:#9C3;}
.c_orange{ color:#F90;}
.c_red{ color:#900 !important;}
.c_dark{ color:#333;}
.c_yellow{ color:#FC0;}

.bg_white{ background:#FFF;}
.bg_gray{ background:#EEE;}
.bg_blue{ background:#39C;}
.bg_green{ background:#9C3;}
.bg_orange{ background:#F90;}
.bg_red{ background:#900;}
.bg_dark{ background:#333;}

/* --------width-------- */
.w10{ width:10px;}
.w20{ width:20px;}
.w30{ width:30px;}
.w40{ width:40px;}
.w50{ width:50px;}
.w60{ width:60px;}
.w70{ width:70px;}
.w80{ width:80px;}
.w90{ width:90px;}

.w100{ width:100px;}
.w200{ width:200px;}
.w300{ width:300px;}
.w400{ width:400px;}
.w500{ width:500px;}
.w600{ width:600px;}
.w700{ width:700px;}
.w800{ width:800px;}
.w900{ width:900px;}

/* --------padding-------- */
.p10{ padding:10px;}
.pt10{ padding-top:10px;}
.pr10{ padding-right:10px;}
.pb10{ padding-bottom:10px;}
.pl10{ padding-left:10px;}

.p20{ padding:20px;}
.pt20{ padding-top:20px;}
.pr20{ padding-right:20px;}
.pb20{ padding-bottom:20px;}
.pl20{ padding-left:20px;}

/* --------margin-------- */
.m10{ margin:10px;}
.mt10{ margin-top:10px;}
.mr10{ margin-right:10px;}
.mb10{ margin-bottom:10px;}
.ml10{ margin-left:10px;}

.m20{ margin:20px;}
.mt20{ margin-top:20px;}
.mr20{ margin-right:20px;}
.mb20{ margin-bottom:20px;}
.ml20{ margin-left:20px;}

.btn_red{ width:100px; display:block; font:bold 14px/30px "微软雅黑"; height:30px; color:#fff; text-align:center; background:#900;float:left; margin:10px 10px 10px 0; border:none; border-radius:10px;}
.btn_red:hover{ background:#F00; text-decoration:none; color:#fff;}



/* --------nav-------- */
.nav li{ float:left; text-align:center;}
.nav li a{ display:block;}