.upper, .middle, .down{
    -webkit-transition: 1s ease-in-out;
    -moz-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
    transition: 1s ease-in-out;	
}
#map-container{
	height:100vh;
}
#sidebar{
	height:100vh;
	background: #ADADAD;
}
.upper{
	background:#FFFFFF;
	height:100px;
	z-index:3;
}
.upper h1{
	font-size:29px;
	text-align:center;
	color:#a19062;
	font-weight: 600;
}
.upper h1 span{
	font-size:14px;
}
.middle{
	z-index:2;
	height:55px;
	background:#20425e;
	color:#FFFFFF;
	-webkit-box-shadow: 0px 6px 19px 0px rgba(0,0,0,0.66);
	-moz-box-shadow: 0px 6px 19px 0px rgba(0,0,0,0.66);
	box-shadow: 0px 6px 19px 0px rgba(0,0,0,0.66);
}
.middle .btn-intersections, .middle .btn-rankings{
	background:transparent !important;
	border:none !important;
	color:#FFFFFF;
	padding-top:3px;
}
.middle .btn-intersections:hover, .middle .btn-rankings:hover{
	background:transparent !important;	
}
.middle .menuitem{
	font-size:18px;
	margin-top:16px;
}
.down{
	display: block;
	z-index:1;
	height: auto;
	background:#FFFFFF;	
	margin-top: 0;
	padding-top: 0px;
	padding-bottom:20px;
	list-style-type: none;
}
.down li.row{
	height:50px;
	padding:0px;
}
.down li.row div{
	height:50px;
	padding:5px 10px;
	background:#FFFFFF;
	border-bottom: 1px solid #CCC;
}
.down li.row .sidebar-item{
	color:#333;
	line-height:50px;
  	text-overflow: ellipsis;
  	font-size:12px;	
}
.down li.row .rank-txt, .down li.row .acc-txt{
	line-height:50px;
	font-size:12px;
}
.btn-rankings span{
	font-size:10px;
}
@media screen and (max-width:767px){
	#map-container{
		height:300px !important;
	}
}
@media screen and (min-width:768px){
	.down{
		position:absolute;
		top:155px;
		bottom:0px;
		overflow:auto;
	}
}