@charset "utf-8";
/* */
/* This is the CSS stylesheet when the browser is printing to a physical printer. */
/* You might want to find out if there is print stylesheet from vanilla that is better configured*/
/* */
body,
h1,h4,h5,h6,
#headerUserName,
.headerUserName_createdOnDate,
#headerNavBar a.sectionLink,
.benTitleLeft,
.benTitleRight,
.dataTable thead th,
.dataTable thead td,
.dataTable tfoot tr th,
.dataTable tfoot tr td,
.asOfDate, .asOfDateInline, .subhead,
.benTitleRight_subhead, .benDetailRight_overhead,
.benDetailWrapper_bigNumber,
.benDetailRight_bigNumber,
.sidebar a:link,
.sidebar a:visited,
.sidebar a:hover,
.sidebar a:active,
.learnMore,
.sectionHeader,
.panel-heading a,
.ceo_signature,
.hero_text,
.hero_textBold,
.tile h3,
.tile h3 b,
.tile_label,
.tile_number,
.dashboard h3,
.dashboard h3 b{
  font-family: Arial, sans-serif;
}

b, strong {  font-family: Arial, sans-serif; }



/****  BASIC HTML  ****/
html {font-size: 14px;}
body {padding-top: 0rem; margin-top: 0rem; width: 100%; max-width:640px; margin: auto; background:#ddd;}
a:link, a:visited, a:hover, a:active  {text-decoration: none; color: #444;}
h1 {font-size: 2rem; clear: both; background: none !important; color: #444 !important;padding-bottom: 0rem;}
h1 i.icon-angle-up {display: none;}
h1 i.icon-angle-down {display: none;}
h2 {font-size: 1.75rem;}
h3 {font-size: 1.5rem;}
h4 {font-size: 1.3rem; color: #444; }
h5 {font-size: 1.2rem;}
h6 {font-size: 1.0rem;}


/****  GOOD PRINTING PRACTICES FROM HTML5 BOILERPLATE  ****/
a[href]:after { content: none; }		/*hides link URLs from appearing*/
thead {width: 100%; display:table-row-group;} 	/* prevents table headers overlap of content on two pages. NOTE: overriding display: table-head-group  */
thead, tfoot, tr, td, th, img { page-break-inside: avoid; }	/*try not to break inside a row*/
img { max-width: 100% !important; }		/*make images as wide as possible*/
p, h2, h3 { orphans: 3; widows: 3; }	/*don't leave dangling line of text*/
h1, h2, h3, h4, h5, h6 { page-break-after: avoid;}		/*avoid page break after a title*/


/**** HEADER STRUCTURE ****/
header {position: relative; height: 60px; background: none;}

#headerLogoAndUserBarWrapperOuter {  width: 100%;  background: #FFF !important;}
#headerLogoBar {width: 100%;background: #FFF;height: auto;padding: 1rem 1rem 1rem 0rem;}
	#headerLogo_left {float: none;}
    #headerLogoBar img{width: 100%;}
#headerUserBar {width: 100%;background: #fff !important;position: relative;height: initial;clear: both;border-top: 1px solid #CCC;border-bottom: 1px solid #CCC;}
	#headerUserBarWrapper {position: relative;bottom: 0rem;padding-top: 0.5rem;padding-bottom: 0.5rem;background: #fff;}
	#headerUserLeft {float: none;padding-left: 0.5rem;margin: auto;text-align: left;}
	#headerUserLogo {display: inline;}
  	#headerUserLogo img {max-height: 100px;}
#headerUserRight { display: none;}
.headerStock_diffAndPercWrapper {display: block; text-align: right;	}
.headerStock_diff {display: inline; }
#headerUserRight2 { }
	#headerUserRight2Row1 {}
    #headerStockPrice2 {display:none;}
    #headerStockDate2 {display: none;}
  #headerUserRight2Row2 {margin-top: 0.5rem;}

  #headerUserName {  }
	.headerUserName_hello {  display: none;}
	.headerUserName_createdOnGroup {display: block;}
		.headerUserName_createdOnDate {}
	.headerUserName_printedForGroup { display: block;}
		.headerUserName_printedForText {display: inline;}
		.headerUserName_printedForName {text-transform: uppercase;font-weight: bold;}
		.headerUserNamePrintedFor {  display: none;}

    #headerUserName {display: inline;font-size: 1.3rem;padding-bottom: 1rem;font-weight: normal;margin: auto;text-align: center;}
    #headerUserNameHello {display: none;}
    #headerUserNameCreatedOnDate {font-weight: bold; color: #444;}
    #headerUserNamePrintedFor {display: block;}
    #headerUserNamePrintedForName {text-transform: uppercase; font-weight: bold; color: #444;}
    #headerUserNavList {display: none; }
.headerStock {display: inline; float: right; position: absolute; top: 0.5rem; right: 0.5rem;;}

body.otrBody #headerNavBar,
body.otrBody #headerNavBar2 {display:none;}


/**** BODY STRUCTURE ****/
.mainWrapper {background: #fff;}
.container {margin: 0rem; padding: 0rem; display: block !important;}
.container .row {margin: 0rem; padding: 0rem;}

section {/*border-bottom: 10px solid #EEE !important;*/ padding-bottom: 0rem; margin-bottom: 2rem; }
section h1 {page-break-before:avoid;border-top:10px solid #EEE !important;font-size: 2rem;padding-top: 2rem;padding-left: 0rem;line-height: 1;}

.benTitleWrapper {margin-top: 0rem;page-break-inside: avoid;}
.benTitleLeft {font-size: 1.75rem;}
.benTitleRight {font-size: 2rem;padding-left: 0.5rem;display: table-cell;text-align: right;}
.benTitleRight_number {margin-top: 0px;font-size: 2rem;}
.benDetailWrapper {display: block;}
.sidebar {display: none;}

.ceo_signature {display: none;}

table {border-collapse: collapse; border-spacing: 0;}
.dataTable {width: 100%;/* page-break-inside: avoid; */}
.dataTable tr td, .dataTable tr th {padding: 0.5rem;}
.table > thead > tr,
.table > thead > tr > th,
.table > thead > tr > td{
	border-top:1px solid #999;border-bottom:1px solid #999;
}
.table {margin-bottom: 0rem;}
.modal {display: none;}


/**** ACCORDIONS AND MODALS ****/
.accPanel, .popupPanel {
	display: block !important;
	background: #FFF;
	margin: 0.5rem 0rem;
	padding: 0.5rem 1rem;
	border-radius: 0rem;
	color:#444;
	border-top: 0px solid #CCC !important;
	border-bottom:1px solid #CCC !important;
	border-left: 1px solid #CCC !important;
	border-right: 1px solid #CCC !important;
	overflow: visible !important; /*prevents tables headers from overlapphing content on next page*/
}
.accPanel {    border: 1px solid #CCC !important;}
.popupPanel {clear: both;padding-top: 20px;margin-top: 0px;margin-bottom: 0px;/* page-break-inside: avoid; */border-top: 1px solid #CCC !important;}
.accPanel h4, .popupPanel h4{
	margin-top: 0rem; margin-bottom: 1rem;
}
.accPanel p, .popupPanel p{
	margin: 0.5rem 0rem;
}
.accPanel_modelIt {display:none !important;}

.collapse {height: inherit !important; display: block;}
.accordion .accordion-toggle.btn {background: #EEE; border:0px solid #FFF;}
.accordion i {display:none !important;}


/**** BUTTONS ****/
.accPanel .dataTable {border-top: 2px solid #666; }
.accPanel_modelIt {display: none !important;}
.btn {display: none;}


/**** MISCELLANEOUS ****/
#impersonationBar {display: none;}

/*when modal is open, hide the header, main and footer. Make the modal content visible.*/
.modal-open header {display: none; height: 50px; overflow: hidden;}
.modal-open main {display: none; height: 50px; overflow: hidden;}
.modal-open footer {display: none; height: 50px; overflow: hidden;}
/*TODO: how do we show the content from a long modal in IE9? */
.modal-open .modal {
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    visibility: visible !important;
    overflow: visible !important;
  }
.modal-open .modal-dialog {visibility: visible !important; overflow: visible !important; margin: 0rem; }
.modal-open .modal-content {visibility: visible !important; overflow: visible !important;}
.modal-open .modal-body {visibility: visible !important; overflow: visible !important;}
.modal-open .popupPanel {visibility: visible !important; overflow: visible !important;border: 0px solid #FFF !important;padding: 0rem;}



/*DEBUGGING */
/*Hide everything below once you are finished debugging*/
/*
body {border:1px solid red;}
article .container .row {border:1px solid red; }
.dataTable tr td, .dataTable tr th {border-right: 1px solid red; border-left: 1px solid blue;}
*/



/*2019 styles*/
/*2019 styles*/
/*2019 styles*/

section.hiddenSection {
position: relative; display: block; max-height: inherit; left: inherit; border:0px solid #FFF;
}

#page1 {display: none;}
.grid-container, .grid-x, .cell, .masonry-item {
	margin-left: 0px !important; margin-right: 0px !important;
}
.masonry .masonry-item {position:relative !important; top:inherit !important; left:inherit !important;}

h1 a.nextPrev_link {display: none;}
.cell {width: 100% !important;}
.benIntro {display: none;}
.nav-tabs {display: none;}
.nextPrevTable {display: none;}
.backToTop {display: none;}

.ben {
	display: block;	float: none;clear: both;
	border:0px solid #FFF;	box-shadow: none;
	border-top:3px solid #EEE;
	margin: 2rem 0rem 0rem 0rem; padding: 1rem 0rem 0rem 0rem;

}
.pieChartInline {text-align:center; margin: auto; background: #EEE;}
.highcharts-container {text-align:center; margin: auto;}
.pieChartInline_modalTable_leftSide {display: block;width: 100%;} /*forces the piecharts on top of the table*/
.pieChartInline_modalTable_rightSide {display: block;width: 100%;} /*forces the piecharts on top of the table*/
.tab-content > .tab-pane {display: block;}

.dataTable .fa-fw,
.dataTable .glyphicon  {font-size: 1.5rem; margin-top: -5px;}
.actionBtn{display: none;}
.accLink {display: none;}

.printOnly {display: block;}
.noPrint {display: none;}

.nextPrevBar {display: none;}
h1 {display: block;}
.masonry {height: inherit !important;}
.zSwatchCell {display: none;}
.otherBenefits_select {display: none;}
.mobilePicker  {display: none;}
h1 img {width: 3rem; margin-top:-0.5rem}
.panel-heading a {background: #eee;}


/*adding shortPrint to the body tag will hide a bunch of values*/
.shortPrint [data-highcharts-chart] {display: none ;}
.shortPrint .popupPanel {display: none !important;}
.shortPrint .accPanel {display: none !important;}
.shortPrint .sectionIntro {display: none;}
.shortPrint .otherBenefits_intro {display: none;}
.shortPrint .otherBenefits_wrapper .tab-pane {display: block; clear: both;}
.shortPrint .otherBenefits_wrapper .tab-pane::before {content: ""; height:1px; border:1px solid white; }
.shortPrint .otherBenefits_wrapper .tab-pane h4{padding: 0.3rem 0rem 0rem 0rem;margin: 0.05rem 0rem 0.3rem 0rem;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;display: block;clear: both;}
.shortPrint .otherBenefits_wrapper .panel-group {padding: 0rem 0rem 0rem 0rem;margin:0rem 0rem 0rem 0rem;clear: both;min-height: 1rem;}
.shortPrint .otherBenefits_wrapper .panel-body {display: none;}
.shortPrint .otherBenefits_wrapper .panel {border:0px solid red;width: 48% !important;float:left;margin: 0px;padding: 0px;min-height: 1rem;}
.shortPrint .otherBenefits_wrapper .panel a{font-weight: normal !important;padding: 0.3rem 0rem 0.3rem 1rem;}
.shortPrint .otherBenefits_wrapper .panel .svg-inline--fa{display: none;}





    #modalWrapper { display: none;}
    .progress { display: none;}
    #headerNavBar {display: none !important;}
	#headerUserBar {display: none !important;}
	#Modals{display: none;}
	#headerUserName{font-weight: bold;}
	.main_wrapper {background: #FFF !important;}
	.dataTable  {
  border-top: 1px solid #ddd !important;
  border-right: 1px solid #ddd !important;
  border-bottom: 1px solid #ddd !important;
  border-left: 1px solid #ddd !important;
  margin-bottom: 1rem;}
  
.panel-heading a {font-weight:Bold;}
.nav> li> a {font-weight:bold !important;}