/******************
BASELINE CSS STYLES
*******************/

/* Reset styles */

#outlook a {padding:0;}
body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
.ExternalClass {width:100%;}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
#backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
img {display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;}
a img {border:none;}
table td {border-collapse: collapse;}
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }

/* General Typography */

td, p, li, div, span {	font-family: "Helvetica Neue", "Roboto", arial, sans-serif; font-size: 15px; line-height: 20px;}
p {margin: 1em 0;}
h1, h2, h3, h4, h5, h6 {color: black !important; font-family: "Helvetica Neue", "Roboto", arial, sans-serif; line-height: 1.3em}
h1 {font-size: 24px; }
h2 {font-size: 20px; }
h3 {font-size: 15px; }
h4, h5, h6 { font-size: 12px; }
.muted { color: #89847D;font-size: 10px;line-height: 13px; }
h1.headline {margin:0;}
.intro_paragraph { font-size: 16px;}

/* Links */

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: #0784C8;}
h1 a:active, h2 a:active,  h3 a:active, h4 a:active, h5 a:active, h6 a:active { color: red !important; }
h1 a:visited, h2 a:visited,  h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited { color: purple !important; 	}
a:link { color: #0784C8; } /* blue */
a:visited { color: #0784C8; } /* dark red */
a:hover { color: #044D75; } /* dark blue */
.preheader_content a,
.preheader_content a:link,
.preheader_content a:active,
.preheader_content a:visited { color:#89847D; }

/* Layout */

table#content_table { width: 500px; }
div.box { background: #F5F4F2; border-radius: 4px; padding: 20px; text-align: left;}
div.box p:last-child {margin-bottom: 0; }
div.box + h1,
div.box + h2,
div.box + h3 { margin-top: 0; }
div.box.list { border-bottom: 0;}
div.box.moment { padding: 0;}
div.button a, a.button { display: inline-block; border-radius: 5px; color: white; font-weight: bold; text-decoration: none; padding: 8px 12px; text-align: center}
div.green a, a.green { background: #6AB750; }
div.gray a, a.gray { background: #89847D; }
div.blue a, a.blue { background: #0784C8; }
div.button.wide a, a.button.wide { width: 70% }
hr {height: 1px; border: 0; color: #E9E8E6;background-color: #E9E8E6;width: 100%;}
div.block { margin-bottom: 40px; margin-top: 40px;}
div.block:first-child { margin-top: 0; }
div.block:last-child { margin-bottom :0; }
img.wide {width: 100%;}
img.float.left { float: left; margin: 0 20px 20px 0; }
img.float.right { float: right; margin: 0 0 20px 20px; }
p.caption { font-size: 12px; color: #999;}
div.list { border-bottom: 1px solid #ddd; }
div.list a { display: block; padding:10px 0; border-top: 1px solid #ddd; font-size: 16px; text-decoration: none; }
div.list a span { color: #89847D; }
div.footer { padding: 0; width: 240px; margin: 60px auto 0 auto;}
div.footer_links { margin-top:20px;text-align:center; border-top:1px solid #E9E8E6;border-bottom:1px solid #E9E8E6;padding: 10px 0; }
div.footer_links a { color:#89847D;padding:0 5px;text-decoration:underline;font-size:12px }
div.footer p a {color: #89847D;}

/* Friend specific */

.friendship img.moment_avatar { margin-left: 40px; margin-top: 30px; border-radius: 50%; }
.friendship h2.moment_heading { line-height: auto; margin-top: 40px; margin-left: 15px; font-size: 18px; font-weight: normal; }
.friendship div.moment_content { margin-top: 30px; padding: 40px; border-top: 1px solid #E9E8E6;font-size: 18px; line-height: 27px;}
.friendship div.moment_button { padding: 0 20px 40px 20px;}


div.percent,
div.large-image {
    font-size: 48px;
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-weight: 100;
    margin:40px 0;
}