/* Main stylesheet, 4 of 9: main navigation and drop-downs, the stuck nav, My Account, the mobile grid. */
.navbar2 {
	list-style-type: none;
	margin: 0;
	border-radius: 3px;
	text-align: right;
	border-bottom: none;
	height: 40px;
	width:1199px;
	margin-top: -1px;
}

.navbar2 li {
	display: inline;
	padding: 5px;
	position:relative;
	zoom:1;
	vertical-align:middle;
	line-height: 14px;
	margin-top: -1px;
}

.navbar2 li:last-child {
	padding-right:0;
}

.navbar2 .navi-item-link, .navbar2 .navi-item-link:visited {
	color: #555;
	padding-top: 10px;
	text-decoration: none;
	text-transform:none;
	display:inline-block;
	border-bottom: none;
	height: 40px;
	padding:10px 12px;
	margin-top: 6px;
	font-weight: 500;
	font-size: 14px;
	position: relative;

	-moz-transition: color .2s ease;
	-ms-transition: color .2s ease;
	-webkit-transition: color .2s ease;
	transition: color .2s ease;

}

.breadcrumb, .breadcrumb-brand {
	font-size:13px;
	margin:25px 0px;
}

.breadcrumb a, .breadcrumb a:visited,
.breadcrumb-brand a, .breadcrumb-brand a:visited {
	font-weight: 300;
	padding: 0px 6px;
	color: #696969;
	text-decoration: underline;
}

.breadcrumb a:hover,
.breadcrumb-brand a:hover {
	text-decoration:none;
}

.small-logo {
	opacity:0;
	float: left;
}

.small-logo img {
	float: left;
	margin-top:-70px;
	height: 40px;
	width: auto;
	visibility:hidden;
	-webkit-transition:all .2s ease;
	-moz-transition:all .2s ease;
	-ms-transition:all .2s ease;
	transition:all .2s ease;

}

.transform-scale {
	opacity:1;

}

.transform-scale img {
	display:block;
	margin-top: 2px;
	visibility: visible;
}

.my-account-button {
	background:#5BA1DA;
	height:39px;
	cursor:pointer;
	-webkit-transition:all .2s ease;
	-moz-transition:all .2s ease;
	-ms-transition:all .2s ease;
	transition:all .2s ease;
	position: relative;
	z-index: 999;
	font-family: var(--njr-font-proxima-nova);
	font-weight:500;
	font-size:17px;
	padding-top:2px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.my-account-button:hover {
	background:#2B7EB6;
}

.my-account-button:hover > .my-acct-threeline > .navicon-line {
	background-color:var(--njr-brand-yellow);
}

.account-name {
	float:right;
	color:#FFF;
	font-size:15px;
	padding:8px 18px 0px 4px;
	font-weight:600;

}

.user-info {
	width: 100%;
	text-align: left;
	color: #5F5F5F;

}

.user-info td {
	word-break:break-word;
	padding: 10px 0px;
	border-bottom:1px solid #C7D3DB;
}

.user-info:after {
	content:"";
	display:table;
	clear:both;
}

.user-info td:nth-child(even) {
    color: #648294;
    padding-left:7px;
}

.user-info-img {
	float:left;padding:10px;
	display: none;
}

.user-info img {
	border-radius:100px;
	height:120px;
	width:120px;

}

.user-info-container {
	padding:0 9px;
	font-weight: 400;
	font-size:13px;
	width: 95%;
}

.user-info-detail {
	padding-left: 15px;
	padding-right: 0;
	padding-top: 5px;
	line-height:20px;
}

.user-info table {
	width:100% !important;
	border-collapse: collapse;
}

.user-info-head {
	padding-top: 0px;
	font-size: 14px;
	font-weight: 600;
	padding: 10px;
	margin-bottom: 5px;
	background-color: #7990A4;
	color: #FFF;
	border-top: 3px solid #CFCFCF;
	padding-left: 15px;
	margin-top: 0;
}

.my-acct-threeline {
	width: 51px;
	float: left;
	padding: 7px 13px;

	padding-top:8px;
}

.my-account-menu {
	opacity:0;
	visibility:hidden;
	-webkit-transition:all .3s ease;
	-moz-transition:all .3s ease;
	-ms-transition:all .3s ease;
	transition:all .3s ease;
	position:absolute;
	width: 350px;
	z-index:99999;
	right:0;
	box-shadow: 3px 2px 6px rgba(187, 187, 187, 0.22);
	padding: 16px 0px;
	padding-top:0;
	border: 1px solid #E5E5E5;
	border-top: none;
	background: #F6F6F6;
}

.stuck{
	position:fixed;
	z-index:6;
	margin-top:0;
	padding-top:7px;

	opacity:.8;
	background: var(--njr-brand-blue-dark);
	border-bottom: none;
	border-top: 2px solid var(--njr-brand-blue-dark);
	border-top-width: 56px;
    padding-bottom: 10px;
	 top: -56px;

	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);

}

/* Signed-in admins: keep the stuck nav and the mobile navbar below the WordPress admin bar
   (32px; 46px at 782px and narrower; at 600px and narrower the bar scrolls with the page). */
.admin-bar .stuck {
	top: -24px;
}

.admin-bar .sb-navbar {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .sb-navbar {
		top: 46px;
	}
}

@media screen and (max-width: 600px) {
	.admin-bar .sb-navbar {
		top: 0;
	}
}

.stuck:hover {
	opacity:1;
}

.stuck #nav {
	border-bottom:none;
}

.stuck a.navi-item-link {
	border-bottom: none !important;
	color: #FFF !important;
	height:46px;
	position: relative;
	z-index: 999;
}

.stuck .navbar-item:hover a.navi-item-link{
	color: #74C7F3 !important;
	font-weight: 500 !important;
	border-bottom: none !important;
}

.stuck .current-menu-item a {
	background:#294F74 !important;
	height: 35px !important;
	border-radius: 4px;
}

.stuck .current-dropdown {
	background: none;
}

.menu-is-open {

	height:44px;
	border-radius:0;

}

.my-account-menu.is-open {
	opacity:1;
	visibility:visible;

}

.my-account-menu ul {
	list-style:none;
	font-family:var(--njr-font-proxima-nova);
	font-weight:400;
	font-size: 12px;
	padding: 10px 12px;
	width: 91%;
	text-align: left;
	margin: 0 auto;
}

.my-account-menu ul:after {
	content:"";
	display:table;
	clear:both;
 }

.my-account-menu li {
	color: #FFFFFF;
	font-size: 13px;
	-webkit-transition:all .2s ease;
	-moz-transition:all .2s ease;
	-ms-transition:all .2s ease;
	transition:all .2s ease;
	display:inline-block;
	clear:both;
	float:left;
	padding: 1px;
	width: 100%;
	margin-bottom: 3px;
	border-radius: 10px;

}

.my-account-menu a.menu-link {
	display:block;
	cursor:pointer;
	text-decoration:none;
	font-family:var(--njr-font-proxima-nova);
	font-weight: 600;
	font-size: 13px;
	-webkit-transition:all .2s ease;
	-moz-transition:all .2s ease;
	-ms-transition:all .2s ease;
	transition:all .2s ease;
	height: auto;
	float:none;
	color: #FFFFFF;
	background: #5BA1DA;
	margin:0px;
	border-radius: 4px;
	padding: 8px 10px;
	text-transform:none;
}

a.menu-link:hover {
	color: #FFF;
	background:#1175A8;

}

.my-acct-links {
	width:100%;
	overflow:auto;
}

#saved {
	color:#34C072;
	font-weight:500;
	font-size:17px;
}

.my-acct-info .blue-button {
	margin-top:0;
}

.sb-slidebar {
	font-family: var(--njr-font-proxima-nova);
	font-size:13px;
	font-weight:400;
}

.menu-whiteBg {
	background:#FFF;text-align:left;padding:18px;
}

.slide-logo {
	width: 80%;
	height: auto;
	max-width:200px;
}

.menu-whiteBg.menu-logo {
	padding-bottom:15px;
	text-align:center;
	border-bottom:1px solid #EEE;
}

.menu-whiteBg.menu-member {
	padding:10px 0px;
	text-align:center;
	border-bottom:1px solid #EEE;
	color:#222;
}

li.acct-link-header {
	text-transform:uppercase;
	font-size:13px;
	border-bottom:none;
	color: #676767;
	padding:10px 0px;
	border-top: none;
	border-radius:0;
}

.slides img {

	margin: 0 auto;
	height: 400px;

}

.navbar-default {
	display:none;
	background:#5AAEF0;
}

#sb-site {

	padding-bottom:0px;
}

.mobile-greeting {
	float: left;
	padding-top: 15px;
	color: #FFF;
	font-family: var(--njr-font-proxima-nova);
	font-weight: 700;
	font-size: 16px;
	min-width:180px;
	padding-left:20px;

}

.sb-toggle-left {
	transition: all .8s ease;
}

.growShrink {
	-webkit-transform: scale3d(1.6,1.5,2) rotate(180deg);
	-moz-transform: scale3d(1.6,1.5,2) rotate(180deg);
	-ms-transform: scale3d(1.6,1.5,2) rotate(180deg);
	transform: scale3d(1.6,1.5,2) rotate(180deg);
	background: #2690C2;


}

.peek {
	-webkit-transform:translate(150px);
	-moz-transform:translate(150px);
	-ms-transform:translate(150px);
	transform:translate(150px);
}

.hide-button {
	visibility:hidden;
	display: none;
}

.sub-menu-open {
	max-height:1000px !important;
}

.active-sub {
	color: #E8930F !important;
	font-weight: 700 !important;
}

.grid-row {
	display:table;
	width:100%;
	margin:10px 0px;
}

.grid-box {
	position: relative;
	float: left;
	padding: 23px 61px 23px 21px;
	border: 0px solid #5098D5;
	width: 31%;
	border-radius: 0;
	margin: 15px 10px;
	background: #408EC7;
	color: #FFF;
	height: 303px;
    line-height: 22px;
    font-weight: 500;
	-webkit-transition: all .4s ease-in;
	-moz-transition: all .4s ease-in;
	-ms-transition: all .4s ease-in;
	transition: all .4s ease-in;
	border-top-right-radius: 0px;

}

.grid-box:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	border-top: 60px solid #FFF;
	border-left:60px solid #2C6FA0;
	width: 0;
}

.blink-on {

	opacity:.85;
}

.highlight {
	background:#0184C8;
	opacity:1;
}

.grid-box a, .grid-box a:visited {
 	color: #FFD25E;
}

.grid-box-title {
	font-weight:700;
	font-size:20px;
	color: #FFD25E;
}

.grid-title-nolink {
	color:#FFF;
	font-weight:700;
	font-size:20px;
}

.cefaq-answers {
	padding:10px 0px;
	display:none;
}

.cefaq-fixed-bar {
	position: fixed;
	bottom: 0px;
	left: 50%;
	display: none;
	overflow: hidden;
	-webkit-transform: translateZ(0);
	   -moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		    transform: translateZ(0);
}

.cefaq-bar-inner {
	background: #479ED3;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
}

.cefaq-bar-inner a, .cefaq-bar-inner a:visited {
	color: #FFF;
	text-transform: uppercase;
	font-size: 14px;
	display: block;
	padding: 5px 20px;
	background: #479ED3;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}

.cefaq-bar-inner a:hover {
	background:#2372A1;
	text-decoration:none;
}

.cefaq-reached-footer {
	position:absolute;
	bottom:-61px;
}

.nav-menu-dropdown {
    position: absolute;
    padding: 0px;
    display: none;
    z-index: 999;
    top: 37px;
    width: 300px;
    text-align: left;
    border: 1px solid #797979;
    border-radius: 2px;
    overflow: hidden;
    background: rgba(72, 72, 72, 0.98);

}

.stuck div.nav-menu-dropdown {
	top:42px;
}

.dropdown-left {
	left: 5px;
}

.dropdown-right {
	right: 0px;
}

.dropdown-member {
	right:0px;
}

.dropdown-edu {
	right:10px;
}

.dropdown-res {
	right:9px;
}

ul.nav-menu-ul {
	list-style: none;
	font-size: 12px;
	color: #2278B6;
	font-weight: 100;
	position:relative;
	padding:0px;
	padding-bottom:0;
}

ul.nav-menu-ul li {
	display: inline-block;
	width:100%;
	font-weight: 300;
	border-bottom: 1px solid #5d5d5d;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	transition: all .2s ease;
	padding:0;
}

ul.nav-menu-ul li:hover {
	background: #728C9B;
}

ul.nav-menu-ul li:last-child {
	border:none;

}

ul.nav-menu-ul li a {

	border-radius:0px;
	margin-top:0;
	font-size:12px;
	font-weight:600;

	color: #FFF;
	padding:12px;
	display:block;
	-webkit-transition: all .35s ease;
	-moz-transition: all .35s ease;
	-ms-transition: all .35s ease;
	transition: all .35s ease;

}

.nav-menu-arrow {
	width: 0;

	display: inline-block;
	overflow: hidden;
	-webkit-transition: all .5s ease;
	color: #FFC051;
	font-size: 18px;
	vertical-align: middle;
	padding-bottom: 6px;
	opacity:0;
	margin-left: -10px;
	padding-right: 10px;
}

.nav-menu-ul li a:hover > .nav-menu-arrow {
	width: 10px;

	padding-left: 15px;
	opacity:1;

}

ul.nav-menu-ul li a:hover {

	background: #74ACD2;
    color: #FFFFFF !important;
    text-decoration: none;
}

.show-dropdown {
	display: block;
}

.dropdown-header {
	background: #E7B05C;
	color: #FFF;
	font-weight: 700;
	font-size: 11px;
	text-transform: uppercase;
	padding: 5px 7px;
	display:none;
}

a.current-dropdown {
	background: #FFFFFF;
    color: #2888BB !important;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

/* Keyboard focus in the main nav looks like hover, with a ring, and keeps the drop-down open while focus is inside it. */
.navbar2 .navi-item-link:focus-visible {
	color: #2888BB;
	outline: 2px solid var(--njr-brand-blue-light);
	outline-offset: -2px;
	border-radius: 5px;
}

.stuck .navbar2 .navi-item-link:focus-visible {
	color: #74C7F3 !important;
}

.navbar2 .navbar-item:not(.current-menu-item):focus-within > .nav-menu-dropdown {
	display: block;
}

ul.nav-menu-ul li a:focus-visible {
	background: #74ACD2;
	color: #FFFFFF !important;
	text-decoration: none;
	outline: 2px solid #FFFFFF;
	outline-offset: -2px;
}

span.media-new {
font-size: 14px;
color: #FFF;
font-style: italic;
background: #FFA500;
padding: 4px 13px 4px 11px;
border-radius: 3px;
display: none;
vertical-align: middle;
margin-left: 4px;
}

@media only screen and (max-width: 1540px) {

.grid-box {
		height:300px;
	}

.slides img {
		width:90% !important;
		max-height:400px !important;
		height:auto !important;
	}

.navbar2 {
		width: 979px;
	}

}

@media only screen and (max-width: 1020px) {

.small-logo {
		display:none;
	}

.navbar {
		text-align:left !important;
	}

.stuck {
		position:relative;
	}

.navbar-default {
		display:block;
	}

.grid-row {
		display:block;
	}

.grid-box {
		width:48%;
		margin:4px;
		height: 270px;
		font-size: 90%;
	}

}

@media only screen and (max-width: 780px) {

.my-acct-icon-links .col-sm-3 {
		float:none;
		clear:both;

	}

.grid-box {
		height:330px;
	}

.slides img {
		max-height: 240px !important;
	}

}

@media screen and (max-width: 480px) {

.grid-box {
		width:98%;
		height:auto;
		font-size:100%;
	}

}