* {
margin: 0;
}
html, body {
height: 100%;
}

body {
font-family: 'Open Sans',Helvetica,Arial,sans-serif;
}


html,
body { height: 100%; }

body {
  display: table;
  width: 100%;
}

.page-row {
  display: table-row;
  height: 1px;
}

.page-row-expanded { height: 100%; }


/*header*/
.headerContainer {
background-color:#40A5F6;
}
.headerLogoContainer {
height:66px;
}
.headerLogoContainer  img {
max-width:100%; max-height:100%;
}
.top-bar, .top-bar nav ul {
background-color:inherit;
padding:0px;
}
.top-bar, .top-bar nav ul li a {
color:#fff;
text-transform:uppercase;
line-height:22px !important;
display: table-cell; 
vertical-align: middle;
height:66px;
}
.top-bar, .top-bar nav ul li {
transition-property: background-color;
transition-duration: 0.5s;
}
.top-bar nav ul li:hover, .top-bar nav ul li:focus, .top-bar nav ul li:active {
background-color: #0090FF;
}
.top-bar nav ul li a {
transition-property: color;
transition-duration: 0.5s;
}

/* Menu */
.title-bar {
	background: none;
}

/* Carousel */
.hermes .tp-bullet {
	width:12px;
	height:12px;
}

/*home*/
.homeSectionWithImg > img {
	cursor: pointer;
}
.homeSectionLinks {
padding:20px 35px; text-align:center; text-transform:uppercase; font-weight:600; font-size:25px; display:block;
}
.homeSectionLinksBig a {
padding:36px 20px; border:1px solid #aaa;
}
.colourOption1, .colourOption1:hover, .colourOption1:focus, .colourOption1:active {
background-color:#004CBF; color:#fff;
}
.colourOption2, .colourOption2:hover, .colourOption2:focus, .colourOption2:active {
background-color:#7AC3FF; color:#fff;
}
.colourOption3, .colourOption3:hover, .colourOption3:focus, .colourOption3:active {
background-color:#AAD8FF; color:#fff;
}

/*owl*/
.owl-dots {
position:absolute;
margin-top:-35px;
text-align: center;
width: 100%;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
z-index:10000;
}
.owl-dot {
border-radius: 50px;
height: 12px;
width: 12px;
display: inline-block;
background: rgba(255,255,255, 1);
margin-left: 5px;
margin-right: 5px;
}
.owl-dot.active {
background: rgba(64,165,246, 1);
}


.mainContent {
padding-bottom:20px;
font-size:16px;
}
.mainContent h1, .mainContent h2, .mainContent h3, .mainContent h4, .mainContent h5 {
font-family:inherit;
font-weight:400;
}
.mainContent h1 {
font-size:25px;
}
.mainContent h2 {
font-size:23px;
}
.mainContent h3 {
font-size:21px;
}
.mainContent h4 {
font-size:20px;
}
.mainContent h5 {
font-size:18px;
}
.mainContent p, .mainContent * li {
font-size:16px;
}
.mainContent p a {
text-decoration:underline;
}


.dateInput {
width:150px !important;
display:inline !important;
margin-right:20px !important;
}

/*benefit preview*/
.benefitCategoryBox {
text-align:center;
}
.benefitCategoryBox div {
max-width:200px;
text-align:center; padding:20px; margin:0px auto; display: inline-block;
}
.benefitCategoryBox div img {
border-radius:50%; max-width:88px; margin-bottom:10px;
}
.benefitCategoryBox div a {
display:block; color:#fff; text-transform:uppercase; font-weight:600;
}
.benefitCategoryBoxColour {
background-color:#004CBF;
cursor: pointer;
}
.benefitCategoryBoxColour img {
margin:0px 30px;
}
.benefitCategoryBoxColour a {
display:inline-block !important;
}
.benefitCategoryBoxColourSelected {
background-color:#7AC3FF;
}
.benefitPreviewsContainer {
padding-top:20px;
}
.benefitPreviewsContainerBackground {
background-color:#E6E6E6;
}
.benefitPreviewBoxBackground {
background-color:#fff;
}
.benefitPreviewBox {
text-align:center;
margin-bottom:20px;
}
.benefitPreviewBox h2 {
font-size:18px;
text-transform:uppercase;
font-weight:600;
padding:8px 10px;
margin:0px;
cursor: pointer;
}
.benefitPreviewBox img {
cursor: pointer;
}
.benefitPreviewBox span {
font-weight:600;
font-size:18px;
margin:0px;
display:block;
padding:10px 15px 20px 15px;
}
.benefitPreviewBox .columns {
font-size:14px;
padding:0px 20px 20px 20px ;
}
div.benefitPreviewBox:last-child {
float: left !important;
}

/*benefit*/
.benefitNameHeadline {
text-transform:uppercase; margin:5px 0px; font-size:30px;
}
.benefitTabHeaders {
text-align:center;
}
.benefitTabHeaders img {
border-radius:50%;
max-width:75px;
margin-top:-35px;
margin-bottom:10px;
cursor: pointer;
}
.benefitTabHeaders img.active {
border:3px solid #004CBF;
}
.benefitTabHeaders a {
display:block;
color:#000;
text-transform:uppercase;
font-weight:600;
}
.benefitBannerText {
position:absolute; margin:30px; background-color:rgba(255, 255, 255, 0.7); color:#000; padding:20px; text-transform:uppercase; font-weight:600; font-size:18px;
}
.benefitTextBorder {
border:20px solid #004CBF; padding:20px;
}
.benefitTextScroll {
max-height:400px;
overflow:auto;
word-break: break-word;
overflow-wrap: break-word;
}
.benefitTextScroll::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
.benefitTextScroll::-webkit-scrollbar {
width: 12px;
background-color: #F5F5F5;
}
.benefitTextScroll::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #808080;
}
.benefitTextScroll p a, .benefitTextBorder p a {
color:#0000ff;
text-decoration:underline;
}

/*employee*/
.employeeBlockHeader {
min-width:200px;
}
.headlineStrip {
background-color:#7AC3FF;
color:#fff;
text-align:center;
font-size:32px;
text-transform:uppercase;
padding:5px 10px;
margin:0px;
}


/*style+colours*/
.surroundContainer {
background-color:#E6E6E6;
}
.innerContainer {
background-color:#fff; border:1px solid #95989A; padding:20px;
}
.buttonRadius {
border-radius:20px !important;
}
.buttonRadius.tiny {
border-radius:10px !important;
}
.button {
background-color:#004CBF;
transition-property: background-color;
transition-duration: 0.5s;
margin:0px;
font-weight:600;
border:none !important;	/*should be separate*/
}
.linkButton {
text-transform:uppercase;
padding:12px 25px;
}
.linkButton:hover, .linkButton:active, .linkButton:focus {
background-color:#1583CC;
}
.updateButton {
text-transform:uppercase;
padding:12px 25px;
background-color:#FF940F;
}
.updateButton:hover, .updateButton:active, .updateButton:focus {
background-color:#E07700;
}
.defaultButton {
text-transform:uppercase;
padding:12px 25px;
}
.cancelButton {
text-transform:uppercase;
padding:12px 25px;
background-color:#EC5840;
}
.cancelButton:hover, .cancelButton:active, .cancelButton:focus {
background-color:#DA3116;
}
.button.small {
padding:6px 15px;
}

.percentInputBox {
width:80px; float:left;
}
.percentInputBoxSign {
float:left; padding:7px 0px 0px 6px;
}

.reveal-overlay {
background-color:rgba(100,100,100,0.9);
}
.rowHoverHighlight .row {
padding:2px 0px;
}
.rowHoverHighlight .row:hover {
background-color:#eee;
}

.subColumnHeader {
text-transform:uppercase;
font-weight:600;
}

.inlineCalander, .inlineCalander:focus {
background:url(/img/icons/calander-icon.gif) no-repeat 5px center; padding-left:35px;
}

/*footer*/
.footer {
background-color:#005FD7;
}
.footer h5, .footer a {
color:#fff;
}
.footer h5 {
margin:0px 0px 5px 0px;
text-transform:uppercase;
font-size:14px;
font-weight:600;
}

.footerLinks {
list-style: none;
margin:0px 0px 0px 0px;
padding:0px;
}
.footerLinks li {
margin:0px;
padding:0px 10px 10px 0px;
text-transform:uppercase;
font-size:14px;
font-weight:600;
}
.footerLinksSmall li {
font-size:12px;
padding:0px 10px 0px 0px;
}

/*forms*/
.styleForm label {
color:#000;
font-size:16px;
line-height:110%;
padding-top: 11px;
padding-bottom: 9px;
}
.styleForm select, .styleForm input, .styleForm textarea {
border:1px solid #95989A;
border-radius:8px;
}
.styleForm select {
padding:0px 24px 0px 10px;
}
.styleForm .fixedText {
display:inline-block; padding-top:8px;
}
.styleForm.infoRow {
padding-bottom:4px;
}
.styleForm .minRowHeight {
min-height:55px;
}
.styleForm [type="checkbox"] {
margin-top:13px;
}

/*general*/
.rowPaddingTop {
padding-top:30px;
}
.rowPaddingBottom {
padding-bottom:30px;
}

.padTop {
padding-top:15px !important;
}
.padBottom {
padding-bottom:15px !important;
}
.padTopBig {
padding-top:30px !important;
}
.padBottomBig {
padding-bottom:30px !important;
}
.padLeftBig {
padding-left:30px;
}
.padRightBig {
padding-left:30px;
}
.marginTopBig {
margin-top:30px;
}
.marginTop {
margin-top:15px !important;
}
.marginBottom {
margin-bottom:15px !important;
}
.marginLeft {
margin-left:20px;
}
.marginRight {
margin-right:20px;
}
.noMargin {
margin:0px !important;
}

.percentWidth10 {
width:10%;
}
.percentWidth9 {
width:11.11111%;
}
.percentWidth8 {
width:12.5%;
}
.percentWidth7 {
width:14.28571%;
}
.percentWidth6 {
width:16.66666%;
}
.percentWidth5 {
width:20%;
}
.percentWidth4 {
width:25%;
}
.percentWidth3 {
width:33.33333%;
}
.percentWidth2 {
width:50%;
}
.percentWidth1 {
width:100%;
}

.flexBox {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;
}

.flexBox div {
	padding:0 0.9375rem;
	flex-basis: 350px;
	text-align: center;
}

.flexBoxOverlay  {
	position: relative;
}
.flexBoxOverlay img {
	width:auto;
}
.flexBoxOverlay div {
	position: absolute;
	opacity: 0.75;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right:0px;
}
.flexBoxOverlay:hover div {
	opacity: 1;
}
.flexBoxOverlay div div {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
.flexBoxOverlay div div img {
	width:auto;
}

.inline {
display:inline !important;
}

.autoWidth {
	width:auto;
}

.clearBoth {
	clear:both;
}

.redText {
	color:#EC5840;
}

.upperCase {
text-transform:uppercase;
}

.csvRowErrorLine {
display:block
}

/* Tabs */
.tabs {
	border:none;
}
.tabs-content {
	border:none;
}
.tabs-panel {
	padding:1rem 0;
}
.tabs-title>a {
	color:#999;
	border-bottom:3px solid #e6e6e6;
}
.tabs-title>a:focus, .tabs-title>a[aria-selected=true] {
	background: #fff;
	border-bottom: 3px solid #1585cf;
	color: #1585cf;
}

.hrtabs li {
background-color:#fff;
border-bottom : 1px solid #999;
}

.hrtabs a {
font-size:12px !important;
background-color:#fff  !important;
color:#999 !important;
background-color:#fff;
border : none !important;
}

.hrtabs .is-active a {
color:#2199E8 !important;
background-color:#fff;
}

/* copy of foundation tab css for not tab links*/
.foundationTypeTabTitle > a:focus, .foundationTypeTabTitle.is-active > a {
background: #ffffff none repeat scroll 0 0;
border-bottom: 3px solid #1585cf;
color: #1585cf;
}
.foundationTypeTabTitle > a {
border-bottom: 3px solid #e6e6e6;
color: #999999;
}
.foundationTypeTabTitle > a {
display: inline-block;
font-size: 0.75rem;
line-height: 1;
padding: 1.25rem 1.5rem;
float:left;
}

/* foundation medium */
@media only screen and (max-width: 63.9375em) {
	.percentWidth10 div a, .percentWidth9 div a, .percentWidth8 div a, .percentWidth7 div a, .percentWidth6 div a {
		font-size:14px;
	}
	.percentWidth10 div, .percentWidth9 div, .percentWidth8 div, .percentWidth7 div, .percentWidth6 div, .percentWidth5 div {
		padding:20px 10px;
	}
	.percentWidth10 div img, .percentWidth9 div img, .percentWidth8 div img, .percentWidth7 div img, .percentWidth6 div img, .percentWidth5 div img {
		max-width:50px;
	}
	
	.top-bar nav ul li a {
	font-size:14px;
	line-height:20px !important;
	padding:9px;
	}

	.benefitCategoryBoxContainer .columns  {
	padding:0px 10px;
	}
	.benefitCategoryBoxContainer:first-child .benefitCategoryBox {
	padding-left:5px;
	}
	.benefitCategoryBox div {
	padding-left:5px;
	padding-right:5px;
	}
	.benefitCategoryBoxColour a {
	font-size:14px;
	margin:0px;
	}
	
	
}

/* Define non max size */
@media only screen and (max-width: 45em) {
	.footer, .push {
	height: auto;
	}
}

/* foundation small */
@media only screen and (max-width: 40em) {
	.headerLogoContainer {
	text-align:center;
	}
	.homeSectionWithImg, .homeSectionLinksBig {
	margin-bottom:30px;
	}
	.homeSectionWithImg:last-of-type, .homeSectionLinksBig:last-of-type {
	margin-bottom:0px;
	}

	.wrapper {
	margin: 0 auto -0px;
	}
	.footer, .push {
	height: auto;
	}
	.footer .columns {
	border-bottom:1px dashed #fff;
	padding:15px;
	text-align:center;
	}
	.footer .columns:last-of-type {
	border-bottom:none;;
	padding:15px;
	}

	.benefitNameHeadline {
	font-size:20px;
	}
	.benefitBannerText {
	margin:10px;
	padding:6px 8px; 
	font-size:12px;
	}
	
	.styleForm .minRowHeight {
	min-height:default;
	}
	.flexBox {
		display: block;
	}
	.flexBox img{
		width: 100%;
		padding-bottom: .97rem;
	}
}

/* mobile */
@media only screen and (max-width: 30em) {
}

/* tiny mobile */
@media only screen and (max-width: 24em) {
	.benefitBannerText {
	margin:10px;
	padding:6px 8px; 
	font-size:10px;
	}
	.percentWidth10 {
		width:100%;
	}
	.percentWidth9 {
		width:100%;
	}
	.percentWidth8 {
		width:100%;
	}
	.percentWidth7 {
		width:100%;
	}
	.percentWidth6 {
		width:100%;
	}
	.percentWidth5 {
		width:100%;
	}
	.percentWidth4 {
		width:100%;
	}
	.percentWidth3 {
		width:100%;
	}
	.percentWidth2 {
		width:100%;
	}
	.percentWidth1 {
		width:100%;
	}
}


.maintenanceMessageContainer{
	text-align: center;
	font-size: 1.2em;
}