/*਀
CUSTOM FORM ELEMENTS਀
Created by Ryan Fait਀眀眀眀⸀爀礀愀渀昀愀椀琀⸀挀漀洀
਀吀栀攀 漀渀氀礀 琀栀椀渀最猀 礀漀甀 洀愀礀 渀攀攀搀 琀漀 挀栀愀渀最攀 椀渀 琀栀椀猀 昀椀氀攀 愀爀攀 琀栀攀 昀漀氀氀漀眀椀渀最
variables: checkboxHeight, radioHeight and selectWidth (lines 24, 25, 26)਀
The numbers you set for checkboxHeight and radioHeight should be one quarter਀漀昀 琀栀攀 琀漀琀愀氀 栀攀椀最栀琀 漀昀 琀栀攀 椀洀愀最攀 眀愀渀琀 琀漀 甀猀攀 昀漀爀 挀栀攀挀欀戀漀砀攀猀 愀渀搀 爀愀搀椀漀
buttons. Both images should contain the four stages of both inputs stacked਀漀渀 琀漀瀀 漀昀 攀愀挀栀 漀琀栀攀爀 椀渀 琀栀椀猀 漀爀搀攀爀㨀 甀渀挀栀攀挀欀攀搀Ⰰ 甀渀挀栀攀挀欀攀搀ⴀ挀氀椀挀欀攀搀Ⰰ 挀栀攀挀欀攀搀Ⰰ
checked-clicked.਀
You may need to adjust your images a bit if there is a slight vertical਀洀漀瘀攀洀攀渀琀 搀甀爀椀渀最 琀栀攀 搀椀昀昀攀爀攀渀琀 猀琀愀最攀猀 漀昀 琀栀攀 戀甀琀琀漀渀 愀挀琀椀瘀愀琀椀漀渀⸀
਀吀栀攀 瘀愀氀甀攀 漀昀 猀攀氀攀挀琀圀椀搀琀栀 猀栀漀甀氀搀 戀攀 琀栀攀 眀椀搀琀栀 漀昀 礀漀甀爀 猀攀氀攀挀琀 氀椀猀琀 椀洀愀最攀⸀
਀嘀椀猀椀琀 栀琀琀瀀㨀⼀⼀爀礀愀渀昀愀椀琀⸀挀漀洀⼀ 昀漀爀 洀漀爀攀 椀渀昀漀爀洀愀琀椀漀渀⸀
਀⨀⼀
਀瘀愀爀 挀栀攀挀欀戀漀砀䠀攀椀最栀琀 㴀 ∀㈀㔀∀㬀
var radioHeight = "25";਀瘀愀爀 猀攀氀攀挀琀圀椀搀琀栀 㴀 ∀㄀㤀　∀㬀
਀
/* No need to change anything after this */਀
਀搀漀挀甀洀攀渀琀⸀眀爀椀琀攀⠀✀㰀猀琀礀氀攀 琀礀瀀攀㴀∀琀攀砀琀⼀挀猀猀∀㸀椀渀瀀甀琀⸀猀琀礀氀攀搀 笀 搀椀猀瀀氀愀礀㨀 渀漀渀攀㬀 紀 猀攀氀攀挀琀⸀猀琀礀氀攀搀 笀 瀀漀猀椀琀椀漀渀㨀 爀攀氀愀琀椀瘀攀㬀 眀椀搀琀栀㨀 ✀ ⬀ 猀攀氀攀挀琀圀椀搀琀栀 ⬀ ✀瀀砀㬀 漀瀀愀挀椀琀礀㨀 　㬀 昀椀氀琀攀爀㨀 愀氀瀀栀愀⠀漀瀀愀挀椀琀礀㴀　⤀㬀 稀ⴀ椀渀搀攀砀㨀 㔀㬀 紀 ⸀搀椀猀愀戀氀攀搀 笀 漀瀀愀挀椀琀礀㨀 　⸀㔀㬀 昀椀氀琀攀爀㨀 愀氀瀀栀愀⠀漀瀀愀挀椀琀礀㴀㔀　⤀㬀 紀㰀⼀猀琀礀氀攀㸀✀⤀㬀
਀瘀愀爀 䌀甀猀琀漀洀 㴀 笀
	init: function() {਀ऀऀ瘀愀爀 椀渀瀀甀琀猀 㴀 搀漀挀甀洀攀渀琀⸀最攀琀䔀氀攀洀攀渀琀猀䈀礀吀愀最一愀洀攀⠀∀椀渀瀀甀琀∀⤀Ⰰ 猀瀀愀渀 㴀 䄀爀爀愀礀⠀⤀Ⰰ 琀攀砀琀渀漀搀攀Ⰰ 漀瀀琀椀漀渀Ⰰ 愀挀琀椀瘀攀㬀
		for(a = 0; a < inputs.length; a++) {਀ऀऀऀ椀昀⠀⠀椀渀瀀甀琀猀嬀愀崀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀ 簀簀 椀渀瀀甀琀猀嬀愀崀⸀琀礀瀀攀 㴀㴀 ∀爀愀搀椀漀∀⤀ ☀☀ 椀渀瀀甀琀猀嬀愀崀⸀挀氀愀猀猀一愀洀攀 㴀㴀 ∀猀琀礀氀攀搀∀⤀ 笀
				span[a] = document.createElement("span");਀ऀऀऀऀ猀瀀愀渀嬀愀崀⸀挀氀愀猀猀一愀洀攀 㴀 椀渀瀀甀琀猀嬀愀崀⸀琀礀瀀攀㬀
਀ऀऀऀऀ椀昀⠀椀渀瀀甀琀猀嬀愀崀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀⤀ 笀
					if(inputs[a].type == "checkbox") {਀ऀऀऀऀऀऀ瀀漀猀椀琀椀漀渀 㴀 ∀　 ⴀ∀ ⬀ ⠀挀栀攀挀欀戀漀砀䠀攀椀最栀琀⨀㈀⤀ ⬀ ∀瀀砀∀㬀
						span[a].style.backgroundPosition = position;਀ऀऀऀऀऀ紀 攀氀猀攀 笀
						position = "0 -" + (radioHeight*2) + "px";਀ऀऀऀऀऀऀ猀瀀愀渀嬀愀崀⸀猀琀礀氀攀⸀戀愀挀欀最爀漀甀渀搀倀漀猀椀琀椀漀渀 㴀 瀀漀猀椀琀椀漀渀㬀
					}਀ऀऀऀऀ紀
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);਀ऀऀऀऀ椀渀瀀甀琀猀嬀愀崀⸀漀渀挀栀愀渀最攀 㴀 䌀甀猀琀漀洀⸀挀氀攀愀爀㬀
				if(!inputs[a].getAttribute("disabled")) {਀ऀऀऀऀऀ猀瀀愀渀嬀愀崀⸀漀渀洀漀甀猀攀搀漀眀渀 㴀 䌀甀猀琀漀洀⸀瀀甀猀栀攀搀㬀
					span[a].onmouseup = Custom.check;਀ऀऀऀऀ紀 攀氀猀攀 笀
					span[a].className = span[a].className += " disabled";਀ऀऀऀऀ紀
			}਀ऀऀ紀
		inputs = document.getElementsByTagName("select");਀ऀऀ昀漀爀⠀愀 㴀 　㬀 愀 㰀 椀渀瀀甀琀猀⸀氀攀渀最琀栀㬀 愀⬀⬀⤀ 笀
			if(inputs[a].className == "styled") {਀ऀऀऀऀ漀瀀琀椀漀渀 㴀 椀渀瀀甀琀猀嬀愀崀⸀最攀琀䔀氀攀洀攀渀琀猀䈀礀吀愀最一愀洀攀⠀∀漀瀀琀椀漀渀∀⤀㬀
				active = option[0].childNodes[0].nodeValue;਀ऀऀऀऀ琀攀砀琀渀漀搀攀 㴀 搀漀挀甀洀攀渀琀⸀挀爀攀愀琀攀吀攀砀琀一漀搀攀⠀愀挀琀椀瘀攀⤀㬀
				for(b = 0; b < option.length; b++) {਀ऀऀऀऀऀ椀昀⠀漀瀀琀椀漀渀嬀戀崀⸀猀攀氀攀挀琀攀搀 㴀㴀 琀爀甀攀⤀ 笀
						textnode = document.createTextNode(option[b].childNodes[0].nodeValue);਀ऀऀऀऀऀ紀
				}਀ऀऀऀऀ猀瀀愀渀嬀愀崀 㴀 搀漀挀甀洀攀渀琀⸀挀爀攀愀琀攀䔀氀攀洀攀渀琀⠀∀猀瀀愀渀∀⤀㬀
				span[a].className = "select";਀ऀऀऀऀ猀瀀愀渀嬀愀崀⸀椀搀 㴀 ∀猀攀氀攀挀琀∀ ⬀ 椀渀瀀甀琀猀嬀愀崀⸀渀愀洀攀㬀
				span[a].appendChild(textnode);਀ऀऀऀऀ椀渀瀀甀琀猀嬀愀崀⸀瀀愀爀攀渀琀一漀搀攀⸀椀渀猀攀爀琀䈀攀昀漀爀攀⠀猀瀀愀渀嬀愀崀Ⰰ 椀渀瀀甀琀猀嬀愀崀⤀㬀
				if(!inputs[a].getAttribute("disabled")) {਀ऀऀऀऀऀ椀渀瀀甀琀猀嬀愀崀⸀漀渀挀栀愀渀最攀 㴀 䌀甀猀琀漀洀⸀挀栀漀漀猀攀㬀
				} else {਀ऀऀऀऀऀ椀渀瀀甀琀猀嬀愀崀⸀瀀爀攀瘀椀漀甀猀匀椀戀氀椀渀最⸀挀氀愀猀猀一愀洀攀 㴀 椀渀瀀甀琀猀嬀愀崀⸀瀀爀攀瘀椀漀甀猀匀椀戀氀椀渀最⸀挀氀愀猀猀一愀洀攀 ⬀㴀 ∀ 搀椀猀愀戀氀攀搀∀㬀
				}਀ऀऀऀ紀
		}਀ऀऀ搀漀挀甀洀攀渀琀⸀漀渀洀漀甀猀攀甀瀀 㴀 䌀甀猀琀漀洀⸀挀氀攀愀爀㬀
	},਀ऀ瀀甀猀栀攀搀㨀 昀甀渀挀琀椀漀渀⠀⤀ 笀
		element = this.nextSibling;਀ऀऀ椀昀⠀攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀 ☀☀ 攀氀攀洀攀渀琀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀⤀ 笀
			this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px";਀ऀऀ紀 攀氀猀攀 椀昀⠀攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀 ☀☀ 攀氀攀洀攀渀琀⸀琀礀瀀攀 㴀㴀 ∀爀愀搀椀漀∀⤀ 笀
			this.style.backgroundPosition = "0 -" + radioHeight*3 + "px";਀ऀऀ紀 攀氀猀攀 椀昀⠀攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 ℀㴀 琀爀甀攀 ☀☀ 攀氀攀洀攀渀琀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀⤀ 笀
			this.style.backgroundPosition = "0 -" + checkboxHeight + "px";਀ऀऀ紀 攀氀猀攀 笀
			this.style.backgroundPosition = "0 -" + radioHeight + "px";਀ऀऀ紀
	},਀ऀ挀栀攀挀欀㨀 昀甀渀挀琀椀漀渀⠀⤀ 笀
		element = this.nextSibling;਀ऀऀ椀昀⠀攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀 ☀☀ 攀氀攀洀攀渀琀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀⤀ 笀
			this.style.backgroundPosition = "0 0";਀ऀऀऀ攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 㴀 昀愀氀猀攀㬀
		} else {਀ऀऀऀ椀昀⠀攀氀攀洀攀渀琀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀⤀ 笀
				this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";਀ऀऀऀ紀 攀氀猀攀 笀
				this.style.backgroundPosition = "0 -" + radioHeight*2 + "px";਀ऀऀऀऀ最爀漀甀瀀 㴀 琀栀椀猀⸀渀攀砀琀匀椀戀氀椀渀最⸀渀愀洀攀㬀
				inputs = document.getElementsByTagName("input");਀ऀऀऀऀ昀漀爀⠀愀 㴀 　㬀 愀 㰀 椀渀瀀甀琀猀⸀氀攀渀最琀栀㬀 愀⬀⬀⤀ 笀
					if(inputs[a].name == group && inputs[a] != this.nextSibling) {਀ऀऀऀऀऀऀ椀渀瀀甀琀猀嬀愀崀⸀瀀爀攀瘀椀漀甀猀匀椀戀氀椀渀最⸀猀琀礀氀攀⸀戀愀挀欀最爀漀甀渀搀倀漀猀椀琀椀漀渀 㴀 ∀　 　∀㬀
					}਀ऀऀऀऀ紀
			}਀ऀऀऀ攀氀攀洀攀渀琀⸀挀栀攀挀欀攀搀 㴀 琀爀甀攀㬀
		}਀ऀ紀Ⰰ
	clear: function() {਀ऀऀ椀渀瀀甀琀猀 㴀 搀漀挀甀洀攀渀琀⸀最攀琀䔀氀攀洀攀渀琀猀䈀礀吀愀最一愀洀攀⠀∀椀渀瀀甀琀∀⤀㬀
		for(var b = 0; b < inputs.length; b++) {਀ऀऀऀ椀昀⠀椀渀瀀甀琀猀嬀戀崀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀ ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀 ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀氀愀猀猀一愀洀攀 㴀㴀 ∀猀琀礀氀攀搀∀⤀ 笀
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";਀ऀऀऀ紀 攀氀猀攀 椀昀⠀椀渀瀀甀琀猀嬀戀崀⸀琀礀瀀攀 㴀㴀 ∀挀栀攀挀欀戀漀砀∀ ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀氀愀猀猀一愀洀攀 㴀㴀 ∀猀琀礀氀攀搀∀⤀ 笀
				inputs[b].previousSibling.style.backgroundPosition = "0 0";਀ऀऀऀ紀 攀氀猀攀 椀昀⠀椀渀瀀甀琀猀嬀戀崀⸀琀礀瀀攀 㴀㴀 ∀爀愀搀椀漀∀ ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀栀攀挀欀攀搀 㴀㴀 琀爀甀攀 ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀氀愀猀猀一愀洀攀 㴀㴀 ∀猀琀礀氀攀搀∀⤀ 笀
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px";਀ऀऀऀ紀 攀氀猀攀 椀昀⠀椀渀瀀甀琀猀嬀戀崀⸀琀礀瀀攀 㴀㴀 ∀爀愀搀椀漀∀ ☀☀ 椀渀瀀甀琀猀嬀戀崀⸀挀氀愀猀猀一愀洀攀 㴀㴀 ∀猀琀礀氀攀搀∀⤀ 笀
				inputs[b].previousSibling.style.backgroundPosition = "0 0";਀ऀऀऀ紀
		}਀ऀ紀Ⰰ
	choose: function() {਀ऀऀ漀瀀琀椀漀渀 㴀 琀栀椀猀⸀最攀琀䔀氀攀洀攀渀琀猀䈀礀吀愀最一愀洀攀⠀∀漀瀀琀椀漀渀∀⤀㬀
		for(d = 0; d < option.length; d++) {਀ऀऀऀ椀昀⠀漀瀀琀椀漀渀嬀搀崀⸀猀攀氀攀挀琀攀搀 㴀㴀 琀爀甀攀⤀ 笀
				document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;਀ऀऀऀ紀
		}਀ऀ紀
}਀眀椀渀搀漀眀⸀漀渀氀漀愀搀 㴀 䌀甀猀琀漀洀⸀椀渀椀琀㬀਀