@import "./globals.css";

#distance_chooser {

    z-index:400;

    position:relative;
    left:0 !important;

    display:flex;
    flex-direction:column;

    width:auto;

    text-align:start;
    align-content: center;
    align-items: center;

    border-bottom: 2px solid lightgray;

    padding-top:2px;
    padding-bottom: 15px;

    margin-top:0;
    top:0;

    font-family: var(--FONT_3);
    font-size:15px;
    font-weight:400;
}


#distance_form {
    max-width:160px;
}


#distance_miles {
    
    width:55px;

}

#distance_from {
    
    width:55px;

}

#distance_form input {

    direction: rtl;

    font-size:15px;
    margin:4px;
    padding:3px;
}


#distance_button {

    transform:translate(20px, 8px);

    width:70%;

    color:white;
    border:0;
    background-color: var(--LEEDZ_DARKGREEN);
    
    border-radius:14px;

    line-height:2em;

    font-size:18px;
    font-weight: bolder;
    letter-spacing: 0.07rem;

    padding: 16px;

    border:none;
    box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.2); 
}



#distance_button:hover {
    box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.4); 
}

#distance_button:active {
    box-shadow: 0px 4px 16px 0px rgba(0,0,0,0.8); 
}