/***************************************************************************************
 ******* Name		: form.css
 ******* URI		: /elements/css/form.css
 ******* Description: Contains basic styles for all form elements site-wide.
 *******			  Extra styles for form elements may be defined in module/page styles
 ******* Author		: Congruent Media
 ******* Author URI	: http://www.congruentmedia.com
 ***************************************************************************************/
 fieldset {
	 border: none;
	 margin: 0 0 1em;
	 width: 100%;
 }
	 div.section_caption {
			 color: #0063a5;
			 font-size: 13px;
			 font-weight: bold;
			 margin: 15px 0;
		 }
	 .form_element {
		 margin: 0 0 10px;
		 position: relative;
	 }
		.form_element  label {
			 display: block;
			 float: left;
			 font-weight: bold;
			 line-height: 1.5em;
			 width: 150px;
		 }
		 .form_element input,
		 .form_element select,
		 .form_element textarea,
		 .form_element .input,
		 .form_element .input_basket {
			 display: block;
			 float: left;
			 position: relative;
			 width: 250px;
		 }
		 
			 .form_element .markItUp .markItUpEditor {
			 	float: none;
				width: 625px;
			 }
		 
		 .input td input {width: auto;}
		 .input_basket label, .input_basket input,
		 .inline label, .inline input, .inline div {
			 display: inline;
			 float: none;
			 width: auto;
		 }
			 .input_basket label, .inline label {margin: 0 10px 0 5px;}
			 .input_basket input, .inline input {vertical-align: middle;}
			 .required label {font-weight: bold;}
			 .control input {
				background: #87b0d7 url(/elements/images/forms/blueButtonBackground.gif) 0 0 repeat-x;
				border: 1px solid #6699cc;
				color: #003366;
				cursor: pointer;
				display: inline;
				float: none;
				font: bold 0.9em/1em Arial, Helvetica, sans-serif;
				height: 1.9em;
				padding: 0 8px;
				text-align: center;
				text-transform: uppercase;
				vertical-align: top;
				width: auto;
			 }
			 .control input[type="submit"] {margin-left: 150px;}
			 .control input[type="submit"]:hover {background-position: 0 -30px;}
		 .input #colorCode {
			 display: block;
			 height: 15px;
			 position: absolute;
			 right: -25px;
			 top: 0;
			 width: 15px;
		 }
		 .error input, .error textarea, .error select {background: #febebe;}
		 #secondaryContent .form_element input,
		 #secondaryContent .form_element select,
		 #secondaryContent .form_element textarea,
		 #secondaryContent .form_element .input {width: 215px;}
		 #secondaryContent .control input {float: right; margin: 0; width: auto;}

/***************************************************************************************
 ******* TOOLTIP STYLES
 ***************************************************************************************/
 div.tooltip {position: absolute; display: none; top: -10px; right: -60px; width: 230px; min-height: 30px; _height: 30px; padding: 5px;  z-index: 9999; color: #000; z-index: 999999;}
 div.form_element div.errors {background: #febebe; border: 2px solid #ea8989;}
 div.form_element div.hint {background: #bcfcbc; border: 2px solid #70e270;}
 
 div.tooltip .arrow {display: none; width: 15px; height: 40px; position: absolute; top: 0; left: -15px; background: transparent url(/elements/images/messaging/successArrow-trans.png) 0 0 no-repeat;}
 div.errors .arrow {background-image: url(/elements/images/messaging/errorArrow-trans.png);}

 div.tooltip ul, div.tooltip ul li, #primaryContent div.tooltip ul li, #secondaryContent .widget div.tooltip ul li {background: none; list-style: none; margin-left: 0; padding: 0;}
 #secondaryContent div.tooltip {left: -245px; width: 200px;}
 #secondaryContent div.tooltip .arrow {background: transparent url(/elements/images/messaging/errorArrowRight-trans.png) 0 0 no-repeat; left: auto; right: -15px;}

/***************************************************************************************
 ******* ERROR/SUCCESS MESSAGING STYLES
 ***************************************************************************************/
 .messageBox {
	 border: 2px solid #000;
	 border-width: 2px 0;
	 color: #000;
	 margin: 1em 20px;
	 padding: 5px 10px 5px 48px;
 }
	 .messageBox.error,
	 fieldset .error input,
	 fieldset .error textarea {
		 background: #febebe url(/elements/images/messaging/error.png) 16px 50% no-repeat;
		 border-color: #ea8989;
	 }
	 .messageBox.success,
	 fieldset .success input,
	 fieldset .success textarea {
		 background: #bcfcbc url(/elements/images/messaging/success.png) 16px 50% no-repeat;
		 border-color: #70e270;
	 }
	 .messageBox.loading,
	 fieldset .loading input,
	 fieldset .loading textarea {
		 background: #bcfcbc url(/elements/images/messaging/loading.gif) 16px 50% no-repeat;
		 border-color: #70e270;
	 }
 fieldset .error input,
 fieldset .success input,
 fieldset .loading input,
 fieldset .error textarea,
 fieldset .success textarea,
 fieldset .loading textarea {background-image: none;}
 fieldset .error .markItUp .markItUpEditor {
	 background-color: transparent;
	 background-position: 0 0;
 }
 
 #secondaryContent .messageBox {margin: 0 0 1em;}