/*--------------------- *
	 * INPUT                *
	 * UPDATED: 2020-07-09  *
	 * -------------------- */


	label {
		display: block;
		position: relative;
		margin: auto;
		margin-bottom: 2px;
		padding-left: 10px;
		width: 100%;
		max-width: 300px;
		height: 12px;
		line-height: 12px;
		font-size: 12px;
		font-family: "Open Sans", Arial, Helvetica, sans-serif;
		font-weight: 600;
		color: #666;
		text-align: left;
		text-transform: capitalize;
	}

	label.formLabel {
		color: #444;
	}

	label.formLabelR {
		color: #C70067;
	}

  .fieldHelp {
    width: 100%;
    max-width: 300px;
    min-height: 20px;
  	margin: auto;
  	text-align: center;
  	font-size: 12px;
  	font-weight: 800;
  	color: #f00;
  	background-color: #f4e8c1;
  }

	div.fieldHelp:empty {
		visibility: hidden;
	}
	
	input[type=text], 
	input[type=password], 
	input[type=tel], 
	input[type=number], 
	textarea,
	select {
		-webkit-appearance: none;
		width: 100%;
		max-width: 300px;
		height: 30px;
		padding: 5px 5px 5px 8px;
		margin: 0px 0px 0px 0px;
		color: #333;
		background: #f2f3f4 ;
		border: 1px solid #a6a9b0 ;
		border-radius: 2px;
		font-size: 16px;
		line-height: 18px;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
	}

	input[type=text].secure {
		color: #171718;
		background-color: #171718;
	}
	


	textarea {
		height: 200px;
		font-family: 'Open Sans', Arial, Helvetica, sans-serif;
		font-weight: 500;
		font-size: 18px;
	}

	input[type="text"][readonly] {
		color: var(--themeColor1);
		font-weight: bold;
	}

	.placeholder {
		color: #808080 !important;
		font-style: italic;
	}		

	input::-webkit-input-placeholder {
		color: #808080;
		font-style: italic;
	}

	input:-moz-placeholder { /* Firefox 18- */
		color: #808080;
		font-style: italic;
	}

	input::-moz-placeholder {  /* Firefox 19+ */
		color: #808080;
		font-style: italic;
	}

	input:-ms-input-placeholder {  
		color: #808080;
		font-style: italic;
	}


	textarea::-webkit-input-placeholder {
		color: #808080;
		font-style: italic;
	}

	textarea:-moz-placeholder { /* Firefox 18- */
		color: #808080;
		font-style: italic;
	}

	textarea::-moz-placeholder {  /* Firefox 19+ */
		color: #808080;
		font-style: italic;
	}

	textarea:-ms-input-placeholder {  
		color: #808080;
		font-style: italic;
	}

	input[type=text]:hover, 
	input[type=password]:hover, 
	input[type=tel]:hover, 
	input[type=number]:hover, 
	textarea:hover,
	select:hover {
		border: 1px solid #7f9db9;
	}

	input[type=text]:focus, 
	input[type=password]:focus, 
	input[type=tel]:focus, 
	input[type=number]:focus, 
	textarea:focus,
	select:focus {
		border: 1px solid var(--themeColor1);
	}

	input[type=text].filled, 
	input[type=password].filled, 
	input[type=tel].filled, 
	input[type=number].filled, 
	textarea.filled,
	select.filled {
		position: relative;
		margin: auto;
		background: #f2f3f4 ;
		background-image: linear-gradient(top, #f2f3f4  0%, #FFFFFF 60%);
		background-image: -moz-linear-gradient(top, #f2f3f4  0%, #FFFFFF 60%);
		background-image: -o-linear-gradient(top, #f2f3f4  0%, #FFFFFF 60%);
		background-image: -ms-linear-gradient(top, #f2f3f4  0%, #FFFFFF 60%);
		background-image: -webkit-linear-gradient(top, #f2f3f4  0%, #FFFFFF 60%);
		border: 1px solid #d8d8d8;
	}

	input[type=text].filled:focus, 
	input[type=password].filled:focus, 
	input[type=tel].filled:focus, 
	input[type=number].filled:focus, 
	textarea.filled:focus,
	select.filled:focus {
		border: 1px solid #F47B20;
	}


	.imgCAPTCHA {
		width: 360px;
		height: auto;
	}

	#CAPTCHAFRAME {
		width: 360px;
		height: 150px;
	}


	input[type=text].inputdropdown, select {
		width: 100%;
	}


	input[type=text].inputphone {
		width: 79%;
	}

	input[type=text].inputextension {
		width: 20%;
	}

	.inputdropdownTiny {
		width: 25%;
	}



	.controlLabel {
		position: absolute;
		top: 12px;
		left: 30px;
		width: 60px;
		height: 24px;
		font-size: 14px;
		font-weight: 600;
		color: var(--themeColor1);
	}

	.control-group {
	  display: inline-block;
	  width: 240px;
	  height: 40px;
	  margin: 0;
	  padding: 0;
	  text-align: right;
	  vertical-align: top;
	  background: #fff;
	}
		
	.control {
	  font-size: 18px;
	  position: relative;
	  display: block;
	  margin-bottom: 0;
	  padding-top: 14px;
	  padding-left: 30px;
	  cursor: pointer;
	}

	.control control--radio {
		display: inline-block; 
		width: 80px; 
		height: 24px; 
		line-height: 18px;		
	}

	.control input {
	  position: absolute;
	  z-index: -1;
	  opacity: 0;
	}	
			
	.control__indicator {
	  position: absolute;
	  top: 14px;
	  left: 5px;
	  width: 20px;
	  height: 20px;
	  background: #e6e6e6;
	}

	.control--radio .control__indicator {
	  border-radius: 50%;
	}		
				
	/* Hover and focus states */
	.control:hover input ~ .control__indicator,
	.control input:focus ~ .control__indicator {
	  background: #ccc;
	}

	/* Checked state */
	.control input:checked ~ .control__indicator {
	  background: var(--themeColor1);
	}

	/* Hover state whilst checked */
	.control:hover input:not([disabled]):checked ~ .control__indicator,
	.control input:checked:focus ~ .control__indicator {
	  background: var(--themeColor1);
	}

	/* Disabled state */
	.control input:disabled ~ .control__indicator {
	  pointer-events: none;
	  opacity: .6;
	  background: #e6e6e6;
	}

	/* Check mark */
	.control__indicator:after {
	  position: absolute;
	  display: none;
	  content: '';
	}

	/* Show check mark */
	.control input:checked ~ .control__indicator:after {
	  display: block;
	}

	/* Checkbox tick */
	.control--checkbox .control__indicator:after {
	  top: 4px;
	  left: 8px;
	  width: 3px;
	  height: 8px;
	  transform: rotate(45deg);
	  border: solid #fff;
	  border-width: 0 2px 2px 0;
	}

	/* Disabled tick colour */
	.control--checkbox input:disabled ~ .control__indicator:after {
	  border-color: #7b7b7b;
	}

	/* Radio button inner circle */
	.control--radio .control__indicator:after {
	  top: 7px;
	  left: 7px;
	  width: 6px;
	  height: 6px;
	  border-radius: 50%;
	  background: #fff;
	}

	/* Disabled circle colour */
	.control--radio input:disabled ~ .control__indicator:after {
	  background: #7b7b7b;
	}
	
	
	
	
	/* SLIDE CHECKBOX */
	.slideCheck {
		width: 80px;
		height: 26px;
		background: #333;
		margin: 20px auto;

		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;
		position: relative;

		-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
		-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
		box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	}





	/* SLIDE CHECKBOX */
	.slideCheck {
		position: absolute;
		right: 15px;
		width: 80px;
		height: 26px;
		background: var(--themeColor1);
		margin: auto;
		
		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;

		-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
		-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
		box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	}




	.slideCheck input[type=checkbox] {
	   visibility: hidden;
	}

	.slideCheck:after {
	  content: 'OFF';
	  font: 12px/26px Arial, sans-serif;
	  color: #000;
	  position: absolute;
	  right: 10px;
	  z-index: 0;
	  font-weight: bold;
	  text-shadow: 1px 1px 0px rgba(255,255,255,.15);
	}

	.slideCheck:before {
	  content: 'ON';
	  font: 12px/26px Arial, sans-serif;
	  color: #FFF;
	  position: absolute;
	  left: 10px;
	  z-index: 0;
	  font-weight: bold;
	}

	.slideCheck label {
		display: block;
		margin-bottom: 0;
		padding: 0;

		width: 34px;
		height: 20px;

		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
		border-radius: 50px;

		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-o-transition: all .4s ease;
		-ms-transition: all .4s ease;
		transition: all .4s ease;
		cursor: pointer;
		position: absolute;
		top: 3px;
		left: 3px;
		z-index: 1;

		-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
		-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
		box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
		background: #fcfff4;

		background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
		background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
		background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
		background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
		background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	}

	.slideCheck input[type=checkbox]:checked + label {
	  left: 43px;
	}