/*****************************************************************************
 * NEW!!! 2018 tab page layout                                               *
 * to be used for legal section, key issues,                                 *
 * and any new tabbed pages going forward.                                   *
 *
 * All selectors should begin with the ancestor class, .tab-layout-2018!
 * (use .tab-layout-2018 like a namespace)
 *****************************************************************************/

.tab-layout-2018 { /*should cover the whole area below the top navbar*/
}

.tab-layout-2018 .breadcrumb {
    font-size: 12px;
    height: 35px; /* + 15px space above this below main menus = 50px */
}

.tab-layout-2018 .breadcrumb li,
#content .tab-layout-2018 .breadcrumb li {
    padding: 0;
}

.tab-layout-2018 .section-title,
#content .tab-layout-2018 .section-title {
    font-size: 16.8px !important; /* so many other importants to override */
    color: #084a94;
    margin: auto auto auto 180px;
}


.tab-layout-2018 .tab_block .jq_tabs.alt_layout ul.ui-tabs-nav,
.tab-layout-2018 .tab_block ul.ui-tabs-nav,
#collection_splash_tabs.tab-layout-2018 ul.ui-tabs-nav,
#key_issues_splash.tab-layout-2018 #key_issues_tabs ul.ui-tabs-nav {
    width: 160px;
}

#key_issues_splash.tab-layout-2018 div#tab_container {
    margin-left: 180px;
}

.tab-layout-2018 .tab_block,
.tab-layout-2018 .tab_block .ui-state-active,
.tab-layout-2018 .tab_block .ui-state-default,
.tab-layout-2018 #collection_splash_tabs .ui-state-active,
.tab-layout-2018 #collection_splash_tabs .ui-state-default,
#key_issues_splash.tab-layout-2018 #key_issues_tabs li.ui-state-active,
#key_issues_splash.tab-layout-2018 #key_issues_tabs li.ui-state-default {
    font-size: 11.52px;
    width: 160px;
}

/*
.tab-layout-2018 .tab_block .ui-state-active a,
.tab-layout-2018 #collection_splash_tabs .ui-state-active a,
#key_issues_splash.tab-layout-2018 #key_issues_tabs li.ui-state-active a {
    font-weight: bold;
}
*/

.tab-layout-2018 #share_this {
    height: 25px;
    margin: auto;
    float: right;
}

#key_issues_splash.tab-layout-2018 #key_issues_tabs #share_this ol, /*override collection_splash_left.css*/
.tab-layout-2018 #share_this ol { /*override template.css*/
    margin-top: 0;
}

.tab-layout-2018 .pic-list > li,
#content .tab-layout-2018 .pic-list > li { /*override legal_style.css */
    padding: 0
}

#key_issues_splash.tab-layout-2018 #key_issues_tabs {
    margin-top: 0px;
}

.tab-layout-2018 .ui-tabs-panel h1,
#content .tab-layout-2018 .ui-tabs-panel h1 {
    font-size: 20.16px !important; /*override 1.4em !important in this template*/
    line-height: normal !important; /*override 1.4em !important in collection_splash_left.css*/
}


/* jump links under main headings, borrowed from America's Fiscal Future */
/*#content #splash_tab_1 ul,*/
#content .tab-layout-2018 #related_links ul.jump_links,
#content .tab-layout-2018 div.ui-tabs-panel ul.jump_links
{
    font-size: 11.52px;
}

/* get rid of padding in top section - override new.css */
#centerColumn .column-in {
    padding: 0
}

/* borrowed from scripts/collection_splash_left.css */
.tab-layout-2018 div.img_holder.medallion {
    width: 160px;
    min-height: 160px;
    margin-right: 20px;
}
.tab-layout-2018 div.img_holder.medallion img {
    width: 160px;
    height: auto;
}

/***********
 * Convert a key issues tabs page to a side menu with css rules.
 * This takes care of most of the task.
 * It may be necessary to move the tabs list, share buttons, and page title around.
 */

#content {
    padding-top: 10px; /* bring up the breadcrumbs to match AFF */
}

#content #key_issues_splash {
    padding-top: 0 !important; /*overcome legal_style.css:55 */
}
#key_issues_splash #overview div.checkboxes {
    background: none;
}
#content h1,
#tech_assess_text #splash_tab_1 h1,
#tech_assess_text #splash_tab_2 h1
{
    font-size: 1.4em !important; /*overcome legal_style.css important rule */
    padding: 0;
}
/* smaller h1 in top box - using funny numbers because of the concatenation of relative size rules preceding this. */
#content div.collection_splash_overview h1 {
    font-size: 1.166em !important; /*overcome important rule in legal_style.css - imitating America's Fiscal Future section*/
    line-height: 1em; /*imitate America's Fiscal Future section*/
}

/* override jquery ui styles to make the tabs vertical and on the left */
.ui-tabs .ui-tabs-nav li,
.ui-tabs .ui-tabs-nav li a {
    float: none; /*was: left*/
}
#key_issues_splash #key_issues_tabs {
    margin-top: 5px;
}
#key_issues_splash #key_issues_tabs li.ui-state-active {
    margin-bottom: 0;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin-bottom: 0; /* was -1px */
}

/* remove tabs' border radius and colored background for menu items */
#tech_assess_text #collection_splash_tabs li.ui-state-active,
#duplication_text #collection_splash_tabs li.ui-state-active,
#collection_splash_tabs li.ui-state-active,
#collection_splash_tabs li.ui-state-default,
#key_issues_splash #key_issues_tabs li.ui-state-active,
#key_issues_splash #key_issues_tabs li.ui-state-default,
.tab_block li.ui-state-active,
.tab_block li.ui-state-default {
    background:none;
    border-radius: 0;
    line-height: 1.5em;
    border-top: 1px solid #5b616b;
    border-left: none;
    border-bottom: none;
    border-right: none;
    font-size: 0.96em; /*24/25: convert 12px to 11.52, to match weird AFF page*/
}
/* no top border on first side menu element */
#duplication_text #collection_splash_tabs li.ui-state-active:first-child,
#collection_splash_tabs li.ui-state-active:first-child,
#collection_splash_tabs li.ui-state-default:first-child,
#key_issues_splash #key_issues_tabs li.ui-state-active:first-child,
#key_issues_splash #key_issues_tabs li.ui-state-default:first-child,
.tab_block li.ui-state-active:first-child,
.tab_block li.ui-state-default:first-child,
#tech_assess_text #collection_splash_tabs li.ui-state-active:first-child,
#tech_assess_text #collection_splash_tabs li.ui-state-default:first-child {
    border-top: none;
}

/* fix borders for the menu items box */
.tab_block ul.ui-tabs-nav, /*duplication*/
#collection_splash_tabs ul.ui-tabs-nav,
#key_issues_splash #key_issues_tabs ul.ui-tabs-nav {
    width: 130px;
    padding: 0;
    border-radius: 0;
    border-top: 1px solid #5b616b;
    border-bottom: 1px solid #5b616b;
}
#key_issues_splash #key_issues_tabs ul.ui-tabs-nav.legal, /* overcome 130px rule above for legal home */
#content .tabs-left-panel, /* overcome rule in legal.css */
#key_issues_splash ul.ui-tabs-nav, /* overcome rule in inline style for disaster assistance */
#collection_splash_tabs ul.ui-tabs-nav {
    width: 160px;
}
#content .tabs-left-panel {
    float: left; /* this brings the following div 1-2px closer to it */
}
.tab_block .ui-tabs-nav li,
.ui-tabs .ui-tabs-nav li {
    width: 130px;
    border-top: 1px solid #5b616b;
    border-left: none;
    border-right: none;
    margin: 0;
}
/* no top border on first side menu element */
.tab_block .ui-tabs-nav li:first-child,
.ui-tabs .ui-tabs-nav li:first-child {
    border-top: none;
}
.tab_block .ui-tabs-nav li,
.tab_block .legal li,
#collection_splash_tabs.ui-tabs .ui-tabs-nav li {
    width: 160px;
}

/* try to make the duplication page content area fit on the right of the menu */
.tab-layout-2018 .tab_block .jq_tabs {
    width: 1028px;
    padding: 0
}
#collection_splash_tabs {
    width: auto;
}
.tab-layout-2018 .tab_block .jq_tabs div.ui-tabs-panel,
#key_issues_splash #key_issues_tabs div.ui-tabs-panel,
#collection_splash_tabs div.ui-tabs-panel {
    width: 826px; /*override 98%*/
    margin-left: 20px;
}
/* exception for recommendations search */
#key_issues_splash #key_issues_tabs div#overview-n.ui-tabs-panel {
    width: auto;
    margin-left: auto;
}


/* stop 17% rule that makes callout box skinny, not that it's in a new container */
#splash_callout_box {
    width: auto;
}
/* stop padding ul of videos and such in the callout box */
.tab_block .callout_box ul {
    padding: 0;
}
/* adjust the tabs container on the duplication page, and the tech assessment page, too*/
#tech_assess_text #collection_splash_tabs.ui-tabs,
#duplication_splash #collection_splash_tabs.ui-tabs {
    padding-top: 0;
}
/* make room for the menu on the key issues page */
#key_issues_splash div#tab_container {
    margin-left: 140px;
}
/* on duplication, stop the medallion div from pushing down the tabs block */
#content #duplication_splash div.img_holder.img_page {
    height: auto;
}
/* on tabbed_web_pages (they don't have collection_splash.css) fix up image holder */
.tab_block li a,
.ui-tabs .ui-tabs-nav li a {
    display: block;
    color: #000;
    border: none;
    padding: 8.5px 10px 8.5px 11px;
}
#key_issues_splash #key_issues_tabs li.ui-state-active,
#key_issues_splash #key_issues_tabs li.ui-state-default {
    margin: 0 !important; /*override a prior !important rule*/
}

/* menu item text non-bold */
#key_issues_splash #key_issues_tabs li.ui-state-active a,
#key_issues_splash #key_issues_tabs li.ui-state-default a,
#collection_splash_tabs li.ui-state-active a,
#collection_splash_tabs li.ui-state-default a,
.tab_block li.ui-state-active a,
.tab_block li.ui-state-default a
{
    font-weight: normal;
    text-transform: none;
}

/* highlight the menu item under the mouse */
#collection_splash_tabs li.ui-state-active a:hover,
#collection_splash_tabs li.ui-state-default a:hover,
#key_issues_splash #key_issues_tabs li.ui-state-active a:hover,
#key_issues_splash #key_issues_tabs li.ui-state-default a:hover,
.ui-tabs .ui-tabs-nav li a:hover,
.tab_block li a:hover 
{
    background-color: #f1f1f1;
    text-decoration: none;
}
/* override tab style to highlight the active menu item */
#collection_splash_tabs li.ui-state-active a,
#key_issues_splash #key_issues_tabs li.ui-state-active a,
.ui-tabs .ui-tabs-nav li.ui-tabs-active a,
.tab_block li.ui-state-active a 
{
    border-left: 4px solid rgb(0,113, 188);
    padding-left: 7px;
    color: rgb(0,113, 188) !important; /* to override a prior !important rule elsewhere */
}
/* override template.css rule for tabs padding */
#content .ui-tabs-nav li.ui-state-active,
#content .ui-tabs-nav li.ui-state-default
{
    padding: 0;
}
/* override 90% paragraph width for tab content on duplication page */
#content #duplication_splash #splash_tab_1 p,
#content #duplication_splash #splash_tab_2 p,
#content #duplication_splash #splash_tab_3 p,
#content #duplication_splash #splash_tab_4 p,
#content #duplication_splash #splash_tab_5 p {
    width: auto;
}

/* more changes to make the contents like the design. overriding previous collections rules */
#key_issues_splash #overview div.overview_collections,
#key_issues_splash #overview div.img_collections,
#key_issues_splash #overview div.img_topics,
#key_issues_splash #overview div.overview_topics {
    width: auto;
    float: none;
    padding: 0;
}
#key_issues_splash div.results,
#key_issues_splash form.bg_submit,
#key_issues_splash #key_issues_tabs #feedback_link {
    color: #666666;
    padding: 0;
    border: none;
}
#key_issues_splash #check_uncheck {
    margin-top: 1em;
}

/* no left padding for checkbox blocks */
#key_issues_splash div.checkbox_block {
    padding-left: 0;
    padding-right: 10px;
}

/* stop key issues topic and agency results from floating */
#content #key_issues_splash div.results > ul > li.odd,
#content #key_issues_splash div.results > ul > li.even {
    float: none;
    width: auto;
}

/* collections image and caption divs */
#key_issues_splash .overview_collections div.item,
#key_issues_splash #collections div.item {
    /* tricky math to evenly space 6 medallions out to 816px */
    max-width: 127.6px; /* = (816 - 5*10) / 6 = 766 / 6  = 127.666_ */
    float:left;
    margin-left:10px;
}
/* Because I don't know how to use a :first selector, add another class. */
#key_issues_splash .overview_collections div.item.first,
#key_issues_splash #collections div.item.first {
    margin-left: 0;
}
#key_issues_splash .overview_collections div.item img,
#key_issues_splash #collections div.item img {
    max-width: 100%;
}
/* make the link text the normal color */
#key_issues_splash #overview div.item a {
    color: #18568C;
    font-weight: normal;
}
#content #key_issues_splash div.results > ul {
    overflow: auto; /* otherwise height=0 because the li's float */
}

/* make the duplication left menu not float left, since it's in a container that does that */
#collection_splash_tabs ul.ui-tabs-nav {
    float: none;
}

/*big blue button*/
#content .big_blue_button a,
#content .duplication_button a {
    color: #fff;
    background-color: #069;
    font-size: 1.2em;
    font-weight: bold;
    padding: 15px 30px;
    margin: 3px;
    display: inline-block;
    border-radius: 5px;
}
#content .big_blue_button a:hover,
#content .duplication_button a:hover {
    color: #fff;
}
#content .big_blue_button a:active,
#content .duplication_button a:active {
    position:relative;
    top:1px;
}

/* main page image - reduce spacing */
#content #highrisk_splash div.img_holder,
#content div.img_holder {
    padding: 0;
}

/* bigger font in the overview */
#content .collection_spash_overview p {
    font-size: 1.1em;
}

/* no border over main section heading */
#collection_splash_tabs h1,
#tech_assess_text #splash_tab_1 h1,
#tech_assess_text #splash_tab_2 h1,
#duplication_text #splash_tab_1 h1,
#duplication_text #splash_tab_2 h1,
#duplication_text #splash_tab_3 h1
{
    font-weight: bold;
    border-top: none;
}

/* stop some color for some headings */
#content div.tab-layout-2018 div.ui-tabs div.ui-tabs-panel h1,
#key_issues_splash #key_issues_tabs h1,
#duplication_splash #collection_splash_tabs h1,
#collection_splash_tabs h1,
#content h2 
{
    color: #000;
}
#key_issues_splash #key_issues_tabs h1,
#duplication_splash #collection_splash_tabs h1,
{
    font-size: 1.4em !important; /*override rule in legal_style.css*/
    margin-bottom: 1em;
}

/* one line margin under headings in tab content */
#key_issues_splash #key_issues_tabs h1,
#duplication_splash #collection_splash_tabs h1,
#tech_assess_text #collection_splash_tabs h1
{
    margin-bottom: 1em;
}

/* normal margins for sub-headings */
#content h2 
{
    margin: 0.5em 0 1em 0;
}

div.tab-layout-2018 div.ui-tabs div.ui-tabs-panel {
    font-size: 14.4px; /* for PMR tabbed_web_page pages */
}

#key_issues_splash #key_issues_tabs div.ui-tabs-panel,
#collection_splash_tabs div.ui-tabs-panel {
    /* increase font size */
    font-size: 1.2em;
}

/* jump links under main headings, borrowed from America's Fiscal Future */
#content #splash_tab_1 ul.jump_links,
#content #related_links ul.jump_links,
#content div.ui-tabs-panel ul.jump_links
{
    margin: 0;
    background-color: #fff;
    padding: 0;
    font-size: 0.8em;
    color: inherit;
    list-style-type: none;
}

#content div.ui-tabs-panel ul.jump_links li
{
    line-height: 1.4em;
    display: inline-block;
    border-left: 1px solid gray;
    padding: 0 5px;
    font-weight: bold;
    text-transform: uppercase;
    color: gray;
}

#content div.ui-tabs-panel ul.jump_links li > a
{
    color: inherit;
}

#content div.ui-tabs-panel ul.jump_links li:first-child
{
    border-left: none;
    padding: 0 5px 0 0;
}

/* remove big left padding for jump links */
#content #duplication_splash #splash_tab_1 ul.jump_links {
    padding-left: 0;
}

/* adapt bio data for duplication page update */
#content #duplication_splash #splash_tab_1 div.bio_data ul {
    padding-left: 0;
}
#splash_tab_1 div.bio_data
{
    width:90%
}
#splash_tab_1 div.bio_data a
{
    font-size:1em
}
#content div.bio_data ul
{
    margin:0;
    padding:0
}
#content div.filter_list ul
{
    margin-top:5px
}

#content div.bio_data > ul > li
{
    float:left;
    display:inline-block;
    vertical-align:top;
    width:50%;
    list-style-type:none
}
#content .bio_data ul li ul li
{
    list-style-image:none;
    list-style-type:none;
    line-height:1.2em;
    margin:0 10px 0
}
* html #content .bio_data > ul > li
{
    margin:0 0 0 0;
    float:left;
    display:inline;
    width:50%
}
/*IE6*/
*+html #content .bio_data > ul > li
{
    margin:0 0 0 0;
    float:left;
    display:inline;
    width:50%
}
/*IE7*/
#content .bio_data div.img_holder
{
    width:75px;
    height:79px;
    float:left;
    margin-right:10px;
    /*border:1px solid #ddd*/
}
#content .bio_data div.img_holder img
{
    margin:auto;
    display:block;
    height:100%
}
/* fix image rule intended for medallions */
#content .bio_data div.img_holder img {
    width: auto;
}

/* remove space above tab block in duplication page */
#bottom_text {
    padding: 0;
}

/* div above share this to be at least the height of the medallions */
div.collection_splash_overview {
    min-height: 160px;
}

/* share this to sit just above the tab block */
#share_this { /*continued from tabbed_page.css and template.css*/
    height: 32px;
    margin-top: -32px;
    float: right;
    position: relative; /*if static, it goes beneath the preceding div and becomes un-clickable*/
}

/* just above to site just above whatever it follows, like share_this */
#content .just_above,
.just_above {
    height: 32px;
    margin-top: -32px;
    position: relative; /*if static, it goes beneath the preceding div and becomes un-clickable*/
}

/* video description from americas_fiscal_future/style.css */
div#video_descr_wrapper
{
    display: inline-block;
    width: 165px;
    padding: 30px 0px 100px 20px;
}
div#video_descr
{
    /* border: thin solid #333; */
    padding-right: 20px;
    font-size: 8.5pt;
}

/* video description block as used in high risk (this is new)
 * Couldn't find the standard way to do it.
 * So I'm usind the jQuery bg script method,
 * and aping what it does to load the description
 */
.tab-layout-2018 .vid_player {
    display: inline-block;
    vertical-align: top
}
.tab-layout-2018 .vid_description {
    display: inline-block;
    vertical-align: top;
    width: 186px;
    font-size: 0.787em;
    padding: 35px 20px 0 20px;
}
/* hide a few things the ajax load gives us that we don't want to display */
.tab-layout-2018 .vid_description h2,
.tab-layout-2018 .vid_description .time,
.tab-layout-2018 .vid_description .date{
    display: none;
}


/* used for contacts by America's Fiscal Future section */
#content div.col-2 > div {
    display: inline-block;
    max-width: 35%;
    padding-right: 2.5%;
    vertical-align: text-top;
}
#content div.col-2 > div p,
#content #splash_tab_1 div.col-2 > div p {
    margin: 0;
    width: auto;
}
#content div.col-2 > div img,
#content #splash_tab_1 div.col-2 > div img {
    width: 75px;
    height: auto;
}

/*margin to line text in the top box with text in the tab area*/
#content .top_box_margin,
.top_box_margin {
    margin-left: 175px;
}

/* override tabbed_page.css for top box border and spacing */
.tab-layout-2018 .summary_block {
    border-bottom: none;
    padding-bottom: 0
}
.tab-layout-2018 .tab_block {
    margin-top: 0
}
/* override tabbed_page.css for margins on links - it's affecting the share_this items */
.tab-layout-2018 .summary_block #share_this a,
#content .tab-layout-2018 .summary_block #share_this a {
    margin-right: 0;
}

/* override tabbed_page.css for crumbtrail */
.tab-layout-2018 #crumbtrail {
    margin-bottom: 0;
}

/*crumb trail on key issue page to sit right above the left menu, not 20px above, because there's no medallion */
#content #key_issues_splash #crumbtrail {
    float: left;
    margin-bottom: auto;
}

/*make fonts bigger*/
#content .really_big,
.really_big {
    font-size: 2em !important;
    line-height: 1em !important;
}

/*make audio elements 395px wide -- they need to be to look right*/
.formatPodcastDisplaySimple audio {
    width: 395px;
}
/*override 1em bottom margin in template.css*/
#content .formatPodcastDisplaySimple div p,
.formatPodcastDisplaySimple div p {
    margin-bottom: 0;
}

/*override legal style book list for bid pro references page*/
#content ul.book-list > li > img {
    height: auto;
}

#content ul.book-list.small > li > img{
    width: auto;
}

#content ul.book-list > li {
	width:100px;
}

/* override tabbed_pages.css table row shading gray */
table{  
   border-collapse: collapse;
   border-color: #006600 #DCDCDC #000000;
   border-spacing: 0;
   border-style: solid;
   border-width: 2px 1px 3px;
   margin: 0;
   width: 100%;

}
td{
    border: 1px solid #DCDCDC;
    height: 25px;
    padding: 0 10px;
}
tr {
    padding-right: 10px;
}
tr:nth-child(2n+1) {
    background-color: #dce4ef;
}
#content td ul li,
td ul li {
    padding-bottom: 3px
}

/* override template.css listing width */
#content div.listing {
    max-width: none
}

#content div.listing ul.report-links {
    padding: 0;
    margin: 0
}

