body, p
{	
	font-size:18px;
	color:#000000;
}
#secondPageContent div, #RouteCard ul, #RouteCard ol, #RouteCard li, #RouteCard p, #RouteCard th, #RouteCard td
{	
	font-size:18px;
	color:#000000;
}

@media all
{
	.page-break
	{		
		margin-bottom:20px;
	}
}

@media print
{
	.page-break
	{
		display: block;
		clear: both;		
	}
	#printButton
	{
		display: none;
	}
	#firstPageContent, #secondPageContent
	{
		margin-top: 0px;
	}
}

@media screen
{
	#RouteCard
	{
		padding: 10px;
	}
	#firstPageContent, #secondPageContent
	{
		/*border: 3px dashed silver;
		margin-top: 50px;*/
	}
	#printButton
	{
	    position:absolute;
	    left:750px;
	    top:10px;
	    z-index:10;
	}
}

.page-break
{
    display: block;
    clear: both;
    page-break-after: always;  
}

/*------------------*/
/* first/title page */
#titlePageContent
{
	width: 850px;	
}
#routeCardTitle
{
	width: 830px; 
	height: 160px;
	background-color: White;		
	padding: 10px; 
	color: #00734A;	
}
#routeCardLogo
{
    background-color:transparent;
    background-image:url('gwkw/GWKW-Logo-round.png');
    background-repeat:no-repeat;
    width:165px;
    height:165px;
    float:right;
    margin-right:10px;  
}
#routeCardTitleText
{	
	width: 600px;
}
#routeCardTitleText .routename
{
    font-size: 30px; 
    font-weight: bold;   
    color: #00734A;		
}
#routeCardTitleText .startlocation
{
    font-size: 20px; 
    font-weight: bold; 
    padding-top:20px;   
    color: Black;	
}
#routeCardTitleText .timerequired
{
    font-size: 20px; 
    font-weight: bold; 
    padding-top:20px;  
    color: Black;	
}
#titlePageDetails
{
	/*width: 850px;*/
	padding: 10px;
}
#titlePageDetails .routeid
{
    font-size: 18px;
    color:#000000;
    border:1px dashed #666;
    padding-top:10px;
    padding-bottom:10px;
    border-right:none;
    border-left:none;
}
#titlePageDetails .developedby, #titlePageDetails .checkedby
{
    font-style: italic;    
    font-size: 18px;
}
#titlePageDetails .titleurl
{
    font-size: 18px;
}
#titlePageDetails .routesummary
{
    font-size: 20px; 
    font-weight: bold; 
    padding-top: 20px;
    color:#000000;
}

.routeCardMap
{
	height: 760px;
    width : 850px;   
}
#mapLegend
{
	width: 800px;
	height: 30px;
	margin: 10px;
	text-align: center;
	vertical-align: middle;
}
#mapLegend span
{
	margin-right: 20px;
}
#routelegend, #altroutelegend, #poilegend, #waypointlegend
{
    /*border:1px solid red;*/
    background-color:transparent;
    background-image:url('../images/route.jpg');
    background-position: left center;
    background-repeat:no-repeat;
    padding-left:26px;
    padding-top:7px;
    width:100px;
    height:22px; 
    text-align:left;
    float:left;  
       font-size:14px !important;
}
#routelegend
{
    margin-left:150px; 
}
#altroutelegend
{    
    background-image:url('../images/alternative-route.jpg');    
    width:130px;    
}
#poilegend
{
    background-image:url('../images/poi.jpg');  
    width:120px;  
}
#waypointlegend
{    
    background-image:url('../images/waypoint.jpg');    
    width:100px;   
}
#footerFirstPage
{	
	width: 850px;
	border-top: 2px solid black;
	/*need to set the height otherwise the footer gets chopped when converting to pdf */
	height:75px;
}
#footerFirstPage .leftDiv
{
    width: 560px;  
    float:left;  
}
#footerFirstPage .leftDiv P
{
    line-height: 1.2;   
    font-size: 14px;   
}
#footerFirstPage .rightDiv
{
    margin-left: 560px;     
}
#footerImg1
{	
	padding:10px 10px;
	width:56px;
	height:61px;
	background: url('../images/logo_ramblers_small.png') no-repeat center center;   	
	float:left
}
/*#footerImg2
{	
    padding:10px 10px;
	width:72px;
	height:57px;
	background:url('../images/logo_ramblers_charity.png') no-repeat center center; 
	  
	float:left
}*/
#footerImg2
{
    display:none;
}

#footerImg3
{	
}		
#footerImg4
{	
  /*  padding:10px 5px;
	width:139px;
	height:60px;
	background:url('swindon/swindon_borough_council.png') no-repeat center center;    
	float:left */
}	

/* map legend */
.layersDiv SPAN, .layersDiv DIV, .baseLbl DIV, .dataLbl DIV
{
    color:White !important;
    font-size:12px !important;
}
/* END first/title page */
/*----------------------*/


#secondPageContent 
{	
	width: 850px;
	padding-left:4px;
}

#routePhotos
{
}
#routePhotos .photoTBL
{
    margin:20px auto 20px auto;
    width:700px
}
#routePhotos .caption
{
    font-size:14px;
}
#routePhotos .originator
{
    font-size:10px;
}

#RouteCard
{
	
}

/*
#secondPageContent - structure

		<div class="item_container">
			<span class="item_label">Starts at: </span>
			<div class="item_value">
				<xsl:value-of select="@StartLocationLong" />
			</div>
		</div>
*/

#secondPageContent .item_container
{    
    margin-top: 20px;    
}
#secondPageContent .item_label
{    
    font-weight:bold;  
    font-size: 18px; 
    text-decoration:underline;
}
#secondPageContent .item_value
{     
    margin-top:4px;
    margin-left:6px
}

#RouteCard ul, #RouteCard ol
{
	margin-left: 20px;
	list-style-position: inside;
	margin: 10px 0;
}
#RouteCard p
{
	line-height: 1.5em;
	margin-bottom: 10px;
}