/**
 * $Header: /lessinvasivespine.com/css/base.css 6     4/17/08 1:51p Robinp2 $
 *
 * @name	base.css
 * @package	MASTSpine.com
 * @version	$Revision: 6 $
 * @updated	$Modtime: 4/17/08 1:50p $
 * @author	Phil Robinson <phil.robinson@medtronic.com>
 */


@import url(reset.css);

/**
 * typography
 ******************************************************************************/
body {
	font-size: 75%;						/* for text resizing in IE; 1em = 12px */
}

html>body {
	font-size: 12px;					/* for text resizing in everything else */ 
}


/**
 * layout & design
 ******************************************************************************/
html {
	overflow-y: scroll;					/* force vertical scrollbar: IE */
	height: 100%;						/* force vertical scrollbar: Mozilla-based */
	margin-bottom: 0.1em;
}

body {
	background: #d4eaf7 url(/images/bg.gif) repeat-y scroll center;
	font-family: Arial, Verdana, sans-serif;

	margin-left: 1px;					/* fixes IE Windows 1px offset when centering body background image -- http://developedtraffic.com/2005/09/23/css-ie-one-pixel-image-offset-hack */
	text-align: center;					/* for IE */

}
html>body {								/* targets modern browsers */
	margin-left: 0;						/* reset left for non-IE6.x Windows */ 
}
*+html body {							/* targets IE7 */
	margin-left: 1px;					/* fixes IE Windows 1px offset when centering body background image -- http://developedtraffic.com/2005/09/23/css-ie-one-pixel-image-offset-hack */
}


/* base page container
   ---------------------------------------------------------------------------*/
#page {
	width: 780px;
	margin: 0 auto;
	text-align: left;					/* override from body for non-IE */
	line-height: 1.5em;					/* 18px = 18px/12px = 1.5em */ 
	font-size: 1em;						/* 12px */
}

#page a {
	color: #007aa9;
}

/* header container
   ---------------------------------------------------------------------------*/
#header {
	height: 136px;
	background: #069 url(/images/header_bg_tall.gif) repeat-x scroll top left;
}

#index #header { height: 136px; }		/* index page has no header drop shadow */

#header img#title {
	float: left;
}

#header img#logo {
	float: right;
}

/* flash header
   ---------------------------------------------------------------------------*/
#flash-header {
	height: 203px;
	background: url(/images/bg_lrd_logo.gif) no-repeat scroll bottom right;
}

/* main page body container
   ---------------------------------------------------------------------------*/
#main {
	width: 100%;
	background: transparent url(/images/bg_body.gif) repeat-y scroll 0 0;
}

#index #main {
	background: none;					/* index page has no main body background */
}

/* index sitemap linkapalooza
   ----------------------------------------*/
#sitemap {
	margin: 20px 20px 0;
}

#sitemap .section {
	float: left;
	width: 360px;
	height: 105px;
	margin: 0 0 10px;
	border: 1px solid #804806;
	background: transparent url(/images/bg_section.gif) no-repeat scroll top right;
}

/* really don't like doing this */
#sitemap .left	{ margin-right: 8px; }
#sitemap .right	{ margin-left: 8px; }
 
/* set the heights on the sections */
#sitemap #prodinfo, #sitemap #mis { height: 135px; }
#sitemap #spinalhealth, #sitemap #patientstories { height: 125px; }

/* set the images for the sections */
#sitemap #anatomy { background-image: url(/images/bg_anatomy.jpg); }
#sitemap #faq { background-image: url(/images/bg_faq.jpg); }
#sitemap #helpfullinks { background-image: url(/images/bg_helpfullinks.jpg); }
#sitemap #mis { background-image: url(/images/bg_mis.jpg); }
#sitemap #patientstories { background-image: url(/images/bg_patientstories.jpg); }
#sitemap #prodinfo { background-image: url(/images/bg_prodinfo.jpg); }
#sitemap #spinalhealth { background-image: url(/images/bg_spinalhealth.jpg); }
#sitemap #takeaction { background-image: url(/images/bg_takeaction.jpg); }

.section h2 {
	margin: 5px 0pt 0pt 10px;
	color: #fff;
	font-size: 12px;
}

.section ul.links {
	/*width: 200px;*/
	margin: 14px 150px 12px 10px;
	font-size: 1em;
	line-height: 1.5em;
}

/* left navigation container
   ----------------------------------------*/
#nav {
	float: left;
	width: 95px;
	margin: 10px 0 0 0;
	font-weight: bold;
	font-size: .917em;					/* 11px = 11px/12px =  .917em */
	line-height: 1.182em;				/* 13px = 13px/11px = 1.182em */
}

#nav ul {
	margin-left: 20px;
}

#nav li {
	padding: 6px 0;
	border-top: 1px solid #9c3;
}

#nav li.first {
	/*padding-top: 0;*/
	border: none;
}

#nav li a {
	display: block;
	text-decoration: none;
	color: #069;
}

#nav li a.active {
	color: #9c3;
}

#nav li a:hover {
	text-decoration: underline;
}

/* extra contains the print and email icons/links */
#extra {
	margin: 20px 0 0 20px; 
}

#extra a {
	padding: 5px 0pt 5px 27px;
	font-weight: bold;
	font-size: 1em;						/* 12px */
	line-height: 25px;					/* 25px */
}

#extra a#link-print {
	background: transparent url(/images/icon_print.gif) no-repeat scroll left center;
}

#extra a#link-email {
	background: transparent url(/images/icon_email.gif) no-repeat scroll left center;
}

/* content container
   ----------------------------------------*/
#content {
	float: left;
	width: 440px;
	margin: 10px 0 0 25px;
	color: #666;
}

#content h1 {
	margin: .9375em 0;					/* 15px = 15px/16px =  .9375 */
	color: #069;
	line-height: 1.125em;				/* 18px = 18px/16px = 1.125em */
	font-weight: bold;
	font-size: 1.333em; 				/* 16px = 16px/12px = 1.333em */
}

#content h2 {
	margin: 1.286em 0;					/* 18px = 18px/14px = 1.286em */
	color: #8b8b8b;
	line-height: 1.286em;				/* 18px = 18px/14px = 1.286em */
	font-weight: normal;
	font-size: 1.167em;					/* 14px = 14px/12px = 1.167em */
}

#content h3,
dl#faq-list dt {
	margin: 0 0 1em 0;
	color: #069;
	line-height: 1.286em;				/* 18px = 18px/14px = 1.286em */
	font-weight: bold;
	font-size: 1.167em;					/* 14px = 14px/12px = 1.167em */
}

#content h4 {
	font-weight: bold;
	line-height: 1.5em;
	font-size: 1em;
}

#content p {
	margin-bottom: 1.5em;
	line-height: 1.5em;
	font-size: 1em;
}

#content em {
	font-style: italic;
}

#content strong {
	font-weight: bold;
}

#content ol, #content ul {
	margin: 1.5em 0;					/* 18px = 18px/12px = 1.5em; */
	padding: 0 0 0 3em;					/* 36px = 36px/12px = 3em; */
	list-style-type: disc;
	font-size: 1em;						/* 12px */
}

#content li {
	line-height: 1.5em;					/* 18px = 18px/12px = 1.5em; */
}

#content dl {
	margin: 1.5em 0;					/* 18px = 18px/12px = 1.5em; */
	font-size: 1em;						/* 12px */
}

#content dt {
	line-height: 1.5em;					/* 18px = 18px/12px = 1.5em; */
	font-weight: bold;
}

#content dd {
	margin-bottom: 1em;
	line-height: 1.5em;					/* 18px = 18px/12px = 1.5em; */
}

#content img,
#content img.right {
	margin: 0 0 1.5em 1.5em;
	float: right;
}

#content img.left {
	margin: 0 1.5em 1.5em 0;
	float: left;
}

#intro {
	position: relative;
	margin: 0 0 20px 0;
	height: 16.667em;					/* 200px = 200px/12px = 16.667em */
	border-top: 1px solid #80cff8;
	border-bottom: 1px solid #80cff8;
	overflow: hidden;
}


#intro h2 {
	float: left;
	margin: 1.786em 0;					/* 25px = 25px/14px = 1.786em */
	padding-left: 225px;				/* "pushes" the heading over to the right */
}

#intro.no-image { 						/* override "normal" behavior */
	height: auto;
}

#intro.no-image h2 {					/* override "normal" behavior */
	float: none;
	margin: 1.286em 0;					/* 18px = 18px/14px = 1.286em */
	padding-left: 0px;
}

#intro img {
	display: block;
	position: relative;
	float: left;
	margin-left: -100%;					/* "pulls" the image into the negative space left by H2 padding */
}


form {
	margin: 1em 0;
	padding: 1.5em 1em 1em;
	background: #fdfefe url(/images/bg_footer.gif) repeat-x scroll left top;
	border: 1px solid #cbcbcb;
}

form label {
	display: block;
	clear: both;
	font-weight: bold;
}

form input {
	display: block;
	clear: both;
	font-size: 1em;
	font-family: Arial, Verdana, sans-serif;
}

form textarea {
	font-size: 1em;
	font-family: Arial, Verdana, sans-serif;
}

form #btnSubmit {
	margin: 1em 0 0;
}

/* FAQs */

ul#faq-list li {
	margin: .75em 0pt;
}

dl#faq-list dd {
	margin-bottom: 1.5em;
	border-bottom: 1px solid #cbcbcb;

	/* Dustin Diaz Min-Height Fast Hack @ http://www.dustindiaz.com/min-height-fast-hack */
	min-height: 145px;
	height: auto !important;
	height: 145px;
}

dl#faq-list dd img {
	float: left;
	margin: 0 0 1.5em;
} 

dl#faq-list dd h4 {
	margin: 0 0 1em 140px;
}

dl#faq-list dd p {
	margin-left: 140px;
}

.footnote {
	font-style: italic;
}

.disclaimer {
	font-style: italic;
}


/* right sidebar container
   ----------------------------------------*/
#sidebar {
	float: left;
	width: 200px;
	margin: 10px 0 0 20px;
	color: #666;

	/* fixes the "IE Duplicates Characters" bug -- http://www.positioniseverything.net/explorer/dup-characters.html */ 
	margin-right: 0 !important;
	margin-right: -3px; 
}

#sidebar h4 {
	margin: 0;
	padding: 8px 10px 6px;
	border-bottom: 1px solid #81909c;
	border-top: 1px solid #fff;
	background: #95b2c0 url(/images/bg_sidebar_hdr.gif) no-repeat scroll 50% 0%;
	color: #2e5266;
	text-shadow: #fff 0px 1px 1px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: .917em;					/* 11px = 11px/12px =  .917em */
	line-height: 1.182em;				/* 13px = 13px/11px = 1.182em */
}

#sidebar h4.special {
	margin: 1.5em 10px 1em;
	padding: 0;
	border: none;
	background: none;
	text-transform: none;
	text-shadow: none;
	font-size: 1em;
	line-height: 1.5em;	
}

/* sidebar content containers */
#sidebar ul,
#sidebar p,
#sidebar div.vid-thumb { 
	margin: 10px 5px 20px 10px;
	color: #666;
	font-size: 1em;
	line-height: 1.5em;
}

#sidebar p {
	margin-top: 0;
}

#sidebar ul.special {
	margin: 0; 
	padding-left: 3em;
	list-style-type: disc;
}

#sidebar ul li.sub {
	margin: 0 0 0 1em;
}

#sidebar li.subheading, #sidebar h5 {
	margin: 1em 0 0; 
	font-weight: bold;
}

#sidebar a {
	color: #007aa9;
	text-decoration: none;
}

#sidebar a.active {
	color: #9c3;
}

img.vid-thumb {
	margin-bottom: 10px;
}

/* footer container
   ---------------------------------------------------------------------------*/
#footer {
	clear: both;
	margin: 15px 20px 0 20px;
	border-top: 1px solid #cbcbcb;
}

#footer-text {
	margin-top: 20px;
	padding: 20px 0 0 0;
	border: 1px solid #cbcbcb;
	background: transparent url(/images/bg_footer.gif) repeat-x scroll top left;
	color: #797979;
	font-size: 1em;						/* 12px */
	line-height: 1.833em;				/* 22px = 22px/12px = 1.833em */
	text-align: center;
}

#footer p {
	font-size: 1em;						/* 12px */
	margin-bottom: 1.833em;				/* 22px = 22px/12px = 1.833em */
}
#footer p.index-cite {
	font-size: 75%;
	color: #797979;
}

/* Michelson bug */
img#michelson-logo {
	display: block;
	float: right;
	margin: 40px 0 50px;
}


/* miscellaneous
   ---------------------------------------------------------------------------*/

/* self-clearing floats; no more .clearfix classes! */
#nav ul:after,
#main:after,
#sitemap:after,
#intro:after,
#footer:after,
dl#faq-list dd:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}


#article-footer {
	clear: both;
	margin: 10px 0 0 0;
	font-weight: bold;
	font-size: .75em;							/* 9px = 9px/12px = .75em */
}

#article-footer ul {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

#article-footer li {
	margin: 4px;
	padding: 0
}

#article-footer #published	{ float: left; }
#article-footer #updated	{ float: right; }
