@charset "utf-8";

/*****  

basic.css for a site or model  of womusic

Including: reset, fix, box, effect

Version: fl20130902

Author: Feilong & Spring

Author URI: http://feilong.org

*****/









/****  reset. use these tags only ****/

html{padding:0;margin:0;overflow-y:auto;}

html{zoom:1;}

html button::-moz-focus-inner{border-color:transparent!important;} 







div,p{padding:0;margin:0;}

h1,h2,h3,h4,h5,h6,strong,b,small{padding:0;margin:0;font-weight:400;}

em,i,span,u{padding:0;margin:0;font-style:normal;text-decoration:none;}

img{border:none;}



dl,dt,dd,ul,ol,li{padding:0;margin:0;list-style:none;}

table,th,td{padding:0;border-spacing:0;border-collapse:collapse;margin:0;}

caption,th{font-weight:400;}



form,label,input,button,select,textarea{margin:0;padding:0;}

input,button,select,textarea{font-family:inherit;font-size:100%;}

button,input{line-height:normal;}

button,select{text-transform:none;}

button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance:button;cursor:pointer;}

button[disabled],html input[disabled] {cursor:default;}

input[type="checkbox"],input[type="radio"] {box-sizing:border-box;padding:0;}

input[type="search"] {-webkit-appearance: textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}

input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{ -webkit-appearance:none;}

button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0;}

textarea{overflow:auto;vertical-align:top;}

html button::-moz-focus-inner{border-color:transparent!important;} 

fieldset{border:none;}

label{display:inline-block;*display:inline;*zoom:1;vertical-align:middle;}

object,iframe,address,blockquote,pre,acronym,bdo,cite,code,abbr{padding:0;margin:0;}

q:before,q:after,blockquote:before,blockquote:after{content:'';}





/* basic a*/

a{/*transition: color 0.2s ease-in-out 0s;*/}

a:link{color:#666;text-decoration:none;}

a.mka,.mka{color:#999!important;cursor:pointer;}

a.cra,.cra{color:#ff8400!important;cursor:pointer;}

a.cba,.cba{color:#06C!important;cursor:pointer;}

a.cba1,.cba1{color:#ff8400!important;cursor:pointer;}







/**** fix.  need not change ****/







/***  float ***/

/* auto fix of float, http://nicolasgallagher.com/micro-clearfix-hack */

.cf:before,.cf:after{display:table;line-height:0;content:' ';}

.cf:after{clear:both;}

.cf{*zoom:1;}

/* manual fix of float */

.clear{clear:both;}



.fl{float:left;}

.fr{float:right;}







/***position***/

.rel{position:relative;}.abs{position:absolute;}.fixed{position:fixed;}

.x0{top:0;}.x1{top:50%;}.x2{bottom:0;}

.y0{left:0;}.y1{left:50%;}.y2{right:0;}



/** cen **/

.vmid{display:table-cell;vertical-align:middle;}

.vmid *{vertical-align:middle;}







/***  overflow ***/

.elis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;}

.autobr{word-wrap:break-word;overflow:hidden;}

.ox{overflow-x:auto;overflow-y:hidden;}

.oy{overflow-x:hidden;overflow-y:auto;}







/***  visibility ***/

.in{display:inline;}

.block{display:block;}

.inb{display:inline-block;*display:inline;*zoom:1;vertical-align:middle;}

.hide{display:none!important;}

.vh{visibility:hidden;}

.vv{visibility:visible;}

.ht{font:0/0 a;color:transparent;text-shadow:none;

background-color:transparent;}

.hand{cursor:pointer;}

.cude{cursor:default;}









/**** box.  width [height], padding border margin, font, background  ****/







/***width ***/

.wa{width:2px;}

.wb{width:4px;}

.wc{width:6px;}

.wd{width:8px;}

.we{width:10px;}

.wf{width:12px;}

.wg{width:14px;}



.wh{width:16px;}

.wi{width:18px;}

.wj{width:20px;}

.wk{width:22px;}

.wl{width:24px;}

.wm{width:26px;}

.wn{width:28px;}



.wo{width:30px;}

.wp{width:32px;}

.wq{width:34px;}

.wr{width:36px;}

.ws{width:38px;}

.wt{width:40px;}



.wu{width:42px;}

.wv{width:44px;}

.ww{width:46px;}

.wx{width:48px;}

.wy{width:50px;}

.wz{width:52px;}



.w1{width:1em;}

.w2{width:2em;}.w2m{max-width:2em;}

.w3{width:3em;}.w3m{max-width:3em;}

.w4{width:4em;}.w4m{max-width:4em;}

.w5{width:5em;}.w5m{max-width:5em;}

.w6{width:6em;}.w6m{max-width:6em;}

.w7{width:7em;}.w7m{max-width:7em;}

.w8{width:8em;}.w8m{max-width:8em;}

.w9{width:9em;}.w9m{max-width:9em;}

.w10{width:10em;}.w10m{max-width:10em;}



.w11{width:11em;}

.w12{width:12em;}

.w13{width:13em;}

.w14{width:14em;}

.w15{width:15em;}

.w16{width:16em;}.w16m{max-width:16em;}

.w17{width:17em;}

.w18{width:18em;}

.w19{width:19em;}

.w20{width:20em;}



.w21{width:21em;}

.w22{width:22em;}

.w23{width:23em;}

.w24{width:24em;}

.w25{width:25em;}

.w26{width:26em;}



.w30{width:30%;}

.w40{width:40%;}

.w50{width:50%;}

.w60{width:60%;}

.w70{width:70%;}

.w80{width:80%;}

.w85{width:85%;}

.w90{width:90%;}

.w95{width:95%;}

.w98{width:98%;}

.w100{width:100%;}





/***height line-height ***/

.ht1{height:100%;}

.lhn{line-height:normal;}

.lha{line-height:18px;}

.lhb{line-height:20px;}

.lhc{line-height:22px;}

.lhd{line-height:24px;}

.lhe{line-height:26px;}

.lhf{line-height:28px;}

.lhg{line-height:30px;}



/***padding ***/

.pta{padding-top:3px;}

.ptb{padding-top:4px;}

.ptc{padding-top:6px;}

.ptd{padding-top:8px;}

.pte{padding-top:10px;}

.ptf{padding-top:12px;}

.ptg{padding-top:15px;}

.pth{padding-top:18px;}

.pti{padding-top:20px;}



.pra{padding-right:3px;}

.prb{padding-right:4px;}

.prc{padding-right:6px;}

.prd{padding-right:8px;}

.pre{padding-right:10px;}

.prf{padding-right:12px;}

.prg{padding-right:15px;}

.prh{padding-right:18px;}

.pri{padding-right:20px;}



.pba{padding-bottom:3px;}

.pbb{padding-bottom:4px;}

.pbc{padding-bottom:6px;}

.pbd{padding-bottom:8px;}

.pbe{padding-bottom:10px;}

.pbf{padding-bottom:12px;}

.pbg{padding-bottom:15px;}

.pbh{padding-bottom:18px;}

.pbi{padding-bottom:20px;}



.pla{padding-left:3px;}

.plb{padding-left:4px;}

.plc{padding-left:6px;}

.pld{padding-left:8px;}

.ple{padding-left:10px;}

.plf{padding-left:12px;}

.plg{padding-left:15px;}

.plh{padding-left:18px;}

.pli{padding-left:20px;}

.pl1{padding-left:1em;}

.pl2{padding-left:2em;}

.pl3{padding-left:3em;}

.pl4{padding-left:4em;}

.pl5{padding-left:5em;}

.pl6{padding-left:6em;}



.pa{padding:3px;}

.pb{padding:4px;}

.pc{padding:6px;}

.pd{padding:8px;}

.pe{padding:10px;}

.pf{padding:12px;}

.pg{padding:15px;}

.ph{padding:18px;}

.pi{padding:20px;}







/***border ***/

.bt{border-top:1px solid #ccc;}

.br{border-right:1px solid #ccc;}

.bb{border-bottom:1px solid #ccc;}

.bl{border-left:1px solid #ccc;}

.bn{border-top:1px solid #ccc;border-right:1px solid #ccc;border-left:1px solid #ccc;}

.be{border-right:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;}

.bs{border-bottom:1px solid #ccc;border-right:1px solid #ccc;border-left:1px solid #ccc;}

.bw{border-left:1px solid #ccc;border-top:1px solid #ccc;border-bottom:1px solid #ccc;}

.b{border:1px solid #ccc;}



.bt2{border-top:1px dotted #ccc;}

.br2{border-right:1px dotted #ccc;}

.bb2{border-bottom:1px dotted #ccc;}

.bl2{border-left:1px dotted #ccc;}

.bn2{border-top:1px dotted #ccc;border-right:1px dotted #ccc;border-left:1px dotted #ccc;}

.be2{border-right:1px dotted #ccc;border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;}

.bs2{border-bottom:1px dotted #ccc;border-right:1px dotted #ccc;border-left:1px dotted #ccc;}

.bw2{border-left:1px dotted #ccc;border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;}

.b2{border:1px dotted #ccc;}



.bt3{border-top:1px dashed #ccc;}

.br3{border-right:1px dashed #ccc;}

.bb3{border-bottom:1px dashed #ccc;}

.bl3{border-left:1px dashed #ccc;}

.bn3{border-top:1px dashed #ccc;border-right:1px dashed #ccc;border-left:1px dashed #ccc;}

.be3{border-right:1px dashed #ccc;border-top:1px dashed #ccc;border-bottom:1px dashed #ccc;}

.bs3{border-bottom:1px dashed #ccc;border-right:1px dashed #ccc;border-left:1px dashed #ccc;}

.bw3{border-left:1px dashed #ccc;border-top:1px dashed #ccc;border-bottom:1px dashed #ccc;}

.b3{border:1px dashed #ccc;}



.bt0{border-top:0 !important;}

.br0{border-right:0 !important;}

.bb0{border-bottom:0 !important;}

.bl0{border-left:0 !important;}

.bca{border-color:#fff !important;}

.bcb{border-color:#f2f2f2 !important;}

.bcc{border-color:#ddd !important;}

.bcd{border-color:#92b8c8 !important;}

.bce{border-color:#ede4f8 !important;}

.bwa{border-width:2px !important;}

.bwb{border-width:3px !important;}



/***margin ***/

.mt0{margin-top:0 !important;}

.mta{margin-top:3px;}

.mtb{margin-top:4px;}

.mtc{margin-top:6px;}

.mtd{margin-top:8px;}

.mte{margin-top:10px;}

.mtf{margin-top:12px;}

.mtg{margin-top:15px;}

.mth{margin-top:18px;}

.mti{margin-top:20px;}



.mr0{margin-right:0 !important;}

.mra{margin-right:3px;}

.mrb{margin-right:4px;}

.mrc{margin-right:6px;}

.mrd{margin-right:8px;}

.mre{margin-right:10px;}

.mrf{margin-right:12px;}

.mrg{margin-right:15px;}

.mrh{margin-right:18px;}

.mri{margin-right:20px;}



.mb0{margin-bottom:0 !important;}

.mba{margin-bottom:3px;}

.mbb{margin-bottom:4px;}

.mbc{margin-bottom:6px;}

.mbd{margin-bottom:8px;}

.mbe{margin-bottom:10px;}

.mbf{margin-bottom:12px;}

.mbg{margin-bottom:15px;}

.mbh{margin-bottom:19px;}

.mbi{margin-bottom:20px;}



.ml0{margin-left:0 !important;}

.mla{margin-left:3px;}

.mlb{margin-left:4px;}

.mlc{margin-left:6px;}

.mld{margin-left:8px;}

.mle{margin-left:10px;}

.mlf{margin-left:12px;}

.mlg{margin-left:15px;}

.mlh{margin-left:18px;}

.mli{margin-left:20px;}







/***font ***/





/**font size**/

.fs12{font-size:12px!important;}

.fs14{font-size:14px!important;}

.fs16{font-size:16px!important;}

.fs18{font-size:18px!important;}

.fs20{font-size:20px!important;}

.fs22{font-size:22px!important;}

.fs24{font-size:24px!important;}

.fs26{font-size:26px!important;}

.fs28{font-size:28px!important;}

.fs30{font-size:30px!important;}

.fs32{font-size:32px!important;}



/** font family **/

.ffy{ font-family:"Microsoft YaHei";}

.ffs{ font-family:"Simsun";}





/** font weight **/

.fw4{font-weight:400!important;}

.fw6{font-weight:600 !important;}





/** font style **/

.fsi{font-style:italic!important;}

.fsn{font-style:normal!important;}





/** text align **/

.tal{text-align:left !important;}

.tac{text-align:center !important;}

.tar{text-align:right !important;}





/** vertical align **/

.vat{vertical-align:top!important;}

.vam{vertical-align:middle !important;}

.vab{vertical-align:text-bottom !important;}





/**letter spacing**/

.ls1{letter-spacing:1px;}

.ls2{letter-spacing:2px;}

.ls3{letter-spacing:3px;}

.ls4{letter-spacing:4px;}

.ls5{letter-spacing:5px;}





/**font color**/

.ctr{color:transparent!important;}

.c0{color:#000;}

.c1{color:#fff;}

.c2{color:#f2f2f2;}

.c3{color:#333!important;}

.c4{color:#666!important;}

.c5{color:#999!important;}

.c6{color:#ccc!important;}

.c7{color:#ddd!important;}

.c8{color:#eee!important;}



.ca{color:#ff8400!important;}

.cb{color:#00f!important;}

.cc{color:#F36!important;}

.cd{color:#f00!important;}

.ce{color:#390!important; }



/** background color **/

.bgno{background-image:none!important;}

.bgtr{background-color:transparent!important;}

.bg0{background-color:#000;}

.bg1{background-color:#fff;}

.bg2{background-color:#f7f7f7;}

.bg3{background-color:#333;}

.bg4{background-color:#666;}

.bg5{background-color:#999;}

.bg6{background-color:#ccc;}

.bg7{background-color:#ddd;}

.bg8{background-color:#eee;}



.bga{background-color:#ff8400!important;}

.bgb{background-color:#00f!important;}

.bgc{background-color:#F36!important;}

.bgd{background-color:#f00!important;}



/** color with background **/

.default{color:gray;background:#fff;}

.almost{color:#fff;background:#fff;}



.good{color:green;background:#fff;}

.yes{color:green;background:#fff;}

.ok{color:green;background:#fff;}

.right{color:green;background:#fff;}

.passed{color:green;background:#fff;}



.bad{color:#F30;background:#fff;}

.no{color:#F30;background:#fff;}

.error{color:#F30;background:#fff;}

.wrong{color:#F30;background:#fff;}

.alert{color:#F30;background:#fff;}





/**hr **/

.hr0{height:1px;border-width:1px 0 0;border-style:solid;border-color:#ccc;}

.hr1{height:1px;border-width:1px 0 0;border-style:solid;border-color:#ccc;}

.hr2{ height:3px;border-width:3px 0 0;border-style:double;border-color:#ccc;}

.hr3{ height:5px;border-width:5px 0 0;border-style:ridge;border-color:#ccc;}

.hr4{ height:10px;border-width:10px 0 0;border-style:groove;border-color:#ccc;}







/**** effect.  use css3 attributes ****/



/*** radius ***/

.ra{border-top-left-radius:4px;}

.rb{border-top-right-radius:4px;}

.rc{border-bottom-right-radius:4px;}

.rd{border-bottom-left-radius:4px;}



.rn{border-top-left-radius:4px;border-top-right-radius:4px;}

.re{border-top-right-radius:4px;border-bottom-right-radius:4px;}

.rs{border-bottom-right-radius:4px;border-bottom-left-radius:4px;}

.rw{border-bottom-left-radius:4px;border-top-left-radius:4px;}



.r{border-radius:4px;}

.r12{border-radius:12px;}

.r16{border-radius:16px;}







/*** box-shadow ***/

.bsd{-moz-box-shadow:0 0 3px #ccc;-webkit-box-shadow:0 0 3px #ccc;box-shadow:0 0 3px #ccc;

filter: progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction=145, Strength=3);

} /* zhong */

.bsd-da{-moz-box-shadow:0 0 20px #000;-webkit-box-shadow:0 0 20px #000;box-shadow:0 0 20px #000;} /* da */

.bsd-xiao{border:1px solid #fff;

-moz-box-shadow:0 0 1px #999;-webkit-box-shadow:0 0 1px #999;box-shadow:0 0 1px #999;} /* xiao */

.bsd-x{-moz-box-shadow:5px 0 0 #50b;-webkit-box-shadow:5px 0 0 #50b;box-shadow:5px 0 0 #50b;} /* x offset */

.bsd-y{-moz-box-shadow:0 1px 0 #ebe8f6;-webkit-box-shadow:0 1px 0 #ebe8f6;box-shadow:0 1px 0 #ebe8f6;}/* y offset */

.bsd-z{-moz-box-shadow:0px 0 60px #f30;-webkit-box-shadow:0px 0 60px #f30;box-shadow:0px 0 60px #f30;} /* z offset */

.bsy{box-shadow: 0 15px 10px -15px rgba(0, 0, 0, 0.4);}

.bsy2{box-shadow: 0 5px 2px -5px rgba(0, 0, 0, 0.4);}



.bsdx2{box-shadow: 5px 0 5px -5px black;} /* x offset2 */



/*http://blog.w3conversions.com/2011/09/css3-spread-value-and-box-shadow-on-one-side-only/*/



/*** text-shadow ***/

.tsd{text-shadow:1px 1px 1px #fff;}





/***  gradient ***/

.gr{

background: #f6f8f9; /* Old browsers */

background: -moz-linear-gradient(top,  #f6f8f9 0%, #e5ebee 50%, #f5f7f9 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(100%,#f5f7f9)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#f5f7f9 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top,  #f6f8f9 0%,#e5ebee 50%,#f5f7f9 100%); /* IE10+ */

background: linear-gradient(to bottom,  #f6f8f9 0%,#e5ebee 50%,#f5f7f9 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */

}



.grfd{filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#dddddd');

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#dddddd')";

background-image: -moz-linear-gradient(top, #ffffff, #dddddd);

background-image: -ms-linear-gradient(top, #ffffff, #dddddd);

background-image: -o-linear-gradient(top, #ffffff, #dddddd);

background-image: -webkit-linear-gradient(top, #ffffff, #dddddd);

background-image: linear-gradient(top, #ffffff, #dddddd);}



.grb1{

background-image: linear-gradient(bottom, #7FD615 6%, #74C70E 55%, #78D10C 77%);

background-image: -o-linear-gradient(bottom, #7FD615 6%, #74C70E 55%, #78D10C 77%);

background-image: -moz-linear-gradient(bottom, #7FD615 6%, #74C70E 55%, #78D10C 77%);

background-image: -webkit-linear-gradient(bottom, #7FD615 6%, #74C70E 55%, #78D10C 77%);

background-image: -ms-linear-gradient(bottom, #7FD615 6%, #74C70E 55%, #78D10C 77%);

background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.06, #7FD615),color-stop(0.55, #74C70E),color-stop(0.77, #78D10C));}





/*** filter ***/

.flt img{opacity:0.9;filter:alpha(Opacity=90);*filter:none;}

.flt:hover img{opacity:1;filter:alpha(Opacity=100);*filter:none;}

.fi{filter:alpha(opacity=70);opacity:0.7;}

.fi2{filter:alpha(opacity=90);opacity:0.9;}



/*** transition ***/

.trs{transition: background-position 0.2s ease-in 0s;}





/*****  end of  basic css *****/