#fontsView {
    background: #fed7d9 url('../images/bgpattern.png');
    z-index: 98;
}

#gbff {
    width: 18px;
    height: 28px;
}

.buttons {
    display: inline-block;
    margin-top: 15px;
    margin-left: 100px;
}

.buttons > .focusable {
    display: inline-block;
    width: 18px;
    height: 28px;
}

.search-box {
    position: relative;
    display: inline-block;
    margin-top: 15px;
    margin-right: 100px;
    float: right;
}

.search-box > .icon {
    position: absolute;
    top: 13px;
    left: 6px;
    border-right: 1px solid lightgrey;
    padding-right: 5px;
}

.search-box .focusable {
    padding: 12px 25px;
}

.boxes .focus {
    box-sizing: border-box;
    border: 2px solid greenyellow;
    padding: 8px;

    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.boxes > p {
    max-height: 125px;
    overflow-y: auto;
    margin-top: 0;

    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

#box1 {
    font-family: 'Merriweather', serif;
    font-size: 1.5rem;
}

#box2 {
    font-family: 'Roboto', serif;
    font-size: 1.25rem;
}

#box3 {
    font-family: 'Open Sans', sans-serif;
    font-size: 1rem;
}