/*Styles for forms and their associated layouts.
  This file includes built-in types as well as custom types.
*/

/***********BUILT-INS*************/
/*
	this is a shared selector/ruleset for all jellyvision forms
	it can prevent namespace collisions with others' css files
*/
.jvform {
	
}

/*
	this is a shared selector/ruleset for all jellyvision DEFAULT FIB forms
	it can prevent namespace collisions with others' css files
*/
form[data-formType^="default-"] {
	position: absolute;/*l,r,w,h,t relative to the form container div*/
	width: 75%;
	height: 73%;
	top: 24%;
	
	/*centers default forms*/
	left: 12.5%;
	
	/*initial state + transition*/
	opacity: 0;
	
	/*allow click through to the form controls*/
	pointer-events: all;
}

/* OVERRIDES/SPECIFICS FOR default-alphanum	*/
form[data-formType="default-alphanum"] {
left: 6%;	
top: 200px;
}

form[data-formType="default-textarea"] {
left: 6%;	
top: 180px;
}

/* OVERRIDES/SPECIFICS FOR default-alpha */
form[data-formType="default-alpha"] {
	
}

/* OVERRIDES/SPECIFICS FOR default-numbers	*/
form[data-formType="default-numbers"] {
	
}

/* OVERRIDES/SPECIFICS FOR default-email */
form[data-formType="default-email"] {
	
}

/* OVERRIDES/SPECIFICS FOR default-phone	*/
form[data-formType="default-phone"] {
	
}

/* OVERRIDES/SPECIFICS FOR default-states	*/
form[data-formType="default-states"] {
	
}

/*****************DEFAULT INPUT FIELDS/TYPES*****************/
/*applies to all default fib inputs*/
form[data-formType^="default-"] input[type="text"]{
	/*position in container*/
	position: relative;
	display: block;
	width: 50%;
	margin: 2px auto 15px auto;
	
	/*font*/
	font-size: 1.2em;
	text-align: center;
	
	/*look*/
	padding: 0.5em;
	border-radius: 20px 0 20px 0;
	box-shadow: inset 0 0 0px 1px black;
	outline: 0;/*probably don't want this for users with keyboards*/
}

/*
form[data-formType^="default-"] input[type="text"]::-webkit-input-placeholder {
	color: #900;
}
*/

/*applies to all default form submit buttons / provides a place to override existing buttons*/
form[data-formType^="default-"] input[type="submit"] {
	width: 30%;
	margin-left: auto;
	margin-right: auto;
	
	-webkit-appearance: none;/*don't let Apple push their default UI style on us*/
}

/*applies to all default form select boxes*/
form[data-formType^="default-"] select {
	/*position in container*/
	position: relative;
	display: block;
	width: 40%;
	margin: 2px auto 15px auto;
	
	/*font*/
	font-size: 1.2em;
	
	/*look*/
	background: white;
	padding: 0.5em;
	border-radius: 10px;
	box-shadow: inset 0 0 0px 1px black;
	outline: 0;/*probably don't want this for users with keyboards*/
}
/*applies to all default form option items*/
form[data-formType^="default-"] select > option {
	background: white;
}
form[data-formType^="default-"] select > option:disabled {
	background: #eee;
	color: #999;
}

/*******HTML5+ CSS3 VISUAL VALIDATION TRICKS: EXPERIMENTAL********/

form.jvform  input[type="text"]:valid {
	background: #fff;
}
form.jvform  input[type="text"]:invalid {
	background: white;
}
/*
form.jvform input:valid + button {
	color: lime;
}
form.jvform input:invalid + button {
	display: none;
}
*/


/***************************CUSTOM FORM STUFF BELOW THIS LINE ONLY***********************/

form[data-formType="default-alphanum"]  input[type="text"]{
	margin: 10px 0px 15px 0px;
	border:2px solid black;
	text-align: left;
	/*look*/
	padding: 0.5em 0.5em 70px 0.5em;
	/*border-radius: 20px 0 20px 0;*/
	border-radius:0px;
	box-shadow: inset 0 0 0px 1px black;
}

form[data-formType="default-textarea"]  textarea{
	height:100px;
	width:50%;
	margin: 10px 0px 15px 0px;
	border:3px solid black;
	text-align: left;
	float:left;
	/*look*/
	padding: 0.5em;
	/*border-radius: 20px 0 20px 0;*/
	border-radius:0px;
	box-shadow: none;
	overflow-y: scroll;
	resize:none;
}

form[data-formType="default-textarea"]  input[type="submit"] {
	width: 60%;
 margin-top: 170px;
	-webkit-appearance: none;/*don't let Apple push their default UI style on us*/
	margin-left: -396px;
	
background: #fff;
border: none;
color: #000;
text-align: left;
padding-left: 5px;	
}

form[data-formType="default-textarea"]  input[type="submit"]:hover {
background:#e49056;
color:#fff;
}

/* -------- !!!! SUBMIT/DONE button style is in the jv-buttons.css file !!!! -------- */


/* ----------------------------------- */
	

.formFloatClr {
	width: 0;
	height: 0;
	clear; both;
}