/* CSS for stopheartburn.com - General styles */

/* ===========================================
         GLOBAL RESETS
==============================================*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

ol, ul { list-style: none; }
strong { font-weight: bold; }
em { font-style: italic; }

a { color: #1d5c92; }
a:hover { color: #f60; }

.clear { clear: both; height: 0px; font-size: 0px; }

p {	margin-bottom: 1em; }

/* --- clearfix ---- */

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
	}

.clearfix {
    display: inline-block;
	}

html[xmlns] .clearfix {
    display: block;
	}

* html .clearfix {
    height: 1%;
	}


/* ===========================================
         MAIN LAYOUT
==============================================*/

body { 
	padding: 12px 20px 20px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* 10px at default setting */
	line-height: 1.3em;
	color: #333;
	text-align: center;
	background-color: #fff;
	}

#container {
	width: 895px;
	margin: 0 auto;
	text-align: left;
	}

#content {
	margin-top: 9px;
	}


/* ===========================================
         BOXES W/ROUND CORNERS
==============================================*/

.tr { background-repeat: no-repeat; background-position: right top; }
.br { background-repeat: no-repeat; background-position: right bottom; }
.bl { background-repeat: no-repeat; background-position: left bottom; }
.tl { background-repeat: no-repeat; background-position: left top; }

.bdr_t { background-repeat: repeat-x; background-position: left top; }
.bdr_b { background-repeat: repeat-x; background-position: left bottom; }


/* ===========================================
         HEADER
==============================================*/

#header {
	border-bottom: 5px solid #deeff0;
	}
	
#ad {
	float: right;
	}

#logo {	
	float: left;
	margin-top: 2px;
	margin-left: 10px;
	}


/* ----- SEARCH BOX ----- */

#searchBox {
	float: right;
	width: 183px;
	margin-top: 7px;
	_display: inline;  /* For Win/IE6 - fixes double margin bug */
	_zoom: 1;  /* For Win/IE6 - top border disappears */
	}
	
#searchKeywords {
	float: left;
	width: 141px;
	height: 16px;
	padding: 3px 4px;
	border: none;
	background: url(../images/bg-search.gif) 0 0 no-repeat;
	}

#searchSubmit {
	float: left;
	margin-left: 6px;
	}


/* ----- RSS FEEDS ----- */

.feedLink {
	float: right;
	height: 13px;
	margin-top: 11px;
	margin-right: 15px;
	padding-top: 1px;
	padding-left: 19px;
	font: bold 1.2em/1em Tahoma, Geneva, Arial, Helvetica, sans-serif;
	color: #333;
	text-decoration: none;
	background: url(../images/icon-feed.gif) 0 0 no-repeat;
	}
	

/* ----- NAV ----- */

#nav {
	float: left;
	list-style: none;
	padding-top: 5px;
	background: url(../images/nav-top.gif) 0 0 no-repeat;
	}

#nav li {
	float: left;
	list-style: none;
	}

#nav a {
	display: block;
	height: 30px;
	background-position: top left;
	}

#nav a.on ,
#nav a:hover {
	background-position: 0 -30px;
	}

#nav span {
	display: none;
	}

#nav-home { border-left: 5px solid #deeff0; }
#nav-home a { width: 65px; background-image: url(../images/nav-home.gif); }
#nav-symptoms a { width: 95px; background-image: url(../images/nav-symptoms.gif); }
#nav-treatment a { width: 93px; background-image: url(../images/nav-treatment.gif); }
#nav-prevention a { width: 96px; background-image: url(../images/nav-prevention.gif); }
#nav-glossary a { width: 120px; background-image: url(../images/nav-glossary.gif); }


/* ===========================================
         LEFT NAV
==============================================*/

#leftNav {
	float: left;
	width: 142px;
	background-color: #558716;
	background: url(../images/bg-leftNav.jpg) 0 0 repeat-x;
	}

#leftNav .tr { background-image: url(../images/boxes/leftNav-tr.gif); }
#leftNav .br { background-image: url(../images/boxes/leftNav-br.gif); }
#leftNav .bl { background-image: url(../images/boxes/leftNav-bl.gif); }
#leftNav .tl { background-image: url(../images/boxes/leftNav-tl.gif); }

#leftNav .boxContent {
	padding: 20px 0 12px 18px;
	}

#leftNav  h3 {
	margin-bottom: 0.8em;
	padding-right: 8px;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.3em;
	color: #fff;
	}

#leftNav ul {
	margin-bottom: 1.2em;
	font-size: 1.1em;
	line-height: 1.2em;
	}

#leftNav li {
	margin-bottom: 0.5em;
	padding-right: 18px;
	padding-bottom: 0.5em;
	_height: 1%; /* Win/IE6 */
	background: url(../images/divider-featured.jpg) left bottom no-repeat;
	}

#leftNav li.last { background: none; }

#leftNav ul a {
	display: block;
	padding-left: 11px;
	color: #fff;
	text-decoration: none;
	background: url(../images/bullet-featured.gif) 0 0.3em no-repeat;
	}

#leftNav ul a:hover {
	text-decoration: underline;
	/* color: #91cbd2;
	background-image: url(../images/bullet-featured-on.gif); */
	}

#leftNav ul a.on {
	/* color: #91cbd2; 
	background-image: url(../images/bullet-featured-on.gif); */
	}


/* ===========================================
         ARTICLE
==============================================*/

#container #article {
	float: left;
	width: 507px;
	margin-left: 14px;
	color: #333;
	background-color: none;
	}

#article .bdr_t { background-image: url(../images/boxes/article-bdr_t.gif); }
#article .tl { background-image: url(../images/boxes/article-tl.gif); }
#article .tr { background-image: url(../images/boxes/article-tr.gif); }

#article .boxContent {
	padding: 11px 18px 18px 15px;
	}

/* ----- ARTICLE TOOLS ----- */

#articleTools {
	float: right;
	}

#articleTools a {
	margin-left: 6px;
	text-decoration: none;
	}
	

/* ----- TITLE ----- */

#title {
	margin-top: 4px;
	margin-bottom: 16px;
	}

#title h1 {
	font-size: 2.4em;
	font-weight: normal;
	line-height: 1.1em;
	color: #333;
	}

#title h2 {
	margin-top: 2px;
	font-size: 1.4em;
	font-weight: normal;
	line-height: 1.3em;
	color: #333;
	}

#article #title p {
	margin-top: 4px;
	font-size: 1.1em;
	line-height: 1.3em;
	color: #908e8e;
	}


/* ----- ARTICLE TEXT ----- */

#article h3, 
#article h4 {
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 0.3em;
	}
	
#article h4 {
	margin-bottom: 0;
	}

#article p,
#article ul,
#article blockquote {
	margin-bottom: 1em;
	font-size: 1.2em;
	line-height: 1.3em;
	}

#article ul {
	margin-left: 0;
	padding-left: 1.4em;
	}

#article li {
	list-style: disc;
	}

#article blockquote {
	margin-left: 56px;
	}

#article .attention {
	color: #a80404;
	}
	
#article .disclaimer {
	font-size: 0.9em;
	line-height: 1.3em;
	}

#article .expertinfo {
	font-size: 0.9em;
	line-height: 1.3em;
	}

/* ----- INSET ----- */

#article .inset {
	width: 180px;
	margin-top: 0.4em;
	margin-bottom: 1.4em;
	}

#article .left {
	float: left;
	margin-right: 18px;
	}

#article .right {
	float: right;
	margin-left: 18px;
	}

/* ----- INSET CAPTION ----- */

#article .inset .caption {
	margin-top: 2px;
	background: url(../images/boxes/caption-bdr-t.gif) top left repeat-x;
	background-color: #bfe0e2;
	}

#article .inset .caption .tr { background-image: url(../images/boxes/caption-tr.gif); }
#article .inset .caption .br { background-image: url(../images/boxes/caption-br.gif); }
#article .inset .caption .bl { background-image: url(../images/boxes/caption-bl.gif); }
#article .inset .caption .tl { background-image: url(../images/boxes/caption-tl.gif); }

#article .inset .caption .boxContent {
	padding: 18px 20px 12px 25px;
	font-size: 0.9em;
	line-height: 1.3em;
	text-transform: uppercase;
	}


/* ===========================================
         MODULES
==============================================*/

#modules {
	float: left;
	width: 218px;
	margin-left: 14px;
	}

.module {
	margin-bottom: 12px;
	}

.module .bdr_b { background-image: url(../images/boxes/module_bdr_b.gif); }

.module .boxContent {
	position: relative;
	min-height: 127px;
	_height: 127px; /* Win/IE6 */
	padding: 12px 16px 8px;
	color: #333;
	}

.module .goLink {
	position: absolute;
	bottom: 6px;
	right: 14px;
	padding-top: 1px;
	padding-right: 22px;
	font: 1.4em/1.2em Helvetica, Arial, sans-serif;
	color: #2d5272;
	text-transform: lowercase;
	text-decoration: none;
	background-position: right 0;
	background-repeat: no-repeat;
	}

.module .goLink:hover { color: #f60; }
	
.module h2 {
	margin-bottom: 6px;
	font: 2.3em/1.1em Tahoma Geneva, Arial, Helvetica, sans-serif;
	}

.module h3 {
	margin-bottom: 0.6em;
	font: 1.2em/1.3em Tahoma Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	}

.module p {
	margin-bottom: 0;
	font-size: 1.2em;
	line-height: 1.2em;
	}
	
.module p a {
	text-decoration: none;
	color: #333;
	}

.module p a:hover {
	text-decoration: underline;
	}

.home_headline {
	font-weight: bold;
	}


/* ===========================================
         FEATURED
==============================================*/

#featured {
	margin-bottom: 9px;
	background: url(../images/bg-featured-sidebar.jpg) 0 0 repeat-x;
	_display: inline;  /* For Win/IE6 - fixes double margin bug */
	_zoom: 1;  /* For Win/IE6 - top border disappears */
	}
	
#featured .tr { background-image: url(../images/boxes/featured-sidebar-tr.gif); }
#featured .br { background-image: url(../images/boxes/featured-sidebar-br.gif); }
#featured .bl { background-image: url(../images/boxes/featured-sidebar-bl.gif); }
#featured .tl { background-image: url(../images/boxes/featured-sidebar-tl.gif); }

#featured .boxContent {
	padding-right: 0;
	}

#featured h2 {
	margin-bottom: 0.4em;
	padding-right: 16px;
	color: #fff;
	}

#featured ul {
	}

#featured li {
	margin-bottom: 0.7em;
	padding-bottom: 0.7em;
	background: url(../images/divider-featured.jpg) left bottom no-repeat;
	_height: 1%; /* Win/IE6 */
	}

#featured li.last {
	background: none;
	}

#featured li a {
	display: block;
	padding-right: 16px;
	padding-left: 20px;
	font-size: 1.2em;
	color: #fff;
	line-height: 1.3em;
	text-decoration: none;
	background: url(../images/bullet-featured.gif) 0 0.3em no-repeat;
	}

#featured li a:hover {
	text-decoration: underline;
	/* color: #91cbd2;
	background-image: url(../images/bullet-featured-on.gif); */
	}

#featured li.last a {
	margin-bottom: 0;
	padding-bottom: 0;
	}


/* ===========================================
         EXPERT ADVICE
==============================================*/

#expertAdvice {
	margin-left: 0;
	background-color: #e8fbe2;
	}

#expertAdvice .tr { background-image: url(../images/boxes/expert-tr.gif); }
#expertAdvice .br { background-image: url(../images/boxes/expert-br.gif); }
#expertAdvice .bl { background-image: url(../images/boxes/expert-bl.gif); }
#expertAdvice .tl { background-image: url(../images/boxes/expert-tl.gif); }

#expertAdvice .boxContent {
	min-height: 212px;
	_height: 212px; /* Win/IE6 */
	}

#expertAdvice .question,
#expertAdvice .answer {
	font-weight: bold;
	}

#expertAdvice .goLink {
	background-image: url(../images/arrow-expertAdvice.gif);
	}
	
	
/* ===========================================
         RECIPES
==============================================*/

#recipes {
	background-color: #cfeac4;
	}

#recipes .tr { background-image: url(../images/boxes/recipes-tr.gif); }
#recipes .br { background-image: url(../images/boxes/recipes-br.gif); }
#recipes .bl { background-image: url(../images/boxes/recipes-bl.gif); }
#recipes .tl { background-image: url(../images/boxes/recipes-tl.gif); }

#recipes .goLink {
	background-image: url(../images/arrow-recipes.gif);
	}


/* ===========================================
         TIPS
==============================================*/

#tips {
	background-color: #d1e97c;
	}

#tips .tr { background-image: url(../images/boxes/tips-tr.gif); }
#tips .br { background-image: url(../images/boxes/tips-br.gif); }
#tips .bl { background-image: url(../images/boxes/tips-bl.gif); }
#tips .tl { background-image: url(../images/boxes/tips-tl.gif); }

#tips .goLink {
	background-image: url(../images/arrow-tips.gif);
	}


/* ===========================================
         GET RELIEF
==============================================*/

#getRelief {
	background-color: #9ebc34;
	}

#getRelief .tr { background-image: url(../images/boxes/getRelief-tr.gif); }
#getRelief .br { background-image: url(../images/boxes/getRelief-br.gif); }
#getRelief .bl { background-image: url(../images/boxes/getRelief-bl.gif); }
#getRelief .tl { background-image: url(../images/boxes/getRelief-tl.gif); }

#getRelief .goLink {
	background-image: url(../images/arrow-getRelief.gif);
	}


/* ===========================================
         GLOSSARY
==============================================*/

#article.glossary a:hover {
	color: #00828A;
	}


/* ===========================================
         FOOTER
==============================================*/

#footer {
	margin-top: 16px;
	font-size: 1.1em;
	text-align: center;
	}

#footer a {
	color: #466b8b;
	}

#footer a:hover {
	color: #f60;
	}