/*
Template Name: CleanDream
Author: Rory Kranendonk
Author URI: http://www.dreamwire.nl
Version: 1.0
*/

.box .content.forms {
	padding : 0;
}

form {
	display: block;
	margin : 0;
	padding : 0;
}

.line {
	display: block;
	padding : 15px 15px 15px 139px;
}

.line.button {
	padding :  7px 15px 10px;
}

label {
	float : left;
	padding : 4px 0 0 0;
	margin : 0 0 0 -124px;
	font-size : 12px;
	color : #002e68;
	font-weight : bold;
	cursor : text;
	width : 124px;
}

/* //////////////////// INPUTFIELD \\\\\\\\\\\\\\\\\\\\ */

input {
	display : inline-block;
	border : 0;
	outline: 0;
	padding : 6px 7px 6px;
	margin : 0;
	font-size : 12px;
	color : #002e68;
	*cursor : text;
	line-height : 1.2em;
	height : 15px;
}

input.small {
	background : url(/gfx/forms/forms-input-small.gif) no-repeat left top transparent;
	*background : transparent;
	width : 166px;
}

input.medium {
	background : url(/gfx/forms/forms-input-medium.gif) no-repeat left top transparent;
	*background : transparent;
	width : 297px;
}

input.big {
	background : url(/gfx/forms/forms-input-big.gif) no-repeat left top transparent;
	*background : transparent;
	width : 552px;
}

input.xl {
	background : url(/gfx/forms/forms-input-xl.gif) no-repeat left top transparent;
	*background : transparent;
	width : 802px;
}

input:hover, input:focus {
	background-position : left bottom;
	color : #5a5a5a;
}

div.input-small {
	display : inline;
	background : url(/gfx/forms/forms-input-small.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 166px;
	height : 28px;
}

div.input-medium {
	display : inline;
	background : url(/gfx/forms/forms-input-medium.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 297px;
	height : 28px;
}

div.input-big {
	display : inline;
	background : url(/gfx/forms/forms-input-big.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 552px;
	height : 28px;
}

div.input-xl {
	display : inline;
	background : url(/gfx/forms/forms-input-xl.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 802px;
	height : 28px;
}

/* //////////////////// SELECTBOX \\\\\\\\\\\\\\\\\\\\ */

.ui-selectmenu {
	display : inline-block;
	position : relative;
	background : url(/gfx/forms/forms-selectbox.gif) no-repeat left top transparent;
	padding : 5px 7px 6px 7px;
	margin : 0 3px 0 0;
	text-decoration : none;
	overflow : hidden;
	outline : none;
	width : 167px;
	height : 16px;
}

.ui-selectmenu.small {
	background : url(/gfx/forms/forms-selectbox-small.gif) no-repeat left top transparent;
	width : 67px;
}

.ui-selectmenu-menu {
	position : absolute;
	top : 0;
	z-index : 9999;
	background-color : #FFFFFF;
	border : 1px solid #c3d0e1;
	padding : 0;
	margin : 9px 0 0 6px;
	list-style : none;
	visibility : hidden;
	overflow : auto;
	width : 167px;
	max-height : 155px;
}

.ui-selectmenu-menu.small {
	width : 67px;
}

.ui-selectmenu-open {
	visibility : visible;
}

.ui-selectmenu-menu li {
	display : block;
	background : none;
	background-color : #FFFFFF;
	outline : none;
	padding : 0;
	margin : 0;
}

.ui-selectmenu-menu li a, .ui-selectmenu-status {
	display : block;
	padding : 4px 7px;
	outline : none;
	overflow : hidden;
	font : 12px/18px Arial;
	font-weight : 100;
	cursor : pointer;
	color: #5a5a5a;
	text-decoration: none;
}

.ui-selectmenu-status {
	padding : 0;
}

.ui-selectmenu-menu li a:hover, li.ui-selectmenu-item-selected a {
  background : #eff2f6;
  color : #002e68;
}

select.multi {
	display : block;
	border : 1px solid #c3d0e1;
	outline : 0;
	width : 566px;
}

/* //////////////////// UPLOAD BUTTON \\\\\\\\\\\\\\\\\\\\ */

input.file {
	float : left;
	background : url(/gfx/forms/forms-input-small.gif) no-repeat left top transparent;
	margin : 0 2px 0 0;
	z-index : 99;
	height : 15px;
}

div.btn-upload {
	display : inline-block;
	*display : inline;
	background : url(/gfx/forms/forms-file.gif) no-repeat right top transparent;
}

div.btn-upload:hover {
	background-position : right bottom;
}

div.btn-upload input {
	*position : relative;
	*z-index : -1;
}

/* //////////////////// TEXTAREA \\\\\\\\\\\\\\\\\\\\ */

textarea {
	display : inline-block;
	overflow : auto;
	border : 0;
	outline: 0;
	padding : 6px 7px 6px;
	margin : 0;
	cursor : text;
	resize : none;
	font : 12px Arial;
	color : #002e68;
	line-height : 1.42em;
	height : 69px;
}

textarea.small {
	background : url(/gfx/forms/forms-textarea-small.gif) no-repeat left top transparent;
	*background : transparent;
	width : 166px;
}

textarea.medium {
	background : url(/gfx/forms/forms-textarea-medium.gif) no-repeat left top transparent;
	*background : transparent;
	width : 297px;
}

textarea.big {
	background : url(/gfx/forms/forms-textarea-big.gif) no-repeat left top transparent;
	*background : transparent;
	width : 552px;
}

textarea.xl {
	background : url(/gfx/forms/forms-textarea-xl.gif) no-repeat left top transparent;
	*background : transparent;
	width : 802px;
}

textarea:hover, textarea:focus {
	background-position : left bottom;
}

div.textarea-small {
	display : inline;
	background : url(/gfx/forms/forms-textarea-small.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 166px;
	height : 80px;
}

div.textarea-medium {
	display : inline;
	background : url(/gfx/forms/forms-textarea-medium.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 297px;
	height : 80px;
}

div.textarea-big {
	display : inline;
	background : url(/gfx/forms/forms-textarea-big.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 552px;
	height : 80px;
}

div.textarea-xl {
	display : inline;
	background : url(/gfx/forms/forms-textarea-xl.gif) no-repeat left top transparent;
	overflow : hidden;
	width : 802px;
	height : 80px;
}

/* //////////////////// CHECKBOXES & RADIOBUTTONS \\\\\\\\\\\\\\\\\\\\ */

table input[type=checkbox],
table input[type=radio] {
	background : none;
	padding : 0;
}

.custom-checkbox, .custom-radio {
	display : inline-block;
	position : relative;
	*display : inline;
	margin : 3px 20px -2px 0;
	*zoom : 1;
}

.custom-checkbox input, 
.custom-radio input {
	position : absolute;
	background : transparent;
	left : 0;
	top : 0;
	margin : 0;
	z-index : -1;
	width : 13px;
	height : 13px;
}

.custom-checkbox label, 
.custom-radio label {
	display : inline-block;
	padding : 0 0 0 26px;
	margin : 0;
	color : #5a5a5a;
	font-weight : 100;
	line-height : 20px;
	font-size : 12px;
	cursor : pointer;
	width : auto;
	height : 19px;
}

.custom-checkbox label {
	background : url(/gfx/forms/forms-checkbox.gif) no-repeat;
}

.custom-radio label {
	background : url(/gfx/forms/forms-radio.gif) no-repeat;
}

.custom-checkbox label.hover,
.custom-checkbox label.focus,
.custom-radio label.hover,
.custom-radio label.focus,
.custom-checkbox label, .custom-radio label {
	background-position : left bottom;
}

.custom-checkbox label.checked, 
.custom-radio label.checked,
.custom-checkbox label.checkedHover, 
.custom-checkbox label.checkedFocus {
	background-position : left top;
}

/* //////////////////// DATE PICKER \\\\\\\\\\\\\\\\\\\\ */

input.datepicker {
	float : none;
	background : url(/gfx/forms/forms-date.gif) no-repeat right top transparent;
	margin : 0 20px 0 5px;
	padding : 6px 34px 6px 7px;
	cursor : pointer;
	width : 69px;
}

input.timepicker {
	float : none;
	background : url(/gfx/forms/forms-selectbox.gif) no-repeat left top transparent;
	margin : 0 20px 0 5px;
	padding : 5px 7px 6px 7px;
	cursor : pointer;
	width : 167px;
	height : 16px;
}

/* //////////////////// SLIDER \\\\\\\\\\\\\\\\\\\\ */

.slider{
	display : block;
	margin : 0 0 0 -124px;
	color : #002e68;
}

.slider .ui-slider-horizontal,
.slider .slide{
	position : relative;
	display : block;
	border: 1px solid #C3D0E1;
	margin : 5px 0 0;
	height : 10px;
}

.slider .ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}

.slider .ui-slider .ui-slider-range {
	position: absolute;
	background: #F2F4F7;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

.slider .ui-slider-horizontal .ui-slider-handle {
	margin-left: -.6em;
}

.slider .ui-slider .ui-slider-handle {
	position: absolute;
	background: url(/gfx/slider-button.gif) no-repeat;
	top : -3px;
	z-index: 2;
	width: 16px;
	height: 16px;
	cursor: default;
}

.slider input {
	float : none;
	padding : 0;
	text-align : right;
	color : #5a5a5a;
	width : 30px;
}

.slider input.amount-second {
	text-align : left;
}

/* //////////////////// AUTOCOMPLETE \\\\\\\\\\\\\\\\\\\\ */

.ui-autocomplete { position: absolute; cursor: default; }	

/* workarounds */
* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */

.ui-menu {
	float : left;
	display : block;
	background-color : #FFFFFF;
	border : 1px solid #c3d0e1;
	list-style-type : none;
	overflow-x : hidden;
	overflow-y : auto;
	margin : 0;
	padding : 0;
	width : 168px;
	max-height : 250px;
}
.ui-menu .ui-menu {
	margin: -3px 0 0;
}
.ui-menu .ui-menu-item {
	margin:0;
	padding: 0;
	zoom: 1;
	float: left;
	clear: left;
	width: 100%;
}
.ui-menu .ui-menu-item a {
	display : block;
	background-color : #FFFFFF;
	padding : 3px 5px;
	overflow : hidden;
	font-family : Arial;
	font-weight : 100;
	cursor : pointer;
	color: #5a5a5a;
	font-size : 12px;
	line-height : 18px;
	text-decoration: none;
	zoom:1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
  background-color : #eff2f6;
  color : #002e68;
}