:root {
    width: 100%;
    height: 100%;
}

* {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

body {
    margin: 0;
    width: 100%;
    height: 100%;
    font-family: "Liberation Mono", monospace;
    font-size: calc(9px + 1vmin)
}

main {
    width: 60%;
    margin: 0 auto;
    margin-top: 10%;
    padding-bottom: 20em;
}

h1 {
    font-size: 6em;
    margin-bottom: 0.4em;
}

a.ghost {
    color: inherit;
    text-decoration: none;
}

#search {
    width: 100%;
    max-width: 40em;

    input {
        width: 100%;

        font-size: 1.4em;
        border-width: 2px;
        border-style: solid;
        padding: 0.2em;
        padding-left: 0.8em;
        padding-right: 0.6em;
    }

    input:focus {
        outline: none;
    }

    input[type=submit] {
        visibility: hidden;
    }

    #results {
        width: 100%;

        .result {
            border: black solid 1px;
            padding-left: 2em;

            .tag {
                font-size: 0.8em;
                text-align: center;
                padding: 0.4em;
                border-radius: 1em;
                border: 1px black solid;
                background-color: #eee;
                display: inline-block;

                margin-right: 0.8em;
                margin-bottom: 1em;
            }
        }
    }
}