body {
    font-family:Roboto,Helvetica Neue,sans-serif;
    text-align: center;
    background-color: rgb(245,245,245); 
    margin-left: 50vh;
}

.link {
    color: #00adef;
    padding:12px;
    margin:20px;
    font-size: 1.7em;
    font-weight: bolder;

}

button a {
    padding: 5px;
    text-decoration: none;
}
a.button_link:hover {
    color: white;
}

a:visited {
    color:gray;
}

  

button:hover {
    background-color: #00adef;
    cursor: pointer;
    color: white;
}

div#logo {
    height: 15vw;
    width: 50%;
    margin-left: 25%;
    margin-top: 5%;
    background-image: url(./images/mapzs.svg);
    background-size: 100%;
    opacity: .5;
    background-repeat: no-repeat;
}


h1 {
    margin-top:5%;
    color: gray;
    font-size: 1.3em;
}

a.en {
    color:rgba(0,0,0,.2);
}

.instructions {
    text-align: left;
    margin: 20px;
    font-size: 1.3em;
    margin-top: 5%;
}

img.homescreen {
    width: 40vh;
    position: absolute;
    bottom: 25px;
    left: 40px;
}

img.icon {
    width: 1em;
}

.subheader{
    font-size: 1.3em;
    font-weight: 700;
    color: #00adef;
}


@media screen and (max-width: 850px) {
    body {
        margin-left: 0;
    }
    
    body p.text {
        font-size: 1em;
        margin: 10%;
    }
    button {
        background-color: #00adef;
    }

    button a {
        color: white !important;
    }

    img.homescreen{
        display: none;
    }
    
    .link{
        margin: 2px;
    }
    #logo{
        margin: 0;
    }
    .instructions{
        margin-top: 2px;
        font-size: 1.2em;
    }
    h1{
        margin:1px;
    }
}