.dialpad {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.dialpad .number {
    color: #2d2d2d;
    font-weight: 300;
    font-size: 32px;
    height: 42px;
    padding: 0 5px;
    background: #fff;
}

.dialpad .dials {
    margin: -1px 0 0 -1px;
    background: #1d1918;
    cursor: pointer;
}    

    .dialpad .dials .col-xs-4 {
        padding: 0;
        margin: 0;
    }

    .dialpad .dials .digits {
        border-top: 1px solid #4d4d4d;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
        border-left: 1px solid #4d4d4d;
    }

    .dialpad .dials .digits p {
        font-weight: 600;
        padding: 15px 35px 0;
    }

        .dialpad .dials .digits p strong {
            font-size: 30px;
            margin-right: 8px;
            color: #fff;
        }

        .dialpad .dials .digits p sup {
            text-transform: uppercase;
            color: #c1c1c1;
        }

        .dialpad .dials .digits:active {
            background: #00caf2;
            border-top-color: #b2f2ff;
        }

.dialpad .dials .pad-action {
    background: #093;
}

    .dialpad .dials .pad-action p sup {
        color: #fff;
    }
    
    .dialpad .dials .pad-action:active {
        background: #0c3;
    }

.dialpad .dials .incall {
    background: #f33;
}

    .dialpad .dials .incall:active {
        background: #f33;
    }