/*!

	Contact centre webchat client.
	Copyright © 2015-2016 Braxtel Communications.
	http://www.braxtel.com/
	version 4.0.3432

*/
/*!
* CleanSlate
*   github.com/premasagar/cleanslate
*
*//*
    An extreme CSS reset stylesheet, for normalising the styling of a container element and its children.

    by Premasagar Rose
        dharmafly.com

    license
        opensource.org/licenses/mit-license.php

    **
        
    v0.9.3
        
*/

/* == BLANKET RESET RULES == */

/* HTML 4.01 */
.cleanslate, .cleanslate h1, .cleanslate h2, .cleanslate h3, .cleanslate h4, .cleanslate h5, .cleanslate h6, .cleanslate p, .cleanslate td, .cleanslate dl, .cleanslate tr, .cleanslate dt, .cleanslate ol, .cleanslate form, .cleanslate select, .cleanslate option, .cleanslate pre, .cleanslate div, .cleanslate table,  .cleanslate th, .cleanslate tbody, .cleanslate tfoot, .cleanslate caption, .cleanslate thead, .cleanslate ul, .cleanslate li, .cleanslate address, .cleanslate blockquote, .cleanslate dd, .cleanslate fieldset, .cleanslate li, .cleanslate iframe, .cleanslate strong, .cleanslate legend, .cleanslate em, .cleanslate summary, .cleanslate cite, .cleanslate span, .cleanslate input, .cleanslate sup, .cleanslate label, .cleanslate dfn, .cleanslate object, .cleanslate big, .cleanslate q, .cleanslate samp, .cleanslate acronym, .cleanslate small, .cleanslate img, .cleanslate strike, .cleanslate code, .cleanslate sub, .cleanslate ins, .cleanslate textarea, .cleanslate button, .cleanslate var, .cleanslate a, .cleanslate abbr, .cleanslate applet, .cleanslate del, .cleanslate kbd, .cleanslate tt, .cleanslate b, .cleanslate i, .cleanslate hr,

/* HTML5 - Sept 2013 taken from MDN https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/HTML5_element_list */
.cleanslate article, .cleanslate aside, .cleanslate figure, .cleanslate figcaption, .cleanslate footer, .cleanslate header, .cleanslate menu, .cleanslate nav, .cleanslate section, .cleanslate time, .cleanslate mark, .cleanslate audio, .cleanslate video, .cleanslate abbr, .cleanslate address, .cleanslate area, .cleanslate blockquote, .cleanslate canvas, .cleanslate caption, .cleanslate cite, .cleanslate code, .cleanslate colgroup, .cleanslate col, .cleanslate datalist, .cleanslate fieldset, .cleanslate main, .cleanslate map, .cleanslate meta, .cleanslate optgroup, .cleanslate output, .cleanslate progress {
    background-attachment:scroll !important;
    background-color:transparent !important;
    background-image:none !important; /* This rule affects the use of pngfix JavaScript http://dillerdesign.com/experiment/DD_BelatedPNG for IE6, which is used to force the browser to recognise alpha-transparent PNGs files that replace the IE6 lack of PNG transparency. (The rule overrides the VML image that is used to replace the given CSS background-image). If you don't know what that means, then you probably haven't used the pngfix script, and this comment may be ignored :) */
    background-position:0 0 !important;
    background-repeat:repeat !important;
    border-color:black !important;
    border-color:currentColor !important; /* `border-color` should match font color. Modern browsers (incl. IE9) allow the use of "currentColor" to match the current font 'color' value <http://www.w3.org/TR/css3-color/#currentcolor>. For older browsers, a default of 'black' is given before this rule. Guideline to support older browsers: if you haven't already declared a border-color for an element, be sure to do so, e.g. when you first declare the border-width. */
    border-radius:0 !important;
    border-style:none !important;
    border-width:medium !important;
    bottom:auto !important;
    clear:none !important;
    clip:auto !important;
    color:inherit !important;
    counter-increment:none !important;
    counter-reset:none !important;
    cursor:auto !important;
    direction:inherit !important;
    display:inline !important;
    float:none !important;
    font-family: inherit !important; /* As with other inherit values, this needs to be set on the root container element */
    font-size: inherit !important;
    font-style:inherit !important;
    font-variant:normal !important;
    font-weight:inherit !important;
    height:auto !important;
    left:auto !important;
    letter-spacing:normal !important;
    line-height:inherit !important;
    list-style-type: inherit !important; /* Could set list-style-type to none */
    list-style-position: outside !important;
    list-style-image: none !important;
    margin:0 !important;
    max-height:none !important;
    max-width:none !important;
    min-height:0 !important;
    min-width:0 !important;
    opacity:1;
    outline:invert none medium !important;
    overflow:visible !important;
    padding:0 !important;
    position:static !important;
    quotes: "" "" !important;
    right:auto !important;
    table-layout:auto !important;
    text-align:inherit !important;
    text-decoration:inherit !important;
    text-indent:0 !important;
    text-transform:none !important;
    top:auto !important;
    unicode-bidi:normal !important;
    vertical-align:baseline !important;
    visibility:inherit !important;
    white-space:normal !important;
    width:auto !important;
    word-spacing:normal !important;
    z-index:auto !important;
    
    /* CSS3 */
    /* Including all prefixes according to http://caniuse.com/ */
    /* CSS Animations don't cascade, so don't require resetting */
    -webkit-background-origin: padding-box !important;
            background-origin: padding-box !important;
    -webkit-background-clip: border-box !important;
            background-clip: border-box !important;
    -webkit-background-size: auto !important;
       -moz-background-size: auto !important;
            background-size: auto !important;
    -webkit-border-image: none !important;
       -moz-border-image: none !important;
         -o-border-image: none !important;
            border-image: none !important;
    -webkit-border-radius:0 !important;
       -moz-border-radius:0 !important;
            border-radius: 0 !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
    -webkit-box-sizing: content-box !important;
       -moz-box-sizing: content-box !important;
            box-sizing: content-box !important;
    -webkit-column-count: auto !important;
       -moz-column-count: auto !important;
            column-count: auto !important;
    -webkit-column-gap: normal !important;
       -moz-column-gap: normal !important;
            column-gap: normal !important;
    -webkit-column-rule: medium none black !important;
       -moz-column-rule: medium none black !important;
            column-rule: medium none black !important;
    -webkit-column-span: 1 !important;
       -moz-column-span: 1 !important; /* doesn't exist yet but probably will */
            column-span: 1 !important;
    -webkit-column-width: auto !important;
       -moz-column-width: auto !important;
            column-width: auto !important;
    font-feature-settings: normal !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    -webkit-hyphens: manual !important;
       -moz-hyphens: manual !important;
            hyphens: manual !important;
    -webkit-perspective: none !important;
       -moz-perspective: none !important;
        -ms-perspective: none !important;
         -o-perspective: none !important;
            perspective: none !important;
    -webkit-perspective-origin: 50% 50% !important;
       -moz-perspective-origin: 50% 50% !important;
        -ms-perspective-origin: 50% 50% !important;
         -o-perspective-origin: 50% 50% !important;
            perspective-origin: 50% 50% !important;
    -webkit-backface-visibility: visible !important;
       -moz-backface-visibility: visible !important;
        -ms-backface-visibility: visible !important;
         -o-backface-visibility: visible !important;
            backface-visibility: visible !important;
    text-shadow: none !important;
    -webkit-transition: all 0s ease 0s !important;
            transition: all 0s ease 0s !important;
    -webkit-transform: none !important;
       -moz-transform: none !important;
        -ms-transform: none !important;
         -o-transform: none !important;
            transform: none !important;
    -webkit-transform-origin: 50% 50% !important;
       -moz-transform-origin: 50% 50% !important;
        -ms-transform-origin: 50% 50% !important;
         -o-transform-origin: 50% 50% !important;
            transform-origin: 50% 50% !important;
    -webkit-transform-style: flat !important;
       -moz-transform-style: flat !important;
        -ms-transform-style: flat !important;
         -o-transform-style: flat !important;
            transform-style: flat !important;
    word-break: normal !important;
}

/* == BLOCK-LEVEL == */
/* Actually, some of these should be inline-block and other values, but block works fine (TODO: rigorously verify this) */
/* HTML 4.01 */
.cleanslate, .cleanslate h3, .cleanslate h5, .cleanslate p, .cleanslate h1, .cleanslate dl, .cleanslate dt, .cleanslate h6, .cleanslate ol, .cleanslate form, .cleanslate option, .cleanslate pre, .cleanslate div, .cleanslate h2, .cleanslate caption, .cleanslate h4, .cleanslate ul, .cleanslate address, .cleanslate blockquote, .cleanslate dd, .cleanslate fieldset, .cleanslate hr,

/* HTML5 new elements */
.cleanslate article, .cleanslate dialog, .cleanslate figure, .cleanslate footer, .cleanslate header, .cleanslate hgroup, .cleanslate menu, .cleanslate nav, .cleanslate section, .cleanslate audio, .cleanslate video, .cleanslate address, .cleanslate blockquote, .cleanslate colgroup, .cleanslate main, .cleanslate progress, .cleanslate summary {
    display:block !important; 
}
.cleanslate h1, .cleanslate h2, .cleanslate h3, .cleanslate h4, .cleanslate h5, .cleanslate h6 {
    font-weight: bold !important;
}
.cleanslate h1 {
    font-size: 2em !important;
    padding: .67em 0 !important;
}
.cleanslate h2 {
    font-size: 1.5em !important;
    padding: .83em 0 !important;
}
.cleanslate h3 {
    font-size: 1.17em !important;
    padding: .83em 0 !important;
}
.cleanslate h4 {
    font-size: 1em !important;
}
.cleanslate h5 {
    font-size: .83em !important;
}
.cleanslate p {
    margin: 1em 0 !important;
}
.cleanslate table {
    display: table !important;
}
.cleanslate thead {
    display: table-header-group !important;
}
.cleanslate tbody {
    display: table-row-group !important;
}
.cleanslate tfoot {
    display: table-footer-group !important;
}
.cleanslate tr {
    display: table-row !important;
}
.cleanslate th, .cleanslate td {
    display: table-cell !important;
    padding: 2px !important;
}

/* == SPECIFIC ELEMENTS == */
/* Some of these are browser defaults; some are just useful resets */
.cleanslate ol, .cleanslate ul {
    margin: 1em 0 !important;
}
.cleanslate ul li, .cleanslate ul ul li, .cleanslate ul ul ul li, .cleanslate ol li, .cleanslate ol ol li, .cleanslate ol ol ol li, .cleanslate ul ol ol li, .cleanslate ul ul ol li, .cleanslate ol ul ul li, .cleanslate ol ol ul li {
    list-style-position: inside !important;
    margin-top: .08em !important;
}
.cleanslate ol ol, .cleanslate ol ol ol, .cleanslate ul ul, .cleanslate ul ul ul, .cleanslate ol ul, .cleanslate ol ul ul, .cleanslate ol ol ul, .cleanslate ul ol, .cleanslate ul ol ol, .cleanslate ul ul ol {
    padding-left: 40px !important;
    margin: 0 !important;
}
/* helper for general navigation */
.cleanslate nav ul, .cleanslate nav ol {
    list-style-type:none !important;

}
.cleanslate ul, .cleanslate menu {
    list-style-type:disc !important;
}
.cleanslate ol {
    list-style-type:decimal !important;
}
.cleanslate ol ul, .cleanslate ul ul, .cleanslate menu ul, .cleanslate ol menu, .cleanslate ul menu, .cleanslate menu menu {
    list-style-type:circle !important;
}
.cleanslate ol ol ul, .cleanslate ol ul ul, .cleanslate ol menu ul, .cleanslate ol ol menu, .cleanslate ol ul menu, .cleanslate ol menu menu, .cleanslate ul ol ul, .cleanslate ul ul ul, .cleanslate ul menu ul, .cleanslate ul ol menu, .cleanslate ul ul menu, .cleanslate ul menu menu, .cleanslate menu ol ul, .cleanslate menu ul ul, .cleanslate menu menu ul, .cleanslate menu ol menu, .cleanslate menu ul menu, .cleanslate menu menu menu {
    list-style-type:square !important;
}
.cleanslate li {    
    display:list-item !important;
    /* Fixes IE7 issue with positioning of nested bullets */
    min-height:auto !important;
    min-width:auto !important;
    padding-left: 20px !important; /* replace -webkit-padding-start: 40px; */
}
.cleanslate strong {
    font-weight:bold !important;
}
.cleanslate em {
    font-style:italic !important;
}
.cleanslate kbd, .cleanslate samp, .cleanslate code, .cleanslate pre {
  font-family:monospace !important;
}
.cleanslate a {
    color: blue !important;
    text-decoration: underline !important;
}
.cleanslate a:visited {
    color: #529 !important;
}
.cleanslate a, .cleanslate a *, .cleanslate input[type=submit], .cleanslate input[type=radio], .cleanslate input[type=checkbox], .cleanslate select {
    cursor:pointer !important;
}
.cleanslate button, .cleanslate input[type=submit] {
    text-align: center !important;
    padding: 2px 6px 3px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    font-family: arial, helvetica, sans-serif !important;
    font-size: small !important;
    background: white !important;
    -webkit-appearance: push-button !important;
    color: buttontext !important;
    border: 1px #a6a6a6 solid !important;
    background: lightgrey !important; /* Old browsers */
    background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%, rgba(209,209,209,1) 100%, rgba(221,221,221,1) 100%) !important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(221,221,221,1)), color-stop(100%,rgba(209,209,209,1)), color-stop(100%,rgba(221,221,221,1))) !important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%,rgba(209,209,209,1) 100%,rgba(221,221,221,1) 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%,rgba(209,209,209,1) 100%,rgba(221,221,221,1) 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%,rgba(209,209,209,1) 100%,rgba(221,221,221,1) 100%) !important; /* IE10+ */
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%,rgba(209,209,209,1) 100%,rgba(221,221,221,1) 100%) !important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ) !important; /* IE6-9 */
    -webkit-box-shadow: 1px 1px 0px #eee !important;
       -moz-box-shadow: 1px 1px 0px #eee !important;
         -o-box-shadow: 1px 1px 0px #eee !important;
            box-shadow: 1px 1px 0px #eee !important;
    outline: initial !important;
}
.cleanslate button {
    padding: 1px 6px 2px 6px !important;
    margin-right: 5px !important;
}
.cleanslate input[type=hidden] {
    display:none !important;
}
/* restore form defaults */
.cleanslate textarea {
    -webkit-appearance: textarea !important;
    background: white !important;
    padding: 2px !important;
    margin-left: 4px !important;
    word-wrap: break-word !important;
    white-space: pre-wrap !important;
    font-size: 11px !important;
    font-family: arial, helvetica, sans-serif !important;
    line-height: 13px !important;
    resize: both !important;
}
.cleanslate select, .cleanslate textarea, .cleanslate input {
    border:1px solid #ccc !important;
}
.cleanslate select {
    font-size: 11px !important;
    font-family: helvetica, arial, sans-serif !important;
    display: inline-block;
}
.cleanslate textarea:focus, .cleanslate input:focus {
    outline: auto 5px -webkit-focus-ring-color !important;
    outline: initial !important;
}
.cleanslate input[type=text] {
    background: white !important;
    padding: 1px !important;
    font-family: initial !important;
    font-size: small !important;
}
.cleanslate input[type=checkbox], .cleanslate input[type=radio] {
    border: 1px #2b2b2b solid !important;
    border-radius: 4px !important;
}
.cleanslate input[type=checkbox], .cleanslate input[type=radio] {
    outline: intial !important;
}
.cleanslate input[type=radio] {
    margin: 2px 2px 3px 2px !important;
}
.cleanslate input[type=submit]:active, .cleanslate button:active {
    background: rgb(59,103,158) !important; /* Old browsers */
    background: -moz-linear-gradient(top, rgba(59,103,158,1) 0%, rgba(43,136,217,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%) !important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(59,103,158,1)), color-stop(50%,rgba(43,136,217,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))) !important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%) !important; /* IE10+ */
    background: linear-gradient(to bottom, rgba(59,103,158,1) 0%,rgba(43,136,217,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%) !important; /* W3C */
    border-color: #5259b0 !important;
}
.cleanslate abbr[title], .cleanslate acronym[title], .cleanslate dfn[title] {
    cursor:help !important;
    border-bottom-width:1px !important;
    border-bottom-style:dotted !important;
}
.cleanslate ins {
    background-color:#ff9 !important;
    color:black !important;
}
.cleanslate del {
    text-decoration: line-through !important;
}
.cleanslate blockquote, .cleanslate q  {
    quotes:none !important; /* HTML5 */
}
.cleanslate blockquote:before, .cleanslate blockquote:after, .cleanslate q:before, .cleanslate q:after, .cleanslate li:before, .cleanslate li:after  {
    content:"" !important;
}
.cleanslate input, .cleanslate select {
    vertical-align:middle !important;
}

.cleanslate table {
    border-collapse:collapse !important;
    border-spacing:0 !important;
}
.cleanslate hr {
    display:block !important;
    height:1px !important;
    border:0 !important;
    border-top:1px solid #ccc !important;
    margin:1em 0 !important;
}
.cleanslate *[dir=rtl] {
    direction: rtl !important;
}
.cleanslate mark {
    background-color:#ff9 !important;
    color:black !important;
    font-style:italic !important;
    font-weight:bold !important;
}
.cleanslate menu {
    padding-left: 40px !important;
    padding-top: 8px !important;
}

/* additional helpers */
.cleanslate [hidden],
.cleanslate template {
    display: none !important;
}
.cleanslate abbr[title] {
    border-bottom: 1px dotted !important;
}
.cleanslate sub, .cleanslate sup {
    font-size: 75% !important;
    line-height: 0 !important;
    position: relative !important;
    vertical-align: baseline !important;
}
.cleanslate sup {
    top: -0.5em !important;
}
.cleanslate sub {
    bottom: -0.25em !important;
}
.cleanslate img {
    border: 0 !important;
}
.cleanslate figure {
    margin: 0 !important;
}
.cleanslate textarea {
    overflow: auto !important;
    vertical-align: top !important;
}

/* == ROOT CONTAINER ELEMENT == */
/* This contains default values for child elements to inherit  */
.cleanslate {
    font-size: medium !important;
    line-height: 1 !important;
    direction:ltr !important;
    text-align: left !important; /* for IE, Opera */
    text-align: start !important; /* recommended W3C Spec */
    font-family: "Times New Roman", Times, serif !important; /* Override this with whatever font-family is required */
    color: black !important;
    font-style:normal !important;
    font-weight:normal !important;
    text-decoration:none !important;
    list-style-type:disc !important;
}

.cleanslate pre {
    white-space:pre !important;
}
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

.bx-webchat 
html {
  font-family: sans-serif !important; /* 1 */
  -ms-text-size-adjust: 100% !important; /* 2 */
  -webkit-text-size-adjust: 100% !important; /* 2 */
}

/**
 * Remove default margin.
 */

.bx-webchat 
body {
  margin: 0 !important;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

.bx-webchat 
article,
.bx-webchat 
aside,
.bx-webchat 
details,
.bx-webchat 
figcaption,
.bx-webchat 
figure,
.bx-webchat 
footer,
.bx-webchat 
header,
.bx-webchat 
hgroup,
.bx-webchat 
main,
.bx-webchat 
menu,
.bx-webchat 
nav,
.bx-webchat 
section,
.bx-webchat 
summary {
  display: block !important;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

.bx-webchat 
audio,
.bx-webchat 
canvas,
.bx-webchat 
progress,
.bx-webchat 
video {
  display: inline-block !important; /* 1 */
  vertical-align: baseline !important; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

.bx-webchat 
audio:not([controls]) {
  display: none !important;
  height: 0 !important;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */

[hidden],
.bx-webchat 
template {
  display: none !important;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

.bx-webchat 
a {
  background-color: transparent !important;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

.bx-webchat 
a:active,
.bx-webchat 
a:hover {
  outline: 0 !important;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

.bx-webchat 
abbr[title] {
  border-bottom: 1px dotted !important;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

.bx-webchat 
b,
.bx-webchat 
strong {
  font-weight: bold !important;
}

/**
 * Address styling not present in Safari and Chrome.
 */

.bx-webchat 
dfn {
  font-style: italic !important;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

.bx-webchat 
h1 {
  font-size: 2em !important;
  margin: 0.67em 0 !important;
}

/**
 * Address styling not present in IE 8/9.
 */

.bx-webchat 
mark {
  background: #ff0 !important;
  color: #000 !important;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

.bx-webchat 
small {
  font-size: 80% !important;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

.bx-webchat 
sub,
.bx-webchat 
sup {
  font-size: 75% !important;
  line-height: 0 !important;
  position: relative !important;
  vertical-align: baseline !important;
}

.bx-webchat 
sup {
  top: -0.5em !important;
}

.bx-webchat 
sub {
  bottom: -0.25em !important;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

.bx-webchat 
img {
  border: 0 !important;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

.bx-webchat 
svg:not(:root) {
  overflow: hidden !important;
}

/* Grouping content
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

.bx-webchat 
figure {
  margin: 1em 40px !important;
}

/**
 * Address differences between Firefox and other browsers.
 */

.bx-webchat 
hr {
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
  height: 0 !important;
}

/**
 * Contain overflow in all browsers.
 */

.bx-webchat 
pre {
  overflow: auto !important;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

.bx-webchat 
code,
.bx-webchat 
kbd,
.bx-webchat 
pre,
.bx-webchat 
samp {
  font-family: monospace, monospace !important;
  font-size: 1em !important;
}

/* Forms
   ========================================================================== */

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

.bx-webchat 
button,
.bx-webchat 
input,
.bx-webchat 
optgroup,
.bx-webchat 
select,
.bx-webchat 
textarea {
  color: inherit !important; /* 1 */
  font: inherit !important; /* 2 */
  margin: 0 !important; /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

.bx-webchat 
button {
  overflow: visible !important;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */

.bx-webchat 
button,
.bx-webchat 
select {
  text-transform: none !important;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

.bx-webchat 
button,
.bx-webchat 
html input[type="button"], /* 1 */
.bx-webchat 
input[type="reset"],
.bx-webchat 
input[type="submit"] {
  -webkit-appearance: button !important; /* 2 */
  cursor: pointer !important; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

.bx-webchat 
button[disabled],
.bx-webchat 
html input[disabled] {
  cursor: default !important;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

.bx-webchat 
button::-moz-focus-inner,
.bx-webchat 
input::-moz-focus-inner {
  border: 0 !important;
  padding: 0 !important;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

.bx-webchat 
input {
  line-height: normal !important;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

.bx-webchat 
input[type="checkbox"],
.bx-webchat 
input[type="radio"] {
  box-sizing: border-box !important; /* 1 */
  padding: 0 !important; /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

.bx-webchat 
input[type="number"]::-webkit-inner-spin-button,
.bx-webchat 
input[type="number"]::-webkit-outer-spin-button {
  height: auto !important;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */

.bx-webchat 
input[type="search"] {
  -webkit-appearance: textfield !important; /* 1 */
  -moz-box-sizing: content-box !important;
  -webkit-box-sizing: content-box !important; /* 2 */
  box-sizing: content-box !important;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

.bx-webchat 
input[type="search"]::-webkit-search-cancel-button,
.bx-webchat 
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none !important;
}

/**
 * Define consistent border, margin, and padding.
 */

.bx-webchat 
fieldset {
  border: 1px solid #c0c0c0 !important;
  margin: 0 2px !important;
  padding: 0.35em 0.625em 0.75em !important;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

.bx-webchat 
legend {
  border: 0 !important; /* 1 */
  padding: 0 !important; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

.bx-webchat 
textarea {
  overflow: auto !important;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */

.bx-webchat 
optgroup {
  font-weight: bold !important;
}

/* Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

.bx-webchat 
table {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
}

.bx-webchat 
td,
.bx-webchat 
th {
  padding: 0 !important;
}

.bx-webchat {
	color: #333 !important;
}

.bx-webchat,
.bx-webchat *,
.bx-webchat h1,
.bx-webchat span,
.bx-webchat p {
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
	-ms-user-select: none !important;
	user-select: none !important;
	cursor: default !important;
}

.bx-webchat * input,
.bx-webchat * textarea {
	-webkit-user-select: text !important;
	-moz-user-select: text !important;
	-ms-user-select: text !important;
	user-select: text !important;
	cursor: auto !important;
}

.bx-webchat i,
.bx-webchat cite,
.bx-webchat em,
.bx-webchat dfn {
	font-style: italic !important;
}

.bx-webchat ::-webkit-input-placeholder {
	color: #666 !important;
}

.bx-webchat :-moz-placeholder {
	color: #666 !important;
}

.bx-webchat ::-moz-placeholder {
	color: #666 !important;
}

.bx-webchat :-ms-input-placeholder {
	color: #666 !important;
}

.bx-webchat.overlay {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	background: white !important;
	opacity: 0.7 !important;
	z-index: 2147483645 !important;
}

.bx-webchat.dialogue {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	z-index: 2147483646 !important;
	width: 100% !important;
	height: 100% !important;
	display: table !important;
}

.bx-webchat.dialogue .centrer {
	display: table-cell !important;
	vertical-align: middle !important;
}

.bx-webchat.embedded {
	background: white !important;
	min-width: 400px !important;
}

.bx-webchat.floating {
	position: fixed !important;
	bottom: 0 !important;
	right: 0 !important;
	height: auto !important;
	top: auto !important;
	width: auto !important;
	z-index: 2147483643 !important;
	padding: 25px !important;
	width: 400px !important;
}

.bx-webchat.embedded .container {
	position: absolute !important;
}

.bx-webchat.dialogue .container,
.bx-webchat.floating .container {
	-webkit-border-radius: 7px !important;
	-moz-border-radius: 7px !important;
	border-radius: 7px !important;
	box-shadow: 3px 3px 18px 0px rgba( 0, 0, 0, 0.7 ) !important;
	overflow: hidden !important;
	background: white !important;
}

.bx-webchat.fixed-height .container {
	height: 100% !important;
}

.bx-webchat .pane {
	line-height: 1.5 !important;
	font-family: "Avenir Next","Helvetica Neue",Arial,sans-serif !important;
	background: white !important;
	overflow: hidden !important;
}

.bx-webchat.dialogue .container {
	width: 50% !important;
	min-width: 300px !important;
	max-width: 400px !important;
	margin: 0 auto !important;
}

.bx-webchat.dialogue .pane {
	width: 100% !important;
}

.bx-webchat.dialogue .pane,
.bx-webchat.floating .pane {
	-webkit-border-radius: 7px !important;
	-moz-border-radius: 7px !important;
	border-radius: 7px !important;
}

.bx-webchat.embedded .pane {
	border: 2px solid #aaa !important;
}

.bx-webchat .splash-pane .content:hover,
.bx-webchat .error-pane .content:hover,
.bx-webchat .other-client-pane .content:hover {
	background: #f4f4f4 !important;
}

.bx-webchat .splash-pane .content,
.bx-webchat .splash-pane .content *,
.bx-webchat .error-pane .content,
.bx-webchat .error-pane .content *,
.bx-webchat .other-client-pane .content,
.bx-webchat .other-client-pane .content * {
	cursor: pointer !important;
}

.bx-webchat.embedded .splash-pane .content,
.bx-webchat.fixed-height .splash-pane .content,
.bx-webchat.embedded .error-pane .content,
.bx-webchat.fixed-height .error-pane .content,
.bx-webchat.embedded .other-client-pane .content,
.bx-webchat.fixed-height .other-client-pane .content {
	margin: 1em !important;
	border: 2px #eee solid !important;
}

.bx-webchat .splash-pane .content img {
	float: left !important;
	margin: 1.5em 0 0 1.7em !important;
}

.bx-webchat .error-pane .content img,
.bx-webchat .other-client-pane .content img {
	float: left !important;
	margin: 1.6em 0 1.3em 1.7em !important;
}

.bx-webchat .connecting-pane .content img {
	float: left !important;
	margin: 1.5em 0.5em 0 7em !important;
}

.bx-webchat.embedded .connecting-pane .content,
.bx-webchat.fixed-height .connecting-pane .content {
	margin-top: 2em !important;
}

.bx-webchat .splash-pane p {
	padding: 0.6em 2em 0.5em 6.5em !important;
}

.bx-webchat .error-pane p,
.bx-webchat .other-client-pane p,
.bx-webchat .connecting-pane p {
	padding: 0.5em 2em 0.5em 5.5em !important;
}

.bx-webchat.fixed-height .splash-pane,
.bx-webchat.fixed-height .connecting-pane,
.bx-webchat.fixed-height .error-pane,
.bx-webchat.fixed-height .other-client-pane {
	height: 100% !important;
}

.bx-webchat h1 {
	margin: 0 !important;
	color: white !important;
	background: #555 !important;
	font-size: 18px !important;
	font-weight: normal !important;
	padding: 5px 1em !important;
}

.bx-webchat.floating h1 > .title,
.bx-webchat.embedded h1 > .title {
	margin-left: 50px !important;
}

.bx-webchat h1 > img {
	width: 51px !important;
	height: 51px !important;
	position: absolute !important;
	top: -8px !important;
	left: 10px !important;
	z-index: 2147483644 !important;
/* nice floating circular icon with a shadow
	-webkit-border-radius: 26px !important;
	-moz-border-radius: 26px !important;
	border-radius: 26px !important;
	box-shadow: 2px 2px 5px 0px rgba( 0, 0, 0, 0.3 ) !important; */
}

.bx-webchat.floating h1 > img {
	top: 17px !important;
	left: 35px !important;
}

.bx-webchat h1 > input[type=button] {
	border: none !important;
	margin: 0 -0.65em 0 0 !important;
	padding: 1px 0.5em !important;
	float: right !important;
	color: #aaa !important;
	text-align: center !important;
	cursor: pointer !important;
	line-height: 25px !important;
	font-size: 19px !important;
	-webkit-border-top-right-radius: 3px !important;
	-moz-border-radius-topright: 3px !important;
	border-top-right-radius: 3px !important;
}

.bx-webchat h1 > input[type=button]:focus {
	background-color: #444 !important;
	box-shadow: 0 0 5px 0 rgba(119, 187, 255, 0.7) !important;
}

.bx-webchat h1 > input[type=button]:hover:enabled {
	background-color: #6c6c6c !important;
}

.bx-webchat h1 > input[type=button]:active:enabled {
	padding-top: 2px !important;
	padding-bottom: 0 !important;
}

.bx-webchat h1 > input[type=button]:disabled {
	color: #666 !important;
	cursor: inherit !important;
}

.bx-webchat h1 > p.status {
	float: right !important;
	margin: 0.3em 0 0 0 !important;
	padding: 0 0.5em 0 0 !important;
	color: #4d4 !important;
	font-size: 13px !important;
	font-weight: bold !important;
}

.bx-webchat h1 > p.status.offline {
	color: #f55 !important;
}

.bx-webchat .content {
	overflow: auto !important;
	overflow-wrap: break-word !important;
}

.bx-webchat.dynamic-height .content {
	max-height: 500px !important;
}

.bx-webchat p {
	padding: 0 1em !important;
	font-size: 15px !important;
}

.bx-webchat .gutter {
	width: 100% !important;
	border-top: 1px solid #aaa !important;
}

.bx-webchat .gutter textarea {
	overflow: hidden !important;
	border-right: 1px solid #aaa !important;
	outline: none !important;
	resize: none !important;
	padding: 10px !important;
	margin: 0 !important;
	border: 0 !important;
	border-right: 1px solid #aaa !important;
	font-family: "Avenir Next","Helvetica Neue",Arial,sans-serif !important;
	line-height: 1.2 !important;
	font-size: 13px !important;
}

.bx-webchat .gutter textarea:disabled {
	background-color: #eee !important;
	cursor: default !important;
}

.bx-webchat .chat-pane .gutter input[type=button] {
	float: right !important;
	width: 48px !important;
	text-align: center !important;
	padding: 10px 1px !important;
	margin: 0 !important;
	border: 0 !important;
	background: #f4f4f4 !important;
	font-size: 13px !important;
	color: #555 !important;
}

.bx-webchat .chat-pane .gutter input[type=button]:disabled {
	color: #bbb !important;
}

.bx-webchat .chat-pane .gutter input[type=button]:focus:enabled {
	box-shadow: 0 0 5px 0 rgba(119, 187, 255, 0.7) !important;
	background-color: #e7e7e7 !important;
	border-top: 1px solid #7bf !important;
	border-left: 1px solid #7bf !important;
	padding-top: 9px !important;
	padding-left: 0 !important;
}

.bx-webchat .chat-pane .gutter input[type=button]:active:enabled {
	padding: 11px 0 9px 0 !important;
}

.bx-webchat .chat-pane .content * {
	-webkit-user-select: text !important;
	-moz-user-select: text !important;
	-ms-user-select: text !important;
	user-select: text !important;
}

.bx-webchat .chat-pane .content .title {
	font-weight: bold !important;
	color: #666 !important;
}

.bx-webchat .chat-pane .item a {
	color: #59d !important;
	text-decoration: none !important;
}

.bx-webchat .chat-pane .item a:hover,
.bx-webchat .chat-pane .item a:active {
	text-decoration: underline !important;
}

.bx-webchat .chat-pane .message {
	-webkit-border-radius: 5px !important;
	-moz-border-radius: 5px !important;
	border-radius: 5px !important;
	margin: 1em !important;
	padding: 0.6em 1em !important;
    text-overflow: ellipsis !important;
}

.bx-webchat .chat-pane .message-agent {
	background: #eee !important;
	margin-right: 2em !important;
}

.bx-webchat .chat-pane .message-agent::after {
	border-color: transparent #eee !important;
	border-width: .6em 1.2em .6em 0 !important;
	border-style: solid !important;
	content: "" !important;
	display: block !important;
	width: 0 !important;
	float: left !important;
	margin-left: -2em !important;
}

.bx-webchat .chat-pane .message-user {
	background: #ddd !important;
	margin-left: 2em !important;
}

.bx-webchat .chat-pane .message-user::after {
	border-color: transparent #ddd !important;
	border-width: .6em 0 .6em 1.2em !important;
	border-style: solid !important;
	content: "" !important;
	display: block !important;
	width: 0 !important;
	float: right !important;
	margin: 0.4em -2em 0 0 !important;
}

.bx-webchat .chat-pane .sender {
	color: #777 !important;
}

.bx-webchat .chat-pane .timestamp {
	display: block !important;
	float: right !important;
	font-size: 10px !important;
	font-weight: normal !important;
	margin: -0.7em -1em -100% 0 !important;
	color: #999 !important;
	-webkit-user-select: all !important;
	-moz-user-select: all !important;
	-ms-user-select: all !important;
	user-select: all !important;
}

.bx-webchat .chat-pane .pending {
	float: left !important;
	margin: 0.7em 0 0 7px !important;
}

.bx-webchat .chat-pane .typing {
	margin: 1em !important;
	display: block !important;
}

.bx-webchat .chat-pane .notification {
	text-align: center !important;
	font-style: italic !important;
	color: #999 !important;
}

.bx-webchat .chat-pane .form {
	background: #f4f4f4 !important;
	-webkit-border-radius: 4px !important;
	-moz-border-radius: 4px !important;
	border-radius: 4px !important;
	margin: 1em !important;
	border: 2px #eee solid !important;
}

.bx-webchat .chat-pane .field {
	margin: 0.5em 0 0 0 !important;
	color: #666 !important;
}

.bx-webchat .chat-pane .response {
	margin: 0 0 0.5em 1em !important;
}

.bx-webchat .chat-pane .email-me {
	height: 20px !important;
	padding: 2px 0 3px 37px !important;
	margin: 0 1px -100px 0 !important;
	-webkit-border-bottom-left-radius: 5px !important;
	-moz-border-radius-bottomleft: 5px !important;
	border-bottom-left-radius: 5px !important;
	-webkit-border-bottom-right-radius: 5px !important;
	-moz-border-radius-bottomright: 5px !important;
	border-bottom-right-radius: 5px !important;
	border-left: 2px white solid !important;
	border-bottom: 2px white solid !important;
	border-right: 2px white solid !important;
	background: #7bf url( "img/email.png" ) no-repeat 12px !important;
	font-size: 13px !important;
	font-weight: bold !important;
	position: absolute !important;
	right: 25px !important;
	cursor: pointer !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	color: white !important;
	text-decoration: none !important;
}

.bx-webchat.embedded .chat-pane .email-me {
	right: 0px !important;
}

.bx-webchat .chat-pane .email-me:hover,
.bx-webchat .chat-pane .email-me:focus {
	padding-right: 0.8em !important;
	padding-left: 33px !important;
}

.bx-webchat .chat-pane .email-me:focus {
	background-color: #6ae !important;
}

.bx-webchat .form-pane .field {
	font-weight: bold !important;
	color: #777 !important;
}

.bx-webchat .form-pane .field.field-message,
.bx-webchat .form-pane .field input,
.bx-webchat .form-pane .field label,
.bx-webchat .form-pane .field option,
.bx-webchat .form-pane .field select {
	font-weight: normal !important;
}

.bx-webchat .form-pane .gutter input[type=button] {
	box-sizing: border-box !important;
	width: 100% !important;
	text-align: center !important;
	padding: 10px 0 !important;
	margin: 0 !important;
	border: 0 !important;
	background: #f4f4f4 !important;
}

.bx-webchat .form-pane .gutter input[type=button]:focus {
	box-shadow: 0 0 5px 0 rgba(119, 187, 255, 0.7) !important;
	background-color: #e7e7e7 !important;
	border-top: 1px solid #7bf !important;
	padding-top: 9px !important;
}

.bx-webchat .form-pane .gutter input[type=button]:active {
	padding-top: 10px !important;
	padding-bottom: 9px !important;
	border-bottom: 0 !important;
}

.bx-webchat.dialogue .content input,
.bx-webchat .form-pane .content input,
.bx-webchat .form-pane .content select {
	font-family: inherit !important;
	font-size: inherit !important;
	margin: 0 !important;
	border: 1px solid #ddd !important;
	-webkit-border-radius: 3px !important;
	-moz-border-radius: 3px !important;
	border-radius: 3px !important;
	padding: 0.3em 0.5em !important;
	box-sizing: border-box !important;
	width: 100% !important;
}

.bx-webchat .form-pane .content input[type=radio],
.bx-webchat .form-pane .content input[type=checkbox] {
	width: auto !important;
	margin: -2px 0.5em 0 0.2em !important;
	border-color: transparent !important; /* fix for IE */
}

.bx-webchat .form-pane .content input[type=radio]:focus,
.bx-webchat .form-pane .content input[type=checkbox]:focus {
	border-color: transparent !important; /* fix for IE */
}

.bx-webchat.dialogue .field {
	margin: 1em 0 !important;
}

.bx-webchat.dialogue .indent {
	margin-left: 1.5em !important;
	margin-right: 1.5em !important;
	color: #666 !important;
}

.bx-webchat.dialogue .field.submit {
	padding: 1em !important;
	background: #f4f4f4 !important;
	margin-bottom: 0 !important;
}

.bx-webchat.dialogue .content .columns {
	clear: both !important;
	box-sizing: border-box !important;
	width: 100% !important;
}

.bx-webchat.dialogue .content .left-side {
	width: 49% !important;
}

.bx-webchat.dialogue .content .right-side {
	float: right !important;
	width: 49% !important;
}

.bx-webchat.dialogue .content .centred {
	width: 70% !important;
	margin: 0 15% !important;
}

.bx-webchat.dialogue .content input[type=submit],
.bx-webchat.dialogue .content input[type=button] {
	text-align: center !important;
}

.bx-webchat.dialogue .content input[type=submit] {
	border: #7bf 1px solid !important;
	background: #7bf !important;
	color: white !important;
}

.bx-webchat.dialogue .content input[type=button] {
	background: #ddd !important;
}

.bx-webchat.dialogue .content input[type=button]:focus {
	background-color: #d0d0d0 !important;
}

.bx-webchat.dialogue .content input[type=button].selected {
	border-color: #7bf !important;
	background: #7bf !important;
	color: white !important;
}

.bx-webchat.dialogue .content input[type=button].selected:focus {
	background-color: #6ae !important;
}

.bx-webchat .form-pane .content label {
	display: block !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.bx-webchat .form-pane .content *.error,
.bx-webchat .form-pane .content *:focus.error
.bx-webchat.dialogue .content *.error,
.bx-webchat.dialogue .content *:focus.error {
	border: 1px solid #f40 !important;
	-webkit-border-radius: 3px !important;
	-moz-border-radius: 3px !important;
	border-radius: 3px !important;
	box-sizing: border-box !important;
}

.bx-webchat.dialogue .content input:focus,
.bx-webchat .form-pane .content input:focus,
.bx-webchat .form-pane .content select:focus {
	border: 1px solid #7bf !important;
	box-shadow: 0 0 5px 0 rgba(119, 187, 255, 0.7) !important;
}

.bx-webchat.dialogue .content input[type=submit]:focus {
	background: #6ae !important;
}

.bx-webchat .form-pane .fail-message,
.bx-webchat.dialogue .fail-message {
	display: block !important;
	background: #f50 !important;
	color: white !important;
	-webkit-border-radius: 3px !important;
	-moz-border-radius: 3px !important;
	border-radius: 3px !important;
	margin: .3em 0 0 0 !important;
	padding: 0.2em 0.5em !important;
}

.bx-webchat .form-pane .fail-message::before,
.bx-webchat.dialogue .fail-message::before {
	border-color: #f50 transparent !important;
	border-width: 0 1em .5em 1em !important;
	border-style: solid !important;
	content: "" !important;
	display: block !important;
	width: 0 !important;
	float: left !important;
	margin-top: -0.5em !important;
	margin-left: 1em !important;
}

.bx-webchat.dialogue .email-entry-div {
	overflow: hidden !important;
	clear: both !important;
}

/* Local Variables: */
/* compile-command: "make -C .." */
/* End: */