/* Regular */
@font-face {
	font-family: 'Cards';
	font-display: swap;
	src: url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-regular.woff2') format('woff2'),
	url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
/* Medium */
@font-face {
	font-family: 'Cards';
	font-display: swap;
	src: url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-medium.woff2') format('woff2'),
	url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
}
/* Bold */
@font-face {
	font-family: 'Cards';
	font-display: swap;
	src: url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-semibold.woff2') format('woff2'),
	url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-semibold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}
/* Regular Slanted */
@font-face {
	font-family: 'Cards';
	font-display: swap;
	src: url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-regular-slanted.woff2') format('woff2'),
	url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-regular-slanted.woff') format('woff');
	font-weight: 400;
	font-style: italic;
}
/* Medium Slanted */
@font-face {
	font-family: 'Cards';
	font-display: swap;
	src: url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-medium-slanted.woff2') format('woff2'),
	url('https://static.moneysmart.gov.au/ms2026/fonts/cards-normal-medium-slanted.woff') format('woff');
	font-weight: 500;
	font-style: italic;
}

:root {
	/* primary colours */
	--ms-color-primary-blue-400: #3348F4;
	--ms-color-primary-blue-300: #7EA7FF;
	--ms-color-primary-blue-100: #E3F1FF;
	--ms-color-primary-green-400: #52FB91;
	--ms-color-primary-black-500: #000000;
	--ms-color-primary-white: #FFFFFF;
	/* extended colours */
	--ms-color-extended-blue-200: #BED3FF;
	--ms-color-extended-blue-500: #2B3DCF;
	--ms-color-extended-green-100: #DCFEE9;
	--ms-color-extended-green-200: #B1FDCE;
	--ms-color-extended-green-300: #86FCB2;
	--ms-color-extended-green-500: #00AC3F;
	--ms-color-extended-fuchsia-100: #F9DCFF;
	--ms-color-extended-fuchsia-200: #F2B1FF;
	--ms-color-extended-fuchsia-300: #EB86FF;
	--ms-color-extended-fuchsia-400: #E252FF;
	--ms-color-extended-fuchsia-500: #CB4AE6;
	--ms-color-extended-oat-100: #E9E8E4;
	--ms-color-extended-oat-200: #CECCC2;
	--ms-color-extended-oat-300: #B2B0A1;
	--ms-color-extended-oat-400: #918E78;
	--ms-color-extended-oat-500: #7B7966;
	--ms-color-extended-black-100: #F2F2F2;
	--ms-color-extended-black-200: #E6E6E6;
	--ms-color-extended-black-300: #777777;
	--ms-color-extended-black-400: #363636;
	/* calculator colours */
	--ms-chart-text-main: var(--ms-color-primary-black-500);
	--ms-chart-lines: var(--ms-color-primary-white);
	--ms-chart-tooltip: var(--ms-color-extended-oat-100);
	--ms-chart-tooltip-border: var(--ms-color-primary-green-400);
	--ms-chart-color-1: var(--ms-color-extended-blue-200);
	--ms-chart-color-2: var(--ms-color-primary-blue-300);
	--ms-chart-color-3: var(--ms-color-primary-blue-400);
	--ms-chart-color-4: var(--ms-color-extended-fuchsia-200);
	--ms-chart-color-5: var(--ms-color-extended-fuchsia-300);
	--ms-chart-color-6: var(--ms-color-extended-fuchsia-400);
	--ms-chart-color-7: var(--ms-color-extended-green-200);
	--ms-chart-color-8: var(--ms-color-extended-green-300);
	--ms-chart-color-9: var(--ms-color-primary-green-400);
	--ms-chart-color-10: var(--ms-color-extended-oat-200);
	--ms-chart-color-11: var(--ms-color-extended-oat-300);
	--ms-chart-color-12: var(--ms-color-extended-oat-400);

	--ms-base-font-size: 16px;
	--px-to-rem: .0625rem; /* 1/var(--ms-base-font-size) */

	--ms-max-outer-width: 1640px;
	--ms-max-footer-width: 1536px;
	--ms-max-inner-width: 1030px;
	--ms-max-content-width: 848px; /*75ch*/

	--ms-text-title-large-size: calc(38 * var(--px-to-rem));
	--ms-text-title-medium-size: calc(28 * var(--px-to-rem));


	--ms-text-summary: 2rem;

	--ms-font-lineheight--dense: 1.24;
	--ms-font-lineheight--regular: 1.5;
	--ms-font-lineheight--spacious: 1.6;

	--ms-font-weight-semibold: 600;

}
html{
	font-size: var(--ms-base-font-size);
	scroll-behavior: smooth;
}
body{
	background-color:#fbfbfb;
	color:#333333;
	font-family:'Cards', sans-serif;
	line-height:1.59;
	margin:0;
	padding:0;
	position:relative;
}
body.noScroll{
	overflow:hidden;
}
.offScreen{
	position:absolute;
	left:-1000rem;
}
.offScreen:focus {
	position:absolute;
	left: 1rem;
	top: .5rem;
	z-index: 9;
}
.visuallyhidden{
	border:0px none;
	clip:rect(0px, 0px, 0px, 0px);
	height:1px;
	margin:-1px;
	overflow:hidden;
	padding:0px;
	position:absolute;
	width:1px;
}
header{
	background-color:#ffffff;
	box-shadow: 0px 1px 4px #00000029;
	box-sizing:border-box;
	left:0;
	position:fixed;
	top:0;
	width:100%;
	z-index:1;
	height:4.5rem;
}
header.open {
	background-color: var(--ms-color-primary-black-500);
	border-bottom: solid 0.01rem var(--ms-color-primary-black-500);
}
#topButtons{
	align-items:center;
	box-sizing:border-box;
	display:flex;
	flex-wrap:wrap;
	padding:0 1rem;
	width:100%;
	height:4rem;
	max-width: var(--ms-max-outer-width);
	margin: 0 auto;
}
@media screen and (min-width:65rem){
	#topButtons{
		padding:0 2rem;
	}
}
#headerLogo{
	height:3rem;
	display:block;
	text-indent:-1000rem;
	width:22rem;
	background-color:transparent;
	background-image:url('https://static.moneysmart.gov.au/ms2026/img/ms_prim_horz_logo_RGB_031125.svg');
	background-repeat:no-repeat;
	margin-right: auto;
}
header.open #headerLogo {
	background-image:url('https://static.moneysmart.gov.au/ms2026/img/ms_prim_horz_logo_rev_RGB_031125.svg');
}
@media screen and (min-width:50rem){
	#headerLogo{
		background-image:url('https://static.moneysmart.gov.au/ms2026/img/coa_ms_prim_horz_logo_RGB_031125.svg');
	}
	header.open #headerLogo {
		background-image:url('https://static.moneysmart.gov.au/ms2026/img/coa_ms_prim_horz_logo_rev_RGB_031125.svg');
	}
}
@media screen and (max-width:50rem){
	#topButtons {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	#topButtons > button {
		flex: 0 0 auto;
	}
	#headerLogo {
		flex: 1;
		background-repeat: no-repeat;
		background-position: center;
		background-size: contain;
		margin: 0 1rem;
	}
}
#headerTitle,#navActiveSectionTitle{
	height:2.5rem;
	line-height:2.5rem;
	display:block;
	width:auto;
	color:#0047F5;
	max-width: calc(100vw - 7rem);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	margin-right: auto;
}
#headerTitle.hidden{
	display:none;
	width:0;
}
#headerLogo.hidden,#headerLogo.mHidden{
	display:none;
	width:0;
}
#navActiveSectionTitle.hidden {
	display:none;
	width:0;
}
header .specialNav {
	display: none;
}
@media screen and (min-width:60rem){
	header .specialNav {
		display: flex;
		margin-right: 1rem;
	}
	header .specialNav li {
		list-style: none;
		padding: .3rem .5rem;
		border: solid 1px var(--ms-color-extended-black-300);
		border-radius: 8px;
		margin: 0 .5rem;
		font-size: .8rem;
	}
	header .specialNav li a {
		text-decoration: none;
	}
}
@media screen and (min-width:50.1rem){
	#navActiveSectionTitle{
		display:none;
	}
	#headerLogo.mHidden{
		display:block;
		/*width:11.5rem;*/
		width: 22rem;
		opacity:1!important;
	}
}
#mainNav{
	-webkit-transition-duration:0.3s;
	-webkit-transition-property:all;
	-webkit-transition-timing-function:ease-in-out;
	-webkit-overflow-scrolling:touch;
	box-sizing:border-box;
	color:#ffffff;
	height:calc(100vh - 4rem);
	overflow:auto;
	padding:0;
	position:absolute;
	transition-duration:0.3s;
	transition-property:all;
	transition-timing-function:ease-in-out;
	width:100%;
	/*background-color: var(--ms-color-primary-black-500);*/
	background-color: var(--ms-color-primary-blue-100);
	z-index: 2;
}
#mainNav.hidden{
	visibility: hidden;
	-webkit-transition-property:all;
	height:0;
	overflow:hidden;
	-webkit-transition-duration:0.3s;
	-webkit-transition-timing-function:ease-in-out;
	transition-duration:0.3s;
	transition-property:all;
	transition-timing-function:ease-in-out;
}
#searchWrapper{
	-webkit-transition-property:all;
	-webkit-transition-duration:0.3s;
	-webkit-transition-timing-function:ease-in-out;
	transition-property:all;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	background-color:#ffffff;
	bottom:0;
	box-shadow:0.25rem 0.25rem 0.25rem #cccccc;
	box-sizing:border-box;
	overflow-y:auto;
	position:fixed;
	top:4.5rem;
	left:0;
	width:100%;
	max-height: calc(100vh - 4.5rem);
	display: flex;
	flex-direction: column;
	/*background-color: var(--ms-color-primary-black-500);*/
	background-color: var(--ms-color-primary-blue-100);
	z-index: 2;
}
#searchWrapper.hidden{
	visibility:hidden;
	-webkit-transition-property:all;
	-webkit-transition-duration:0.3s;
	-webkit-transition-timing-function:ease-in-out;
	transition-property:all;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	max-height:0;
}
#topButtons > button {
	cursor: pointer;
	background-color: var(--ms-color-primary-blue-400);
	color: var(--ms-color-primary-white);
	border: 0;
	border-radius: 10px;
	width: 3.13rem;
	height: 2.8rem;
}
@media screen and (width > 50rem) {
	#topButtons #toggleSearch {
		position: relative;
		width: 8.5rem;
		padding-left: 1rem;
		text-align: left;
	}

	#toggleSearch::after {
		content: "Search";
		font-size: 1.125rem;
		font-weight: 400;
		font-family: 'Cards', sans-serif;
		position: absolute;
		left: 59%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
}

#mainContent{
	padding-bottom: 2rem;
}
/* Start Hero. */
#hero{
	box-sizing: border-box;
	position:relative;
	max-width: var(--ms-max-outer-width);
	margin: 4.5rem auto 0;
	height: auto; /* Default: no fixed height when there is no hero image */
	width: calc(100% - 2rem);
}
@media screen and (min-width:65rem){
	#hero {
		width: calc(100% - 3rem);
		max-width: calc(var(--ms-max-outer-width) - 4rem);
	}
}
/* Only when --hero is set inline â†’ treat as a hero banner */
#hero.bg {
	height: 25rem;
	margin: 7rem auto 0;
}
@media screen and (width > 50rem) {
	#hero.bg {
		height: 33.75rem;
	}
}
/* Image layer only when --hero is present */
#hero.bg::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--hero);
	background-size: cover;
	background-repeat: no-repeat;
	/*background-position: center 30%;*/
	background-position: var(--hero-pos, center 30%);
	border-radius: 1.25rem;
}
#hero > h1 {
	background-color: var(--ms-color-primary-black-500);
	margin-top: 7rem;
	padding: 3rem 1rem;
}
#hero.bg > h1 {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	margin: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .8) 100%);
	border-bottom-left-radius: 1.25rem;
	border-bottom-right-radius: 1.25rem;
}
/* --ms-max-content-width + 2rem for padding */
@media screen and (width > 880px) {
	#hero > h1 {
		padding-left: calc((100% - var(--ms-max-content-width)) / 2);
	}
}

.noBreadCrumb #heroText{
	justify-content:flex-end;
	min-height:14.5rem;
}
.noJumpLimks #heroText{
	padding-top:8rem;
}
#breadcrumbs{
	margin-bottom:5rem;
	visibility: hidden;
}
.breadcrumbLink{
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/breadcrumb-arrow.svg')no-repeat 0 50%;
	background-size: 1.5rem 2rem;
	color:#ffffff;
	font-size:0.75rem;
	padding-left:2rem;
	text-decoration:none;
	text-transform:uppercase;
}
@media screen and (min-width:56em){
	.breadcrumbLink {margin-left:-2rem;}
}

#contentHeader, #content{max-width: var(--ms-max-content-width); margin:0 auto; padding:0 1rem; margin-top: 2rem;}
#contentHeader { margin-bottom: 2.5rem; }
#contentHeader > div { text-align: right; }

.distractionfree #bannerAlert,
.distractionfree #hero,
.distractionfree #contentHeader,
.distractionfree aside.feedback,
.distractionfree aside.upnext,
.distractionfree footer,
.distractionfree #content > * {
	display: none;
}

#pagetime{
	margin: 2.5rem 0;
	line-height: 1;
	border: solid 1px var(--ms-color-primary-black-500);
	display: inline-block;
	padding: 1rem;
	border-radius: 8px;
	color: var(--ms-color-primary-black-500);
	position: relative;
	padding-left: 2.5rem;
}

#pagetime::before {
	content: "timer";
	font-family: "Material Symbols Outlined";
	font-size: 24px;
	z-index: 0;
	position: absolute;
	top: .7rem;
	left: .5rem;
}


/* Reset and base styles */
#onthispage {
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: left;
	counter-reset: section;
	margin-bottom: 1.5rem;
}
#onthispage + p {
	margin-top: 3rem;
}
/* List items */
#onthispage li {
	border-bottom: 2px solid var(--ms-color-extended-oat-100);
	font-size: 1.25rem;
}

/* First item (header) */
#onthispage li:first-child {
	font-weight: bold;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5rem 0;
}

#onthispage li:first-child::after {
	content: "\2193"; /* Down arrow */
	background-color: var(--ms-color-primary-blue-400);
	color: var(--ms-color-primary-white);
	border-radius: 8px;
	padding: 0.2rem 1.5rem;
	font-size: 1rem;
}

/* Links: make entire row clickable */
#onthispage li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-decoration: none;
	color: var(--ms-color-primary-black-500);
	padding: 0.5rem 0;
	width: 100%;
}

/* Number badge for links */
#onthispage li a::after {
	counter-increment: section;
	content: counter(section);
	background-color: var(--ms-color-primary-blue-100);
	color: var(--ms-color-primary-black-500);
	border-radius: 8px;
	padding: 0.2rem 1.5rem;
	font-size: 1rem;
	margin-left: 1rem;
	min-width: 0.6rem;
	text-align: center;
}
#onthispage li:hover a::after {
	background-color: var(--ms-color-primary-green-400);
}
.inPageTracker {
	display: flex;
	gap: .5rem;
	list-style: none;
	padding: 0;
	margin: 3rem 0;
}
.inPageTracker li {
	width: 3rem;
	height: 4rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background-color: var(--ms-color-primary-blue-100);
	font-size: 1rem;
}
.inPageTracker li.done {
	background-color: var(--ms-color-extended-blue-200);
	color: #000;
	position: relative;
}
.inPageTracker li.done::after {
	content: "âœ“";
	font-size: 1rem;
	position: absolute;
	bottom: .1rem;
}
.inPageTracker li a {
	text-decoration: none;
	color: inherit;
}
.inPageTracker li.active{
	background-color:var(--ms-color-primary-blue-400);
	color:var(--ms-color-primary-white)
}
.inPageTracker li:first-child{
	font-size:0
}

/* 'mask' is in invisible element used to capture clicks, eg to close a modal */
#mask{
	background-color:transparent;
	bottom:0;
	left:0;
	position:absolute;
	right:0;
	top:0;
	z-index:2;
	display:block;
}
#mask.hidden{
	display:none;
}
/* end mask */

/* Headings use medium weight */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Cards', sans-serif;
	font-weight: 500; /* Medium */
	font-style: normal;
}
/* Paragraphs use regular weight */
p {
	font-family: 'Cards', sans-serif;
	font-weight: 400; /* Regular */
	font-style: normal;
	line-height: 1.6;
}
/* Strong text uses bold weight */
strong {
	font-family: 'Cards', sans-serif;
	font-weight: 700; /* Bold */
}
h1{
	color: var(--ms-color-primary-white);
	font-size: 3rem;
	line-height: 1;
	padding: 1rem;
}
h2{
	font-family:'Cards', sans-serif;
	font-size: 2rem;
	line-height:1.39;
	margin:4rem 0 1.5rem 0;
}
h3{
	color:#222222;
	font-family:'Cards', sans-serif;
	font-size: var(--ms-text-title-medium-size);
	line-height: var(--ms-font-lineheight--dense);
	margin:3rem 0 1rem 0;
}
.pagetype-calculator h3 {
	font-size:1.65rem;
}
h4{
	font-family:'Cards', sans-serif;
	font-size:1.29rem;
	line-height:1.14;
	margin:3rem 0 1.75rem 0;
}
h5{
	font-family:'Cards', sans-serif;
	font-size:1.11rem;
	line-height:1.11;
}
p{
	margin:0 0 1.25rem 0;
}
a{
	color: var(--ms-color-primary-black);
}
#content a{
	color: var(--ms-color-primary-blue-400);
	text-decoration: underline;
}
/*a:visited{
	color: var(--ms-color-extended-fuchsia-400);
}*/
/* adds some invisible margin to the top of  anchor targets so they don't scroll below the header. excluding table rows and cells because it will have side effects here */
:target:not(tr):not(td)::before {
	content: "";
	display: block;
	height: 4.5rem;
	margin: -4.5rem 0 0;
	visibility: hidden;
}
img{
	max-width:100%;
	height:auto;
}
#mainContent table{
	border-collapse:collapse;
	font-size:0.9rem;
	margin-bottom:2rem;
	width:100%;
}
#mainContent td, th{
	vertical-align:top;
	border:solid thin #bbbbbb;
	padding:.5rem;
	text-align:left;
}
#mainContent td p, #mainContent td h3{
	padding: 0;
	margin: 0;
}
#mainContent td ul {
	padding: 0;
	margin: 0 0 0 1rem;
}
#mainContent th{
	background-color:var(--ms-color-primary-black-500);
	color:var(--ms-color-extended-black-200);
}
#mainContent th p {
	background-color:var(--ms-color-primary-black-500);
	margin: 0;
}
#content button,#calculator-container button, aside.feedback button, .alert button{
	padding:0.55rem 1.25rem;
	border-radius: .5rem;
	font-size:1rem;
	cursor:pointer;
	background-color: var(--ms-color-primary-green-400);
	border: 0;
}
#content button:hover,#calculator-container button:hover, aside.feedback button:hover, .alert button:hover {
	font-size:1rem;
	background-color: var(--ms-color-extended-green-300);
	overflow: visible;
}
#content button.glossButton { background-color: var(--ms-color-extended-blue-200); }
#content button.glossButton:hover { background-color: var(--ms-color-primary-blue-100); }
aside.feedback button.other {
	background-color: transparent;
	color: var(--ms-color-extended-black-200);
	border: solid 1px var(--ms-color-extended-black-200);
}
#content button:disabled,#calculator-container button:disabled{
	color:#f3f3f3;
	border:solid 0.1rem #c3c3c3;
	background-color:#c3c3c3;
	cursor:not-allowed;
}
#content hr{
	max-width:5rem;
	border-top: 0.01rem solid #D8D8D8;
	margin:3rem 0;
}
.ulTable{
	list-style-type:none;
	padding:0;
	margin-bottom:2rem;
	border:solid thin #bbbbbb;
	display:table;
	border-collapse:collapse;
	font-size:0.9rem;
}
.ulTable > li:first-child{
	background-color:var(--ms-color-extended-oat-100);
	font-weight:800;
	display:table-caption;
	padding:1rem;
	border-right:solid thin #bbbbbb;
	border-left:solid thin #bbbbbb;
}
.ulTable > li{
	display:table-row;
	border-top:solid thin #bbbbbb;
}
.ulTable > li span {
	display:table-cell;
	padding:1rem;
}
.ulTable > li span:first-of-type{
	width:40%;
	border-right:solid thin #bbbbbb;
}
.callToAction{
	margin:3rem 0 1rem 0;
}
a.callToActionLink{
	display: block;
	padding: 0.75rem 5rem 0.75rem 1.75rem;
	border-radius: 8px;
	font-size: 1rem;
	cursor: pointer;
	text-decoration: none;
	margin: 0 auto;
	width: fit-content;
	background: var(--ms-color-primary-green-400) url(https://static.moneysmart.gov.au/nextgen/img/arrow-right-white.png) no-repeat right 1.5rem bottom 50%;
}
.reminder{
	background-color:#ffffff;
	background-image:url('https://static.moneysmart.gov.au/nextgen/img/icon-calendar.svg');
	background-repeat:no-repeat;
	background-size:3rem 3rem;
	background-position:2rem 2rem;
	padding:2rem 2rem 2rem 7.5rem;
	margin:2rem 0;
	box-shadow:0.15rem 0.15rem 0.15rem #dddddd;
	min-height:3.5rem;
	border-radius:0.2rem;
}
.reminder p{
	margin:0;
}
.reminder p.title{
	color:#0047F5;
	font-size:1.25rem;
}
.reminder .fullWidth{
	width:100%;
}
.reminder .shortInt{
	width:5rem;
	text-align:right;
}
.reminder.hidden, .clickable{
	cursor:pointer;
}
.reminderContent{
	-webkit-transition-property:all;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease-in-out;
	transition-property:all;
	transition-duration:0.5s;
	transition-timing-function:ease-in-out;
	max-height:300rem;
	overflow:hidden;
}
.reminderContent.hidden{
	-webkit-transition-property:all;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease-in-out;
	transition-property:all;
	transition-duration:0.5s;
	transition-timing-function:ease-in-out;
	max-height:0;
}
.reminder .calLink{
	padding:0.55rem 1.25rem;
	border-radius:2rem;
	font-size:1rem;
	color:#0047F5;
	border:solid 0.1rem #0047F5;
	background-color:#ffffff;
	cursor:pointer;
	text-decoration:none;
	display:inline-block;
}
.justifyRow {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
p.right {
	text-align:right;
	margin-top:0.5rem;
}
.calculatorLink{
	background-color: var(--ms-color-primary-blue-400);
	color: var(--ms-color-primary-white);
	border-radius: 8px;
	align-items: center;
	padding: 1rem 0;
}
.calculatorLink a {
	color: var(--ms-color-primary-white) !important;
}
.calculatorLink + .importantContainer { margin-top: 2.5rem; }
.calculatorLink > div { padding: 0 1rem; }
@media screen and (min-width: 40rem) {
	.calculatorLink{
		display: flex;
	}
	.calculatorLink > div { flex: 1; padding: 0; }
}
.calculatorLink::before, .calculatorLink::after {
	flex-shrink: 0;
	margin: 1rem;
}
.calculatorLink::before {
	content: "calculate";
	font-family: "Material Symbols Outlined";
	font-size: 48px;
	z-index: 0;
}
.calculatorLink::after {
	content: "Calculator";
	background-color: var(--ms-color-primary-green-400);
	color: var(--ms-color-primary-black-500);
	display: inline-block;
	border-radius: 8px;
	padding: .5rem 1rem;
	align-self: flex-end
}
.calculatorLink p{
	margin:0;
}
.calculatorLink a{
	text-decoration: none;
	color: var(--ms-color-primary-white);
}
.calculatorLink p:first-child{
	font-size:1.25rem;
}
.caseStudy, .left-gradient-box {
	padding: 3rem 2.5rem;
	margin:2rem 0;
	border-radius:0.2rem;
	background-color: var(--ms-color-primary-blue-100);
	display:flex;
	flex-direction:column;
	border-radius: 12px;
}
.caseStudyImg{
	display: none;
}
.caseStudyContent{
	flex:0 0 auto;
	width:100%;
	padding: 0;
	box-sizing:border-box;
	max-height:15rem;
	overflow-y:hidden;
}
.caseStudyHeader{
	text-transform:uppercase;
	color:#999999;
}
.caseStudyTitle{
	font-size:1.25rem;
	font-weight:bold;
}
.caseStudyTitle::before{
	color:var(--ms-color-extended-black-400);
	font-size:1rem;
	display:block;
	font-weight: normal;
	content:"Case study";
	text-transform:uppercase;
	margin-bottom:0;
}
.caseStudyFooter{
	margin-top:-5rem;
	padding:6rem 2rem 2rem 2rem;
	display:block;
	text-align:center;
	border-radius: 12px;
}
.caseStudyContent.expanded{
	max-height:none;
	overflow-y:auto;
}
.caseStudyFooter.active{
	background-image:none;
	padding:2rem;
}
.accordian{
	border-radius:0.25rem;
	box-sizing:border-box;
	margin:2rem 0 0 0;
	background-color: var(--ms-color-extended-black-100);
}
.accordianRow:not(:last-of-type){
	border-bottom:solid 2px var(--ms-color-extended-black-200);
}
.accordianRowToggle{
	border-radius:0!important;
	border:0 none!important;
	box-sizing:border-box;
	height:1.75rem;
	padding:1.6rem!important;
	text-indent:-1000rem;
	width:1.75rem;
}
.accordianRow .accordianRowToggle{
	background: url('https://static.moneysmart.gov.au/nextgen/img/minus-black.svg')no-repeat 50% 50%;
	background-size:0.9rem 0.9rem;
}
.accordianRow.closed .accordianRowToggle{
	background: url('https://static.moneysmart.gov.au/nextgen/img/plus-black.svg')no-repeat 50% 50%;
	background-size:0.9rem 0.9rem;
}
.accordianTitle{
	display:flex;
	justify-content:space-between;
	margin-bottom:0;
}
.accordianTitle >span,.accordianTitle >h2,.accordianTitle >h3,.accordianTitle >h4{
	cursor:pointer;
	display:block;
	flex:1;
	font-family: 'Cards', sans-serif;
	font-weight: bold;
	font-size:1rem;
	padding:1rem;
	margin:0;
}
.accordianRowContent{
	padding:0 1rem 1rem 1rem;
}
.accordianRow.closed .accordianRowContent {
	display:none;
}
.pubLink{
	background-color:#ffffff;
	padding:2rem;
	margin:2rem 0;
	box-shadow:0.15rem 0.15rem 0.15rem #dddddd;
	min-height:3.5rem;
	border-radius:0.2rem;
	display:flex;
}
@media screen and (max-width:39rem) {
	.pubThumb{
		display:none;
	}
}
.pubThumb{
	background-color:#fbfbfb;
	box-shadow:0.15rem 0.15rem 0.15rem #dddddd;
	padding:3rem 1rem;
	text-align:center;
	box-sizing:border-box;
	margin-right:2rem;
}
.pubLink p{
	margin:0;
}
.pubLink p:first-child{
	color:#0047F5;
	font-size:1.25rem;
}
.pubURL{
	margin:1rem 0rem!important;
}
.pubURL a{
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/icon-download.png')no-repeat 0 50%;
	text-decoration:none;
	padding:0.5rem 0.5rem 0.5rem 1.25rem;
	color:#0047F5;
}
.smartTip, .important, .covidImportant{
	margin:3rem 0 2rem 0;
	box-sizing:border-box;
	padding: 2rem 1.5rem;
	border-radius: 10px;
	position: relative;
	background-color: var(--ms-color-primary-blue-100);
:last-child {
	margin-bottom: 0;
}
}
.important {
	border-radius: 20px;
	padding: 2.5rem;
	background-color: var(--ms-color-extended-black-200);
}
.smartTip {
	background-color: var(--ms-color-primary-black-500);
	color: var(--ms-color-extended-black-200);
	font-size: 1.125rem;
}
.smartTip::before {
	content: "lightbulb_2" / "";
	font-family: 'Material Symbols Outlined';
	display: inline-block;
	font-size: 1.75rem;
	position: absolute;
	font-weight: 500;
	top: 1.75rem;
	left: 1.25rem;
}
.smartTip a {
	color: var(--ms-color-extended-black-200) !important;
}
.importantContainer {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	gap: 1rem; /* space between text and image */
	margin-bottom: 1.5rem;
}
.important {
	margin: 0;
	flex: 1; /* take available space */
	font-size: 1.125rem;
	/*text-align: center;*/
}

.important::before {
	content: "notification_important" / "";
	font-family: 'Material Symbols Outlined';
	display: inline-block;
	font-size: 2rem;
	position: absolute;
	font-weight: 500;
	top: 2rem;
	left: 2rem;
}
@media screen and (min-width: 40rem) {
	.important{
		max-width: 66%;
	}
	.importantContainer .image {
		flex: 0 0 33%; /* fixed width for image */
		border-radius: 20px; /* optional rounded corners */
	}
	.importantContainer .image:not(:has(img)) {
		background-image: url('https://files.moneysmart.gov.au/media/pl2azkls/car-in-hail.jpg'); /* replace with actual image path */
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	}
	.importantContainer .image img {
		object-fit: cover;
		height: 100%;
		border-radius: 20px;
	}

}
.covidImportant{
	border: 0;
	background: #fcda85;
}
/*
.smartTip::before, .important::before, .covidImportant::before{
	display:block;
	width: 4.25rem;
	height: 4.25rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/icon-smarttip.svg')no-repeat 0 0;
	background-size:contain;
	margin-top:-4.5rem;
}
.important::before{
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/icon_important.svg')no-repeat 0 0;
}
.covidImportant::before{
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/icon_covidimportant.svg')no-repeat 0 0;
}
*/
.smartTip > p:first-child::before, .important > p:first-child::before, .covidImportant > p:first-child::before{
	font-family: "Cards", "Material Symbols Outlined";
	display:block;
	font-weight: bold;
	width: fit-content;
}
.smartTip > p:first-child::before {
	font-family: "Cards", "Material Symbols Outlined";
	content:"Smart tip";
	color: var(--ms-color-primary-green-400);
	width: fit-content;
	font-size: 1.5rem;
	padding-left: 2rem;
	font-weight: 500;
	margin-bottom: 1.125rem;
}
.important > p:first-child::before{
	font-family: "Cards", "Material Symbols Outlined";
	content:"Important";
	color: var(--ms-color-primary-black-500);
	width: fit-content;
	font-size: 1.25rem;
	padding-left: 2rem;
	font-weight: 500;
	margin-bottom: 1.125rem;
}
.covidImportant > p:first-child::before{
	color:#1f1247;
	content:"COVID-19";
}
.important > p:first-child, .covidImportant > p:first-child{
	color: var(--ms-color-primary-black-500);
}
blockquote::before {
	content: 'QUOTE';
	position: absolute;
	top: -2rem;
	left: 0;
	font-size: .75rem;
	color: var(--ms-color-extended-black-400);
}
blockquote {
	position: relative;
	border-left: .2rem solid var(--ms-color-primary-blue-400);
	margin: 4.5rem 0 0 0;
	padding-left: 2rem;
}
blockquote > p {
	font-size: 1.1rem;
	color: var(--ms-color-primary-blue-400);
	font-weight: 500;
}
blockquote > p:last-of-type {
	color: var(--ms-color-extended-black-400);
	font-size: 1rem;
}
button.glossButton {
	text-decoration:none;color:#222!important;
	position:relative!important;
	display: inline!important;
	border: 0 none!important;
	border-radius: 0!important;
	padding: 0!important;
	margin: 0!important;
	min-width:0!important;
}
.tooltip .tooltiptext {
	visibility: hidden;
	left: 0;
	position: fixed;
	bottom: -10rem;
	margin: 0;
	border-radius: 0;
	width: 100%;
	transition: bottom .8s;
	padding: 1rem .5rem;
	font-style: normal;
	font-size: .75rem;
	color: #333;
	background-color: var(--ms-color-extended-oat-100);
	text-align: center;
	padding: .5rem;
	border-radius: .25rem;
	box-sizing: border-box;
	white-space: normal;
	z-index: 1;
	font-family: 'Cards', sans-serif;
}
.tooltip:hover .tooltiptext, .tooltip:focus .tooltiptext {
	bottom: 0;
	visibility: visible;
	color: var(--ms-color-extended-black-400);
	background-color: var(--ms-color-extended-black-100);
	box-shadow: 0px 1px 5px rgb(0 0 0 / 20%);
	text-align: left;
	padding: 0.5rem 1rem;
	line-height: 1.3;
}
@media screen and (min-width: 39rem) {
	.tooltip .tooltiptext {
		bottom: 100%;
	}
	.tooltip .tooltiptext:before {
		content: " ";
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		height: 1.25rem;
	}
	.tooltip .tooltiptext:after {
		content: " ";
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -5px;
		border: 5px solid transparent;
	}
	.tooltip:hover .tooltiptext, .tooltip:focus .tooltiptext {
		margin-bottom: .4rem;
		width: 240px;
		bottom: 100%;
		left: 50%;
		margin-left: -120px;
		position: absolute;
	}
}
.tooltip .tooltiptext:after {
	border-top-color: #fff;
}
button.tooltip {
	font-family: inherit;
}


h1::first-letter, .glossaryItem h3::first-letter { text-transform: capitalize; } /* just required for glossary */
.tooltiptext p { margin: .5rem 0; } /*fix for text in glossary bubble */
/*a.glossary::after { content:attr(data-def); display:block; position:absolute; background-color:#0047F5; padding:1em; box-sizing:border-box; color:#fff; border-radius:.3rem; font-size:.8em; bottom:0; width:15rem; left:calc(50% - 7.5rem); transform:scale(0); transition:transform ease-out 150ms, bottom ease-out 150ms; }
a.glossary:hover::after { transform:scale(1); bottom:100%; }
input, textarea, select, button {
font-size:1rem;
}*/
.glossSpan{
	position: relative;
}
.glossDef{
	display: flex;
	flex-direction: column;
	position:absolute;
	background-color:#0047F5;
	padding:1em;
	box-sizing:border-box;
	color:#fff;
	border-radius:.3rem;
	font-size:.8em;
	bottom:1.5rem;
	width:15rem;
	left:calc(50% - 7.5rem);
	transform:scale(1);
	transition:transform ease-out 150ms, bottom ease-out 150ms;
	border: rgba(255,255,255,0.2) solid thin;
	z-index:3;
}
.glossDef.hidden{
	transform:scale(0);
	bottom: 0;
	transition:transform ease-out 150ms, bottom ease-out 150ms;
	display:none;
}
.glossDef a {
	color:#ffffff!important;
}
.glossDef button{
	background: transparent url(https://static.moneysmart.gov.au/nextgen/img/close-white.svg)no-repeat top center!important;
	border: 0 none;
	color: transparent;
	cursor: pointer;
	height: 1.25rem!important;
	text-indent: -10000rem;
	border-radius: 0!important;
	width: 1.25rem!important;
	padding:0!important;
	min-width:0!important;
	align-self:flex-end;
	margin-bottom:0.5rem!important;
}
/* video */
.youtubeEmbed{
	position:relative;
	margin-bottom:0;
	padding-bottom: 56.25%;
	height: 0;
}
@media screen and (min-width:40rem){
	#content .video {
		width: 80%;
		margin: 0 auto 0;

	}
}
.youtubeEmbed > a::before{
	display:block;
	position:absolute;
	background-color:transparent;
	background-image:url('https://static.moneysmart.gov.au/nextgen/img/play-video.svg');
	background-position:50% 45%;
	background-repeat:no-repeat;
	top:0;
	left:0;
	right:0;
	bottom:0;
	content:" ";
}
.youtubeEmbed img {
	border-radius: 12px 12px 0 0;
}
.youtubeText{
	padding: 1rem;
	background-color: var(--ms-color-primary-blue-100);
	width:100%;
	box-sizing:border-box;
	border-radius: 0 0 12px 12px;
}
.youtubeText.hidden{
	display:none;
}
.youtubeHeader{
	display:flex;
	justify-content:space-between;
	align-items: flex-end;
}
.youtubeTitle{
	font-size:1.25rem;
	font-family:'Cards', sans-serif;
	font-weight:500;
	margin:0;
	line-height: 1.1;
}
.youtubeDescription{
	font-size:1rem;
	font-family:'Cards', sans-serif;
	margin:0.75rem 0 0 0;
}
.transcriptButton{
	padding:0.1rem 1rem!important;
	min-width:6rem!important;
	white-space: nowrap;
}
.transcriptButton.hidden{
	display:none;
}
.transcriptTitle{
	font-weight: 600;
}
.transcriptDiv{
	display:block;
	padding-top:2rem;
}
.transcriptDiv.hidden{
	display:none;
}
.videoDiv iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:var(--ms-color-primary-black-500);
}
.endSummary{
	margin:3rem 0;
	background-color:var(--ms-color-extended-oat-100);
	padding:2rem;
	border-radius: 12px;
}
#content .socialLinks{
	margin:1rem auto;
	padding:2rem;
	border:solid thin #bbbbbb;
	text-align:center;
	box-sizing:border-box;
	max-width:20rem;
}
#content .socialLinks li{
	display:inline-block;
	margin:0 1.5rem 0 1.5rem;
	width:1.5rem;
	height:1.5rem;
}
#content .socialLinks li a{
	display:block;
}
#content .icon-facebook{
	text-indent:-10000rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/facebook-square-grey.svg')no-repeat center center;
	opacity:0.8;
}
#content .icon-facebook:hover{
	opacity:1;
}
#content .icon-twitter{
	text-indent:-10000rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/twitter-grey.svg')no-repeat center center;
	opacity:0.8;
}
#content .icon-twitter:hover{
	opacity:1;
}
#content .icon-email{
	text-indent:-10000rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/envelope-grey.svg')no-repeat center center;
	opacity:0.8;
}
#content .icon-facebook.lazy, #content .icon-twitter.lazy, #content .icon-email.lazy{
	background: transparent url('https://static.moneysmart.gov.au/nextgen/img/image-placeholder.gif');
}
#content .icon-email:hover{
	opacity:1;
}
.upnext{
	background-color: var(--ms-color-extended-black-100);
	padding: 1rem;
}
.upnext > div {
	overflow: hidden;
}
.upnext a{
	text-decoration: none;
	display: flex;
	flex-direction: column;
	row-gap: 1rem;
	flex: 1;
	/* justify-content: space-between; */
	min-height: 350px;
}
.upnext h2{
	color:#666;
	margin:1rem 0;
}
.upnext h2 span{
	color:#222;
	font-weight:bold;
}
.upnext h3{
	font-size:1.75rem;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	/*overflow-wrap: anywhere;*/
}
.upnext ul{
	list-style-type:none;
	/*padding:0;*/
	margin:0;
	display: flex;
	column-gap: 1rem;
}

.upnext li{
	background-color: var(--ms-color-primary-white);
	padding: 1.5rem;
	position:relative;
	cursor:pointer;
	border-radius: .5rem;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	width: 320px;
}

.upnext li p:first-of-type {
	margin-bottom: 2.25rem;
}

.upnext li p:last-child{
	text-transform:uppercase;
	font-size:0.8rem;
	color: var(--ms-color-primary-black-500);
	background-color: var(--ms-color-primary-green-400);
	font-weight: bold;
	text-align: center;
	display: inline-block;
	border-radius: .5rem;
	margin-top: auto;
	margin-top: auto;
	padding: .5rem;
	margin-bottom: 0;
	display: none; /* HIDE READING TIME */
}
.upnext li:hover, .upnext li:focus-within {
	background-color: var(--ms-color-primary-blue-400);
}
.upnext li:hover h3, .upnext li:focus-within h3,
.upnext li:hover a, .upnext li:focus-within a {
	color: #fff;
}

.upnext li:after {
	content: "arrow_forward" / "";
	font-family: 'Material Symbols Outlined';
	font-size: 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--ms-color-primary-green-400);
	color: var(--ms-color-primary-black-500);
	border: none;
	border-radius: 8px;
	width: 2.5rem;
	height: 2rem;

	position: absolute;
	bottom: 1.5rem;
	right: 1.125rem;
}

/*
@media (pointer: coarse) {
	.upnext li:after {
		background: #42BFC7 url('https://static.moneysmart.gov.au/nextgen/img/arrow-right-white.svg')no-repeat center center;
		background-size: 1.5rem 2rem;
	}
}
*/

/* FOOTER STYLES */
footer{
	text-align:center;
	background-color: var(--ms-color-primary-blue-100);
}
footer .brandms {
	box-sizing: border-box;
	padding: 1rem 0;
	width: calc(100% - 2rem);
	margin: 0 auto;
}
footer .brandms ul:first-child { padding:0; margin:0; margin-right: auto; }
footer ul{
	list-style-type:none;
	display: flex;
	flex-direction: column;
	margin-top: 2rem;
	text-align: left;
	padding: 0;
}
footer a{
	text-decoration:none;
	font-size:.875rem;
}
footer a:hover{
	text-decoration:underline;
}
footer ul.links li:first-child, footer ul.social li:first-child {
	font-size:1.125rem;
	font-weight: var(--ms-font-weight-semibold);
}
footer a.indigenous-flags{
	background: url(https://static.moneysmart.gov.au/nextgen/img/icon-indigenous.svg) no-repeat 50% 0;
	color: transparent;
}
footer > img{
	padding:1rem;
}

footer .brandgov {
	padding: 1rem 0;
}
footer .brandgov img {
	max-width: 10rem;
}

@media screen and (min-width:40rem){
	footer .brandms {
		display: flex;
		justify-content: space-evenly;
		padding: 1.5rem 0;
	}
	footer ul{
		margin-top: 1rem;
		padding: 0 1.5rem;
		margin-top: 0rem
	}
	footer .links li {
		display: inline-block;
		margin:0 .5rem;
	}
}
@media screen and (min-width:65rem){
	footer .brandms {
		width: calc(100% - 3rem);
		max-width: calc(var(--ms-max-footer-width) - 4rem);
	}
}

/* Acknowledgement of Country */
.acknowledgement {
	margin-block: 2rem;
	position: relative;
	font-size: 0.875rem;
}
.acknowledgement div:first-child {
	text-align: center;
}
.acknowledgement div:last-child p:first-child {
	font-size: 1.125rem;
	font-weight: var(--ms-font-weight-semibold);
}
.acknowledgement img {
	width: 6.25rem;
}
.acknowledgement div:last-child {
	padding: 0 2rem;
}
.acknowledgement div:last-child p {
	max-width: 54ch;
}
@media screen and (width > 768px) {
	.acknowledgement {
		display: flex;
	}
}

/* Accessibility focus */
:focus{ outline: 3px solid var(--ms-color-extended-fuchsia-500); }
header button:focus, a:focus { outline-offset: .3rem; }
.youtubeEmbed > a { outline-offset: 0; }
#content button:focus { background-color: var(--ms-color-extended-green-300); color: #fff; outline: none; }
div.calculatorLink:focus-within { border: 2px solid var(--ms-color-extended-fuchsia-500); }
div.calculatorLink a:focus { outline: none; }
.accordianRow:focus-within { outline: 2px solid var(--ms-color-extended-fuchsia-500);  }
/*#content .accordianRow:focus-within button:focus { background-color: #fff;  }*/
body.using-mouse :focus,
body.using-mouse div.calculatorLink:focus-within,
body.using-mouse .accordianRow:focus-within { outline: none; }
#content input:focus, #content select:focus { outline: 2px solid var(--ms-color-primary-green-400); }

#pagetagline{
	font-size:1.5rem;
	font-family:'Cards', sans-serif;
	color:#ffffff;
	line-height:1;
	margin:1rem 0 0 0;
	display: none;
}
#calctagline{
	font-size:1rem;
	font-family:'Cards', sans-serif;
	color:rgba(255,255,255,0.9);
	line-height:1;
	margin:1rem 0 0 0;
}
.pagesummary{
	font-size: var(--ms-text-summary);
	font-weight: 500;
	margin: 0 0 2.5rem 0;
}
.highlight{
	background-color: var(--ms-color-primary-green-400);
}
.scrolltracker{
	height:.25rem;
	width:100%;
}
.scrolltracker .progress{
	height:.3rem;
	width:0;
	background-color: var(--ms-color-primary-green-400);
}
/* nav  menu */
header #close { display: none; }
header #menuBack {
	display: none;
	background-color: transparent;
	font-weight: 600;
}
header.open #close { display: inline-block; }
header.search.open #toggleSearch { display: none; }
header.nav.open #toggleMenu { display: none; }

/* for mobile, if second level menu is open, show back button and section title intead of close button and logo */
@media screen and (width < 50rem) {
	header.nav:has(.pos2) #menuBack {
		display: block;
	}

	header.nav:has(.pos2) #close {
		display: none;
	}

	header.nav.open #close {
		order: 1;
	}

	header.nav.open #headerLogo {
		order: 2;
	}

	header.nav.open #toggleSearch {
		order: 3;
	}

	header.nav:has(.pos2).open #navActiveSectionTitle {
		display: block;
		margin-right: unset;
		color: var(--ms-color-primary-white);
		width: auto;
	}

	header.nav:has(.pos2).open #headerLogo {
		display: none;
	}

}
@media screen and (min-width:50rem){
	header.open ul.specialNav, header.open #toggleSearch { display: none; }

	header.search.open #toggleMenu {
		display: none;
	}
	header.nav.open #close {
		order: 3;
	}
	#toggleMenu{
		order: 3;
		margin-left: 1.5rem;
	}
	/*
    #toggleMenu.hidden{
        display:block;
    }
    */
}
@media screen and (min-width:50rem){
	.customScrollBar::-webkit-scrollbar-track{
		background-color: var(--ms-color-extended-black-300);
	}
	.customScrollBar::-webkit-scrollbar{
		width:0.75rem;
		background-color: var(--ms-color-extended-black-300);
	}
	.customScrollBar::-webkit-scrollbar-thumb{
		background-color: var(--ms-color-primary-black-500);
	}
}
.vertJustify{ /*used to spread main nav level 1 items and nav 'footer'*/
	display:flex;
	flex-direction:column;
	height:calc(100vh - 4.5rem);
	justify-content:space-between;
	overflow-y:auto;
	overflow-x:hidden;
	--padding-left: calc((100% - var(--ms-max-outer-width)) / 2);
	padding-left: var(--padding-left);
	width: calc(100% - var(--padding-left));
	max-width: 100%;
}
#mainNav a {
	/*color: var(--ms-color-extended-black-200);*/
	color: var(--ms-color-primary-black-500);
	text-decoration:none;
}
#mainNav .calculator, #searchResult .calcResult{ display:flex; align-items: center; position: relative}
#mainNav .calculator::before, #searchResult .calcResult::before {
	content: "calculate";
	font-family: "Material Symbols Outlined";
	font-size: 32px;
	margin-right: .5rem;
	margin-left: -40px;
	position: absolute;
}
#mainNavUl{
	list-style-type:none;
	padding:2rem 1rem 1rem 2rem;
	box-sizing: border-box;
	color: var(--ms-color-extended-black-200);
	margin:0;
	position:relative;
	font-family:'Cards', sans-serif;
}
@media screen and (max-width:50rem){
	ul.pos1{
		-webkit-transition-property:left;
		-webkit-transition-duration:0.5s;
		-webkit-transition-timing-function:ease-in-out;
		transition-property:left;
		transition-duration:0.5s;
		transition-timing-function:ease-in-out;
		left:0;
	}
	ul.pos2{
		-webkit-transition-property:left;
		-webkit-transition-duration:0.5s;
		-webkit-transition-timing-function:ease-in-out;
		transition-property:left;
		transition-duration:0.5s;
		transition-timing-function:ease-in-out;
		left:-100%;
	}
}
.mainNavLevel1{
	margin:0 0 0.5rem 0;
	font-size:1.5rem;
	line-height:1.25;
	padding:0.2rem 0;
}
.mainNavLevel1.active .mainNavLevel1Link{
	background-color: var(--ms-color-primary-green-400);
	padding: .5rem .5rem;
	margin-left: -.5rem;
}
.mainNavLevel2Container{
	list-style-type:none;
	padding:2rem 1rem 1rem 0.5rem;
	font-size:1.25rem;
	font-weight:400;
	overflow-y:scroll;
	position:absolute;
	top:0;
	width:60%;
	left:40%;
	box-sizing:border-box;
	-webkit-transition-property:left;
	-webkit-transition-duration:0.5s;
	-webkit-transition-timing-function:ease-in-out;
	transition-property:left;
	transition-duration:0.5s;
	transition-timing-function:ease-in-out;
	max-height:calc(100vh - 4.5rem);
	-webkit-overflow-scrolling:touch;
}

.mainNavLevel2Container.hidden{
	display:none;
}
@media screen and (max-width:50rem){
	.mainNavLevel2Container{
		list-style-type:none;
		padding:3rem 1rem 1rem 0.75rem;
		font-size:1.25rem;
		font-weight:400;
		overflow-y:scroll;
		-webkit-overflow-scrolling: touch;
		position:absolute;
		top:0;
		width:100%;
		left:100%;
		box-sizing:border-box;
		-webkit-transition-property:left;
		-webkit-transition-duration:0.5s;
		-webkit-transition-timing-function:ease-in-out;
		transition-property:left;
		transition-duration:0.5s;
		transition-timing-function:ease-in-out;
		max-height:calc(100vh - 4.5rem);
	}
	.mainNavLevel2Container.hidden{
		left:200%;
		display:block;
	}
}
@media screen and (min-width:50rem) {
	html[dir="rtl"] .mainNavLevel2Container {
		left: auto;
		right: 50%;
	}
}
.mainNavLevel1.active .mainNavLevel2Container{
	height:auto;
}
.mainNavLevel1Link > ul.hidden{
	display:none;
}
.mainNavLevel2Container > li > ul{
	list-style-type:none;
	padding:0 0 2rem 0;
	font-size:1rem;
	font-weight:200;
}
.mainNavLevel2Container > li > ul > li > a{
	padding:0.5rem 0 0.5rem 2.5rem;
	display:inline-block;
	margin: 0; /* needed to stop .calculator link style clashing from calculator css */
}
.mainNavLevel2Container > li > a {
	display:inline-block;
	padding-left:2.5rem;
}
#navFooter{
	padding:0 2rem 2rem 2rem;
	font-family:'Cards', sans-serif;
}
@media screen and (max-width:50rem){
	#navFooter{
		position:relative;
		padding:0 2rem 2rem 2rem;
		-webkit-transition-property:all;
		-webkit-transition-duration:0.5s;
		-webkit-transition-timing-function:ease-in-out;
		transition-property:all;
		transition-duration:0.5s;
		transition-timing-function:ease-in-out;
		left:0;
	}
	#navFooter.hidden{
		-webkit-transition-property:all;
		-webkit-transition-duration:0.5s;
		-webkit-transition-timing-function:ease-in-out;
		transition-property:all;
		transition-duration:0.5s;
		transition-timing-function:ease-in-out;
		left:-100%;
	}
}
#navAbout{
	list-style-type:none;
	padding:0;
	font-weight:200;
}
#navAbout li{
	margin:0;
}
#navAbout a{
	/*color:rgba(255,255,255,0.8);*/
}
#navFooter .socialLinks{
	list-style-type:none;
	padding:0;
	margin:2rem 0;
}
#mainNav .socialLinks li{
	display:inline-block;
	margin:0 1.5rem 0 0;
	width:1.5rem;
	height:1.5rem;
}
#mainNav .socialLinks li a{
	display:block;
}
#mainNav .icon-facebook{
	text-indent:-10000rem;
	width:1.5rem;
	background:transparent url('https://static.moneysmart.gov.au/ms2026/img/facebook-square-black.svg')no-repeat top center;
}
#mainNav .icon-twitter{
	text-indent:-10000rem;
	width:1.5rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/icon-twitter-x-reverse.svg')no-repeat top center;
}
#mainNav .icon-youtube{
	text-indent:-10000rem;
	width:1.5rem;
	background:transparent url('https://static.moneysmart.gov.au/ms2026/img/youtube-black.svg')no-repeat top center;
}
#mainNav .icon-instagram{
	text-indent:-10000rem;
	width:1.5rem;
	background:transparent url('https://static.moneysmart.gov.au/ms2026/img/icon-instagram-black.svg')no-repeat top center;
}
#mainNav .icon-facebook.lazy, #mainNav .icon-twitter.lazy, #mainNav .icon-youtube.lazy, #mainNav .icon-instagram.lazy{background: transparent url('https://static.moneysmart.gov.au/nextgen/img/image-placeholder.gif');}
#navFooter > img {
	max-width: 260px;
}
/* end nav menu */
#searchInputWrapper{
	color: var(--);
	/*background-color: var(--ms-color-primary-black-500);*/
	padding: 1rem 1rem 2rem 1rem;
}
#searchIcon{
	display:none;
	max-width:56rem;
	margin:0 auto;
	text-align:left;
}
@media screen and (min-width:50rem){
	#searchIcon{
		display:block;
	}
	#searchInputWrapper {
		padding: 7.5rem 1rem 3rem 1rem;
	}
}
@media screen and (max-width:50rem){
	#searchResult {
		padding-left: 3.5rem;
	}
}
@media screen and (min-width:74rem){
	#searchIcon{
		position:relative;
		left:-6rem;
		bottom:-4rem;
	}
}
#searchInput{
	max-width:56rem;
	margin:0 auto;
	border-bottom:solid thin var(--ms-color-primary-black-500);
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
}
#searchQuery{
	background-color:transparent;
	border:0 none;
	color: var(--ms-color-primary-black-500);
	font-size:1.25rem;
	font-weight:200;
	width:calc(100% - 4rem);
	flex:1;
	z-index:3;
	outline: none;
}
#searchQuery::placeholder{
	color: var(--ms-color-extended-black-400);
	opacity:1;
	font-size:1.25rem;
}
#searchQuery::-ms-clear{
	display:none;
}
#searchSubmit{
	/*border:0 none;
	color:transparent;
	cursor:pointer;
	height:1.5rem;
	text-indent:-10000rem;
	width:1.6rem;
	margin-bottom:0.2rem;
	background:transparent url('https://static.moneysmart.gov.au/nextgen/img/search-white.svg')no-repeat top center;*/
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	-webkit-font-smoothing: antialiased;
	background-color: transparent;
	border: none;
	margin-bottom: .5rem;
}
#searchResultsWrapper{
	overflow-y:auto;
	height: calc(100vh - 11.5rem);
	-webkit-overflow-scrolling:touch;
}
@media screen and (MIN-width:50rem){
	#searchResultsWrapper {
		height: calc(100vh - 23.5rem);
	}
}
#searchResult,#googleResult{
	max-width:56rem;
	margin:0 auto;
	padding:1rem 3rem;
	margin-bottom:1rem;
}
#searchResult, #searchResult a {
	/*color: var(--ms-color-extended-black-200);*/
}
.searchResultsTitle{
	font-size:0.75rem;
	margin:1rem 0;
	color: var(--ms-color-extended-black-400);
}
.teachingResult .years {
	background-color: #f3f3f3;
	border-radius: 1rem;
	padding: .2rem .75rem;
	margin: 0 .5rem .5rem 1rem;
	white-space: nowrap;
	display: inline-block;
	font-size: .8rem;
}
.glossResult::before{
	content:"Definition: ";
}



/* end search */
/* main content */
/* Container styling */

.calculator-container {
	padding:0 1rem 1rem 1rem;
	margin:3rem -1rem;
	background-color: #ebebeb;
}
label:not(.chkLabel){
	color: var(--ms-color-primary-black-500);
	display: block;
}
input[type="text"],input[type="number"]  {
	padding:1rem;
	font:normal normal normal 1rem/100% 'Cards', sans-serif;
	border:0 none;
	border-radius:0.25rem;
	box-sizing:border-box;
	border:solid 0.05rem #f3f3f3;
}
input:focus {
	border:solid 0.05rem #cccccc;
}
input:disabled {
	background-color:#f7f7f7;
	cursor:not-allowed;
}
input.invalid {
	border:solid 0.05rem #d84847;
}
input.required {
	padding:1rem 2rem 1rem 1rem;
}
#content select,#calculator-container select  {
	padding:1rem 2rem 1rem 1rem;
	font:normal normal normal 1rem/100% 'Cards', sans-serif;
	border:0 none;
	border-radius:0.25rem;
	-moz-appearance:none;
	-webkit-appearance:none;
	appearance:none;
	background:#ffffff url('https://static.moneysmart.gov.au/nextgen/img/arrow-down-small-grey.gif')no-repeat 95% 50%;
}
#content select::-ms-expand,#calculator-container select::-ms-expand {
	display: none;
}
.radio {
	display:flex;
	margin:1rem 0;
}
.radio p {
	text-align:center;
	margin:0 2rem 0 0;
	max-width:10rem;
}
.full-width {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	background-color: #ebebeb;
}
.full-width > div {
	max-width: 55rem;
	margin: 0 auto;
	padding: 0 1rem;
}

.packList{
	counter-reset: packList-counter;
	list-style: none;
	padding:0;
}
.packList li{
	counter-increment:  packList-counter;
	background-color: #fff;
	padding: 1.5rem 7rem;
	margin-bottom: 1rem;
	position: relative;
	box-shadow: 0.2rem 0.2rem 0.2rem #cccccc;
}
.packList li span {
	display:block;
	margin-bottom:1rem;
}
.packList li::before{
	content: counter(packList-counter);
	font-size: 2.5rem;
	border-radius: 5rem;
	background-color: #0047F5;
	min-width: 4rem;
	color: #ffffff;
	display: inline-block;
	text-align: center;
	position: absolute;
	left: 1.5rem;
	top: 1rem;
	width:4rem;
	height:4rem;
}
.packList li.complete::before{
	content: "âœ”";
	text-indent:-9999rem;
	background: #0047F5 url('https://static.moneysmart.gov.au/nextgen/img/thick-tick-white.svg');
	background-position-x: center;
	background-position-y: center;
	background-repeat: no-repeat;
	background-size: 2.5rem;
}

.packList li a {
	color: #0047F5;
	font-size: 1.75rem;
	font-family: 'Cards', sans-serif;
	font-weight: 600;
	line-height: 1.24;
	margin-bottom:1rem;
	display:block;
}
.stepText {
	color: #ffffff;
	margin-bottom: 0.5rem;
}
.packTimeText{
	text-transform: uppercase;
	font-size: 0.8rem;
	margin: 2rem 0 0 0;
	color: #666666;
}



/* alerts */
.alert{
	position:fixed;
	bottom: 0;
	width:100%;
	background-color: #ffffff;
	padding: 2rem 1rem;
	box-shadow: 0 -0.25rem 0.5rem #999999;
	box-sizing: border-box;
	z-index:10;
}
.alert p{
	max-width: 55rem;
	margin: 0 auto;
}
.alert.hidden{display:none;}


/* start inpage feedback triage tool */
body.pagetype-starter-pack aside.feedback, body.pagetype-hub aside.feedback { display: none; }
aside.feedback {background-color: var(--ms-color-primary-black-500);padding: 1rem 0;max-width: 55rem;margin: 1rem auto;border-radius: .5rem;color: #fff;margin-bottom: 1.5rem;}
aside.feedback label {display: inline;color: var(--ms-color-extended-black-200);}
aside.feedback > div {max-width:var(--ms-max-content-width);padding:0 1rem;}
aside.feedback .question { display: flex; }
aside.feedback .thanks { text-align: center; font-size: 1.5rem; color: #0047F5;  }
#feedback-useful {font-weight: bold;margin-right: auto;color: var(--ms-color-extended-black-200);}
#feedbackyes, #feedbackno { margin-top: 1rem; }
#feedbackyes > div:last-of-type, #feedbackno > div:last-of-type { margin-top: 1rem; }
#feedback-your { display: none; }
#feedbacktriage label {
	display: block;
	font-weight: bold;
}
#feedbacktriage input, #feedbacktriage select, #feedbacktriage textarea {
	width: 100%;
	border: solid 1px #ccc;
}
#feedbacktriage select {
	padding:1rem 2rem 1rem 1rem;
	font:normal normal normal 1rem/100% 'Cards', sans-serif;
	border-radius:0.25rem;
	-moz-appearance:none;
	-webkit-appearance:none;
	appearance:none;
	background:#ffffff url('https://static.moneysmart.gov.au/nextgen/img/arrow-down-small-grey.gif')no-repeat 95% 50%;
}
#feedbacktriage select::-ms-expand {
	display: none;
}
input[type="email"], #feedbacktriage textarea  {
	padding:1rem;
	font:normal normal normal 1rem/100% 'Cards', sans-serif;
	border-radius:0.25rem;
	box-sizing:border-box;
}
#feedbacktriage textarea  { min-height: 12rem; }
#feedbacktriage .buttons { text-align: right; margin-top: 1rem;  }
#feedbacktriage { border: solid 1px #ccc; padding: 1rem; margin-top: 1rem;}
.feedback .hidden { display: none; }
.feedbackdetails { margin-top: 1rem; }
/* end inpage feedback triage tool */


/* Print styles */
@media print {
	header, #breadcrumbs, #pagetime, #jumplinks, aside.feedback, footer, #bannerAlert, .upnext, .caseStudyFooter { display: none }
	#hero:before { margin-bottom: 1rem;; content: url(https://static.moneysmart.gov.au/nextgen/img/header-logo-color.svg); display: block; text-align:center; width: 18rem; margin: 1rem auto; }
	#heroImg { background-image: none !important; }
	#hero { background: transparent; margin: 0; }
	#heroText { min-height: auto; padding: 0; margin-bottom: 3rem; }
	h1, #pagetagline { color: #333; }
	.accordianRow.closed .accordianRowContent { display:block; }
	.pagetype-calculator .accordianRow.closed .accordianRowContent { display: none; }
	.caseStudyContent { max-height: none; }
}


/* kids pack */
li.locked{
	opacity:0.5;
	cursor:default;
}

.loading-dots:before {
	content: none; }
.loading-dots span {
	animation-name: blink;
	animation-duration: 1.2s;
	animation-iteration-count: infinite;
	animation-fill-mode: both; }
.loading-dots span:nth-child(2) {
	animation-delay: .2s; }
.loading-dots span:nth-child(3) {
	animation-delay: .4s; }

@keyframes blink {
	0% {
		opacity: .1; }
	10% {
		opacity: .1; }
	20% {
		opacity: 1; }
	90% {
		opacity: 1; }
	100% {
		opacity: 1; }
}

/* temporary signage */
/*body.pagetype-calculator:before, body.pagetype-starter-pack:before {
    content: "Styles will be applied to calculators in January 2026";
    color: var(--ms-color-primary-black-500);
    position: fixed;
    z-index: 1;
    background-color: var(--ms-color-primary-green-400);
    font-weight: bold;
    padding: 1rem;
    right: 0;
}*/

/*
footer:after {
	content: "Disclaimer: This website is a work in progress and may not fully reflect Moneysmart's new brand";
	color: var(--ms-color-primary-green-400);
	background-color: var(--ms-color-primary-black-500);
	display: block;
	padding: 1rem;
}
*/


/* H2 scroll tracking widget */
#h2-scroll-tracker {
	position: absolute;
	left: 100%;
	top: 100px;
	margin-left: 40px;
	display: none; /* Hidden by default to prevent horizontal scroll */
	flex-direction: column; gap: 1.5rem;
	z-index: 0; padding: 1rem;
	/* Font family removed to inherit from parent */
	opacity: 0; pointer-events: none;
	transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	transform: translateX(20px); /* Initial offset for entrance animation */
}
#h2-scroll-tracker a { text-decoration: none; }
#h2-scroll-tracker.is-fixed {
	position: fixed;
	top: 50%;
	transform: translateY(-50%) translateX(20px);
}

#h2-scroll-tracker.visible {
	display: flex; /* Show the element */
}

/* Active entrance animation */
#h2-scroll-tracker.animate-in {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(0);
}

#h2-scroll-tracker.is-fixed.animate-in {
	transform: translateY(-50%) translateX(0);
}

#h2-scroll-tracker::before {
	content: ''; position: absolute;
	left: 31px;
	top: 2rem; bottom: 2rem;
	width: 2px; background: #e5e7eb; z-index: -1;
}

.nav-item {
	position: relative; display: flex; align-items: center;
	cursor: pointer; text-decoration: none; color: inherit;
	justify-content: flex-start;
}

.nav-number {
	width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 14px; background-color: #E3F1FF;
	color: #1f2937; border-radius: 4px; transition: all 0.3s ease;
	box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.nav-item.passed .nav-number { background-color: #3348F4; color: white; }

.nav-item.active .nav-number {
	background-color: #52fB91; color: #1f2937; transform: scale(1.15);
	box-shadow: 0 4px 12px rgba(82, 251, 145, 0.4); z-index: 2;
}

.nav-label {
	position: absolute;
	right: 45px;
	background: var(--ms-color-extended-black-100);
	padding: 8px 16px;
	border-radius: 8px;
	font-size: 0.875rem;
	white-space: nowrap;
	opacity: 0;
	transform: translateX(10px);
	transition: all 0.3s ease;
	box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
	border: 1px solid var(--ms-color-extended-black-200);
	pointer-events: none;
}

.nav-item:hover .nav-label {
	opacity: 1; transform: translateX(0);
}

/* H2 Highlight Styles */
h2.nav-highlight-active {
	background-color: #DCFEE9 !important;
	transition: background-color 0.4s ease; /* Faster fade in */
	border-radius: 4px;
}

#mainContent h2 {
	border-bottom: solid 3px var(--ms-color-primary-green-400);
	transition: background-color 1.2s ease; /* Slower fade out */
}
#mainContent > h2 {
	font-size: var(--ms-text-title-large-size);
	font-weight: var(--ms-font-weight-semibold);
}
#mainContent .accordian h2 {
	border-bottom: 0;
}

/* After go live the inlines styles on these buttons should be removed and this CSS tidyied up - e.g. /check-and-report-scams/report-an-investment-scam  */
.calculatorLink.calculatorLink.calculatorLinkScam {
	background-image: none;
	padding: 0;
	background-color: var(--ms-color-primary-blue-400);
}
.calculatorLink.calculatorLink + p {
	margin-top: 1.5rem;
}
.calculatorLink.calculatorLinkScam p:first-child {
	color: var(--ms-color-primary-white);
	padding: 0;
}
.calculatorLink.calculatorLinkScam p:last-child {
	display:none;
}
.calculatorLink.calculatorLinkScam::before {
	content: "phishing";
}
.calculatorLink.calculatorLinkScam::after {
	content: "Report a scam";
}

/* CALCULATOR SPECIFIC OVERRIDES (after launch we should strip out the old onpage CSS and simplify this code) */
/* CALCULATOR OVERRIDES */
#content .ms-calc, #content .calc-container, #content #lifeInsuranceContainer { margin: 3rem 0; border: 0; background-color: var(--ms-color-extended-black-100); border-radius: 8px; }
#content .calc-container h2, #lifeInsuranceContainer h2.shaded { border-bottom: solid 2px var(--ms-color-primary-green-400) !important; }
#content .ms-calc .flex, #content .ms-calc .explore {   }
#content #calculator-container .input { border:0; }
#content #calculator-container h4, #content #calculator-container .highlight-container, #content .ms-calc.skin-nextgen #savingsGoalsResultsContainer .results-container { background-color: var(--ms-color-primary-black-500) !important; }
#content .ms-calc input[type=number], .ms-calc input[type=text] { solid 1px var(--ms-color-extended-black-300) !important; }
#content .ms-calc select { border: solid 1px var(--ms-color-extended-black-300) !important; }
#content .ms-calc h2.shaded, #calculator-container h2, #lifeInsuranceContainer h2.shaded { background-color: transparent !important; color: var(--ms-color-primary-black-500) !important;  }
#content .ms-calc .result-box>h3:first-child { color: var(--ms-color-primary-black-500) !important;  }
#content .ms-calc .result-box { border: 0; }
#content select, #calculator-container select {
	border-radius: 4px !important;
}
#content .ms-calc.skin-nextgen input[type="text"], .ms-calc.skin-nextgen select {
	margin-right: .5rem;
	border-radius: 4px !important;
	border: solid 1px var(--ms-color-extended-black-300) !important;
}
#content .ms-calc.skin-nextgen #incomeTaxResultsContainer .results-container { background: var(--ms-color-primary-black-500);  }
#content .ms-calc.skin-nextgen #incomeTaxResultsContainer table th, #mainContent .ms-calc th { color: var(--ms-color-primary-black-500); }
#content #content select, #calculator-container select.whatifPicker { background: url('https://static.moneysmart.gov.au/nextgen/img/arrow-down-small-grey.gif')no-repeat 100% 50%;  }
#content .ms-calc .tooltip:not(.glossButton), #fa-search .tooltip, .dialog .tooltip, #content #calculator-container .tooltip:not(.glossButton), #content #umsearch .tooltip:not(.glossButton), .ms-calc .tooltip:not(.glossButton) { background-color: var(--ms-color-primary-green-400) !important; color: var(--ms-color-primary-black-500) !important; }
#content .ms-calc .tooltip .tooltiptext:not(.glossButton), #calculator-container .tooltip .tooltiptext:not(.glossButton), #umsearch .tooltip .tooltiptext:not(.glossButton), .ms-calc .tooltip .tooltiptext:not(.glossButton), .tooltip:not(.glossButton) .tooltiptext { background-color: var(--ms-color-extended-oat-100) !important; }
#content .ms-calc .tooltip .tooltiptext:after { border-top-color: var(--ms-color-extended-oat-100) !important; }
#content #fillInCalc select.fillin { border-bottom: solid 2px var(--ms-color-primary-green-400) !important;  }

#calculator-container h3.credit, #calculator-container h3.debit, #calculator-container #results-claims table.sorttop tr:nth-child(2) th {background-color: var(--ms-color-primary-blue-400) !important; }

#content .calcUserData .header #btnSettings:before { background-color: var(--ms-color-primary-black-500) !important; box-shadow: 0 0 0 2px var(--ms-color-primary-black-500), 0 11px 0 2px var(--ms-color-primary-black-500), 0 -11px 0 2px var(--ms-color-primary-black-500); }
#content #budgetPlanner .header h2 { border-bottom: 0; }
#content .ms-calc hr { display: none !important; }
#content .ms-calc .explore .exploreToggle, #content .ms-calc .explore h4 { background-color: var(--ms-color-primary-blue-400) !important;  }
#content .ms-calc #results, #content .ms-calc .input, #content #calculator-container .result, #creditcardContainer .result-box, #superAndPensionAgeContainer .result-box { background-color: var(--ms-color-extended-black-100) !important; border: 0 !important;  }
#lifeInsuranceContainer #calcNav ul li.active { border-bottom: 3px solid var(--ms-color-primary-blue-400) !important;  }
.radiowrapper label.selected, .radiowrapper label:hover, #toolkit .profile li, #toolkit ul#reading-list li { background-color: var(--ms-color-primary-blue-400) !important; }
#lifeInsuranceContainer .vpNav { padding-bottom: 1rem; }
#content .ms-calc, #content .calc-container { padding-bottom: 1rem; }
#content .action-blue, .ms-calc .enlarge-text { color: var(--ms-color-primary-blue-400) !important; }
#calculator-container #results-claims table th { background-color: var(--ms-color-primary-black-500) !important; color: var(--ms-color-primary-white) !important;  }
#content #calculator-container .sort.asc { border-color: transparent transparent var(--ms-color-primary-white); }
#content #calculator-container .sort.desc {border-color: var(--ms-color-primary-white) transparent transparent;}

#calc-investor-alert-list .results-table th { background-color: var(--ms-color-primary-black-500) !important;  }
#calc-investor-alert-list .sortable.asc .sort.asc { border-color: transparent transparent var(--ms-color-primary-green-400) !important; }
#calc-investor-alert-list .sortable.desc .sort.desc { border-color: var(--ms-color-primary-green-400) transparent transparent !important; }
#content #autosave .autosave-heading p:first-child { color: var(--ms-color-primary-green-400); }
#content #autosave .toggle-checkbox:checked+.switch	{ background-color: var(--ms-color-primary-green-400); }
#content #autosave .switch { background-color: var(--ms-chart-color-7); }
#budgetPlanner .input #summary>h3 { background-color: var(--ms-color-primary-blue-400) !important; }
#content .ms-calc .explore .exploreToggle.light { color: var(--ms-color-primary-white); }
#content #creditcardContainer .result-box p.inline-result { border-top: 0; }

#content #umsearch { border-radius: 12px; }
#content #umsearch h2 { background-color: transparent; color: inherit; border-bottom: solid 2px var(--ms-color-primary-green-400); }
#mainContent #content #umsearch th { background-color: var(--ms-color-primary-black-500); color: var(--ms-color-extended-black-200);  }
#mainContent #content #umsearch .details th { background-color: transparent; color: var(--ms-color-primary-black-500); }
#mainContent #content #umsearch .howtoclaim { border: 3px solid var(--ms-color-extended-oat-200); }
#mainContent #content #umsearc .odd, #mainContent #content #umsearc .odd tr { background-color: var(--ms-color-extended-black-100); }
#content #fa-search { border-radius: 12px; }
#content #fa-search .results-table th { background-color: var(--ms-color-primary-black-500); }
#content .ms-calc, #content .calc-container, .ms-calc.skin-nextgen { max-width: 100%; }

/*
Overrides for CSS that is on specific pages - We should remove this from the advanced tab post go live so this is not needed
*/
#content .left-gradient-box {
	margin: 2rem 0;
	padding: 3rem 2.5rem;
	border-radius: 12px;
	background-color: var(--ms-color-primary-blue-100);
	position: relative;
}
#content .left-gradient-box h3 {
	font-family: inherit;
	font-size: 1.25rem;
	font-weight: bold;
	margin: inherit;
	color: inherit;
	margin-top: .5rem;
}
#content .left-gradient-box::after { display: none; }
#content .left-gradient-box::before {
	color: var(--ms-color-extended-black-400);
	font-size: 1rem;
	display: block;
	font-weight: normal;
	content: "Case study";
	text-transform: uppercase;
	margin-bottom: 0;
}
#content .left-border-box h2, #content .left-border-box h3 {
	font-family: inherit;
	font-size: 1.4rem;
	margin: 1.5rem 0 1rem 0;
}
#content .left-border-box {
	margin: 3rem 0 2rem 0;
	padding: 0 1.5rem;
	border: 1px solid var(--ms-color-primary-blue-400) !important;
	border-radius: 12px;
	background-color: var(--ms-color-primary-white);
}

/* OVERRIDE BILLY LOADING SPINNER */
.loading {
	position: relative;
	margin: 0 auto 60px auto;
}
.loading img {
	display: none;
}
.loading::after {
	content: "";
	position: absolute;
	top: 30px;
	left: calc(50% - 30px);
	width: 40px;
	height: 40px;
	border: 4px solid var(--ms-color-extended-black-100);
	border-top: 4px solid var(--ms-color-primary-blue-400);
	border-radius: 50%;
	animation: spin 1.5s linear infinite;
}
@keyframes spin {
	0% { transform: rotate(0deg);}
	100% { transform: rotate(360deg);}
}

/* UP NEXT SCROLLING */
.upnext {
	position: relative;
	padding-right: 0;
	padding-left: 0;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	max-width: 100%;
}
.upnext h2 {
	padding-left: .5rem;
	padding-right: 7rem;
}

.scroll-list-wrapper {
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
	scroll-padding: .5rem;
	scrollbar-width: none;
	scroll-behavior: smooth;
}

.scroll-list {
	width: fit-content;
}
.scroll-list li {
	scroll-snap-align: start;
}
.scroll-list li:last-child {
	margin-right: .5rem;
}

.container-upnext-buttons {
	position: absolute;
	display: flex;
	column-gap: .5rem;
	right: 0;
	top: -1.5rem;
	padding: 0 1rem;
}
.upnext .container-upnext-buttons {
	top: 0;
	right: 0;
	padding: 2.5rem 1rem 0 1rem;
}
@media screen and (min-width:60em){
	.container-upnext-buttons {
		right: calc((100% - var(--ms-max-inner-width)) / 2);
	}
}

.container-upnext-buttons[hidden] {
	display: none;
}
.container-upnext-buttons button {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--ms-color-primary-white);
	color: var(--ms-color-primary-black-500);
	border: 1px solid var(--ms-color-primary-black-500);
	border-radius: 8px;
	width: 2.5rem;
	height: 2rem;
}
.container-upnext-buttons button:not([disabled]):hover {
	background-color: var(--ms-color-primary-green-400);
}
.container-upnext-buttons button[disabled] {
	cursor:not-allowed;
	border-color: var(--ms-color-extended-black-200);
	color: var(--ms-color-extended-black-200);
}

@media screen and (min-width:1080px){
	.upnext h2 {
		padding-left: calc((100% - var(--ms-max-inner-width)) / 2);
		max-width: 38ch;
		padding-right: 0;
	}

	.scroll-list {
		padding-inline: calc((100% - var(--ms-max-inner-width)) / 2);
	}

	.scroll-list-wrapper {
		scroll-padding: calc((100% - var(--ms-max-inner-width)) / 2);
	}
}

/* BUTTONS */
.ms-card-cta, #content a.ms-card-cta {
	display: inline-block;
	justify-self: start;
	background: var(--ms-color-primary-white);
	color: var(--ms-color-primary-black-500);
	line-height: 1.59;
	padding: 0.5rem 2.5rem 0.5rem 1rem;
	border-radius: 10px;
	position: relative;
	font-size: var(--ms-base-font-size);
	font-family: 'Cards', sans-serif;
	text-decoration: none;
	white-space: nowrap;
&::after {
	 content: "arrow_outward" / "";
	 font-family: 'Material Symbols Outlined';
	 display: inline-block;
	 font-size: 1em;
	 line-height: 1;
	 position: absolute;
	 font-weight: 600;
	 top: .85em;
	 right: 1em;
	 transition: transform 0.2s linear;
	 transform-origin: center left;
 }

&:hover, &:focus {
			  background: var(--ms-color-primary-green-400);
&::after {
	 transform: scale(1.25);
 }
}
}

.ms-card-cta.ms-card-cta-blue, #content a.ms-card-cta.ms-card-cta-blue  {
	background: var(--ms-color-primary-blue-400);
	color: var(--ms-color-primary-white);

&:hover, &:focus {
			  color: var(--ms-color-primary-black-500);
			  background: var(--ms-color-primary-green-400);
		  }
}

.ms-card-cta.ms-card-cta-green, #content a.ms-card-cta.ms-card-cta-green {
	color: var(--ms-color-primary-black-500);
	background: var(--ms-color-primary-green-400);
}

ul:has(.ms-card-cta) li:hover .ms-card-cta, ul:has(.ms-card-cta) li:focus-within .ms-card-cta {
	background: var(--ms-color-primary-green-400);
	color: var(--ms-color-primary-black-500);
}

ul:has(.ms-card-cta) li:hover .ms-card-cta::after, ul:has(.ms-card-cta) li:focus-within .ms-card-cta::after {
	transform: scale(1.25);
}

.ms-card-cta.ms-card-cta-large, #content a.ms-card-cta.ms-card-cta-large {
	font-size: 1.125rem;
}


