.sweet-overlay {
    background-color:rgba(0,0,0,.4);
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    display:none;
    z-index:1000
}
.sweet-alert {
    background-color:#fff;
    font-family:open sans,sans-serif;
    width:478px;
    padding:17px;
    border-radius:5px;
    text-align:center;
    position:fixed;
    left:50%;
    top:50%;
    margin-left:-256px;
    margin-top:-200px;
    overflow:hidden;
    display:none;
    z-index:2000
}
@media all and (max-width:540px) {
    .sweet-alert {
        width:auto;
        margin-left:0;
        margin-right:0;
        left:15px;
        right:15px
    }
}
.sweet-alert h2 {
    color:#575757;
    font-size:30px;
    text-align:center;
    font-weight:600;
    text-transform:none;
    position:relative;
    margin:25px 0;
    padding:0;
    line-height:25px;
    display:block
}
.sweet-alert p {
    color:#797979;
    font-size:16px;
    text-align:center;
    font-weight:300;
    position:relative;
    margin:0;
    padding:0;
    line-height:normal
}
.sweet-alert button {
    background-color:#aedef4;
    color:#fff;
    border:0;
    box-shadow:none;
    font-size:17px;
    font-weight:500;
    border-radius:5px;
    padding:10px 32px;
    margin:26px 5px 0;
    cursor:pointer
}
.sweet-alert button:focus {
    outline:0;
    box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)
}
.sweet-alert button:hover {
    background-color:#a1d9f2
}
.sweet-alert button:active {
    background-color:#81ccee
}
.sweet-alert button.cancel {
    background-color:#d0d0d0
}
.sweet-alert button.cancel:hover {
    background-color:#c8c8c8
}
.sweet-alert button.cancel:active {
    background-color:#b6b6b6
}
.sweet-alert button.cancel:focus {
    box-shadow:rgba(197,205,211,.8) 0 0 2px,rgba(0,0,0,.0470588) 0 0 0 1px inset!important
}
.sweet-alert button::-moz-focus-inner {
    border:0
}
.sweet-alert[data-has-cancel-button=false] button {
    box-shadow:none!important
}
.sweet-alert .icon {
    width:80px;
    height:80px;
    border:4px solid gray;
    border-radius:50%;
    margin:20px auto;
    padding:0;
    position:relative;
    box-sizing:content-box
}
.sweet-alert .icon.error {
    border-color:#f27474
}
.sweet-alert .icon.error .x-mark {
    position:relative;
    display:block
}
.sweet-alert .icon.error .line {
    position:absolute;
    height:5px;
    width:47px;
    background-color:#f27474;
    display:block;
    top:37px;
    border-radius:2px
}
.sweet-alert .icon.error .line.left {
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    left:17px
}
.sweet-alert .icon.error .line.right {
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    right:16px
}
.sweet-alert .icon.warning {
    border-color:#f8bb86
}
.sweet-alert .icon.warning .body {
    position:absolute;
    width:5px;
    height:47px;
    left:50%;
    top:10px;
    border-radius:2px;
    margin-left:-2px;
    background-color:#f8bb86
}
.sweet-alert .icon.warning .dot {
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    margin-left:-3px;
    left:50%;
    bottom:10px;
    background-color:#f8bb86
}
.sweet-alert .icon.info {
    border-color:#c9dae1
}
.sweet-alert .icon.info::before {
    content:"";
    position:absolute;
    width:5px;
    height:29px;
    left:50%;
    bottom:17px;
    border-radius:2px;
    margin-left:-2px;
    background-color:#c9dae1
}
.sweet-alert .icon.info::after {
    content:"";
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    margin-left:-3px;
    top:19px;
    background-color:#c9dae1
}
.sweet-alert .icon.success {
    border-color:#a5dc86
}
.sweet-alert .icon.success::before,
.sweet-alert .icon.success::after {
    content:'';
    border-radius:50%;
    position:absolute;
    width:60px;
    height:120px;
    background:#fff;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
}
.sweet-alert .icon.success::before {
    border-radius:120px 0 0 120px;
    top:-7px;
    left:-33px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    -webkit-transform-origin:60px 60px;
    transform-origin:60px 60px
}
.sweet-alert .icon.success::after {
    border-radius:0 120px 120px 0;
    top:-11px;
    left:30px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    -webkit-transform-origin:0 60px;
    transform-origin:0 60px
}
.sweet-alert .icon.success .placeholder {
    width:80px;
    height:80px;
    border:4px solid rgba(165,220,134,.2);
    border-radius:50%;
    box-sizing:content-box;
    position:absolute;
    left:-4px;
    top:-4px;
    z-index:2
}
.sweet-alert .icon.success .fix {
    width:5px;
    height:90px;
    background-color:#fff;
    position:absolute;
    left:28px;
    top:8px;
    z-index:1;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
}
.sweet-alert .icon.success .line {
    height:5px;
    background-color:#a5dc86;
    display:block;
    border-radius:2px;
    position:absolute;
    z-index:2
}
.sweet-alert .icon.success .line.tip {
    width:25px;
    left:14px;
    top:46px;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
}
.sweet-alert .icon.success .line.long {
    width:47px;
    right:8px;
    top:38px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
}
.sweet-alert .icon.custom {
    background-size:contain;
    border-radius:0;
    border:0;
    background-position:center center;
    background-repeat:no-repeat
}
@-webkit-keyframes showSweetAlert {
    0% {
        transform:scale(.7);
        -webkit-transform:scale(.7)
    }
    45% {
        transform:scale(1.05);
        -webkit-transform:scale(1.05)
    }
    80% {
        transform:scale(.95);
        -webkit-tranform:scale(.95)
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}
@-moz-keyframes showSweetAlert {
    0% {
        transform:scale(.7);
        -webkit-transform:scale(.7)
    }
    45% {
        transform:scale(1.05);
        -webkit-transform:scale(1.05)
    }
    80% {
        transform:scale(.95);
        -webkit-tranform:scale(.95)
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}
@keyframes showSweetAlert {
    0% {
        transform:scale(.7);
        -webkit-transform:scale(.7)
    }
    45% {
        transform:scale(1.05);
        -webkit-transform:scale(1.05)
    }
    80% {
        transform:scale(.95);
        -webkit-tranform:scale(.95)
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}
@-webkit-keyframes hideSweetAlert {
    0% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
    100% {
        transform:scale(.5);
        -webkit-transform:scale(.5)
    }
}
@-moz-keyframes hideSweetAlert {
    0% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
    100% {
        transform:scale(.5);
        -webkit-transform:scale(.5)
    }
}
@keyframes hideSweetAlert {
    0% {
        transform:scale(1);
        -webkit-transform:scale(1)
    }
    100% {
        transform:scale(.5);
        -webkit-transform:scale(.5)
    }
}
.showSweetAlert {
    -webkit-animation:showSweetAlert .3s;
    -moz-animation:showSweetAlert .3s;
    animation:showSweetAlert .3s
}
.hideSweetAlert {
    -webkit-animation:hideSweetAlert .2s;
    -moz-animation:hideSweetAlert .2s;
    animation:hideSweetAlert .2s
}
@-webkit-keyframes animateSuccessTip {
    0% {
        width:0;
        left:1px;
        top:19px
    }
    54% {
        width:0;
        left:1px;
        top:19px
    }
    70% {
        width:50px;
        left:-8px;
        top:37px
    }
    84% {
        width:17px;
        left:21px;
        top:48px
    }
    100% {
        width:25px;
        left:14px;
        top:45px
    }
}
@-moz-keyframes animateSuccessTip {
    0% {
        width:0;
        left:1px;
        top:19px
    }
    54% {
        width:0;
        left:1px;
        top:19px
    }
    70% {
        width:50px;
        left:-8px;
        top:37px
    }
    84% {
        width:17px;
        left:21px;
        top:48px
    }
    100% {
        width:25px;
        left:14px;
        top:45px
    }
}
@keyframes animateSuccessTip {
    0% {
        width:0;
        left:1px;
        top:19px
    }
    54% {
        width:0;
        left:1px;
        top:19px
    }
    70% {
        width:50px;
        left:-8px;
        top:37px
    }
    84% {
        width:17px;
        left:21px;
        top:48px
    }
    100% {
        width:25px;
        left:14px;
        top:45px
    }
}
@-webkit-keyframes animateSuccessLong {
    0% {
        width:0;
        right:46px;
        top:54px
    }
    65% {
        width:0;
        right:46px;
        top:54px
    }
    84% {
        width:55px;
        right:0;
        top:35px
    }
    100% {
        width:47px;
        right:8px;
        top:38px
    }
}
@-moz-keyframes animateSuccessLong {
    0% {
        width:0;
        right:46px;
        top:54px
    }
    65% {
        width:0;
        right:46px;
        top:54px
    }
    84% {
        width:55px;
        right:0;
        top:35px
    }
    100% {
        width:47px;
        right:8px;
        top:38px
    }
}
@keyframes animateSuccessLong {
    0% {
        width:0;
        right:46px;
        top:54px
    }
    65% {
        width:0;
        right:46px;
        top:54px
    }
    84% {
        width:55px;
        right:0;
        top:35px
    }
    100% {
        width:47px;
        right:8px;
        top:38px
    }
}
@-webkit-keyframes rotatePlaceholder {
    0% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    5% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    12% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
    100% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
}
@-moz-keyframes rotatePlaceholder {
    0% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    5% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    12% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
    100% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
}
@keyframes rotatePlaceholder {
    0% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    5% {
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    12% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
    100% {
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
}
.animateSuccessTip {
    -webkit-animation:animateSuccessTip .75s;
    -moz-animation:animateSuccessTip .75s;
    animation:animateSuccessTip .75s
}
.animateSuccessLong {
    -webkit-animation:animateSuccessLong .75s;
    -moz-animation:animateSuccessLong .75s;
    animation:animateSuccessLong .75s
}
.icon.success.animate::after {
    -webkit-animation:rotatePlaceholder 4.25s ease-in;
    -moz-animation:rotatePlaceholder 4.25s ease-in;
    animation:rotatePlaceholder 4.25s ease-in
}
@-webkit-keyframes animateErrorIcon {
    0% {
        transform:rotateX(100deg);
        -webkit-transform:rotateX(100deg);
        opacity:0
    }
    100% {
        transform:rotateX(0deg);
        -webkit-transform:rotateX(0deg);
        opacity:1
    }
}
@-moz-keyframes animateErrorIcon {
    0% {
        transform:rotateX(100deg);
        -webkit-transform:rotateX(100deg);
        opacity:0
    }
    100% {
        transform:rotateX(0deg);
        -webkit-transform:rotateX(0deg);
        opacity:1
    }
}
@keyframes animateErrorIcon {
    0% {
        transform:rotateX(100deg);
        -webkit-transform:rotateX(100deg);
        opacity:0
    }
    100% {
        transform:rotateX(0deg);
        -webkit-transform:rotateX(0deg);
        opacity:1
    }
}
.animateErrorIcon {
    -webkit-animation:animateErrorIcon .5s;
    -moz-animation:animateErrorIcon .5s;
    animation:animateErrorIcon .5s
}
@-webkit-keyframes animateXMark {
    0% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    50% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    80% {
        transform:scale(1.15);
        -webkit-transform:scale(1.15);
        margin-top:-6px
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1);
        margin-top:0;
        opacity:1
    }
}
@-moz-keyframes animateXMark {
    0% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    50% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    80% {
        transform:scale(1.15);
        -webkit-transform:scale(1.15);
        margin-top:-6px
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1);
        margin-top:0;
        opacity:1
    }
}
@keyframes animateXMark {
    0% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    50% {
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    80% {
        transform:scale(1.15);
        -webkit-transform:scale(1.15);
        margin-top:-6px
    }
    100% {
        transform:scale(1);
        -webkit-transform:scale(1);
        margin-top:0;
        opacity:1
    }
}
.animateXMark {
    -webkit-animation:animateXMark .5s;
    -moz-animation:animateXMark .5s;
    animation:animateXMark .5s
}
@-webkit-keyframes pulseWarning {
    0% {
        border-color:#f8d486
    }
    100% {
        border-color:#f8bb86
    }
}
@-moz-keyframes pulseWarning {
    0% {
        border-color:#f8d486
    }
    100% {
        border-color:#f8bb86
    }
}
@keyframes pulseWarning {
    0% {
        border-color:#f8d486
    }
    100% {
        border-color:#f8bb86
    }
}
.pulseWarning {
    -webkit-animation:pulseWarning .75s infinite alternate;
    -moz-animation:pulseWarning .75s infinite alternate;
    animation:pulseWarning .75s infinite alternate
}
@-webkit-keyframes pulseWarningIns {
    0% {
        background-color:#f8d486
    }
    100% {
        background-color:#f8bb86
    }
}
@-moz-keyframes pulseWarningIns {
    0% {
        background-color:#f8d486
    }
    100% {
        background-color:#f8bb86
    }
}
@keyframes pulseWarningIns {
    0% {
        background-color:#f8d486
    }
    100% {
        background-color:#f8bb86
    }
}
.pulseWarningIns {
    -webkit-animation:pulseWarningIns .75s infinite alternate;
    -moz-animation:pulseWarningIns .75s infinite alternate;
    animation:pulseWarningIns .75s infinite alternate
}
