/**
 * @fileOverview: Global Pop Up Specific Definitions
 */

#app-body #popup-wrapper {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    z-index: 999999;
    position: absolute;
    top: 0;
    display: none;
    &.on {
        display: inline-block;
    }
    #popup {
        @include box-shadow(0px, 0px, 4px, 2px, rgba(0, 0, 0, 0.5));
        top: 173px;
        left: 35px;
        background: #fff;
        width: 89%;
        height: 63%;
        position: absolute;
        text-align: center;
        z-index: 9999;
        border-radius: 10px;
        border: 5px solid #fff;
        display: none;
        -webkit-transform: translate3d(15px, 12px, 0);
        &.reset {
            top: 173px !important;
            opacity: 1 !important;
            -webkit-transform: translate3d(15px, 12px, 0);
        }
        .close-button {
            &:before {
                position: absolute;
                padding: 2px;
                border: 3px solid #eeeeee;
                background: $red;
                width: 22px;
                height: 22px;
                right: -15px;
                top: -15px;
                border-radius: 15px;
                font-family: 'FontAwesome';
                content: '\f00d';
                font-size: 1.3em;
                color: #fff;
                @include box-shadow(0px, 0px, 4px, 1px, rgba(0, 0, 0, 0.5));
            }
        }
        .content {
            text-align: left;
            padding: 20px 20px 0px 10px;
            .icon-list {
                .head {
                    padding-top: 5px;
                    font-size: 28px;
                }
            }
            .full {
                margin: 20px auto auto 45px;
                width: 80%;
            }
        }
    } // #popup
} //end of popup-wrapper