/*
OLD asgard red:	#d4181c
OLD text grey: #555
OLD light grey: #808080

asgard red: #e91115
text grey: 	#333
light grey: #ededed
*/

/* html entities*/
html, body {
	padding:0;
	margin:0;
	background:#fff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:100%;
	color:#333;
}
a {
	color:#e91115;
	text-decoration:underline;
}
a:hover {
	color:#333;
}
p {
	margin:2px 0 8px 0;
}
img {
	border:0;
}
form fieldset {
	border:0;
	margin:0;
	padding:0;
}
/* non specific classes */
.clear {
	clear:both;
}
.flash_ad {
	margin:0 0 10px 0;
}
.flash_ad_right {
	margin:0 0 0 20px;
}

/* IDS */
#page {
	width:100%;
	max-width:1280px;
	margin:20px auto;
	padding:0 10px;
	box-sizing:border-box;
}
#header {
	height:110px;
	position:relative;
	border-left:9px solid #e91115;
	border-bottom:9px solid #e91115;
}
#header h1{
	border-top:9px solid #e91115;
	background:url(../images/asgard_logo.png) no-repeat 50% 50%;
	width:260px;
	height:100px;
	position:absolute;
	margin:0;
}
#header h1 a{
	display:block;
	text-indent:-10000px;
	overflow:hidden;
	height:100%;
	width:100%;
}
#header h2{
	background:url(../images/asgard_slogan.png) no-repeat 50% 0;
	width:180px;
	height:11px;
	display:block;
	text-indent:-1000px;
	overflow:hidden;
	position:absolute;
	right:4px;
	bottom:28px;
}

#header div{ /* need to remove this div from all markup before deleting this selector */
	display:none;
	position:absolute; right:0; top:0;
}
#header p{
	text-align:right;
	line-height:1.1875rem;
	font-size:.875rem;
}
#header p a{
	margin:0 5px;
}
#header form{
	position:absolute;right:0; top:2px;
	vertical-align:middle;
	display:block;
	float:left;
	height:19px;
}
#header form input {
	vertical-align:middle;
}
#header form input.btn{
	height:19px;
}
#header form input.text{
	width:111px;
	height:13px;
	padding:2px;
	border:1px solid #ccc;
	font-size:.875rem;
	color:#ededed;
	font-style:italic;
}
#header form input.input_txt{
	width:111px;
	height:13px;
	padding:2px;
	border:1px solid #ccc;
	font-size:.875rem;
	color:#333;
}

/* NAV */
#nav {
	width:100%;
	z-index:100;
}
#nav ul {
	list-style:none;
	z-index:10000;
}
#nav ul li a{
	color:#8b8a8a;
}
#nav ul li a:hover{
	color:#eee;
	text-decoration:none;
}
#nav ul.primary{
	border-bottom:2px solid #e91115;
	padding:0;
	margin:/*16px*/ 0;
	height:51px;
}
#nav ul.primary li{
	width:20%;
	text-align:center;
	float:left;
	margin:0;
	padding:0;
	position:relative;
}
#nav ul.primary li a{
	text-decoration:none;
	display:inline-block;
	padding:18px 0;
	height:15px;
	width:100%;
	overflow:hidden;
	font-size:1rem;
	color:#777;
}
#nav ul.primary > li > a{
	text-transform:uppercase;
}
#nav ul.primary ul{
	display:none;
	position:absolute;
	left:0;
	height:auto;
	width:100%;
	padding:0;
	margin:0;
	line-height:1rem;
}
#nav ul.primary ul:first-of-type{
	left:12%;
}
#nav ul ul.hover ul {
	position:static;
	box-shadow:none;
}
#nav ul.primary ul li{
	width:100%;
	height:auto;
	float:none;
	text-align:left;
	line-height:1rem;
}
#nav ul.primary ul li a{
	box-sizing: border-box;
	font-size:.875rem;
	overflow:inherit;
	text-indent:0;
	width:100%;
	height:auto;
	padding:8px;
	color:#333;
	border-bottom:1px solid #e91115;
	background:#fff;
	border-top:1px solid #fff;
	line-height:1rem;
}
#nav ul.primary a:hover, #nav ul.primary li.active > a {
	color:#000;
	font-weight:700;
}
#nav ul.primary ul li a.current {
	color:#e91115;
	font-weight:700;
}
#nav ul.primary li.active > a, #nav ul.primary ul li a.current {
	background:#fff url('../images/navOn.png') no-repeat right center;
}
#nav ul ul.hover, #nav ul li.hover a, #nav ul ul.hover ul {
	z-index:1000;
	display:block;
}
#nav ul.primary ul ul li a { /* L3 navigation in dropdown */
	background-color:#efefef !important;
	color:#555;
	padding:8px 4px 8px 16px;
}
#crumbs {
	padding-bottom:6px;
	margin:10px 0 36px;
	font-size:.9rem;
	clear:both;
}
#iconbar {
	position:fixed;
	left:0;
	top:252px;
	width:44px;
	background:#fff;
	border-top:1px solid #ed1f24;
	z-index:1000;
}
#iconbar a {
	width:44px;
	height:50px;
	margin:0;
	display:block;
	text-indent:-800px; /* hide the text fallback */
	background:#fff url('/images/icons.png') 8px 19px no-repeat;
	border-bottom:1px solid #ed1f24;
}
#iconbar a.calculator { background-position:8px -31px }
#iconbar a.business { background-position:8px -82px }
#iconbar a.contact { background-position:8px -133px }
#iconbar a.qlink { background-position:8px -181px }
#right-col {
	position:fixed;
	z-index:10;
	right:0;
	top:252px;
	width:180px;
	box-sizing:border-box;
}
#right-col img, #right-col .carousel {
	width:180px;
	height:180px;
}
/* main content */
#main {
	z-index:100;
	/* position:relative; */
}
#leftCol {
	display:none;
	float:left;
	width:167px;
}
#super_leftCol {
	display:none;
	float:left;
	width:167px;
	_width:0;
}

#content {
	padding:0 200px 0 60px;
	min-height:400px;
	line-height:1.1875rem;
	margin:0;
	padding-bottom:38px;
	background:transparent url('/images/redbar.png') 60px 100% no-repeat;
}
sup, sub {
	line-height:.5rem
}
/*columns*/
.col {
	font-size:.8rem;
}
.col h3 {
	background:#333;
	border-bottom:#444;
	color:#fff;
	padding:5px;
	margin:0 0 3px 0;
	font-size:1rem;
}
/* quick links*/
.quick {
	margin:0;
	padding:0 6px;
	background:#e91115;
	color:#fff;
	font-size:1rem;
	width:180px;
	box-sizing:border-box;
}
.quick a {
	vertical-align:top;
	margin:0;
	padding:0 4px;
	cursor:pointer;
	line-height:1.125rem;
	color:#fff !important;
	width:95%;
	display:block;
	text-decoration:none;
}
.quick a:after{ content:'  >'; position:absolute; right:8px }
.col.quick h3, .subQL {
	background:#e91115;
	color:#fff;
	font-size:.95rem;
	display:block;
}
.col.quick h3 {
	background:#e91115 url('/images/quicklink.png') no-repeat 100% 50% !important;
	border-bottom:1px solid #fff;
}
.endquick {
	border-top:1px solid #fff;
	padding:0 0 2px;
	margin-top:4px;
}
a#quickmore {
	background:transparent url('/images/quickmore.png') no-repeat 100% 50% !important;
	width:auto;
	padding-right:30px;
}
a#quickmore:after { content:''; }
.quick .subQL {
	margin-top:4px;
}
.subQL b {
	font-size:.95rem; display:block; border-bottom:1px solid #a9a9a9;
 }
.subQL, .highlander, .hidden { display:none }
.highlander { background:#f7f7f7; padding:20px; margin-left:12px }
.visible, .shown { display:block !important }
/* footer */
#footer {
	clear:both;
	padding:28px 188px;
	font-size:.75rem;
	margin:0;
	background:#e9e9e9;
	color:#777;
}
#footer a{
	padding:0 10px;
	color:#777;
	white-space:nowrap;
}
/* menu toggle */
.menu-icon {
	background: transparent;
	cursor: pointer;
	display: none;
	font-size:.75rem;
	height: 0;
	right: 4px;
	padding: 2.5em 1.6em;
	position: absolute;
	top: 4px;
	transition: all 0.3s ease 0s;
	width: 2em;
	z-index: 599;
}
.menu-icon .title {
	color: #e91115;
	float: left;
	font-size: 1.4rem;
	font-weight: 300;
	margin-left: 30px;
	margin-top: -11px;
	text-transform: uppercase;
	transition: all 0.5s ease 0s;
}
.menu-icon span {
	display: block;
	position: relative;
}
.menu-icon span, .menu-icon span:after, .menu-icon span:before {
	background-color: #e91115;
	height: 0.2em;
	transition: all 0.8s ease 0s;
	width: 100%;
}
.menu-icon:hover span, .menu-icon:hover span:after, .menu-icon:hover span:before {
	opacity: 0.7;
}
.menu-icon span:after, .menu-icon span:before {
	content: " ";
	margin-top: -0.6em;
	position: absolute;
}
.menu-icon span:after {
	margin-top: 0.6em;
}
.menu-icon.active span {
	background: transparent;
}
.ie .menu-icon.active span {
	background-color: #555;
}
.menu-icon.active span:before {
	background-color:#555;
	transform: rotate(45deg) translate(0.5em, 0.4em);
}
.menu-icon.active span:after {
	background-color:#555;
	transform: rotate(-45deg) translate(0.45em, -0.35em);
}
@media only screen and (max-width: 950px) {
	.menu-icon .title {
		opacity: 0;
	}
}
@media only screen and (max-width: 900px) {
	.menu-icon .title {
		display: none;
	}
}

#content img { width:auto; max-width:100% }
#content .midimage { text-align:center }
@media only screen and (min-width:700px) {
	#content .midimage img { max-width:60% }
}
.floatmenu { float:right; padding:4px; margin:0 4px 4px; border:1px solid #e91115 }
@media only screen and (max-width:778px) {
	#nav ul.primary ul{
		width:168px;
	}
	#nav ul.primary #nproducts ul, #nav ul.primary #nadvisers ul, #nav ul.primary #nemployers ul {
		left:auto;
		right:0;
	}
	#footer { padding:28px }
	#right-col {
		position:relative;
		top:auto;
		left:auto;
		right:auto;
		margin:0 auto;
		width:auto;
		text-align:center;
	}
	#right-col .carousel, #right-col img {
		width:auto;
		max-width:300px;
		height:auto;
		margin:0 auto;
	}
	.quick { display:none }
	#iconbar {
		position:relative;
		top:0;
		left:0;
		margin:0 auto;
		height:50px;
		width:200px; /* change this if more icons */
		background:#fff;
		border-top:0;
		border-left:1px solid #ed1f24;
	}
	#iconbar a {
		display:inline-block;
		border-right:1px solid #ed1f24;
		border-bottom:0;
	}
	#content { min-height:auto; margin-right:0; padding-right:20px }
	#page { margin-top:1.5% }
}
@media only screen and (max-width:550px) {
	#header div.menu-icon { 
		display:block;
	}
	#nav ul.primary {
		height:auto;
		display:none;
	}
	#nav ul.primary li{
		width:100%;
		display:block;
		float:none;
	}
	#nav ul.primary > li{
		padding:2px 0;
		border-bottom:1px solid #fbb6b2;
	}
	#nav ul.primary li a, #nav ul.primary ul li a{
		padding:4px 2px;
		width:100%;
	}
	#nav ul.primary > li > a {
		padding:8px 0;
		width:100%;
	}
	#nav ul.primary ul {
		border:1px solid #e91115;
		position:relative;
		width:100%;
		left:0;
		right:0;
	}
	#nav ul.primary ul li a{
		background:#f8f8f8;
	}
	#iconbar { margin-left:110px; }
}
@media only screen and (max-width:485px) {
	#content { padding:0 20px }
	#header h2{ bottom:-5px; text-align:center; width:100% }
	#iconbar { margin-left:70px; }
	.floatmenu { float:none }
}
@media only screen and (max-width:380px) {
	#header h1{ width:90% }
	#iconbar { margin-left:50px; }
}
@media only screen and (max-width:330px) {
	#iconbar { margin-left:40px; }
	#header h1{ width:100%; }
	#header { border-right:9px solid #e91115 }
}