/*
	--------------------------------------------------
	NAVIGATION STYLES
	--------------------------------------------------

	Author:	eSolutionsGroup.ca
		
*/


/* ===================================================================================== COMMON ELEMENTS */

.horizNavSeparator { padding: 0px 7px 0px 7px; }
#breadcrumbs .horizNavSeparator { color: #000; }
#footer .horizNavSeparator { padding: 0px; }



/* ===================================================================================== TOP NAVIGATION */

#topNav a, 
#topNav a:link, 
#topNav a:visited,
#translateContainer a, 
#translateContainer a:link, 
#translateContainer a:visited,
#servicesContainer a, 
#servicesContainer a:link, 
#servicesContainer a:visited {
	color: #ff0000;
	text-decoration: none;
}

#topNav a:hover, #topNav a:active, #topNav a:focus { text-decoration: underline; }



/* ===================================================================================== SKIP TO CONTENT */
 
#skipContentWrapper{
	position: fixed;
	float: left;
}
 
a#skipContentLink, a#skipContentLink:hover, a#skipContentLink:visited{
    position:fixed;
    left:0px;
    top: 0px;
    width:1px;
    height:1px;
    overflow:hidden;
}
a#skipContentLink:active, a#skipContentLink:focus{
    width:auto;
    height:auto;
  	color: #FFF;
  	font-size: 15px;
	padding: 10px;
 	z-index: 10000;   
	text-decoration: underline;
	background: #297D92;
}

#maincontent, #maincontent:focus{
	outline: none !important;
}



/* ===================================================================================== MAIN NAVIGATION */


/* ========== 1st Level (Global) Navigation ========== */

#nav {
	list-style-type: none;
	list-style-image: none;
}

#nav li {
	float: left;
}

#navTab01, #navTab02, #navTab03, #navTab04, #navTab05 {
	position: relative;
	float: left;
	display: table;
	table-layout: fixed;
	width: 137px;
	height: 72px;
	margin: 0 0 0 3px;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 19px;
	line-height: 21px;
	font-weight: 600;
	z-index: 999;
}

a.mainNavItem, a.mainNavItem:active, a.mainNavItem:visited {
	width: 137px;
	height: 72px;
	color: #FFF;
	overflow: hidden;
	text-decoration: none;
	background: url(../images/structure/bg-mainnav-up.png) 0 0 repeat;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	display: table-cell;
	vertical-align: middle;
	position: relative;
	z-index: 998;
}

.ie7 a.mainNavItem, .ie7 a.mainNavItem:active, .ie7 a.mainNavItem:visited { display: block; }

.alignMiddle{
	display: block;
	overflow: hidden;
	max-height: 42px;
	padding: 12px 8px 18px 10px;
	width: 119px;
	
}

a.mainNavItem.current, a.mainNavItem:hover, a.mainNavItem:focus { background-image: none; background-color: #096e87; color: #FFF; }
.sfHover a.mainNavItem { background-image: none; background-color: #FFF; color: #0b6b83; }


/* ========== 2nd Level (Drop-down) Navigation ========== */

.treenode {
	display: none;
}

.dropDownWrapper{
	position: absolute;
	top: 43px;
	width: 980px;
	padding: 97px 0 50px 0;
	/*background: url(../images/structure/bg-mainnav-dropdown.png) 0 0 repeat-x;*/
}

#navTab01 .dropDownWrapper{ left: -283px; }
#navTab02 .dropDownWrapper{ left: -423px; }
#navTab03 .dropDownWrapper{ left: -563px; }
#navTab04 .dropDownWrapper{ left: -703px; }
#navTab05 .dropDownWrapper{ right: 0px; }

.dropDownContainer{
	min-height: 295px;
	background: url(../images/structure/bg-homepage-j.png) right top no-repeat;
	position: relative;
}

.closeDropDown{
	position: absolute;
	width: 48px;
	height: 41px;
	top: 0;
	right: 94px;
}


.closeDropDown a, #feature .closeDropDown a:link, .closeDropDown a:visited{
	background: url(../images/structure/close-dropdown.png) 0 0 no-repeat;
	display: block;
	width: 48px;
	height: 41px;
	text-indent: -9999em;
	font-size: 1%;
	overflow: hidden;
}

.closeDropDown a:hover, .closeDropDown a:active, .closeDropDown a:focus{ background-position: 0 -41px; }

.dropDownContainer .dropdown{
	float: left;
	width: 838px;
	overflow: hidden;
}

.dropDownContainer .withImages { height: 225px; }

.dropDownContainer .withImages li{
    color: #FFF !important;
    display: table;
    float: left;
    font-size: 18px !important;
	font-weight: 600; 
    width: 210px;
	height: 59px;
    line-height: 23px !important;
    margin: 0 0 16px 0px !important;
    overflow: hidden;
    position: relative;
    table-layout: fixed;
}

.dropDownContainer .withImages li.leftItem{
	width: 195px;
}

.dropDownContainer .withImages li a, .dropDownContainer .withImages li a:link, .dropDownContainer .withImages li a:visited{
    color: #FFF;
    display: table-cell;
    height: 46px;
    overflow: hidden;
    padding: 6px 10px 7px 68px;
    vertical-align: middle;
    width: 132px;
	border-left: 1px solid #76b2bf;
}

.ie7 .dropDownContainer .withImages li a, .ie7 .dropDownContainer .withImages li a:link, .ie7 .dropDownContainer .withImages li a:visited{
	display: block;
}

.dropDownContainer .withImages li.leftItem a, .dropDownContainer .withImages li.leftItem a:link, .dropDownContainer .withImages li.leftItem a:visited{
	border: none;
	padding-left: 53px;
}

.navImage {
    left: 15px;
    position: absolute;
    top: 0;
	width: 38px;
	height: 59px;
}

li.leftItem .navImage { left: 0; }

.navText {
    display: block;
    max-height: 46px;
    overflow: hidden;
    width: 132px;
}

.noImages {
	margin: 18px 0;
	padding: 0;
	list-style-type: none;	
}

.noImages li{
	margin: 0 0 5px 0;
	padding: 0 0 0 25px;
	list-style-type: none;	
	background: url(../images/structure/mainNav_bullet.png) 0 6px no-repeat;
	font-weight: normal;
	font-size: 18px;
	width: 175px;
}

.noImages li a{
	color: #FFF;
}

#navBackground{
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: url(../images/structure/bg-mainnav-dropdown.png) 0 0 repeat;
	z-index: 997;
	zoom: 1;
}

.mainNavHover #navBackground{ display: block; }



/* ===================================================================================== BREADCRUMBS  */


#breadcrumbs a, #breadcrumbs a:link, #breadcrumbs a:visited {
	text-decoration: none;
	color: #137F9B;
}

#breadcrumbs a:hover, #breadcrumbs a:active, #breadcrumbs a:focus { text-decoration: underline; }




/* ===================================================================================== ACTIONS  */

#actions .printLink,
#actions .emailLink{
	margin: 0 0 0 18px;
}

#actions .printLink img,
#actions .emailLink img,
#actions .ShareLink img {
	position: relative;
	padding: 0 3px 0 0;
	top: 3px;
}

#actions a, 
#actions a:link, 
#actions a:visited {
	position: relative;
	text-decoration: none;
	float: right;
}

#actions #Share a, 
#actions #Share a:link, 
#actions #Share a:visited {
	float: right;
}

#textSize{
	float: right;
    height: 26px;
    position: relative;
    width: 35px;
	margin: 3px 0 0 0;
}

#actions a.textResize{
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	width: 22px;
	height: 26px;
}
	
#actions a.textPlus, #actions a.textPlus img{
	display: block;
    height: 12px;
    position: absolute;
    right: 0;
    top: 0;
    width: 9px;
}

#actions a.textMinus, #actions a.textMinus img{
	display: block;
    height: 13px;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 9px;
}

.textSize{ 
	float: right;
}

#actions a:focus img{
	outline: 1px solid #858585;
}



/*
   Share Drop-down Styles - see:
   /share/share.css
*/




/* ===================================================================================== SUB NAVIGATION */

.subNav {
	margin: 0;
	padding: 0 0 0 0;
	width: 266px;
	list-style-image: none;
	list-style: none;
	float: left;
	overflow: hidden;
}

.subNav li {
	float: left; /* This corrects the */
	width: 100%; /* IE whitespace bug */
	margin: 0;
	padding: 0;
	list-style-image: none;
	list-style: none;
}


/* ========== 2nd Level ========== */

.subNav li{ border-top: solid 1px #dfdfdf; }
.subNav li:first-child { border-top: none; }

.subNav a, 
.subNav a:link, 
.subNav a:visited {
	display: block;
	padding: 8px 35px 10px 16px;
	width: 215px;
	text-decoration: none;
	color: #000;	
	cursor: pointer;
	overflow: hidden;
}

.subNav .withChildren a, 
.subNav .withChildren a:link, 
.subNav .withChildren a:visited {
	background: url(../images/structure/subnav_arrow_l2_up.png) 244px 11px no-repeat;
}

.subNav a:hover, .subNav a:focus { 
	background-color: #E6E6E7;
	color: #000;
}

.subNav .withChildren a:hover, .subNav .withChildren a:focus { 
	background: url(../images/structure/subnav_arrow_over.png) #E6E6E7 244px 11px no-repeat;
}

.subNav a.current {
	background-color: #257E9A !important; 
	color: #FFF !important;
	padding-top: 16px;
	font-size: 21px;
	line-height: 26px;
}

.subNav .withChildren a.current {
	background: url(../images/structure/subnav_arrow_on.png) #257E9A 235px 25px no-repeat !important;
}

.subNav .withChildren a.open {
	background: url(../images/structure/subnav_arrow_open.png) #257E9A 235px 25px no-repeat !important;
	padding-top: 16px;
	font-size: 21px;
	line-height: 26px;
	color: #FFF !important;
}

.subNav .withChildren a.open:hover, .subNav .withChildren a.open:focus {
	background: url(../images/structure/subnav_arrow_open_over.png) #E6E6E7 235px 25px no-repeat !important;
	color: #000 !important;
}

/* ========== 3rd Level ========== */

.subNav li:first-child ul li{ border-top: solid 1px #26829f;}

.subNav ul a,
.subNav ul a:link,
.subNav ul a:visited {
	padding: 8px 35px 10px 20px;
	width: 202px;
	margin: 0;
	background-color: #1c7590 !important;
	background-image: none !important;
	border-left: solid 9px #2a667c;
	color: #FFF;
}

.subNav ul .withChildren a,
.subNav ul .withChildren a:link,
.subNav ul .withChildren a:visited {
	background: url(../images/structure/subnav_arrow_up.png) #1c7590 235px 11px no-repeat !important;	
}

.subNav ul a:hover, .subNav ul a:focus {
	background-color: #E6E6E7 !important;
	color: #000 !important;
}

.subNav ul .withChildren a:hover, .subNav ul .withChildren a:focus { 
	background: url(../images/structure/subnav_arrow_over.png) #E6E6E7 235px 11px no-repeat !important;
}

.subNav .withChildren ul a.current {
	background-color: #1c7590 !important;
	background-image: none !important;
	color: #FFF !important;
	padding-top: 8px !important;
	font-size: 16px !important;
	line-height: 19px !important;
	border-left: solid 9px #f47424;
}

.subNav .withChildren ul .withChildren a.current {
	background: url(../images/structure/subnav_arrow_on.png) #1c7590 226px 13px no-repeat !important;
}

.subNav .withChildren ul .withChildren a.open {
	background: url(../images/structure/subnav_arrow_open.png) #1c7590 226px 13px no-repeat !important;
	padding-top: 8px !important;
	font-size: 16px !important;
	line-height: 19px !important;
}

.subNav .withChildren ul .withChildren a.open:hover, .subNav .withChildren ul .withChildren a.open:focus{
	background: url(../images/structure/subnav_arrow_open_over.png) #E6E6E7 226px 13px no-repeat !important;
	color: #000 !important;
}


/* ========== 4th Level ========== */

.subNav ul .withChildren ul a,
.subNav ul .withChildren ul a:link,
.subNav ul .withChildren ul a:visited {
	padding: 8px 35px 10px 33px;
	width: 189px;
	background-color: #175e75 !important;
	background-image: none !important;
	border-left: solid 9px #204d5d;
	color: #FFF;	
}

.subNav ul .withChildren ul .withChildren a,
.subNav ul .withChildren ul .withChildren a:link,
.subNav ul .withChildren ul .withChildren a:visited {
	background: url(../images/structure/subnav_arrow_up.png) #175e75 235px 11px no-repeat !important;		
}

.subNav ul .withChildren ul a:hover, .subNav ul .withChildren ul a:focus {
	background-color: #E6E6E7 !important;
	background-image: none !important;
	color: #000 !important;
}
.subNav ul .withChildren ul .withChildren a:hover, .subNav ul .withChildren ul .withChildren a:focus { 
	background: url(../images/structure/subnav_arrow_over.png) #E6E6E7 235px 11px no-repeat !important;
}

.subNav .withChildren ul .withChildren ul a.current {
	background-color: #175e75 !important;
	background-image: none !important;
	color: #FFF !important;
	border-left: solid 9px #f47424;
}

.subNav .withChildren ul .withChildren ul .withChildren a.current {
	background: url(../images/structure/subnav_arrow_on.png) #175e75 226px 13px no-repeat !important;
}

.subNav .withChildren ul .withChildren ul .withChildren a.open {
	background: url(../images/structure/subnav_arrow_open.png) #175e75 226px 13px no-repeat !important;
}

.subNav .withChildren ul .withChildren ul .withChildren a.open:hover, .subNav .withChildren ul .withChildren ul .withChildren a.open:focus{
	background: url(../images/structure/subnav_arrow_open_over.png) #E6E6E7 226px 13px no-repeat !important;
	color: #000 !important;
}

/* ========== 5th Level ========== */

.subNav ul .withChildren ul .withChildren ul a,
.subNav ul .withChildren ul .withChildren ul a:link,
.subNav ul .withChildren ul .withChildren ul a:visited {
	padding: 8px 35px 10px 46px;
	width: 176px;
	background-color: #124A5C !important;
	background-image: none !important;
	border-left: solid 9px #122C36;
	color: #FFF;	
}

.subNav ul .withChildren ul .withChildren ul a:hover, .subNav ul .withChildren ul .withChildren ul a:focus {
	background-color: #E6E6E7 !important;
	background-image: none !important;
	color: #000 !important;
}

.subNav .withChildren ul .withChildren ul .withChildren ul a.current {
	background-color: #124A5C !important;
	background-image: none !important;
	color: #FFF !important;
	border-left: solid 9px #f47424;
}

.subNav .withChildren ul .withChildren ul .withChildren ul .withChildren ul{
    display: none !important;
}



/* ===================================================================================== FOOTER NAVIGATION */

#footerNav a, #footerNav a:link, #footerNav a:visited{
	color: #88dcf0;
	text-decoration: none;
}

#footerNav a:hover, #footerNav a:focus, #footerNav a:active{
    text-decoration: underline;
}

#esol a, #esol a:link, #esol a:visited{
	color: #FFF;
}

