@charset "UTF-8";
/* CSS Document */

/*
Theme Name:     Mobile Rail
Theme URI:
Description:    Map scroll CSS style sheet for Mobile Rail web application
Author:         Kyle Crowther
Author URI:
Template:       
Version:        2.0
*/

/* Notes
*
*UPDATE 08/2015
*removed height as percentages to fix element height vs window height issues
*removed height on #page-content, #page-content-scroll, #page-content-scroll, .page-content-scroll, .page-sub-content for better vertical uniformity with maps and text pages
*original height of elements based on body min-height 960px, with page-content 742px and page-sub-content/maps 571px (mistake). new height has been updated
*
*/


/*------------------------------------------------------------
			   Map
------------------------------------------------------------*/

#map,
#blue-map,
#expo-map,
#gold-map,
#green-map,
#purple-map,
#red-map {
	height: 320px; /*571px*/;
	margin: 0 3.90625% /*25px*/;
	overflow: hidden;
	padding: 0;
	width: 92.09677% /*571px*/;
}

.map {
	height: 2000px;
	position: relative;
	width: 2000px;
}

.blue-map {
	height: 2174px;
	position: relative;
	width: 966px;
}

.expo-map {
	height: 682px;
	position: relative;
	width: 1900px;
}

.gold-map {
	height: 1388px;
	position: relative;
	width: 1296px;
}

.green-map {
	height: 676px;
	position: relative;
	width: 2844px;
}

.purple-map {
	height: 571px;
	position: relative;
	width: 1589px;
}

.red-map {
	height: 1462px;
	position: relative;
	width: 1958px;
}


/*------------------------------------------------------------
		MEDIA QUERIES i.e. RESPONSIVE
------------------------------------------------------------*/

/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px){

	#map,
	#blue-map,
	#expo-map,
	#gold-map,
	#green-map,
	#purple-map,
	#red-map {
		height: 414px;
		}
}