/*

	Description: Homepage.
	Version: 0.1

*/

#page-home #shadow-logo-left
{
	background: url(../images/sprite.png) -25px -1933px no-repeat;
	width: 25px;
	height: 222px;
	bottom: -8px
}

#page-home #wrapper
{
	background: none;
	border: none;
}

#page-home #content
{
	z-index: 310;
	position: relative;
}


#page-home #wrapper .column
{
	position: relative;
	float: left;
	width: 33.33%;
	background: #fff;
	/*height: 390px;*/
	height: 30.4em;
	margin-bottom: 20px;
}

#page-home #wrapper .column .column-shadow
{
	position: absolute;
	z-index: 299;
	top: 0;
	right: -12px;
	background: url(../images/sprite.png) -521px -2000px no-repeat;
	height: 390px;
	width: 12px;
}

/*--- Journey Planner Box ---*/

#page-home #plan-my-journey-blq
{
	background: #fff url(../images/gradient-home-box.png) repeat-x;
	-moz-border-radius-topleft: 18px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 18px 0px 0px 0px;
	border-radius: 18px 0px 0px 0px;
}

#page-home #plan-my-journey-blq h2
{
	font-size: 1.35em;
	font-weight: bold;
	padding: 20px 20px 0 20px;
}

#page-home #plan-my-journey-blq #need-help
{
	position: absolute;
	top: 22px;
	right: 20px;
	font-size: .9em;
}

/*--- Form ---*/

#page-home #plan-my-journey-blq form
{
	position: absolute;
	top: 50px;
	left: 0;
	height: auto;
	width: 287px;
	background: #fff;
	z-index: 777;
	padding: 0 20px;
	/*min-height: 340px;*/
	min-height: 26.5em;
}

#page-home #plan-my-journey-blq label
{
	font-weight: bold;
	text-indent: 2px;
}

#page-home #plan-my-journey-blq label span
{
	font-weight: normal;
}

#page-home #plan-my-journey-blq legend
{
	font-weight: bold;
}

#page-home #plan-my-journey-blq input[type=checkbox]
{
	width: 16px;
	height: 16px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {

	/* Webkit hack */
	
	#page-home #plan-my-journey-blq #travel-by-wrapper .colored-check input[type=checkbox]
	{
		width: 15px;
		height: 15px;
	}
}

/* Text fields */

#page-home #plan-my-journey-blq input[type=text]
{
	width: 94%;
	margin-bottom: 8px;
	font-weight: normal;
}

/* Live search */

#page-home #plan-my-journey-blq
{
    width: 287px;
    min-height: 20px;
    position: absolute;
}

.fromAdressList, .toAdressList{
    width: 287px;
    min-height: 20px;
    position: absolute;
    border: 1px solid #000000;
    z-index: 999;
    background-color: #FFFFFF;
}


.fromAdressList{
    top: 55px;
}

.toAdressList{
    top: 115px;
}

.fromAdressList li, .toAdressList li{
    line-height: 25px;
    border-top: 1px solid #000000;
    display: block;
    height: 25px;
    padding-bottom: 2px;
    padding-top: 2px;
}


.hiden{
    display: none;
}

/* When */

#page-home #plan-my-journey-blq #when-wrapper
{
	position: relative;
	background: #ebf2f9;
	margin: 3px -1em 0 -1em;
	line-height: 1.9em;
}

#page-home #plan-my-journey-blq #when-wrapper legend
{
	background: url(../images/sprite.png) -521px -1954px no-repeat;
	width: 79px;
	text-align: center;
	color: #fff;
	float: left;
	margin: 0;
}

#page-home #plan-my-journey-blq #when-wrapper label
{
	display: inline;
	font-weight: normal;
}

#page-home #plan-my-journey-blq #when-wrapper input[type=radio]
{
	margin: 0 5px 0 10px;
}

#page-home #plan-my-journey-blq #when-wrapper #date-wrapper
{
	position: absolute;
	left: 20px;
	top: 22px;
	font-weight: normal;
	width: 33%;
	margin: 10px 0 0 0;
	line-height: 1.25em;
}

#page-home #plan-my-journey-blq #when-wrapper #date-wrapper input[type=text]
{
	font-size: .9em;
	padding: 6px 4px 4px 4px;
	background: url(../images/sprite.png) right -1254px no-repeat;
}

/* Time */

#page-home #plan-my-journey-blq #time-wrapper
{
	float:right;
	margin: 10px 0 12px 10px;
}

#page-home #plan-my-journey-blq #time-wrapper label
{
	float: left;
	font-weight: normal;
	margin-right: 4px;
	line-height: 18px;
}

#page-home #plan-my-journey-blq #time-wrapper label select
{
	display: block;
	width: 50px;
}

/* Travel by */

#page-home #plan-my-journey-blq #travel-by-wrapper label
{
	display: inline-block;
	margin-top: 4px;
	font-weight: normal;
	margin: 0 0 0 3px;
}

#page-home #plan-my-journey-blq #travel-by-wrapper .colored-check
{
	display: inline-block;
	border-style: solid;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #FFF;
	border-color: #FFF;
	text-align: center;
	padding: 1px;
	margin-top: 2px;
}

#page-home #plan-my-journey-blq #travel-by-wrapper .bus-check.checked,
#page-home #plan-my-journey-blq #travel-by-wrapper .schs-check.checked
{
	border-color: #2eaa56;
	background: #2eaa56;
}

#page-home #plan-my-journey-blq #travel-by-wrapper .train-check.checked
{
	border-color: #27a7df;
	background: #27a7df;
}

#page-home #plan-my-journey-blq #travel-by-wrapper .tram-check.checked
{
	border-color: #eb2127;
	background: #eb2127;
}

/* Results */

#page-home #plan-my-journey-blq #results-wrapper
{
	margin-top: 6px;
}

#page-home #plan-my-journey-blq #results-wrapper label
{
	padding-top: 4px;
	display: inline-block;
	font-weight: normal;
}

#page-home #plan-my-journey-blq #results-wrapper input[type=checkbox]
{
	margin: 0 6px 0 2px;
}

/* Submit */

#page-home #plan-my-journey-blq input[type=submit]
{
	position: absolute;
	bottom: 38px;
	right: 20px;
}

/* -- Extended -- */

#page-home #plan-my-journey-blq #jp-extended
{
	padding:5px 0 24px 0;
}

#page-home #plan-my-journey-blq #jp-extended-trigger
{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: #ebf2f9;
	text-align: center;
	line-height: 2em;
	font-size: .9em;
	border-bottom: 1px solid #cedbef;
}

#page-home #plan-my-journey-blq #jp-extended-trigger a
{
	padding-left: 15px;
	margin-right: 15px;
	background-image: url(../images/sprite.png);
	background-position: 0 -2164px;
	background-repeat: no-repeat;
}

#page-home #plan-my-journey-blq .jp-extended-trigger-off a
{
    background-position: -590px -2164px !important;
}

/* Show me & Maximum walk */

#page-home #plan-my-journey-blq #show-me-wrapper
{
	margin-bottom: 5px;
}

#page-home #plan-my-journey-blq #show-me-wrapper label,
#page-home #plan-my-journey-blq #maximum-walk-wrapper select
{
	display: inline-block;
	font-weight: normal;
	margin-top: 8px;
}

#page-home #plan-my-journey-blq #maximum-walk-wrapper
{
	margin-bottom: 30px;
}

#page-home #plan-my-journey-blq #show-me-wrapper legend,
#page-home #plan-my-journey-blq #maximum-walk-wrapper legend
{
	display: block;
	border-bottom: 1px solid #858585;
	width: 100%;
	line-height: 21px;
}

#page-home #plan-my-journey-blq #show-me-wrapper input[type=radio]
{
	margin: 0 6px 0 2px;
}

/*--- Shortcuts Box ---*/
/* last edit 10 OCT WNPsaila */

#page-home #wrapper #shortcuts-blq
{
	background: #fff;
	z-index: 200;
}

/* #page-home #wrapper #shortcuts-blq img
{
	margin-bottom: -20px;
}*/

#page-home #wrapper #shortcuts-blq #featureone {
	width: 328px;
	height: 222px;
	margin: 0;
	padding: 0;
	background: url(../images/contents/home-metrocard-panel-bg.jpg) 0 0 no-repeat;	
}

#page-home #wrapper #shortcuts-blq #featuretwo {
	width: 328px;
	height: 167px;
	margin: 0;
	padding: 0;
	background: url(../images/contents/home-timetables-panel-bg.jpg) 0 0 no-repeat;	
}

#page-home #wrapper #shortcuts-blq h3 {
	font: bold 1.4em Arial, Helvetica, sans-serif;
	color: #0F2E5D;
	text-shadow: 0px 1px 0px white;
}

#page-home #wrapper #shortcuts-blq #featureone h3 { /* individual Metrocard Header */
	margin: 0;
	padding: 21px 0 0 19px;
}

#page-home #wrapper #shortcuts-blq #featuretwo h3 { /* individual Timetables Header */
	margin: 0;
	padding: 20px 0 0 19px;
}

#page-home #wrapper #shortcuts-blq a {
	text-decoration: none;
}

#page-home #wrapper #shortcuts-blq a:hover {
	text-decoration: underline;
}

#page-home #wrapper #shortcuts-blq ul#homefeaturelinks {
	list-style: none;
	padding: 0;
}

#page-home #wrapper #shortcuts-blq ul.homemetrocardlinks { /* individual Metrocard UL style */
	float: right;
	text-align: right;
	margin: 110px 14px 0 0;
}

#page-home #wrapper #shortcuts-blq ul.hometimetableslinks { /* individual Timetables UL style */
	text-align: left;
	margin: 14px 0 0 19px;
}

#page-home #wrapper #shortcuts-blq ul#homefeaturelinks li {
}

#page-home #wrapper #shortcuts-blq ul#homefeaturelinks li a {
	margin: 0;
	padding: 0 14px 5px 0;
	font: normal 1.07em Arial, Helvetica, sans-serif;
	color: #0F2E5D;
	text-shadow: 0px 1px 0px white;
	background: url(../images/link-arrow.png) right 4px no-repeat;
}



/*--- Announcements Box ---*/

#page-home #wrapper #announcements-blq
{
	background: #f7faff url(../images/hme-announcements-bg.png) bottom left no-repeat;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-bottomright: 18px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 0px 0px 18px 0px;
	border-radius: 0px 0px 18px 0px;
	overflow: hidden;
}

#page-home #wrapper #announcements-blq h2
{
	position: absolute;
	top: 15px; /* Keeps in line with other panel's h2 */
	height: 35px;
	width: 50%;
	background: #cedbef /*url(../images/gradient-tabs-announcement.png) top repeat-x*/;
	cursor: pointer;
	text-align: center;
	font: bold 1.4em Arial, Helvetica, sans-serif;
	color: #0F2E5D;
	text-shadow: 0px 1px 0px white;
	line-height: 35px;
	/* border-bottom: 1px solid #fff; */
}

/* Tabs */

#page-home #wrapper #announcements-blq #tab-1-trigger
{
	/* border-right: 1px solid #fff; */
}

#page-home #wrapper #announcements-blq #tab-2-trigger
{
	right: 0;
}

#page-home #wrapper #announcements-blq h2.active
{
	background-color: #f7faff;
	color: #000;
	cursor: default;
	border-bottom: 1px solid #f8f9fe;
}

/* Service updates */

#page-home #wrapper #announcements-blq ul.service-updates
{
	position: absolute;
	top: 45px;
}

#page-home #wrapper #announcements-blq ul.service-updates li.update a
{
	text-shadow: 0px 1px 0px #ffffff;
}

/* What's New */

#page-home #wrapper #announcements-blq ul.whats-new
{
	position: absolute;
	top: 45px;
}

#page-home #wrapper #announcements-blq ul.whats-new li
{
	padding: 12px 20px 12px 20px;
	border-bottom: 1px solid #e2e8ef;
	border-top: 1px solid #fff;
}

#page-home #wrapper #announcements-blq ul.whats-new li.first
{
	border-top: none;
}

#page-home #wrapper #announcements-blq ul.whats-new li.last
{
	border-bottom: none;
}

#page-home #wrapper #announcements-blq ul.whats-new li:hover
{
	background: url(../images/sprite.png) -20px -2567px;
}

#page-home #wrapper #announcements-blq ul.whats-new li a
{
	font-size: 1.1em;
	text-shadow: 0px 1px 0px #ffffff;
}

#page-home #wrapper #announcements-blq ul.whats-new li span
{
	display: block;
	margin-top: 3px;
	font-size: .9em;
	text-shadow: 0px 1px 0px #ffffff;
}

#page-home #wrapper #announcements-blq a.show-more
{
	position: absolute;
	bottom: 7px;
	left: 70px;
	border: none;
}

/* SimplyScroll */

#page-home #wrapper #announcements-blq .scroller,
#page-home #wrapper #announcements-blq .scroller .scroller-clip
{
	width: 220px;
}

/*--- Callouts ---*/

#page-home #wrapper .callouts
{
	margin-bottom: 40px;
}

/* Video Dialog */
#lightbox-video { 
	/* the jquery ui theme might already have positioning styles for the lightbox, in which case the following styles might not be needed */
	/*position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -300px;
	margin-left: -320px;*/
	
	
	/* these probably will be needed regardless */
	/*display:none;
        background-color: #FFF;
	width: 640px;
	padding: 20px 20px 40px 20px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;*/
}

#lightbox-video .close {
	/* i'll pretty this up a bit once the markup is in the template */
	display: block;
	margin: -10px 0 10px 0;
	float: right;
}