/**
 * Css - Forms
 **/

/**
 * Boder
 **/
#wrapper .border-normal , .form-wrapper .border-normal  { border:5px solid #d0dbca; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;}
#wrapper .border-focusin, .form-wrapper .border-focusin { border:5px solid #9fc283; }
#wrapper .border-error  , .form-wrapper .border-error   { border:5px solid #ca8286; }

/************************************************************************************************
 * Input Text
 **/
#wrapper input, .form-wrapper input {
	font-size: 10px;	
	padding: 8px;
	background:#7a8c7e;
	color:#fff;
	border:none;
}

#wrapper .input, .form-wrapper .input {
	position:absolute !important;
	min-width:60px;
	overflow:hidden !important;
}

#wrapper .input input, .form-wrapper .input input {
/*  width:inherit !important;*/
	float:left;
	width: 100%;
	width /*\**/:95%\9;
}

#wrapper input[type=radio], .form-wrapper input[type=radio] {
    background-color: transparent;
}

.form-debit input[type=checkbox] {
    width: 20px !important;
}


/************************************************************************************************
 * Text Area
 **/
#wrapper textarea, .form-wrapper textarea {
	margin:0 !important;
	width:305px;
	border:none;
	font-size:11px !important;
	outline:none;
	padding:8px;
	color:#fff;
	background:none;
	display:block;
	font-family: "Trebuchet MS", sans-serif;
}

#wrapper .textarea, .form-wrapper .textarea {
	position:absolute !important;
}

#wrapper .textarea #message-scroller, .form-wrapper .textarea #message-scroller {
	width:inherit;
	height:inherit;
	overflow:visible !important;
	display:block !important;
	z-index:0;
	margin:0;
	display:block;
}

#wrapper .textarea #message-container, .form-wrapper .textarea #message-container {
	width:inherit !important;
	min-height:inherit !important;
	height:auto !important;
	margin:0;
	overflow:visible !important;
	display:block !important;
	z-index:999;
}

/*.textarea #message-container > textarea {
    width: 100%;
}*/

#wrapper .textarea .jScrollPaneTrack, .form-wrapper .textarea .jScrollPaneTrack {
	right: -5px !important;
}

#wrapper .textarea .jScrollPaneTrack, .form-wrapper .textarea .jScrollPaneTrack {
	background: #f7f8ea;
}

#wrapper .textarea a.jScrollArrowUp, .form-wrapper .textarea a.jScrollArrowUp {
	width:30px !important;
	height:30px;
	right: 0;
	background: url('../img/common/ui/arrow_up.gif') repeat-x center top;
}

#wrapper .textarea a.jScrollArrowDown, .form-wrapper .textarea a.jScrollArrowDown {
	width:30px !important;
	height:30px;
	right: 0;
	background: url('../img/common/ui/arrow_down.gif') repeat-x center top;
}

#wrapper .textarea .jScrollPaneDrag, .form-wrapper .textarea .jScrollPaneDrag {
	margin:0;
	background: #d0dbca;
}

#wrapper .textarea #message-container > textarea, .form-wrapper .textarea #message-container > textarea {
    float: left;
    width: 343px;
    height: 237px;
    overflow:auto;
}

/************************************************************************************************
 * ComboBox
 **/
#wrapper .combobox, .form-wrapper .combobox {
	/*position:absolute !important;*/
	height:40px;
	overflow:hidden;
}

#wrapper .combobox > div:first-child, .form-wrapper .combobox > div:first-child {
	background:#7a8c7e url('../img/common/ui/scroll.gif') repeat-y 270px 0;
	float:left;
	/*width:300px;*/ /* REMOVE */
	height:30px;
	margin:0;
	padding:0;
	margin-bottom:-5px;
	position:absolute;
	top:0;
	z-index:0;
	overflow:hidden !important; /* bug on IE - change to visible to redraw*/ 
}

#wrapper .combobox > div > p, .form-wrapper .combobox > div > p {
	color:#fff !important;
	width:100%;
	padding:6px 8px 6px 8px !important;
	margin:0 !important;
	z-index:6;
	position:absolute;
	text-align:left;
}

#wrapper .combobox > div > span, .form-wrapper .combobox > div > span {
	width:30px;
	height:30px;
	background:#f7f8ea;
	float:left;
	position:absolute;
	top:0;
	right:0;
	cursor:pointer;
	z-index:2;
	margin:0;
	padding:0;
	background:#7a8c7e url('../img/common/ui/arrow.gif') no-repeat;
}

#wrapper .combobox > div span:hover, .form-wrapper .combobox > div span:hover {
	background:#7a8c7e url('../img/common/ui/arrow.gif') no-repeat 0 -30px;
}

#wrapper .combobox > div p, .combobox > div span, .form-wrapper .combobox > div p {
	cursor:pointer;
} 

#wrapper .combobox > div > div, .form-wrapper .combobox > div > div {
	padding-top:30px;
}

#wrapper .combobox > div ul, .form-wrapper .combobox > div ul {
	z-index:4;
	margin:0 !important;
	display:block;
	
}

#wrapper .combobox > div ul li, .form-wrapper .combobox > div ul li {
	width:100%;
	padding:4px 5px 6px 10px;
	color:#fff;
	overflow:hidden;
}

#wrapper .combobox > div ul li:hover, .form-wrapper .combobox > div ul li:hover {
	background:#5c6e5e;
	cursor:pointer;
}

#wrapper .combox .jScrollPaneContainer, .form-wrapper .combox .jScrollPaneContainer {
	right: 0px !important;
}

/************************************************************************************************
 * ScrollBar UI
 **/
.select-neighborhood .jScrollPaneContainer {width: 265px !important;}
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 10px;
	top: 0;
	height: 100%;
	width: 30px !important;
	background: #d0dbcb;
	border-left:5px solid #d8e1d4;
	border-right:5px solid #d8e1d4;
}
.jScrollPaneDrag {
	position: absolute;
	background: #7a8c7e;
	cursor: pointer;
	overflow: hidden;
	width:30px !important;
	left: 0;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 10px;
	text-indent: -2000px;
	overflow: hidden;
	background: url('../img/common/ui/arrow_top.png') repeat-x center top;
	width:40px !important;
	height:35px;
}
a.jScrollArrowUp:hover {
	background-position: center bottom !important;
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 10px;
	text-indent: -2000px;
	overflow: hidden;
	background: url('../img/common/ui/arrow_bottom.png') repeat-x center top;
	width:40px !important;
	height:35px;
}

a.jScrollArrowDown:hover {
	background-position: center bottom !important;
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	background-position: center bottom !important;
}

/**
 * generic input text
 **/
/*.inputText {
	border: 5px solid;
	border-color: #000;	
}*/

/**
 * ---------------------------------- //
 * Custom Input [START]
 * ---------------------------------- //
 **/
.customInput {
/*	background: #d3d3c6;*/
/*	padding: 5px;*/
	float: left;
	position: relative;	
}

.customInput p {
/*	background: #8d8d85;*/
/*	padding: 5px;*/
/*	height: 20px;*/
	position: relative;
}

.customInput input {
	background: none;
	color: #fff;
/*	width: 95px;*/
	padding: 0;
/*	height: 20px;
	line-height: 20px;*/
	width: 95px;
	font-size: 10px;
}
/**
 * -------------------------- //
 * Custom Input [END]
 * -------------------------- //
 **/

/**
 * ------------------------ //
 * Custom Select [START]
 * ------------------------ //
 **/
#wrapper .customSelect, .form-wrapper .customSelect {
	float: left;
	position: relative;
/*	height: 40px;*/
	margin-right: 10px;	
}

#wrapper .customSelect select, .form-wrapper .customSelect select {
	visibility: hidden;
	float: left;
/*	height: 30px;
	line-height: 30px;*/
}

#wrapper .customSelect .holder, .form-wrapper .customSelect .holder {
/*	background: #d3d3c6;*/
/*	padding: 5px;*/
	float: left;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1000;
	overflow: hidden;
}

/*.customSelect .holder:hover {
	background: #ffc490;
}*/

#wrapper .customSelect dl.listCustomSelect, .form-wrapper .customSelect dl.listCustomSelect {
/*	background: #d3d3c6;*/
	float: left;
	color: #fff;
	overflow: hidden;
	position: relative;
	padding: 0;
}

#wrapper .customSelect dl.listCustomSelect dt, .form-wrapper .customSelect dl.listCustomSelect dt {
/*	background: #8d8d85;*/
	float: left;
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding: 0 5px;
	position: relative;
}

#wrapper .customSelect dl.listCustomSelect dt strong, .form-wrapper .customSelect dl.listCustomSelect dt strong {
	font-weight: normal;
}

#wrapper .customSelect .arrow, .form-wrapper .customSelect .arrow {
	position: absolute;
	right: 10px;
	top: 0;
	height: 30px;
	line-height: 30px;
	width: 30px;
	background: url( '../img/common/ui/bt-down-combo.png' ) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	display:block;
	-moz-user-select: none;
	-webkit-user-select: none;
	z-index:30;
}

#wrapper .customSelect dl.listCustomSelect dd, .form-wrapper .customSelect dl.listCustomSelect dd {
	background: #8d8d85;
	float: left;
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding: 0 5px;
	cursor: pointer;
	-moz-user-select: none;
	-webkit-user-select: none;
}

#wrapper .customSelect dl.listCustomSelect dd:hover, .form-wrapper .customSelect dl.listCustomSelect dd:hover {
	background: #676761;
}
/**
 * ------------------------ //
 * Custom Select [END]
 * ------------------------ //
 **/
#holder-fields ul li .textarea.message.border-normal.message {border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; height:234px !important;}
#holder-fields ul li .textarea #message-scroller #message { height:218px}
