#hide_background{ top: 0; left: 0; }

#hide_background,
.webrtc-container,
.hide_activated {
    margin: 0;
    padding: 0;
}

.webrtc-container {
    position: fixed;
    top: 200px;
    left: -1024px;
    width: 228px;
    z-index: 11000;
    visibility: visible;
}

.container-hidden {
    display: none;
}

.hide_activated {
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 10999;
    background-color: #FFFFFF;
    opacity: 0.5;
}

.keyboard-close {
    display: table;
    height: 100%;
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
}

.keypad-panel,
.webrtccall-box,
.webrtccall_button,
.button-box {
    position: relative;
    box-sizing: content-box;
}

.webrtccall_button {
    margin: 0 auto;
}

.webrtccall_button {
    padding: 0.3em 10px;
}

.webrtccall_button button.not_supported {
    color: #AA1111;
}

.keyboard-close {
    position: absolute;
}

.button-box {
    background-color: transparent;
    display: table;
    height: 52px;
    width: 100%;
}

.button-box .keyboard-close,
.button-box .keyboard-close:hover{
    height: 40px;
    width: 40px;
    top: 46px;
    right: -11px;
    background-size: 100%;
    z-index: 11000;
}

.keypad-panel {
    display: table;
    vertical-align: middle;
    padding: 5%;
    width: 90%;
}

.keypad-panel button.btn {
    color: #444444;
}

.webrtccall-box.activate .dtmf_btn {
    border: 2px solid #D2E8A7;
}

.webrtccall-box {
    display: table;
    border: 1px solid #CDCDCD;
    background-color: #FFFFFF;
    border-radius: 0.3rem;
    box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.2);
    padding: 5%;
    width: 90%;
}

.webrtccall-box .call {
    border-color: #AAAA44;
}

.webrtccall-box .activate {
    border-color: #11AA11;
}

.keyboard-close:hover {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAzCAYAAADVY1sUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAXzSURBVHja1JrfbxvFFsc/s+tsanDzgzhtTILaKygXIYGwUgka0qpp8g7PBa6QeEDiLUggtfe+IKRWidQn3pAqEFXbSIj/oBLILU2jOA01ApGSxKZ2mpo0DUqcOusfe+4D41z31m3s9aZ1j7Ra/9qd8/H3zJmZM6tEBI9sFzAAvAG8BPwD6ASe1t+vA0tAHPgNuAJ8D/zpReOqTpAO4F/AUaAXUDVeL8AUcA74Blh27YmIuDlCInJKRDLina2LyBci8qwbn2q9wCcin4jImmyfrek2mrYLZJ+IXJVHZ9Mi8nK1/hlVRuBbQBQI8+jsNWACeNuTPlIsFj8UkYI8PitoH9yHVrFY/EgaxLQvtYMUCoW3HrMS9ymjfarob8VxJJfLvWxZ1gQQoLEsk8vlXrcs69dqBsQmEYkqpV6lAU1EYkqp/UC+/PP7spbjOMONCgGglHrVcZyPH6pINpvt9vv9vzVgSN0XYtls9iW/379QURHLsv79BEAABCzL+k9FRTKZTGcgEPgD8PNkWDaTyewJBAJL9yiyY8eO99xAxGIxxsfHXXsTi8WYmZlxc6lf+/y/0FJKKcMw3nVzt9XVVVKpFJFIpOZrp6ammJmZIZlMuvoTDMN4RymlNkESiUSXYRivublZf38/oVCIdDpdE0w0GmV+fp62tjYOHTrkFiS8sLDQswkSDAYHXSyKXMNEo1Hi8ThtbW0MDg5iWZbrbNza2noEwFBKKZ/P93q9Pa9amMnJyU2IoaEhDMOoq12fz7dfKaUMQJmm+U8v0shWMJOTkyQSCdrb2xkaGkKHd11mmuaLgDL+DjXjea9yYn9/P11dXaTTaS5evFgRYnBw0BMI3U9eAAwFNDmOc0cp5elAeOnSJRYXF9m7dy+WZXH9+nXPIfTcK2MYxjMKsETE3o4Ra2pqivn5eQC6u7vp6+vbrvlXs1FPtqoifiu+9thygPKV5PE6tCYmJrhx4wY9PT34fD4SiQS2bbseMx5kjuOsA/j0myXTND0DuXLlCslkko6ODg4cOACAbdssLi4SiUQ8hRGRvzYHxHw+H98OiCNHjtQ9A9jK8vn8PCAGILlc7rqXEMFg8B6IrVJzXR0kl/u9pIisrq5G673h+Pj4JsTAwMADf3fw4EFCoRC3bt3yRJm1tbWfNhW5cOFCRBeUXSuRSqW2hHiQMnUU0uXy5cs/AKK0Kk/Ztv2jZVk1r9UjkQjpdJrOzk4OHz7satCs9g+oEFax5ubmN4G7hlaisLy8/K2rNWcgQHd3d80QJWV6enpoaWlxJcedO3e+A4qAlGS1RkdH9zmOk5UnxBzHyY6Oju7TMxNKICawc2Vl5asnBWRlZeUrYCdgllfjHSA/NjZ2SkTWG73qICLrY2Njp3SRzrmnGq9H+dZUKvV5o6tx8+bNz4FWwHdfEVtPHv29vb0h27Z/blQI27Z/7u3tDemKj6pYjdeqtJw5c6avWCyuNWAHXzt//nwf0FKuRiUQBTQD7dPT0+832rbC9PT0+0C79lE9dH9ED5B+IDg3N3esUSjm5uaOAUHgKcCoaqNHp+MAsGt2dvbTx731Njs7+yl/P5AQKKXbakGU7i87gV1Xr1794HH0GcdxMteuXftAQ+zUPqmatt40TFMJ5vTp0/2PMpvZtv3L2bNnB8ogmh4EseVmaJkyASAYDof3JJPJke2cyjiOk11YWBgJh8N7dJ8IPEyJqh8Y0DCmTgDtQNfJkyd7l5aWvnQcZ91DgLu3b9/+emRkZD/QBTyjO7a5FURNTz7obNasc3gQCA0PD78Sj8c/29jYiImI48b/jY2NWDwe/2x4ePgVIKTv3aLbMqr1r6ang3QJ39TxaumzDzCOHz++6+jRo327d+8O+/3+fZZlPWeaZodS6unS/KhYLC7ncrlkNpv9PZ1OT587d+7yiRMn/tTzpYKeO+X0uSg1OOfqMacyIJ+GadLvDX2osnpZ6SxlZ9HOO3o9kddHoVYA/q8R10U+7XgJwvcQoEoAhbLXTj3LbS+rjKoMrFpFpB7ny+2/AwCAKzZP8tTteAAAAABJRU5ErkJggg==);
}

.keyboard-close {
    background-image: url(data:image/png;base64,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);
}

#webrtc_activation {
    pointer-events: auto;
}

#webrtc_activation.called {
    pointer-events: none;
}

#novawebcall-call {
    display: block;
    margin: 0 auto;
    font-size: 13px;
    font-weight: bold;
    height: auto;
    width: 100%;
    padding: 6% 5%;
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    line-height: 13px;
}

#novawebcall-call.calling {
    color: #FFFFFF;
    background-color: #EB1C24;
}

#webrtc_status {
    font-size:      16px;
    font-family:    'Semi-bold', 'Arial', sans-serif;
    font-weight:    bold;
    margin:         0.5em 0;
    padding:        0.5em;
    text-align:     center;
    height:         auto;
    color:          #444444;
}