.nc-dialog-overlay {
    position: fixed;
    top: 48px;
    width: 100%;
    height: calc(100% - 48px);
    background: rgba(255,255,255,0.9);
    z-index: 100;
}

.nc-dialog {
    position: absolute;
    display: flex;
    top: 50%;
    left: 50%;
    transform: translate( -50%, -50%);
    width: 90%;
    max-width: 600px;
    min-height: 400px;
    max-height: 90%;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 3px 10px rgba(0,0,0,0.33);
    overflow: hidden;
}

    .nc-dialog i {
        font-family: 'ic2x';
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        display: block;
        margin: 60px 0;
    }

        .nc-dialog i:before {
            font-size: 110px;
        }

        .nc-dialog i#close {
            position: absolute;
            color: rgba(0,0,0,0.6);
            top: 16px;
            right: 16px;
            cursor: pointer;
            transition: 0.3s;
            margin: 0;
            padding: 0;
        }

            .nc-dialog i#close:hover {
                color: rgba(0,0,0,0.8);
            }

            .nc-dialog i#close::before {
                font-size: 20px;
                content: '\61';
                vertical-align: middle;
                display: inline-block;
            }

    .nc-dialog .nc-button {
        margin: 30px 0;
    }

    .nc-dialog .nc-dialog-left {
        width: 35%;
        color: #ffffff;
        text-align: center;
        font-weight: 600;
        font-size: 15px;
        padding: 30px;
    }

        .nc-dialog .nc-dialog-left.red {
            background: linear-gradient(to bottom right, #A82525, #F26262);
        }

        .nc-dialog .nc-dialog-left.blue {
            background: linear-gradient(to bottom right, #003F88, #6286EF);
        }

    .nc-dialog .nc-dialog-right {
        width: 65%;
        text-align: center;
        padding: 20px;
    }

        .nc-dialog .nc-dialog-right h2 {
            display: block;
            color: #C3C3C3;
            font-size: 15px;
            margin: 0;
            text-align: left;
            font-weight: 600;
        }

        .nc-dialog .nc-dialog-right h1 {
            display: inline-block;
            padding: 0 40px;
            font-size: 26px;
            margin: 50px 0 20px;
        }

            .nc-dialog .nc-dialog-right h1.red {
                color: #C33C3C;
            }

            .nc-dialog .nc-dialog-right h1.blue {
                color: #1559A8;
            }

        .nc-dialog .nc-dialog-right p {
            display: inline-block;
            color: #334856;
            font-size: 13px;
            line-height: 20px;
            padding: 0 40px;
            text-align: left;
            width: 100%;
            box-sizing: border-box;
        }

        .nc-dialog .nc-dialog-right a {
            color: #6689F4;
            text-decoration: none;
        }

        .nc-dialog .nc-dialog-right span#number {
            display: inline-block;
            background: #F0F2F4;
            color: #707070;
            border: 1px solid #B9BABB;
            padding: 4px 50px;
            font-size: 15px;
            letter-spacing: 1.5px;
            margin-top: 20px;
        }

@media (max-width: 800px) {
    .nc-dialog {
        flex-direction: column;
    }

        .nc-dialog i {
            margin: 20px 0 30px;
        }

            .nc-dialog i#close {
                color: rgba(255,255,255,0.6);
            }

                .nc-dialog i#close:hover {
                    color: rgba(255,255,255,0.8);
                }

        .nc-dialog .nc-dialog-left, .nc-dialog .nc-dialog-right {
            width: 100%;
            box-sizing: border-box;
        }

        .nc-dialog .nc-dialog-right {
            overflow: auto;
            scrollbar-width: thin;
        }
}