﻿ @font-face {
     font-family: 'livechat-modern';
     src: url('//cdn.livechatinc.com/fonts/modern/livechat-modern_fa44078c17.eot?ekgvz6');
     src: url('//cdn.livechatinc.com/fonts/modern/livechat-modern_fa44078c17.eot?ekgvz6#iefix') format('embedded-opentype'), url('//cdn.livechatinc.com/fonts/modern/livechat-modern_7cf45543dc.ttf?ekgvz6') format('truetype'), url('//cdn.livechatinc.com/fonts/modern/livechat-modern_27a85e5f71.woff?ekgvz6') format('woff'), url('//cdn.livechatinc.com/fonts/modern/livechat-modern_bfb0fd8212.svg?ekgvz6#icomoon') format('svg');
     font-weight: normal;
     font-style: normal;
 }
 #title-container td {
     height: 26px;
     line-height: 26px;
     font-size: 14px;
 }
 [class^="icon-"],
 [class*=" icon-"] {
     /* use !important to prevent issues with browser extensions that change fonts */
     
     font-family: 'livechat-modern' !important;
     speak: none;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     line-height: 1;
     /* Better Font Rendering =========== */
     
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
 }
 .icon-tick:before {
     content: "\e915";
 }
 .icon-leavemessage:before {
     content: "\e90b";
 }
 .icon-agentonline:before {
     content: "\e90c";
 }
 .icon-clip:before {
     content: "\e90d";
 }
 .icon-close:before {
     content: "\e90e";
 }
 .icon-email:before {
     content: "\e90f";
 }
 .icon-maximize:before {
     content: "\e910";
 }
 .icon-minimize:before {
     content: "\e911";
 }
 .icon-mobile:before {
     content: "\e912";
 }
 .icon-thumbs-down:before {
     content: "\e913";
 }
 .icon-thumbs-up:before {
     content: "\e914";
 }
 #title-container,
 .outline {
     background: 0 0
 }
 #confirm-closing p.actions a:hover,
 #confirm-closing p.actions input:hover,
 #send-file:hover,
 .cancel-file-upload.only-bad-files:hover {
     text-decoration: none;
     opacity: .85
 }
 @font-face {
     font-family: Lato;
     font-style: normal;
     font-weight: 300;
     src: local('Lato Light'), local('Lato-Light'), url(https://themes.googleusercontent.com/static/fonts/lato/v6/KT3KS9Aol4WfR6Vas8kNcg.woff) format('woff')
 }
 @font-face {
     font-family: Lato;
     font-style: normal;
     font-weight: 400;
     src: local('Lato Regular'), local('Lato-Regular'), url(https://themes.googleusercontent.com/static/fonts/lato/v6/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff')
 }
 @font-face {
     font-family: Lato;
     font-style: normal;
     font-weight: 700;
     src: local('Lato Bold'), local('Lato-Bold'), url(https://themes.googleusercontent.com/static/fonts/lato/v6/wkfQbvfT_02e2IWO3yYueQ.woff) format('woff')
 }
 #body input,
 #body label,
 #body select,
 #body table,
 #body textarea,
 a,
 body,
 input,
 label,
 select,
 table,
 table#content,
 textarea {
     font-family: Lato, sans-serif!important
 }
 #wrapper {
     background: 0 0!important
 }
 .outline {
     border: 0;
     padding: 15px 15px 0;
     box-shadow: none
 }
 #content {
     padding: 0;
     background: #fff;
     border-radius: 4px 4px 0 0!important;
     box-shadow: 0 2px 25px rgba(0, 0, 0, .2)!important;
     background-clip: padding-box!important
 }
 .title {
     color: #fff;
     font-size: 16px;
     font-weight: 400;
     text-shadow: none
 }
.title-bg,
.title-button,
.title-button:hover {
    background-color: #326bc0
}
 #title-container #minimize {
     margin-top: 0
 }
 #title-container #close-chat {
     margin-left: 0;
     padding: 6px 12px 5px 6px;
     box-sizing: content-box
 }
 #title {
     padding-top: 10px;
     padding-bottom: 10px;
     border-radius: 3px 3px 0 0;
     text-align: center;
 }
 #title #title-text {
     color: #fff;
     font-size: 16px!important;
     font-weight: 400!important;
     text-shadow: none!important
 }
 .title-bg {
     box-shadow: 0 1px 0 #326bc0
 }
 .operator-name {
     color: #000;
     font-size: 16px;
     font-weight: 700
 }
 .operator-role {
     color: #000;
     font-size: 12px
 }
 #operators td {
     background: #f6f6f6!important
 }
 .operator {
     border: none;
     color: #000;
     font-size: 16px
 }
 .operator .author {
     color: #696969;
     font-size: 12px;
     font-weight: 300
 }
 #operators #rating {
     margin-right: 0
 }
 #operators .rating-button {
     width: 26px;
     overflow: hidden;
     border-right: 1px solid #b3b3b3;
     height: 15px!important;
     line-height: 15px!important;
     position: static!important;
     margin-top: 3px;
     margin-right: 8px
 }
 #operators .rating-button span {
     height: 15px;
     line-height: 15px;
     position: static
 }
 #operators a.rate-good .icon-thumbs-up {
     margin: 0 5px 0 0
 }
 .client {
     border: none;
     color: #2d75e0;
     font-size: 16px
 }
 #body label,
 .client .author {
     font-size: 12px;
     font-weight: 300
 }
 .client .author {
     color: #5e98ee
 }
 #body-inner {
     background-color: #fff
 }
 .footer {
     background-color: #f5f5f5;
     color: #b4b4b4
 }
 #footer p {
     line-height: 20px!important
 }
 #footer #social {
     margin-left: 4px;
     margin-top: 1px!important
 }
 #footer #social a {
     padding-top: 1px!important
 }
 .message-wrapper {
     box-shadow: inset 0 6px 6px #444
 }
 .btn a {
     text-shadow: 1px 1px 0 #06a;
     border-top: 1px solid #4bf;
     border-bottom: 1px solid #39f;
     box-shadow: 0 1px 0 #39d, 0 -1px 0 #39d, 1px 0 0 #39d, -1px 0 0 #39d;
     background: #4ae;
     background: -moz-linear-gradient(top, #4ae, #28d);
     background: -webkit-gradient(linear, left top, left bottom, from(#4ae), to(#28d))
 }
 .btn a:hover {
     border-top-color: #5cf;
     border-bottom-color: #3af;
     background: #4bf;
     background: -moz-linear-gradient(top, #4bf, #39d);
     background: -webkit-gradient(linear, left top, left bottom, from(#4bf), to(#39d))
 }
 .btn a:active,
 .btn a:focus {
     border-top-color: #3af;
     border-bottom-color: #38f;
     background: #49d;
     background: -moz-linear-gradient(top, #49d, #17d);
     background: -webkit-gradient(linear, left top, left bottom, from(#49d), to(#17d))
 }
 #content {
     border: 0!important;
     height: 100%
 }
 #body,
 #body-inner,
 #operators .wrapper,
 #textarea-wrapper {
     border: none;
     border-radius: 0;
     box-shadow: none
 }
 #body-container p {
     padding: 12px 10px;
     line-height: 18px
 }
 #message-wrapper {
     padding: 0 0 4px;
     box-shadow: none
 }
 body.mobile #message-wrapper .btn-send {
     color: #000;
     padding: 4px 6px 4px 2px;
     height: auto
 }
 #textarea .footer {
     border-top: 1px solid #c9c9c9;
     height: 10px
 }
#body label {
    /*color: #686868*/
    font-weight:bold;
}
 input.text {
     border: 1px solid #696969;
     border-radius: 3px;
     background-clip: padding-box;
     background-color: #fff;
     padding: 8px 6px;
     width: 100%
 }
 .submit input {
     -webkit-appearance: none;
     border-radius: 2px;
     background-clip: padding-box;
     background-color: #363636!important;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     font-size: 14px;
     color: #fff;
     padding: 9px 6px 11px;
     width: 100%;
     border: 0;
     cursor: pointer
 }
 .submit input:hover {
     opacity: .85
 }
 #content .form {
     width: 80%;
     margin: 0 auto
 }
 #content .form .form_header {
     margin: 10px -20px
 }
 #content .form .form_header p {
     color: #000;
     font-size: 14px;
     line-height: 20px;
     text-align: center
 }
 #message {
     font-size: 16px;
     padding: 5px 0 0 5px;
     /*min-height: 60px!important*/
 }
 #message-placeholder {
     color: #b3b3b3;
     font-size: 16px;
     padding: 5px;
     margin-right: 30px
 }
 #email_transcript_form input[type=submit],
 #operators #rate_me_feedback_form input[type=submit] {
     background-color: #aecf5f;
     font-size: 12px;
     padding: 8px 18px;
     cursor: pointer;
     -webkit-appearance: none
 }
 #operators #rate_me_feedback_form {
     left: 0;
     right: 0
 }
 #operators #rate_me_feedback_form .cancel .or {
     margin-left: 2px;
     color: inherit
 }
 #operators #rate_me_feedback_form .cancel a {
     color: #000
 }
 #operators #rate_me_feedback_form form {
     margin-right: 5px;
     padding-bottom: 5px
 }
 #operators #rate_me_feedback_form textarea.text {
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     border-radius: 0
 }
 #operators #rate_me_feedback_form input[type=submit] {
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
     border-radius: 2px;
     -moz-background-clip: padding;
     -webkit-background-clip: padding-box;
     background-clip: padding-box;
     -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     color: #fff;
     margin-left: 5px;
     border: 0
 }
 #operators #rate_me_feedback_form input[type=submit]:hover {
     opacity: .85
 }
 #operators #rate_me_feedback_form input[type=submit]:disabled {
     background-color: #bcbcbc;
     -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 #acacac;
     -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 #acacac;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 #acacac
 }
 #operators #rate_me_feedback_form input[type=submit]:disabled:hover {
     opacity: 1
 }
 #operators #email_transcript_form {
     border: none;
     margin: 0;
     left: 0;
     right: 0;
     box-shadow: none
 }
 #operators #email_transcript_form form {
     padding-bottom: 5px;
     padding-right: 5px
 }
 #operators #email_transcript_form input[type=text] {
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     border-radius: 0
 }
 #email_transcript_form .text {
     border-color: #abadb3
 }
 #operators #email_transcript_form .cancel span.or {
     color: #b4b4b4;
     margin-left: 2px
 }
 #operators #email_transcript_form .cancel a {
     color: #000
 }
 #email_transcript_form input[type=submit] {
     border-radius: 2px;
     background-clip: padding-box;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     color: #fff;
     margin: 5px 0 0 5px;
     border: 0
 }
 #email_transcript_form input[type=submit]:hover {
     opacity: .85
 }
 #confirm-closing p.actions {
     width: 80%;
     margin: 20px auto
 }
 #confirm-closing p.actions a,
 #confirm-closing p.actions input {
     display: block;
     width: 46%;
     float: left;
     border-radius: 2px;
     background-clip: padding-box;
     font-size: 14px;
     line-height: 14px;
     color: #fff;
     padding: 9px 18px 11px;
     margin-top: 0;
     border: 0;
     cursor: pointer;
     white-space: normal
 }
 #confirm-closing p.actions input {
     -webkit-appearance: none;
     background-color: #e36959;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(192, 80, 64, .45);
     margin-right: 0
 }
 #confirm-closing p.actions a {
     background-color: #a0a0a0;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(0, 0, 0, .1);
     text-transform: capitalize;
     float: right
 }
 #content img.avatar {
     border: none;
     padding: 0;
     border-radius: 0
 }
 body.has-operators-bar #body-inner {
     border: none
 }
 .ajax-loader {
     position: absolute;
     top: 12px;
     right: 20px
 }
 #title-container #close-chat {
     margin-top: -5px;
     margin-right: -5px
 }
 #title-container #minimize {
     height: 29px;
     padding-top: 13px;
     margin-right: 8px
 }
 #popup-file a {
     display: block;
     margin-top: 5px
 }
 #send-file,
 .cancel-file-upload.only-bad-files {
     width: 45%;
     background-clip: padding-box;
     font-size: 14px;
     color: #fff;
     padding: 9px 18px 11px;
     margin-top: 0;
     cursor: pointer;
     white-space: normal;
     display: inline-block
 }
 #send-file {
     -webkit-appearance: none;
     background-color: #aecf5f;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(129, 163, 48, .3);
     border-radius: 2px;
     border: 0
 }
 #popup-file #popup-file-confirm-bad-list li .file-meta,
 #popup-file #popup-file-confirm-list li .file-meta {
     height: 30px;
     line-height: 30px
 }
 #popup-file #popup-file-confirm-bad-list li,
 #popup-file #popup-file-confirm-list li {
     margin-bottom: 6px
 }
 #popup-file #popup-file-confirm-bad-list li .reason {
     line-height: 22px
 }
 #drag-and-drop-mask div {
     top: 50px;
     bottom: 35px
 }
 #send-file-clip {
     bottom: auto;
     top: 6px;
     right: 6px
 }
 .cancel-file-upload.only-bad-files {
     border-radius: 2px;
     border: 0;
     background-color: #a0a0a0;
     box-shadow: 0 2px 0 rgba(0, 0, 0, .1), inset 0 -3px 0 rgba(0, 0, 0, .1)
 }
 #livechat-badge {
     top: 14px!important;
     left: 4px!important;
     height: 30px!important;
     line-height: 30px!important;
     padding: 0 11px!important;
     font-size: 14px!important;
     border: 0!important;
     border-radius: 30px!important;
     background-clip: padding-box!important;
     background-color: #de3625!important;
     box-shadow: none!important
 }
 body.pop-out .outline {
     padding: 0
 }
 .icon-minimize {
     display: inline-block;
     width: 20px;
     font-size: 2px
 }
 .icon-close {
     font-size: 17px
 }
 .icon-thumbs-down,
 .icon-thumbs-up {
     font-size: 14px
 }
 .icon-email {
     font-size: 11px
 }
 .icon-clip {
     font-size: 15px
 }
 .icon-mobile {
     font-size: 11px
 }
 #body .url-preview .details .description {
     font-size: 12px
 }
 #content p.client,
 #content p.operator,
 #content p.system {
     padding-top: 6px
 }
 #notification {
     top: 24px;
     left: 24px;
     font-size: 14px;
     text-shadow: none;
     line-height: 26px
 }
 .last-seen-indicator {
     left: -2px
 }