body {
    font-family: "Helvetica Neue";
    font-weight: lighter;
    color: #2a2a2a;
    background-color: #f0f0ff;

    -webkit-appearance: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);

    -webkit-touch-callout: none; -webkit-user-select: none;
}

h1 {
    text-align: center;
}

button {
    margin: 15px;
    -webkit-appearance:none;
    font-size: 1.2em;
}

input[type=text] {
    font-size: 0.6em;
    width: 45%;
}

#mainPage {
    text-align:center;
}

#detailPage {
    text-align:center;
    font-size: 2em;
}

#detailPage div {
    margin: 20px;
}

#detailPage button {
    margin-top: 40px;
    font-size: 0.6em; /* undo 2em from parent */
}

ul {
    list-style: none;
    border-bottom: 1px solid #d3d3d3;
    text-align: left;
}

li {
    margin-left: -40px;
    padding: 5px;
    padding-top: 10px;
    min-height: 50px;
    border-top: 1px solid #d3d3d3;
    font-size: 0.9em;
}

button {
    -webkit-appearance: none;
    font-size: 1.5em;
    border-radius: 0;
}

#resultDiv {
    font: 16px "Source Sans", helvetica, arial, sans-serif;
    font-weight: 200;
    display: block;
    -webkit-border-radius: 6px;
    width: 100%;
    height: 140px;
    text-align: left;
    overflow: auto;
}

#statusDiv {
    text-align: center;
    margin-top: 10px;
}

.fadein {
  opacity: 1;
  -webkit-transition: opacity 1s ease-in;
}

.fadeout {
  opacity: 0;
  -webkit-transition: opacity 1s ease-out;
}

/* iPhone 5s */
@media screen and (device-aspect-ratio: 40/71) {
    h1 {
        font-size: 1.6em;
        padding-top: 15px;
    }

    input[type=text] {
        font-size: 0.5em;
    }
}
