/* --------------------------------------------------------------------------- forms Base */

/*
#######################

Radio Buttons

#######################
*/
form label.radioButtonLabel, .form label.radioButtonLabel
	{
	float:left;
	position:relative;
	display:block;
	/*min-width:10px;*/
	min-height:10px;
	background-color:transparent;
	margin-left:4px;
	margin-right:15px;
	
	margin-top:0px;

	-moz-box-sizing:		border-box;
	-webkit-box-sizing:		border-box;
	box-sizing:					border-box;

	cursor:pointer;
	}


/*
label.radioButtonLabel.radioButtonLabelInLine
	{
	display:block;

	position:relative;
	float:left;

	background:blue;
	}

label.radioButtonLabel.radioButtonLabelInLine span
	{
	position:relative;
	float:left;
	background:lime;
	}

*/

/* HTML5 Boilerplate accessible hidden styles */
[type="radio"] 
	{
	border: 0; 
	clip: rect(0 0 0 0); 
	height: 1px; margin: -1px; 
	overflow: hidden;
	padding: 0; 
	position: absolute; 
	width: 1px;
	}

/* One radio button per line */
label.radioButtonLabel
	{
	/*
	display: block;
	width:100%;
	*/
	}

[type="radio"] + span 
	{
	display: block;

	background-color:transparent;
	}

/* 
============================
the basic, unchecked style 
============================
*/

[type="radio"] + span:before 
	{
	content: '';
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	vertical-align: -0.20em;
	border-radius: 0em;
	border-radius: 20px;

	/*border: 0.125em solid #1b2350;*/
	box-shadow: 0 0 0 0.005em #1b2350;
	background-color:#fff;

	margin-right: 0.75em;
	transition: 0.5s ease all;

	-moz-box-sizing:		border-box;
	-webkit-box-sizing:		border-box;
	box-sizing:					border-box;

							/* left top blur spread */
	-moz-box-shadow:			2px 2px 5px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow:		2px 2px 5px 0px rgba(0,0,0,0.2);
	box-shadow:					2px 2px 5px 0px rgba(0,0,0,0.2);
	}

/* 
============================
the checked style using the :checked pseudo class 
============================
*/

[type="radio"]:checked + span:before 
	{

	border: 0.125em solid #1b2350;
	box-shadow: 0 0 0 0.05em #1b2350;
	background-color:#1b2350;

	/*background: url('/images/icons/tick.svg') no-repeat left top 100%;*/

							/* left top blur spread */
	-moz-box-shadow:			2px 2px 5px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow:		2px 2px 5px 0px rgba(0,0,0,0.2);
	box-shadow:					2px 2px 5px 0px rgba(0,0,0,0.2);
	}

/* never forget focus styling */
/*
[type="radio"]:focus + span:after 
	{
	content: '\0020\2190';
	font-size: 1.5em;
	line-height: 1;
	vertical-align: -0.125em;
	}
*/

/* 
============================
YES / NO radio buttons
============================
*/

/* unchecked */
[type="radio"].radioYes + span:before
	{
	width:50px;
	height:30px;

	background:url("/images/svg/yesBlue.svg") center center / 35px 35px no-repeat, #ffffff;
	}

[type="radio"].radioNo + span:before
	{
	width:50px;
	height:30px;

	background:url("/images/svg/noBlue.svg") center center / 35px 35px no-repeat, #ffffff;
	}

/* checked */
[type="radio"].radioYes:checked + span:before
	{
	width:50px;
	height:30px;

	background:url("/images/svg/yes.svg") center center / 35px 35px no-repeat, #1b2350;
	}

[type="radio"].radioNo:checked + span:before
	{
	width:50px;
	height:30px;

	background:url("/images/svg/no.svg") center center / 35px 35px no-repeat, #1b2350;
	}


/* 
============================
YES / NO radio buttons V2
============================
*/

/* YES unchecked */
[type="radio"].radioYes + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, rgb(175,232,79);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, -moz-linear-gradient(top,  rgba(175,232,79,1) 0%, rgba(75,154,37,1) 100%);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, -webkit-linear-gradient(top,  rgba(175,232,79,1) 0%,rgba(75,154,37,1) 100%);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, linear-gradient(to bottom,  rgba(175,232,79,1) 0%,rgba(75,154,37,1) 100%);
	}

[type="radio"]:hover.radioYes + span:before
	{
	opacity:0.8;
	}

/* NO unchecked */
[type="radio"].radioNo + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, rgb(243,79,94);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, -moz-linear-gradient(top,  rgba(243,79,94,1) 0%, rgba(166,10,33,1) 100%);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, -webkit-linear-gradient(top,  rgba(243,79,94,1) 0%,rgba(166,10,33,1) 100%);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, linear-gradient(to bottom,  rgba(243,79,94,1) 0%,rgba(166,10,33,1) 100%);
	}

[type="radio"]:hover.radioNo + span:before
	{
	opacity:0.8;
	}

/* YES checked */
[type="radio"].radioYes:checked + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background:url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, #262262;
	}

[type="radio"]:hover.radioYes:checked + span:before
	{
	opacity:1;
	}

/* NO checked */
[type="radio"].radioNo:checked + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background:url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, #262262;
	}

[type="radio"]:hover.radioNo:checked + span:before
	{
	opacity:1;
	}

/* 
============================
YES / NO radio buttons V3
============================
*/

/* YES unchecked */
[type="radio"].radioYes + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background:url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, #262262;
	}

[type="radio"]:hover.radioYes + span:before
	{
	opacity:0.8;
	}

/* NO unchecked */
[type="radio"].radioNo + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background:url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, #262262;
	}

[type="radio"]:hover.radioNo + span:before
	{
	opacity:0.8;
	}

/* YES checked */
[type="radio"].radioYes:checked + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, rgb(175,232,79);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, -moz-linear-gradient(top,  rgba(175,232,79,1) 0%, rgba(75,154,37,1) 100%);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, -webkit-linear-gradient(top,  rgba(175,232,79,1) 0%,rgba(75,154,37,1) 100%);
	background: url("/images/svg/yes-v2.svg") center center / 38px 38px no-repeat, linear-gradient(to bottom,  rgba(175,232,79,1) 0%,rgba(75,154,37,1) 100%);
	}

[type="radio"]:hover.radioYes:checked + span:before
	{
	opacity:1;
	}

/* NO checked */
[type="radio"].radioNo:checked + span:before
	{
	width:50px;
	height:30px;

	border: 0em solid #1b2350;

	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, rgb(243,79,94);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, -moz-linear-gradient(top,  rgba(243,79,94,1) 0%, rgba(166,10,33,1) 100%);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, -webkit-linear-gradient(top,  rgba(243,79,94,1) 0%,rgba(166,10,33,1) 100%);
	background: url("/images/svg/no-v2.svg") center center / 38px 38px no-repeat, linear-gradient(to bottom,  rgba(243,79,94,1) 0%,rgba(166,10,33,1) 100%);
	}

[type="radio"]:hover.radioNo:checked + span:before
	{
	opacity:1;
	}