/*定位*/
.rel {position: relative;}
.abs {position: absolute;}
.fixed {position: fixed;}

/*布局*/
.inline {display: inline;}
.block {display: block;}
.inline-block {display: inline-block;}
.none {display: none;}

/* width percent*/
.w100p {width: 100%;}
.w95p {width: 95%;}
.w90p {width: 90%;}
.w80p {width: 80%;}
.w75p {width: 75%;}
.w70p {width: 70%;}
.w60p {width: 60%;}
.w50p {width: 50%;}
.w40p {width: 40%;}
.w30p {width: 30%;}
.w32p {width: 32%;}
.w33p {width: 33.3%;}
.w25p {width: 25%;}
.w20p {width: 20%;}
.w10p {width: 10%;}
.maw-100p {max-width: 100%;}
.miw-100p {min-width: 100%;}


/* height percent*/
.h70p{height: 70%;}
.h80p{height: 80%;}
.h100p{height: 100%;}
.mah-100p {max-height: 100%;}
.mih-100p {min-height: 100%;}
.mih-120p {min-height: 120%;}
.mih-150p {min-height: 150%;}


/*边缘*/
.top0 {top: 0}
.left0 {left: 0}
.right0 {right: 0}
.bottom0 {bottom: 0}

/*文本对其方式*/
.text-left { text-align: left;}
.text-center {text-align: center;}
.text-right { text-align: right;}

/*文字定位*/
.vam {vertical-align:middle;}

/*删除线*/
.line-through {text-decoration:line-through;}
.wbreak-word {word-wrap:break-word;}

/*鼠标悬停样式*/
.pointer {cursor: pointer;}

/*浮动相关*/
.fl{float: left;}
.fr{float: right;}
.clearfix {clear:both;}
.clearfix:after {}

.of-hidden{overflow: hidden;}
.overflow-y{overflow-y: auto;}

/*翻转*/
.flipx {
    -moz-transform:scalex(-1);
    -webkit-transform:scalex(-1);
    -o-transform:scalex(-1);
    transform:scalex(-1);
    /*ie*/
    filter:fliph;
}

/*灰度*/
.gray { 
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

.blur { 
    -webkit-filter: blur(2px); /* chrome, opera */
       -moz-filter: blur(2px);
        -ms-filter: blur(2px);    
            filter: blur(2px);
}

/*z-index*/
.z-9 {z-index: 9;}
.z-99 {z-index: 99;}
.z-999 {z-index: 999;}
.z-9999 {z-index: 9999;}
.z-max {z-index: 99999;}

/*颜色 color or background-color*/
.c-white {color: #fff;}
.red {color: #f00;}
.c3 {color: #333}
.c6 {color: #666}
.c8 {color: #888;}
.c9 {color: #999;}
.ca {color: #aaa;}
.cc {color: #ccc;}
.cd {color: #ddd;}
.ce {color: #eee;}


.co1 {color: #ff7360;}
.co2 {color: #ffc900;}
.co3 {color: #33cbcc;}
.co4 {color: #ff9500;}
.co5 {color: #c7625b;}
.co6 {color: #ffcc00;}
.co7 {color: #cddc39;}
.co8 {color: #ff7360;}
.co9 {color: #5bade3;}
.coa {color: #20c627;}
.cob {color: #5eaffd;}

/*background-color*/
.bgc-f5 {background-color: #f5f5f5}
.bgc-gray {background-color: #ddd}
.bgc-white {background-color: #fff}
.bgc-green {background-color: #0f0}
.bgc-blue {background-color: #00f}
.bgc-red {background-color: #f00}
.bgc-yellow {background-color: #ff0}
.bgc-orange {background-color: #f90}
.bgc-purple {background-color: #639}
.bgc-cyan {background-color: #0ff}
.bgc-black {background-color: #000}
.disabled,.disabled>div {background-color: #ccc;}

.bgc-r {background-color: #ff2d67}
.bgc-b {background-color: #439cee}
.bgc-p {background-color: #724eff}
.bgc-o {background-color: #fa8478}

/*font-weight*/
.fw2 {font-weight: 200;}
.fw6 {font-weight: 600;}
.fw7 {font-weight: 700;}

/*border*/
.border-top {border-top:1px solid #eee;}
.border-bottom {border-bottom:1px solid #eee;}
.border-bottom-c {border-bottom:1px solid #ccc;}
.border-left { border-left:1px solid #eee; }
.border-b-dashed { border-bottom:1px dashed #ddd; }

.dashed-2-d {
  border:2px dashed #ddd;
}



.item-tip {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    background-color: #0096ff;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    margin-right: 20px;
}


.scroll-y {
    overflow-y: auto;
}