@charset "utf-8"; 

/* ****************************** Tablet  Styles ****************************** */
@media (max-width: 992px) { 

	/* ********* Individual Element Styles ********* */
	.desktop {
		display: none;
	}
	
	/* ********* Form Styles ********* */
	section.form .row-inner-container .one {
		margin-right: 2%;
		width: 23%;
	}
	
	section.form .row-inner-container .two {
		width: 22%;
	}
	
	section.form .row-inner-container .three {
		width: 40%;
	}
	
	section.form .row-inner-container .form-cell.submit {
		width: 14%;
	}
	
	/* ********* Result Extras ********* */
	section.results-extras .right p {
		font-size: 1.188rem;
		line-height: 1.438;
		margin-bottom: 10px;
	}
	
	section.results-extras.for-maximize .right p,
	section.results-extras.for-maximize .left p {
		font-size: 1.188rem;
		line-height: 1.3;
		margin-bottom: 10px;
	}
	
	section.results-extras .btn,
	.call-to-action .btn {
		font-family: "FreightSans-Bold", helvetica, arial, sans-serif;
		font-size: 1.125rem;
		border-radius: .375rem;
		padding: 5px 10px 5px 10px;
	}
	
	
	/* ********* Result Styles ********* */
	section.results .row-inner-container {
		display: block;
	}
	
	section.results .box,
	section.results.max-contributions .box	{
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 70%;
		margin: auto;
		text-align: left;
	}
	
	section.results .box .icon-container {
	
	}
	
	section.results .box .text-num-container {
		display: block;
		margin-left: 20px;
	}
	
	section.results .box .text-num-container .text-container p {
		max-width: 100%;
		margin: 0;
	}
	
	section.results .box .text-num-container .percent.hide {
		display: none;
	}
	
	section.results .box .numbers-container .amount {
		padding-bottom: 0px;
	}
	
	section.results .box .numbers-container .percent {
		padding-top: 5px;
	}
	
	section.results .calc-symbol {
		width: 100%;
	}
	
	section.results .box.total-contributions {
		display: block;
		text-align: center;
	}
	
	section.results .max-contributions-summary {
		margin: auto;
		width: 70%;
		padding: 13px 35px 12px 35px;
		background-color: #60CE82;
		text-align: center;
		font-family: "FreightSans-Bold", helvetica, arial, sans-serif;
		color: #ffffff;
		font-size: 1.375rem;
		line-height: 1.75rem;
		border-bottom-left-radius: 8px; 
		border-bottom-right-radius: 8px;
	}
	
	section.results.max-contributions .max-contributions-summary {
		display: block !important;
	}
	
}



/* **************************** Large Mobile **************************** */
@media (max-width: 768px) { 

	/* ********* Header ********* */
	header {
		padding-top: 15px;
	}
	
	header .row-inner-container {
		display: block;
		margin-bottom: 15px;
	}
	
	header .right {
		padding-left: 0px;
	}
	
	header .left img {
		width: 140px;
	}
	
	header h1 {
		margin-top: 18px;
	}
	
	header #netbenefits-link a {
		font-size: 1.125rem;
	}
	
	
	/* ********* Form Styles ********* */
	section.form .row-inner-container {
		display: block;
	}
	
	section.form .row-inner-container .one {
		width: 100%;
	}

	section.form .row-inner-container .two {
		width: 100%
	}

	section.form .row-inner-container .three {
		width: 100%
	}

	section.form .row-inner-container .form-cell.submit {
		width: 100%;
	}
	
	label {
		max-width: 100%;
		margin-bottom: 14px;
	}

	.form-cell.two label {
		max-width: 100%;
	}
	
	section.form .row-inner-container .submit {
		padding-top: 5px;
		border-top-right-radius: 0px; 
		border-bottom-right-radius: 0px;
		border-bottom-left-radius: 2px; 
		border-bottom-right-radius: 2px;
	}
	
	
	/* ********* Result Styles ********* */
	section.results .box,
	section.results.max-contributions .box,
	section.results.max-contributions .max-contributions-summary	{
		width: 100%;
	}
	
	section.results-extras.for-maximize .right {
		display: block;
	}
	
	section.results-extras.for-maximize .right img {
		display: block;
		margin-bottom: 10px;
		margin-right: 0;
		width: 100%;
	}

	section.results-extras.for-maximize .right p,
	section.results-extras.for-maximize .left p {
		font-size: 1.625rem;
		line-height: 1.75rem;
	}

	
	/* ****************************** Call to Action Styles ****************************** */

	.full-row.call-to-action section p {
		text-align: center;
	}

	.full-row.call-to-action .btn_container {
		float: none;
		display: block;
	}
	
	.full-row.call-to-action .btn {
		float: none;
		display: inline-block;
		margin: 0 auto 1rem auto;
	}
}



/* **************************** Medium Mobile **************************** */
@media (max-width: 576px) { 

	/* ********* Structural Styles ********* */
	main {
		padding-bottom: 230px;
	}
	
	
	/* ********* Header ********* */
	header h1 {
		font-family: "FreightSans-Book", helvetica, arial, sans-serif;
		font-size: 1.563rem;
		line-height: 1.875rem;
	}
	
	header h2 {
		font-size: 1.25rem;
		line-height: 1.563rem;
	}
	
	
	/* ********* Result Styles ********* */	
	section.results.max-contributions .box.after-tax-contributions .text-num-container {
		max-width: 55%; /* This is because we're wrapping rows and we don't want this row to wrap */
	}


	/* ****************************** Call to Action Styles ****************************** */

	.full-row.call-to-action .call-to-action-narrow {
		margin-bottom: 1rem;
		padding: 0 15px
	}
	
	.full-row.call-to-action .call-to-action-narrow,
	.full-row.call-to-action .call-to-action-wide {
		float: none;
		width: 100%;
	}
	
	/* ********* Result Summary Styles ********* */	
	section.results-summary p {
		font-size: 1.25rem;
		line-height: 1.563rem;
	}
	
	section.results .max-contributions-summary {
		line-height: 1.5rem;
	}
	
	
	/* ********* Result Extras ********* */	
	section.results-extras .row-inner-container {
		display: block;
	}
	
	section.results-extras .left {
		width: 100%;
	}
	
	section.results-extras .right {
		width: 100%;
		margin-top: 25px;
	}

	section.results-extras .right p {
		font-size: 1.25rem;
		margin-bottom: 15px;
	}
	
	section.results-extras .btn,
	.call-to-action .btn {
		font-size: 1.25rem;
		border-radius: .375rem;
		padding: 6px 15px 6px 15px;
	}
	
	section.results-extras.for-maximize .left,
	section.results-extras.for-maximize .right {
		display: block;
		width: 100%;
	}
	
	#maximize_contributions_extras {
		text-align: center;
	}
			
	
	/* ********* Footer ********* */
	footer .nav {
		display: block;
	}
	
	footer .nav-item {
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 15px;
		border-left: 0px solid #000000;
		display: block;
	}
	
	footer .nav-item:last-child {
		padding-bottom: 0px;
	}

	
	/* ********* Modal Windows ********* */
	.modal-header {
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.modal-body {
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.modal h5.modal-title {
		font-size: 1.25rem;
		line-height: 1.563rem;
	}
	
}



/* **************************** Portrait Mobile **************************** */
@media (max-width: 425px) { 

	/* ********* Popovers ********* */
	section.results .box .popover-button {
		position: absolute; 
		top: 8px;
		right: 8px;
	}

	/* ********* Result Extras ********* */	
	section.results-extras.for-maximize .right p,
	section.results-extras.for-maximize .left p {
		font-size: 1.188rem;
		line-height: 1.3;
	}

}