
#mainContentWrapper
{
	background: #f7f7f7 !important;
	padding: 40px 10px;
}

#ReportTitle
{
	text-align: center;
}


#btnInputToggle,
#btnPDF
{
	display: none;
	cursor: pointer;
	float: right;
	width: 34px;
	height: 34px;

	background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;
	box-sizing: border-box;
	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
	border-radius: 6px;
}

#btnPDF
{
	display: block;
	width: 33px;
	height: 33px;
	background-image: url(/resources/images/icons/pdf-download.png);
	background-repeat: no-repeat;
	background-position: right 50% top 50%;
	background-color: transparent;
	background-size: cover;
}

#btnInputToggle .icon
{
	width: 100%;
	height: 100%;
	background-image: url(/resources/images/icons/filter.png);
	background-repeat: no-repeat;
	background-position: right 50% top 50%;
}

#btnInputToggle .icon:hover
{
	background-image: url(/resources/images/icons/filter-grey.png);
}

#btnPDF .icon
{
	/*
	width: 100%;
	height: 100%;
	background-image: url(/resources/images/icons/pdf-download.png);
	background-repeat: no-repeat;
	background-position: right 50% top 50%;
	*/
}


.ReportWrapper
{
	width: 100%;
	max-width: 1235px;
	margin: 0 auto;
	font-family: 'Roboto', sans-serif;
	font-style: normal;
}



/*  Input Pages  */

.ReportWrapper .InputWrapper .InputPage
{
	display: none;
}

.ReportWrapper .InputWrapper .InputPage.active
{
	display: block;
}




.ReportWrapper .InputWrapper .InputPage .Progress
{
	background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;
	border: 2px solid #FFFFFF;
	box-sizing: border-box;
	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
	border-radius: 10px;
	padding: 30px;
	width: 522px;
	float: left;
}


.ReportWrapper .InputWrapper .InputPage .HighlightImg
{
	background: #2196f3;
	border-radius: 10px;
	width: 100%;
	max-width: 462px;
	height: 530px;
}



.ReportWrapper .InputWrapper .InputPage .InputNumber
{
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 40px;
	line-height: 140%;
	color: #000;
	margin-top: 30px;

}


.ReportWrapper .InputWrapper .InputPage .InputTitle
{
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 34px;
	line-height: 140%;
	color: #000;
	margin-top: 30px;
	letter-spacing: 0;
}



.ReportWrapper .InputWrapper .InputPage .ProgressBarBars
{
	background: #F4F5F8;
	border-radius: 4px;
	height: 8px;
	display: flex;
	margin-top: 30px;
}

.ReportWrapper .InputWrapper .InputPage .ProgressBarBars .item
{
	flex: 1;
	background: none;
	height: 8px;
}


.ReportWrapper .InputWrapper .InputPage .ProgressBarBars .item.active
{
	border-radius: 4px;
	background: linear-gradient(270deg, rgba(245, 145, 88, 0) 0%, #F59158 100%);
	border-radius: 20px 0px 0px 20px;
}



.ReportWrapper .InputWrapper .InputPage .ProgressBarNumbers
{
	display: flex;
	margin-top: 10px;
}


.ReportWrapper .InputWrapper .InputPage .ProgressBarNumbers .item
{
	flex: 1;
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 140%;
	color: #999EAB;
}

.ReportWrapper .InputWrapper .InputPage .ProgressBarNumbers .item.active
{
	color: #F59158;
}

.ReportWrapper .InputWrapper .InputPage .Inputs
{
	
	width: 688px;
	float: right;
}



.ReportWrapper .InputWrapper .InputPage .Inputs .section
{
	width: 100%;
	min-height: 100px;

	background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;
	border: 2px solid #FFFFFF;
	box-sizing: border-box;

	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
	border-radius: 0px;

	padding: 20px;
}


.ReportWrapper .InputWrapper .InputPage .Inputs .section.first
{
	border-radius: 10px 10px 0px 0px;
}


.ReportWrapper .InputWrapper .InputPage .Inputs .section.last
{
	border-radius: 0px 0px 10px 10px;
	margin-bottom: 30px;
}

.ReportWrapper .InputWrapper .InputPage .Inputs .section.single
{
	border-radius: 10px;
	margin-bottom: 30px;
}



.ReportWrapper .InputWrapper .InputPage .Inputs .section .row
{
	display: flex;
	margin-bottom: 40px;
}

.ReportWrapper .InputWrapper .InputPage .Inputs .section .row.nomargin
{
	margin-top: 0px;
}

.ReportWrapper .InputWrapper .InputPage .Inputs .section .rowNote
{
	margin-bottom: -25px;
	text-align: center;
}


.ReportWrapper .InputWrapper .InputPage .Inputs .section .rowHeader
{
	font-weight: bold;
	font-size: 18px;
	line-height: 140%;
	color: #040707;
	padding-left: 15px;
	margin-bottom: 10px;
	margin-top: 10px;
}


.datepicker.monthyear .ui-datepicker-calendar
{
	display: none;
}








.Inputs button,
.Inputs .button
{
	float: right;
}


button.small,
.button.small
{
	background: #2196F3;
	width: 140px;
	box-shadow: none;
	font-size: 16px;
	padding: initial;
	min-width: inherit;
}

button.small:hover,
.button.small:hover
{
	background: #4CAEFD;
}

button.small:active,
.button.small:active
{
	background: #248CDE;
}



button.small.white,
.button.small.white
{
	background: #fff;
	border: 1px solid #2196F3;
	color: #2196F3;
}

button.small.white:hover,
.button.small.white:hover
{
	color: #4CAEFD;
	border: 1px solid #4CAEFD;
}

button.small.white:active,
.button.small.white:active
{
	color: #248CDE;
	border: 1px solid #248CDE;
}

.button.Centre
{
	display: block;
	margin: 0 auto;
}

.button.Wide
{
	max-width: 100%;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
}


p,
li
{
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	color: #040707;
	margin-top: 0px;
}


.InputItem
{
	width: 100%;
	max-width: 290px;
	padding: 0 15px;
	flex: 1;
	box-sizing: border-box;
}


.ResultsInput .InputItem
{
	max-width: 100%;
}


.InputItem.Centre
{
	margin: 0 auto;
}

.InputItem.PensionPlan .Label
{
	font-weight: bold;
}
.InputItem.PensionPlan .Name
{
	margin: 5px 0;
	font-size: 20px;
}



.InputItem .InputItemWrapper
{
	border: 1px solid #DADEE8;
	box-sizing: border-box;
	border-radius: 4px;
	background: #fff;
	width: 100%;
	padding: 0;
}

.InputItem .InputItemWrapper.Dark
{
	background-color: #f7f7f7;
}

.InputItem.error .InputItemWrapper
{
	border: 1px solid #F44646;
}

.InputItem .Instructions
{
	font-size: 16px;
	line-height: 18px;
	color: #343D57;
	margin-bottom: 7px;
}

.InputItem .Instructions.oneline
{
	height: 20px;
}
.InputItem .Instructions.twoline
{
	height: 40px;
}


.InputItem .Subnote
{
	font-style: italic;
	font-size: 14px;
	line-height: 14px;
	color: #343D57;
	margin-top: 7px;
	margin-left: 10px;
}

.InputItem .InputItemWrapper label
{
	display: block;
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 12px;
	line-height: 14px;
	color: #343D57;
	padding: 8px 15px;
	margin: 0;
}


.InputItem .InputSwitchWrapper
{
	display: flex;
}


.InputItem .InputSwitchWrapper .button
{
	background: #fff;
	float: none;
	flex: 1;
	color: #949FB7;
	margin: 0;
	box-shadow: none;

	border: 1px solid #DADEE8;
	border-right: 1px solid #fff;
	border-radius: 0;
	line-height: 57px;
	min-width: initial;
}

.InputItem .InputSwitchWrapper .button.first
{
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.InputItem .InputSwitchWrapper .button.last
{
	border-right: 1px solid #DADEE8;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}


.InputItem .InputSwitchWrapper .button.active,
.InputItem .InputSwitchWrapper .button:hover
{
	color: #F59158;
	background: #FDE9DE;
	border: 1px solid #FDE9DE;
}

.InputItem .InputSwitchWrapper .button.last.active
{
	border-right: 1px solid #FDE9DE;
}




input,
select
{
	outline: none;
}



.InputItem .InputItemWrapper input,
.InputItem .InputItemWrapper select
{
	display: block;
	font-family: 'Roboto', sans-serif;
	background: none;
	border: none;
	outline: none;
	padding: 8px 15px;
	padding-top: 0;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	font-size: 16px;
	line-height: 140%;
	color: #040707;
}

.InputItem .InputItemWrapper select
{
	width: -webkit-calc(100% - 10px);
	width:    -moz-calc(100% - 10px);
	width:         calc(100% - 10px);
}


.InputItem .ErrorMsg
{
	font-family: 'Roboto', sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 12px;
	line-height: 14px;
	color: #EE5353;
	padding-left: 15px;
	padding-top: 8px;
	height: 22px;
}

.InputItem.date .InputItemWrapper
{
	background-image: url(/resources/images/icons/calendar-today.png);
	background-repeat: no-repeat;
	background-position: right 10px top 50%;
}

.InputItem.money .InputItemWrapper
{
	background-image: url(/resources/images/icons/dollar.png);
	background-repeat: no-repeat;
	background-position: left 10px top 75%;
}

.InputItem .InputItemWrapper input.money
{
	padding-left: 25px;
}


/*  Results Pages  */

.ReportWrapper .ResultsWrapper
{
}

.ReportWrapper .ResultsWrapper.nolink
{
	margin-top: 35px;
}

.ReportWrapper .ResultsWrapper .ResultsInput
{
	display: block;
	margin-top: 70px;
	padding-top: 10px;
	float: left;
	width: 340px;
	background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;
	box-sizing: border-box;
	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
	border-radius: 10px;
}

.ReportWrapper .ResultsWrapper .ResultsInput .section
{
	border-bottom: 5px solid #F6F8FA;
}

.ReportWrapper .ResultsWrapper .ResultsInput .section.buttons
{
	border: none;
	padding-bottom: 20px;
	padding-top: 30px;
	text-align: center;
}

.ReportWrapper .ResultsWrapper .ResultsInput .section .header
{
	padding-left: 20px;
	font-weight: bold;
	font-size: 18px;
	line-height: 60px;
	color: #040707;
	height: 60px;
	cursor: pointer;
	background-image: url(/resources/images/icons/triangle-down.png);
	background-repeat: no-repeat;
    background-position: right 10px top 50%;
}

.ReportWrapper .ResultsWrapper .ResultsInput .section .content
{
	display: none;
	padding: 20px;
}

.ReportWrapper .ResultsWrapper .ResultsPages
{
	float: right;
	width: 880px;
}

.ReportWrapper .ResultsWrapper .ResultsPages h2
{
	font-weight: bold;
	font-size: 24px;
	line-height: 140%;
	color: #040707;
	margin-top: 0px;
	margin-bottom: 20px;
	text-align: center;
}

.ReportWrapper .ResultsWrapper .ResultsWrapper
{
	/*background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;*/
	box-sizing: border-box;
	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
	border-radius: 10px;
	padding: 0;
	overflow: hidden;
}

.ReportWrapper .ResultsWrapper .TabsWrapper
{
	position: relative;
	height: 68px;
	overflow: hidden;
	box-shadow: -3px -3px 10px #fbfbfb, 0px 0px 10px rgb(166 171 189 / 20%);
}


.ReportWrapper .ResultsWrapper .TabsWrapper .TabBtn
{
	
	width: 52px;
	background: #F7F7F7;
	opacity: 0.9;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	vertical-align: middle;
	line-height: 100%;
	font-size: 50px;
	cursor: pointer;
	z-index: 999;
}

.ReportWrapper .ResultsWrapper .TabsWrapper .TabBtn:hover
{
	opacity: 1;
}

.ReportWrapper .ResultsWrapper .TabsWrapper .TabBtn.right
{
	left: initial;
	right: 0;
}



.ReportWrapper .ResultsWrapper .TabsWrapper .tabs
{
	white-space: nowrap;
	height: 68px;
	border-bottom: 2px solid #F6F8FA;
	overflow: hidden;
	background: #fff;
	position: relative;
}



.ReportWrapper .ResultsWrapper .TabsWrapper .tabs .tab
{
	display: inline-block;
	padding: 0 25px;
	text-align: center;
	color: #B8BCC7;
	font-size: 16px;
	line-height: 68px;
	cursor: pointer;
	font-weight: normal;
	background: none;
	border: none;
}

.ReportWrapper .ResultsWrapper .TabsWrapper .tabs .tab.active
{
	color: #F59158;
}

.ReportWrapper .ResultsWrapper .TabsWrapper .tabs .tab:hover
{
	color: #F59158;
}



.ReportWrapper .ResultsWrapper .Page
{
	display: none;
}

.ReportWrapper .ResultsWrapper .Page.active
{
	display: block;
}

.ReportWrapper .ResultsWrapper .Page .section
{
	padding: 30px;
	background: linear-gradient(154.08deg, rgba(120, 124, 138, 0.02) 0%, rgba(255, 255, 255, 0) 83.65%), #FFFFFF;
	border: 2px solid #FFFFFF;
	box-sizing: border-box;
	/* 1 */

	box-shadow: -3px -3px 10px #FBFBFB, 0px 0px 10px rgba(166, 171, 189, 0.2);
}

.ReportWrapper .ResultsWrapper .Page .section.last
{

}

.ReportWrapper .ResultsWrapper .Page .section.noborder
{
	box-shadow: none;
    padding-top: 0;
}

.ReportWrapper .ResultsWrapper .spacer
{
    border-bottom: 5px solid #F6F8FA;
	margin: 40px 0;
}

.ReportWrapper .ResultsWrapper .Page .row
{
	display: flex;
}


.ReportWrapper .ResultsWrapper .Page .row .FlexItem
{
	flex: 1;
	font-size: 17px;
}

.ReportWrapper .ResultsWrapper .Page .row .FlexItem .header
{
	font-weight: bold;
	font-size: 19px;
	margin-bottom: 10px;
}


footer
{
	margin-top: 20px;
}


footer .content
{
	border: none;
}


.graph
{
	width: 100%;
	max-width: 800px;
	height: 400px;
	margin: 50px auto;
}




/* Tablet */

@media (max-width: 1275px)
{

	.ReportWrapper
	{
		width: 940px;
	}

	.ReportWrapper .ResultsWrapper .ResultsInput
	{
		width: 320px;
	}

	.ReportWrapper .ResultsWrapper .ResultsInput .section.buttons button,
	.ReportWrapper .ResultsWrapper .ResultsInput .section.buttons .button
	{
		width: 120px;
	}

	.ReportWrapper .ResultsWrapper .ResultsPages
	{
		width: 600px;
	}

	.ReportWrapper .InputWrapper .InputPage .Progress
	{
		width: 377px;
	}

	.ReportWrapper .InputWrapper .InputPage .Inputs
	{
		width: 537px;
	}

	.ReportWrapper .InputWrapper .InputPage .Inputs p
	{
		text-align: left;
	}

	.InputItem
	{
		width: 100%;
		max-width: 246px;
	}

	.InputItem .Instructions.twoline
	{
		height: 75px;
	}



}


/* Mobile */

@media (max-width: 940px)
{
	.ReportWrapper
	{
		width: 100%;
		max-width: 600px;
	}

	.ReportWrapper .ResultsWrapper .ResultsInput
	{
		float: none;
		width: 100%;
		max-width: 600px;
		display: none;
		position: absolute;
	    margin: 0 auto;
	    left: 10px;
	    right: 10px;
	    box-sizing: border-box;
	    width: initial;
	    top: 240px;
	    z-index: 9999;
	}

	.ReportWrapper .ResultsWrapper .ResultsInput .section.buttons button,
	.ReportWrapper .ResultsWrapper .ResultsInput .section.buttons .button
	{
		width: 140px;
	}

	.ReportWrapper .ResultsWrapper .ResultsPages
	{
		float: none;
		width: 100%;
	}


	#btnInputToggle
	{
		display: block;
		margin-left: 10px;
	}


	.ReportWrapper .InputWrapper .InputPage .Inputs .buttons
	{
		text-align: center;
		direction: rtl;
	}

	.ReportWrapper .InputWrapper .InputPage .Inputs .buttons button,
	.ReportWrapper .InputWrapper .InputPage .Inputs .buttons .button
	{
		float: none;
		width: 140px;
		padding: initial;
	}


	.ReportWrapper .InputWrapper .InputPage .HighlightImg
	{
		display: none;
	}

	.ReportWrapper .InputWrapper .InputPage .Progress
	{
		width: 100%;
		margin-bottom: 30px;
		padding-top: 0;
		padding-bottom: 20px;
	}

	.ReportWrapper .InputWrapper .InputPage .Inputs .section .row
	{
		display: block;
	}

	.InputItem .Instructions,
	.InputItem .Instructions.twoline
	{
		height: initial;
	}

	.ReportWrapper .InputWrapper .InputPage .InputTitle
	{
		font-size: 22px;
		float: left;
		margin-top: 10px;
	}

	.ReportWrapper .InputWrapper .InputPage .InputNumber
	{
		font-size: 22px;
		float: right;
		margin-top: 10px;
	}

	.ReportWrapper .InputWrapper .InputPage .ProgressBarBars
	{
		margin-top: 10px;
	}

	.ReportWrapper .InputWrapper .InputPage .Inputs
	{
		width: 100%;
	}

	.InputItem
	{
		max-width: 100%;
	}
}







/*  Info pages  */


.reportInfo .row
{
	border-bottom: 2px solid #998bff;
}


.reportInfo .row.first
{
	border-top: 2px solid #998bff;
	margin-top: 50px;
}

.reportInfo .row .header
{
	font-weight: bold;
	font-size: 25px;
	padding: 15px 0;
	cursor: pointer;
	padding-left: 5px;
}

.reportInfo .row .header:hover
{
	background-color: #efefef;
}


.reportInfo .row .toggleStatusIcon
{
	margin-right: 30px;
	font-size: 20px;
}


.reportInfo .row .answer
{
	display: none;
	margin-top: 20px;
	margin-left: 45px;
}

.reportInfo .row .answer h3
{
	margin-top: 50px;
}

.reportInfo .row .answer p
{
	margin-top: 0;
}


.reportLink,
.reportInfo .row .answer .reportLink
{
	margin: 50px 0;
}

.reportLink .button
{
	width: initial;
	line-height: 55px;
	padding: 0 20px;
}

.backlink
{
	text-align: right;
}

.backlink a
{
	color: #000;
	text-decoration: none;
	font-weight: bold;
}

.backlink a:hover
{
	text-decoration: underline;
}

.hidden
{
	display: none;
}


@media (max-width: 600px)
{
	.reportInfo .row .answer
	{
		margin: 0;
		margin-top: 20px;
	}

	.reportInfo .row .toggleStatusIcon
	{
		font-size: 20px;
		float: left;
	}

	.reportInfo .row .header
	{
		text-align: center;
	}
}

.tablink
{
	cursor: pointer;
}









.InputItem.feedback
{
	max-width: 80%;
	margin: 0 auto;
}


.InputItem.feedback textarea
{
	border: none;
	resize: none;
	width: 100%;
	box-sizing: border-box;
	outline: none;
	padding: 10px;
	height: 150px;
}

#ReportFeedbackResults
{
	display: none;
}

#ReportFeedback button
{
	float: right;
}

@media (max-width: 940px)
{
	#ReportFeedback button
	{
		float: none;
		margin: 0 auto;
		display: block;
	}
}

#btnRepurchase
{
	margin-top: 30px;
}
#btnRepurchase button
{
	max-width: 300px;
	font-weight: bold;
	width: 100%;
}

.TopHeader
{
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	line-height: 60px;
	color: #040707;
	height: 60px;
}

.iconUpdateInput
{
	display: none;
	cursor: pointer;
	vertical-align: middle;
}

@media (max-width: 940px)
{
	.iconUpdateInput
	{
		display: inline-block;
	}
}