Email Template Style

{% set email_width = "600px" %}
{% set email_background = "#f6f6f6" %}
{% set email_body_background = "#ffffff" %}
{% set sans_serif = "'Helvetica Neue', Helvetica, Arial, sans-serif" %}
{% set base_color = "#606060" %}
{% set base_link_color = "#3863A0" %}
{% set base_font_size = "14px" %}
{% set base_Line_height = "160%" %}
{% set heading_font_family = "'Helvetica Neue', Helvetica, Arial, sans-serif" %}
{% set heading_font_weight = "bold" %}
{% set heading_Line_height = "100%" %}

<!--[if !mso]><!-->
<!-- Add Google / custom fonts here -->
<!--<![endif]-->

<style>
   
    [style*="sans-serif"] {
        font-family: {{ sans_serif }} !important;
    }
    *{
        box-sizing:border-box!important;
    -webkit-box-sizing:border-box!important;
        -webkit-font-smoothing: antialiased !important;
    }
    td .bodyCell td.bodyCell,
    table#contentTableOuter{
        padding:0!important;
    }
    table#contentTableOuter{
        -webkit-box-shadow: none !important;
        border: none !important;
    }
    td#responsive-group{
       -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        background:{{ email_body_background }} !important;
    }
    .logo{
        background:{{ email_background }}!important;
    }
    table#templateTable,
    td#contentCell,
    table#contentTableOuter{
        background:transparent!important;
        border:none!important;
        border-bottom: none!important;
        padding:0!important;
    }
    table#backgroundTable,
    body{
        background:{{ email_background }} !important;
    }
   
    table#templateTable{
        max-width:{{ email_width }} !important;
width:{{ email_width }} !important;
    }
    body,p{
        font-family: {{ sans_serif }} !important;
        color:{{ base_color }} !important;
        font-size: {{base_font_size}} !important;
        line-height: {{base_Line_height}} !important;
    }
    a{
        color:{{ base_link_color }};
        text-decoration: underline;
    }
    p{}

    h1,h2,h3,h4,h5,h6 {
        margin: 0 0 20px;
        font-weight: {{ heading_font_weight }} ;
        font-family: {{ heading_font_family }} ;
        line-height: {{ heading_Line_height }} ;
    }
    h1 {}
    h2 {}
    h3 {}
    h4 {}
 
    /* =========================================
       ========== Responsive Css ===============
    ============================================*/
    @media only screen and (max-width: 600px) {
        table[id="contentTableInner"],
        table#templateTable,
        table.contenttable,
        table[width="600"]{
            max-width: 100% !important;
            width: 100% !important;
            table-layout: fixed !important;
        }
        *{
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
        }
        table#templateTable{
    max-width:100% !important;
    width:100% !important;
        }
        table {
            border: none !important;
            padding: 0 !important;
            width: 100% !important;
            table-layout: fixed !important;
        }
        .responsive td.column,
        .widget-span.widget-type-email_can_spam table td{
            display:block !important;
            width:100% !important;
            max-width:100% !important;
            margin:0 auto !important;
        }
        table {
            border: none !important;
            padding: 0 !important;
            width: 100% !important;
            table-layout: fixed !important;
            margin:0 !important;
            display:block !important;
        }
        table td,
        table tbody{
            display:block !important;
            width:100% !important;
            max-width:100% !important;
            margin:0 auto !important;
        }
        tbody tr {
            display:  block;
            width:  100%;
        }
       
     
    }
</style>