.hex-input {
    font-size: 120%;
}

.jumbotron {
    padding: 2em;
    margin-bottom: 0;
}

.error-msg {
    color: palevioletred;
}

.footer{
    position:fixed;
    height:50px;
    bottom:0px;
    left:0px;
    right:0px;
    margin-bottom:0px;
}

.colorRow {
    display: -webkit-flex;
    display: flex;
    align-items: stretch;
}

.colorDiv {
    width: 56px;
    height: 168px;
    font-size: 8px;
    border: solid gray 1px;
}
.hex-input {
    font-size: 120%;
}

.jumbotron {
    padding: 2em;
    margin-bottom: 0;
}

.error-msg {
    color: palevioletred;
}

.footer{
    position:fixed;
    height:50px;
    bottom:0px;
    left:0px;
    right:0px;
    margin-bottom:0px;
    padding: 1em 0;
}

.colorRow {
    display: -webkit-flex;
    display: flex;
    align-items: stretch;
}

.colorDiv {
    width: 56px;
    height: 168px;
    font-size: 8px;
    border: solid gray 1px;
}
Add footer top and bottom padding
Add footer top and bottom padding
