@charset 'UTF-8';

%ui-tips{
    cursor:default; 
    width:90%;
    @include float;
    overflow:hidden; 
    line-height:32px; 
    white-space:nowrap; 
    position:fixed; 
    z-index:9999;
    background-position: 5px center;
    background-repeat: no-repeat;
    padding-left:30px;
}

.ui-tipsinfo{
    @extend %ui-tips;
    color:nth($infoColor,1);
    background-color:nth($infoColor,2); 
    border:2px solid nth($infoColor,3);
    background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAaVBMVEX///9PktVWouyawedRmN9Sm+Lg7Pedwuf///9Wou1VoOlSmuJTldZUn+hVn+mYwOZWoexvptzu9v1NkdTf7fxxp937/P5/sOCvzuzk7vhRmN5Xl9dmodpVoexqo9tRlNVVltbi7fhootuUx1cjAAAAAXRSTlMAQObYZgAAAH5JREFUeF5lj1cOA0EIQ83Usr239PsfMgKtlFHWH2CehMBgbX4imvyGU2tZVDFWRbkKmJc9RVHalxmANjyEnqvxgCPFtg9cW3pD25ip8PjU4sZRWv3AU4kLQdr9+APtC7eUAV5pbA6shqMMKHJAY35Xjb68fg13xu+GoZP4+AI3MwnTKJ+ruwAAAABJRU5ErkJggg==);

}
.ui-tipserror{
    @extend %ui-tips;
    color:nth($errorColor,1);
    background-color:nth($errorColor,2); 
    border:2px solid nth($errorColor,3);
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAw1BMVEX////////uVVXuVFTkSEjVb1HsUlLnS0vvW1vmS0vuWVnvXV3dPj7rUFDkyLz2o6P1mZndQD3rUVHVbU/dPz3kR0fUclLdQTzbUDvaWj/69fP60dHeQjvTg2btVFTcTzvmSkrdTTr//f3lzL/UgWTvYWH++fniwbLvX1/zhYXVbEzygYH0k5P709P95ub+8fHwZ2fjxbj1nZ3839/6z8/xcXHdSzrdTDreQzv83d32n5/eQjz3q6v+9fXwa2v96+v84eGH3JX9AAAAAXRSTlMAQObYZgAAALlJREFUeF49jlWSxDAMBSXZDjLDMDPPMt7/VCsnU9t/3VV+FmhmRRXHVTGDB4P+2BfCH/cHrTZ1nlBLktcNh1S6nxtWJ9yTVACrTISIEVl3xO9hdoHUpKcl4jv7zSFbwQsP7LiwL3hmArEgos0U8Yedhq9tsHrIXHX4gGeDrAPiccmlfbI1KUJ8W/PO9Exmyt/S7qu35uXTryuyFcBW0j8y7U43OjX06Zp5aSe8Z5dzeBCokeeNVKDlD2nuD2i4ItR8AAAAAElFTkSuQmCC);

}
.ui-tipssuccess{
    @extend %ui-tips;
    color:nth($successColor,1);
    background-color:nth($successColor,2); 
    border:2px solid nth($successColor,3);
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAwFBMVEX///////+TzSPD44WSzCOUziaSyyOXzyuZ0DCNxCKn1kyEuCDs9tjt99uOxiKDtx+MwyGx22HP6Z2l1UfC44ORyiOQySKp10/K5ZePxyLv9uDt9d2RyiWZwUuHvCONuTaRyyPI3KCnyGXk7s+Yzy233G3P5Kbx9ueQyCL8/fq81YuTzCOg0UHN36mOvDfu9938/vrg78Gd0TqIviDh78b1+u3C34ms1VuNwSmGuyCh0z+PyCL6/PeXzS+KwCHj7c4XsX5IAAAAAXRSTlMAQObYZgAAAKZJREFUeF5lj9XKQ0EQg3dm5bhr1d1dfn3/t+r0dCmFfncJCSTswYYXUhZ8wzSxgRVGXMlthC+iLRkc3+CMeVILMdrtUXqvwOIyg7OiSKKN5QkG1wwTZpL4QvxtwGQdKjTJECWUzSP8tP4yxCFV8jFAHaB/yBGpkuK03QOA+e0biZS5UlnBCv4dX5CWLqOIspxOYIkq8JyuaqHf1dM/zun7NqL9vH8HBjcL2lWtIocAAAAASUVORK5CYII=);

}

b{
    color:nth($errorColor,1);
    background:nth($errorColor,2);
    border:2px solid nth($errorColor,3);
    padding:3px 5px 3px 30px;
    margin-left:3px;
    @include float;
    position:absolute;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAw1BMVEX////////uVVXuVFTkSEjVb1HsUlLnS0vvW1vmS0vuWVnvXV3dPj7rUFDkyLz2o6P1mZndQD3rUVHVbU/dPz3kR0fUclLdQTzbUDvaWj/69fP60dHeQjvTg2btVFTcTzvmSkrdTTr//f3lzL/UgWTvYWH++fniwbLvX1/zhYXVbEzygYH0k5P709P95ub+8fHwZ2fjxbj1nZ3839/6z8/xcXHdSzrdTDreQzv83d32n5/eQjz3q6v+9fXwa2v96+v84eGH3JX9AAAAAXRSTlMAQObYZgAAALlJREFUeF49jlWSxDAMBSXZDjLDMDPPMt7/VCsnU9t/3VV+FmhmRRXHVTGDB4P+2BfCH/cHrTZ1nlBLktcNh1S6nxtWJ9yTVACrTISIEVl3xO9hdoHUpKcl4jv7zSFbwQsP7LiwL3hmArEgos0U8Yedhq9tsHrIXHX4gGeDrAPiccmlfbI1KUJ8W/PO9Exmyt/S7qu35uXTryuyFcBW0j8y7U43OjX06Zp5aSe8Z5dzeBCokeeNVKDlD2nuD2i4ItR8AAAAAElFTkSuQmCC);
    background-position: 5px center;
    background-repeat: no-repeat;
    white-space:nowrap;
}