/*
File: Forms.css
Description: Contains specifications related to the layout of form elements within typical forms.
Use the "form"-class on the parent element of the form to trigger form layout and jQuery automatic class
insertion on all relevant elements.
*/



/* TODO: Remove all ".form" on selectors that should be applied regardless of context */



/* Common form element specifications */
.form input,
.form textarea,
.form label,
.form span.checkbox,
.form a
{
	display: block;
}
.form label
{
	font-weight: bold;
	margin-bottom: 0.3em;
}
span.checkbox input,
input.checkbox
{
	/* Effective margin fix for consistent cross-browser appearance */
	width: 13px;
	height: 13px;
}
.form input.textbox,
.form input.password,
.form textarea
{
	border: none;
	padding: 6px;
	width: 253px;
}
.form input.textbox,
.form input.password
{
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textbox-normal-background.gif) no-repeat top left;
	height: 16px;
}
.form textarea
{
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textarea-normal-background.gif) no-repeat top left;
	height: 108px;
}
.form select
{
	border: solid 1px #444;
	width: 265px;
}
.form div.form-command-buttons-container
{
	text-align: right;
	clear: both;
}
.form div.form-command-buttons-container input,
.form div.form-command-buttons-container a,
.form div.form-command-buttons-container img
{
	background: transparent url(/TipsCommunity/Includes/Images/Misc/separator-black.gif) no-repeat scroll left center;
	margin-left: 14px;
	padding-left: 16px;
	cursor: pointer;
	display: inline;
	vertical-align: middle;
}
.form div.form-command-buttons-container a
{
	text-decoration: underline;
}
.form div.form-command-buttons-container .first
{
	background: none;
	margin-left: 0;
	padding-left: 0;
}
.form span.validator
{
	float: right;
	color: #000 !important;
	background: transparent url(/TipsCommunity/Includes/Images/Misc/exclamation.png) no-repeat left top;
	margin-top: 7px;
	margin-bottom: 7px;
	padding: 1px 0 2px 20px;
}


/* TODO: Methodically replace regular ASP TextBox:es above with TipsTextBox:es having the style below. */
.form div.textbox-container input.textbox,
.form div.textbox-container input.password,
.form div.textarea-container textarea
{
	margin: 0;
	padding: 0;
	background-image: none;
}
.form div.textbox-container
{
	padding: 6px;
	width: 253px;
	height: 16px;
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textbox-normal-background.gif) no-repeat top left;
}
.form div.textarea-container
{
	padding: 6px;
	width: 253px;
	height: 108px;
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textarea-normal-background.gif) no-repeat top left;
}



/* Special large-style forms */
.form-large div.textarea-container
{
	background-image: url(/TipsCommunity/Includes/Images/Forms/textarea-large-background.gif);
	width: 388px;
	height: 168px;
}
.form-large input.textbox,
.form-large input.password,
.form-large textarea
{
	width: 388px;
}
.form-large input.textbox,
.form-large input.password
{
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textbox-large-background.gif) no-repeat top left;
}
.form-large textarea
{
	background: transparent url(/TipsCommunity/Includes/Images/Forms/textarea-large-background.gif) no-repeat top left;
	height: 168px;
}
.form-large select
{
	width: 400px;
}



/* Common margins between different form elements */
.form label,
.form span.checkbox,
.form a,
.form div.form-command-buttons-container
{
	margin-top: 1.3em;
}



/* Checkbox with label */
span.checkbox a
{
	display: inline;
}
span.checkbox input
{
	vertical-align: middle;
	display: inline;
}
span.checkbox label
{
	font-weight: normal;
	padding-left: 4px;
	display: inline;
}



/* Character counter */
.form span.character-count
{
	display: block;
	margin: 4px 0 0 1px;
}



/* Help text extender */
.form div.help-text
{
	left:270px;
	top:-63px;
}

form .update-location div.help-text
{
	top:-183px;
}

.form-large div.help-text
{
	left:405px;
}

.support-form .form-command-buttons-container
{
	width:403px;
}

.form input.private-scrapbook,.form label.private-label{display:inline !important;margin:0;}

.form label.private-label{padding-left:5px;font-weight:normal;}

/* Facebook login */
div.facebook-login-content
{
    margin:5px 0 40px 2px;
    overflow:hidden;
    vertical-align: middle;
}
div.facebook-login-content p, div.facebook-login-content #facebook-login 
{
    display:inline-block;
    float:left;
}
div.facebook-login-content p 
{
    line-height:22px;
    margin: 0 15px 0 0;
}
div.facebook-login-content #facebook-login a 
{
    margin:0 !important;
}
div.login div.facebook-login-content 
{
    margin: 20px 0;
}
div.login div.facebook-login-content, div.framework-centered div.facebook-login-content
{
    margin: 20px 0 0;
}