@charset "utf-8";
/* bootstrap added */
@import url("bootstrap.min.css");
/* font-awesome */
@import url("../vendors/font-awesome/font-awesome.min.css");
/* sweetalert2.min */
@import url("../vendors/sweetalert2/sweetalert2.min.css");

/* CUSTOM */
.ds{-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.default{cursor: default;}
.pointer{cursor: pointer;}
.innerFloat:after{clear: both; content: ""; display: block;  *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML += '<div class="ie7-clear"></div>' );}
.ie7-clear {display: block;clear: both;}
.disAppr{appearance: none; -webkit-appearance: none;}
select.disAppr{padding-right: 1.5em; background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAJCAYAAAA/33wPAAAAvklEQVQoFY2QMQqEMBBFv7ERa/EMXkGw11K8QbDXzuN4BHv7QO6ifUgj7v4UAdlVM8Uwf+b9YZJISnlqrfEUZVlinucnBGKaJgghbiHOyLyFKIoCbdvecpyReYvo/Ma2bajrGtbaC58kCdZ1RZ7nl/4/4d5EsO/7nzl7IUtodBexMMagaRrs+06JLMvcNWmaOv2W/C/TMAyD58dxROgSmvxFFMdxoOs6lliWBXEcuzokXRbRoJRyvqqqQvye+QDMDz1D6yuj9wAAAABJRU5ErkJggg==) no-repeat; background-position: right center; background-size: 18px 7px;}
/* DISABLE INPUT ARROWS */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] {-moz-appearance: textfield;}
.smoothScroll{-webkit-overflow-scrolling: touch; -ms-overflow-style: none; scrollbar-width: none;}

/* SPRITE */
.spriteIcons{display: block; background-image: url("../images/sprite_icons.png"); background-repeat: no-repeat;}
.spriteIcons.search{margin: 2px auto 3px auto; width: 20px; height: 20px; background-position: -160px 0;}

html, body{font-size: 14px; line-height: 18px; font-family: "Arial", "Helvetica", "DejaVu Sans", "Liberation Sans", "Freesans", "sans-serif"; color: #333; background-color: #e7ebf0;}
a, a:hover, a:focus{color: inherit; text-decoration: none;}
label{font-weight: 400;}
.noPadding > [class*="col-"] {padding-right: 0; padding-left: 0;}
.smallPadding > [class*="col-"] {padding-right: 10px; padding-left: 10px;}
h1, h2, h3, h4, h5, h6{margin: 0; padding: 0; color: inherit; font-size: inherit;}
blockquote{font-size: inherit;}
textarea{resize: vertical;}
.borderless th, .borderless td {border-top: none !important;}
.borderless tr:first-child th, .borderless tr:first-child td {padding-top: 0;}
ul{margin: 0; padding: 0; list-style-type: none;}
.myScrollbar::-webkit-scrollbar {width: 3px;background-color: #fff; margin-right: 10px;}
.myScrollbar::-webkit-scrollbar-thumb {background-color: rgb(184, 184, 184);border-radius: 6px;}
.myScrollbar::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 20%);background-color: #fff;border-radius: 6px;}

.wysiwyg{line-height: 24px;}
.wysiwyg img, .wysiwyg media, .wysiwyg iframe, .wysiwyg object, .wysiwyg video{margin: 10px auto; max-width: 100%;}
.wysiwyg img, .wysiwyg media, .wysiwyg object, .wysiwyg video{height: auto;}
.btn-outline-default{border: 1px solid #ddd; background: transparent;}
.transparent-bg{background: transparent;}
.dropdown-item{padding: 10px 1.5rem;}
.dropdown-item:hover{background-color: #d7f3e6;}
.dropdown-item:active{color: #000;}
.entryType{padding: 5px 10px; border: 1px solid #fff; font-weight: normal; text-transform: capitalize;}
.textShadow{text-shadow: 1px 0 1px rgba(0, 0, 0, 1);}
.modal-header{color: #fff; background: #008848;}
.modal-header .close{color: #fff; outline: none;}
.blockUI.blockOverlay{background: rgba(255, 255, 255) !important;}
.blockUI.blockMsg{border: 0 !important; background: transparent !important;}
.scrollToTop{position: absolute; z-index: 2; width: 100%; height: 0; bottom: -80px;}
.scrollToTop.messages{bottom: 120px;}
.scrollToTop .icon{padding: 9px 11px; font-size: 16px; color: #8f8f8f; background: #fff; border: 1px solid #ddd; border-radius: 50%;}

.wrapper{margin: 0 auto; width: 1200px;}
.box{margin-left: auto; margin-right: auto; padding: 30px 30px; border: 1px solid #ddd; box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1); background: #fff;}
.txtMessage{width: 350px !important; height: 40px !important; border: 1px solid #c0c0c0; transition: 0.15s;}
.txtMessage:focus{height: 80px !important;}

#headerMenu{background: transparent; border: 0;}
#headerMenu:hover{background: rgba(255, 255, 255, 0.1);}
#headerMenu:active{background: rgba(255, 255, 255, 0.3);}

#messenger .notSeenNumber{padding: 7px 5px; min-width: 28px; height: 28px; font-size: 14px; font-weight: normal; text-align: center;}
#messenger .notSeenNumber:hover{background: #ce4351;}
#messenger .notSeenNumber:active{background: #d02232;}
#messenger{height: calc(100% - 20px) !important; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; border-radius: 0 0 3px 3px; background: #fff;}
#messenger .sidebar{background: #fafafa; border-right: 1px solid #ddd;}
#messenger .sidebar .header{position: -webkit-sticky; position: sticky; top: 0; z-index: 2; margin-left: -15px; margin-right: -15px; border-bottom: 1px solid #ddd; background: #fff;}
#messenger .header .clearSearch{top: 2px; right: 45px; z-index: 5; padding: 5px 5px; font-size: 15px; color: #888888;}
#messenger .sidebar .heading{margin-left: -15px; margin-right: -15px; padding: 8px 15px; color: #fff; background: #008848;}
#messenger .sidebar .iconSearch{width: 1.25rem; height: 1.25rem;}
#messenger .chatList{position: relative; margin: 5px -10px 5px -10px; padding-right: 5px; overflow-x: hidden; overflow-y: auto;}
#messenger .chatList .item{border-radius: 8px; background: #fff;}
#messenger .chatList .item:hover{border-color: #008848 !important; background: #eafff5;}
#messenger .chatList .item.active, #messenger .chatList .item:active{background: #008848;}
#messenger .chatList .item.active *, #messenger .chatList .item:active *{color: #fff !important; background: transparent !important;}
#messenger .chatList .username{padding-right: 75px; font-size: 14px;}
#messenger .chatList .message, #messenger .chatList .time{color: #8b8b8b;}
#messenger .chatList .notSeen{font-weight: bold; color: #333;}
#messenger .chatList .avatar{height: 54px;}
#messenger .chatList .sourceName{color: #ff2300;}
.sourceName .name{padding: 2px 5px; border: 1px solid #ff2300; border-radius: .2rem;}
#messenger .chatList .time{top: 0; right: 0; z-index: 1; font-size: 12px;}

#messenger .body{background: #fff; transition: 0.1s;}
#messenger .body .welcomeHeading{font-size: 16px;}
#messenger .body .header{border-bottom: 1px solid #ddd;}
#messenger .body .header .avatar{height: 52px;}
#messenger .body .content{margin: 5px 5px 5px 0; padding-right: 5px; overflow-x: hidden; overflow-y: auto;}
#messenger .body .footer{border-top: 1px solid #ddd;}
#messenger .body .btnBack{display: none; margin-left: -15px; outline: none; box-shadow: none;}
#messenger .body .btnBack:hover, #messenger .body .btnBack:active{opacity: 0.65;}
#messenger .chatItem{margin-bottom: 50px;}
#messenger .chatItem .message{padding: 10px 15px 20px 15px; width: 100%; max-width: 55%; background: #d1efe1;}
#messenger .chatItem .meta{bottom: -30px; left: -25px;}
#messenger .chatItem .avatar{width: 50px; padding: 5px 5px; background: #fff; vertical-align: -11px;}
#messenger .chatItem .time{margin-left: 3px; color: #c0c0c0;}
#messenger .chatItem.me .message{float: right;}
#messenger .chatItem.me .meta{left: auto; right: -25px;}
#messenger .chatItem.me .time{float: left; margin-top: 25px; margin-right: 8px;}
#messenger .attachments .item{display: inline-block; width: 45%; margin-right: 3%;}
#messenger .attachments .fileIcon{font-size: 20px;}
#fileUploads{position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;}

#preflightMessage{bottom: 15px; z-index: 1; padding-top: 10px; width: 100%; background: rgba(255, 255, 255, 0.8); border-radius: 0 4px 0 0;}
#preflightMessage .item{display: inline-block; vertical-align: bottom; width: 20%; max-width: 75px; margin: 5px 2% 5px 0;}
#preflightMessage .item .close{top: -8px; right: -8px; z-index: 1; padding: 3px 4px; font-size: 12px; border: 1px solid #c0c0c0; border-radius: 50%; background: #fff;}
#preflightMessage .fileIcon{padding: 9px 10px 19px 10px; font-size: 24px;}
#preflightMessage .item img{height: 61px; object-fit: cover;}
#preflightMessage .loading{top: 27%; left: 0; padding: 2px 2px; background: rgba(0, 0, 0, 0.65); color: #fff; text-shadow: 1px 0 0 #000; text-align: center;}

#login .heading, #footer{padding: 15px 15px; font-size: 15px; color: #fff; background: #008848;}
#login .logo{width: 15%;}
#login .box{margin-top: 65px; margin-bottom: 20px; width: 520px;}
#login .input-group-text{width: 45px;}
#login .form-control{box-shadow: none;}
label.error{flex-basis: 100%; margin-top: 8px; color: #d02232;}

#footer{position: fixed; bottom: 0; left: 0; width: 100%;}

/* ANIMATION KEYFRAMES */
.xtLoading{display: inline-block; width: 25px; height: 25px;}
.xtLoading:after{content: " "; display: block; width: 25px; height: 25px; border-radius: 50%; border: 2px solid #5f5f5f; border-color: #5f5f5f transparent #5f5f5f transparent; animation: xtLoading 0.79s linear infinite;}
@keyframes xtLoading {0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}}

/* DISABLE SCROLLBAR */
/* #messenger .chatList::-webkit-scrollbar, #messenger .body .content::-webkit-scrollbar{display: none; width: 0 !important;} */

/* FACEBOOK COMMENT - RESPONSIVE */
#fbcomments, .fb-comments, .fb-comments[style], .fb-comments iframe[style], .fb-comments span, #fbcomments iframe [style]{width: 100% !important;}

/* RESPONSIVE */
@media screen and (max-width: 1024px) {
    input[type="text"], textarea, select{font-size: 16px !important;}
    .wrapper{width: 100%;}
    .box, #messenger .chatItem .message{max-width: 100%;}

    /* MOBILE */
    .wrapper{overflow-x: hidden;}
    #messenger{height: 100% !important;}
    #messenger .sidebar, #messenger .body{position: absolute; top: 0; left: 0; width: 100%;}
    #messenger .body{left: 100%; z-index: 3;}
    #messenger .body.open{left: 0;}
    #messenger .body .btnBack{display: inline-block;}
}
