.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}

.fade.in {
    opacity: 1;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    background-color: #000000;
}

.modal-backdrop.fade {
    opacity: 0;
    filter: alpha(opacity=0);
}

.modal-backdrop.in {
    opacity: 0.7;
    filter: alpha(opacity=70);
}


.popalert {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
}
.popalert-body {
    position:absolute;
    left:50%;
    top:30%;
    margin-left:-170px;
    width:340px;
    font-size:14px;
    line-height:1.3;
    color:#b1b9c1;

}
.popalert-body:after {
    content:"";
    position:absolute;
    background:url(//cdn.joxi.ru/assets/v1/images/arrow-popalert.png) 0 0 no-repeat;
    display:none;
}

.popalert.left-bottom .popalert-body {
    left:300px;
    bottom:120px;
    top:auto;
    margin-left:0;
}
.popalert.left-bottom .popalert-body:after {
    left:-240px;
    bottom:-100px;
    width:208px;
    height:184px;
    display:block;
    background-position:left bottom;
}

.popalert.right-top .popalert-body {
    left:auto;
    right:280px;
    top:125px;
    margin-left:0;
}
.popalert.right-top .popalert-body:after {
    right:-240px;
    top:-110px;
    width:208px;
    height:184px;
    display:block;
    background-position:left top;
}

.popalert.righter-top .popalert-body {
    left:auto;
    right:10%;
    top:280px;
    margin-left:0;
}
.popalert.righter-top .popalert-body:after {
    left:110px;
    top:-130px;
    width:45px;
    height:112px;
    display:block;
    background-position:-214px -64px;
}


.popalert.center-top .popalert-body {
    top:300px;
}
.popalert.center-top .popalert-body:after {
    left:110px;
    top:-130px;
    width:45px;
    height:112px;
    display:block;
    background-position:-214px -64px;
}

.popalert.center-bottom .popalert-body {
    bottom:240px;
    top:auto;
}
.popalert.center-bottom .popalert-body:after {
    left:120px;
    bottom:-120px;
    width:45px;
    height:112px;
    display:block;
    background-position:-214px -260px;
}

.popalert h3 {
    font-size:24px;
    color:#e6ebf1;
}
.popalert a {
    color:#ccd4dd;
    text-decoration:underline;
}
.popalert .close {
    position:absolute;
    top:5px;
    right:-17px;
    width:17px;
    height:17px;
    background:url(//cdn.joxi.ru/assets/v1/images/icon-close-inverse-sm.png) 0 0 no-repeat;
    text-indent:-9999px;
    opacity: 1;
    filter: alpha(opacity=100);
}