body{
	background-color: #f8f8f8; 
	font-family: 'Fira Sans', sans-serif; color: #445566;
}

.container{
	width: 90%; 
	padding: 0;
}

.top{
	height: 10vmin; 
	background-color: #445566; 
	padding: 0 5vw;
}

.lang, 
.lang a{
	color: #f8f8f8; 
	font-size: 3vmin !important; 
	padding: 1vmin 2vmin; 
	line-height: 8vmin;
}

.langSelected{
	background-color: #f8f8f8; 
	color: #445566 !important; 
	border-radius: 10%; 
	font-weight: bold !important;
}

.name{
	margin: 3vh 0 5vh 0;
}

.name h2 {
	margin-top: 10px;
}

.my-4{
	border-top-color: #e0e0e0 !important; 
	margin-left: 2vw; 
	margin-right: 2vw;
}

ul.nav{
	width: 98%; 
	margin-left: 1%; 
	margin-right: 1%; 
	border-bottom: 0 !important;
}

ul.nav li{
	width: 50%; 
	text-align: center; 
	margin-bottom: 0 !important;
}

li.active a{
	color:#f8f8f8 !important; 
	background-color: #445566 !important;
}

li a{
	margin-right: 0 !important;
}

.route{
	margin-top: 8vmin; 
	border-bottom: 0;
}

ul.route li{
	border-radius: 5px 5px 0 0; 
	border-bottom: 0; 
	background-color: #eeeeee;
}

ul.route li.active a{
	background-color: #445566 !important;
}

ul.route li a{
	padding: 5px 12px !important; 
	font-size: 3.5vmin !important;
}

.address{
	font-weight: bold !important; 
	font-family: 'Fira Sans Extra Condensed', sans-serif;
}

.tab-content{
	border: 1px solid #445566; 
	background-color: rgb(255, 255, 255); 
	height: auto; 
	margin-bottom: 20px; 
	border-radius: 5px; 
	overflow: hidden;
}

.divmap{
	border: 0 !important; 
	overflow: hidden !important;
}

.card {
	margin-top: 5vmin; 
	padding: 2vmin;
}

.gps {
	font-size: 1.2rem; 
	padding: 0 1.5vh; 
	text-align: center;
}

h1{
	font-size: 7vmin; 
	font-weight: 400;
}

h2{
	font-size: 6.5vmin; 
	font-weight: 400;
}

h3{
	font-size: 5vmin; 
	font-weight: 300;
}

h4{
	font-size: 4.5vmin; 
	font-weight: 300;
}

h5{
	font-size: 4vmin; 
	font-weight: 300;
}

p, 
a, 
button{
	font-size: 4vmin !important; 
	font-weight: 300 !important;
}

#map-data, #map-data2{
	width: 50vmin; 
	height: 50vmax; 
	margin:0 auto; 
	margin-right: 0 !important; 
	border:1px solid #445566; 
	border-radius: 5px; 
	min-width: 100%; 
	overflow: hidden;
}

#map, #map2{
	width: 50vmin; 
	height: 50vmax; 
	min-width: 100%;
}

.map-static, 
.map-feet{
	width: 100%; 
	border:1px solid #445566; 
	overflow: hidden; 
	margin:0 auto; 
	max-width: 800px; 
	max-height: 570px;
}

.map-static img, 
.map-feet img{
	width:100%; 
	height: 100%;
}

button.getDirection, 
button.getDirection:focus, 
button.getDirection:hover{
	background-color: #445566; 
	color: #f8f8f8; 
	margin-top: 20px;
}

.placeholder{
	width: 60%; 
	margin:0 auto; 
	border:1px solid #8888aa; 
	border-radius: 5px;
}

.gm-style-mtc, 
.gm-svpc{
	display: none !important;
}

.row p{
	text-align: center; 
	padding:2vh;
}

.biggerMargin {
	margin-top: 2vmax;
	margin-bottom: 2vmax;
}

#createdBy {
	position: relative;
	top: 4vh;
	right: 1vh;
	float: right;
	text-align: right;
	width: 60vw;
}

#createdBy, #createdBy a {
	color: white;
	text-decoration: none;
	font-size: 12px !important;
}

@media screen and (max-width: 1024px) {
	.placeholder{
		width: 90%;
	}

	#createdBy {
		top: 2vh;
	}
}

@media screen and (min-width: 1024px) {
	.map-static, 
	.map-feet{
		margin-top: 20px; 
		margin-bottom: 20px; 
		border-radius: 5px;
	}

	#auto, 
	#feet,
	#auto2, 
	#feet2{
		border:1px solid #445566;
	}
}