﻿#site-navigation { height:36px; font-size:1.1em; letter-spacing:0.025em; font-weight:700; padding-top: 38px; z-index:3; z-index:20; }
#site-navigation ul.nav-menu { margin:0; padding:0; }
#site-navigation ul.nav-menu li { display:inline-block; margin:0; padding:0; }
.nav-menu > ul { text-align:right; margin:0; padding:0; }
.nav-menu a:link { text-decoration:none; }
.nav-menu { /*width: 608px;*/ margin-left: 305px; font-size : 1em; }
.nav-menu ul { margin: 0; padding: 0; list-style-type: none; }
.nav-menu > ul ul { display: none; } /* hiding second level links */

/* level 1 */
ul.nav-menu li {  }

.nav-menu > ul > li { text-align: center; position: relative; }
.nav-menu > ul > li > a:link, .nav-menu > ul > li > a:visited { display: inline-block; padding: 4px 15px; }

.nav-menu > ul > li > a.whitelink:link, .nav-menu > ul > li > a.whitelink:visited { color: #fff; text-shadow: 5px 2px 5px #000 }
.nav-menu > ul > li > a.blacklink:link, .nav-menu > ul > li > a.blacklink:visited { color: #000; text-shadow: none; }

.nav-menu > ul > li > a:hover { color:#930000; text-shadow: none; background:#ccc;  }
.nav-menu > ul > li:hover, .nav-menu > ul > li.selected { background:#ccc; } /* background turn #ccc when the tab was moused over - indicating current tab */

.nav-menu > ul > li:hover a, .nav-menu > ul > li.selected a,   /* text turn red when the tab was moused over - indicating current tab */
.nav-menu > ul > li:hover a.whitelink, .nav-menu > ul > li.selected a.whitelink,
.nav-menu > ul > li:hover a.blacklink, .nav-menu > ul > li.selected a.blacklink  { color:#930000; text-shadow: none;  }

li.home-nav { margin-left: 89px !important; }

/* level 2 */

.nav-menu > ul > li:hover > ul { width: 200px; position: absolute; right:0; z-index: 100; text-align: left; font-size:.85em; font-weight:400;  background:#efefef;  } 
.nav-menu > ul > li > ul > li { width: 100%; position: relative; }
.nav-menu > ul > li:hover > ul li a:link { display: block; padding: 4px 15px; border-bottom: 1px solid #fff; background:#efefef; color:#000; }
.nav-menu > ul > li:hover > ul li a:hover { background:#ccc; color:#930000; }

.nav-menu li li a:link, .nav-menu li li a:visited { color:#000; border-bottom: 1px solid #fff; }

.nav-menu > ul > li.navNode-2:hover > ul,
.nav-menu > ul > li.navNode-3:hover > ul { left:0; }

/* ............................................ 
	menu-toggle
............................................. */

.nav-menu ul.nav-menu, .nav-menu div.nav-menu > ul { display: none; }
.nav-menu ul.nav-menu.toggled-on, .menu-toggle { display: inline-block; }

/* Buttons */
.menu-toggle {
	/*padding: 6px 10px;
	padding: 0.428571429rem 0.714285714rem;*/
	width:40px;
	height:30px;
	font-size: 11px; font-size: 0.785714286rem;
	line-height: 1.428571429;
	font-weight: normal;
	color: #7c7c7c;
	background-color: #ebebeb;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: linear-gradient(top, #f4f4f4, #e6e6e6);
	background: url("/100/Style%20Library/sac100-SP2013/images/100-toggle-menu.png") no-repeat;
	
	border: 1px solid #d2d2d2;
	box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1);
	border-radius: 5px;
	text-indent: -9999px;
}
.menu-toggle { cursor: pointer; }

.menu-toggle:hover {
	color: #5e5e5e;
	background-color: #ebebeb;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -ms-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -webkit-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: -o-linear-gradient(top, #f9f9f9, #ebebeb);
	background-image: linear-gradient(top, #f9f9f9, #ebebeb);
	background: url("/100/Style%20Library/sac100-SP2013/images/100-toggle-menu-hover.png") no-repeat;
}
.menu-toggle:active {
	color: #757575;
	background-color: #e1e1e1;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -ms-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -webkit-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: -o-linear-gradient(top, #ebebeb, #e1e1e1);
	background-image: linear-gradient(top, #ebebeb, #e1e1e1);
	box-shadow: inset 0 0 8px 2px #c6c6c6, 0 1px 0 0 #f4f4f4;
	background: url("/100/Style%20Library/sac100-SP2013/images/100-toggle-menu-hover.png") no-repeat;
}

@media screen and (max-width: 768px) {
.nav-menu { margin-left:0; width:100%; max-width: 743px; }

} /* end of media queries */

@media screen and (min-width: 481px) {

.nav-menu ul.nav-menu,
.nav-menu div.nav-menu > ul { display: inline-block !important; text-align:right; }
.nav-menu ul  { margin:0; text-indent:0; }
.nav-menu li a,
.nav-menu li  { display: inline-block; text-decoration: none; }
.nav-menu li ul    { display: none; margin: 0; padding: 0; position: absolute; top: 100%; z-index: 1; }
.nav-menu li ul ul { top: 0; left: 100%; }
.nav-menu ul li:hover > ul { border-left: 0; display: block; } 
.menu-toggle { display: none; }

} /* end of media queries */

@media only screen and (max-width:480px) {

#header { width:100%; }
.menu-toggle { margin-left:5%; }

#site-navigation { clear:both; height:auto; padding-top: 15px;  }

.main-navigation ul li:hover ul { display:none; } /* hiding level 2 and 3 menus */
.main-navigation { width:100%; clear:both; margin:0 auto; border-top: none; }

h3.menu-toggle { text-transform:uppercase; }
.menu-toggle { font-size: 115%; }

.nav-menu { width:90%; height:auto; margin:0 auto 30px auto; border-top: none; }
.nav-menu > ul { text-align:center;  }

.nav-menu ul {
	width:100%;
	height:auto;}

.nav-menu ul li {
	clear: both;
	
	text-align: center;
	padding: 0;
	margin:0;
	z-index:20;
	font-size: 100%; }
	
#site-navigation ul.nav-menu li { display:block; text-align:left;  background:none; }
	
#site-navigation a, #site-navigation a:link, #site-navigation a:visited { color:#666; display:block; background:#f8f8f8; text-shadow:none;line-height :40px; padding: 5px 20px; margin: 0 0 2px 0; border-bottom:1px solid #efefef; }
#site-navigation a:hover { color:#fff; background:#000; } 
li.home-nav { margin-left: 0 !important; }

} /* end of media queries */