/* Concrete calculator */
.calculator-wrap { position: relative; width: 100%; display: flex; flex-flow: row nowrap; }
.calculator { position: relative; }
.calculator.with-border { margin-right: 50px; padding-right: 50px; }
.calculator.with-border::after { position: absolute; top: 0; right: -1px; width: 1px; height: 100%; content: ""; background: #DDD; }
.calc-table ul li { display: inline-block; vertical-align: middle; padding: 5px; }
.calc-table ul li:first-child { min-width: 80px; text-align: right; }
.calc-table input[type="text"], .calc-table input[type="button"], .calculation li:last-child { border: 1px solid #CCC; }
.calc-table input[type="text"] { height: 24px; padding: 0px 5px; }
.calc-table input[type="button"] { min-width: 140px; padding: 12px 10px; background: #F0F0F0; font-size: 15px; text-transform: uppercase;font-family: 'Roboto Condensed', sans-serif; line-height: 1; }
.calc-table input[type="button"]:hover { cursor: pointer; background: #F6F6F6; }
.calculation { margin-top: 10px; }
.calculation li:last-child { min-width: 150px; background: #F6F6F6; color: #111; }
.calc-buttons { margin-top: 10px; }
.calc-table input.less-width { width: 80px; }
.calc-table .calc-result { width: 120px; padding: 3px 5px; margin: 0px auto; background: #F9F9F9; border: 1px solid #CCC;  }

@media screen and (max-width : 768px) {
    .calculator-wrap { flex-wrap: wrap; }
    .calculator { width: 100%; }
    .calculator.with-border { border-bottom: 1px solid #DDD; margin: 0 auto 50px; padding: 0 0 50px; }
    .calculator { margin-bottom: 50px; }
    .calculator.with-border::after { display: none; }
    .calc-table, .calc-buttons ul { position: relative; display: flex; flex-direction: column; align-items: flex-start; }
    .calc-buttons ul li { margin: 0 0 5px; }
}