﻿/* 
    CSS Styling for shared elements, may
    include web parts:    
    - Main HTML
    - Body
    - Left Column
    - Content Column
    - Top-Nav-Links
    - Footer
    - HTML Text, Elements
    - Custom Horizontal Nav Bar (Static links)    
    - Splash Imgaes Container    
    - Contact Form
    - Journey Planner Tool
    - Bus > Map Library 
    - Service Changes Display Table
    - News Repeater
    - Corporate > Have Your Say Table Styling
    - Tram Frequency Table Formats
    - Tram Times Table Formats
    - Search Results
*/
/*--------------------------------------------*/
/* Main HTML 
/*--------------------------------------------*/
html
{
    font-family: Arial, Helvetica, sans-serif;
	overflow-x:auto !important;
	overflow-y:scroll !important;
}

/*--------------------------------------------*/
/* Body, Left Column, Content Column
/*--------------------------------------------*/
body,
body.nightandday{
	width:960px;
	margin: 0 auto;
	border-left:1px solid gray;
	border-right:1px solid gray;
}
#s4-workspace{
	overflow:hidden !important;
	width:960px !important;
	height:auto !important;
	clear:both !important;
}
/* Quick Link - shift content to the right by x px */
#s4-leftpanel{
    padding-left:15px;
}
/* Body Wrapper div */
.body-wrapper{
	position: relative;
	padding: 5px;
}

/* Right-Hand side Main Content Div */
.main-content{
	float:right;
	width:660px;
}
.welcome{
    padding:0 !important;
   
}
/* User Menu on front-facing side */
#s4-user-menu-custom{
	display:none !important;
}

/*--------------------------------------------*/
/* Top-Nav-Links (TfGM Header)
/*--------------------------------------------*/
#top-nav-links{
    font-family: Arial, Helvetica, sans-serif;
    font-size:1.2em;   
    float:right;
    margin-bottom:15px;
}

/*--------------------------------------------*/
/* Footer
/*--------------------------------------------*/
#footer{
    font-family: Arial, Helvetica, sans-serif;
    font-size:1.2em;
	padding:35px 20px 50px 20px;
	clear:both;
}
#footer .copyright-message{
	float:left;
	clear:left;
}
#footer .footer-links{
	float:right;
	clear:right;
}
#footer .footer-links{
	float:right;
	clear:right;
}

/*--------------------------------------------*/
/* HTML Text, Elements.
/*--------------------------------------------*/
h1.ms-rteElement-H1,
h2.ms-rteElement-H2,
h3.ms-rteElement-H3,
h4.ms-rteElement-H4,
.ms-rteElement-P,
.ms-rtestate-field{
    font-family:Arial, Helvetica, sans-serif;
}
hr.ms-rteElement-Hr,
hr.ms-rteElement-Hr2{
	clear:both;
	float:none;
	height:1px;
	border:none;
    margin: 18px 0 18px 0 !important;	
}
.ms-rteElement-P
{
   	font-size:13px !important;
	line-height:16px !important; 
}

/*--------------------------------------------*/
/* Custom Horizontal Nav Bar  
/*--------------------------------------------*/
div#tfgm-horizontal-nav
{
	width:960px;
	height:45px;
	background-image:url('/_layouts/images/igroup.tfgm.website/navigation/nav_link.gif');
	background-repeat:repeat-x;	
	border:1px solid #999;
	margin-left:-1px;
	clear:both;
}
div#tfgm-horizontal-nav ul{
	list-style:none;
	padding:0;
	width:960px;
	margin:0;
	position:absolute;
}
div#tfgm-horizontal-nav ul li{
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	float:left;
}
div#tfgm-horizontal-nav ul li a{
	width:75px;
	height:23px;
	padding:15px 15px 8px 15px;
	text-align:center;
	float:left;
	text-decoration:none;
	color:#333;
	border-right:1px solid #999;
	word-wrap: break-word;
}
div#tfgm-horizontal-nav ul li a:hover{
	background-image:url('/_layouts/images/igroup.tfgm.website/navigation/nav_hover.gif');
	background-repeat:repeat-x;
	background-position:bottom;
}
div#tfgm-horizontal-nav ul li a:selected{
	background-image:url('/_layouts/images/igroup.tfgm.website/navigation/nav_hover.gif');
	background-repeat:repeat-x;
}
/* This fixes the line-level issues */
div#tfgm-horizontal-nav ul li a.one-line{
	padding:9px 15px 14px 15px;
}
/* Remove the last link item's border-right */
div#tfgm-horizontal-nav ul li a.last-item{
	border-right:1px solid transparent;
	width:100%;
}

/*--------------------------------------------*/
/* Home Page Layout Fix
/*--------------------------------------------*/
/* Banners - if the images are hidden in a chrome*/
.home-column-right .s4-wpTopTable .banners{
    padding-left: 19px;
}
/* Web Parts Column Sizing Fix */
.home-column-left .s4-wpcell-plain,
.home-column-right .s4-wpcell-plain{
    padding: 10px 0;
}
.home-column-left table{
    float:left;
}
.home-column-right table{
    float:right;
}
.home-column-left{
    padding:15px 0 15px 21px;
}
.home-column-right{
    margin:0;
    padding:15px 21px 15px 0;
}

/*--------------------------------------------*/
/* Splash Imgaes Container 
/*--------------------------------------------*/
#tfgm-cycle-header-image-container{
    clear:both;
    height:175px;
 	margin-top:-5px;
 	margin-left:-5px;
}
#tfgm-cycle-header-image-container img{
    display: none;
}
#tfgm-cycle-header-image-container img.first{
    display: block
}
#tfgm-fixed-header-image-container{
    clear:both;
    height:175px;
 	margin-top:-5px;
 	margin-left:-295px;
}
#tfgm-header-image-container{
    clear:both;
    height:175px;
 	margin-top:-5px;
 	margin-left:-295px;
}
#metrolink-fixed-header-image-container{
    clear:both;
    height:175px;
 	margin-top:-5px;
 	margin-left:-270px;
}

/*--------------------------------------------*/
/* Contact Forms (TfGM and Metrolink Styles)
/*--------------------------------------------*/
.tfgm-contact-form-container table{
    width:100%;
}
.tfgm-contact-form-container table tr td{
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
}
.tfgm-contact-form-container table{
    border-collapse:collapse;
    margin:5px;
}
.tfgm-contact-form-container table tr td{    
    padding: 5px;
}
.tfgm-contact-form-container .fields,
.tfgm-contact-form-container .sub-text{
    text-align:right;
}
.tfgm-contact-form-container .header{
    text-align:left;
    font-weight:bold;
}
.tfgm-contact-form-container .fields{    
    padding:10px 0;
    font-weight:bold;
}
.tfgm-contact-form-container .sub-text{
    font-style:italic;
}
.tfgm-contact-form-container .submit-button-container input:hover{
    cursor:pointer
}
.metrolink-contact-form-container{
    width:500px;
    background-color:rgb(254, 248, 214);
    border:1px solid #000;
    padding:20px;
}
.metrolink-contact-form-container .fields{
    font-family:Arial;
    font-size:9pt;
}

/*--------------------------------------------*/
/* Journey Planner Tool
/*--------------------------------------------*/
#tfgm-journey-planning-tool{
    width:100%;
}
#tfgm-journey-planning-tool table{
    border-collapse:collapse;
    margin:0 auto;
    width:630px;
}
#tfgm-journey-planning-tool table .left-column{
    width:100%;
    padding:10px 6px 10px 0px;
}
#tfgm-journey-planning-tool table .right-column{
    width:100%;
    padding:10px 0px 10px 20px;
}
#tfgm-journey-planning-tool a{
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    display:block;
    width:280px;
    padding:8px 0 8px 8px;
    margin:3px;
    text-decoration:none;
}
#tfgm-journey-planning-tool a:hover{
    display:block;
    width:280px;
    padding:8px 0 8px 8px;
    margin:3px;
    text-decoration:none;
}

/*--------------------------------------------*/
/* Bus > Map Library 
/*--------------------------------------------*/
.content_column_right{
    width:310px;
    float:right;
    height:auto;
    margin-bottom:20px;
    line-height:22px;
}
.content_column_left{
    width:310px;
    float:left;
    height:auto;
    margin-bottom:20px;
    line-height:22px;
}

/*--------------------------------------------*/
/* Tram Times Table Formats
/*--------------------------------------------*/
.TTtable td{
    font-weight:bold;
    font-size:11px;
    font-family:Arial, Helvetica, sans-serif !important;
    border-spacing:0px;
    border-collapse:separate;
}
.tdWidth{
    width:60px;
    height:20px;
    padding:2px;
    vertical-align:middle;
}
/* Top left cell */
.TTtable td.TTToStyle{
    width:150px;
    text-align:center;
}
.TTStationName{
    text-indent:10px;
}
.TTTopField{
    text-indent:10px;
}
.TTFirstLastStyle{
    text-align:center;
}
/* Time fields */
.TTTimefield{
	text-indent:10px;
}

/*--------------------------------------------*/
/* Tram Frequency Table Formats
/*--------------------------------------------*/
table#tramFrequencies{
    color:#ccc;
    font-family:Arial, Helvetica, sans-serif !important;
	font-size:1.1em;
	font-weight:bold;
	text-align:center;
	vertical-align:top;
	border-collapse:separate;
	border-spacing:2px;
}
.yellowCell{
	text-align:center;
}
.ltYellowCell{

	text-align:center;
	font-weight:bold;
	padding:5px;
}
.greyCell{
	line-height:1.4em;
	text-align:center;
	font-weight:bold;
}

/*--------------------------------------------*/
/* Corporate > Have Your Say Table Styling
/*--------------------------------------------*/
.mytable{
	border-collapse:collapse;
	width:100%;
}
.table_headers{
   	font-weight:bold;
}
.mytable td
{
    padding:7px;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:13px !important;
}

/*--------------------------------------------*/
/* Generic News Feed Repeater
/*--------------------------------------------*/
.metrolink-news-feed{
    font-family:Arial;
    font-size:12px;
}
.metrolink-news-feed ul{
    margin:0 0 10px -30px;
}
.metrolink-news-feed ul li{
    list-style:none;
    line-height:16px !important;
}
.metrolink-news-feed ul li a{
    text-decoration:none !important;
}
.metrolink-news-feed .news_date{
	float:right;
}
.metrolink-news-feed p.ms-rteElement-P{
	margin:0 0 3px 0 !important;
}
.metrolink-news-feed div[class ^= "ExternalClass"]{
	line-height:24px;
}

/*--------------------------------------------*/
/* Service Changes Display Table
/*--------------------------------------------*/
#tfgm-service-changes-table{
	width:640px;
	border:1px solid #9D9FA1;
	border-spacing:0;
	font-family:arial;
	color:#333;
}
			
/* All table cells */
#tfgm-service-changes-table tr td{
	font-size: 13px;
	padding: 7px;
	border-bottom:1px solid #EFEFEF;
}
			
/* table header */
#tfgm-service-changes-table .table-header td{
	background-color:#FAFAFA;
	border-bottom:1px solid #ccc;
	font-weight:bold;
}
			
#tfgm-service-changes-table .col-service,
#tfgm-service-changes-table .col-date{
	width:50px;
	border-right:1px solid #9D9FA1;
}

#tfgm-service-changes-table .end-note{
	border-bottom:1px solid #9d9fa1;
}

/*--------------------------------------------*/
/* Coporate Library - Leaflet CSS
/*--------------------------------------------*/
.leaflet_description
{
    float:right;
    width:83%;
    line-height:25px;
}

/*--------------------------------------------*/
/* Search Results
/*--------------------------------------------*/
/* Outer Wrapper */
.srch-results
{
    font-family:Arial, Helvetica, sans-serif !important;
}
/* End of search result item */
.srch-results .srch-Metadata1
{
    padding-bottom:25px;
    border-bottom:1px solid #892890;
}
/* Metadata Text Color */
.srch-results .srch-Metadata2, 
.srch-results .srch-Metadata1 span
{
    color:#AAA !important;
}

/*--------------------------------------------*/
/* Misc Helper Classes
/*--------------------------------------------*/
.hide{
    display:none !important;
}

/*--------------------------------------------*/
/* Station Info
/*--------------------------------------------*/
#stationMatrix{
    width:100%;
}

#stationMatrix table{
    border-collapse:collapse;
	font-size: 13px;
}

#stationMatrix table thead tr th,#stationMatrix table tr th{
	text-align: center;
	background-color: #B8B7AD;
}

#stationMatrix table th, #stationMatrix table td{
    border:1px solid #fff;
    padding:3px;
    text-align:left;
}

#stationMatrix table td{
    text-align:center;
	background-color: #eee;
	font-size:23px;
}

#stationMatrix .altrinchamToCornbrook{
    background-color: #ffdb4f;
}

#stationMatrix .buryToWoodlandsRoad{
    background-color: #44c8f5;
}

#stationMatrix .ecclesToPomona{
	background-color: #f287b7;
}

#stationMatrix .firswoodToStWerburghsRoad{
	background-color: #9853a1;
}

#stationMatrix .deansgateCastefieldToVictoria{
	background-color: #d9d9d9;
}

#stationMatrix .CentralParkToStWerburghsRoad{
	background-color: #e7f4d4;
}

#stationMatrix table td a.infoHover
{
    vertical-align:middle; 
    display:inline-block; 
    width:11px; 
    height:10px; 
    vertical-align:middle; 
    background:url('/_layouts/images/igroup.tfgm.website/icons/info-hover-icon.gif'); 
    margin-bottom:3px; 
    margin-left:2px; 
    cursor:pointer;
}

#WebPartWPQ6 .link-item {
	font-size:16px; color:black; font-family:Arial, Helvetica, sans-serif; font-weight:bold;
}

#WebPartWPQ6 .description {
	 font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:normal; line-height: 1.2em;
}

#WebPartWPQ6 .description a {
	 font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:normal;
}