/*------------------------------------------------------------------------------------
  Project: iPack Framework
  File: nav.css
  Creator: Cory Perry (New Media - IPS Packaging)
  Created: 08/31/2012
======================================================================================
  This file styles all navigation elements of the iPack Framework. Only navigation 
  styles are included in this file.
======================================================================================
  Last Updated: 11/18/2013  -- CP
--------------------------------------------------------------------------------------*/

/* --- TOC

01. Main Navigation
		1. Top Level Nav
		2. Sub Level Dropdowns

02. Main Navigation (Vertical)
		1. Top Level Nav
		2. Sub Level Dropdowns
		
03. Landing Page Sub Navigation
		1. Top Level Nav
		2. Sub Level Dropdowns
		
04. Top Utility Navigation
		1. Utility Nav
		2. Sidebar


--- */


/* ________________________________________________________________________________________________________________
                                               01. MAIN NAVIGATION
   ________________________________________________________________________________________________________________ */

/* ------- 1. Top Level Nav ------- */

#main-nav {width: 100%; height: 43px; clear: both; margin-bottom: 25px;}
/* set background colors in skin file */

#main-nav-inner {width: 1260px; margin: 0 auto;}

ul#topnav {
	margin: 0; padding: 0;
	width: 100%;
	list-style: none;
	
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
	position: relative;
}
ul#topnav li a.top {
	float: left;
	height: 27px;
	padding: 16px 20px 0 20px;
	overflow: hidden;
	font-size: 1.2em;
	font-weight: bold;
}
ul#topnav li a.top:hover, ul#topnav li a.top:active { background: #f5f5f5; color: #333333; }

/* ------- 2. Sub Level Dropdowns ------- */

ul#topnav li .sub {
	position: absolute; /*--Important--*/
	top: 43px; left: 0px;
	z-index: 99999;
	background: #f5f5f5; /* non css-3 browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#DFDFDF));
    background: -moz-linear-gradient(top,  #f5f5f5, #DFDFDF);
    border: 1px solid #cccccc;
	border-top: none;
	padding: 0 10px 0 10px;
	float: left;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 8px;
	-khtml-border-radius-bottomright: 8px;
	-webkit-border-bottom-right-radius: 8px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 8px;
	-khtml-border-radius-bottomleft: 8px;
	-webkit-border-bottom-left-radius: 8px;
	display: none; /*--Hidden for those with js turned off--*/
}
ul#topnav li .row { /*--If needed to break out into rows--*/
	clear: both;
	float: left;
	width: 100%;
	margin-bottom: 10px;
}
ul#topnav li .sub ul{
	list-style: none;
	margin: 10px 0 0 0; padding: 0;
	width: 195px;
	float: left;
}
ul#topnav .sub ul li {
	width: 95%; /*--Override parent list item--*/
	color: #fff;
	padding: 7px 0 7px 0;
	border-bottom: 1px dashed #c3c3c3;
	margin: 0;
	font-size: 11px;
	font-weight: bold;
}
ul#topnav .sub ul li h2 { /*--Sub nav heading style--*/
	padding: 0;  margin: 0;
	font-size: 15px;
	letter-spacing: -.5px;
	font-weight: 600;
}
ul#topnav .sub ul li h2 a { /*--Sub nav heading link style--*/
	padding: 5px 0;
	background-image: none;
	color: #00A950;
}
ul#topnav .sub ul li a {
	float: none;
	text-indent: 0; /*--Override text-indent from parent list item--*/
	height: auto; /*--Override height from parent list item--*/
	display: block;
	text-decoration: none;
	color: #374188;
}
ul#topnav .sub ul li a:hover {
	color: #666666;
	text-decoration: underline;
	background-position: 5px 12px ;/*--Override background position--*/
}


/* ________________________________________________________________________________________________________________
                                               02. MAIN NAVIGATION (VERTICAL)
   ________________________________________________________________________________________________________________ */

/* ------- 1. Top Level Nav ------- */

#main-nav-vert {width: 100%; height: auto; clear: both; margin-bottom: 25px;}
/* set background colors in skin file */

#main-nav-vert-inner {width: 224px;}

ul#topnav-vert {
	margin: 0; padding: 0;
	width: 100%;
	list-style: none;
	
}
ul#topnav-vert li {
	margin: 0;
	height: 30px;
	border-bottom: 1px solid #ccc;
	position: relative;
}
ul#topnav-vert a.top {
	padding: 9px 8px 11px 8px;
	display: block;
	overflow: hidden;
	text-align: left;
	font-size: 90%;
	font-weight: bold;
	z-index: 99998;
}
ul#topnav-vert li a.top:hover, ul#topnav-vert li a.top:active { background: #f5f5f5; color: #333333; }

/* ------- 2. Sub Level Dropdowns ------- */

ul#topnav-vert li .sub {
	position: absolute; /*--Important--*/
	top: -1px; left: 223px;
	z-index: 99997;
	background: #f5f5f5; /* non css-3 browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#f0f0f0));
    background: -moz-linear-gradient(top,  #f5f5f5, #f0f0f0);
    border: 1px solid #cccccc;
	padding: 0 10px 0 10px;
	float: left;
	/*--Top right rounded corner--*/
	-moz-border-radius-topright: 4px;
	-khtml-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 4px;
	-khtml-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 4px;
	-khtml-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
	display: none; /*--Hidden for those with js turned off--*/
}
ul#topnav-vert li .row { /*--If needed to break out into rows--*/
	clear: both;
	float: left;
	width: 100%;
	margin-bottom: 10px;
}
ul#topnav-vert li .sub ul{
	list-style: none;
	margin: 10px 0 0 0; padding: 0;
	width: 195px;
	float: left;
}
ul#topnav-vert .sub ul li {
	width: 95%; /*--Override parent list item--*/
	color: #fff;
	height: auto !important;
	padding: 5px 0 5px 0;
	border-bottom: 1px solid #c3c3c3;
	margin: 0;
	font-size: 11px;
	font-weight: bold;
}
ul#topnav-vert .sub ul li h2 { /*--Sub nav heading style--*/
	padding: 0;  margin: 0;
	font-size: 15px;
	letter-spacing: -.5px;
	font-weight: 600;
}
ul#topnav-vert .sub ul li h2 a { /*--Sub nav heading link style--*/
	padding: 5px 0;
	background-image: none;
	color: #00A950;
}
ul#topnav-vert .sub ul li a {
	float: none;
	text-indent: 0; /*--Override text-indent from parent list item--*/
	height: auto; /*--Override height from parent list item--*/
	display: block;
	text-decoration: none;
	color: #374188;
}
ul#topnav-vert .sub ul li a:hover {
	color: #666666;
	text-decoration: underline;
	background-position: 5px 12px ;/*--Override background position--*/
}

/* ________________________________________________________________________________________________________________
                                          03. LANDING PAGE SUB NAVIGATION
   ________________________________________________________________________________________________________________ */

#land-sub-nav {
    margin: 0 !important;
}
ul#landnav {
	margin: 0; padding: 0;
	width: 100%;
	list-style: none;
	
}
ul#landnav li {
	margin: 0; padding: 0;
	position: relative;
}
ul#landnav li a.top {
	float: left;
	height: 39px;
	width: 247px;
	background: url(/images/land_nav_button.png) no-repeat;
	text-indent: -9999px;
}
ul#landnav li a.top:hover, ul#landnav li a.top:active {
	background: url(/images/land_nav_button_hover.png) no-repeat;
}
/* ------- 2. Sub Level Dropdowns ------- */

ul#landnav li .sub {
	position: absolute; /*--Important--*/
	top: 39px; left: 7px;
	z-index: 99999;
	background: #cecece; /* non css-3 browsers */
    background: -webkit-gradient(linear, left top, left bottom, from(#cecece), to(#bab8b8));
    background: -moz-linear-gradient(top,  #cecece,  #bab8b8);
	padding: 0 10px 0 10px;
	float: left;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	display: none; /*--Hidden for those with js turned off--*/
}

ul#landnav li .row { /*--If needed to break out into rows--*/
	clear: both;
	float: left;
	width: 100%;
	margin-bottom: 10px;
}
ul#landnav li .sub ul{
	list-style: none;
	margin: 10px 0 0 0; padding: 0;
	width: 225px;
	float: left;
}

ul#landnav .sub ul li {
	width: 95%; /*--Override parent list item--*/
	color: #fff;
	padding: 5px 0 5px 0;
	border-bottom: 1px solid #9b9b9b;
	margin: 0;
	font-size: 11px;
	font-weight: bold;
}
ul#landnav .sub ul li h2 { /*--Sub nav heading style--*/
	padding: 0;  margin: 0;
	font-size: 15px;
	letter-spacing: -.5px;
	font-weight: 600;
}
ul#landnav .sub ul li h2 a { /*--Sub nav heading link style--*/
	padding: 5px 0;
	background-image: none;
	color: #00A950;
}
ul#landnav .sub ul li a {
	float: none;
	text-indent: 0; /*--Override text-indent from parent list item--*/
	height: auto; /*--Override height from parent list item--*/
	display: block;
	text-decoration: none;
	color: #374188;
}
ul#landnav .sub ul li a:hover {
	color: #666666;
	text-decoration: underline;
	background-position: 5px 12px ;/*--Override background position--*/
}

/* ________________________________________________________________________________________________________________
                                          04. TOP UTILITY NAVIGATION
   ________________________________________________________________________________________________________________ */
   
/* ------- 01. Utility Nav ------- */

#utility-nav {
	display: block;
	position: absolute;
	right: 0px;
	top: 0px;
	height: auto;
	overflow: hidden;
	width: auto;
 
}

#utility-inner {
	height: auto;
	width: auto;
	margin: 0 0 0 20px;
}

#utility-nav #utility-inner ul.utility {text-align: right; padding: 3px 0 0 0;}
#utility-nav #utility-inner ul.utility li {display: inline; display: inline-block; margin: 0 0 0 13px; font-size: 11px; font-weight: bold; color: #f5f5f5;}
/* ------- 02. Sidebar ------- */

#accord-nav {}
#accord-nav h3 {font-size: 1.3em; font-weight: bold; color: #FFFFFF; background: #2b5b88 url(/images/nav_bg.png) repeat-x; padding: 8px 8px; margin: 0 0 1px 0 !important;}
#accord-nav h3.selected {font-size: 1.3em; font-weight: bold; color: #FFFFFF; background: #333333; padding: 8px 8px; margin: 0 0 1px 0 !important;}

#accord-nav ul.side {margin: 0; padding: 12px 8px 12px 8px; background: #f5f5f5; list-style: none;}
#accord-nav ul.side li {font-size: 11px; font-weight: bold; margin: 0; padding: 5px 0 5px 0; border-bottom: 1px solid #c3c3c3;}

#accord-nav ul.side li a:link {color: #2b5b88; text-decoration: none;}
#accord-nav ul.side li a:visited {color: #2b5b88; text-decoration: none;}
#accord-nav ul.side li a:hover {color: #666666; text-decoration: none; padding-left: 2px;}
#accord-nav ul.side li a:active {color: #666666; text-decoration: none;}

.tinynav { display: none; }