cwg-crm
/
cwg_crm_person_front_vu_realse


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
							<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <title>CWG Markets System Maintenance Notice</title>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta name="viewport"
        content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />

    <link rel="stylesheet" href="css/element-ui.css" />

    <style>
        :root {
            --brand-red: #eb3f57;
            --brand-red-dark: #d92f48;
            --brand-red-soft: #fff1f3;
            --text-main: #111827;
            --text-secondary: #4b5563;
            --text-muted: #9ca3af;
            --border: #e5e7eb;
            --card-bg: rgba(255, 255, 255, .96);
            --page-bg: #f5f7fb;
            --radius-xl: 30px;
            --radius-lg: 22px;
            --shadow-card:
                0 24px 70px rgba(17, 24, 39, .08),
                0 6px 20px rgba(17, 24, 39, .05);
        }

        * {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            min-height: 100vh;
            background:
                radial-gradient(circle at top left, rgba(235, 63, 87, .12), transparent 32%),
                radial-gradient(circle at top right, rgba(59, 130, 246, .1), transparent 30%),
                var(--page-bg);
            font-family:
                Inter,
                -apple-system,
                BlinkMacSystemFont,
                "Segoe UI",
                sans-serif;
            color: var(--text-main);
            -webkit-font-smoothing: antialiased;
        }

        img {
            display: block;
            max-width: 100%;
        }

        .container {
            width: 100%;
        }

        .maintenance-page {
            width: 100%;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 32px 20px;
        }

        .maintenance-card {
            width: min(760px, 100%);
            overflow: hidden;
            border-radius: var(--radius-xl);
            border: 1px solid rgba(255, 255, 255, .75);
            background: var(--card-bg);
            backdrop-filter: blur(18px);
            box-shadow: var(--shadow-card);
        }

        .maintenance-header {
            padding: 28px 32px;
            background:
                linear-gradient(135deg,
                    var(--brand-red),
                    var(--brand-red-dark));
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            font-size: 20px;
            font-weight: 800;
            letter-spacing: -.02em;
        }

        .maintenance-body {
            padding: 48px 42px;
            text-align: center;
        }

        .logo-box img {
            width: 180px;
            margin: 0 auto 34px;
        }

        .icon-wrap {
            width: 120px;
            height: 120px;
            margin: 0 auto 28px;
            border-radius: 50%;
            background: var(--brand-red-soft);
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow:
                inset 0 0 0 10px rgba(235, 63, 87, .06),
                0 20px 40px rgba(235, 63, 87, .12);
        }

        .icon-wrap i {
            font-size: 54px;
            color: var(--brand-red);
        }

        .main-title {
            margin: 0;
            font-size: 34px;
            line-height: 1.2;
            font-weight: 850;
            letter-spacing: -.04em;
        }

        .description {
            max-width: 620px;
            margin: 26px auto 0;
            color: var(--text-secondary);
            font-size: 16px;
            line-height: 2;
        }

        .tips-box {
            margin-top: 36px;
            padding: 22px;
            border-radius: var(--radius-lg);
            border: 1px solid var(--border);
            background:
                linear-gradient(180deg,
                    #ffffff 0%,
                    #fafafa 100%);
            text-align: left;
        }

        .tips-title {
            margin: 0 0 14px;
            font-size: 15px;
            font-weight: 800;
        }

        .tips-list {
            margin: 0;
            padding-left: 18px;
        }

        .tips-list li {
            color: var(--text-secondary);
            line-height: 1.9;
            font-size: 14px;
        }

        .footer-note {
            margin-top: 36px;
            color: var(--text-muted);
            font-size: 13px;
        }

        @media (max-width: 768px) {
            .maintenance-page {
                padding: 14px;
                align-items: flex-start;
            }

            .maintenance-card {
                border-radius: 24px;
            }

            .maintenance-header {
                padding: 22px 18px;
                font-size: 18px;
            }

            .maintenance-body {
                padding: 32px 20px;
            }

            .logo-box img {
                width: 150px;
            }

            .icon-wrap {
                width: 96px;
                height: 96px;
            }

            .icon-wrap i {
                font-size: 44px;
            }

            .main-title {
                font-size: 26px;
            }

            .description {
                font-size: 14px;
                line-height: 1.9;
            }

            .tips-box {
                padding: 18px;
            }
        }
    </style>
</head>

<body>

    <div class="container">
        <div class="maintenance-page">

            <div class="maintenance-card">

                <div class="maintenance-header">
                    <i class="el-icon-warning-outline"></i>
                    <span>System Maintenance</span>
                </div>

                <div class="maintenance-body">

                    <div class="logo-box">
                        <img src="img/logo.jpg" alt="Logo" />
                    </div>

                    <div class="icon-wrap">
                        <i class="el-icon-setting"></i>
                    </div>

                    <h1 class="main-title">
                        CWG Markets System Maintenance Notice
                    </h1>

                    <div class="description">
                        To provide you with a better and more stable trading experience,
                        CWG Markets is currently performing scheduled system maintenance.
                        During this period, some services may be temporarily unavailable.
                        We sincerely apologize for any inconvenience caused and appreciate
                        your understanding and continued support.
                    </div>

                    <div class="tips-box">

                        <h3 class="tips-title">
                            During maintenance:
                        </h3>

                        <ul class="tips-list">
                            <li>Login and trading functions may be temporarily unavailable.</li>
                            <li>Some account operations may experience delays.</li>
                            <li>Please avoid submitting repeated requests during the maintenance period.</li>
                            <li>All services will automatically resume once maintenance is completed.</li>
                        </ul>

                    </div>

                    <div class="footer-note">
                        Thank you for your patience and support.
                    </div>

                </div>

            </div>

        </div>
    </div>

</body>

</html>