/*
============================================================================
ELEMENT IDS
============================================================================
*/

#AccessibilityOptions
{
width: 135px; /* width: 115px; */
}

#AccessibilityOptions,
#MinimizationOptions,
#TransportationModes
{
height: 60px;
line-height: 20px;
}

#GeneralErrorPanel
{
/*##########################################################
# 2010.02.17 - LJH
# - changed margin-top from 5 to 60 because Show Trip was
# moved below Step 4.  
# - added margin-left for the same reason above
###########################################################*/
margin-top: 65px;
margin-bottom: 5px;
margin-left: 50px;
}

#Main
{
background-color: #FFFFFF;
/*##################################################
# New banner 
####################################################*/
background-image: url(img/White-Banner-ClicknRide-1094x130.jpg);
background-repeat: no-repeat;
width: 1094px;
/*#######################################################
# 2009.11.18 - LJH
# height added to show the bottom of the bigger banner
########################################################*/
height: 130px;
}

#MainView
{
display: block;
margin-left: 10px;
position: absolute;
width: 995px;
/*###############################################################################
# 2009.11.18 - LJH
# added top to move the top of the page contents down far enough to show the ad
#################################################################################*/
top: 140px;
}

#MainViewTitle
{
display: block;
height: 50px;
margin-bottom: 5px;
}

#MainViewTitleLabel
{
color: #003366;
left: -14px;
font-size: 18px;
font-weight: bold;
text-transform: none;
top: 0px;
}

/****************************************
 * THIS CHANGES THE POSITION OF THE MAP *
 ****************************************/
#Map
{
display: block;
position: absolute;
top: 59px;
left: 533px;
z-index: 111;
}

#MinimizationOptions
{
width: 180px; /* width: 200px; */
}


/*
*********************************
*
* MAP SIZING!!!
*
*********************************
*/
#LocationSelectionMap_MapContainer
{
/* this works in firefox and old IE, but not IE8 */

/**** original settings 
width: 453px !important;
height: 433px !important;
****/


width: 553px !important;
height: 433px !important;

}

#SelectOriginLinkButton, #SelectDestinationLinkButton
{
        /* temporary: remove link to the map */
display: none;
}

#Step1, #Step2, #Step3, #Step4
{
background-position: left top;
}

#Step1
{
height: 121px;
background-image: url(img/1.png); /* background-image: url(img/step1mt.gif); */
background-repeat: no-repeat;
z-index: 99;
}

#Step2
{
height: 121px;
background-image: url(img/2.png); /* background-image: url(img/step2mt.gif); */
background-repeat: no-repeat;
z-index: 98;
}

#Step3
{
height: 125px;
background-image: url(img/3.png); /* background-image: url(img/step3mt.gif); */
background-repeat: no-repeat;
z-index: 97;
}

#Step4
{
height: 102px; /* height: 87px; */
background-image: url(img/4.png); /* background-image: url(img/step4mt.gif); */
background-repeat: no-repeat;
z-index: 96;
}

#Step3 .InputStepContent
{
width: 475px;
background-image: url(img/Panel_100_1mt.gif); /* background-image: url(img/Panel_100_1.jpg); */
background-repeat: repeat-x;
}

#Step3 .InputStepContent #TimeOptions
{
margin: 3px;
}

#ClearOriginLinkButton, #ClearDestinationLinkButton
{
margin-left: 15px;
position: relative;
top: 25px;
width: 25px;
}

#Step1HelpLinkButton, #Step2HelpLinkButton, #Step3HelpLinkButton, #Step4HelpLinkButton
{
position: absolute;
top: 6px; /* top: 0px; */
left: 353px; /* left: 450px; */
display: block;
height: 16px; /* height: 24px; */
width: 62px; /* width: 24px; */
background-image: url(img/help_16mt_howto.gif); /* background-image: url(img/help_24.jpg); */
background-repeat: no-repeat;
}

#Step1HelpLinkButton:hover, #Step2HelpLinkButton:hover, #Step3HelpLinkButton:hover, #Step4HelpLinkButton:hover
{
background-image: url(img/help_16mt_selected_howto.gif); /* background-image: url(img/help_24_Selected.jpg); */
}

#TimeTypes
{
margin-top: 5px;
}

#TransportationModes
{
width: 150px;
}

#TransportationModes .BusOption,
#TransportationModes .TrainOption
{
width: 66px;
float: left;
}

#TransportationModes .MetroOption,
#TransportationModes .TramOption
{
clear: right;
}

#TVPTimeControl_EarliestRadioButton,
#TVPTimeControl_LatestRadioButton
{
margin-right: 3px;
}

/*
============================================================================
CLASSES
============================================================================
*/

.AccessibleOption label
{
background-image: url(img/Accessible.gif);
background-repeat: no-repeat;
background-position: right center;
padding-right: 22px;
}

.Actions
{
display: block;
margin-left: 400px;
margin-top: 10px;
margin-bottom: 10px;
}

.ActionLink
{
background-image: url(img/arrow35mt.gif);
background-repeat: no-repeat;
color: #003366;
display: block;
font-size: 18px;
font-weight: bold;
height: 35px;
left: 10px; /* 245px; */
line-height: 35px;
padding-left: 40px;
position: absolute; /* relative; */
text-align: left;
text-decoration: underline;
text-transform: capitalize;
top: 120px; /* -20px; */ /* SS top: -53px;*/
vertical-align: middle;
width: 200px;

}

.BicycleOption
{
display:none !important;
}

.BusOption
{
}

.EarliestRadioButton
{
}

.ErrorPanel
{
font-size: 11px;
height: 25px;
margin-left: 86px; /* margin-left: 55px; */
width: 425px; /* width: 475px; */
}

.InputOptions
{
background-image: url(img/location_pale_pane.jpg); /* background-image: url(img/Panel_100_1.jpg); */
background-repeat: repeat-x;
margin-right: 5px;
}

.InputOptions input
{
float: left;
}

.InputOptions label
{
display: block;
height: 20px;
}

.InputOptions span
{
display: block;
margin-left: 3px;
margin-right: 3px;
height: 20px;
}

.InputStep
{
display: block;
position: relative;
margin-left: 5px;
margin-right: 5px;
width: 620px; /* width: 880px; */
}

.InputStepActions
{
position: absolute;
top: 55px; /* top: 60px; */
width: 150px;
height: 30px;
left: 458px;
}

.InputStepActions a
{
display: block;
width: 100%;
margin-bottom: 5px;
font-size: xx-small;
font-weight: bold;
}

.InputStepContent
{
position: absolute;
top: 40px; /* top: 32px; */
left: 48px;
/**********************************/
width: 490px; /* width: 600px; */
}

.InputStepTitle
{
position: absolute;
top: 2px; /* top: 0px; */
left: 48px;
width: 475px; /* SS width: 545px; */
height: 38px; /* height: 27px; */
line-height: 27px;
/* border-bottom: solid 1px #013467; */

/* background-image: url(img/Finalbusstripes38px_475mt.gif); */
background-repeat: no-repeat;
}

.InputStepTitle a
{
font-size: small;
font-weight: bold;
}

.InputStepTitle span
{
font-size: small;
font-weight: bold;
}

.LatestRadioButton
{
}

.LocationType .InputFields
{
width: 300px;
}

.LocationType .TextBox
{
float: left;
margin-bottom: 2px;
margin-right: 2px;
padding-right: 0px; /* padding-right: 2px; */
}

.LocationTypes
{
width: 473px; /* width: 475px; */
height: 58px;
background-image: url(img/Panel_100_1mt.gif); /* background-image: url(img/Panel_100_1.jpg); */
background-repeat: repeat-x;
}

.BicycleOption, .MetroOption, .TrainOption, .BusOption
{
        /* these options are removed, not useful for Mississauga */
display: none !important;
}

.MetroOption
{
}

.SpecificTimeRadioButton
{
float: left;
}

.TimeOption
{
}

.TrainOption
{
}

.TramOption
{
}

.TransfersOption
{
}

.UpdateProgressionPanel
{
background-color: Transparent;
background-image: url(img/ProgressBack-85.png);
}

.UpdateProgressionPanelView
{
height: 110px;
left: 123px;
top: 160px;
width: 206px;
}

.UpdateProgressionPanel .ProgressBarImage
{
height: 75%;
}

.UpdateProgressionPanel .ProgressBarText
{
font-size: small;
height: 25%;
}

.WalkOption
{
}