/**************************** ARTICLE STYLESHEET ****************************/
 


/**************************** START BODY and MAIN COLUMN ****************************/

body {
	background-image: url(images/header-sub-2011.jpg);
	background-repeat: repeat-x;
	background-position: top center;
}

.small {font-size: 11px;}

#header1 {width: 970px;}

#header2 { 
	width: 970px;
	height: 105px;
	margin: 0px;
	text-align: left;
}

#header2-pad {padding: 0 0 0 0;}
#header2-pad.qotw {padding-left: 160px;}

.pad-main {padding-left: 20px; padding-right: 20px;}

#columnholder {width: 970px; _width: 975px;}

#column-a {width: 180px;}
.pad-a1 {padding: 20px 15px 15px 15px; background: none; _padding-right:10px}
.pad-a2 {padding: 0px 0px 0px 0px; background: none;}

#column-main {width: 560px;}
.pad-main {padding: 20px 20px 20px 20px;}
 
#column-main a:link {text-decoration: underline;}
#column-main a:visited {text-decoration: underline;}

#column-b {width: 228px;}
.pad-b1 {padding: 15px 0px 0px 15px; background: none; _padding-left:10px}
.pad-b2 {padding: 5px 0px 5px 0px;}

#header-navbar {width: 970px;}

#navbar {margin-left:150px;}

#feature-box {width: 520px; _width: 518px;}




/**************************** START FOOTER WITH ADS ****************************/

#footer1 {
	clear: both;
	width: 100%;
	height: 220px;
	background: none;

	background-image: url(images/bg-footer.jpg);
	background-repeat: repeat-x;
	background-position: top center;
}

#footer1-container {
	clear: both;
	width: 800px;
	padding-top: 25px;
}

#footer-promo-box {float: left;}

#footer-promo-box.middle {margin: 0px 20px 0px 20px;} 

#footer-promo-box img { behavior: url(/fragments/iepngfix.htc); height: 170px; width: 250px; border: none; padding: 0px; margin: 0px;}

#footer-promo-box h3 {
	font-size: 18px;
	font-weight: normal;
	margin: 0px;
}




/**************************** Live Audio Chats ****************************/

#chats-header1 {color: #fff; font-size: 53px; position: relative; top: 25px; margin-left: 1px;}
#chats-header2 {font-size: 53px; position: relative; margin-top: -39px; * margin-top: -37px; margin-right: 3px;}

#chats-header2 a:link {color: #4E4EAF; text-decoration: none;}
#chats-header2 a:visited {color: #4E4EAF; text-decoration: none;}
#chats-header2 a:hover {color: #839FF2; text-decoration: none;}

.chats {color: #4E4EAF}

a.chats:link {color: #4E4EAF; text-decoration: underline;}
a.chats:visited {color: #4E4EAF; text-decoration: underline;}
a.chats:hover {color: #839FF2; text-decoration: underline;}

a.chats-header:link {color: #4E4EAF; text-decoration: none;}
a.chats-header:visited {color: #4E4EAF; text-decoration: none;}
a.chats-header:hover {color: #839FF2; text-decoration: none;}

a.chats-title:link {color: #4E4EAF; text-decoration: none; font-weight: bold;}
a.chats-title:visited {color: #4E4EAF; text-decoration: none; font-weight: bold;}
a.chats-title:hover {color: #839FF2; text-decoration: none; font-weight: bold;}

img.chats-photo1 {margin-right: 10px; height: 80px; border: 1px solid #4E4EAF;}
img.chats-photo2 {margin-right: 10px; border: 1px solid #4E4EAF;}

#chats-name-location {text-align: right;}

#chats-column-b {color: #333; text-align: left;}

#chats-search-title {float: left; width: 160px; text-align: left;}

#chats-search-pubdate {float: right; text-align: center; width: 50px; overflow: hidden;}

#chats-divider {clear: both; width: 100%; border-top: 1px dashed #4E4EAF;}

#chats-all {* margin-top: -15px;}

img.podcast-icon {margin-left: 5px; margin-top: -12px}

/* safari only hack */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	img.podcast-icon {margin-left: 5px; margin-top: -6px;}
}

img.podcast-icon {* margin-top: -4px;}

#chats-audio {float: right; width: 150px; border: 1px solid #4E4EAF; padding: 10px;}




/**************************** QUESTION OF THE WEEK ****************************/

#qotw-header1 {color: #fff; font-size: 53px; position: relative; top: 25px; margin-left: 1px;}
#qotw-header2 {font-size: 53px; position: relative; margin-top: -39px; * margin-top: -37px; margin-right: 3px;}

#qotw-header2 a:link {color: #F54D6D; text-decoration: none;}
#qotw-header2 a:visited {color: #F54D6D; text-decoration: none;}
#qotw-header2 a:hover {color: #F47C90; text-decoration: none;}

h1.qotw, h2.qotw, h3.qotw {color: #B53C65}

h1.question {font-size: 23px; color: #B53C65}

a.qotw:link {color: #B53C65; text-decoration: underline;}
a.qotw:visited {color: #B53C65; text-decoration: underline;}
a.qotw:hover {color: #F47C90; text-decoration: underline;}

a.qotw-title:link {color: #B53C65; text-decoration: none; font-weight: bold;}
a.qotw-title:visited {color: #B53C65; text-decoration: none; font-weight: bold;}
a.qotw-title:hover {color: #F47C90; text-decoration: none; font-weight: bold;}

#qotw-name-location {text-align: right;}

#qotw-column-b {color: #333; text-align: left;}

#qotw-search-title {float: left; width: 135px; text-align: left;}

#qotw-search-pubdate {float: right; text-align: center; width: 50px; overflow: hidden;}

#qotw-divider {clear: both; width: 100%; border-top: 1px dashed #F47C90;}

#qotw-all {* margin-top: -15px;}

#qotw-form {width:515px; height:608px}




/***************************** START JSH ONLINE ORIGINALS *******************************/

a.jsh-title:link {color: #997508; text-decoration: none; font-weight: bold;}
a.jsh-title:visited {color: #997508; text-decoration: none; font-weight: bold;}
a.jsh-title:hover {color: #c8990a; text-decoration: none; font-weight: bold;}




/**************************** START TTE STYLES ************************************/

#tte-leftspace {float: left; display: none;}
img.tte-spacer1 {width: 180px;}
#tte-middlespace {float: left; width: 920px;}
#tte-middlespace img { behavior: url(/fragments/iepngfix.htc); height: 105px; width: 920px; border: none; padding: 0px; margin: 0px;}
#tte-rightspace {float: left;}
img.tte-spacer2 {width: 50px;}

#tte-header1 {
	display: inline;
	color: #fff; font-size:
	53px; position: relative;
	top: 25px;
	margin-left: 1px;
	padding: 0 5px 0 5px;
	background-image: url(images/translucent-bg.png);
}

#tte-header2 {font-size: 53px; color: #39498E; position: relative; margin-top: -39px; * margin-top: -37px; margin-right: 3px;}
#tte-header2 a:hover {text-decoration: none;}

.tte-theme-bg {
	padding-top: 5px;
	border: 1px solid #839FF2;
	margin-bottom: 15px;

	background-image: url(images/main-footer-box.jpg);
	background-repeat: repeat-x;
	background-position: top center;
}

#tte-theme {font-size: 20px; color: #39498E; height: 30px; font-weight: bold;}

#tte-top-container {clear: both;}

#tte-article-container {clear: both; border-top: 1px solid #839FF2;}

#tte-divider {clear: both; height: 15px; width: 100%;}

#tte-divider2 {display: block; clear: both; height: 25px; width: 100%;}

#tte-image-container {float: left; margin-right: 5px;}

#tte-titleprecis-container1 {float: left; width: 390px; padding-top: 5px;}

#tte-more {clear: both; border-top: 1px solid #839FF2; margin: 0 0 15px 0; padding-top: 5px;}

#tte-bottom-container {clear: both;}

#tte-titleprecis-container2 {float: left; margin-bottom: 15px; width: 100%;}

#tte-title  {clear: both; text-align:left; font-size: 18px; margin-bottom: 3px;}

#tte-title a:link {text-decoration: none;}
#tte-title a:visited {text-decoration: none;}
#tte-title a:hover {text-decoration: underline;}

#tte-precis  {clear: both; text-align: left; margin-top: -2px; line-height: 20px;}

#tte-divider-bottom {clear: both; width: 100%; border-top: 1px solid #39498E; margin-bottom: 15px;}

#tte-all {float: left; font-weight: bold; width: 75%; margin-bottom: 15px;}

#tte-all a:link, #tte-all a:hover, #tte-all a:visited {text-decoration: underline;}

#tte-search-tips {float: right; width: 25%; text-align: right; margin-bottom: 15px;}

#tte-search-tips a:link {text-decoration: underline;}
#tte-search-tips a:visited {text-decoration: underline;}
#tte-search-tips a:hover {text-decoration: underline;}

#tte-search {height: 30px; padding-bottom: 40px; * padding-bottom: 0px;}

.tte-search-go {position: relative; top: 3px;}


#tte-search-range {
	float: left; 
	font-weight: bold; 
	* height: 20px; * position: relative; * top: -15px; * margin-bottom: -15px;
}

#tte-search-date {
	float: right; 
	width: 60px; 
	text-align: center; 
	font-weight: bold; 
	* height: 20px; * position: relative; * top: -15px; * margin-bottom: -15px;
}

#tte-search-result1, #tte-search-result2 {
	clear: both;
	border-top: 1px dashed #39498E;
	padding: 5px 0 0px 0;
	* padding: 5px 0 25px 0;}

#qotw-search-result1, #qotw-search-result2 {
	clear: both;
	border-top: 1px dashed #39498E;
	padding: 5px 0 0px 0;
	* padding: 5px 0 35px 0;}

#chats-search-result1, #chats-search-result2 {
	clear: both;
	border-top: 1px dashed #4E4EAF;
	padding: 5px 0 0px 0;
	* padding: 5px 0 25px 0;}

#tte-search-divider {clear: both; width: 100%; height: 10px; * height: 0px; * display: none;}

#tte-search-title {float: left; width: 440px; font-weight: bold;}

#tte-search-title a:link {text-decoration: none;}
#tte-search-title a:visited {text-decoration: none;}
#tte-search-title a:hover {text-decoration: underline;}

#tte-search-pubdate {float: right; text-align: center; width: 50px; overflow: hidden;}

#tte-search-footer {
	clear: both;
	border-top: 1px solid #39498E;
	margin-bottom: 0px;
	margin-top: 30px;
	* margin-top: 0px;
	padding-top: 5px;
}

#qotw-search-footer {
	clear: both;
	border-top: 1px solid #39498E;
	margin-bottom: 0px;
	margin-top: 35px;
	* margin-top: 5px;
	padding-top: 5px;
}

#chats-search-footer {
	clear: both;
	border-top: 1px solid #4E4EAF;
	margin-bottom: 0px;
	margin-top: 30px;
	* margin-top: 0px;
	padding-top: 5px;
}

#tte-divider-bottom2 {clear: both; width: 100%; margin-bottom: 15px; * margin: -15px 0 0 0;}

#tte-topic-holder {height: 75px; margin-top: 15px; border-top: 1px solid #839FF2;}
#tte-topic-holder a {font-weight: bold; line-height: 20px;}
#tte-topic-right {text-align: right;}
#tte-topic-left {text-align: left;}

#tte-topic-right img {float: right; margin-left: 10px; border: 0px;}
#tte-topic-left img {float: left; margin-right: 10px;  border: 0px;}


/**************************** START IE PNG FIX ****************************/

 /*
  USAGE: All you have to do is include this one line in your CSS file, with the
  tag names to which you want the script applied:


 img, div { behavior: url(/fragments/iepngfix.htc) }


  Alternatively, you can specify that this will apply to all tags like so:
   * { behavior: url(iepngfix.htc) }
 */

img.png-fix { behavior: url(/fragments/iepngfix.htc); }



/***************************** START SEARCH *******************************/

#search-title a:link, #search-footer a:link, #search-tips a:link {text-decoration: none;}
#search-title a:visited, #search-footer a:visited, #search-tips a:visited {text-decoration: none;}
#search-title a:hover, #search-tips a:hover {text-decoration: underline;}
#search-footer a:hover {text-decoration: none;}




/***************************** MOBILE STYLES *******************************/

@media handheld,
only screen and (max-device-width: 480px),
only screen and (-webkit-min-device-pixel-ratio: 2) {

html {width:100%;}

body {width:100%; background-image: none;}

#header1 {width: 295px; margin-bottom:10px; background-image: url(images/header-logo-mobile.jpg);}
#top-left {float:none; width: 295px;}
#top-left img {width: 295px; height: 40px;}
#top-right {display:none}

#header2 {display:none}
#header-navbar-container {display:none}

#columnholder {clear:both; width: 100%;}
#column-a {display:none}

#column-main {clear:both; width: 100%;}
.pad-main {padding: 0px 10px 0px 10px}
#article-callout {margin: 20px 20px 20px 20px;}
#feature-box {width:100%}
#feedback {display:none}
#main-shareprint-container {display:none}

#search-icon {display:none}
#tte-search-title, #chats-search-title, #qotw-search-title {width: 84%}
#search-pubdate, #chats-search-pubdate, #qotw-search-pubdate {width: 14%}
#search-bottom {display:none;}
#qotw-form {width:100%;}

#bl-image {float:left; max-width:19%; margin-right:0px;}
#bl-image img, #bl-image div {max-width:100%;}
#bl-product {float:right; width:78%;}

#column-b {clear:both; width: 100%;}
.pad-b1 {padding: 10px 10px 0px 10px}
#article-shareprint-container {display:none}
#font-size {display:none}
#classifieds {display:none}

#footer1 {display:none}
#footer2 {width:100%}

}