email.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Err_404 Hackathon Sponsorship Invite</title>

    <style type="text/css">
        img {
            max-width: 600px;
            outline: none;
            text-decoration: none;
            -ms-interpolation-mode: bicubic;
        }

        a img {
            border: none;
        }

        table {
            border-collapse: collapse !important;
        }

        #outlook a {
            padding: 0;
        }

        .ReadMsgBody {
            width: 100%;
        }

        .ExternalClass {
            width: 100%;
        }

        .backgroundTable {
            margin: 0 auto;
            padding: 0;
            width: 100% !important;
        }

        table td {
            border-collapse: collapse;
        }

        .ExternalClass * {
            line-height: 115%;
        }

        .container-for-gmail-android {
            min-width: 100%;
        }

        * {
            font-family: 'Roboto', Helvetica, Arial, sans-serif;
        }

        body {
            -webkit-font-smoothing: antialiased;
            -webkit-text-size-adjust: none;
            width: 100% !important;
            margin: 0 !important;
            height: 100%;
            color: #676767;
        }

        td {
            font-family: 'Roboto', Helvetica, Arial, sans-serif;
            font-size: 14px;
            color: #777777;
            text-align: center;
            line-height: 21px;
        }

        a {
            color: #ff6f6f;
            font-weight: bold;
            text-decoration: none !important;
        }

        .pull-left {
            text-align: left;
        }

        .pull-right {
            text-align: right;
        }

        .header-lg,
        .header-md,
        .header-sm {
            font-size: 32px;
            font-weight: 700;
            line-height: normal;
            padding: 35px 0 0;
            color: #4d4d4d;
        }

        .header-md {
            font-size: 24px;
        }

        .header-sm {
            padding: 5px 0;
            font-size: 18px;
            line-height: 1.3;
        }

        .content-padding {
            padding: 5px 0 5px
        }

        .mobile-header-padding-right {
            width: 290px;
            text-align: right;
            padding-right: 20px;
        }

        .mobile-header-padding-left {
            width: 290px;
            text-align: left;
            padding-left: 20px;
        }

        .free-text {
            width: 100% !important;
            padding: 10px 60px 0px;
        }

        .block-rounded {
            border-radius: 5px;
            border: 1px solid #e5e5e5;
            vertical-align: top;
        }

        .button {
            padding: 30px 0 0;
        }

        .info-block {
            padding: 0 20px;
            width: 260px;
        }

        .mini-block-container {
            padding: 30px 5px;
            width: 500px;
        }

        .mini-block {
            background-color: #ffffff;
            width: 498px;
            border: 1px solid #f1f0f0;
            border-radius: 5px;
            padding: 45px 75px;
        }

        .block-rounded {
            width: 260px;
        }

        .info-img {
            width: 258px;
            border-radius: 5px 5px 0 0;
        }

        .force-width-img {
            width: 480px;
            height: 1px !important;
        }

        .force-width-full {
            width: 600px;
            height: 1px !important;
        }

        .user-img img {
            width: 100%;
            border-radius: 5px;
            border: 1px solid #e9e6e6;
        }

        .user-img {
            text-align: center;
            border-radius: 100px;
            color: #ff6f6f;
            font-weight: 700;
        }

        .user-msg {
            padding-top: 10px;
            font-size: 14px;
            text-align: center;
            font-style: italic;
        }

        .mini-img {
            padding: 5px;
            width: 300px;
        }

        .mini-img img {
            border-radius: 5px;
            width: 100%;
        }

        .force-width-gmail {
            min-width: 600px;
            height: 0px !important;
            line-height: 1px !important;
            font-size: 1px !important;
        }

        .mini-imgs {
            padding: 25px 10px 25px;
            justify-content: center;
        }

        .max-imags {
            padding: 20px;
        }
    </style>

    <style type="text/css" media="screen">
        @import url(https://fonts.googleapis.com/css?family=Roboto:400,700);
    </style>

    <style type="text/css" media="screen">
        @media screen {
            * {
                font-family: 'Oxygen', 'Helvetica Neue', 'Arial', 'sans-serif' !important;
            }
        }
    </style>

    <style type="text/css" media="only screen and (max-width: 480px)">
        @media only screen and (max-width: 480px) {

            table[class*="container-for-gmail-android"] {
                min-width: 290px !important;
                width: 100% !important;
            }

            table[class="w320"] {
                width: 100% !important;
            }

            img[class="force-width-gmail"] {
                display: none !important;
                width: 0 !important;
                height: 0 !important;
            }

            td[class*="mobile-header-padding-left"] {
                width: 160px !important;
                padding-left: 20px !important;
            }

            td[class*="mobile-header-padding-right"] {
                width: 160px !important;
                padding-right: 20px !important;
            }

            td[class="mobile-block"] {
                display: block !important;
            }

            td[class="mini-img"],
            td[class="mini-img"] img {
                width: 150px !important;
            }

            td[class="header-lg"] {
                font-size: 24px !important;
                padding-bottom: 5px !important;
            }

            td[class="header-md"] {
                font-size: 18px !important;
                padding-bottom: 5px !important;
            }

            td[class="content-padding"] {
                padding: 5px 0 5px !important;
            }

            td[class="button"] {
                padding: 5px !important;
            }

            td[class*="free-text"] {
                padding: 10px 18px 30px !important;
            }

            img[class="force-width-img"],
            img[class="force-width-full"] {
                display: none !important;
            }

            td[class="info-block"] {
                display: block !important;
                width: 280px !important;
                padding-bottom: 40px !important;
            }

            td[class="info-img"],
            img[class="info-img"] {
                width: 278px !important;
            }

            td[class="mini-block-container"] {
                padding: 8px 20px !important;
                width: 280px !important;
            }

            td[class="mini-block"] {
                padding: 20px !important;
            }

            td[class="user-img"] {
                display: block !important;
                text-align: center !important;
                width: 100% !important;
                padding-bottom: 10px;
            }

            td[class="user-msg"] {
                display: block !important;
                padding-bottom: 20px;
            }

        }
    </style>
</head>

<body bgcolor="#f5f5f5">
    <table align="center" cellpadding="0" cellspacing="0" class="container-for-gmail-android" width="100%">

        <td align="left" valign="top" width="100%" style="background-color:#ffffff; padding-top: 10px; padding-bottom: 10px">
            <center>
                <table cellpadding="0" cellspacing="0" width="600" class="w320">
                    <tr>
                        <td width="20%" class="pull-left mobile-header-padding-left" style="vertical-align: middle;">
                            <img width="60" height="60" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/Mhsscoe_3.png/200px-Mhsscoe_3.png"
                                alt="logo">
                        </td>

                        <td class="header-sm" width="60%" style="text-align: center">
                            <h3>ERR_404 2.0 Hackathon</h3>
                        </td>

                        <td width="20%" class="pull-right mobile-header-padding-right" style="vertical-align: middle;">
                            <img width="60" height="60" src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/PC-Logo.png"
                                alt="logo">
                        </td>

                    </tr>
                </table>
            </center>
        </td>
        </tr>

        <tr>
            <td align="center" valign="top" width="100%" class="content-padding">
                <center>
                    <table cellspacing="0" cellpadding="0" width="600" class="w320">
                        <tr>
                            <td class="free-text">
                                Having trouble loading this page? Click <a href="https://theprogrammersclub.github.io/email">here</a>
                            </td>
                        </tr>
                        <tr>
                            <td class="header-lg">
                                You've received an invitation!
                            </td>
                        </tr>
                        <tr>
                            <td class="free-text">
                                <h4> <strong> Respected Sir/Ma’am,</strong></h4> We at <strong>M.H. Saboo Siddik
                                    College of Engineering
                                    (affiliated to University of Mumbai)</strong>, are glad to inform you that our
                                institution is
                                organizing ERR_404 2.0, a non-stop 24-Hour State Level Hackathon, an annual event in
                                its campus in
                                association with Computer Society of India on the<strong> 16<sup>th</sup> & 17<sup>th</sup>
                                    of March, 2019.</strong>
                            </td>
                        </tr>
                        <tr>
                            <td class="mini-block-container">
                                <table cellspacing="0" cellpadding="0" width="100%" style="border-collapse:separate !important;">
                                    <tr>
                                        <td class="mini-block">
                                            <table cellpadding="0" cellspacing="0" width="100%">
                                                <tr>
                                                    <td>
                                                        <table cellspacing="0" cellpadding="0" width="100%">
                                                            <tr>
                                                                <td class="user-img">
                                                                    <img class="user-img" src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/poster-min.jpg"
                                                                        alt="poster" />
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td>
                                                                    <br>
                                                                    The event will witness an overall participation
                                                                    of 80+ teams, with over 300+
                                                                    contestants from renowned educational institutions
                                                                    including the likes of IIT-Mumbai,
                                                                    VJTI, SPIT, KJSCE, TSEC, SAKEC, JSCOE-Pune and many
                                                                    more.
                                                                </td>
                                                            </tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="button">
                                                        <div>
                                                            <a href="https://github.com/TheProgrammersClub/ERR_404_2.0/raw/master/hack/Brochure_new_min.pdf"
                                                                style="background-color:#ff6f6f;border-radius:5px;color:#ffffff;display:inline-block;font-family:'Cabin', Helvetica, Arial, sans-serif;font-size:14px;font-weight:regular;line-height:45px;text-align:center;text-decoration:none;width:155px;-webkit-text-size-adjust:none;mso-hide:all;">Download
                                                                Brochure</a></div>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </center>
            </td>
        </tr>

        <tr>
            <td align="center" valign="top" width="100%" class="content-padding">
                <center>
                    <table cellspacing="0" cellpadding="0" width="600" class="w320">
                        <tr>
                            <td class="header-lg">
                                We would love to have you on Board with us!
                            </td>
                        </tr>
                        <tr>
                            <td class="free-text">
                                There will be social media coverage through our YouTube channel with an expected count
                                of 1000+
                                viewers and
                                over 500+ subscribers, initially, along with promotions on our Twitter, Instagram and
                                Facebook, over a
                                span of
                                8 days which includes 3 days pre-event coverage, live on ground event coverage for 2
                                days, and 3 days
                                of post
                                event coverage with various press releases.
                            </td>
                        </tr>
                    </table>
                </center>
            </td>
        </tr>





        <tr>
            <td class="mini-imags content-padding">
                <center>
                    <table cellpadding="0" cellspacing="0" width="0" style="border-collapse:separate !important;">
                        <tr>
                            <td class="mobile-block">
                                <table cellspacing="0" cellpadding="0" width="100%" style="border-collapse:separate !important;">
                                    <tr>
                                        <td>
                                            <img src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/sponsorship.png"
                                                alt="product" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>

                </center>
            </td>
        </tr>

        <tr>
            <td align="center" valign="top" width="100%">
                <center>
                    <table cellpadding="0" cellspacing="0" width="600" class="w320">
                        <tr>
                            <td class="header-md" style="text-align:center;">
                                Look back at previous ERR_404 Hackathon!
                            </td>
                        </tr>


                        <tr>
                            <td class="mini-imgs">
                                <table cellpadding="0" cellspacing="0" width="0" style="border-collapse:separate !important;">
                                    <tr>
                                        <td class="mobile-block">
                                            <table cellspacing="0" cellpadding="0" width="100%" style="border-collapse:separate !important;">
                                                <tr>
                                                    <td class="mini-img">
                                                        <a href="#"><img src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/1st-min.jpg"
                                                                alt="img1" /></a>
                                                    </td>
                                                    <td class="mini-img">
                                                        <a href="#"><img src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/3rd-min.jpg"
                                                                alt="product" /></a>
                                                    </td>
                                                    <td class="mini-img">
                                                        <a href="#"><img src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/IMG%20(8)-min.JPG"
                                                                alt="product" /></a>
                                                    </td>
                                                    <td class="mini-img">
                                                        <a href="#"><img src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/IMG%20(9)-min.JPG"
                                                                alt="product" /></a>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>


                        <tr>
                            <td align="center" valign="top" width="100%" class="content-padding">
                                <center>
                                    <table cellspacing="0" cellpadding="0" width="600" class="w320">
                                        <tr>
                                            <td class="free-text">
                                                <h3>The event aims at</h3>
                                                Integrating and working on various domains of <strong>Machine Learning</strong>,
                                                <strong>Big
                                                    Data</strong>, <strong>Block Chain</strong>, <strong>Computer
                                                    Vision</strong> and <strong>Network & Security</strong> etc.
                                                <br>
                                                Get a productive and useful result for the prevailing technical
                                                challenges.
                                                <br>
                                                <br>
                                                In order to enhance the growth in technology, we request you to extend
                                                your kind support in the form of Affiliation/Sponsorship/Mentorship for
                                                the event. Your esteemed contribution to this technical event will help
                                                our initiative and further create an opportunity to bring up the spirit
                                                from the youth to promote technological innovation in order to make a
                                                good society.
                                                <br><br>
                                                We look forward to hearing from you. It will be an honor and privilege
                                                to affiliate with you
                                                towards the success of this event in the best possible way. Please find
                                                the attached copy of
                                                letterhead copy and poster
                                                of the event with relevant details.
                                            </td>
                                        </tr>

                                        <tr>
                                            <td align="center" valign="top" width="100%" height: 100px;">
                                                <center>
                                                    <table cellspacing="0" cellpadding="0" width="600" class="w320">
                                                        <tr>
                                                            <td style="padding: 25px 0 25px">
                                                                <strong>M.H. Saboo Siddik College of Engineering</strong><br />
                                                                <strong> Err_404 State level Hackathon </strong><br />
                                                                <strong> Programmer's Club</strong> <br /><br />
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </center>
                                            </td>
                                        </tr>

                                        <tr>
                                            <td align="center" valign="top" width="100%">
                                                <center>
                                                    <table cellspacing="0" cellpadding="0" width="600" class="w320">

                                                        <a href="https://www.facebook.com/err404mhss" target="_blank">
                                                            <img width="24px" height="24px" src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/iconfinder_facebook_1807546.png"
                                                                alt="Facebook">
                                                        </a>
                                                        <a href="https://www.instagram.com/err404hackathon" target="_blank"><img
                                                                width="24px" style="margin-left:20px; margin-right:20px"
                                                                height="24px" src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/iconfinder_Instagram_1298747.png"
                                                                alt="Instagram"></a>
                                                        <a href="https://twitter.com/err404hackathon" target="_blank"><img
                                                                width="24px" height="24px" src="https://raw.githubusercontent.com/TheProgrammersClub/ERR_404_2.0/master/hack/iconfinder_twitter_252077.png"
                                                                alt="Twitter"></a>

                                                    </table>
                                                </center>
                                            </td>
                                        </tr>
                                    </table>
                                </center>
                            </td>
                        </tr>



                    </table>
                </center>
            </td>
        </tr>
    </table>


</body>

</html>