/* ------------FONTS-----------------------------------  */

@font-face {
	font-family: Basictext;
	src: url('Blogger_Sans-Light.otf');
}



/* ------------General Definitions-----------------------------------  */
BODY	{
	background:#E4E4DE;
        font-family: Basictext, Helvetica, sans-serif;
	font-size: 12pt;
	color: #555555;
	font-weight: normal;
	text-decoration: none;
        margin: 0px;
        padding: 0px;
        border: 0px;
	}

* {box-sizing: border-box;}

}


/* ------------Timetable Blocks-----------------------------------  */

P.bookingdotcomtext {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 20pt;
	color: #555555;
}


TD.headertext	{
        font-family: Basictext, Delicious, Helvetica, sans-serif;
	font-size: 14pt;
	color: #eeeeee;
	font-weight: normal;
	text-decoration: none;
	}

TD.headertextbig	{
                font-family: Basictext, Delicious, Helvetica, sans-serif;
	font-size: 24pt;
	color: #eeeeee;
	font-weight: normal;
	text-decoration: none;
        text-shadow: 2px 2px 2px #666666 ;
	}

A 	{
	color: #555555;
	text-decoration: none;
	}


A.headeremail    {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 10pt;
	color: #eeeeee;
	font-weight: normal;
	text-decoration: underline;
	}


A.visited	{
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 10pt;
	color: #555555;
	font-weight: normal;
	text-decoration: underline;
	}

A.active	{
	color: #555555;
	text-decoration: underline;
	}

A.hover	{
	color: #555555;
	text-decoration: underline;
	}

A.stationnamelink	{
                font-family: Helvetica, sans-serif;
	font-size: 9pt;
	color: #555555;
	font-weight: normal;
	text-decoration: none;
	}

A.headertextlinks	{
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 9pt;
	color: #eeeeee;
	font-weight: normal;
	text-decoration: underline;
	}

H2	{
	font-family: Basictext, Delicious, Helvetica, sans-serif;
	font-size: 18pt;
	font-style: normal;
	font-weight: normal;
	color: #224455;
	padding-top: 0mm;
	padding-bottom: 0mm;
        text-shadow: 2px 2px 2px #BBBBBB ;

	}

H3	{
	font-family: Helvetica, sans-serif;
	font-size: 14pt;
	font-style: normal;
	font-weight: normal;
	color: #224455;
	padding-top: 0mm;
	padding-bottom: 0mm;
	}

H1	{
	font-family: Helvetica, sans-serif;
	font-size: 24pt;
	font-style: normal;
	font-weight: normal;
	color: #224455;
	padding-top: 0mm;
	padding-bottom: 0mm;
	}

H4	{
	font-family: Helvetica, sans-serif;
	font-size: 18pt;
	font-style: normal;
	font-weight: normal;
	color: #FFFF44;
	padding-top: 0mm;
	padding-bottom: 0mm;
	}


TABLE.stationnameboard  {
                  align: center;
                  border-width: 0px;
                  border-spacing: 0px;
                  border-collapse:separate;
                  margin: 0px;
                  padding: 0px;
	}


.stationnameboard  TR { height: 50px; background-color:  #111111; opacity: 0.8;}

.stationnameboard  TD {
        font-family: Basictext;
	font-size: 24pt;
	color: #f2f2f2;
	font-weight: normal;
	text-decoration: none;
                text-align: center;
                padding-left: 150px;
                padding-right: 150px;
                border-radius: 5px;
}

TABLE.fullscreen  {
               width: 100%;
                 }

TABLE.disclaimer  {
                  width: 50%;
                  align: center;
                  border-width: 0px;
                  border-spacing: 0px;
                  border-collapse:separate;
                  margin: 0px;
                  padding: 30px;
	}

.disclaimer TD {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 8pt;
	color: #777777;
	font-weight: normal;
	text-decoration: none;
                text-align: justify;
}

.disclaimer A {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 8pt;
	color: #777777;
	font-weight: normal;
	text-decoration: underline;
                text-align: justify;
}

.disclaimer A:hover {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 8pt;
	color: #ff7777;
	font-weight: normal;
	text-decoration: underline;
                text-align: justify;
}


TD.copyright {
                font-family: Basictext, Helvetica, sans-serif;
	font-size: 8pt;
	color: #777777;
	font-weight: normal;
	text-decoration: none;
                text-align: justify;
}



TABLE.vmenu  {
                  width: 160px;
                  align: left;
                  text-align: left;
                  border-width: 0px;
                  border-spacing: 0px;
                  border-collapse:separate;
                  margin: 0px;
                  padding: 0px;
	}

.vmenu TR { height: 40px; background-color:  #cccccc;}

.vmenu A:link {
                   padding-left: 5px;
                   padding-right: 0px;
                   color: #eeeeee;
                   text-decoration: none;
}

.vmenu A:visited { color: #eeeeee; }
.vmenu A:active { color: #eeeeee; }



TR.brighter  { background-color:  #2288aa; }

TR.vmenuseparator { height: 10px; background-color:  #cccccc; }

TD.vmenuheader { height: 80px; background-color:  #cccccc; vertical-align: top; }

.vmenuseparator TD { height: 1px;  }

/* ------------NAVIGATION STYLE-------------------------------  */


/* -----------End of Nav Style----------------------------  */

TR.spacerrow  {
	background-color:  #EEEEEE;
                height: 20px;
                width: 100%;
                   padding-left: 0px;
                   padding-right: 0px;
	}


/* ------------TABLE STYLES-------------------------------  */
/* ------------TABLE TYPE A -- List of services to a station-------------------------------  */

.tabletypeA {
                  border-width: 0px;
                  border-spacing: 0px;
                  border-collapse: collapse;
                  margin: 0px;
                  padding: 0px;
                  box-shadow:0px 0px 9px #999999;
                  border-radius: 5px; 
                  overflow: hidden;
                  margin-bottom: 10px;
                  font-family: Helvetica, sans-serif;
                  font-size: 10pt;
                  font-style: normal;
                  font-weight: normal;
                  color: #FFFFFF;
}

.tabletypeA .headerrow {
	          background-color:  #2288AA;
                  height: 30px;
                  color: #EEEEEE;
                  font-style: italic;
                  font-weight: bold;
}

.tabletypeA .oddnumberedrow {
	          background-color:  #FFFFFF;
}

.tabletypeA .evennumberedrow {
	          background-color:  #EEEEEE;
}

.tabletypeA TD {
                  text-align: center;
                  vertical-align: middle;
                  white-space: nowrap;
                  border-right-width: 2px;
                  border-bottom-width: 1px;
                  border-right-color: #F6F6F6;
                  border-bottom-color: #F6F6F6;
                  border-bottom-style: solid;
                  border-right-style: solid;
                  padding-left: 10px;
                  padding-right: 10px;
                  transition-property: background-color color;
                  transition-duration: 0.7s;
                  transition-timing-function: linear;
                  transition-delay: 0.3s;
}

.tabletypeA img {
                  vertical-align: middle;
}

.tabletypeA A {
                  text-decoration: none;
                  display: block;
                  transition-property: all;
                  transition-duration: 0.7s;
                  transition-timing-function: linear;
                  transition-delay: 0.3s;
}

.tabletypeA A:hover {
                  color: #eeeeee;
                  font-style: italic;
}

.tabletypeA TD:hover { 
                    background-color: #AAAAAA;  
                    color: #eeeeee;
}

/* ------------TABLE TYPE A -- end----------------------------  */

/* ------------TABLE TYPE B -- Timetable-------------------------------  */

.tabletypeB , .tabletypetrain , .tabletypebus , .tabletypetram , .tabletypeferry {
                  border-width: 0px;
                  border-spacing: 0px;
                  cellspacing: 2px;
                  margin: 0px;
                  padding: 0px;
                  box-shadow:0px 0px 9px #999999;
                  border-radius: 5px; 
                  margin-bottom: 5px;
                  margin-right: 15px;
                  font-family: Helvetica, sans-serif;
                  font-size: 9pt;
                  font-style: normal;
                  font-weight: normal;
                  overflow:hidden;
                  table-layout: fixed;
}

.tabletypetrain , .trainoverridecell  { color: #885588; }
.tabletypebus  , .busoverridecell  { color: #EE6666; }
.tabletypetram  , .tramoverridecell  { color: #228822; }
.tabletypeferry  , .ferryoverridecell  { color: #6666CC; }

.headerrow {
	          background-color:  #707070;
                  max-height: 40px;
                  color: #EEEEEE;
                  user-select: none;
                 -webkit-user-select: none; 
                 -ms-user-select: none;
                 -moz-user-select: none;
                 cursor: move;
}


.evennumberedrow , .oddnumberedrow {
	          background-color:  #EEEEF3;
                  transition-property: all;
                  transition-duration: 0.2s;
                  transition-timing-function: linear;
                  transition-delay: 0.0s;
                  height:40px;
}

.oddnumberedrow {
	          background-color:  #FFFFFF;
}

.headerrow TD
{
                   width: 40px;
                   white-space: normal;
}


.evennumberedrow > TD, .oddnumberedrow > TD  {
                  height: 25px;
                  text-align: right;
                  white-space: nowrap;
                  vertical-align: middle;
                  border-right-width: 1px;
                  border-bottom-width: 1px;
                  border-right-color: #cccccc;
                  border-bottom-color: #E6E6E6;
                  border-bottom-style: solid;
                  border-right-style: solid;
                  padding-left: 1px;
                  padding-right: 3px;
                  max-width: 250px;
                  overflow: hidden;
                  user-select: none;
                 -webkit-user-select: none; 
                 -ms-user-select: none;
                 -moz-user-select: none;
                 cursor: move;

}

.evennumberedrow TD:empty , .oddnumberedrow TD:empty  {
                 box-shadow: none;
                 padding: 0px;
}


.stopname A , .modenamecell A {
                  display: block;
                  font-family: Basictext, Helvetica, sans-serif;
                  color: #333333;
                  font-size: 14px;
                  text-align: left;
                  text-shadow: 1px 1px #dddddd;
                  vertical-align: middle;
                  padding-left: 5px;
                  padding-right:4px;
                  height: 40px;
                  min-height:100%;
                  width: 100%;
                  min-width: 100px;

                  min-height: 23px;
                  background: #C0BAC0;
                  margin: 0px;
                  border: 0px;
                  border-bottom-style: solid;
                  border-bottom-width: 1px;
                  border-bottom-color: #666666;
                  border-right-style: solid;
                  border-right-width: 1px;
                  border-right-color: #666666;
                  border-radius: 2px;
                  overflow:hidden;
}

.modenamecell A {
                  min-width: 0px;
}

@media screen and (min-width: 700px) {
         .stopname A  {max-width: 280px;}
}


.stop_number {
                  font-family: Basictext, Helvetica, sans-serif;
                  color: #AAAAAA;
                  font-size: 14px;
                  text-align: center;
                  vertical-align: baseline;
                  padding-left: 2px;
                  height: 100%;
                  width: 100%;
                  margin: 0px;
                  background: #EEEEEE;
                  border-style: solid;
                  border-width: 1px;
                  border-color: #AAAAAA;
                  border-radius: 30%;

 display:block; min-width: 0px;}

.stop_number:empty {display:none;}

.stopname A:hover , .modenamecell A:hover {
                  background: #BB2222;
                  color: #dddddd;
                  text-shadow: 1px 1px #444444;
}

.rotate180 {
                  font-size: 14pt;
                  transform: rotate(180deg);
                  text-align: left;
}

/* ------------TABLE TYPE B -- end----------------------------  */


TABLE.tableoftimes {
	 background-color:  #FFFFFF;
                  border-width: 0px;
                  border-spacing: 0px;
                  border-collapse: collapse;
                  margin: 0px;
                  padding: 0px;
                  box-shadow:5px 5px 5px #999999; 
                  border-radius: 5px; 
                  overflow: hidden;
                  margin-bottom: 20px;
	}

.tableoftimes TD {
                   padding-left: 4px;
                   padding-right: 4px;
                   border-spacing: 0px;
                   white-space: nowrap;
                   color: #666666;
                   font-family: Helvetica, sans-serif;
                   font-size: 19pt;
                   font-style: normal;
                   font-weight: normal;}

TR.initialodd { background-color: #F1F1F1; color:#000000; 
   transition-property: background-color color;
   transition-duration: 0.4s;
   transition-timing-function: linear;
   transition-delay: 0.1s;}
TR.initialeven { background-color: #FFFFFF; color:#000000; 
   transition-property: background-color color;
   transition-duration: 0.4s;
   transition-timing-function: linear;
   transition-delay: 0.1s;}
TR.normalodd { background-color: #F1F1F1; transition: background-color 0.5s ; }
TR.normaleven { background-color: #FFFFFF; transition: background-color 0.5s ; }
TR.highlight { background-color: #ccccee; color:#0000AA; }
.initialodd:hover  { background-color: #ccccee; color:#0000AA; }
.initialeven:hover  { background-color: #ccccee; color:#0000AA; }
.normalodd:hover  { background-color: #ccccee; color:#0000AA; }
.normaleven:hover  { background-color: #ccccee; color:#0000AA; }

TD.pageheader { text-align: left;
                padding-left: 25px;
                padding-right: 15px;
	font-family: Basictext, Helvetica, sans-serif;
	font-size: 24pt;
	font-style: normal;
	font-weight: normal;
        color: rgba(255, 255, 255, 0.7);
        text-shadow: 2px 2px 2px #222222 ;
	padding-top: 5mm;
	padding-bottom: 0mm;
	}

TD.timetable {padding-left: 4px;
                   padding-right: 4px;
                   color: #666666;
                   font-family: Basictext, Helvetica, sans-serif;
                   font-size: 9pt;
                   font-style: normal;
                   font-weight: normal;
                   text-align: center;
                   vertical-align: bottom;
                   white-space: nowrap;
                      border-top-style: none;
                      border-right-style: solid;
                      border-bottom-style: none;
                      border-left-style: none;
                   border-right-width: 1px;
                   border-right-color: #DDDDDD;
                   transition-property: background-color color;
                   transition-duration: 0.3s;
                   transition-timing-function: linear;
                   transition-delay: 0.1s;}

.timetable A  {padding-left: 3px;
                   padding-right: 3px;
                   color: #000000;
                   font-family: Basictext, Helvetica, sans-serif;
                   font-size: 9pt;
                   font-style: normal;
                   font-weight: normal;
                   text-align: center;
                   white-space: nowrap;
                      border-top-style: none;
                      border-right-style: none;
                      border-bottom-style: none;
                      border-left-style: none;
                   border-right-width: 1px;
                   border-right-color: #DDDDDD;
                    text-decoration: none;
                    display: block;
                    transition-property: background-color color;
                    transition-duration: 0.3s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

.timetable A:hover {padding-left: 3px;
                    padding-right: 3px;
                    font-family: Basictext, Helvetica, sans-serif;
                    font-size: 9pt;
                    color: #DDDDDD;
                    font-style: normal;
                    font-weight: normal;
                    text-align: center;
                    text-decoration: none;
                    white-space: nowrap;
                    transition-property: background-color color;
                    transition-duration: 0.3s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

.timetable:hover { background-color: #8888dd;  color: #eeeeee;}

TD.bustimetable {padding-left: 4px;
                   padding-right: 4px;
                   color: #FF7777;
                   font-family: Helvetica, sans-serif;
                   font-size: 9pt;
                   font-style: normal;
                      border-top-style: none;
                      border-right-style: solid;
                      border-bottom-style: none;
                      border-left-style: none;
                   border-right-width: 1px;
                   border-right-color: #DDDDDD;
                   white-space: nowrap;
                   font-weight: normal;}

TD.logocell {padding-left: 0px;
                   padding-right: 0px;}

.logocell A {padding-left: 0px;
                    padding-right: 0px;
                    color: #666666;
                    font-family: Helvetica, sans-serif;
                    font-size: 9pt;
                    font-style: normal;
                    font-weight: normal;
                    text-align: left;
                    text-decoration: none;
                    display: block;
                    white-space: nowrap;
                    transition-property: background-color color;
                    transition-duration: 0.4s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

.logocell A:hover { color: #eeeeee;
                    font-family: Helvetica, sans-serif;
                    font-size: 9pt;
                    font-style: normal;
                    font-weight: normal;
                    text-align: left;
                    text-decoration: none;
                    display: block;
                    white-space: nowrap;
                    transition-property: background-color color;
                    transition-duration: 0.4s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

TD.stationname {padding-left: 0px;
                   padding-right: 0px;
                   color: #666666;
                   font-family: Basictext, Helvetica, sans-serif;
                   font-size: 9pt;
                   font-style: normal;
                   font-weight: normal;
                   text-align: left;
                   vertical-align: bottom;
                   white-space: nowrap;
                   transition-property: background-color color;
                   transition-duration: 0.4s;
                   transition-timing-function: linear;
                   transition-delay: 0.1s;}

.stationname A {padding-left: 0px;
                    padding-right: 0px;
                    color: #666666;
                    font-family: Basictext, Helvetica, sans-serif;
                    font-size: 9pt;
                    font-style: normal;
                    font-weight: normal;
                    text-align: left;
                    vertical-align: bottom;
                    text-decoration: none;
                    display: block;
                    white-space: nowrap;
                    transition-property: background-color color;
                    transition-duration: 0.4s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

.stationname A:hover {padding-left: 0px;
                    padding-right: 0px;
                    color: #eeeeee;
                    font-family: Basictext, Helvetica, sans-serif;
                    font-size: 9pt;
                    font-style: normal;
                    font-weight: bold;
                    text-align: left;
                    vertical-align: bottom;
                    text-decoration: none;
                    white-space: nowrap;
                    transition-property: background-color color;
                    transition-duration: 0.4s;
                    transition-timing-function: linear;
                    transition-delay: 0.1s;}

.stationname:hover { background-color: #8888dd;  color: #eeeeee;}

TD.daysrun  {padding-left: 4px;
                     padding-right: 4px;
                     height: 21px;
                     background: #444444;
                     color: #eeeeee;
                     text-align: center;
                     font-family: Helvetica, sans-serif;
                     font-size: 9pt;
                     font-style: normal;
                     white-space: nowrap;
                      border-top-style: none;
                      border-right-style: solid;
                      border-bottom-style: none;
                      border-left-style: none;
                     border-right-width: 1px;
                     border-right-color: #DDDDDD;
                     font-weight: normal;}

TD.divider   {background-color: #DDDDDD;
                     padding-left: 0px;
                     padding-right: 0px;
                     width: 1px;}

TD.emptycell        {width: 0px;}
TD.emptyheader   {width: 0px;}



TABLE.timetablenotes  { border: 0px;  }

      .timetablenotes td  {    padding-left: 0px;
                   padding-right: 0px;
                   color: #666666;
                   font-family: Helvetica, sans-serif;
                   font-size: 9pt;
                   text-decoration: none;
                   text-align: left;
                   font-weight: normal;}

      .timetablenotes  a   { color: #666666; text-decoration: underline;  font-family: Helvetica, sans-serif;}

      .timetablenotes  a:hover   {color: #ff0000;   font-family: Helvetica, sans-serif;}

TD.lastcheckeddate  {    padding-left: 0px;
                   padding-right: 0px;
                   color: #666666;
                   font-family: Helvetica, sans-serif;
                   font-size: 9pt;
                   text-decoration: none;
                   text-align: right;
                   font-weight: normal;}


TD.bigtime	{
	font-family: Helvetica, sans-serif;
	font-size: 14pt;
	font-style: normal;
	font-weight: normal;
	color: #444444;
	background: url(backshade.gif);
	padding-top: 1mm;
	padding-bottom: 1mm;
	padding-left: 3mm;
	padding-right: 3mm;
                white-space:nowrap

	}

TD.normtime	{
	font-family: Helvetica, sans-serif;
	font-size: 10pt;
	font-style: normal;
	font-weight: normal;
	color: #444444;
	background: url(backshade.gif);
	padding-top: 1mm;
	padding-bottom: 1mm;
	padding-left: 2mm;
	padding-right: 2mm;
                white-space:nowrap

	}

TD.journeydescription	{
	font-family: Helvetica, sans-serif;
	font-size: 10pt;
	font-style: normal;
	font-weight: normal;
	color: #225555;
	padding-top: 2mm;
	padding-bottom: 2mm;
	padding-left: 3mm;
	padding-right: 3mm;
        text-align: justify;

	}


TD.pgheader {padding-left: 3px;
                   padding-right: 3px;
                   color: #555555;
                   font-family: Helvetica, sans-serif;
                   font-size: 18pt;
                   font-style: normal;
                   font-weight: normal;
                   text-shadow: 2px 2px 0px #000000 ;
}

.PHONESQUARE {width:130px; margin:6px; white-space:normal; text-align:left; padding:3px; border-radius:5px; float:left; background:#FFFFFF; border-style: solid; border-width: thin; border-color: #CCCCCC;
}

.PHONENUMBER {font-size: 20px; color: #BB1111;}

.ROUTELINKSQUARE {margin:4px; white-space:normal; text-align:left; padding:3px; border-radius:4px; float:left; background:#FFFFFF; border-style: solid; border-width: thin; border-color: #CCCCCC;}

.ROUTELINKSQUARE:hover { background:#FFDDDD;}

.ROUTELINKSQUARE a {text-decoration:none;}

.TEXTPANEL, 
.TEXTPANELNOHOVER,
.JOURNEYPLANNER,
.WIDEPANEL,
.ADVERTPANEL,
.GOOGLEADVERTPANEL,
.TEXTPANELSUPPHEADER
{max-width:600px; min-width:280px; margin-top:0px; margin-bottom:35px; margin-left: auto; margin-right: auto; white-space:normal; text-align:left; padding:10px; border-radius: 3px; border-style: solid; border-width: thin; border-color: #CCCCCC; background:#FFFFFF;
box-shadow:0px 0px 9px #999999; transition: background 0.5s, height 1s, transform 1s; display:inline-block; overflow:hidden;
                  user-select: none;
                 -webkit-user-select: none; 
                 -ms-user-select: none;
                 -moz-user-select: none;
                 cursor: auto;}

.TEXTPANELDISCLAIMER {max-width:100px; max-height: 25px; margin-top:20px; margin-bottom:20px; background:#111111; display:inline-block; overflow:hidden; color: #EEEEEE; border-color: #000000; transition: 1.5s;}

.TEXTPANELDISCLAIMER:hover {background:#444444; max-width:70%; max-height: 600px;}

.WIDEPANEL {margin-right:0px; max-width:100%; overflow:auto; box-shadow:none;}
.ADVERTPANEL {max-width:400px; background:#FFFFFF;}
.googleadpanel  {max-width:336px; background:#FFFFFF; padding: 0px; margin-left: auto; margin-right: auto;}

.TEXTPANEL .imagewithshadow , 
.TEXTPANELNOHOVER .imagewithshadow, 
.WIDEPANEL .imagewithshadow
{ margin-bottom: 10px; }

.LOGO {opacity: 0.8; transition: transform 1s;}

.ADVERTPANEL:hover,   .GOOGLEADVERTPANEL:hover,
.TEXTPANEL:hover, .LOGO:hover {box-shadow:0px 0px 25px #999999; background:#FFEEEE; transform: scale(1.10);}

.TEXTPANEL A { text-decoration: none; }

.TEXTPANELNOHOVER  A { color: #555555; }
.TEXTPANELNOHOVER  A:hover { background:#444444;  color: #CCCCCC; }



.TEXTPANEL  HR , .TEXTPANELNOHOVER HR { margin-right: 100px; margin-left: 100px; }

.MAPPANEL , .MOBILEMAPPANEL , .DESKTOPMAPPANEL {width:95%; height: 400px; margin:0px; margin-bottom:15px; margin-left:15px; white-space:normal; text-align:left; padding:0px;  border-width: thin; border-color: #CCCCCC; overflow:auto; display:block; box-shadow:0px 0px 9px #999999;; border-radius: 3px;}

.TABLECONTAINERPANEL {overflow:auto; padding-top:5px; white-space:normal; display:inline-block; }

.FLEXIPANEL { text-align:center; min-width: 700px; padding: 0px;}

.bigmap {
        width: 100%; overflow-x:auto; padding: 0px; margin-bottom: 15px; }

.bigmap .imagewithshadow { margin: 0px;  margin-bottom: 9px; margin-left: auto; margin-right: auto;}

.BarAdvert { Float:right; padding:0px; margin-right:0px; }

@media screen and (min-width: 700px) {
       .mobilegooglebox {display:none;}
       .desktopgooglebox {display:inline;}
       .MOBILEMAPPANEL  {display:none;}
}

@media screen and (max-width: 699px) {
      .centrepanel , .googleadpanel {display:none;}
      .BarAdvert {display:none;}
    .TEXTPANEL , .TEXTPANELNOHOVER , .WIDEPANEL , .TEXTPANELDISCLAIMER , .TEXTPANELSUPPHEADER, .MAPPANEL , .MOBILEMAPPANEL {
            width:95%; margin-bottom:15px;  box-shadow: none;
            background:#FDFDFD;  font-family: sans-serif;  }

      .bigmap {width: 100%;}
      
      .TEXTPANELDISCLAIMER {max-width:100px; max-height: 25px; margin-top:20px; margin-bottom:20px; background:#111111; display:inline-block; overflow:hidden; color: #EEEEEE; border-color: #000000; transition: 1.5s;}

     .TABLECONTAINERPANEL , .FLEXIPANEL { min-width: 300px; display:block;}

     .TEXTPANEL .imagewithshadow , .TEXTPANELNOHOVER .imagewithshadow {display:none;}

     .TEXTPANEL:hover {box-shadow:0px 0px 20px #444444 inset; background:#DDDDF0; transform: scale(1.0); border-color: #999999; }

    .TEXTPANEL H2 , .TEXTPANELNOHOVER H2  , .WIDEPANEL H2 {
	    font-family: Basictext;  font-size: 14pt;}

      BODY {font-size: 10pt;}

      .mobilegooglebox {display:block;}
      .desktopgooglebox {display:none;}
      .DESKTOPMAPPANEL {display:none;}
      .ADVERTPANEL {display:none;}
      .tabletypeB {box-shadow:none; margin-left: 0px;}

       .tabletypetrain { border-spacing: 0; border-collapse: collapse;}

       .tabletypetrain TR:hover {none;}

      .tabletypetrain TD.stationname  { min-width:100px; background:#DDDDDD; }

}

.JOURNEYPLANNER {
      color: #DDDDDD;
      background:  #222222;
      width:310px; 
      margin-top:50px;
      float: right;
}

.JOURNEYPLANNER A {
     color: #DDDDDD;
}

.bottombar { vertical-align: top; align: left; overflow: none; background: #0C0C0C; width:100%; color: #CCCCCC; margin:0px; }

.bottombar A  {color: #CCCCCC; margin-left:6px; vertical-align: top; }

.bottombar A:hover {color: #0C0C0C; background :#CCCCCC; vertical-align: top; }

.bottombar img { vertical-align: top; margin: 0px; box-shadow: none; transition: 0.5s; }

.bottombar img:hover { box-shadow: 0px 0px 9px #CCCCCC; }

.DROPDOWNSELECT {
   margin:1px;
   width: 292px;
   height: 30px;
   overflow: hidden;
   background: url(down_arrow_select.jpg) no-repeat right #eeeeee;
   border: 0px solid #eeeeee;
   border-radius: 5px;
   box-shadow: inset 5px 5px 5px #CCCCCC;
   }

.DROPDOWNSELECT select {
   background: transparent;
   width: 320px;
   padding: 5px;
   padding-left: 10px;
   font-size: 14px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 35px;
   -webkit-appearance: none;
   }

.LEFTCOLUMN {width:500px; float:left;}

.RIGHTCOLUMN {width:500px; float:left;}

.FULLWIDTHCOLUMN {width:100%; float:left;}

.imagewithshadow  { margin-top: 0px;  margin-bottom: 30px; margin-left: 0px; margin-right: 10px; white-space:normal; text-align:left; padding:0px; border-radius:10px; float:left; background:#eeeeee; border-style: solid; border-width: 0px; border-color: #CCCCCC;
box-shadow:0px 0px 9px #999999; overflow:hidden;}

.TEXTPANELNOHOVER IMG { float:left;  margin-right: 10px; margin-bottom: 10px;}

.TABLEPANEL {min-width:90%; margin:30px; white-space:normal; text-align:left; padding:20px; border-radius: 5px; float:left; background:#CCCCCC; border-style: solid; border-width: thin; border-color: #999999;
box-shadow:0px 0px 3px #666666;}

.NARROWIMAGEBOX {width:300px;}

.MOBILEPANEL {min-width:320px; margin:0px; white-space:normal; text-align:left; padding:0px; border-radius:0px; float:left; background:#111111; border-style: solid; border-width: thin; border-color: #EEEEEE;}

@media screen and (min-width: 700px) {
      .TEXTPANELNOHOVER {margin-right: 25px;}
}


.Tooltip{
    display: inline;
    position: relative;
}

.Tooltip:hover:after{
    background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 8px;
    bottom: 26px;
    color: #fff;
    content: attr(title);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 240px;
}


.Tooltip:hover:before{
    border: solid;
    border-color: #333 transparent;
    border-width: 6px 6px 0 6px;
    bottom: 20px;
    content: "";
    left: 50%;
    position: absolute;
    z-index: 99;
}

/* ------------MENUs----------------------------  */
/* ----Mobile first---- */

.niftymenu {height:30px; margin:0px; white-space:normal; text-align:left; padding:0px; border-bottom-right-radius:2px; border-bottom-left-radius:2px; float:left; color:#FFFFFF; background:#0C0C0C; border-style: none; overflow: hidden; transition: 1s; transition-timing-function: ease-out; text-shadow: 1px 1px #000000; z-index: 101; position: absolute;}

#niftymenu01 { margin-left:0px; }
#niftymenu02 { margin-left:40px; }
#niftymenu03 { margin-left:110px; }
#niftymenu04 { margin-left:205px; }
#niftymenu05 { margin-left:243px; }

#niftymenuheader01 { width:40px;}
#niftymenuheader02 { width:70px;}
#niftymenuheader03 { width:95px;}
#niftymenuheader04 { width:38px;}
#niftymenuheader05 { width:60px;}

@media screen and (min-width: 700px) {
    #niftymenu01 { margin-left:0px; }
    #niftymenu02 { margin-left:50px; }
    #niftymenu03 { margin-left:135px; }
    #niftymenu04 { margin-left:250px; }
    #niftymenu05 { margin-left:300px; }

    #niftymenuheader01 { width:50px;}
    #niftymenuheader02 { width:85px;}
    #niftymenuheader03 { width:115px;}
    #niftymenuheader04 { width:50px;}
    #niftymenuheader05 { width:65px;}
}

.niftymenu A {color:#CCCCCC; }

.niftymenu:hover {width:160px; height:570px; width:215px; box-shadow: 2px 2px 0px #eeeeee;}
#niftymenu01:hover {max-height:355px; height:355px; width:220px;}
#niftymenu02:hover {max-height:355px; height:355px; width:275px;}
#niftymenu03:hover {max-height:355px; height:355px; width:170px;}
#niftymenu04:hover {max-height:140px; height:140px; width:110px;}
#niftymenu05:hover {max-height:170px; height:170px; width:70px;}


@media screen and (min-width: 700px) {
    .niftymenu:hover {max-height:350px;}
    #niftymenu01:hover {max-height:400px; height:400px; width:250px;}
    #niftymenu02:hover {max-height:400px; height:400px; width:330px;}
    #niftymenu03:hover {max-height:400px; height:400px; width:200px;}
    #niftymenu04:hover {max-height:150px; height:150px; width:150px;}
    #niftymenu05:hover {max-height:190px; height:190px; width:95px;}
}

.niftymenurow, .niftymenuheader { color:#FFFFFF; padding: 5px; margin: 0px; transition: 0.5s; transition-timing-function: ease-in; vertical-align: middle; white-space: nowrap; background: linear-gradient( to bottom, #333333, #000000);}

.niftymenurow:hover {background: linear-gradient( to bottom, #882222, #110000); color:#FFFF33; padding-left: 15px;}

.niftymenuheader {transition: 0.2s; background: linear-gradient( to bottom, #882222, #110000);
border-right-style: solid; border-right-width: 1px; border-right-color: #997777; 
border-left-style: solid; border-left-width: 1px; border-left-color: #553333; height: 30px;}

.niftymenuheader:hover {background: #AA2222; color:#FFFFFF;}


.circle {border-style: none; height: 18px; width:18px; background: #CCCCFF; border-radius: 50%; float:left; margin-right:5px;}
@media screen and (max-width: 699px) {
.circle {border-style: none; height: 14px; width:14px; background: #CCCCFF; border-radius: 50%; float:left; margin-right:5px;}
}

.desktop {display:none;}
@media screen and (min-width: 700px) {
         .desktop  {display: block;}
}

.mobile {display:block;}
@media screen and (min-width: 700px) {
         .mobile  {display: none;}
}