/**
 * 	@file trip-planner-form.css
 *
 * Styling for trip planner form UI
 */


.ui-widget {
	font-family: inherit;
}

#block-trip-planner-trip-planner {
	position: relative;
	width: 355px;
	/*margin: 0 20px;*/
	/*padding: 15px 20px;*/
	margin-left: 20px;
	margin-right: 20px;
}

#block-trip-planner-trip-planner h2 {}

#trip-planner-form {}

.form-item,
.form-actions {
	margin: 0;
	font-size: 12px;
}

#edit-meta {
	/*float: right;*/
	position: absolute;
	top: 0;
	right: 0;
}

#tofrom-area {
	position: relative;
}

#more-options {}

#edit-controls {}

#trip-planner-form input[type="text"] {
/*#edit-from,
#edit-to,
#edit-leaveday,
#edit-leavehour {*/
	/*margin: .5em 0;*/
	border: solid 1px rgb(156, 156, 156);
	color: rgb(51, 51, 51);
}


/* Form meta controls */
#form-meta {
	float: right;
}

.form-meta-control {
	margin-left: 10px;
	color: rgb(51, 51, 51);
	text-decoration: underline;
}

.form-meta-control:hover {
	text-decoration: none;
	cursor: pointer;
}


/*Origin & destination controls*/

#edit-from,
#edit-to {
	position: relative;
	left: 30px;
	width: 275px;
	height: 19px;
	padding: 4px;
	border-radius: 3px;
	font-size: 1em;
}

.form-item-from,
.form-item-to {
	height: 42px;
	padding: 5px 0 0;
	background: url("../img/a-flag.png") 0 0 no-repeat scroll transparent;
}

.form-item-to {
	background-image: url("../img/b-flag.png");
}

.form-item-from label,
.form-item-to label {
	position: relative;
	display: block;
	margin: 0 36px -24px;
	overflow: hidden;
	white-space: nowrap;
	font-weight: normal;
	z-index: 1;
}

#tofromtoggle {
	display: block;
	position: absolute;
	top: 45%;
	left: 320px;
	width: 20px;
	height: 21px;
	margin-top: -10px;
	text-indent: -9999em;
	overflow: hidden;
	background: url("../img/toggle.png") 0 0 no-repeat scroll transparent;
}


/*Temporal controls*/

#edit-temporal {
	margin: -5px 0 12px;
}

#edit-temporal > div {
	display: inline-block;
	vertical-align: middle;
}

#edit-leaveday,
#edit-leavehour,
#edit-leaveminute {
	display: inline-block;
	position: relative;
	height: 2.2em;
	padding: 0;
	font-size: 12px;
	line-height: 2.2em;
	overflow: hidden;
	text-decoration: none;
	vertical-align: middle;
}

/*Date field*/
#edit-leaveday {
	width: 7em;
	padding-left: 4px;
	padding-right: 7px;
	background: url("../img/calendar.png") 6.5em 50% no-repeat scroll transparent;
	cursor: pointer;
}


/*Hour field*/
#edit-leavehour {
	width: 15px;
	/*margin-left: -5px;
	margin-right: 2px;*/
	margin: 0;
	padding-left: 5px;
	padding-right: 5px;
	text-align: center;
}


/*Minute field*/
#edit-leaveminute {
	width: 33px;
	/*width: 16px;*/
	/*margin-left: 2px;
	padding-left: 5px;
	padding-right: 5px;*/
	margin: 0;
	padding: 0 5px;
	border: 0 none !important;
}

/*Colon separator*/
.form-item-leaveminute:before {
	margin: -5px;
	padding: 0;
	vertical-align: inherit;
	content: ':';
}

/*Spinner (increment/decrement) buttons*/
.form-item-leaveminute .ui-spinner-button {
	/*left: -16px;
	margin-right: -16px;*/
	border-color: rgb(185, 185, 185);
}


/*Filter options*/

#moreoptions {}


/*Filter display toggler*/
#optionstoggle {
	position: relative;
	margin: 0 0 0 10px;
	font-size: 11px;
	text-decoration: none;
	outline: none;
}

#optionstoggle > span {
	padding: 0 8px;
	background: url("/misc/ui/images/ui-icons_888888_256x240.png") -64px -16px no-repeat scroll transparent;
}

#optionstoggle.active > span {
	background-position: 0 -16px;
}

#optionstoggle:link,
#optionstoggle:visited {
	color: rgb(156, 156, 156);
}

#optionstoggle:hover {
	color: rgb(102, 102, 102);
}

#optionstoggle:hover > span {
	background-image: url("/misc/ui/images/ui-icons_888888_256x240.png");
}

/*Priority & Walking distance filters*/
.form-item-trippriority,
.form-item-maxwalk {
	display: inline-block;
	width: 49%;
}

/*Mode & accessibility filters*/
.form-item-mode > label,
.form-item-accessibility > label {
	display: inline-block;
	width: 90px;
	height: 26px;
	font-size: 12px;
	font-weight: normal;
	line-height: 26px;
	vertical-align: middle;
	white-space: nowrap;
	color: rgb(101, 101, 101);
}

.form-item-mode,
.form-item-accessibility {
	margin: 10px 0;
}

#edit-mode,
#edit-accessibility {
	display: inline-block;
	/*height: 26px;*/
	vertical-align: middle;
}

#edit-mode > div,
#edit-accessibility > div {
	display: inline-block;
	margin-left: 10px;
}

#edit-mode label,
#edit-accessibility label {
	display: inline-block;
	width: 26px;
	height: 26px;
	margin-left: 5px;
	margin-top: 0;
	text-indent: -9999px;
	vertical-align: middle;
	background: center top no-repeat scroll transparent;
}

#trip-planner-form label[for="edit-mode-busish"] {
	background-image: url("../img/bus-modal-icon.png");
}

#trip-planner-form label[for="edit-mode-trainish"] {
	width: 57px;
	background-image: url("../img/sounder-modal-icon.png"), url("../img/link-modal-icon.png");
	background-position: 0 0, 100% 0;
}

#trip-planner-form label[for="edit-accessibility-accessible"] {
	background-image: url("../img/wheelchair-icon.png");
}


/*Form controls*/
#trip-planner-form .form-submit {
	width: auto;
	margin: 0;
	padding: 4px 49px 4px 28px;
	border: 0 none rgba(0, 0, 0, 0);
	border-radius: 4px;
	color: rgb(255, 255, 255);
	cursor: pointer;
	font-size: 1em;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	background: url("../img/trip-submit.png") no-repeat scroll right center transparent;
}