/* Always set the map height explicitly to define the size of the div
* element that contains the map. */

/* Text font */
 h3, th, form, b, tbody, .panel-title, p {
	color: white;
	text-shadow: 
	1px 1px 1px #000,
	1px 1px 1px #000,
	1px 1px 1px #000,
	1px 1px 1px #000;
 }

 /* Optional: Makes the sample page fill the window. */
 html, body {
	height: 100%;
 	margin: 0;
	 padding: 0;

}

.wrapper {
min-height: 100%;

}

/* Background image */
body {
	background: url('../images/eberhard-grossgasteiger-521851-unsplash.jpg')no-repeat bottom center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-color: black;
	color: rgba(255, 255, 255, 0.699);
}

/* Navbar Color */
.navbar-default {
	background: rgba(0, 0, 0, 0.664);
	border: 0px;
	border-radius: 0;
}

/* Mode of travel */
#floating-panel {
 margin-bottom: 10px;
}

/* Map */
#map {
 height: 400px;
 color: black;
}

/* Panel Header */
.panel-default .panel-heading {
	background: transparent;
 	border-color: rgba(0, 0, 0, 0.664);
 }

 /* Border on panels */
 .panel-default {
 	background: transparent;
 	/* background: rgba(0, 0, 0, 0.219); */
 	border: 0px;
 }

 /* table border */
 .table thead tr th {
 	border-bottom: 1px solid rgba(0, 0, 0, 0.664);
 }

 /* moves the tables into pages' normal view (do not have to scroll right) */
 /* didn't know you could go negative */
 .table {
	/* margin-left: -25px; */
 }

 p {
	 font-size: 30px;
	text-align: center;
 }

 /* footer */
 .panel-footer {
 	background: rgba(0, 0, 0, 0.664);
 	border: 0px;
 	margin-bottom: 0;
 	/* height: 40px; */
 	border-radius: 0;
	position: relative;
	margin-top: -40px; /* negative value of footer height */
	height: 40px;
	clear: both;
	padding-top: 20px;
 }

 /* Make user image 40px x 40px */

 .userImage {
 	max-height: 40px;
 	max-width: 40px;
 	margin: 2px;
 }

 .fixed72 {
	 max-height: 72px;
	 padding-right: 20px;
	 padding-top: 5px;
 }


 .navbar-default .navbar-brand {
	/* margin-top: 8px; */
	font-size: 30px;
	color: rgba(255, 255, 255, 0.822);
 }

 #firebaseui-auth-container {
	 max-width: 150px;
	 float: right!important;
	 margin-right: 10px;
 }

 #sign-in {
	float: right!important;
 }

 #account-details {
	float: right!important;
 }

 .firebaseui-card-content {
	 padding: 0!important;
 }

 .firebaseui-idp-list {
	 margin: 5px 0!important;
 }

 #mode, #traffic {
	 background: black;
 }

 .floating-panel {
	/* position: absolute;
	top: 10px;
	left: 25%;
	z-index: 5; */
	background-color: black;
	padding: 5px;
	border: 1px solid #999;
	/* text-align: center; */
	font-family: 'Roboto','sans-serif';
	line-height: 30px;
	padding-left: 10px;
	display: inline;
}

 #directionsPanel {
	background: rgba(255, 255, 255, 0.699);
}

.panel-footer {
	margin-top: 30px;
}

/* spaceing between signout btn and right edge/username */
.btn {
	margin-right: 5px;
	margin-left: 5px;
}

.modal-body {
	color: black;
}