/#*New*#/

/*Top Nav*/
.nutritionplan .topnav { margin-bottom: 6px; float: left; width: 100%; }
.nutritionplan .topnav .breadcrumb { float:left; font-weight:700; color:#888888; }
.nutritionplan .topnav .breadcrumb span { display:block; margin-top:-6px; }
.nutritionplan .topnav .pager { float:right; margin:0; margin-top:10px; }
.nutritionplan .topnav .pager li { margin-left: 5px; }
.nutritionplan .topnav .pager li.previous a::before {  content: ""; height: 15px; margin-left: 0px; }
.nutritionplan .topnav .pager li.next a::before {  content: ""; height: 15px; margin-right: 0px; }
.nutritionplan .topnav .pager li.previous a { padding: 0; width:25px; height:25px; }
.nutritionplan .topnav .pager li.next a { padding: 0; width:25px; height:25px; }
.nutritionplan .topnav .pager li.previous a  { background: url(//media.mercola.com/themes/mercola/images/white-prev.png) 9px center no-repeat #c54031; }
.nutritionplan .topnav .pager li.next a  { background: url(//media.mercola.com/themes/mercola/images/white-next.png) 9px center no-repeat #c54031; }
.nutritionplan .topnav .pager li span { display:none; }
.nutritionplan .topnav .pager li.next {
	    float: none;
	    text-align: right;
}


@media only screen and (min-width:460px) /*landscape phone and portrait tablet*/
{
    .nutritionplan .menu li a { padding:6px 10px; font-size:16px; }
    .nutritionplan .topnav .breadcrumb span { display:inline-block; }
	
}

@media only screen and (min-width:700px) /*tablet*/
{
    .nutritionplan .topnav { margin-bottom: 16px; }
    .nutritionplan .topnav .pager li.previous a, 
	/*.nutritionplan .topnav .pager li.next a { padding-top: 10px }*/
    .nutritionplan .topnav .pager li.previous a::before, .nutritionplan .topnav .pager li.next a::before { color: white; }
	.nutritionplan .topnav .pager li.previous a::before {  content: ""; height: 0px; margin-left: 0px; }
    .nutritionplan .topnav .pager li.next a::before {  content: ""; height: 0px; margin-right: 0px; }
	.nutritionplan .topnav .pager li span { display:block; }
	.nutritionplan .topnav .pager li.previous a { padding: 5px 15px 5px 5px; width:auto }
    .nutritionplan .topnav .pager li.next a { padding: 5px 5px 5px 15px; width:auto}
	.nutritionplan .topnav .pager li.previous a  { background: url(//media.mercola.com/themes/mercola/images/white-prev.png) left center no-repeat #c54031; }
.nutritionplan .topnav .pager li.next a  { background: url(//media.mercola.com/themes/mercola/images/white-next.png) right center no-repeat #c54031; }
	

    
}



@media only screen and (max-width:989px) 
{ 
    #maincontent { display:block !important; } /*negate display:table property on 989px that disables img max-width property*/ 
	
} 

table.generic-table { font-family: "Source Sans Pro", Arial, sans-serif !important; }
table.generic-table tr:first-child td:first-child { font-family: "Source Sans Pro", Arial, sans-serif !important; }
td#pinIttd span > span {
    background-size: 100% !important;
    background: url(//media.mercola.com/themes/mercola/images/bg-pinterest.jpg) no-repeat !important;
    bottom: 20px !important;
    height: 36px !important;
    padding-top: 6px;
    top: -42px;
}

td#pinIttd > span {
    margin-top: 42px !important;
}

h1 { font-family: "Source Sans Pro", Arial, sans-serif !important; }

.bodytextdiv div p {
    line-height: 24px !important;
}
.nutritionplan { font-size:16px; line-height:24px; font-family: "Source Sans Pro", Arial, sans-serif;  font-size:16px; }
.nutritionplan .bodytextdiv h2 { color: #c00; margin: 38px 0px 16px 0px; font-family: "Source Sans Pro", Arial, sans-serif; font-size: 18px;
}
.nutritionplan.introduction .title .level1, 
.nutritionplan.introduction .title .level2, 
.nutritionplan.introduction .title .advanced, 
.nutritionplan.introduction .title .resources,
.nutritionplan.level1 .title .introduction, 
.nutritionplan.level1 .title .level2, 
.nutritionplan.level1 .title .advanced, 
.nutritionplan.level1 .title .resources,
.nutritionplan.level2 .title .level1, 
.nutritionplan.level2 .title .introduction, 
.nutritionplan.level2 .title .advanced, 
.nutritionplan.level2 .title .resources,
.nutritionplan.advanced .title .level1, 
.nutritionplan.advanced .header .introduction, 
.nutritionplan.advanced .title .level2, 
.nutritionplan.advanced .title .resources,
.nutritionplan.resources .title .level1, 
.nutritionplan.resources .title .introduction, 
.nutritionplan.resources .title .level2, 
.nutritionplan.resources .title .advanced,

.nutritionplan.introduction .menu .introduction,
.nutritionplan.level1 .menu .level1,
.nutritionplan.level2 .menu .level2,
.nutritionplan.advanced .menu .advanced,
.nutritionplan.resources .menu .resources,

.nutritionplan.introduction .footer .introduction,
.nutritionplan.level1 .footer .level1,
.nutritionplan.level2 .footer .level2,
.nutritionplan.advanced .footer .advanced,
.nutritionplan.resources .footer .resources {
    display: none;
}


.nutritionplan .menu { display: table; padding:0px 10px 15px 10px; margin:0; }
.nutritionplan .menu li { display: table-cell; }
.nutritionplan .menu li a { padding:4px 6px; margin-right: 2px; color:White; border-radius: 5px; }
.nutritionplan .menu li a:hover { text-decoration:none; }
.nutritionplan .menu li.introduction a { background: #6cc72e; }
.nutritionplan .menu li.introduction a:hover { background: #59b71b; }
.nutritionplan .menu li.level1 a { background: #f49811; }
.nutritionplan .menu li.level1 a:hover { background: #e88a00; }
.nutritionplan .menu li.level2 a { background: #38b8e5; }
.nutritionplan .menu li.level2 a:hover { background: #19a4d5; }
.nutritionplan .menu li.advanced a { background: #a958d9; }
.nutritionplan .menu li.advanced a:hover { background: #9d3cd6; }

.nutritionplan .pager { margin: 38px 0px 16px 0px; }
.nutritionplan .pager li  { display:inline-block; list-style:none; }
.nutritionplan .pager li a {
    display:block;
    border: 1px solid #B0281A;
    font-size: 16px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 5px;
    padding: 8px 15px 8px 12px;
    background-origin: content-box!important;
    color: white;
    text-decoration: none;
}
.nutritionplan .pager li a:hover { background-color:#bf3020!important; border: 1px solid #8a1d10; }
.nutritionplan .pager li span { display:none; }
.nutritionplan .pager li span { color:white; }
.nutritionplan .topnav .pager li.previous span { margin-left:20px; padding-top:5px; }
.nutritionplan .topnav .pager li.next span { margin-right:20px; padding-top: 5px; }
.nutritionplan .side {display:none;}

.nutritionplan .pager li.previous span { margin-left:20px; }
.nutritionplan .pager li.next span { margin-right:20px; }
.nutritionplan .pager li.previous a  { background: url(//media.mercola.com/themes/mercola/images/white-prev.png) left center no-repeat #c54031; }
.nutritionplan .pager li.next  { float:right; text-align: right; }
.nutritionplan .pager li.next a  { background: url(//media.mercola.com/themes/mercola/images/white-next.png) right center no-repeat #c54031; }
.nutritionplan .pager li.previous a::before { display: block; content:"Previous"; margin-left:20px; color: white; font-size: 14px;  }
.nutritionplan .pager li.next a::before { display: block; content:"Next"; margin-right:20px; color: white; font-size: 14px; }

.nutritionplan #sources { font-weight:700; padding-top:20px; color:#0869BD; cursor:pointer; }
.nutritionplan #sources::before { content:'[+]'; margin-right: 3px; }
.nutritionplan #sources.active::before { content:'[-]' ; margin-right: 7px ; }
.nutritionplan #sourcescontent { display: none; }
.nutritionplan #sourcescontent li { list-style:none; margin:0; font-size:14px; }


.nutritionplan .footer li { margin:10px 0; list-style: none; width:20% !important; text-align:center !important; }
.nutritionplan .footer li a { display:block; padding:10px; border-radius:10px;  color:white; }
.nutritionplan .footer li a:hover { text-decoration:none; }
.nutritionplan .footer li span.small { display:block; font-size: 18px; font-weight: 700; }
.nutritionplan .footer li.introduction a { background: #6cc72e; }
.nutritionplan .footer li.introduction a:hover { background: #59b71b; }
.nutritionplan .footer li.level1 a { background: #f49811; }
.nutritionplan .footer li.level1 a:hover { background: #e88a00; }
.nutritionplan .footer li.level2 a { background: #38b8e5; }
.nutritionplan .footer li.level2 a:hover { background: #19a4d5; }
.nutritionplan .footer li.advanced a { background: #a958d9; }
.nutritionplan .footer li.advanced a:hover { background: #9d3cd6; }

@media only screen and (min-width:460px) /*landscape phone and portrait tablet*/
{
    .nutritionplan .menu li a { padding:6px 10px; }
    .nutritionplan .pager li span { display:block; }
    .nutritionplan .footer { display:table; padding-top:25px !important; margin:auto !important; }
    .nutritionplan .footer li { display:table-cell; width:5%; }
    .nutritionplan .footer li a { margin: 0 3px; }
    .nutritionplan .footer li span.large { display:block; font-size: 20px; font-weight:700; }
}

@media only screen and (min-width:700px) /*tablet*/
{
    .nutritionplan .menu { padding:0px 10px 15px 20px; }

    .nutritionplan .footer li { line-height: 26px;}
    .nutritionplan .footer li a { padding: 10px 15px; }
    .nutritionplan .footer li span.large { font-size:32px; }
}

@media only screen and (min-width:989px) /*desktop*/

{
    .nutritionplan .menu { padding:0px 10px 15px 0px; font-size:18px; margin-top:65px; }
    .nutritionplan .menu li a { padding: 8px 15px; margin-right: 8px; }
    .nutritionplan .side { display:block; }
    .nutritionplan .side { 
           float:right; 
           width:165px; 
           height:100%; 
           position:relative; 
           margin:20px 0 16px 16px; 
           padding:24px; 
           background:url(//media.mercola.com/themes/fitness/images/fitnessplan/sidebar-bg.jpg) top repeat-x #e6eff3;
    }
	
    .nutritionplan .side h4 { font-size:20px; margin:0 0 10px 0; }
    .nutritionplan .side h4.introduction { color:#6c8a03 }
    .nutritionplan .side h4.level1 { color: #ea5628;}
    .nutritionplan .side h4.level2 { color:#de2a64 }
    .nutritionplan .side h4.advanced { color:#a000ff }
    .nutritionplan .side h4.resources { color:#636262 }
    .nutritionplan .side ul { list-style:none; font-size:14px; margin:0 0 20px 0; }
    .nutritionplan .side ul a { text-decoration:none; }
    .nutritionplan .side ul a:hover { text-decoration:underline; }
    .nutritionplan .side li { padding:0; margin:0 !important; }
    
    .nutritionplan .footer li { font-size:18px; }
    .nutritionplan .footer li span.large { font-size:36px; }
    .nutritionplan .footer li span.small { font-size:22px; }
	
	
}



/#*Old*#/
#NP-sidebar { border: 1px solid #ccc; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; overflow: hidden; }
#side-panel { width: 210px; float: right; }
.nav-title { color: #fff; background-color: #004BBF; padding: 10px; text-align: center; margin-bottom: 16px; }
ul.CommonUserList { margin-left: 0px; }
ul.CommonUserList li { padding-left: 20px; border-bottom: 1px dashed #ccc; font-size: 14px; list-style: none outside none;  }
ul.CommonUserList li.sidebar-title { border-bottom: 1px solid #ccc; font-weight: bold; font-size: 16px; }
.video-container { max-width:560px; position: relative; height: 315px; overflow: hidden; margin:0 auto 10px; }
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#maincontentcontainer .mobile { display: none; }
#maincontentcontainer .not-mobile { display: block; clear:both;}
#img_sidebar { text-align: center; }
#nt_discover-more { background: url('//media.mercola.com/Assets/images/mercola/nutritional-typing.jpg') center top no-repeat scroll transparent; }
#nt_discover-more p { text-align: center; font-size: 12px; }
#nt_discover-more p.nt-test-btn { padding-top: 190px; }
#nt_discover-more p.nt-test-btn a { text-decoration: none; }
#nt_discover-more p.nt-test-btn span { display: block; background: url('//media.mercola.com/Assets/images/mercola/take-nutritional-typing.png') center center no-repeat scroll transparent; height: 47px; width: 173px; margin: 0px auto; }
.nt-plan-types a { text-shadow: 0 1px 0 #fff !important; margin-left: 20px; padding: 20px; color: #000; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; display: inline-block; font-weight: bold; font-family: Verdana, Helvetica, Sans-serif; }
.nt-plan-types a:hover { text-decoration: none; }
.nt-plan-types a.nt-beginner-plan { margin-left: 0px; background-color: #E5EB0B; }
.nt-plan-types a.nt-intermediate-plan { background-color: #B9D40B; }
.nt-plan-types a.nt-advanced-plan { background-color: #70AF1A; }
.nt-plan-types a span { font-size: 24px; display: block; }
#maincontentcontainer .article-nav-bottom { right: 0px; bottom: 0px; position: absolute; }
#maincontentcontainer table td { word-wrap: break-word; }
#maincontentcontainer figure.floatr { float: right; }
.bodytextdiv .video-responsive, .bodytextdiv .video-responsive-body { margin-bottom: 16px; text-align:center; }
#maincontentcontainer h3 { color: #c00; margin-bottom: 16px; }
#nutritionPlanNavMobile { width: 100%;}

@media screen and (max-width: 989px) {
#maincontentcontainer .mobile { display: block; margin-bottom:10px; }
#maincontentcontainer .not-mobile { display: none; }
#side-panel, #nutritionPlanNavMobile, #NP-sidebar-mobile { float: none; width: 100%; }
}

@media screen and (max-width: 870px) {
.nt-plan-types a { margin-bottom: 10px; }
}
@media screen and (max-width: 768px) {
#maincontentcontainer .article-nav-bottom { float: none; position: relative; }
#maincontentcontainer .article-nav-bottom a { margin-bottom: 10px; }
/*media screen and (max-width: 989px)*/
#maincontent {
   
}
}
@media screen and (max-width: 495px) {
#maincontentcontainer .article-nav-bottom .label, #maincontentcontainer .article-nav-bottom .label { display: none; }
#maincontentcontainer figure.floatr { float: none; width: 100%; padding: 0px 0px 16px; text-align: center; }


}
@media screen and (max-width: 320px) {
.video-responsive iframe, .video-responsive-body iframe { width: 100% !important; }
.nutritionplan .footer li { margin:10px 0; list-style: none; width:100% !important; text-align:center !important; }
#nutritionPlanNavMobile { width: 100%;}
}

/*class for videos that are within the height of right sidebar*/
.np-left-vid { text-align:center; margin-bottom:16px; max-width:460px; margin-left:50px;  }
.np-left-vid iframe { width:100%; max-width:100% !important }

@media only screen and (max-width: 870px) {
.np-left-vid { margin-left:0px; margin-bottom:16px; }
.np-left-vid iframe { max-width:320px !important;  }
}
@media only screen and (max-width: 650px) {
.np-left-vid { margin:0 auto !important; margin-bottom:16px; }
.np-left-vid iframe { max-width:560px !important; }
}

@media only screen and (max-width: 970px) {
	h1 { width: 65%; }
}

@media only screen and (max-width: 650px) {
	h1 { width: 80%; }
}

@media only screen and (min-width:990px) {
    .social-btm {
        clear: both
    }
    .social-btn-top {
        position: absolute;
        left: -9999px
    }
}

@media only screen and (max-width:989px) {
    .social-btn-top {
        width: 100%;
        position: fixed;
        padding-left: 15px;
        z-index: 100;
        background-color: #fff;
        margin-top: -5px;
        height: 85px;
        border-top: 1px solid #ccc;
        bottom: 0
    }
    .social-bottom {
        position: absolute;
        left: -99999px
    }
}






ul.social-icons {
    margin: 0;
    padding: 0
}

ul.social-icons>li.social-btn>a {
    display: block;
    background: url(//media.mercola.com/themes/mercola/images/socialsprites.png) 0 -35px no-repeat;
    height: 50px
}

ul.social-icons>li {
    list-style: none;
    float: left
}

@media only screen and (min-width:990px) {
    .social-icons li {
        height: 21px
    }
    ul.social-icons>li.social-btn>a {
        height: 21px;
        background-position-y: 0
    }
    ul.social-icons>li.social-btn[data-social-btn=facebook]>a {
        width: 17px
    }
    ul.social-icons>li.social-btn[data-social-btn=twitter]>a {
        background-position-x: -22px;
        width: 25px
    }
    ul.social-icons>li.social-btn[data-social-btn=google-plus]>a {
        background-position-x: -53px;
        width: 35px
    }
    ul.social-icons>li.social-btn[data-social-btn=linked-in]>a {
        background-position-x: -90px;
        width: 26px
    }
    ul.social-icons>li.social-btn[data-social-btn=pinterest]>a {
        background-position-x: -121px;
        width: 22px
    }
    ul.social-icons>li.social-btn[data-social-btn=mailto]>a {
        background-position: -154px 0;
        width: 29px
    }
    ul.social-icons>li.social-btn[data-social-btn=print]>a {
        background-position: -189px 0;
        width: 26px
    }
    ul.social-icons>li {
        padding-right: 8px
    }
    ul.social-icons li:first-child::after {
        content: "\00a0SHARES";
        font-size: 10px;
        color: #737373;
        display: block
    }
    ul.social-icons li:first-child {
        border-right: 1px #cbcdcc solid;
        margin-right: 14px;
        padding-bottom: 16px;
        padding-right: 16px
    }
    ul.social-icons .share-count-total span {
        color: #194199;
        font-size: 22px!important;
        font-weight: 600
    }
    ul.social-icons {
        height: 50px
    }
    ul.social-icons.dontprint {
        text-align: center
    }
    ul.social-icons li.social-btn {
        padding-top: 7px
    }
li.social-btn.not-mobile {
    display: initial!important;
    clear: inherit!important;
}
}

@media only screen and (max-width:989px) {
    .social-icons li {
        height: 30px
    }
    ul.social-icons>li {
        padding-right: 8px
    }
    ul.social-icons>li.social-btn[data-social-btn=facebook]>a {
        width: 18px
    }
    ul.social-icons>li.social-btn[data-social-btn=twitter]>a {
        background-position-x: -34px;
        width: 33px
    }
    ul.social-icons>li.social-btn[data-social-btn=google-plus]>a {
        background-position-x: -84px;
        width: 42px
    }
    ul.social-icons>li.social-btn[data-social-btn=linked-in]>a {
        background-position-x: -140px;
        width: 33px
    }
    ul.social-icons>li.social-btn[data-social-btn=pinterest]>a {
        background-position-x: -190px;
        width: 26px
    }
    ul.social-icons>li.social-btn[data-social-btn=mailto]>a {
        background-position: -230px -37px;
        width: 36px
    }
}

@media only screen and (max-width:400px) {
    ul.social-icons li:nth-child(3),
    ul.social-icons li:nth-child(4) {
        display: none
    }
}

.social-btn-top .social-icons { margin-top: 12px; }
.social-btn-top .social-icons .linked-in.social-button ~ li {padding:0 !important;}
.social-btn-top .social-icons td#pinIttd a {margin-top: 41px;}
.social-btn-top .social-icons td#pinIttd a span { top: -40px !important; background: white!important; border: 1px solid #ddd!important; border-radius: 3px!important; height: 33px!important; }
.social-btn-top .social-icons td#pinIttd a span::before { bottom: -6px !important; left: 19px !important; border-top: 5px solid #ddd; border-right: 5px solid transparent; border-left: 5px solid transparent; }

@media screen and (min-width: 990px) {
#search { padding: 8px; }
.icon-magnifier::before {
    content: url(https://www.google.com/uds/css/v2/search_box_icon.png);
}
.mercola-search {
    padding: 8px 8px;
}
#search input[type="text"] {
    border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
border: 1px solid #86b6ff !important;
padding: 10px 9px 9px 9px !important;
width: 100%;
font-size: 14px !important;
}
}

@media screen and (max-width: 989px) {
#search input[type="text"] {
    border: 1px solid #86b6ff !important;
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
    padding: 7px 7px 8px 7px !important;
}

.mercola-search {
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}
}