@charset "utf-8";
/* CSS Document */
/*     Site Dimensions:
    986px width of site, 
       962px width of white content area, removing the 12 px needed for subnav and flash.
    922 width of content area (20px side padding, 30px top margin)   
*/
/*********************
* Background Elements *
**********************/
body {margin:0; padding:0;}
/* Home template is the homepage only */
/* Page templates include the two main types of pages - full and left nav (these include the subnav) */
/* Campaign template is used for campaigns that do not use the subnav */
body#home {
    background: #D9EEF5 url(/static/structural-images/home_bg_grad.gif) repeat-x;
}
body#page, body#campaign {
    background: #D9EEF5 url(/static/structural-images/page_bg_grad.gif) repeat-x;
}
#home .container, #page .container, #campaign .container {
    width:986px; 
    margin:0 auto; 
    padding:0 0 20px 0;
}
#white-background {
    width:962px; /* 986px width of site */
    background:url(/static/structural-images/white_background.png) repeat-y;
    padding:0 12px 30px; /* 30px bottom padding */
    position:relative;
}
#white-bg-bottom {
    width:986px;
    height:12px;
    margin:0;
    padding:0;
    background:url(/static/structural-images/white_bg_bottom.png) no-repeat;
}
/*************************
* Header                 *
**************************/
#header {
    width:962px; 
    height:96px; 
    margin:0 auto;
    font:11px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
#logo {
    float:left;
    padding:20px 0 28px 15px;
}
#utilities {
    float:right;
    margin-top:12px;
    color:#514e46; /* default */
}
.utility {padding-right:24px; }
/******************************
* Hero / Mast Head            *
******************************/
#home #hero {
    width:986px; /* Encompasses entire page width for flash banner */
    height:382px;
    padding:0 1px;
    background:transparent url(/static/structural-images/frame.png) repeat scroll 1px 0;
   }
#home #hero p{
    padding:100px 100px 0;
    color:#ffffff;
}
#home #hero a{
    color:#ffffff;
}

#page #hero, #campaign #hero{
    margin:0px 3px 30px; /* 956 minus margin gives us 950px hero images */
    width:956px; 
}
#leftnav-contentArea {
    width:716px;
    float:left;
    margin:0px;
}
#leftnav-contentArea #hero {
    margin:0 3px 30px; /* 716 minus margin gives us 710px for hero images on pages with left nav */
    width:716px;
    position:relative;
}
#hero div {color:#FFFFFF;}
/******************************
* Footer                      *
******************************/
#footer {
    background-color:#FFFFFF;
    width:100%;
    position:relative;
    bottom:0;
    font:12px/15px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    color:#737373;
}
#local-footer-container {
    width:963px;
    min-height:150px;
    padding:30px 0 20px;
    margin:0 auto;
}
#shared-footer-container {
    width:963px;
    min-height:200px;
    padding:30px 0 20px;
    margin:0 auto;
}
#footer .col {
    width:142px;
    padding-right:22px;
    float:left;
    margin-bottom:30px;
}
#footer .col-span3 {
    width:470px;
    margin-left:492px;
    display:block;
    margin-bottom:30px;
    margin-top:-10px;
}
#footer .lastcol{
    width:142px;
    float:left;
    overflow:visible;
    table-layout:auto;
}
#footer ul {
    list-style-type:none;
    margin:0;
    padding:0 0 10px 0;
    font:12px/18px  Verdana, Geneva, sans-serif; /* Font Change */
}
#footer li {
    color:#737373;
    padding:4px 0;
    margin:0;
    background-image:none;
}
#footer li a {
    color:#737373;
}
#legal {
    color:#A6A6A6;
}
.copyright {
    width:328px;
    display:inline-block;
}
#footer .left-local {
    margin-right:22px;
    width:470px;
    float:left;
    border-bottom: 1px solid #e5e5e5;
    height:140px;
}
#footer span.col {width:170px;}
#footer span.col-right {width:190px;}

/********************************
* Navigation elements           *
********************************/
#nav {
    width:956px; /*986px width */
    height:38px; /*56px height */
    padding:9px 15px;
    margin:0;
    background: url(/static/structural-images/nav_background.png) no-repeat;
    position:relative;
}
#no-nav-top {
    width:956px; /*986px width */
    height:14px; /*56px height */
    padding:0 15px;
    margin:0;
    background: url(/static/structural-images/no-nav-top.png) no-repeat;
    position:relative;
}
#nav a {
    display:block;
    position:relative;
    background:url(/static/structural-images/nav_pipe.gif) top right no-repeat;
    height:44px;
    float:left;
    overflow:hidden;
}
#nav a img {
    position:relative;
    top:0px;
}
#nav li.hover a img  {
    top:-44px;
}
#nav li.selected a img {
    top:-88px;
}
#sub-nav  {
    width:916px; /* width 986 */
    z-index:99;
    position:absolute;
    height:50px;
    background: url(/static/structural-images/sub_nav.png) no-repeat;
    padding:8px 35px 0;
}
#sub-nav a {
    display:block;
    position:relative;
    float:left;
    height:32px;
    overflow:hidden;
    padding-right:6px;
}
#sub-nav a img{
    position:relative;
    top:0px;
}
#sub-nav li.hover a img{
    top:-32px;
}
#sub-nav li.selected a img{
    top:-64px;
}
#sub-nav ul, #nav ul {
    list-style-type:none;
    padding:0;
    margin:0;
}
#sub-nav ul{
    padding-left:10px;
}
#sub-nav li, #nav li {
    display:inline;
    float:left;
    background-image:none;
    padding:0;
    margin:0;
}
#sub-nav .dropdown{
    display:none;
    height:272px; /* 280 - padding */
    width:891px; /* 900 - padding */
    clear:both;
    left:40px;
    padding:0px 4px 8px 5px;
    position:absolute;
    top:40px;
}
#sub-nav .dropdown a.button{
    height:auto;
    padding-right:10px;
}
#sub-nav .dropdown .nav a,
#sub-nav .dropdown .hero p,
#sub-nav .dropdown .hero h3{
    color:#FFFFFF;
}
#sub-nav .dropdown .hero h3{
    font-size:28px;
    font-weight:normal;
    line-height:27px;
    margin-top:0;
    padding-top:40px;
}
#sub-nav .dropdown ul{
    float:left;
    width:200px;
    height:230px;
    margin:10px 30px 0 12px;
    padding:20px 0 0 0;
    background:transparent url(/static/structural-images/hero_separator.png) right repeat-y;    
}
#sub-nav .dropdown li{
    background:transparent url(/static/structural-images/white_arrow.png) 0 5px no-repeat;
    font: bold 11px/16px "Verdana";
    height:32px;
    padding-left:15px;
    width:175px;
}
#sub-nav .dropdown img{    
    display:block;
    float:right;
    height:270px;
    margin:2px 1px 0 0;
    width:360px;
}
#sub-nav li.hover .dropdown,
#sub-nav li:hover .dropdown{
    display:block;
}

#sub-nav .selected a img{
    top:-64px;
}
.green-tv-nav .dropdown{
    background:url(/static/structural-images/green_bg.png) center top no-repeat;
    z-index:400px;
}
.orange-internet-nav .dropdown{
    background:url(/static/structural-images/orange_bg.png) center top no-repeat;
    z-index:400px;
}
.red-phone-nav .dropdown{
    background:url(/static/structural-images/red_bg.png) center top no-repeat;
    z-index:400px;
}
.blue-bundles-nav .dropdown{
    background:url(/static/structural-images/blue_bg.png) center top no-repeat;
    z-index:400px;
}
.blue-myservices-nav .dropdown{
    background:url(/static/structural-images/blue_myservices_bg.png) center top no-repeat;
    z-index:400px;
}
/* For Global Menu */
.menu-category a {cursor: default;}

/* Campaign Sub Nav */
#campaign .sub-nav a {
    display:block;
    font:14px Arial, Helvetica, sans-serif;
    position:relative;
    height:44px;
    float:left;
    overflow:hidden;
}
#campaign .sub-nav li a {
    color:#1a1a1a;
    padding:10px 12px;}
#campaign .sub-nav li a:hover {
    text-decoration:none;}
    
#campaign ul.sub-nav li a:hover {
    text-decoration:none;
    background:url(/static/structural-images/ext_subnav_bg.gif) repeat-x;  
}
/* End Campaign Sub Nav */

/*****************************/
/* Left Navigation           */
/*****************************/
#leftnav {
    width:196px; /* 216px , 246px width */
    float:left;
    padding-left:30px;
    padding-right:20px;
    margin-top:90px; /* 50 for subnav plus 40 top margin */
    background:url(/static/structural-images/leftnav_bg.gif) no-repeat;
    min-height:602px;
}
#leftnav ul {
    font:14px/24px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    padding-bottom:50px;
    list-style-type:none;
    margin:0;
    padding:0 0 30px 0;
    font:12px/18px  Verdana, Geneva, sans-serif; /* Font Change */
}
#leftnav ul li {
    background:none;
    padding:2px 0;
    }
#leftnav ul.second-level {
    font:12px/18px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    padding-bottom:10px;
}
#leftnav ul ul.second-level { /* Indents the second level nav on state, but not the secondary */
    margin-left:25px;
}
#leftnav ul li a.selected {
    background:url(/static/structural-images/left_nav_selected.png) no-repeat;
    color:#737373;
    height:24px; /* Height 27 */
    display:block;
    width:216px; /* width 220 */
    position:relative;
    left:-4px;
    padding-top:3px;
    padding-left:4px;
}    
#leftnav ul li a:hover {
    color:#737373;
}    
#leftnav ul ul li a.selected {
    background:url(/static/structural-images/left_nav_selected.png) no-repeat;
    color:#737373;
    height:24px; /* Height 27 */
    display:block;
    width:191px; /* width 220 */
    position:relative;
    left:-4px;
    padding-top:3px;
    margin-left:-25px;
    padding-left:29px;
}    
#leftnav a, #leftnav a.selected {text-decoration:none}
    

/********************************
* Search                        *
********************************/
#search-box{
    background: url(/static/structural-images/search_box_top.png) no-repeat top left;
    position:absolute;
    width:287px;
    display:none;
    padding-top:45px;
    z-index:100;
    right:22px;
    top:14px;
}
#search-box input.text-solo-alt{
    width:224px;
}
#search-box .close{
    background:none;
    display:block;
    height:18px;
    line-height:18px;
    overflow:hidden;
    position:absolute;
    right:10px;
    text-indent:18px;
    top:12px;
    width:18px;
                    
}
.search-box-container{
    width:268px;
    padding:5px 5px 5px 14px;
    background: url(/static/structural-images/search_box_bg.png) no-repeat top;
}
#search-box-bottom{
    background: url(/static/structural-images/search_box_bottom.png) no-repeat bottom left;
    height:10px;
    line-height:1px;
    font-size:1px;
    width:287px;
}
#search-trigger{
    cursor:text;
}
#search-box .body-content{
    padding:0 20px 5px 10px;
}
#search-box h3{
    border-bottom:1px solid #E5E5E5;
    color:#373737;
    font-size:14px;
    margin-bottom:10px;
    padding:10px 0;
}
#search-box .search-box-container a{
    background:transparent none repeat scroll 0 0;
    float:none;
    height:auto;
}
#search-box .search-box-container li{
    float:none;
}

/********************************
* System Alert                  *
********************************/
#system-alert {
    background: #5a5767 url(/static/structural-images/system_alert.jpg) repeat-x;
    height:60px;
    margin:0 auto;
}
#system-alert .container{
    position:relative;
}
#system-alert a.close{
    position:absolute;
    top:10px; left:923px;
    z-index:2;
    background: url(/static/structural-images/close_alert.png) no-repeat;
    width:53px;
    height:15px;
    display:block;
    overflow:hidden;
    line-height:15px;
    text-indent:53px;
    cursor:pointer;
}
#system-alert .message{
    color:#FFF;
    font:12px/15px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    float:left;
    margin:3px 0 0 20px;
    padding:0;
}
#system-alert p {
    color:#FFF;
    font:12px/15px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-weight:bold;
    margin:3px 0 0 0;
    padding:0px;
}
#system-alert h3 {
    color:#FFCC00;
    margin:0;
    padding:0px;
    font:bold 20px "Trechubet MS", "Lucida Grande", sans-serif;
    line-height:20px;
    margin:8px 0 0;
}
#system-alert a {
    color:#FFCC00;
    text-decoration:none;
}
#system-alert a:hover {text-decoration:underline;}

/*****************************/
/* SocialMedia Footer        */
/*****************************/

.social-media-footer {
    position:relative; 
    top:-45px; 
    left:615px; 
    background: url(/static/structural-images/social-media-footer-bg.png) no-repeat;
    padding:4px 15px; 
    width:316px; 
    height:22px;
    margin-bottom:-22px;
}
#footer .social-media-footer ul li {
    display:inline;
    padding: 0px 15px;
}