/* health.com | package.css */
/* Updated for HL1580, HL1578 - Mosaic Package - 2/27/2013, Marvin Carlos */

/* Global over-rides (global.css) */
#content {width:663px;background-repeat:repeat-x;overflow:hidden}
#content #package-title {font:normal 2.6em Georgia, "Times New Roman", Times, serif;overflow:hidden;clear:left;padding:10px 0 5px 15px;width:430px}
#content #package-title a {color:#000}
#package-title-dek {overflow:hidden;padding:0 10px 5px 15px}
#content #content-title {background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner.png") right -1px no-repeat;line-height:1.2em;width:648px;padding:10px 0 0 15px;margin-top:0;overflow:hidden}
/* .sponsorSection .ad170x30, .sponsDis .ad170x30 {margin-top:10px} */
.more-link {background:none} /* temporary over-ride to global.css */

/* Gallery over-rides (gallery.css) */
#slideshowWrapper {width:658px;margin:0;padding-top:0;overflow:hidden;background-color:#fff;padding-left:5px}
#slideshowWrapper #content-title {padding-left:10px}

/* Article over-rides (article.css) */
#article-container {width:663px;margin:0;padding-top:0;overflow:hidden;background-color:#fff}
#article-container div {margin-left:15px} /* because #article-container is rendered flush left */
#article-container div div {margin-left:0} /* because we only need a margin on the first-level div within #article-container */
#article-container .dek {margin:5px 0 0 15px}

/* Recipe over-rides (recipe.css, global.css), Calendar over-rides (calendar.css), White Page over-ride */
#recipe-page #widecol, #calendar-day #widecol, #wpbody #widecol {background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner.png") right -1px no-repeat;margin-left:0;width:643px;padding:10px 5px 0 15px;margin-top:0;overflow:hidden}
.recipe .right_col {padding-left:0}
#calendar-day #content-title {padding:10px 0;background:none}

/* Quiz over-rides */
body#quiz #maincol {width:640px;background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner.png") right -1px no-repeat;line-height:1.2em;width:658px;padding:10px 0 0 0;margin-top:0;overflow:hidden}
body#quiz #maincol .blog {width:640px;text-align:center}
body.notabs#quiz #maincol {background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner_notabs.png") right 0 no-repeat;margin:10px 0 0 0;width:640px;padding:10px 5px 0 15px;overflow:hidden}

body.notabs #content #content-title {background:none}
body.notabs #slideshowWrapper, body.notabs #article-container {background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner_notabs.png") right 0 no-repeat;margin-top:10px;line-height:1.2em;width:658px;overflow:hidden}
body.notabs#recipe-page #widecol, body.notabs#calendar-day #widecol, body.notabs#wpbody #widecol {background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_corner_notabs.png") right 0 no-repeat;margin:10px 0 0 0;width:640px;padding:10px 5px 0 15px;overflow:hidden}

/* Landing Page / No-tab Page / Index*/
#package-wrapper {float:left;border:1px solid #c4e0f3;border-top:0;border-right:0;width:647px;background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_tabs_nofade.png") right -1px no-repeat;margin-left:15px}
body.notabs #package-wrapper {margin-top:10px;background-position:right 0}
#package-landing #email-com {padding:0 0 0 25px}
#package-landing #pageTabs, body.index-page #pageTabs {background-position:-15px bottom;float:left;margin-left:15px;width:658px} /* this holds the tabs */
#package-landing ul.tabs, body.index-page ul.tabs {padding-left:5px}
#package-wrapper a.read-more, #index-wrapper a.read-more {display:block;overflow:hidden;padding-left:13px;background:url("http://img2.timeinc.net/health/static/i/sprite_gen.png") -918px -247px no-repeat;font-size:11px}
#package-landing .share, body.index-page .share {float:left;margin-top:5px;margin-left:15px;width:645px}
#package-landing #email-com #email, body.index-page #email-com #email {padding-left:16px;background:url("http://img2.timeinc.net/health/static/i/sprite_gen.png") 0 -1116px no-repeat}
body.index-page #email-com { padding-bottom:0}
#index-wrapper {float:left;border:1px solid #c4e0f3;border-top:0;border-right:0;width:647px;background:#fff url("http://img2.timeinc.net/health/static/i/bg_package_tabs_nofade.png") right -1px no-repeat;margin-left:15px}

ul.tabs a,
ul.tabs span,
ul.tabs a:hover,
ul.tabs a:hover span {background: url("http://img2.timeinc.net/health/static/i/bg_package_tabs.png") no-repeat} /* tabs using sprite */

#pageTabs {background:url("http://img2.timeinc.net/health/static/i/bg_package_tabs.png") repeat-x left bottom;float:left;width:663px;margin-top:10px} /* this holds the tabs */
ul.tabs {padding:0 0 0 15px;list-style-type:none;margin:0}
ul.tabs li {float:left}
ul.tabs li strong {display: block;margin:-12px 0 0 0;padding:0;font: normal 80% verdana, arial,sans-serif;text-align: center;color:#999;position: relative;text-transform:uppercase}
ul.tabs a {background-position: left -100px;display:block;padding:0 0 0 11px;font:normal 1.1em Verdana,sans-serif;text-decoration: none} /*the 11px spacing is split btwn the a and span so that all lines up */
ul.tabs span {background-position:right -100px;padding:9px 11px 8px 0;display:block;white-space:nowrap} /*this padding-bottom must be 1px less than the current value line 39*/
ul.tabs a:hover {background-position: left -200px;text-decoration: none}
ul.tabs a:hover span {background-position: right -200px}

/* sponsor tab */
/*ul.tabs .sponsor span {font-size:0.9em;padding-top:3px;padding-bottom:3px;text-align:center;font-weight:bold}
ul.tabs .sponsor b {color:#888;font-size:0.8em;font-weight:normal}*/

/* safari hack for package navigation (change font-weight from bold to normal)*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
ul.tabs a{ font:normal 12px Arial,sans-serif}
}
/*styles for current tab*/
body.h_tab_1 li.tab_1 a,
body.h_tab_2 li.tab_2 a,
body.h_tab_3 li.tab_3 a,
body.h_tab_4 li.tab_4 a,
body.h_tab_5 li.tab_5 a,
body.h_tab_6 li.tab_6 a,
body.h_tab_7 li.tab_7 a,
body.h_tab_8 li.tab_8 a,
body.h_tab_9 li.tab_9 a,
body.h_tab_10 li.tab_10 a,
body.h_tab_Ad li.tab_Ad a{background-position:left top;color:#555;font-weight:bold}

#pageTabs li.tab_Ad a {color:#000}

body.h_tab_1 li.tab_1 span,
body.h_tab_2 li.tab_2 span,
body.h_tab_3 li.tab_3 span,
body.h_tab_4 li.tab_4 span,
body.h_tab_5 li.tab_5 span,
body.h_tab_6 li.tab_6 span,
body.h_tab_7 li.tab_7 span,
body.h_tab_8 li.tab_8 span,
body.h_tab_9 li.tab_9 span,
body.h_tab_10 li.tab_10 span,
body.h_tab_Ad li.tab_Ad span{background-position: right top;padding-bottom:9px}

#hero-tout {padding:10px;float:left}
#hero-tout table {background:url("http://img2.timeinc.net/health/static/i/bg_package_stripedgrey.png");width:400px;height:300px;float:left;border-spacing:0}
#hero-tout td {padding:0;text-align:center}
#hero-tout .image {display:block;overflow:hidden;margin:0 auto;margin-right:10px}
#hero-shot {float:none;margin:auto;text-align:center;border:1px solid #e5e5e5}
#hero-tout #right-col {float:left;width:205px;margin-left:10px}
#hero-tout p {font-size:1.1em;margin:5px 0;line-height:1.3em}
#content #package-wrapper #content-title {overflow:hidden;float:none;font:normal 2.2em Georgia, "Times New Roman", Times, serif;margin-bottom:10px;width:100%;background:none;margin:0 0 10px 0;padding:0;width:auto;margin-top:0}

/* Landing Page & Index Page modules */
.tout-200 {float:left;margin:0 0 10px 0;font-size:1em}
.tout-200 li div {float:left;border:1px solid #e5e5e5;padding:2px;margin-bottom:5px}
.tout-200 table {width:200px;height:150px;float:left;border-spacing:0;background:url("http://img2.timeinc.net/health/static/i/bg_package_stripedgrey.png")}
.tout-200 td {padding:0;vertical-align:middle;text-align:center}
.tout-200 ul, .tout-75 ul, .tout ul {list-style:none;padding:0;margin-left:10px}
.tout-200 img, .tout-75 img, .tout img {overflow:hidden}
.tout-200 a {display:block;font-size:1.2em}
.tout-200 a.image, .tout-75 a.image, .tout a.image {display:block;float:none;overflow:hidden;margin:0 auto} 
.tout-200 li {float:left;width:204px;margin-right:7px;padding-left:0;background:none}
.tout-200 p.dek, .tout-75 p {display:block;margin:3px 0}

.tout-75 {float:left;margin:10px 10px 20px 10px}
.tout-75 ul {margin-left:0}
.tout-75 li {float:left;margin-bottom:10px;border-top:1px dotted #d4d4d4;padding-top:10px;width:100%}
.tout-75 a {font-size:1.2em;float:none}
.tout-75 a.image {display:block;float:left;font-size:1.1em;padding:2px;border:1px solid #e5e5e5;width:75px;height:75px;margin-right:10px}
.tout-75 .tout-75 {float:left;width:530px}

.tout {float:left;margin:0 10px 20px 10px;padding-top:5px}
.tout ul {margin-left:0}
.tout li {float:left;margin-bottom:10px}
.tout li.spacer {width:625px;padding-top:4px;height:1px;border-top:1px dotted #d4d4d4;}
.tout a.image {display:block;float:left;font-size:1.1em;padding:2px;border:1px solid #e5e5e5;width:122px;height:122px;margin-right:10px}
.tout .tout-text {float:left;width:150px}
.tout p {margin-bottom:5px}

.two-col li {margin-right:10px;width:48%}
.two-col a {font-size:1.2em;float:none}

.four-col li {margin-right:5px;width:24%}
.four-col a.image {margin-bottom:5px}
.four-col p {width:130px}

/* Mosaic Package Styles */
body.mosaic .two-col a:hover {color:#F3514F}
body.mosaic .two-col a {color:#000;font:normal 1.3em/1.4em 'Oswald','Arial Narrow',sans-serif}
body.mosaic .two-col a.more-link {line-height:0.9em}
body.mosaic .more-link, #most-popular-home .more-link {background:url("http://img2.timeinc.net/health/static/i/sprite_gen.png") -985px -935px no-repeat} /*over-ride to temporary over-ride on global*/
body.mosaic .two-col p {font:normal 1.1em Arial, sans-serif}
body.mosaic .two-col .read-more {font:bold 1.1em Arial, sans-serif;color:#000}
body.mosaic #content #package-title, .header, body#video.mosaic #package-title {float:left;font:bold 3.9em 'Oswald','Arial Narrow',sans-serif;color:#fff;background-color:#F3514F;line-height:1.2em;margin:20px 0 0 15px;padding:0 3px;margin-bottom:15px;width:auto}
body.mosaic #content #package-title, body#video.mosaic #package-title {font-size:3em}
body.mosaic #content #package-title a, body#video.mosaic #package-title a {color:#FFF}
body.mosaic #content #package-title a:hover, body#video.mosaic #package-title a:hover {text-decoration:underline}
body.mosaic #content #content-title {background:none}
body.mosaic .tout a.image {border:0}

.mosaic-nav {clear:left;list-style:none;margin:0 0 0 15px;padding:0}
.mosaic-nav li {display:inline-block;margin-right:8px}
.mosaic-nav li:last-child {margin-right:0}
.mosaic-nav .thumb {border:1px solid #CCC;float:left;display:block;float:left}
.mosaic-nav .thumb:hover {border:1px solid #F3514F}
.mosaic-nav h3 {margin:15px 0 0 5px;padding:1px 2px 2px 2px;float:left;text-transform:uppercase;font-size:1.2em}
.mosaic-nav .sponsor {background-color:#973997}
.mosaic-nav h3 a {color:#FFF;font-weight:300}
.mosaic-nav .hlite {border-color:#F3514F}

#gallery .mosaic-nav, #article .mosaic-nav, #quiz .mosaic-nav, #calendar .mosaic-nav, #package-section .mosaic-nav {margin-left:10px;padding-bottom:15px;border-bottom:1px dotted #CCC}
#gallery .header {margin-left:5px;font-weight:normal}

#wrap-mosaic {width:962px;margin:12px auto;padding:1px 1px 0 1px;list-style:none;overflow:hidden;text-align:center;background-color:#CCC}
#wrap-mosaic > li {position:relative;width:320px;height:320px;float:left;margin:0 1px 1px 0}
#wrap-mosaic > .li-bot {margin-bottom:0}
#wrap-mosaic > .li-right {margin-right:0}
.tile, .effect, .effect > .caption {display:block;position:absolute}
.tile, .effect {left:0;top:0;width:320px;height:320px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
.effect {background:url("http://img2.timeinc.net/health/static/i/0.gif")} /* work-around for IE browsers */
.effect:hover {border:2px solid #F95754}
.effect:hover > .caption {background-color:#F95754;color:#FFF;opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";bottom:17px;left:32px}
.caption {bottom:20px;left:35px;font:400 1.4em 'Oswald','Arial Narrow',sans-serif;width:230px;height:30px;padding:10px;text-align:center;background-color:#FFF;color:#000;opacity:0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"}
.li-ad {background-color:#EEE}

body.mosaic.h_tab_1 .tab_1, 
body.mosaic.h_tab_2 .tab_2,
body.mosaic.h_tab_3 .tab_3,
body.mosaic.h_tab_4 .tab_4,
body.mosaic.h_tab_5 .tab_5,
body.mosaic.h_tab_6 .tab_6,
body.mosaic.h_tab_7 .tab_7,
body.mosaic.h_tab_8 .tab_8,
body.mosaic.h_tab_9 .tab_9,
body.mosaic.h_tab_10 .tab_10,
body.mosaic.h_tab_Ad .tab_Ad {border:2px solid #F3514F !important}

/* Added by Priyanka for HLT-2272. */ 
#package-landing .ad300x250.stickToTop {top: 90px !important;}