﻿/*
	primary, blue,  #337ab7
	success, green, #5cb85c
	info, lightblue, #5bc0de
	warning, organge, #f0ad4e
	danger, red, #d9534f
*/
/* ******************** */
/* switch               */
/* ******************** */
.wtsSwitch {
	border-collapse: collapse;
	border-spacing: 0px;
	display: table;
}
	.wtsSwitch input[type=checkbox] {
		visibility: hidden;
	}
	.wtsSwitch > div {
		display: table-cell;
	}
		.wtsSwitch > div:last-child {
			padding-left: 10px;
			padding-top: 4px;
			vertical-align: middle;
		}
		.wtsSwitch > div:first-child {
			width: 100px;
			height: 40px;
			background-color: #337ab7;
			border-radius: 50px;
			position: relative;
			display: inline-block;
		}
			.wtsSwitch > div:first-child:before {
				content: '';
				position: absolute;
				top: 16px;
				left: 14px;
				height: 6px;
				width: 13px;
				background: transparent;
				border: 3px solid white;
				border-top: none;
				border-right: none;
				transform: rotate(-45deg);
			}
			.wtsSwitch > div:first-child:after {
				content: '\d7';
				position: absolute;
				top: 1px;
				left: 71px;
				color: silver;
				font-size: 27px;
			}
			.wtsSwitch > div:first-child label {
				display: block;
				width: 52px;
				height: 22px;
				border-radius: 50px;
				transition: all .5s ease;
				cursor: pointer;
				position: absolute;
				top: 9px;
				z-index: 1;
				left: 12px;
				/* gradient */
				background: #eeeeee;
				background: -moz-linear-gradient(-45deg, #eeeeee 0%, #cccccc 100%);
				background: -webkit-linear-gradient(-45deg, #eeeeee 0%,#cccccc 100%);
				background: linear-gradient(135deg, #eeeeee 0%,#cccccc 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=1 );
			}
		.wtsSwitch > div:nth-child(2) label {
			cursor: pointer;
		}
	.wtsSwitch input[type=checkbox]:checked + label {
		left: 40px;
	}
/* ******************** */
/* checkbox             */
/* ******************** */
.wtsCheckbox {
	border-collapse: collapse;
	border-spacing: 0px;
	display: table;
	height: 40px;
}
	.wtsCheckbox input[type=checkbox] {
		padding: 0;
		margin: 0;
		visibility: hidden;
	}
	.wtsCheckbox > div {
		display: table-cell;
		vertical-align: middle;
	}
		.wtsCheckbox > div:first-child {
			margin: 0;
			padding: 0;
			position: relative;
			width: 40px;
		}
		.wtsCheckbox > div:last-child {
			margin: 0;
			padding-left: 10px;
			padding-top: 0;
		}
			.wtsCheckbox > div:last-child label {
				display: inline;
				padding: 0;
				margin: 0;
			}
		.wtsCheckbox > div:first-child label {
			display: block !important;
			width: 40px;
			height: 40px;
			transition: all .75s ease;
			cursor: pointer;
			position: absolute;
			top: 0;
			padding: 0;
			margin: 0;
			left: 0;
			background-color: #337ab7;
			border-radius: 4px;
		}
		.wtsCheckbox > div > label {
			cursor: pointer;
		}
	.wtsCheckbox input[type=checkbox]:checked + label {
		background: none;
		filter: unset;
		background-color: #5cb85c;
	}
	.wtsCheckbox input[type=checkbox] + label:after {
		color: silver;
		content: '\d7';
		font-size: 27px;
		left: 13px;
		position: absolute;
		top: 0;
	}
	.wtsCheckbox input[type=checkbox]:checked + label:after {
		content: '';
		position: absolute;
		width: 13px;
		height: 6px;
		background: transparent;
		top: 15px;
		left: 13px;
		border: 3px solid white;
		border-top: none;
		border-right: none;
		transform: rotate(-45deg);
	}
/* ******************** */
/* radio                */
/* ******************** */
.wtsRadio {
	border-collapse: collapse;
	border-spacing: 0px;
	display: table;
	position: relative;
}
	.wtsRadio input[type=radio] {
		visibility: hidden;
	}
	.wtsRadio > div {
		display: table-cell;
		position: relative;
		vertical-align: middle;
	}
		.wtsRadio > div:nth-child(even) {
			padding-left: 8px;
			padding-right: 10px;
			padding-top: 4px;
		}
		.wtsRadio > div:last-of-type {
			padding-right: 0;
		}
		.wtsRadio > div:nth-child(odd) {
			width: 30px;
			height: 30px;
		}
		.wtsRadio > div:nth-child(even) > label {
			cursor: pointer;
		}
	.wtsRadio input[type=radio] + label {
		border-radius: 100%;
		height: 30px;
		left: 0px;
		position: absolute;
		top: 0px;
		width: 30px;
	}
	.wtsRadio input[type=radio]:enabled + label {
		background-color: #337ab7;
		cursor: pointer;
		transition: all .75s ease;
	}
	.wtsRadio input[type=radio]:disabled + label {
		background-color: gainsboro !important;
		cursor: not-allowed !important;
	}

	.wtsRadio input[type=radio]:checked + label {
		background-color: #5cb85c;
	}
	.wtsRadio input[type=radio] + label:after {
		color: silver;
		content: '\d7';
		font-size: 27px;
		left: 9px;
		position: absolute;
		top: -5px;
	}
	.wtsRadio input[type=radio]:checked + label:after {
		content: '';
		position: absolute;
		width: 13px;
		height: 6px;
		background: transparent;
		top: 11px;
		left: 9px;
		border: 3px solid white;
		border-top: none;
		border-right: none;
		transform: rotate(-45deg);
	}
/* ******************** */
/* radio buttons        */
/* ******************** */
.wtsRadioButtons {
	border-collapse: collapse;
	border-spacing: 0px;
	display: table;
	min-height: 33px;
	/* max-height: 40px !important; */
	position: relative;
	width: 100%;
}
	.wtsRadioButtons input[type=radio] {
		visibility: hidden;
	}
	.wtsRadioButtons div {
		/* border-right: solid 1px white; */
		display: table-cell;
		min-height: 33px;
		margin: 0;
		/* max-height: 40px !important; */
		padding: 0;
		vertical-align: middle;
	}
		.wtsRadioButtons div:last-of-type {
			border-right: none;
		}
		.wtsRadioButtons div label {
			background-color: #337ab7;
			color: white;
			cursor: pointer;
			filter: unset;
			font-weight: normal;
			min-height: 33px;
			margin: 0;
			padding-left: 10px;
			padding-right: 10px;
			padding-top: 6px;
			position: relative;
			text-align: center;
			top: -21px;
			transition: all .75s ease;
			width: 100%;
		}
			.wtsRadioButtons div label:hover {
				filter: brightness(125%);
			}
		.wtsRadioButtons div:first-of-type label {
			border-top-left-radius: 5px;
			border-bottom-left-radius: 5px;
		}
		.wtsRadioButtons div:last-of-type label {
			border-top-right-radius: 5px;
			border-bottom-right-radius: 5px;
		}
	.wtsRadioButtons input[type=radio]:checked + label {
		background-color: #5cb85c;
		border-bottom: solid 1px dimgray;
		border-right: solid 1px dimgray;
		box-shadow: inset 1px 1px 1px silver;
		text-shadow: 1px 1px 4px #333;
	}
/* ******************** */
/* drop down lists      */
/* ******************** */
.wtsDropDownList {
	font-size: 14pt;
	width: 100%;
}
	.wtsDropDownList li {
		border-top: dotted 1px white;
		padding-left: 4px;
		padding-right: 4px;
	}
		.wtsDropDownList li:first-of-type {
			border-top: none;
		}
		.wtsDropDownList li.noBorder {
			border-top: none;
		}
		.wtsDropDownList li:hover {
			background-color: gray;
			color: white;
			cursor: pointer;
		}