﻿*{
  margin:0;
  padding:0;
  border-width:0;
}

body {
  font-family: Tahoma, 'Trebuchet MS' , Verdana, Arial, 'Sans-Serif';
/*  font-family:Verdana, Tahoma, "Sans-Serif"; */
	text-align:center;/*required for centering workspace*/
  font-size:12pt;
 /* font-face: Tahoma, 'Trebuchet MS' , Verdana, Arial, Sans-Serif; */

}

#workspace {
	width:1024px;
	height:608px;
	margin-right:auto;/*required for centering workspace*/
	margin-left:auto; /*required for centering workspace*/
	margin-top:0px;
	padding:0px;
	text-align:left;
	background-color:#F0F0F0;
	position:relative;
}

#links {
	width:600px;
	float:left
	margin-top:30px;
	padding:30px;
	text-align:left;
	font-size: 10pt;
	
}


#header
{
  height:80px;
}

#leftbanner
{
  /*standard half banner size in header*/
  float:left;
  width:234px;
  height:60px;
  margin-left:8px;
  margin-top:10px;
}

#rightbanner
{
  /*bd logo is not normal size*/
  float:right;
  /*width:468px;
  height:60px;*/
  width:249px;
  height:38px;
  margin-right:8px;
  /*margin-top:10px;*/
  margin-top:21px;
}

#wizard, #journey, #map
{
  top:0px;
}

#wizard
{
  position:absolute;
  left:3px;
  background-color:#FFF;
  border:1px dotted black;
  width:280px;
  height:500px;
  overflow:auto;
}

#journey
{
  position:absolute;
  left:291px;
  background-color:#FFF;
  border:1px dotted black;
  width:94px;
  height:500px;
}

#map
{
  position:absolute;
  left:393px;
  background-color:#F2EFE9;
  border:1px solid black;
  width:500px;
  height:500px;
  /*float:left; /*causes problems with positioning contents */
  /*margin-left:8px; 10 with 1px border*/
  overflow:hidden; 
}

.controlBox {
             position:absolute;
             left:2px;
             top:2px;
             background-color:#a6a0cc;
             border:1px solid black;
             width:54px;
             opacity:0.5;
             filter:alpha(opacity=50); 
             z-index:1000;
             cursor:default;
            }

.controlBox td
  {
/*    background-color:white; */
/*    opacity:0.6; */
  }

#layers
{
  /*layers control (over map), rather than layers themselves*/
  position:absolute; /*required for bottom anchored positioning relative to map */
  background-color:#a6a0cc;
  border:1px solid black;
  width:130px;
  /*height:100px;*/
  left:2px;
  top:auto;
  bottom :2px;
  z-index:1000;/*Must be on top of the map rasters (.divBackground) */
  visibility:visible; 
  filter:alpha(opacity=50); 
  opacity:0.8;
  padding:5px;
  cursor:default;
}

.layerControlName
{
  font-size:10pt;
  color:#fff;
}


#footer
{
  position:absolute;
  top: 584px;
  width:100%;
  height:20px;
}

#status, #status2
{
  /*under left side of map*/
  font-size:8pt;
  float:left;
  margin-right:8px;
  margin-left:516px;
}

#copy
{
  font-size:8pt;
  float:right;
  margin-right:8px;
  margin-left:20px;
}


.imgBackground
{
  border:0px;
  margin:0px;
  padding:0px;
}

.divBackground
{
  z-index:10;/*Must be ontop of the page and behind maplayers control*/
/*  border : black 1px solid;  /* useful for diagnostics */
}

.maplayer, .mapPointLayer
{
  position:absolute;
  left:0px;
  top:0px;
//  width:100%;
//  height:100%;
}

.maplayer {visibility:visible; z-index:898;} /* Ontop of background and behind layer control */
.mapPointLayer
{
  visibility:visible; 
  overflow:'visible'; 
  z-index:900;
} /* same as dragger to capture mouseovers */

#tileParent
{
  visibility:visible;
/*  background-color:white; */
  width:100%;
  height:100%;
/*  opacity : 1;              /*As we need a background but don't want to see it*/
/*  filter:alpha(opacity=100);  /*As we need a background but don't want to see it*/
/*  z-index:20; */
}

#dragger
{
  position:absolute;/*required for z-index*/
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  visibility:visible;
  z-index:899;              /*Must be on top of everything (except controlBox) to capture map mouse events*/
  background-color:white;   /*Without a background IE doesn't raise mouse events?*/
  opacity : 0;              /*As we need a background but don't want to see it*/
  filter:alpha(opacity=0);  /*As we need a background but don't want to see it*/
  /*border:2px dashed red;*/
  cursor:pointer;
}

#layerParent
{
  visibility:visible;
  background-color:none;
  width:100%;
  height:100%;
  opacity : 1;              /*As we need a background but don't want to see it*/
  filter:alpha(opacity=100);  /*As we need a background but don't want to see it*/
/*  z-index:901; */
}

#versioninfo
{
  text-align:left;
  font-family:Tahoma;
  font-size:10pt;
}

/*
journey Summary
*/

ul.journeySummary
{
  list-style-type: none;
}

ul.journeySummary li
{
  padding-right: 2px;
  padding-left: 2px;
 
}

li div
{
  background-position: left center;
  background-attachment: scroll;
  background-repeat: no-repeat;
 
  width: 40px;
  height: 40px;
  padding-left: 2px;

}

li div img
{
  margin-left:50px;
}

li div div
{
  margin-left: -5px;
  padding-right: 2px;
  font-size: x-small;
  line-height:40px;
  vertical-align: middle;
  text-align: center;
  width: 100%;
  height: 100%;
}

li div.startLocation
{
 
  background-image: url(../images/JourneySummary/TopEmptyRing.png);
 
}

li div.startLocationH
{

  background-image: url(../images/JourneySummary/TopRingHighlight.png);

}

li div.endLocation
{

  background-image: url(../images/JourneySummary/BottomEmptyRing.png);

}

li div.endLocationH
{

  background-image: url(../images/JourneySummary/BottomRingHighlight.png);

}

li div.innerLocation
{
  background-image: url(../images/JourneySummary/InnerRing.png);

}

li div.innerLocationH
{
  background-image: url(../images/JourneySummary/InnerRingHighlight.png);
}

li div.journeyBar
{
  background-image: url(../images/JourneySummary/FullBar.png);
}

li div.journeyBarH
{
  background-image: url(../images/JourneySummary/FullBarHighlight.png);
}

