/* ============================================================= */
/* =================== Main tab styling ======================== */
/* ============================================================= */
/*BP 5/12/17 */

.PfNavSectionWrapper { position:relative; }
.PFNavBttnMn {display:none ; cursor:pointer; width: 100%; border-bottom: 8px solid #A11E18; margin: 0px auto; }
.PFNavBttn {padding:0px;  cursor:pointer;}
.PFNavBttnInnr {padding:5px 19px; background:#3379A3; line-height:125%; color:#ffffff; font-size:18px; font-weight:bold; text-decoration:none; cursor:pointer; text-align: center; }

/* hide the dropdown menu until we're on a smaller screen */
.MobileSubNav { display: none;}

.PfNavWrp {}


.PfNavMn {background: transparent;}
.MenuWrapper, div.MenuWrapperMega {z-index:1000; display:block; margin:0px auto; padding:0px; position:relative; font-weight: 500;}
.MenuWrapper div.PfNav, div.MenuWrapperMega div.PfNav  {margin:auto; z-index:1000; display:block; padding:0px; background:#3379A3; border-radius:7px; -webkit-border-radius: 7px;
-moz-border-radius: 7px;}

/* ============================================================= */
/* =================== Main tab styling (level 0) ============== */
/* ============================================================= */

.MenuWrapperMega ul.pf_lvl_0 {margin:auto; position:static; list-style:none; font-weight:bold; margin:0px; padding:0px; vertical-align:top; display:block; height: 63px; border-bottom: 8px solid #A11E18;}
.MenuWrapperMega li.pf_lvl_0 {display:inline-block; list-style:none; margin:0px; padding: 0px; overflow:visible; width: 20%; float: left; background: url(/Portals/_default/Skins/MASB/images/separator.png) left center no-repeat;}
.MenuWrapperMega li.pf_lvl_0:first-child { background: none;}
.MenuWrapperMega li.pf_lvl_0:hover {z-index:1; padding:0px; }
.MenuWrapperMega li.pf_lvl_0.HasChildren:hover {}

.MenuWrapperMega li.pf_lvl_0 a {display:block; margin:0px 20px 0 10px; padding:0px; line-height:125%; font-size:130%; font-weight:normal; text-decoration:none; color:#fff; cursor:pointer;}
.MenuWrapperMega li.pf_lvl_0 a i { display: block; font-size: 70%; font-style: normal;}
.MenuWrapperMega li.pf_lvl_0:first-child a {}
.MenuWrapperMega li.pf_lvl_0 a span.MenuText {display:block; padding:12px 19px 11px 19px;}
.MenuWrapperMega li.pf_lvl_0:first-child a span.MenuText {border:none;}
.MenuWrapperMega li.pf_lvl_0.Active a {}
.MenuWrapperMega li.pf_lvl_0.Active a span.MenuText {}
.MenuWrapperMega li.pf_lvl_0:hover, #PfNavMega li.active-li, #PfNavMega li.Active   { margin-top: -10px;}
.MenuWrapperMega li.pf_lvl_0:hover a span.MenuText, .MenuWrapperMega li.Active a span.MenuText { padding: 12px 19px 18px 19px;}
.MenuWrapperMega li.pf_lvl_0:hover a, .MenuWrapperMega li.Active.pf_lvl_0 a {color:#ffffff;
    background: #af2120;
    background: -moz-linear-gradient(top, #af2120 1%, #821807 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#af2120), color-stop(100%,#821807));
    background: -webkit-linear-gradient(top, #af2120 1%,#821807 100%);
    background: -o-linear-gradient(top, #af2120 1%,#821807 100%);
    background: -ms-linear-gradient(top, #af2120 1%,#821807 100%);
    background: linear-gradient(to bottom, #af2120 1%,#821807 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af2120', endColorstr='#821807',GradientType=0 );
    text-shadow:0px 1px 1px #000000;}
.MenuWrapperMega li.pf_lvl_0:hover a span.MenuText { }

/*.MenuWrapperMega ul.pf_lvl_0 li.pf_lvl_0.HasChildren .PostMenuDiv {display:none; position:absolute; margin:0px 0px 0px -6px; padding:0px; left:50%; top:auto; width:12px; height:6px; background:url(/Portals/_default/Skins/MASB/images/PostMenuDiv.png) center top no-repeat; z-index:99999;}
.MenuWrapperMega ul.pf_lvl_0 li.pf_lvl_0.HasChildren:hover .PostMenuDiv {display:block;}*/

/* ============================================================= */
/* =================== DropMenu Styling           ============== */
/* ============================================================= */

.MenuWrapperMega div.shadow {overflow:hidden; z-index:9999; position:absolute; padding:0px 0px 20px 0px; margin:0px; width:auto; text-align:center; }
 /* .MenuWrapperMega div.shadow {background:#9F1E17\9;}NOTE: Hack for IE 8 and below to add the background color because IE doesn't like the transparency */
.MenuWrapperMega div.shadow div.InnerMegaDiv {display:inline-block; z-index:1; margin:0px; padding:0px; text-align:center;
    background-color: #851908; opacity:1; /* Color white with alpha 0.9*/ -moz-border-radius:0px 0px 5px 5px; -webkit-border-radius:0px 0px 5px 5px; -khtml-border-radius:0px 0px 5px 5px; border-radius:0px 0px 5px 5px;}

/*******************************mega menu panel display begin *************************/
.MenuWrapperMega div.shadow {display:block; left:-10000px; top:auto; /*CSS3 >>*/opacity:0.0; /* Firefox */ -moz-transition:opacity 0.25s ease 0.1s; /* WebKit */ -webkit-transition:opacity 0.25s ease 0.1s; /* Opera */ -o-transition:opacity 0.25s ease 0.1s; /* Standard */ transition:opacity 0.25s ease 0.1s; /*<< CSS3*/}
.MenuWrapperMega div.shadow div.InnerMegaDiv { padding: 20px;}

li.pf_lvl_0:hover div.shadow{ left:auto; opacity:1;}



/*
JLICHON - removed this @media rule ... not sure if it is needed
@media screen and (min-width:1050px)
{

*/
    
    
/* Made changes to allow menu item to appear the full width. 12/20/2013 per stacy bogard's request*/
/* changing 4th menu item so that it right-aligns relative to the parent tab, instead of to the right edge of the content area */
li#Menu4 { position:relative; } /* JLICHON - added so that the child menu div will absolutely align relative to this LI instead of to the edge of the content area */
li#Menu4:hover div.shadow {right:0px !important; width:510px;} /* JLICHON added width rule, which may need to be adjusted for other media queries, below.   */
li#Menu5:hover div.shadow { right: 0px !important;  left: auto !important; opacity:1;}
/******************************* mega menu panel display end ***************************/



.IconImgBefore {padding:0px 5px; vertical-align:middle;}
.HtmlBeforeLevel0 {display:block; float:left; margin-right:20px;}

#PfNavMega li.Active li.pf_lvl_1 {margin:0px !important; }
.MenuWrapperMega li.pf_lvl_0 div.Column {display:block; float:left; border:none; vertical-align:top; width:215px; margin: 0px 20px 10px 0px;}
.MenuWrapperMega li.pf_lvl_0:hover div.Column {}

/* ============================================================= */
/* =================== Column Heading Styling (level 1) 8F8F8F; ======== */
/* ============================================================= */

.MenuWrapperMega li.pf_lvl_1 a, .MenuWrapperMega li.pf_lvl_0:hover li.pf_lvl_1 a {filter:none !important; background: none; text-shadow: none; margin: 0px 0px 0px 0px; color:#FFFFFF;  }

.MenuWrapperMega ul.pf_lvl_1 {display:inline-block; margin:10px 0px 20px 0px; padding:0px; width:100%; list-style:none; vertical-align:top;}
.MenuWrapperMega li.pf_lvl_1 {display:block; padding:0px; margin:5px 0px 0px 0px; text-align:left; vertical-align:top; clear:both; list-style:none; list-style-type:none;}
.MenuWrapperMega li.pf_lvl_1 a {padding:8px 2px 8px 5px; background:none; border:none; border-bottom:0px solid #b4b4b4; font: "Raleway", sans-serif !important; font-size:14px; font-weight:bold;  text-shadow:none; display:block; color:#8F8F8F;}
.MenuWrapperMega li.pf_lvl_1 a:hover, .MenuWrapperMega li.pf_lvl_1.Active a {color:#F3691C !important;}


/* headings */

#Menu2_Col1_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu2_Col2_L1_1 a {color:#8f8f8f; text-transform: uppercase;}

#Menu3_Col1_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu3_Col2_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu3_Col1_L1_6 a {color:#8f8f8f; text-transform: uppercase;}


#Menu4_Col1_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu4_Col2_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu4_Col1_L1_4 a {color:#8f8f8f; text-transform: uppercase;}


#Menu5_Col1_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu5_Col1_L1_7 a {color:#8f8f8f; text-transform: uppercase;}
#Menu5_Col2_L1_1 a {color:#8f8f8f; text-transform: uppercase;}
#Menu5_Col2_L1_10 a {color:#8f8f8f; text-transform: uppercase;}
/* ============================================================= */
/* =================== Menu item styling (level 2) ============= */
/* ============================================================= */

.MenuWrapperMega ul.pf_lvl_2 {display:block; margin:5px 0px 0px 0px; padding:0px 0 0 5px; list-style:none; color: #fff !important; list-style-position: outside; }
.MenuWrapperMega li.pf_lvl_2 { /*position:relative;*/ background:none; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; text-align:left; vertical-align:top; border:none; border-bottom:0px solid #999999; list-style-type: none; }
.MenuWrapperMega li.pf_lvl_2 a {padding:10px 0px; margin:3px 0px; color:#e5e5e5; font-weight:normal; line-height:125%;  border:none; display:inline-block; color: #fff !important; text-transform: none !important;}
.MenuWrapperMega li.pf_lvl_2 a { font-size: 100% ;}
.MenuWrapperMega li.pf_lvl_2 a:hover, .MenuWrapperMega li.pf_lvl_2.Active a {color:#F3691C !important;}
.MenuWrapperMega ul li ul li ul li {list-style-type:disc;}

/* ============================================================= */
/* =================== Menu item styling (level 3) ============= */
/* ============================================================= */

.MenuWrapperMega ul.pf_lvl_3 {margin:5px 0px 15px 15px;}
.MenuWrapperMega li.pf_lvl_3 {border:none; background:none;}
.MenuWrapperMega li.pf_lvl_3:hover {border:none; background:none;}
.MenuWrapperMega li.pf_lvl_3:hover a {}
.MenuWrapperMega li.pf_lvl_0:hover li.pf_lvl_3 a {padding:3px 8px; margin:0px; line-height:125%;}
.MenuWrapperMega li.pf_lvl_0:hover li.pf_lvl_3 a:hover, .MenuWrapperMega li.pf_lvl_0:hover li.pf_lvl_3.Active a {}

/* IE7 RULES */
.MenuWrapperMega li.pf_lvl_0 {!display:inline;}
.MenuWrapperMega li.pf_lvl_0 div.Column {!display:inline;}

/* rules for the smallest screen menu*/
@media screen and (min-width:0px) and (max-width:770px)
{
	
	.PgHdr {}
	.PgCntnt {width:100%;}
	.PgCntntBrdrOttr {padding:0px; background:none;}
	.PgCntntBrdrInnr {padding:0px; background:none;}
	
	.PgHdr {display:block; padding:10px 0px 20px 0px;}
	.HdrLg {float:none; padding:0px; clear:both;}
	.HdrLg a {display:block; margin:0px; padding:0px; text-decoration:none; border:none; text-align:center;}
	.HdrLg a img {text-decoration:none; border:none;}
	.HdrCntrls {float:right; padding:0px 0px 10px 0px;}
	.HdrCntrls ul {}
	.HdrCntrls ul li {}
	.HdrCntrls ul li:first-child {}
	.HdrCntrls a, .HdrCntrls a:link, .HdrCntrls a:visited, .HdrCntrls a:active, .HdrCntrls a:hover {}
	
	.LftPn {float:none; width:100%;}
	.RghtPn {float:none; width:100%;}
	
	.PfNavWrp {display:inline-block; position:relative; width:100%; z-index:1000;}
	
	.PFNavBttnMn {display:block;}
	
	.PfNavMn {display:none; position:absolute; left:0px; top:auto; width:100%;}
	
	/* remove hover states, so that all sub menus are hidden. this will trigger the script to create on-click events */
	li.pf_lvl_0:hover div.shadow, li#Menu5:hover div.shadow { left:auto; opacity:1; display:none;}
	.MenuWrapperMega div.shadow div.InnerMegaDiv { opacity:1; display: inline-block; width:100%;  }
	.MenuWrapper div.PfNav, div.MenuWrapperMega div.PfNav {display:inline-block; position:static; width:100%; background:none;}
	
	.MenuWrapperMega ul.pf_lvl_0 {display:block; background:none; border:none;}
	.MenuWrapperMega li.pf_lvl_0 {display:block; float:none; padding:0px; width:100%; border:none; background:none; border-bottom: solid 1px #ffffff;}
	.MenuWrapperMega li.pf_lvl_0:hover {border:none;border-bottom: solid 1px #ffffff;}
	
	/* root level menu */
	.MenuWrapperMega li.Active.pf_lvl_0 a, .MenuWrapperMega li.pf_lvl_0 a
		{ background: #3379A3; border-bottom: none;} /* for the accordion menu, set "active" as inactive */
	.MenuWrapperMega li.pf_lvl_0:hover, #PfNavMega li.active-li, #PfNavMega li.Active { margin-top: 0px;} /* reverse the negative margin rule that is used on the mega menu */
	/* set the padding for the hover/active states of the accordion menu to be the same as the inactive state */	
	.MenuWrapperMega li.pf_lvl_0:hover a span.MenuText, .MenuWrapperMega li.Active a span.MenuText { padding:12px 19px 11px; }
	.MenuWrapperMega li.pf_lvl_0 a.ClickedA 
		{color:#ffffff;
		background: #af2120;
		background: -moz-linear-gradient(top, #af2120 1%, #821807 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#af2120), color-stop(100%,#821807));
		background: -webkit-linear-gradient(top, #af2120 1%,#821807 100%);
		background: -o-linear-gradient(top, #af2120 1%,#821807 100%);
		background: -ms-linear-gradient(top, #af2120 1%,#821807 100%);
		background: linear-gradient(to bottom, #af2120 1%,#821807 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#af2120', endColorstr='#821807',GradientType=0 );
		text-shadow:0px 1px 1px #000000;}
	
	.MenuWrapperMega li.pf_lvl_0 a {border:none; text-align:left;}
	
	.MenuWrapperMega li.pf_lvl_0 div.Column { display:block; margin:0px; padding:0px; width:100%;}
	
	.MenuWrapperMega ul.pf_lvl_1 ul {display:none;}
	.MenuWrapperMega li.pf_lvl_0.ClickedLi div.shadow {display:none; left:0px; opacity:1;}
	.MenuWrapperMega div.shadow {display:none; position:static; padding:0px;}
	.MenuWrapperMega div.shadow div.InnerMegaDiv {padding:0px 0px 20px 0px; -moz-border-radius:0px; -webkit-border-radius:0px; -khtml-border-radius:0px; border-radius:0px;}
	
	
	.MenuWrapperMega li.ClickedLi a, .MenuWrapperMega li.pf_lvl_0:hover a, .MenuWrapperMega li.Active a { color:#fff; text-shadow:none;}
	.MenuWrapperMega li.pf_lvl_0 a.ClickedA { }
	.MenuWrapperMega li.ClickedLi a span.MenuText {background:none;}
	
	.MenuWrapperMega ul.pf_lvl_1 {margin:0px;}
	
	
	.MenuWrapperMega li.pf_lvl_1 {display:block; padding:12px 19px 0px 19px;}
	.MenuWrapperMega li.ClickedLi li.pf_lvl_1 a {padding: 12px 0px 0px 0px; background:none; border:none; border-top: solid 1px #c0c0c0;  font-size:14px; font-weight:bold; color:#f4f4f4; text-shadow:none;}
	
	.MenuWrapperMega ul.pf_lvl_2 {margin: 5px 0px; padding: 15px; background:#fefefe; list-style-type: none;}
	.MenuWrapperMega ul.pf_lvl_2 li {  list-style-type: none; border-bottom: solid 1px #909090; }
	.MenuWrapperMega ul.pf_lvl_2 li:last-child { border:none;}
	.MenuWrapperMega li.ClickedLi li.pf_lvl_2 a {padding: 8px 0px; margin:0px; border:none; color:#333333; font-size:12px; font-weight:normal; line-height:125%;}
	.MenuWrapperMega li.ClickedLi li.pf_lvl_3 a {padding:3px 8px; margin:0px; line-height:125%;}
	.MenuWrapperMega li.pf_lvl_0:hover li.pf_lvl_2.Active a {color:#333333; text-decoration:none; border:none;}

    .MenuWrapperMega li.pf_lvl_0 a span.MenuText { padding-left: 20px !important;}
    .MenuWrapperMega li.pf_lvl_0 a { margin: 0;}
    
    /* drop down sub-nav rules */
    .MobileSubNav { display: block; margin: 25px 0px 10px 10px;}
    .Root_DropDownSubWrapper { font-weight: bold;  font-size: 18px;}
    .MobileSubNav  select { width: 300px; }
    
}

@media screen and (min-width:771px) and (max-width:1023px)
{
	
	.MenuWrapperMega div.shadow div.InnerMegaDiv { padding:3%;}
	.MenuWrapperMega li.pf_lvl_0 a { margin: 0 10px 0 5px;}
	.PgCntnt {width:100%; max-width:960px;}
	.PgCntntBrdrOttr {padding:0px;}
	.PgCntntBrdrInnr {padding:0px;}
	
	.HdrLg {padding:0px;}
	.HdrCntrls {float:right; padding:0px 10px;}
	
	/* some menus need 2 columns, and some need 3.  3 columns is the default */
	/* JLICHON - seems like 2 columns is the default, so changing column width from 29% to 45% - over-ridden for menu 5, below */
	.MenuWrapperMega li.pf_lvl_0 div.Column {width:40%;}


	/*JLICHON - removed menus 1 and 3 from this rule, and changed width to 29%, which should work well for menu 5 which has 3 columns */
	.MenuWrapperMega li#Menu5.pf_lvl_0 div.Column 
		{width:29%;}

	/* JLICHON - at this tablet size, the 4th menu width needs to be less */
	li#Menu4:hover div.shadow {width:390px;} 
}
@media screen and (min-width:1024px)
{

}