* {
    box-sizing: border-box;
}
.message {
    width:800px;
    padding:15px;
    position: absolute;
    top: -10px;
    opacity: 0.3;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    font-size: 14px;
    z-index:99;
    margin-top:8px;
}

.message > span {
    margin: 0;
    padding: 0;
    vertical-align: middle;
    font-size:14px;
    line-height:1;
}
.message > pre.text {
    display:inline-block;
    padding: 0 20px;
    vertical-align: middle;
    font-size:14px;
    line-height:20px;
    white-space:pre-wrap;/*css-3*/
    white-space:-moz-pre-wrap;/*Mozilla,since1999*/
    white-space:-pre-wrap;/*Opera4-6*/
    white-space:-o-pre-wrap;/*Opera7*/
    word-wrap:break-word;/*InternetExplorer5.5+*/
    margin:0;
    word-wrap: break-word;
    word-break: break-all;
}
.successImg {
    display:inline-block;
    width: 14px;
    height: 14px;
    background: url('../images/yhgf/success.png') no-repeat;
    vertical-align: middle;
    position: absolute;
    top:18px;
    left:15px;
}

.warningImg {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url('../images/yhgf/waring.png') no-repeat;
    vertical-align: middle;
    position: absolute;
    top:18px;
    left:15px;
}

.errorImg {
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url('../images/yhgf/errorImg.png') no-repeat;
    vertical-align: middle;
    position: absolute;
    top:18px;
    left:15px;
}

.tipImg {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url('../images/yhgf/tipImg.png') no-repeat;
    vertical-align: middle;
    position: absolute;
    top:18px;
    left:15px;
}
.offImg {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url('../images/yhgf/off.png') no-repeat;
    vertical-align: middle;
    position: absolute;
    top:18px;
    right:15px;
}