.calcContainer {
    float: left;
    border: 1px solid #DBF3FF;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
.calcContainer form {
    margin-bottom: 10px;
}
.width-500p {max-width: 500px;}
.width-680p {max-width: 680px;}
.calcHeading {
    float: left;
    width: 100%;
    padding: 10px;
    font-size: 90%;
    text-align: center;
    color: #FFF;
    background: #00649E;
}
.calcRow {
    float: left;
    width: 100%;
    padding: 2px 0;
    border-bottom: 1px solid #7DB0CD;
}
.calcContainer label {
    font-weight: bold;
}
.calcLabel {
    clear: both;
    float: left;
    color: #333;
    background: #FFF;
    font-weight: bold;
}
.calcInput {
    float: left;
    border-right: 3px solid #FFF;
}
.calcInput input[type="number"] {
    width: 100%;
    font-weight: bold;
    color: #424242;
    background: #DBF3FF;
    border: none;
    box-shadow: inset 0 0 4px 0 #424242;
}
.secUnitsDiv {
    float: left;
    font-weight: bold;
    color: #333;
    background: #7DB0CD;
}
.calcResult {
    float: left;
    color: #FFF;
    background: #00649E;
    border-right: 3px solid #FFF;
}
.width-33-50 {width: 50%;}
.width-33-100, .width-66-100 {width: 100%;}
.calcLabel, .calcResult, .secUnitsDiv, .calcInput input[type="number"] {
    height: 45px;
    line-height: 35px;
    padding: 5px 5px 5px 10px;
}
@media only screen and (min-width: 1130px) {
    .width-33-50, .width-33-100 {width: calc(100% / 3);}
    .width-66-100 {width: calc(100% / 3 * 2);}
}