/*******************************************************************************
* Project: Servalsoft 2009                                                     *
* File: servalsoftUI.css (CSS)                                                 *
* Author: Cody Garvin                                                          *
*                                                                              *
********************************************************************************
* Date: 10/14/09                                                               *
* Version: 0.1                                                                 *
* History:                                                                     *
*  10/14/09 - Initial script created.                                          *
*                                                                              *
*******************************************************************************/
/* CSS For the whole site */



/*
-----------------------------------------------------------------------------
- Forms                                                                     -
-----------------------------------------------------------------------------
*/
/* Define default form */
form {
	padding: 0px;
	margin: 0px;
	font-size: 12px;
	font-family: Jura, Helvetica, sans-serif;
}

form div.formHeading {
	color: #9e9e9e;
	font-size: 14px;
	line-height: 18px;
	font-weight: bold;
	padding-bottom: 4px;
}

textarea {
	font-family: Jura, Helvetica, sans-serif;
	font-size: 12px;
}

/* newForm for nice looking forms */
form.newForm select, form.newForm input, form.newForm textarea {
	border: 1px solid #ee5053;
	background-color: #1e1e1e;
	color: #bcbcbc;
	font-size: 13px;
	font-family: Jura, Helvetica, sans-serif;
	padding: 4px;
}

.mobile form.newForm select, .mobile form.newForm input, .mobile form.newForm textarea {
	border: 1px solid #ee5053;
	background-color: #1e1e1e;
	color: #bcbcbc;
	font-size: 18px;
	line-height: : 21px;
	font-family: Jura, Helvetica, sans-serif;
	padding: 4px;
}

form.newForm input.clearFileInput {
	border: none;
	background-color: #FFFFFF;
}

form.newForm input.clearInputButton {
	background-color: transparent;
	border: none;
}


form.newForm select:focus, form.newForm input:focus, form.newForm textarea:focus {
	background-color: #1e1e1e;
}

/* Bigger select and input for usability */
select.big, input.big {
	font-size: 14px;
	background-color: #f5f5f5;
	color: #555;
}

input.formb {
	color: #0037a4;
	font-size: 12px;
	border-color: #f4fAff;
	border-width: 1px;
}


input.seta {
	color: #0033ff;
	font-size: 9px;
}

submitrow input {
	color: #8990AC;
	font-weight: bold;
	background-color: #DCDEE6;
	border-width: 2px;
	border-color: #A2A6BA;
}

input.formfirstalt {
	background: #EFEFEF;
	color: #FF0000;
}

input.formsecondalt {
	background: #E9E8E8;
	color: #FF0000;
}

input.hiddenInput {
	width: 0px;
	height: 0px;
	position: absolute;
	left: -50px;
	top: -50px;
}

/* Input Box */
div .shadowInputBox {

}

div.shadowInputBox div.shadowInputBoxLeft {
	background: url("../images/form/inputbox_left-trans.png") no-repeat;
	width: 8px;
	height: 24px;
	float: left;
}

div.shadowInputBox div.shadowInputBoxMiddle {
	background: url("../images/form/inputbox_middle.png") repeat-x;
	border: none;
	height: 24px;
	float: left;
}

div.shadowInputBox div.shadowInputBoxMiddle input.searchFieldInput {
	padding: 0px;
	margin: 5px 0 0 0;
	color: #f1f1f1;
	border: 0;
	background: none;
	outline: none;
	float: left;
}

div.shadowInputBox div.shadowInputBoxRight {
	background: url("../images/form/inputbox_right-trans.png") no-repeat;
	width: 8px;
	height: 24px;
	float: left;
}

/* Text Area */
div.shadowTextArea {

}

div.shadowTextArea div.shadowTextAreaTopLeft {
	background: url("../images/form/textarea_top_left-trans.png") no-repeat;
	width: 8px;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaTopMiddle {
	background: url("../images/form/textarea_top_middle.png") repeat-x;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaTopRight {
	background: url("../images/form/textarea_top_right-trans.png") no-repeat;
	width: 8px;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaSideLeft {
	background: url("../images/form/textarea_side_left.png") repeat-y;
	width: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaMiddle {
	background: url("../images/form/textarea_middle.png");
	border: none;
	float: left;
}

div.shadowTextArea div.shadowTextAreaMiddle textarea.textAreaInput {
	padding: 0px;
	margin: 0px 0 0 0;
	color: #f1f1f1;
	border: 0;
	background: none;
	outline: none;
}


div.shadowTextArea div.shadowTextAreaSideRight {
	background: url("../images/form/textarea_side_right.png") repeat-y;
	width: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaBottomLeft {
	background: url("../images/form/textarea_bottom_left-trans.png") no-repeat;
	width: 8px;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaBottomMiddle {
	background: url("../images/form/textarea_bottom_middle.png") repeat-x;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

div.shadowTextArea div.shadowTextAreaBottomRight {
	background: url("../images/form/textarea_bottom_right-trans.png") no-repeat;
	width: 8px;
	height: 8px;
	float: left;
	font-size: 1px;
	line-height: 1px;
}

/* File Inputs */
div.fileInput {
	position: relative;
}

div.fileInput div.newFileInput {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1;
}

div.fileInput input.file {
	position: relative;
	text-align: right;
	-moz-opacity:0 ;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 2;
}




table.formTable {
	font-size: 12px;
}

table.formTable td {
	vertical-align: top;
	font-size: 12px;
}

table.formTable td.head {
	vertical-align: top;
	font-size: 12px;
	font-weight: bold;
	padding: 3px 5px;
	margin: 0 0 15px 0;
	text-align: right;
}


/*
----------------------------------------------------------------------------------------------------
- Buttons
----------------------------------------------------------------------------------------------------
*/

a.button_submit:link, a.button_submit:visited {
	color: #ee5053;
	display: block;
	float: left;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	cursor: hand;
	cursor: pointer;
	border: 1px solid #ee5053;
}

a.button_submit span {
	color: #ee5053;
	height: 27px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	padding-top: 10px;
	text-decoration: none;
	outline: none;
}

a.button_submit:active, a.button_submit:hover {
	color: #ee5053;
	display: block;
	float: left;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: underline;
	background-position: bottom right;
	outline: none; /* hide dotted outline in Firefox */
}

a.button_submit:hover span {
	color: #ee5053;
	height: 27px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	padding-top: 10px;
	text-decoration: none;
	outline: none;
}

a.button_submit_inverse:link, a.button_submit_inverse:visited, a.button_submit_inverse:hover {
	background: url('../images/buttons/btn_active_end-trans.png') no-repeat scroll bottom right;
	color: #FFF;
	display: block;
	float: left;
	font: normal 12px arial, sans-serif;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	_padding-right: 10px;
	text-decoration: none;
	cursor: hand;
	cursor: pointer;
	outline: none;
}

a.button_submit_inverse span {
	background: transparent url('../images/buttons/btn_active-trans.png') no-repeat bottom left;
	color: #FFF;
	height: 27px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	font: normal 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

a.button_submit_inverse:active {
	color: #FFF;
	display: block;
	float: left;
	font: normal 14px arial, sans-serif;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	background-position: top right;
	outline: none; /* hide dotted outline in Firefox */
}

a.button_submit_inverse:active span {
	color: #FFF;
	background-position: top left;
	height: 27px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	font: normal 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

/* Used for highlight buttons */
a.button_highlight:link, a.button_highlight:visited {
	background: url('../images/buttons/btn_highlight_end-trans.png') no-repeat scroll top right;
	color: #303b43;
	display: block;
	float: left;
	font: normal 12px arial, sans-serif;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	cursor: hand;
	cursor: pointer;
	outline: none;
	font-size: 1px;
	line-height: 1px;
}

a.button_highlight span {
	background: transparent url('../images/buttons/btn_highlight-trans.png') no-repeat;
	color: #303b43;
	height: 27px;
	display: block;
	line-height: 0px;
	padding: 0 0 0 15px;
	font: normal 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

a.button_highlight:active, a.button_highlight:hover {
	color: #303b43;
	display: block;
	float: left;
	font: normal 14px arial, sans-serif;
	height: 34px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	background-position: bottom right;
	outline: none; /* hide dotted outline in Firefox */
}

a.button_highlight:hover span {
	color: #303b43;
	background-position: bottom left;
	height: 27px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	font: normal 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

/* Used for disabled buttons */
a.button_disabled:link, a.button_disabled:visited, a.button_disabled:hover {
	background: url('../images/buttons/btn_inactive_end.png') no-repeat scroll top right;
	color: #FFF;
	display: block;
	float: left;
	font: normal 12px arial, sans-serif;
	height: 32px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	cursor: hand;
	cursor: pointer;
	outline: none;
}

a.button_disabled span {
	background: transparent url('../images/buttons/btn_inactive.png') no-repeat;
	color: #FFF;
	height: 25px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	font: bold 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

a.button_disabled:active {
	color: #FFF;
	display: block;
	float: left;
	font: normal 14px arial, sans-serif;
	height: 32px;
	margin-right: 6px;
	padding-right: 15px; /* sliding doors padding */
	text-decoration: none;
	background-position: bottom right;
	outline: none; /* hide dotted outline in Firefox */
}

a.button_disabled:active span {
	color: #FFF;
	background-position: bottom left;
	height: 25px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 15px;
	font: bold 14px arial, sans-serif;
	padding-top: 7px;
	text-decoration: none;
	outline: none;
}

a.button_small:link, a.button_small:visited, a.button_small:hover {
	background: url('../images/buttons/btn_small_end.png') no-repeat scroll top right;
	color: #FFF;
	display: block;
	float: left;
	font: normal 11px arial, sans-serif;
	height: 25px;
	padding-right: 10px; /* sliding doors padding */
	text-decoration: none;
	cursor: hand;
	cursor: pointer;
	outline: none;
}

a.button_small span {
	background: transparent url('../images/buttons/btn_small.png') no-repeat;
	color: #FFF;
	height: 20px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 10px;
	font: bold 11px arial, sans-serif;
	padding-top: 5px;
	text-decoration: none;
	outline: none;
}

a.button_small:active {
	color: #FFF;
	display: block;
	float: left;
	font: normal 14px arial, sans-serif;
	height: 25px;
	padding-right: 10px; /* sliding doors padding */
	text-decoration: none;
	background-position: bottom right;
	outline: none; /* hide dotted outline in Firefox */
}

a.button_small:active span {
	color: #FFF;
	background-position: bottom left;
	height: 20px;
	display: block;
	line-height: 14px;
	padding: 0 0 0 10px;
	font: bold 11px arial, sans-serif;
	padding-top: 5px;
	text-decoration: none;
	outline: none;
}

/*
----------------------------------------------------------------------------------------------------
- Calendar
----------------------------------------------------------------------------------------------------
*/

div.calendarIcon {
	padding: 0 4px 4px 0px;
	float: left;
}

div.calendarIcon div.calendarBackground {
	width: 128px;
	height: 128px;
	background: url("../images/body/calendar-trans.png") no-repeat;
}

div.calendarIcon div.calendarHeader {
	font-size: 20px;
	line-height: 24px;
	font-weight: bold;
	text-align: center;
	padding: 11px 0 0 0;
	color: #fff;
}

div.calendarIcon div.calendarBody {
	font-size: 72px;
	line-height: 72px;
	font-weight: bold;
	text-align: center;
	padding: 5px 0 0 0;
	color: #303b43;
}
