﻿/* Nav Bar Specific CSS */

/* Global */
.navbarSprite {
    background-color: transparent;
    background-image: url('/images/navbar/navbar_sprite.png');
    background-attachment: scroll;
    background-repeat: no-repeat;
}

#navbar {
    background: #333333;
    background: -webkit-linear-gradient(top, #646464 0%,#0e0e0e 100%);
    background: -ms-linear-gradient(top, #646464 0%,#0e0e0e 100%);
    background: linear-gradient(to bottom, #646464 0%,#0e0e0e 100%);
    border-top: 1px solid #444444;
    color: #fff;
    font: 10pt Verdana, Arial, sans-serif;
    height: 83px;
    margin: 15px auto auto -0px;
    padding: 0;
    position: relative;
    width: 1008px;
    z-index: 200;
}

#navbar a:hover {
    text-decoration: underline;
}
#navbar a.fallback {
    background: -webkit-linear-gradient(left,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 2.5%);
    background: -ms-linear-gradient(left,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 2.5%);
    background: linear-gradient(to right,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0) 2.5%);
    display: inline-block;
    height: 100%;
    position: absolute;
    width: 100%;
}

/* Logo */
#home_img {
    background-position: 0 -70px;
    border: none;
    display: block;
    height: 49px;
    left: 20px;
    position: absolute;
    top: 17px;
    width: 101px;
    z-index: 10000;
}

#home_img:hover {
    background-position: 0 -119px;
}

#navbar .alt_logo a {
    color: #fff;
    font-size: 18px; 
    left: 35px;
    position: absolute; 
    top: 17px;
    z-index: 1; 
}

/* Suggestion Search */
#nb_search {
    font-size: 11px;
    font-weight: bold;
    margin: 8px 0 0 140px;
    width: 570px;
}

#nb_search a {
    color: #fff;
    font-weight: normal;
    text-decoration: none;
    vertical-align: middle;
}

#navbar input {
    border: none;
    -moz-border-radius: 3px 0 0 3px;
    -webkit-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
    -webkitz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
    font: 14px Verdana, Arial, sans-serif;
    height: 19px;
    padding: 5px 8px;
    vertical-align: middle;
    width: 419px;
}

/* Drop Down */
#navbar select {
    background-position: -61px -216px;
    border: medium none;
    border-color: transparent;
    color: #999999;
    font: 11px Verdana, Arial, sans-serif;
    height: 29px;
    line-height: 25px;
    margin-top: 0px;
    padding: 3px 0 0 6px;
    vertical-align: middle;
    width: 138px;
}

@-moz-document url-prefix() { 
    #navbar select { 
      padding-top: 7px;
    }
}

#navbar select:hover {
    background-position: -61px -176px;
    color: #000000;
}

#navbar select option {
    color: #000000;
    padding: 4px 0 4px 8px;
}

#navbar div.quicksearch_dropdown_wrapper {
    background-color: white;
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset;
    height: 29px;
    overflow: hidden;
    position: absolute;
    right: 332px;
    top: 8px;
    width: 100px;
}

#navbar div.quicksearch_dropdown_wrapper:hover {
    background-image: -moz-linear-gradient(bottom, #EAEAEA 0%, #FFFFFF 100%);
    background-image: -ms-linear-gradient(bottom, #EAEAEA 0%, #FFFFFF 100%);
    background-image: -webkit-linear-gradient(bottom, #EAEAEA 0%, #FFFFFF 100%);
    background-image: linear-gradient(bottom, #EAEAEA 0%, #FFFFFF 100%);
}

#more_if_no_javascript {
    float: right;
    margin-right: -40px;
    margin-top: 5px;
}

/* Search button */
#nb_search .magnifyingglass {
    width: 16px;
    height: 18px;
    background-position: -43px 0px;
}

#nb_search .primary.btn {
    background: -moz-linear-gradient(top, rgba(242,242,242,1) 0%, rgba(249,236,117,1) 20%, rgba(243,206,0,1) 70%); /* FF3.6+ */
    background: -webkit-linear-gradient(top, rgba(242,242,242,1) 0%,rgba(249,236,117,1) 20%,rgba(243,206,0,1) 70%); /* Chrome10+,Safari5.1+ */
    background: -ms-linear-gradient(top, rgba(242,242,242,1) 0%,rgba(249,236,117,1) 20%,rgba(243,206,0,1) 70%); /* IE10+ */
    background: linear-gradient(top, rgba(242,242,242,1) 0%,rgba(249,236,117,1) 20%,rgba(243,206,0,1) 70%); /* W3C */
    -moz-border-radius: 0 3px 3px 0;
    -webkit-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#f3ce00',GradientType=0 ); /* IE6-8 */
    float:right;
    height: 29px;
    margin:0;
    vertical-align: middle;
}

#nb_search .primary.btn:hover {
    background: #F3CE00;
    filter: none;
}

#navbar button.btn{
    float: right;
}

/* Top Right Extra Links */
#nb_extra {
    position: absolute;
    right: 19px;
    top: 9px;
    z-index: 200;
}

#nb_extra a {
    color: #fff;
}

/* Consumer Main Nav Specific */
#consumer_main_nav {
    bottom: 0;
    left: 140px;
    position: absolute;
}

/* Consumer User Nav Specific */
#nb_personal {
    z-index: 200;
}

#consumer_user_nav {
    bottom: 0;
    position: absolute;
    right: 10px;
}

#consumer_user_nav div.sub_nav {
    height: auto;
    left: auto;
    padding-bottom: 10px;
    right: 0;
}

/* Consumer Pro Nav Specific */
#nb_extra_nav {
    font-size: 11px;
}

#nb_extra_nav li {
    height: auto;
    padding: 8px 6px 6px;
}

#nb_extra_nav li:hover {
    background: none;
}

#nb_extra_nav #navProMenu {
    height: auto;
    padding: 8px 20px 6px 5px;
}

#nb_extra_nav #navProMenu:hover {
    background: #333333;
    background: -webkit-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
    background: -ms-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
    background: linear-gradient(to bottom, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
}

#nb_extra_nav #navProMenu span.downArrow {
    right: 8px;
    top: 12px;
}

#nb_extra_nav li.spacer {
    background: none;
    padding: 8px 0 6px;
    width: auto;
}

#nb_extra_nav div.sub_nav {
    top: 30px;
    z-index: 10;
}

/* General Nav Styles */
ul.main_nav a {
    color: #fff;
    outline: none;
}

ul.main_nav {
    font-size: 13px;
    list-style: none;
    padding: 0 0 0 1px;
}

ul.noBackground {
    background: none;
}

ul.main_nav li {
    background: transparent;
    float: left;
    margin: 0;
    padding: 7px 40px 0 15px;
    position: relative;
    height: 39px;
}

ul.main_nav li.css_nav_item:hover,
ul.main_nav li.js_nav_item:hover {
    background: #444444;
    background: -webkit-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
    background: -ms-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
    background: linear-gradient(to bottom, rgba(55,55,55,1) 15%,rgba(80,80,80,1) 50%,rgba(55,55,55,1) 85%);
}

ul.main_nav li.spacer {
    background: #555555;
    background: -webkit-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(114,114,114,1) 50%,rgba(35,35,35,1) 85%);
    background: -ms-linear-gradient(top, rgba(55,55,55,1) 15%,rgba(114,114,114,1) 50%,rgba(35,35,35,1) 85%);
    background: linear-gradient(to bottom, rgba(55,55,55,1) 15%,rgba(114,114,114,1) 50%,rgba(35,35,35,1) 85%);
    height: 46px;    
    padding: 0px;
    width: 1px;
}

ul.main_nav li p {
    cursor: default;
    line-height: 120%;
}

ul.main_nav li p.navCategory {
    margin: 0;
    vertical-align: middle;
}

ul.main_nav li p.singleLine {
    padding-top: 10px;
}

ul.main_nav li p.watchlist a {
    color: #f5de50;
}
ul.main_nav li p.watchlist span.count {
    color: #fff;
}
ul.main_nav li span.downArrow {
    border-color: #ccc transparent transparent transparent;
    border-style: solid;
    border-width: 4px 4px 0 4px;
    height: 0;
    line-height: 0;
    position: absolute;
    right: 17px;
    top: 23px;
    -moz-transition: .3s;
    -ms-transition: .3s;
    transition: .3s;
    width: 0;
}

/* Specific Sub Nav */
#navMenu1 {
    min-width: 786px;
}

#navMenu2 {
    width: 643px;
}

#navMenu3 {
    width: 500px;
}

#navMenu4 {
    height: auto;
    left: auto;
    padding: 0 10px 20px 20px;
    right: 0;
    width: 450px;
}
#navMenu4 span.seeAll, #navMenu4 span.seeAll a {
    color: #136CB2;
}
#navMenu4 span.seeAll {
    float: right;
    font-size: 13px;
    font-weight: normal;
    margin-top: -1px;
}

#navMenuPro {
    height: 240px;
    left: auto;
    right: 0;
    width: 540px;
}
#navMenuPro h5 {
    line-height: 13px;
    margin-bottom: 3px;
}
#navMenuPro p {
    color: #3c3c3c;
    cursor: pointer;
    font-size: 13px;
    line-height: 13px;
    margin: 0 0 1.3em;
}
#navMenuPro a, #navMenuPro strong {
    color: #136CB2;
}
#navMenuPro div.subNavListContainer {
    max-width: none;
    position: absolute;
}
#proAd {
    position:absolute;
    right:0;
    top: 0;
}
#proAd img {
    border-bottom-right-radius: 10px;
}
#proLink {
    display: block;
}

/* General Sub Nav */
div.sub_nav {
    background-color: #f2f2f1;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.6);
    -moz-box-shadow: 0 2px 5px rgba(0,0,0,0.6);
    box-shadow: 0 2px 5px rgba(0,0,0,0.6);
    display: none;
    height: 315px;
    left: 0;
    margin: 0;
    position: absolute;
    top: 46px;
    z-index: 200;
}

div.sub_nav h5 {
    color: #A58500;
    margin: 20px 0 10px;
    position: relative;
}

ul.main_nav li.css_nav_item:hover div.sub_nav {
    display: block;
}

div.subNavListContainer {
    display: inline-block;
    float: left;
    min-width: 150px;
    max-width: 250px;
    padding-left: 18px;
}

div.subNavListContainer img {
    margin-top: 20px;
}

div.subNavListContainer ul {
    padding: 0;
}

div.subNavListContainer ul li,
div.subNavListContainer ul li:hover {
    background: none;
    float: none;
    height: auto;
    line-height: 16px;
    list-style: none;
    margin-bottom: 5px;
    padding: 0;
}

div.subNavListContainer a {
    color: #555;
    font-size: 13px;
}

/* Watchlist Nav */

ul#navWatchlist {
    list-style: none;
    padding: 0;
}

ul#navWatchlist li {
    background: none;
    float: left;
    height: auto;
    margin: 0 10px 0 0;
    padding: 0;
}

ul#navWatchlist li img.watchListItem {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.9);
}

ul#navWatchlist li span.noPosterText {
    bottom: 10px;
    color: #888;
    left: 0;
    overflow: hidden;
    padding: 0 8px;
    position: absolute;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 126px;
}

/* fewer-than-four currently not used */
#navbar #fewer-than-four {
    position: absolute;
    top: 41px;
    width: 460px;
}

#navbar #fewer-than-four ul.main_nav {
    bottom: 0;
    position: relative;
    text-align: center;
}

#navbar #fewer-than-four ul.main_nav li {
    display: inline;
    float: none;
}

#navbar #fewer-than-four ul.main_nav li a {
    display: inline;
}

#navbar #fewer-than-four ul.main_nav li ul.sub_nav {
    left: 0;
    top: 20px;
}

#navbar #fewer-than-four ul.main_nav li ul.sub_nav li a {
    display: block;
    margin: 0;
}

/* AD STYLES */
#nb20{
    /* These two rules cancel each other. Adding them provides something for 
     * the child node (i.e. #navbar) with margin-top to push against */ 
    background-color: #0F131A;
    background-image: url('/images/navbar/navbar_sprite.png');
    background-position: 0 bottom;
    background-repeat: repeat-x;
    padding-top:1px;
    margin-top:-1px;
}

#nb20.supertab #navbar {
    margin-top: 0px;
}

#nb20.banner #navbar {
    margin-top: 5px;
}

/* If there is supertab/megatab ad in top_ad slot, remove bg image for #nb20*/
#nb20.supertab {
     background:none; 
}

#tn15title {
    position: none;
}

#large-searchbox {
    display: none;
}

#nb20.banner #top_ad_wrapper {
    padding-left: 140px;
    padding-top: 5px;
    position: relative;
    text-align: left;
}

#titleAd, #nameAd {
    border-bottom-right-radius: 10px;
    min-height: 315px;
    position: absolute;
    right: 0;
}
#titleAd { min-width: 410px }
#nameAd { min-width: 250px }
#titleAd img.mainImage, #nameAd img.mainImage {
    border-bottom-right-radius: 10px;
    position: absolute;
    right: 0;
}
#titleAd img.sideCar, #nameAd img.sideCar {
    position: absolute;
    right: -50px;
    top: -15px;
}

#titleAd div.overlay, #nameAd div.overlay {
    background: rgb(0,0,0);
    background: rgba(0,0,0,0.5);
    border-bottom-right-radius: 10px;
    bottom: 0;
    line-height: 140%;
    padding: 0 7px;
    position: absolute;
    right: 0;
}
#titleAd div.overlay { width: 396px; }
#nameAd div.overlay { width: 236px; }
#titleAd div.overlay p, #nameAd div.overlay p { line-height: 150%; }

#latestHeadlines {
    background-color: #fff;
    background: -webkit-linear-gradient(left,  rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 3%) #fff;
    background: -ms-linear-gradient(left,  rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 3%) #fff;
    background: linear-gradient(to right,  rgba(0,0,0,0.15) 0%,rgba(0,0,0,0) 3%) #fff;
    border-bottom-right-radius: 10px;
    min-height: 315px;
    padding-left: 5px;
    position: absolute;
    right: 0;
    width: 315px;
}
#latestHeadlines ul li {
    margin-bottom: 20px;
}
#latestHeadlines ul li a {
    color: #136CB2;
}
#latestHeadlines ul li span.time {
    color: #999;
    font-size: 11px
}
/* Login Colorbox */
.login-colorbox #cboxTopLeft,
.login-colorbox #cboxTopCenter,
.login-colorbox #cboxTopRight,
.login-colorbox #cboxMiddleLeft,
.login-colorbox #cboxMiddleRight,
.login-colorbox #cboxBottomLeft,
.login-colorbox #cboxBottomCenter,
.login-colorbox #cboxBottomRight
{
    background: transparent;
}

.login-colorbox #cboxContent
{
    border-radius: 15px;
    -webkit-border-radius: 15px;
}

.login-colorbox #cboxClose
{
    right: 10px;
}

/* Site stripe styles (e.g. for news flashes) */
#site-stripe {
    background-color:#772222;
    border-bottom:2px solid #DDDDCC;
    color:#FFFFFF;
    font-size:120%;
    text-align:center;
}
#site-stripe a:link {
    color:#FFFFFF;
    text-decoration:none;
}
#site-stripe a:visited {
    color:#FFFFFF;
    text-decoration:none;
}
#site-stripe a:active {
    color:#FFFFFF;
    text-decoration:none;
}
#site-stripe a:hover {
    color:#FFFFFF;
    text-decoration:underline;
}
#site-stripe .less-emphasis {
    font-size:85%;
    margin-top:1em;
}