/* --- begin optional styles ---
 These styles are optional and may be omited to make the page 100% wide
*/
#afloswijzer {
	/* width:					726px; */
	margin:						0 auto;
	/* padding:					20px; */
}
/* --- end optional styles --- */

#afloswijzer .column-left, #afloswijzer .column-right {
	display:					inline-block;
	vertical-align:				top;
}

#afloswijzer .column-left {
	/* width:						53.62%; */
	width: 						100%;
}

#afloswijzer .column-right {
	/* width:						42.03%; */
	/* margin-left:				3.62%; */
	width: 						100%;
}

#afloswijzer .formrow.hidden {
	display:					none;
}

#afloswijzer .formfield {
	margin:						0;
}

#afloswijzer .formfield:last-child {
	border-bottom:				none;
}

#afloswijzer .formpage .formfield .afloswijzer .euro-container, .formpage .formfield .afloswijzer .percentage-container {
	position:					relative;
	width:						100%;
}
#afloswijzer .formpage .formfield .afloswijzer label {
	font-size:					16px;
}
#afloswijzer .formpage .formfield .percentage-container {
	display:					table;
}
#afloswijzer .formpage .formfield .percentage-container span.percentage-input {
	position:					absolute;
	right:						8px;
	margin-top:					8px;
	z-index:					9;
	font-size:					14px;
}
#afloswijzer .formpage .formfield input.percentage-input {
	padding-right:				20px;
}
#afloswijzer .formpage .formfield .afloswijzer .tooltip {
	margin-top:					-4px;
}

#afloswijzer .formpage .formfield .btn {
	float:						none;
}

#afloswijzer .radio-label {
	display:					inline-block;
	width:						200px;
}

#afloswijzer .radio-container {
	display:					inline-block;
}

#afloswijzer .radio-container label {
	height:						20px;
	margin-right:				10px;
}

#afloswijzer .radio-container input {
	margin:						0;
	vertical-align:				middle;
	border:						none;
}

#afloswijzer_resultaat {
	display:					none;
}

#afloswijzer .resultaat {
	height:						25px;
	margin-bottom:				15px;
	padding-left:				35px;
	line-height:				25px;
	background:					url("../img/afloswijzer_resultaat.png") no-repeat;
}

#afloswijzer .negative .resultaat {
	background-position:		left bottom;
}

#afloswijzer .afloswijzer_resultaat_positive, #afloswijzer .afloswijzer_resultaat_negative {
	display:					none;
}

#afloswijzer .positive .afloswijzer_resultaat_positive, #afloswijzer .negative .afloswijzer_resultaat_negative {
	display:					block;
}

#afloswijzer .positive span.afloswijzer_resultaat_positive, #afloswijzer .negative span.afloswijzer_resultaat_negative {
	display:					inline;
}

#afloswijzer table {
	width:						100%;
	margin:						10px 0;
}

#afloswijzer table td {
	padding:					1px 0 !important;
	border:						none !important;
}

#afloswijzer table td.right {
	float:						none;
	text-align:					right;
}

#afloswijzer table td.bottom {
	vertical-align:				bottom;
}

#afloswijzer table tr:nth-child(odd) td {
	background:					transparent;
}

#afloswijzer table td h3 {
	font-size:					1.17em;
}

#afloswijzer table .total_separator {
	float:						right;
	display:					block;
	width:						51px;
	height:						4px;
	margin:						10px 0;
	border-top:					1px dotted #999;
	border-bottom:				1px dotted #999;
}

#afloswijzer .total {
	font-weight:				bold;
	font-size:					1.5em;
}

#afloswijzer .grey {
	color:						#999;
}

#afloswijzer .hr {
	margin:						20px 0;
	border-bottom:				1px dotted #999;
}

#afloswijzer .error {
	color:						#F00;
}

@media screen and (max-width: 800px) {

	.tooltip:hover span {
		display:				block !important;
	}

	#afloswijzer {
		width:					auto !important;
	}

	#afloswijzer .column-right {
		margin-top:				40px !important;
	}
}

@media screen and (max-width: 480px) {

	#afloswijzer .btn {
		display:				block !important;
		width:					100%;
	}

}