<style>
    .main_cta img { width: 100%; height: auto !important; }

    /* Reduce Navigation Pattern CSS */
    @media only screen and (max-width: 400px) {
        td[class="nav3"] { display: none; }
    }
    @media only screen and (max-width: 465px) {
        td[class="nav4"] { display: none; }
        td[class="main_nav"] td { padding: 20px !important; }
    }
    @media only screen and (max-width: 500px) {
        td[class="nav5"] { display: none; }
        td[class="main_nav"] td { font-size: 14px !important; }
    }
    @media only screen and (max-width: 599px) {
        td[class="nav6"] { display: none; }
    }
</style>

<table cellpadding="0" cellspacing="0">
    <tr>
        <td class="main_nav" width="600">
            <table cellpadding="0" cellspacing="0" width="100%">
                <tr>
                    <td align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 1</a>
                    </td>
                    <td align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 2</a>
                    </td>
                    <td class="nav3" align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 3</a>
                    </td>
                    <td class="nav4" align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 4</a>
                    </td>
                    <td class="nav5" align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 5</a>
                    </td>
                    <td class="nav6" align="center" style="padding: 15px 10px; font-family: arial,sans-serif; font-size: 12px; font-weight: bold;">
                        <a href="#" style="text-decoration: none; color: #999999;">Navigation 6</a>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td class="main_cta" style="padding-bottom: 10px;">
            <img src="http://placehold.it/600x300&text=Main+CTA" alt="" style="display: block; border: 0;" />
        </td>
    </tr>
</table>