* {
    outline: none; 
}

body, html {
    padding: 0;
    margin: 0;
    font-family: 'Roboto', sans-serif; }

html {
    overflow: hidden; }

body {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: #eeeeff;
    margin: 0px; }



#map{

    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;

    display: block;

    z-index: 1000;
}

#map img {
	cursor: pointer;
}

#responsive-legend {

	padding: 6px;
	margin: 6px;
	background-color: white;
	border-style: solid;
	border-width: 1px;
	position: absolute;
	top: 20px;
	left: 0px;
	z-index: 7000;
	font-size: 10px;
}

#suggest {
	width: 250px;
	margin: 6px 6px 6px;
}


@media (max-width: 480px) {

    #responsive-legend .mobile{
	display:block;
    }

    #responsive-legend:hover .mobile{
	display:none;
    }


    #responsive-legend table{
	display:none;
    }

    #responsive-legend:hover table{
	display:block;
    }
}

@media (min-width: 480px) {

    #responsive-legend .mobile{
	display:none;
    }
}


.score1,.score2,.score3{

    border-radius: 50px;
    box-shadow: #000000 0px 0px 20px;
}

.score1{
    border: 3px solid #33ff54;
    background-color: #33ff54;
}

.score2{
    border: 3px solid #ff962b;
    background-color: #ff962b;
}

.score3{
    border: 3px solid #ff0000;
    background-color: #ff0000;
}

.score-safe{
    border: 3px solid #0066ff;
    background-color: #0066ff;
}