/*CLIENT-SPECIFIC STYLES */
#outlook a{padding:0;} /* Force Outlook to provide a "view in browser" message */
.ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing */
body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} /* Prevent WebKit and Windows mobile changing default text sizes */
table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up */
img{-ms-interpolation-mode:bicubic;} /* Allow smoother rendering of resized image in Internet Explorer */

/* TEMPLATE STYLES */

/* ========== Page Styles ========== */

#bodyCell{padding:20px;}

/**
* @tab Page
* @section background style
* @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
* @theme page
*/
#bodyTable{
    /*@editable*/ background-color:#EFEFEF;
}

/**
* @tab Page
* @section background style
* @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
* @theme page
*/
#bodyCell{

}

/**
* @tab Page
* @section email border
* @tip Set the border for your email.
*/
#templateContainer{
    width:600px;
    /*@editable*/ border:0px solid #BBBBBB;
    /*@editable*/ background-color:#FFFFFF;
}

/**
* @tab Page
* @section heading 1
* @tip Set the styling for all first-level headings in your emails. These should be the largest of your headings.
* @style heading 1
*/
h1{
    display:block;
    /*@editable*/ color:#202020 !important;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:26px;
    /*@editable*/ font-style:normal;
    /*@editable*/ font-weight:600;
    /*@editable*/ line-height:100%;
    /*@editable*/ letter-spacing:normal;
    margin-top:0;
    margin-right:0;
    margin-bottom:10px;
    margin-left:0;
    /*@editable*/ text-align:left;
}

/**
* @tab Page
* @section heading 2
* @tip Set the styling for all second-level headings in your emails.
* @style heading 2
*/
h2{
    display:block;
    /*@editable*/ color:#404040 !important;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:20px;
    /*@editable*/ font-style:normal;
    /*@editable*/ font-weight:600;
    /*@editable*/ line-height:100%;
    /*@editable*/ letter-spacing:normal;
    margin-top:0;
    margin-right:0;
    margin-bottom:10px;
    margin-left:0;
    /*@editable*/ text-align:left;
}

/**
* @tab Page
* @section heading 3
* @tip Set the styling for all third-level headings in your emails.
* @style heading 3
*/
h3{
    display:block;
    /*@editable*/ color:#202020 !important;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:16px;
    /*@editable*/ font-style:italic;
    /*@editable*/ font-weight:600;
    /*@editable*/ line-height:100%;
    /*@editable*/ letter-spacing:normal;
    margin-top:0;
    margin-right:0;
    margin-bottom:10px;
    margin-left:0;
    /*@editable*/ text-align:left;
}

/**
* @tab Page
* @section heading 4
* @tip Set the styling for all fourth-level headings in your emails. These should be the smallest of your headings.
* @style heading 4
*/
h4{
    display:block;
    /*@editable*/ color:#808080 !important;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:14px;
    /*@editable*/ font-style:italic;
    /*@editable*/ font-weight:normal;
    /*@editable*/ line-height:100%;
    /*@editable*/ letter-spacing:normal;
    margin-top:0;
    margin-right:0;
    margin-bottom:10px;
    margin-left:0;
    /*@editable*/ text-align:center;
}

.link-newsletter {
    font-size: 22px;
    text-align: center;
}
a.linkEmail {
    color: #0582FF;
    text-decoration: none;
}

/* ========== Header Styles ========== */

/**
* @tab Header
* @section header style
* @tip Set the background color and borders for your email's header area.
* @theme header
*/
#templateHeader{
    /*@editable*/ background-color:#FFFFFF;
    /*@editable*/ border-top:1px solid #FFFFFF;
    /*@editable*/ border-bottom:1px solid #CCCCCC;
}

/**
* @tab Header
* @section header text
* @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
*/
.headerContent{
    /*@editable*/ color:#505050;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:20px;
    /*@editable*/ font-weight:bold;
    /*@editable*/ line-height:100%;
    /*@editable*/ padding-top:0;
    /*@editable*/ padding-right:0;
    /*@editable*/ padding-bottom:0;
    /*@editable*/ padding-left:0;
    /*@editable*/ text-align:left;
    /*@editable*/ vertical-align:middle;
}

/**
* @tab Header
* @section header link
* @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
*/
.headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
    /*@editable*/ color:#EB4102;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

.headerImage{
    height:auto;
    max-width:600px;
}

/* ========== Body Styles ========== */

/**
* @tab Body
* @section body style
* @tip Set the background color and borders for your email's body area.
*/
#templateBody{
    /*@editable*/ background-color:#FFFFFF;
    /*@editable*/ border-top:1px solid #FFFFFF;
    /*@editable*/ border-bottom:1px solid #CCCCCC;
}

/**
* @tab Body
* @section body text
* @tip Set the styling for your email's main content text. Choose a size and color that is easy to read.
* @theme main
*/
.bodyContent{
    /*@editable*/ color:#505050;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:16px;
    /*@editable*/ line-height:150%;
    padding-top:20px;
    padding-right:20px;
    padding-bottom:20px;
    padding-left:20px;
    /*@editable*/ text-align:left;
}

/**
* @tab Body
* @section body link
* @tip Set the styling for your email's main content links. Choose a color that helps them stand out from your text.
*/
.bodyContent a:link, .bodyContent a:visited, /* Yahoo! Mail Override */ .bodyContent a .yshortcuts /* Yahoo! Mail Override */{
    /*@editable*/ color:#EB4102;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

.bodyContent img{
    display:inline;
    height:auto;
    max-width:560px;
}

/* ========== Column Styles ========== */

.templateColumnContainer{width:200px;}

/**
* @tab Columns
* @section column style
* @tip Set the background color and borders for your email's column area.
*/
#templateColumns{
    /*@editable*/ background-color:#FFFFFF;
    /*@editable*/ border-top:1px solid #FFFFFF;
    /*@editable*/ border-bottom:0px solid #CCCCCC;
}

/**
* @tab Columns
* @section left column text
* @tip Set the styling for your email's left column content text. Choose a size and color that is easy to read.
*/
.leftColumnContent{
    /*@editable*/ color:#505050;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:14px;
    /*@editable*/ line-height:150%;
    padding-top:0;
    padding-right:20px;
    padding-bottom:20px;
    padding-left:20px;
    /*@editable*/ text-align:left;
}

/**
* @tab Columns
* @section left column link
* @tip Set the styling for your email's left column content links. Choose a color that helps them stand out from your text.
*/
.leftColumnContent a:link, .leftColumnContent a:visited, /* Yahoo! Mail Override */ .leftColumnContent a .yshortcuts /* Yahoo! Mail Override */{
    /*@editable*/ color:#EB4102;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

/**
* @tab Columns
* @section center column text
* @tip Set the styling for your email's center column content text. Choose a size and color that is easy to read.
*/
.centerColumnContent{
    /*@editable*/ color:#505050;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:14px;
    /*@editable*/ line-height:150%;
    padding-top:0;
    padding-right:20px;
    padding-bottom:20px;
    padding-left:20px;
    /*@editable*/ text-align:left;
}

/**
* @tab Columns
* @section center column link
* @tip Set the styling for your email's center column content links. Choose a color that helps them stand out from your text.
*/
.centerColumnContent a:link, .centerColumnContent a:visited, /* Yahoo! Mail Override */ .centerColumnContent a .yshortcuts /* Yahoo! Mail Override */{
    /*@editable*/ color:#EB4102;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

/**
* @tab Columns
* @section right column text
* @tip Set the styling for your email's right column content text. Choose a size and color that is easy to read.
*/
.rightColumnContent{
    /*@editable*/ color:#505050;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:14px;
    /*@editable*/ line-height:150%;
    padding-top:0;
    padding-right:20px;
    padding-bottom:20px;
    padding-left:20px;
    /*@editable*/ text-align:left;
}

/**
* @tab Columns
* @section right column link
* @tip Set the styling for your email's right column content links. Choose a color that helps them stand out from your text.
*/
.rightColumnContent a:link, .rightColumnContent a:visited, /* Yahoo! Mail Override */ .rightColumnContent a .yshortcuts /* Yahoo! Mail Override */{
    /*@editable*/ color:#EB4102;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

.leftColumnContent img, .rightColumnContent img{
    display:inline;
    height:auto;
    max-width:260px;
}

/* ========== Footer Styles ========== */

/**
* @tab Footer
* @section footer style
* @tip Set the background color and borders for your email's footer area.
* @theme footer
*/
#templateFooter{
    /*@editable*/ background-color:#EFEFEF;
}

/**
* @tab Footer
* @section footer text
* @tip Set the styling for your email's footer text. Choose a size and color that is easy to read.
* @theme footer
*/
.footerContent{
    /*@editable*/ color:#808080;
    /*@editable*/ font-family:Helvetica;
    /*@editable*/ font-size:10px;
    /*@editable*/ line-height:150%;
    padding-top:20px;
    padding-right:20px;
    padding-bottom:20px;
    padding-left:20px;
    /*@editable*/ text-align:left;
}

/**
* @tab Footer
* @section footer link
* @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
*/
.footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts, .footerContent a span /* Yahoo! Mail Override */{
    /*@editable*/ color:#606060;
    /*@editable*/ font-weight:normal;
    /*@editable*/ text-decoration:underline;
}

/* MOBILE STYLES */

@media only screen and (max-width: 640px){
    /* CLIENT-SPECIFIC MOBILE STYLES */
    body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:none !important;} /* Prevent Webkit platforms from changing default text sizes */
    body{width:100% !important; min-width:100% !important;} /* Prevent iOS Mail from adding padding to the body */

    /* MOBILE RESET STYLES */
    #bodyCell{padding:10px !important;}


    /* ======== Page Styles ======== */

    /**
    * @tab Mobile Styles
    * @section template width
    * @tip Make the template fluid for portrait or landscape view adaptability. If a fluid layout doesn't work for you, set the width to 300px instead.
    */
    #templateContainer{
        max-width:640px !important;
        /*@editable*/ width:100% !important;
        /*@editable*/ background-color:#FFFFFF;

    }

    /**
    * @tab Mobile Styles
    * @section heading 1
    * @tip Make the first-level headings larger in size for better readability on small screens.
    */
    h1{
        /*@editable*/ font-size:20px !important;
        /*@editable*/ line-height:100% !important;
    }

    /**
    * @tab Mobile Styles
    * @section heading 2
    * @tip Make the second-level headings larger in size for better readability on small screens.
    */
    h2{
        /*@editable*/ font-size:18px !important;
        /*@editable*/ line-height:100% !important;
    }

    /**
    * @tab Mobile Styles
    * @section heading 3
    * @tip Make the third-level headings larger in size for better readability on small screens.
    */
    h3{
        /*@editable*/ font-size:14px !important;
        /*@editable*/ line-height:100% !important;
    }

    /**
    * @tab Mobile Styles
    * @section heading 4
    * @tip Make the fourth-level headings larger in size for better readability on small screens.
    */
    h4{
        /*@editable*/ font-size:12px !important;
        /*@editable*/ line-height:100% !important;
    }

    /* ======== Header Styles ======== */

    #templatePreheader{

    }

    /**
    * @tab Mobile Styles
    * @section header image
    * @tip Make the main header image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
    */
    #headerImage{
        height:auto !important;
        /*@editable*/ max-width:640px !important;
        /*@editable*/ width:100% !important;
    }

    /**
    * @tab Mobile Styles
    * @section header text
    * @tip Make the header content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
    */
    .headerContent{
        /*@editable*/ font-size:20px !important;
        /*@editable*/ line-height:125% !important;
    }

    /* ======== Body Styles ======== */

    /**
    * @tab Mobile Styles
    * @section body text
    * @tip Make the body content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
    */
    .bodyContent{
        /*@editable*/ font-size:18px !important;
        /*@editable*/ line-height:125% !important;
    }

    /* ======== Column Styles ======== */

    .templateColumnContainer{display:block !important; width:100% !important;}

    /**
    * @tab Mobile Styles
    * @section column image
    * @tip Make the column image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
    */
    .columnImage{
        height:auto !important;
        /*@editable*/ max-width:640px !important;
        /*@editable*/ width:100% !important;
    }

    /**
    * @tab Mobile Styles
    * @section left column text
    * @tip Make the left column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
    */
    .leftColumnContent{
        /*@editable*/ font-size:16px !important;
        /*@editable*/ line-height:125% !important;
    }

    /**
    * @tab Mobile Styles
    * @section center column text
    * @tip Make the center column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
    */
    .centerColumnContent{
        /*@editable*/ font-size:16px !important;
        /*@editable*/ line-height:125% !important;
    }

    /**
    * @tab Mobile Styles
    * @section right column text
    * @tip Make the right column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
    */
    .rightColumnContent{
        /*@editable*/ font-size:16px !important;
        /*@editable*/ line-height:125% !important;
    }
}