<!DOCTYPE html>
        <html>
        <head>
            <style>
                html, body {
                    margin: 0;
                    padding: 0;
                    width: 100%;
                    font-family: 'Montserrat', sans-serif;
                }
                
                body {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    flex-direction: column;
                    text-align: center;
                }
                
                .main-content {
                    width: 100%;
                    max-width: 600px;
                    margin: 0 auto;
                    text-align: center;
                }
                
                .title {
                    color: #2a5885;
                    font-size: 16px;
                    margin: 15px 0;
                    font-weight: 600;
                    text-align: center;
                    width: 100%;
                }
                
                .message {
                    font-size: 12px;
                    margin: 0 auto 15px auto;
                    text-align: center;
                    max-width: 450px;
                }
                
                .data-table {
                    width: 400px;
                    margin: 0 auto;
                    border-collapse: collapse;
                    border-spacing: 0;
                    text-align: left; /* La tabla en sí está alineada a la izquierda */
                }
                
                .data-table th, .data-table td {
                    text-align: left;
                    padding: 4px 6px;
                    font-size: 12px;
                    line-height: 1.2;
                    vertical-align: middle;
                }
                
                .data-table th {
                    background-color: #f2f2f2;
                    width: 40%;
                    font-weight: 600;
                }
                
                p {
                    font-size: 12px;
                    margin-bottom: 8px;
                    text-align: center; /* Centra el título */
                }
                
                .data-table td {
                    width: 60%;
                }
                
                .data-table tr {
                    height: auto;
                }
                
                .footer {
                    font-size: 10px;
                    color: #777;
                    margin: 15px auto;
                    text-align: center;
                    width: 100%;
                }
                
                .color1 {
                    background-color: rgb(192, 197, 228);
                }
                
                .color2 {
                    background-color: rgb(238, 238, 241);
                }
            </style>
        </head>
        <body>
            <div class="container">
                <h2>Nueva solicitud de alta de empleado </h2>
                <p>Se ha registrado un nuevo usuario en la plataforma de elephant.  Por favor, revise la información .</p>
                <!--
                    Distribuidor en México 
                    Distribuidor en Estados Unidos
                    Distribuidor en Canadá
                    Cliente en México
                    Cliente en el extranjero    
                -->
                <table>
                    <tr>
                        <th style="text-align: left;">ID de Solicitud</th>
                        <td class="color1" style="text-align: left;">15</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Tipo de Solicitud</th>
                        <td class="color2" style="text-align: left;">EMPLEADO</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Nombre</th>
                        <td class="color1" style="text-align: left;">Carlos Velazquez Miranda</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Correo Electrónico</th>
                        <td class="color2" style="text-align: left;">car@gmail.com</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Teléfono</th>
                        <td class="color1" style="text-align: left;">2311082599</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Número de Empleado</th>
                        <td class="color2" style="text-align: left;">123</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">Compañía</th>
                        <td class="color1" style="text-align: left;">IGSA</td>
                    </tr>
                    <tr>
                        <th style="text-align: left;">División</th>
                        <td class="color2" style="text-align: left;">OPER</td>
                    </tr>
                    
                    <tr>
                        <th style="text-align: left;">Puesto</th>
                        <td class="color1" style="text-align: left;">Ventas</td>
                    </tr>



                </table>
                
                
                <div class="footer">
                    <p>Este es un correo automático. Por favor no responda a este mensaje.</p>
                </div>
            </div>
        </body>
        </html>