:root {
  --bg-blue: #236AA7;/*#236AA7*/
  --white: #fff;
  --bg-blue-hover: #17558a;
  --header-bg:linear-gradient(90deg, rgb(84, 150, 206) 0%, rgb(202, 230, 254) 35%, rgb(219, 237, 253) 100%) ;
}
body { font-family: "Open Sans",sans-serif !important; }
.form-control { font-family: "Open Sans",sans-serif !important; }
a{ font-family: "Open Sans",sans-serif !important; }
input{ font-family: "Open Sans",sans-serif !important; }
select{ font-family: "Open Sans",sans-serif !important; }
.form-group span { font-family: "Open Sans",sans-serif !important; }
@font-face {
  font-family: ‘Proxima Nova’;
  src: url(‘ProximaNova.eot’);
  src: local(‘Proxima Nova Regular’), local(‘Proxima Nova’),
    url(“ProximaNova.woff”) format(“woff”),
    url(“ProximaNova.otf”) format(“opentype”),
    url(“ProximaNova.svg#grablau”) format(“svg”);
}
/*added css for whatsapp web by Tejasvini vyas on 6 Nov2019*/
#location_map,#location_search{ padding: 5px; }
#cover-spin { position:fixed; width:100%;left:0;right:0;top:0;bottom:0; background-color: rgba(255,255,255,0.7); z-index:9999; display:none;}
@-webkit-keyframes spin {
  from {-webkit-transform:rotate(0deg);}
  to {-webkit-transform:rotate(360deg);}
}
@keyframes spin {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}
#cover-spin::after {content:''; display:block; position:absolute; left:48%;top:40%; width:40px;height:40px; border-style:solid;
    border-color:black; border-top-color:transparent; border-width: 4px; border-radius:50%; -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite; }
#cover-spin1 { position:fixed; width:100%; left:0;right:0;top:0;bottom:0; background-color: rgba(255,255,255,0.7); z-index:9999;display:none;}
@-webkit-keyframes spin1 {
  from {-webkit-transform:rotate(0deg);}
  to {-webkit-transform:rotate(360deg);}
}
@keyframes spin1 {
  from {transform:rotate(0deg);}
  to {transform:rotate(360deg);}
}
#cover-spin1::after { content:''; display:block; position:absolute; left:48%;top:40%; width:40px;height:40px; border-style:solid;
    border-color:black; border-top-color:transparent; border-width: 4px; border-radius:50%; -webkit-animation: spin1 .8s linear infinite;
    animation: spin1 .8s linear infinite; }
.profilepic,.chat_list_dsply{ margin: 0px; padding: 0px; }
.chat_list_dsply{padding: 5px; border-bottom: 1px solid #d5d5d5;}
.dspl_phn_cht_lst{ font-weight: 600;padding: 5px;}
.profilepic img{height: 50px; width: 50px;border-radius: 100%;}
.cont_prof img{ height: 50px; width: 50px; border-radius: 100%;}
.dsply_contact{ width: 100%;}
.cont_prof{ width: 20%; float: left; margin-right: 5%;}
.contc_det{ width: 75%; float: left;}
.gry_brdr{ border-top: 1px solid #b9b8b8; float: left; width: 100%; margin-top: 10px;}
.send_contact_div{cursor: pointer;margin-top: 10px;width: 100%;float: left; text-align: center;letter-spacing: 0.5px; color: #3b7bdc;}
.send_contact_div a{ margin-top: 10px; cursor: pointer;}
.bg-grey{ background-color: #f1f1f1;border-bottom: 1px solid #9c9c9c;}
.frwrd_msg{ font-size: 11px; color: #808080; letter-spacing: 0.7px; }
/*.whts_name{
  margin-top: 5px !important;
}
.lst_msg{
  margin-top: 5px !important;
}*/

.wts_frwrd{ display:none; cursor: pointer; position: absolute; background: #3a3a3aeb; padding: 10px; border-radius: 5px; right: -13px;
  top: 12px; font-size: 13px; letter-spacing: 1px; z-index: 99; width: 130px; color: white; }
/*.wts_pin, .wts_unpin{
  display:inline !important;
  width: 140px !important;
  background-color: #009688 !important;
  right: 0px !important;
  top: 15px !important;
  box-shadow: 1px 1px 2px 1px #a2a2a2 !important;
}*/
/*.wts_pin{ width: 15px !important; margin-left: 2px !important;}
.wts_unpin{ width: 20px !important;}
.wts_pin, .wts_unpin{ cursor: pointer; display: inline !important; margin-top: -20px !important;}
*/

.wts_pin { cursor: pointer; display: inline !important; margin-top: -20px !important; width: 15px !important; margin-left: 2px !important; }
.wts_unpin { cursor: pointer; display: inline !important; margin-top: -24px !important; width: 20px !important; }

.frwd_icn,.pin_icn,.unpin_icn{ cursor: pointer;}
.shr_icn{ float: right; line-height: 20px;}
.NewMessageModal .modal-body{ padding: 20px !important; background: #009688 !important; color: #fff; border: 3px double #fff;}
.NewMessageModal .modal-body .close_icn{ color: #fff; line-height: 30px;}
.NewMessageModal .modal-body input{ color: #000;}
#new_contact_error{color: red; text-align: left;}
.close-icon-frwrd,.header_icon_frwrd{cursor: pointer;}
.header_icon_frwrd{ font-size: 20px;}
.close-icon-frwrd{ float: right; display: block;line-height: 20px;}
.search_fw,#conlist_display_srch,#conlist_srch{
  display: none;
}
#conlist_display,#conlist_display_srch,#contacts_list,#conlist_srch{
  height: 250px;
  overflow-y: auto;
  font-size: 12px;
}
#search_contact_frwrd{
  color: #000;
  font-size: 13px;
}
#conlist_view .modal-header,#send_conlist_view .modal-header,#send_location_view .modal-header{
  background: #009688 !important;
  color: #fff;
}
#conlist_view .modal-footer,#send_conlist_view .modal-footer,#send_location_view .modal-footer{
  padding: 5px !important;
}
#conlist_view .dl_fl,#send_conlist_view .dl_fl,#send_location_view .dl_fl{
  color: #fff !important;
  border: 2px solid #fff !important;
}
#conlist_view .frwrd_cnt_list,#send_conlist_view .cntct_list{
  cursor: pointer;
}
#conlist_view input[type="checkbox"],#send_conlist_view input[type="checkbox"] {
  display: none;
}
#conlist_view input[type="checkbox"]+span.frwrd_cnt_list:hover,#send_conlist_view input[type="checkbox"]+span.cntct_list:hover{
  background: rgba(0, 128, 128, .8);
}

#conlist_view input[type="checkbox"]:checked+span.frwrd_cnt_list,#send_conlist_view input[type="checkbox"]:checked+span.cntct_list {
  background: rgba(0, 128, 128, .4);
}

#conlist_view input[type="checkbox"]:checked+span.frwrd_cnt_list:hover,#send_conlist_view input[type="checkbox"]:checked+span.cntct_list:hover{
  background: rgba(0, 128, 128, 0, .7);
}
#conlist_view .frwrd_chk_icon,#send_conlist_view .frwrd_chk_icon{
  float: right;
  color: #009688;
  font-size: 15px;
  display: none;
  margin-top: 4px;
}
#image_view p,.conlist_view p{
  text-align: center;
  float: left;
  padding: 5px;
  font-weight: 700;
  font-size: 15px;
  margin: 0px !important;
  letter-spacing: 0.5px;
}
.dl_fl{
  font-size: 16px;
  margin-right: 5px;
  border-radius: 100%;
  border: 2px solid #000;
  padding: 6px;
  color: #000;
}
#new_contact{
  width: 200px;
  font-size: 13px;
  border-radius: 3px;
  border: 0px;
  height: 30px;
  padding: 5px;
}
.profile_pic img{
  margin-top: 5px;
  height: 40px;
  width: 40px;
  border-radius: 100%;
}
.whts_web_hdr{
  margin-top: 5px;
}
.whtsfilename{
  background: #ececec;
  font-size: 12px;
  white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  white-space: pre-wrap;       /* css-3 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
  white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
  word-break: break-all;
  white-space: normal;
}
.file_attach,.whts_figcaptn{
  max-width:250px;
}
.whts_figcaptn{
  border-top: 1px solid #d5d5d5;
  white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  white-space: pre-wrap;       /* css-3 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
  white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/
  word-break: break-all;
  white-space: normal;
}
.whatsapp_web_container {
    height: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
    font-family: Verdana,sans-serif;
}
.whatsapp_web_header{
  /*padding:5px;*/
  background-color: #009688;
  width: 100%;
  color: #fff;
  /*height: 13% !important;*/
  height: 48px !important;
}
.whatsapp_web_icon{
  color: #fff;
  font-size: 25px;
  float: right;
}
.whatsapp_web_header .header_icon{
  cursor: pointer;
  float: right;
  font-weight: 700;
  margin-top: 5px;
}
.text_left{
  text-align: left !important;
}
.whatsapp_web_right .whatsapp_web_header span{
  font-size: 15px;
  letter-spacing: 1px;
  font-weight: 700;
  float: left;
  padding-left: 5px;
  font-family: Verdana,sans-serif;
}
.whatsapp_web_right .whatsapp_web_header p{
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: 700;
  font-family: verdana;
  /*padding-left: 5px;
  padding-top: 0px;*/
  padding: 0px 5px 0px 0px;
  text-align: center;
}
.whatsapp_web_heading,.whatsapp_web_header p{
  font-size: 19px;
  padding: 10px 0 10px 15px;
  color:#fff;
  letter-spacing: 1px;
  font-weight: 700;
  margin: 0px;
}
.whatsapp_web_chatlist{
  /*background-color: #fff;*/
  background-color: #ddf7ff;
  height: 90% !important;
  overflow-y: auto;
  float: left;
  width: 100%;
}
.whatsapp_web_chatlist .dspl_phn_no{
  /*padding: 5px;*/
  /*border-bottom: 1px solid #d5d5d5;*/
  cursor: pointer;
  font-size: 13px;
/*  letter-spacing: 0.6px;*/
  /*font-weight: 600;*/
}
.whatsapp_web_left,.whatsapp_web_right{
  padding: 0px;
  height: 100% !important;
}
/*.bg_whatsapp_web{
  background-image: url("../../../../agent/images/whatsapp_bg.png");
}*/
.whatsapp_web_dsply{
  background-color: #d9d9d9;
  height: 100% !important;
  text-align: center;
  padding: 20%;
  display: block;
}
.whatsapp_web_dsply h1{
  margin: 0px;
}
.whatsapp_web_chat{
  height: 90% !important;
}
.whatsapp_web_top_content{
  background-image: url("../../../../agent/images/whatsapp_bg.png");
  /*height: 80% !important;*/
  height: 84% !important;
  overflow-y: auto;
}
.whatsapp_web_bottom_content{
  /*background-color: #f0f0f0;*/
  background-color: #fff;
  /*height: 20% !important;*/
  float: left;
  width: 100%;
  padding: 11px 0;
  box-shadow: 10px 0px 6px 2px rgba(0,0,0,0.31);
}
.clr_blk{
  color: #000;
}
#whts_sent_content{
  border-radius: 5px 0px 5px 5px !important;
  float: right;
  max-width: 80%;
  background: #e1ffc7;
  right: 10px;
}
#whts_receive_content{
  background: #fff;
  border-radius: 0px 5px 5px 5px !important;
  float: left;
  left: 10px;
  max-width: 80%;
  -webkit-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
-moz-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
box-shadow: 2px 3px 4px -2px
rgba(0,0,0,0.31);
}
.whatsapp_web_top_content .message{
  color: #000;
  clear: both;
  line-height: 18px;
  font-size: 12px;
  padding: 10px;
  position: relative;
  margin: 5px 0;
  max-width: 85%;
  word-wrap: break-word;
  -webkit-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
-moz-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
box-shadow: 0px 2px 8px -2px
rgba(0,0,0,0.31);
}
.dt_message{
  color: #000;
  clear: both;
  line-height: 18px;
  padding: 7px;
  position: relative;
  margin: 5px 0;
  max-width: 15%;
  word-wrap: break-word;
  -webkit-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
-moz-box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.31);
box-shadow: 0px 2px 8px -2px
rgba(0,0,0,0.31);
background-color: #e1f2fb;
border-radius: 25px;
text-align: center;
font-size: 12px;
margin-left: 50%;
letter-spacing: 0.7px;
}
.unread_nofify{
  float: right;
  background: #13cc34;
  color: #ffffff;
  border-radius: 50px !important;
  padding: 5px;
  font-size: 9px;
  font-weight: bold;
  width: 22px; 
  height: 22px; 
  line-height: 22px;
  text-align: center;
}
.profile_image,#profile_view .modal-dialog{
  height: 300px;
  width: 300px;
}
.profile_image{
  padding: 2px;
}
.fnwt-500{
  font-weight: 500;
}
.stats_time{
    display: block;
    float: right;
    padding: 0 0 0 7px;
    position: relative;
    /*bottom: -4px;*/
    bottom: 0px;
}
.stats_time .whts_time {
    color: rgba(0, 0, 0, .45);
    font-size: 9px;
    display: inline-block;
}
.stats_time .whts_stats {
    display: inline-block;
    margin-left: 2px;
    position: relative;
    top: 1px;
    height: 16px;
    width: 16px;
}
.whatsapp_web_top_content .message::after{
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;

}
.whatsapp_web_top_content .message#whts_receive_content::after {
    border-width: 0px 10px 10px 0;
    border-color: transparent #fff transparent transparent;
    top: 0;
    left: -10px;
}
.whatsapp_web_top_content .message#whts_sent_content::after{
    border-width: 0px 0 10px 10px;
    border-color: transparent transparent transparent #e1ffc7;
    top: 0;
    right: -10px;
}
.whts_stats span{
  font-size: 12px;
  letter-spacing: -3.5px;
}
.whatsapp_web_chatlist .active{
  background-color: #f0f0f0;
}
/*Added by vinod :24112021*/
/*.select_template_icon{
  cursor: pointer;
  position: absolute;
  padding: 4px;
  border: 2px solid #313131;
  border-radius: 100%;
  margin-top: 10px;
}*/
.select_template_icon {
  cursor: pointer;
  position: absolute;
  padding: 11px 4px;
  border: 2px solid #313131;
  border-radius: 100%;
  margin-top: 4px;
  height: 40px;
  width: 40px;
  text-align: center;
}

/*.send_msg_icon{
  cursor: pointer;
  position:absolute;
  padding: 6px;
  margin-top: 10px;
  font-size: 17px;
}*/
.send_msg_icon {
  cursor: pointer;
  position: absolute;
  padding: 12px 6px;
  font-size: 17px;
  height: 45px;
  background: #46C2B6;
  border-radius: 50%;
  width: 45px;
  right: 10px;
  text-align: center;
  color: #fff;
}
.send_msg_icon:hover { background-color: #26A296; }
/*End*/
#whts_template{
  background-color:rgba(255, 255, 255, 0.9);
  top: 47%;
  width: 100%;
  position: absolute;
  height: 40%;
  border-radius: 5px !important;
  -webkit-box-shadow: -1px -5px 5px 0px rgba(191,191,191,1);
  -moz-box-shadow: -1px -5px 5px 0px rgba(191,191,191,1);
  box-shadow: -1px -5px 5px 0px rgba(191,191,191,1);
  z-index: 99;
}
object{
  /*aspect-ratio: attr(width) / attr(height); */
  object-fit: contain;
}
#whts_imgdisplay{
  background-color:rgba(255, 255, 255, 0.9);
}
#image_preview{
  list-style-type: none;
  padding: 0px;
  margin: 0px;
  width: 1200px;
  /*overflow-x: scroll;*/
  float: left;
}
/*added by vinod : 24112021*/
/*#search_contact{
  width: 90%;
  border: 0px;
  font-size: 13px;
  padding: 5px;
  border-radius: 5px;
  color: #313131;
  height: 20px;
}*/
#search_contact {
  width: 90%;
  border: 0px;
  font-size: 13px;
  padding: 5px 10px;
  border-radius: 5px;
  color: #313131;
  height: 28px;
}
.close-icon {
  cursor: pointer;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #fff;
  line-height: 20px;
  color: #000;
  text-align: center;
  font-size: 12px;
}

.sel_img{
  float: left;
  padding: 5px;
}
#whts_filedisplay,#whts_imgdisplay{
  position: absolute;
  bottom: 60px;
}
#whts_template ul{
  font-size: 13px;
  color: #000;
  list-style-type: none;
  height: 100%;
  overflow-y: auto;
  padding: 10px;
}
#whts_template ul li{
  cursor: pointer;
  padding: 3px;
  letter-spacing: 1px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 5px !important;
  font-size: 14px;
}
#file_image,#file_video,#file_docmnt,#file_contact,#file_location{
  display: none;
}
#whatsapp_attachment{
  cursor: pointer;
  position: absolute;
  padding: 6px;
  font-size: 25px;
}
/*menu cass start*/

.circular-menu {
  position: fixed;
}

.circular-menu .floating-btn {
  display: block;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  background-color: hsl(4, 98%, 60%);
  box-shadow: 0 2px 5px 0 hsla(0, 0%, 0%, .26);  
  color: hsl(0, 0%, 100%);
  text-align: center;
  line-height: 3.9;
  cursor: pointer;
  outline: 0;
}

.circular-menu.active .floating-btn {
  box-shadow: inset 0 0 3px hsla(0, 0%, 0%, .3);
}

.circular-menu .floating-btn:active {
  box-shadow: 0 4px 8px 0 hsla(0, 0%, 0%, .4);
}

.circular-menu .floating-btn i {
  font-size: 1.3em;
  transition: transform .2s;  
  line-height: 2.5em;
}

.circular-menu.active .floating-btn i {
  transform: rotate(-45deg);
}

.circular-menu:after {
  display: block;
  content: ' ';
  width: 3em;
  height: 3em;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -2;
  /*background-color: hsl(4, 98%, 60%);*/
  transition: all .3s ease;
}

.circular-menu.active:after {
  transform: scale3d(5.5, 5.5, 1);
  transition-timing-function: cubic-bezier(.68, 1.55, .265, 1);
}

.circular-menu .items-wrapper {
  padding: 0;
  margin: 0;
}

.circular-menu .menu-item {
  position: absolute;
  top: .2em;
  right: .2em;
  z-index: -1;
  display: block;
  text-decoration: none;
  color: hsl(0, 0%, 100%);
  font-size: 1em;
  width: 2.7em;
  height: 2.7em;
  border-radius: 50%;
  text-align: center;
  line-height: 2.7em;
  background-color: rgb(67, 135, 244);
  transition: transform .3s ease, background .2s ease;
  box-shadow: 2px 0px 6px 2px rgba(0,0,0,0.31);
}
.circular-menu .menu-item i {
  line-height: 2.7em;
}
.circular-menu .menu-item:hover {
  background-color: hsla(216.8, 82.1%, 28.4%, 0.69);
}

.circular-menu.active .menu-item {
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.circular-menu.circular-menu-left .floating-btn {
  background-color: hsl(174.4, 100%, 29.4%);
}

.circular-menu.circular-menu-left:after {
  background-color: hsl(217, 89%, 61%,0);
}

.circular-menu.circular-menu-left.active .floating-btn i {
  transform: rotate(90deg);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(1) {
  transform: translate3d(0em,-4.5em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(2) {
  transform: translate3d(0em,-7.5em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(3) {
  transform: translate3d(0em,-10.5em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(4) {
  transform: translate3d(0em,-13.5em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(5) {
  transform: translate3d(0em,-16.5em,0);
}

.attachment_icon{
  cursor: pointer;
}

.tooltiptext {
  visibility: hidden;
  width: 130px;
  background-color: #092551;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 0px 0;
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 110%;
}

.tooltiptext::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #092551 transparent transparent;
}

.item_1:hover .t_img {
  visibility: visible;
}

.item_2:hover .t_vid {
  visibility: visible;
}

.item_3:hover .t_doc {
  visibility: visible;
}

.item_4:hover .t_contct {
  visibility: visible;
}

.item_5:hover .t_loc {
  visibility: visible;
}

/*menu css end*/

/*loader css*/
#LoaderModal .modal-body,#LoaderModal .modal-content{
  background: rgba(0,0,0,0) !important;
}
.load_container {
  display: flex;
  justify-content: center;
  align-items: center;
  /*height: 100vh;*/
  background: rgba(0,0,0,0.6) !important;
  overflow: hidden;
  animation-delay: 1s;
  color: #fff;
}

.load_item_1 {
  width: 20px;
  height: 20px;
  background: #f583a1;
  border-radius: 50%;
  background-color: #eed968;
  margin: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50%,
    75% {
    transform: scale(2.5);
  }
  78%, 100% {
    opacity: 0;
  }
}
.load_item_1:before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #eed968;
  opacity: 0.7;
  animation: scale 2s infinite cubic-bezier(0, 0, 0.49, 1.02);
  animation-delay: 200ms;
  transition: 0.5s all ease;
  transform: scale(1);
}

.load_item_2 {
  width: 20px;
  height: 20px;
  background: #f583a1;
  border-radius: 50%;
  background-color: #eece68;
  margin: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50%,
    75% {
    transform: scale(2.5);
  }
  78%, 100% {
    opacity: 0;
  }
}
.load_item_2:before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #eece68;
  opacity: 0.7;
  animation: scale 2s infinite cubic-bezier(0, 0, 0.49, 1.02);
  animation-delay: 400ms;
  transition: 0.5s all ease;
  transform: scale(1);
}

.load_item_3 {
  width: 20px;
  height: 20px;
  background: #f583a1;
  border-radius: 50%;
  background-color: #eec368;
  margin: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50%,
    75% {
    transform: scale(2.5);
  }
  78%, 100% {
    opacity: 0;
  }
}
.load_item_3:before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #eec368;
  opacity: 0.7;
  animation: scale 2s infinite cubic-bezier(0, 0, 0.49, 1.02);
  animation-delay: 600ms;
  transition: 0.5s all ease;
  transform: scale(1);
}

.load_item_4 {
  width: 20px;
  height: 20px;
  background: #f583a1;
  border-radius: 50%;
  background-color: #eead68;
  margin: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50%,
    75% {
    transform: scale(2.5);
  }
  78%, 100% {
    opacity: 0;
  }
}
.load_item_4:before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #eead68;
  opacity: 0.7;
  animation: scale 2s infinite cubic-bezier(0, 0, 0.49, 1.02);
  animation-delay: 800ms;
  transition: 0.5s all ease;
  transform: scale(1);
}

.load_item_5 {
  width: 20px;
  height: 20px;
  background: #f583a1;
  border-radius: 50%;
  background-color: #ee8c68;
  margin: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@keyframes scale {
  0% {
    transform: scale(1);
  }
  50%,
    75% {
    transform: scale(2.5);
  }
  78%, 100% {
    opacity: 0;
  }
}
.load_item_5:before {
  content: '';
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #ee8c68;
  opacity: 0.7;
  animation: scale 2s infinite cubic-bezier(0, 0, 0.49, 1.02);
  animation-delay: 1000ms;
  transition: 0.5s all ease;
  transform: scale(1);
}

.dspl-blk{
  display: block;
}
.pd-0{
  padding:0px;
}
.m-0{
  margin: 0px;
}
.fnt-10{
  font-size: 10px;
}
.fnt-9{
  font-size: 8px;
}
.brdl_grey{
  border-left: 1px solid grey;
}
.brdr_white{
  border-right: 1px solid #fff;
}
.brdr_grey{
  border-right: 1px solid grey;
}
.brdb_grey{
  border-bottom: 1px solid grey;
}
/*ended by Tejasvini vyas on 6nov2019*/
.quick-nav{
  margin-top:0px !important; top:0% !important;}
 .link_disable {
       pointer-events: none;
       cursor: default;
    } 

    .icon-btn {
          margin:0 !important;
          padding:13px 10px 13px 10px;
      background: #337ab7 !important; border-color:0px !important; 
    }
  #AllActiveChats{ border-bottom:1px solid #e7ecf1; border-top: 0px; border-left: 0px; border-right: 0px;}
  .chatview a{ cursor:pointer;}
    .icon-btn:hover{
     border-color: none;
    box-shadow: none;
    color: none;
    text-decoration: none;
    text-shadow: none;
    transition: none;
    }
.manual-dial{
  margin-top:10px;
  margin-bottom:3px !important;}
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
    background-color: #5c9bd1 !important;
    color: #fff;
}
.manual-phone{ padding:3px 0px 3px 0px;}
.btn-circle {
    border-radius: 18px !important;
    overflow: hidden;
}
.page-footer .page-footer-fixed{
  text-align:center !important;
  color:#ffffff;}
.sbold{ color:#b4bcc8 !important; line-height:22px; font-size:13px;}
.glyphicon{}
/*.icon-hourglass{ color: #fff !important;}*/
.elision-menu{ width:100%; background-color:#fff;}
.sms-email-pading{ padding-left:0px !important;}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn{
  background:#364150 !important; opacity:100;}
.page-content.elisionCont{ padding-top: 0px;}
.page-bar.elisionPage{ margin: 0; padding:0; }
.btn{ font-size:14px; font-weight: bold; }
#blinker.btn{ padding: 0 12px;}
/*body{ background-color:#ffffff !important;}*/
.body_text{ font-family: "Open Sans",sans-serif; font-size: 13px !important; line-height: 16px; padding: 0 !important;}
.blue-message{
  color:#0195e1;}
#VolumeUpSpan{ background: #2b3643;border-color:#198ec4; padding: 2px 5px;}
#VolumeDownSpan{ background: #2b3643;border-color:#198ec4; padding: 2px 5px;}
.col-md-2, .col-sm-3, .col-xs-3{padding-right:0px !important;}
 .page-breadcrumb
 {  
    margin-top: 7px !important;
    max-width: 995px;
    padding: 3px 6px !important;
    width: 100%;
}
.mt-checkbox > span::after{ border-color:#ffffff;}
.hide-status{ display:none;}
.blink-margin{margin-top:5px; position:absolute; right:0;}
.search-margin{ margin-top:10px;}
.hangup-dropdown{width:731px; height:400px; overflow-x:hidden; overflow-y:scroll;}
.arrow-up {
  position:absolute;
  z-index:99999 !important;
  margin-top:-10px;
  width: 10px; 
  height: 10px; 
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-bottom:7px solid #ffffff;
  left:51px;
  display:none;
}
div.scrolling_transcript{ width:100% !important;border:0 solid #666 !important;}
div.scrolling_chat_display{ width:100% !important; padding:0px 0px 12px 0px !important; height:187px;}
.dial-code{ width:20%;}
.manual_checkbox{ margin-top:25px;}
.arial_bold{font-family: "Open Sans",sans-serif; font-size: 13px !important;}
.small_arial_bold{font-family: "Open Sans",sans-serif; font-size: 13px !important; margin-bottom:10px; width:100%; float:left;}
/*#InternalChatIFrame,#WhatsappWebIFrame{background-color:transparent; height:60vh; width:100%;}*/
#InternalChatIFrame,#WhatsappWebIFrame{background-color:transparent; height:75vh; width:100%;}
#PauseCodeSelectA{font-family: "Open Sans",sans-serif; font-size: 13px !important; }
#PauseCodeSelectA a{ display:block; padding:7px 0 7px 0 !important; border-bottom:1px solid #ddd;}
#PauseCodeSelectB{font-family: "Open Sans",sans-serif; font-size: 13px !important; }
#PauseCodeSelectB a{display:block; padding:7px 0 7px 0 !important; border-bottom:1px solid #ddd;}
.pause-code{border-bottom: 1px solid #e7ecf1; float: left; width: 100%;  padding-bottom:7px; margin-bottom:7px; font-size:14px; font-family:"Open Sans",sans-serif;}
.tab-scroll{height:410px; overflow-y: auto;}
.cb_info{
  background-color:#f4f4f4;
  padding:10px;
  border:1px solid #ebebeb;
  margin-bottom:10px;}
.elisionHangcheck{ color:#000000 !important;}
.pause-cod-padding{ padding-left:1px !important; padding-right:1px !important;}
.tab-space{
  margin-top:10px;}
.panel-heading{ font-family:"Open Sans",sans-serif; font-weight:bold;}
.icon-btn:hover{ background-color:#424f62 !important; color:#ffffff;}
.icon-btn_28:hover{box-shadow:0 4px 7px -2px #686868 !important; transition:all 0.7s ease 0s;}
.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-toggle .badge.badge-default{ background-color:#337ab7;}
table tr{
  border-bottom: 1px solid #DDD !important;
}
#DiaLControl .yellow{ color:#ffffff !important;}
#NexTCalLPausE .yellow{ color:#ffffff !important;} /* Vinay Solanki - 01-03-2018 - Added For 'Next Call Pause Button' */
#ReQueueCall .yellow{color:#ffffff !important;}
#HangupControl .yellow{color:#ffffff !important;}
#ParkControl .yellow{color:#ffffff !important;}
#XferControl .yellow{color:#ffffff !important;}
#ivrParkControl .yellow{color:#ffffff !important;}
#QuickXfer .yellow{color:#ffffff !important;}
#CustomXfer .yellow{color:#ffffff !important;}
#PauseCodeLinkSpan .yellow{color:#ffffff !important;}
.elsisonSideMenu > li.active > a, .elsisonSideMenu > li.active > a:focus, .elsisonSideMenu > li.active > a:hover{ background: var(--bg-blue-hover) !important; color:#fff !important; }
/* Hardik .elsisonSideMenu > li.active > a  .glyphicon, .elsisonSideMenu > li.active > a .glyphicon:focus, .elsisonSideMenu > li .glyphicon.active > a .glyphicon:hover{ color: #fff !important;}*/
/*.elsisonSideMenu a{ /*font-family: 'open_sansregular';*/ /*border-top:1px solid #3d4957; color:#b4bcc8 !important; font-weight: normal !important;}
/*.elsisonSideMenu a:hover{ color:#2B3949 !important;}*/
/* Hardik .elsisonSideMenu .glyphicon{ color:#f2eeee !important; }*/
.portlet.box > .portlet-title{ background:var(--bg-blue) !important; border-radius: 10px 10px 0 0 !important;}
.portlet.blue-sharp.box{ border-color:  #364150 !important; border: 1px solid var(--bg-blue) !important; border-radius: 10px !important; }
.caption{ width: 100%; padding: 10px 0 !important; font-size: 14px !important; }
#custinfo{/*font-family:"Open Sans",sans-serif; !important;*/ color: #fff !important; text-transform:none !important;}
.caption-subject{ text-transform:none !important;/* font-family:"Open Sans",sans-serif;*/}
.caption .elisionCust{/* font-family: 'open_sansregular';*/ font-size: 11px; float:right;}
.portlet > .portlet-title{ min-height: inherit !important;}
.portlet > .portlet-title > .caption > i{ margin-top: 2px !important;}
#DiaLLeaDPrevieW{ font-family: "Open Sans",sans-serif; font-size:12px !important; float: left; padding: 0 5px 0px 0; letter-spacing: normal; }
#DiaLLeaDPrevieW input { margin-top: 0 !important;}
.sidebar-nav{ background: #364150 !important; margin-bottom:10px; padding:0px;}
/*#MDstatusSpan > a{color:#b4bcc8  !important; text-decoration: none !important;}*/
#sidebar b{ /*font-family: 'open_sansregular';*/ font-size: 14px !important; color: #f2eeee !important; font-weight: normal !important;}
.glyphicon.glyphicon-th{ font-size: 16px; color: #b4bcc8  !important;}
.glyphicon.glyphicon-phone{ font-size: 16px; color: #f2eeee !important; margin-left: 2px;}
.glyphicon.glyphicon-th{ padding-left: 10px; margin-top: 10px; margin-bottom:9px;}
.fa.fa-phone-square{ padding-left: 10px; margin-top: 10px; margin-bottom:9px; color:#b4bcc8 !important; padding-left:9px; font-size:14px;}
.fa.fa-phone-square{ font-size: 17px; color:#3598dc  !important; padding-left:18px;}
#LeaDInfOBox label{ font-weight:600}

.elisionNeWManuaLDiaLBox td{ /*font-family: 'open_sansregular';*/ font-size: 13px !important; line-height: 16px; border:0 !important; text-align: left !important;}
.elisionNeWManuaLDiaLBox tr{ padding: 8px 0 !important;}
.elision_md{ font-family:open sans !important; font-size: 12px; font-weight: normal; line-height: 17px;}
.fa.fa-camera{ color: #fff;}
.form-group.form-md-line-input{ margin: 0;}
.form-group{ margin-bottom: 0;}
.form-group.form-md-line-input.has-info .form-control{ border: solid 1px #ddd; }
.form-control.cust_form.edited{ margin:12px; border:solid 1px #ddd;}
.form-control.cust_form.edited{ margin: 0;}
.form .form-body, .portlet-form .form-body{ padding: 0;}
.form-control.cust_form.edited{ margin-bottom: 5px;}
.nav > li > a{ padding: 7px 15px;}

.sd_text{/* font-family:"Open Sans",sans-serif;*/ font-size: 18px; font-weight: normal; }
#CloserSelectContent .sd_text{ font-size: 15px !important}

.log_text > span{ display: block; /*font-family:"Open Sans",sans-serif;*/ line-height: 19px; font-weight:500; font-size:14px;}
#CloserSelectContent td{}
.col-md-12.elisionEmail{ max-width: 280px; width: 100%; }
.form-actions.elisionEmailbtn{ margin-top: 15px;}
.elisionEmailbtn .btn.blue{ padding: 6px 24px;}
#error{  margin-top: 8;}
.modal-content{}
#calllogdate{ font-weight: normal; /*font-family: open sans;*/}
.modal-header{padding:0px;}
.agent-call{ text-transform:uppercase; margin-top:8px; padding:0px !important;}
.elisionPopupLis tr{ border-bottom: solid 1px #ddd;}
.elisionPopupLis th{ font-size: 14px !important; font-weight: normal; color: #686868; padding: 8px 2px 3px; line-height: 14px;}
.elisionPopupLis td{ font-size: 13px;}
.table-scrollable{ padding: 0 0px; height:350px !important; overflow-y:auto}
.elisionPopupLis td{ padding: 2px 2px;}
.table{ margin-bottom:0px !important;}
.elision_md.form-control{ border: 0 !important; }
.modal-body{ background: #fff !important; border-radius: 0  !important; padding:0px;}
.table.elisionmannuldial td{ font-size: 15px !important; font-weight: normal; padding: 4px 0; line-height: 14px;}
.elision_md{ font-size: 13px; /* font-family: 'open_sansregular';*/ color: #686868; line-height: 17px;}
.table.elisionmannuldial{ margin-bottom: 10px;}
.etlbtn{ text-align:center; margin-top:10px;}
.btn-dial-margin{ margin-top:15px !important;}
.sh_text_el{/*font-family:"Open Sans",sans-serif;*/ font-size:14px;}
.elisionbtn{ margin-right: 9%; width: 123px; padding: 8px 0; background: #025b84 !important;  /*font-family: 'open_sansregular';*/ font-size: 16px;}
.elisionbtn:hover{ background: #198ec4 !important; border-color: solid 1px #198ec4 !important;}
.elisionbtn:last-child{ margin-right: 0;}
#CloserSelectBox_div .panel{ margin-bottom:0px !important;}
#CalLLoGDisplaYBox_div .panel { margin-bottom:0px !important;}
.panel-btm{
  margin-bottom:0px !important;}
#CallLogSpan table td{
  white-space:pre;
  font-size:11px;
  }
.small_arial{ float:left !important;}
#AllowAgentReplies{ margin-top:0px;}
.panel-footer{ padding:10px 10px 15px 10px !important;}
#agent_message{ width:100%;}
.chatview li.unreadchat{font-family:"Open Sans",sans-serif; border:1px solid #CDCDCD; padding:5px 0 5px 5px; background-color:#e2eef5 !important; color: #000000 !important; font-weight: bold;}
.chatview li.viewedchat{font-family:"Open Sans",sans-serif; padding:10px; background-color:#c0e5ff; color:#414141;}
.lead_info_el table td {white-space:pre}
.search_result_el table td{white-space:pre;}
#PresetsSelectBoxContent table td font{ padding:10px;}
.cb-checkbox-margin{margin:20px 0 20px 0;}
.cb_submit{ text-align:center; margin-top:10px;}
.modal-header .close{ margin-right:20px;}
.modal .modal-header .close{margin-top:20px !important;}
.sh_text{ font-family:"Open Sans",sans-serif;}
.popup-link{ color:#2b3643 !important; margin-top:5px; width:100%; float:left;}
.table-scrollable table tbody tr td{ font-size:12px; white-space:pre;}
.table-scrollable table tbody tr th{ font-size:13px;}
.wrapup_text{font-family:"Open Sans",sans-serif; font-size:14px !important;}
/*.nav.nav-pills.nav-stacked.elsisonSideMenu{ background: #337ab7;}*/
#tab_7_1 label{ font-weight:600;}
.nav > li > a:focus, .nav > li > a:hover
.nav > li > a:focus, .nav > li > a:hover{ background: var(--bg-blue-hover); !important; /*background-image: linear-gradient(#3684c8, #54B4DD) !important; border-radius: 10px !important;*/ color: #fff !important; }
.glyphicon.glyphicon-th{}
.elisionQuick{ margin: 3px 0 0; background: #fff; border-top: solid 1px #54667C; padding: 5px 0 2px;}
#sidebar b{ color: #364150 !important;}
#sidebar .form-control{ border-color: #0BD200;}
.logo-default{ margin: 3px 0 0 0 !important;}

.page-header.navbar .hor-menu .navbar-nav > li > a > i{ color: #f2eeee;}
.dropdown span{}
.dropdown{}
.search-dw{
  background:#3f4f62 none repeat scroll 0 0 !important;
  color:#d5dce4;
  margin-top:-15px;
  width:551px;
  border-top:3px solid #0195e1;
  padding:15px;
  right: 0;
  top: 31px;
}
#agentdirectlink{ line-height:30px;}
#DialBlindVMail{ float:left;}
.dropdown:hover .username{ background: #3f4f62 !important; color: #fff !important;}
.padding-textbox{ padding:3px !important;}
.padding-checkbox{ padding:0 0 5px 35px !important;}
.hangup-tables{ padding:10px 10px 0px 0px;}
.page-header.navbar .top-menu{ float: left;}
.page-header.navbar .top-menu .navbar-nav{ margin-right: 0;}
.page-logo2{ float:right;     display: block;
    width: 201px;
    height: 50px;
    padding-left: 20px;
    padding-right: 7px;}
.page-logo2 > a{ display: block; margin: 5px 0;}
.logo-default2{ width: 100%; height: auto;}
.img-circle{ height: 35px; width: 35px; margin-top: -8px; border: 1px solid #000;}
.search-form{ margin-right: 10%;}
.search-form.open{ margin-right: 0px !important;}
#DispoSelectA > a{ border-bottom:solid 1px #fff; background: #c3e3f8 !important; text-decoration: none !important; color: #0662a3 !important; }
#DispoSelectB > a{ border-bottom:solid 1px #fff; background: #c3e3f8 !important; text-decoration: none !important;  color: #0662a3 !important;}
#DispoSelectC > a{ border-bottom:solid 1px #fff; background: #c3e3f8 !important; text-decoration: none !important;  color: #0662a3 !important;}
#DispoCommentsContent .body_text{ color: #364150 !important;}
#dispoviewcommentsdisplay > input{ background: #364150 !important; padding: 5px 19px !important; border: none !important; color: #fff !important;}

.dropdown-content a{ padding:7px !important;}
.row{ width:100%; margin:0 auto; margin-bottom: 15px;}
.popup-head{ font-family:"Open Sans",sans-serif; font-size:14px !important; font-weight:bold !important;}
.inbound-input{font-size:12px !important; font-weight:600 !important;}
.row.ElisionCustInfo{ float:left; width: 70%;}
.row.ElisionCustcommt{ float: right; width:30%;}
.ElisionCustcommt .col-md-12{}
#comments.form-control{ height: 99px; resize: vertical; }
#call_notes.form-control{ height: 99px; resize: vertical; }
.form-control{ padding: 6px;}
.portlet.blue-sharp.box {
  background: transparent;
  display: table;
  width: 100%;
  padding-bottom: 0 !important;
  margin:0 !important;
}
.margin-btm{ margin-bottom:10px;}
.icon-btn{ color: #fff; border:none;}
/*#btn_manual_dail{ background:#337ab7 !important; border-color: #1d242b !important;}*/
.manual-dail-pop{ border:1px solid #e7ecf1; margin-top:10px; padding:10px 0 10px 0 !important; line-height:30px; }
/*#phone_number_fast{ border-color: #1d242b !important;}*/

#CalLNotesDisplaYBox_div .modal-dialog{ width: 80% !important;}
.page-content-wrapper .page-content{ min-height:auto !important;}
#GroupAliasSelectA{font-family:"Open Sans",sans-serif; font-size:14px !important;}
.chat-btn{ float:left; margin-right:10px;}
.small_arial{width: 89% !important;}

.small_arial{font-size: 15px!important;}
#DispoSelectA>a.dispostatus{background-color: #0662a3 !important; color: #fff !important}
#DispoSelectB>a.dispostatus{background-color: #0662a3 !important; color: #fff !important}
#DispoSelectC>a.dispostatus{background-color: #0662a3 !important; color: #fff !important;}
.btn-group-sm > .btn, .btn-sm{padding:8px 9px !important;} 
.liveagentbtn{font-size: 12px; font-weight:bold;}
.agentendbtn{font-size: 12px; font-weight:bold;}
.agent_msg{padding: 7px !important;}

.login .content{ width:40% !important;}
#ingroup_msg { padding: 0 3px;  float: right; font-size: 11px; margin-left: 3px; border-radius: 3px !important; }
/* ADED BY DHAVAL GOL 23-08-2017 */
 .timeline {  list-style: none; padding: 20px 0 20px; position: relative; margin-left: 40px !important; width:90% !important; }
.timeline:before { top: 0; bottom: 0; position: absolute; content: " "; width: 3px; background-color: #eeeeee; left: 50%; margin-left: -1.5px; }
.timeline > li { margin-bottom: 20px; position: relative; }
.timeline > li:before,
.timeline > li:after { content: " "; display: table; }
.timeline > li:after { clear: both; }
.timeline > li:before,
.timeline > li:after { content: " "; display: table; }
.timeline > li:after { clear: both; }
.timeline > li > .timeline-panel { width: 46%; float: left; border: 1px solid #d4d4d4; border-radius: 2px; padding: 5px; position: relative;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175); }
.timeline > li > .timeline-panel:before { position: absolute; top: 26px; right: -15px; display: inline-block; border-top: 15px solid transparent;
  border-left: 15px solid #ccc; border-right: 0 solid #ccc; border-bottom: 15px solid transparent; content: " "; }
.timeline > li > .timeline-panel:after { position: absolute; top: 27px; right: -14px; display: inline-block; border-top: 14px solid transparent;
  border-left: 14px solid #fff; border-right: 0 solid #fff; border-bottom: 14px solid transparent; content: " "; }
.timeline > li > .timeline-badge { color: #fff; width: 50px; height: 50px; line-height: 50px; font-size: 1.4em; text-align: center;
  position: absolute; top: 16px; left: 50%; margin-left: -25px; background-color: #999999; z-index: 100; border-top-right-radius: 50%;
  border-top-left-radius: 50%; border-bottom-right-radius: 50%; border-bottom-left-radius: 50%; }
.timeline > li.timeline-inverted > .timeline-panel { float: right; }
.timeline > li.timeline-inverted > .timeline-panel:before { border-left-width: 0; border-right-width: 15px; left: -15px; right: auto; }
.timeline > li.timeline-inverted > .timeline-panel:after { border-left-width: 0; border-right-width: 14px; left: -14px; right: auto; }
.timeline-badge.primary { background-color: #2e6da4 !important; }
.timeline-badge.success { background-color: #3f903f !important; }
.timeline-badge.warning { background-color: #f0ad4e !important; }
.timeline-badge.danger { background-color: #d9534f !important; }
.timeline-badge.info { background-color: #5bc0de !important; }
.timeline-title { margin-top: 0; margin-bottom: -15px: color: inherit; }
.timeline-body > p,
.timeline-body > ul { margin-bottom: 0; }
.timeline-body > p + p { margin-top: 5px; } 
.timeline-badge i { margin-top: 20px; margin-left: 15px; }
.timeline-body{ padding: 0px !important; margin-left: 0px !important; margin-top: 8px !important; }
/* ADED BY DHAVAL GOL 23-08-2017 */
@media screen and (min-width:300px) and (max-width:800px) {
    /* For mobile phones: */
  .hidden-xs{display: inline !important;
  background: #2b3643;
  width: 100%;
  padding-left: 10px;}
  .page-header.navbar .hor-menu .navbar-nav > li.open > a, .page-header.navbar .hor-menu .navbar-nav > li:hover > a, .page-header.navbar .hor-menu .navbar-nav > li > a:hover{width:95%;}
  .tab-space{width:100%;}
  .row{ width:100%; margin:0 auto; margin-bottom:0px;}
    .login .content{ width:80% !important;}
  .input-icon{margin-bottom: 15px;}
  #LogiNReseT .blue{ margin-bottom: 15px; }
  .icon-btn{width:50%; float: left;}

  .page-header.navbar .top-menu{ width:100%; background-color: #394152;}
  .blink-margin{ background-color: #314152; width: 100%; position: relative; margin-bottom: 7px;}
  .dropdown{display:inherit;}
  .row.ElisionCustcommt{width:100%;}
  .row.ElisionCustInfo{width:100%;}
  .col-md-2, .col-sm-3, .col-xs-3{margin-right:15px;}
  .tab-space{padding-right:0px; padding-left: 0px; width:100%; }
  .modal-header .close{ margin-right: 2%;}
  #calllogdate {
    float: left;
    font-weight: normal;
    width:100%;}
  .agent-call {
    margin-top: 0px;
    width:40%;}
  .agent-call { 
    margin-top: 8px;
    padding: 0;
    text-transform: uppercase;
  width:100%;
  float: left;
  margin-bottom: 10px;
}
#CalLLoGDisplaYBox_div .date_fields {
    padding-left: 0;
}
  #LogiNReseT .blue {
    margin-bottom: 15px;
    width: 100%;}
  .login .content h3 {
    text-align: center;}
  
}


.mt-checkbox:hover > input:not([disabled]):checked ~ span, .mt-checkbox > input:checked ~ span, .mt-radio:hover > input:not([disabled]):checked ~ span, .mt-radio > input:checked ~ span {
  background:#000 !important;
}

/*Added By Puja On 07/11/2017 For call back red blink*/

.redblink{
  color: black !important;
  background-color: red !important;
}

#DiaLDiaLAltPhonE{font-family: "Open Sans",sans-serif; font-size:11px !important; text-transform:uppercase;}
.el_alt_link {height: 30px; padding-left: 23px;}
.el_alt_link_main{ margin-top: 20px; padding-left: 23px;  }

/*Added By Puja on 12/01/2018 */

.search-form{
  width: 0px !important;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  .page-logo {
    
    display: none !important;
  
}

}

/* add by khemchand and hardik soni 31-07-2018*/
@media only screen and (min-width: 320px) and (max-width: 479px){
  /*.dsplynone{display: none !important}*/
  .nav_mnu{
    float: left !important;
    display: block !important;
    /*padding: 5px 5px 5px 5px;*/
    margin-left: 5px;
  }
  .search-dw{width: 300px;}
  .search-form{float: none !important}
  .mrgtop{margin-top: -30px !important}
  .page-header.navbar .hor-menu .navbar-nav > li.open > a, .page-header.navbar .hor-menu .navbar-nav > li:hover > a, .page-header.navbar .hor-menu .navbar-nav > li > a:hover
  {width: 100%!important;
  float: left;
min-height: 20px;}

}
.portlet.box>.portlet-body{background-color:#fff;padding:15px; height:100% !important; float: left; width: 100%; border-radius: 0 0 10px 10px !important; }
/*added by vinod : 24112021*/
/*.w-send{width:100% !important;border: none;float:left;outline:none;padding: 7px;height:75%;}*/
.w-send {
  width: 100% !important;
  border: 2px solid #46C2B6;
  float: left;
  outline: none;
  padding: 10px 30px 10px 20px;
  height: 45px;
  border-radius: 25px;
  resize: none;
  background: #e7fefc;
  color: #46C2B6;
}
/*end*/
/*for customr profiile*/
.customer-profile-table-scrollable {  
padding: 0 0px;
height: 250px !important;
overflow-y: auto!important;
}

.customer-profile-table-scrollable {
width: 100%;
overflow-x: auto;
overflow-y: hidden;
border: 1px solid #e7ecf1;
margin: 10px 0!important;
}


.boxheadding2 h2 {
    font-size: 16px !important;
    font-family: 'Montserrat Black' !important;
    color: #fff;
    background: #337ab7 !important;
    border-radius: 0;
    padding: 1rem!important;
}
 .panel-default>.panel-heading {
  color: #333;
  background-color: #fff;
  border-color: #e4e5e7;
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.panel-default>.panel-heading a {
  display: block;
  padding: 10px 15px;
  background-color: #337ab7!important;
  color:#fff!important;
}

.panel-default>.panel-heading a:after {
  content: "";
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: 400;
  color:#fff;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  float: right;
  transition: transform .25s linear;
  -webkit-transition: -webkit-transform .25s linear;
}

.panel-default>.panel-heading a[aria-expanded="true"] {
  background-color: #eee;
}

.panel-default>.panel-heading a[aria-expanded="true"]:after {
  content: "\2212";
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.panel-default>.panel-heading a[aria-expanded="false"]:after {
  content: "\002b";
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.customerProfileDisplaYBox_div .modal-header{border-bottom:none!important;}
/*End*/

/* css added by Vinay as on 10-March-2021 - indentation in sub-items of main ul for twitter & facebook */

/*commented by vinod: 29-11-21*/
/*ul#twitter_subpage > li a, ul#facebook_subpage > li a {
    padding-left: 0px !important;
}
#twitter_subpage { margin-top: 2px; }*/
/*commented end by vinod: 29-11-21*/
/*added by Sujit Dated 30-April-2021  for email validation */
.btnemail{ font-size:11px; font-weight: bold; }


/*Added by Naresh Garg */
.msmbox .msm-text-box .bgbox h3 span{ word-break: break-all;}
.msmbox .msm-text-box .bgbox1 h3 span{ word-break: break-all;}
ul, ol {list-style:none; }
a { color: inherit; text-decoration:none; transition: all 0.5s ease 0s;}
a:hover, a:focus {text-decoration:none;}

#wrapper { width:100%; float:left; }
.srh-main { width:100%; float:left; /*background:#337ab7;*/ background: var(--bg-blue); padding: 10px 0; margin-bottom: 15px;}
.srh-main h1 { text-align:center; display:block; color:#fff; font-size:40px; text-transform:uppercase; margin:11px 0 0 0; font-weight:500; /*letter-spacing:1px;*/ }
.srh-main .serchbox { /*max-width:625px;*/ width:100%; margin:0 auto; text-align:center; }
.srh-main .serchbox input { display: inline-block; max-width: 300px; height: 35px; border-radius: 0; border: none; font-weight:bold; font-size:14px; color:#333; }
.srh-main .serchbox .search-btn { display: inline-block; background-color: #337ab7; border-color: #2e6da4; text-transform: uppercase;
  color: #fff; font-weight: bold; height: 36px; vertical-align: top; line-height: 24px; max-width: 150px; width: 100%; letter-spacing: 1px;
  position: relative; left: -20px; float: left; }
.srh-main .serchbox .search-btn:hover { color: #FFF; background-color: #286090; border-color: #204d74;}
.msmbox { max-width:1000px; width:100%; margin:0 auto; }
/* by razin shaikh date : 2021-06-22 description : customer profilling design changes */
/* .msmbox .imgbox {max-width: 120px; width: 100%; height: 120px; background: #f4f4f4; border-radius: 50%!important; text-align: center; line-height: 120px; vertical-align: top; display: inline-block; padding-top:23px;margin-top: 35px; margin-right:23px;}  */
.msmbox .imgbox { max-width: 80px; width: 100%; height: 80px; background: #f4f4f4; border-radius: 50%!important; text-align: center;
    line-height: 80px; margin-top: 5px; margin-right: 23px; display: inline-block; } 
.imgbox.mrgnbox { float: left; margin-top: 5px; }
.msmbox .msm-text-box {max-width: 500px; width: 100%; display: inline-block; }
.msm-main { width:100%; float:left; margin-top: 0px; }
.text-green{color: #5cc310;}
.text-black{color: #000;}
.text-red{color: #f44534;}
.text-org{color: #e99a23;}
.text-blue{color: #337ab7;}
.text-twillio{color: #f22f46;}
.msmbox .imgbox img.new-icon {
  margin-top: 20px!important;
}
/* by razin shaikh date : 2021-06-22 description : customer profilling design changes */
/* .msmbox .msm-text-box .bgbox { border-radius:30px 30px 30px 0!important; padding:30px; position:relative; } */
.righttext{color: #666;}
.msmbox .msm-text-box .bgbox { display:inline-block; width:100%; border-radius:30px 30px 0px 0px!important; padding:10px 30px 10px 30px; position:relative; color: #666;font-weight: 600; min-height: 90px;  }
.msmbox .msm-text-box h2 { font-size:14px; font-weight:bold;text-transform:uppercase; margin-bottom:10px; margin-top: 0; }
.msmbox .msm-text-box .bgbox h3 { font-size:14px; color:#666; font-weight:bold;margin-top: 0; margin-bottom: 5px; }
.msmbox .msm-text-box .bgbox p { font-size:14px;}
.msmbox .msm-text-box .bgbox1 { display:inline-block; width:100%; border-radius:30px 30px 0px 0px!important; padding:10px 30px 10px 30px; position:relative; color: #666;font-weight: 600;min-height: 90px; }
.msmbox .msm-text-box .bgbox1 h3 { font-size:14px; color:#666; font-weight:bold; margin-top: 0; margin-bottom: 5px; }
.msmbox .msm-text-box .bgbox1 p { font-size:14px; color: #666;}
.greenborder { width:100%; float:left; height:2px; background:#cdeeb9; margin-bottom:15px; }
.outbbrdr{ width:100%; float:left; height:2px; background:#cae4f5; margin-bottom:15px; }

/* start */
.inbound-bg { background:#edf8e7;}
.outbound-bg {background:#ecf5fc;}
.in-sms-bg { background:#fdf5e8; }
.insmsbrdr{ width:100%; float:left; height:2px; background:#fae3c1; margin-bottom:15px; }
.out-sms-bg { background:#f6f6f6; }
.outsmsbrdr{ width:100%; float:left; height:2px; background:#e7e7e7; margin-bottom:15px; }

.in-wht-bg { background:#e2fece; }
.inwhtbrdr{ width:100%; float:left; height:2px; background:#c4f0b5; margin-bottom:15px; }
.out-wht-bg { background:#f6f6f6; }
.outwhtbrdr{ width:100%; float:left; height:2px; background:#eeeeee; margin-bottom:15px; }

.in-fb-bg { background:#0084ff; }
.in-fb-bg h3 { color:#fff !important;}
.infbbrdr{ width:100%; float:left; height:2px; background:#8dc5fe; margin-bottom:15px; }
.out-fb-bg { background:#f1eff0; }
.outfbbrdr{ width:100%; float:left; height:2px; background:#e3e1e2; margin-bottom:15px; }

.in-twtr-bg { background:#2b87d4; }
.in-twtr-bg h3 { color:#fff !important;}
.intwtrbrdr{ width:100%; float:left; height:2px; background:#1470bd; margin-bottom:15px; }
.out-twtr-bg { background:#dcf2ff; }
.outtwtrbrdr{ width:100%; float:left; height:2px; background:#d2e4ee; margin-bottom:15px; }
.in-email-bg { background:#feecec; }
.grayclr { color:#666; }
.whiteclr { color:#fff; }
.arrow-left { width: 0; height: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; position: absolute;
    left: -20px; top: 30px; }
.arrow-right { width: 0; height: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; position: absolute; right: -20px; left: inherit; op: 30px; }
.in-arrow-bg { border-right:20px solid #edf8e7; }
.out-arrow-bg { border-right:20px solid #ecf5fc; }
.in-sms-arrow-bg { border-right:20px solid #fdf5e8; }
.out-sms-arrow-bg { border-left:20px solid #f6f6f6; }
.in-wht-arrow-bg { border-right:20px solid #e2fece; }
.out-wht-arrow-bg { border-left:20px solid #f6f6f6; }
.in-fb-arrow-bg { border-right:20px solid #0084ff; }
.out-fb-arrow-bg { border-left:20px solid #f1eff0; }
.in-twitter-arrow-bg { border-right:20px solid #2b87d4; }
.out-twitter-arrow-bg { border-left:20px solid #dcf2ff; }
.in-email-arrow-bg { border-right:20px solid #feecec; }
.text-green { color:#5cc310 !important;}
.text-gry { color:#ababab !important; }
.text-org { color:#e99a23 !important; }
.text-black { color:#000 !important;}
.text-red { color:#f44534 !important;}
.paginationbox { display: inline-block; }
.paginationbox .page-item { border: 1px solid #2c7ab8; margin-right: 5px; }
.paginationbox  .page-link { border:none; margin:0; }
.paginationbox .page-item.active .page-link { background:#2c7ab8; color:#fff; }
/* end */
#customerProfileDisplaYBox_div .modal-lg{width: 90%!important; top: 50px; }
#customerProfileDisplaYBox_div .panel-body{padding: 0!important;} 
.msmbox .imgbox img {display: inline-block; margin-top: 25px; }
#customerProfileDisplaYBox_div .float-right{float:right;}
#customerProfileDisplaYBox_div .float-left{float:left;}
#customerProfileDisplaYBox_div .call-status{font-size: 14px; font-weight:600;}
#customerProfileDisplaYBox_div .ml-4{margin-left:23px;}
#customerProfileDisplaYBox_div p{margin: 0 0 0px 0;}
#customerProfileDisplaYBox_div .no-reslut{font-size:18px;}
#customerProfileDisplaYBox_div .pb-4, .py-4{ padding-bottom: 5px;}
#customerProfileDisplaYBox_div .border-bottom {border-bottom: 1px solid #dee2e6!important;}
.out-wht-bg{background: #f1eff0!important;}
#phone-invalid{ color: red; font-size: 12px; padding-left: 2px; background: #f0f0f0; width: 100%; margin-top: 1px !important;
float: left; text-align: left; }
#daterange-invalid { color: red; font-size: 12px; padding-left: 2px; background: #f0f0f0; width: 100%; margin-top: 1px !important;
float: left; text-align: left; }
#customerProfileDisplaYBox_div .no-record-found{text-align: center; font-size: 19px;margin-top: 0px;}
#customerProfileDisplaYBox_div .no-record-found .alert{margin-bottom: 0px!important;}
#customerProfileDisplaYBox_div .form-style{max-width: 500px;}
.paginationbox>.page-item{border: 1px solid #2c7ab8!important; margin-right: 5px!important;}
.pagination>li>a{margin-right: 5px!important;}
.imgbox.whatsapp-img img { margin: 20px 0 0 0; }
span.sms_body { font-weight: normal; line-height: 18px; }
button.customer-close { top: 13px; position: absolute; right: 10px; font-size: 23px; color: #fff !important; z-index: 99;
  margin: 0 !important; opacity: 1; background: #337ab7; border: 0; font-weight: bold; width: 30px; line-height: 30px; padding: 0;}
#customerProfileDisplaYBox_div h1 { font-size: 14px; font-weight: bold; }
p.datetimetext { position: absolute; right: 29px; top: 32px; }
/* Add style for header searh button by Naresh Garg on 07-07-2021 */
.searchbutton { max-width: 100% !important; width: auto !important; background: transparent !important; height: auto !important; margin: 0px 0 0 0px; }
/* End */
@media screen and (max-width: 768px) {
button.customer-close { top: -8px; }
#customerProfileDisplaYBox_div h1{ font-size: 21px; } 
}
/* customer_profile_container */
@media (min-width: 1200px){
.customer_profile_container { width: 100%; }
}

@media (min-width: 992px){
.customer_profile_container { width: 100%; }
}
#customer_profile_date{ display: inline-block; max-width: 300px; height: 35px; border-radius: 0; border: 2px solid #fff; font-weight: normal;
  font-size: 14px; color: #333; }
#customer_profile_phone{ display: inline-block; max-width: 300px; height: 35px; border-radius: 0; border: 2px solid #fff; font-weight: normal;
  font-size: 14px; }
.search-btn{ background: #013565; text-transform: uppercase; color: #fff; font-weight: bold; height: 50px; max-width: 150px; idth: 100%; letter-spacing: 1px;  text-align: center;
  /* line-height: 50px; */
  /* position: absolute; */
  /* float: right; */
  /* left: -10px; */
}
/*End*/
.search-pd { padding-right: 0; }
.caledaricon { position: absolute; right: 10px; top: 8px; cursor: pointer; }
#inputDate { height: 35px; float: left; width: 100%; }
.sms-pagination a.page-link.active { color: #fff; }
.sms-pagination .pagination>li>a { margin-right: 5px!important; color: #000; }
.status { position: relative; top: -27px; }
.agent_name1 { position: relative; top: -27px; }
.no-record-found .alert-danger.text-danger { padding: 10px 0 5px 0; font-size: 16px; line-height: 18px; }
/*.srh-main .close { position: absolute; top: 25px; right: 20px; z-index: 9999; }*/
.srh-main .close {
  position: absolute;
  top: 16px;
  right: 20px;
  z-index: 9999;
  opacity: 0.5;
  background: #fff;
  width: 25px;
  height: 25px;
  background-position: 8px 8px;
  border-radius: 50% !important;
}
.srh-main .close:hover {opacity: 1;}
.no-record-found .text-danger { padding: 0 0; font-size: 14px; font-weight: bold; }
/*Added by vinod : 13-12-2022*/

@media screen and (max-width: 850px) {
.searchpopup .search-dw { left: -440px; }
}
/*Added by vinod : 13-12-2022 End*/
@media screen and (max-width: 767px) { 
.srh-main .serchbox .search-btn { position:relative; left: 0; right: 0; float:none; display:inline-block; margin-top: 10px; }
.msmbox .message-text-box { max-width: 370px; width: 100%; }
button.customer-close { top: 7px; padding: 0; color: #fff !important; }
.sms_body { font-weight: normal; line-height: 18px; }
.headertext h1 { margin: 0 0 10px 0; }
.msm-main { margin-bottom: 10px;}
.pagination.sms-pagination { padding-bottom: 10px; }
#customerProfileDisplaYBox_div .ml-4 { margin-right: 0 ;}
.no-record-found { margin-bottom: 15px; }
/*ADED BY VINOD K 07-07-2021 for whatsapp web */
#InternalChatIFrame,#WhatsappWebIFrame{ height:100vh; }
/*Added by vinod: 13-12-2021 for Search popup */
.searchpopup .search-dw {left: -470px; }
.searchpopup .searchbutton { margin:10px 0 0 0; }
.searchpopup .searchfields { display: flex; align-items: center; column-gap: 10px; }
.searchpopup .searchfields .col-md-6 { margin: 0; padding: 0; }
.searchpopup .searchfields .col-md-6:first-of-type { flex-grow: 1; }
.searchpopup .searchfields1 { display: flex; align-items: center; column-gap: 10px; }
.searchpopup .searchfields1 .col-md-6 { margin: 8px 0 0 0; padding: 0; width: 50%; }
}
@media screen and (max-width: 667px) {
#customerProfileDisplaYBox_div .call-status { width:100%; float:left; }
.msmbox .msm-text-box .bgbox { padding:10px 15px 10px 15px; border-radius:15px 15px 0px 0px !important; width:100%; display:inline-block; }
.arrow-left { left: -15px; top: 30px; }
.arrow-right { top: 30px; right: -15px; }
.msmbox .msm-text-box .bgbox h3 { margin-top: 5px; width: 100%; float: left; margin-bottom: 5px; }
.msmbox .msm-text-box .bgbox1 h3 { margin-top: 5px; width: 100%; float: left; margin-bottom: 5px;}
.msmbox .msm-text-box .bgbox1 { padding:10px 15px 10px 15px; border-radius:15px 15px 0px 0px !important; width:100%; display:inline-block; }
p.datetimetext { position: relative;right: 0;top: 0; }
}
@media screen and (max-width: 600px) {
.imgbox.d-inline-block.mt-3.mr-4 { margin-left: 0; margin-right: 23px; }
/*Added by vinod: 13-12-2021 for Search popup */
.searchpopup .search-dw { left: -370px; width: 450px; }
}
@media screen and (max-width: 575px) {
.srh-main .serchbox input { width: 100%; max-width: 100%; }
.search-pd { padding-right: 15px !important; margin-bottom: 10px; }
.srh-main h1 { font-size:30px; }
.datetime_container { width: 100%; padding-right: 15px !important; }
#customer_profile_date { max-width: 100%; }
#customer_profile_phone { max-width: 100%; }
.caledaricon { right:25px; }
.srh-main .serchbox .search-btn { max-width: 100%; }  
#customerProfileDisplaYBox_div .float-right { margin-left: 23px; }
.agent_name1 { position: relative; top: 0; float: left !important; width: 100%; margin: 0 !important; }
.msmbox .msm-text-box h2 { margin-bottom: 3px;}
} 
@media screen and (max-width: 540px) {
.msmbox .imgbox img { display: inline-block; margin-top: 0; }
.arrow-right { top: 35px; }
.arrow-left { top: 35px; }
.status { position: relative; top: -3px; }  
.call-status { font-size: 14px !important; } 
.status { position: relative; top: 0px; float: left !important; margin: 0 !important; width: 100%; }
.msmbox .msm-text-box h2 { margin-top: 3px;}
}
@media screen and (max-width: 528px) {
.msmbox .imgbox { max-width: 80px; height: 80px; line-height: 80px; }
.msmbox .message-text-box { max-width: 340px; width: 100%; }
}
/* Added by vinod : 13-12-2022 */
@media screen and (max-width: 480px) {
.login .content { padding: 10px; } 
.searchpopup .search-dw { left: -270px; width: 350px; }
.searchpopup .searchfields { flex-direction:column; }
.searchpopup .searchfields .col-md-6:first-of-type { width: 100%; }
.searchpopup .searchfields .col-md-6 { padding: 0 10px; }
.searchpopup .searchbutton { margin: 10px 0 0 0 !important; justify-content: flex-end; display: flex; column-gap: 5px; }
}
/* Added by vinod : 13-12-2022 End*/
@media screen and (max-width: 479px) { 
#customerProfileDisplaYBox_div h1 { font-size: 16px; } 
.msmbox .message-text-box { max-width: 310px; width: 100%; }
.imgbox.d-inline-block.mt-3.mr-4 { margin-left: 0; margin-right: 23px; }
#customerProfileDisplaYBox_div .ml-4 { margin-left: 23px; margin-right: 0; }
.msmbox .msm-text-box { max-width: 70% !important; }
.msmbox .imgbox img { width: 25px !important; }
.msmbox .imgbox { padding-top: 18px !important; }
.msmbox .msm-text-box .bgbox h3 { font-size: 12px; }
#customerProfileDisplaYBox_div .call-status { font-size:12px; margin-left: 0!important; }
#customerProfileDisplaYBox_div p { width:100%; float:left; margin:0; }
.status { float: left !important; }
.msmbox .msm-text-box .bgbox1 h3 { font-size:12px; }
#customerProfileDisplaYBox_div .float-right { margin-left: 23px; margin-right: 0; }
.customer_profile_container { padding: 0; }
button.customer-close { font-size: 20px; width: 20px; height: 20px; line-height: 20px; }
}
@media screen and (max-width: 437px) { 
.msmbox .message-text-box { max-width: 100%; width: 100%; }
.msmbox .msm-text-box { max-width: 70% !important; }
}
@media screen and (max-width:367px){
.srh-main .close { position: absolute; top: 10px; right: 10px; }
.msmbox .msm-text-box { margin-left: 0 !important; max-width: 70% !important;  width: 100% !important;}
.msmbox .msm-text-box h2 { font-size: 12px; margin-bottom: 3px; }
.call-status { font-size: 12px !important; }
.msmbox .msm-text-box .bgbox p { font-size: 12px;}
.msmbox .msm-text-box .bgbox1 p { font-size: 12px; }
.agent_name { font-size: 12px; }
.msmbox .msm-text-box .bgbox1 { padding: 10px 10px 10px 10px; }
.msmbox .msm-text-box .bgbox { padding: 10px 10px 10px 10px; }
.agent_name1 { font-size: 12px; }   
.msmbox .imgbox { margin-top: 20px; }  
/*Added by vinod : 13-12-2022*/
.searchpopup .search-dw { left: -230px; width: 300px; }
}
@media screen and (max-width:320px){	
.msmbox .msm-text-box { width: 65% !important; }
.msmbox .msm-text-box .bgbox h3 { font-size:12px;} 
}  
.customer_name_container { font-size: 18px; color: #000; padding: 0px 0px 10px 0; }
/*  */
body { margin:0; padding:0; background:#edf2f9; font-family: 'Open Sans Regular' !important; }
.pl-0 { padding-left:0px !important; }
.pl-1 { padding-left:5px !important; }
.pr-0 { padding-right:0px !important; }
.pr-1 { padding-right:5px !important; }
.pl-2 { padding-left:10px !important; }
.pr-2 { padding-right:10px !important; }
/*header*/
#header { width: 100%; float: left; background:var(--header-bg);/* linear-gradient(90deg, rgb(69, 193, 247) 0%, rgb(179, 228, 249) 35%, rgb(212, 236, 247) 100%)*/; padding:5px 0; }
#header .row { margin-bottom: 0; }
.logo_new { float: left; margin: 0 40px 0 0; }
.logo_new img { width: 140px; height: auto; }
.logo_new .logo-default { margin:0 !important;  }
.top-header { width: 100%; float: right; text-align: right; }
.senddtmf { max-width: 120px; width: 100%; display: inline-block; position: relative; top: -2px; }
.senddtmf .form-group { margin:0; position:relative; }
.senddtmf .form-group .form-control { background: #EDF2F9; border-radius: 30px !important; font-size: 11px; height: 26px; padding: 0 10px;
  border: 1px solid #c6e0f6;  }
.senddtmf .form-group .send { display: inline-block; height: 26px; width: 26px; border-radius: 50% !important; background: var(--bg-blue);
  color: #fff; text-align: center; padding: 5px 0; font-size: 10px; position: absolute; right: 0px; top: 0px; }
.senddtmf .form-group .send:hover { background: #666; } 
.notification-box { display: inline-block; background: #dbf1fd; width: 30px; height: 30px;  border-radius: 50% !important; vertical-align: top; margin-right: 10px; text-align: center;  font-size: 20px;
position:relative; top: 5px; }
.notification-box a { padding-top: 10px; display: block;  font-size: 14px; }
.notification-box span.elisioncallback { background: #ec4346; height: 15px; width: 15px; position: absolute; border-radius: 50% !important; top: 0px; right: 2px; padding:1px 4px !important; }  
.send-dtmf-box { display: inline-block; background: #dbf1fd; width: 40px; height: 40px;  border-radius: 50% !important; vertical-align: top; margin-right: 5px; text-align: center;  font-size: 20px;
  padding-top: 3px; position:relative; }  
.userphone-box { display: inline-block; background: #dbf1fd; width: 40px; height: 40px;  border-radius: 50%; vertical-align: top; margin-right: 5px; text-align: center;  font-size: 20px;
  padding-top: 3px; position:relative; }    
.search-box { display: inline-block; background: #dbf1fd; width: 30px; height: 30px; border-radius: 50% !important; vertical-align: top;
  margin: 0 2px; text-align: center; font-size: 14px; padding: 4px 0 0 3px; position: relative; top: 5px; }
.agentview-box { display: inline-block; background:#dbf1fd; width: 30px; height: 30px;  border-radius: 50% !important; vertical-align: top; margin-left: 5px; text-align: center;  font-size: 16px;
  padding-top: 0; position:relative; border:1px solid #dbf1fd; color: var(--bg-blue); }
 .agentview-box a { padding: 6px 0; display: inline-block; }
.agentview-box:hover { background:#dbf1fd; }  
.callinqueue-box { display: inline-block; background: #dbf1fd; width: 30px; height: 30px;  border-radius: 50% !important; vertical-align: top; margin-right: 2px; text-align: center;  font-size: 20px;
  position:relative; top: 5px; }  
.callinqueue-box a { padding-top: 10px; display: block; font-size: 14px; }  
.callinqueue-box a:hover { background-color: transparent; }
.callinqueue-box span.elisioncallinqueue { background: #ec4346; height: 15px; width: 15px; position: absolute; border-radius: 50% !important; top: 0px; right: 2px; padding:1px 4px !important; }     
.campaign-box { display: inline-block; margin-right: 0px; background: #dbf1fd; padding: 2px 10px 4px 10px; border-radius: 5px !important; top: -2px; position: relative; }
.campaign-box .cam-icon { display: inline-block; font-size: 12px; }
.campaign-box .campaign-name { margin: 0 0 0 3px; display: inline-block; font-size: 11px; }
.sip-box { display: inline-block; margin-right: 0px; background: #dbf1fd; padding: 2px 10px 4px 10px; border-radius: 5px !important; top: -2px; position: relative; }
.sip-box .sip-icon { display: inline-block; font-size: 11px; }
.sip-box .sip-name { margin: 0 0 0 3px; display: inline-block; font-size: 11px; }
.notconnected-box { display: inline-block; background: #dbf1fd; width: 30px; height: 30px;  border-radius: 50% !important; vertical-align: top; margin-right: 2px; text-align: center;  font-size: 20px;
  padding:6px 0; position:relative;  }
.userbox { display: inline-block; }
.userbox .button { color: #444343; font-size: 18px; background: transparent; padding: 0; box-shadow: none; border-radius: 0; display: inline-block; cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease; }
.userbox .button:hover { color: #444343; }
.userbox .arrow { width: 13px; transition: transform 0.3s ease;  display: inline-block; position: relative; top: 2px; }
.userbox .arrow.open { transform: rotate(180deg); color:var(--bg-blue); }
.userbox .button p { display: inline-block; margin-right: 5px; font-family: 'Open Sans Bold'; font-size: 14px; margin-bottom: 0; margin-top: 0px; }
.userbox .dropdown { top:37px; position: absolute; color: #E3DFE9; font-size: 18px; background: white; padding-top: 10px; padding-bottom: 10px; border-radius: 15px !important; display: block;
  cursor: pointer; width: 235px; transform: scale(0.01); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease 0.15s; transform-origin: center top;
  overflow: hidden; right:10px; z-index:9999; }
.userbox .dropdown.open { transform: scale(1); opacity: 1; box-shadow: 3px 3px 30px rgba(118, 96, 168, 0.15); }
.userbox .dropdown a { position: relative; color: #020202; text-decoration: none; display: block; padding:5px 20px; transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease;
  text-align:left; font-size:14px;  }
.userbox .dropdown a i { font-size: 12px; display: inline-block; position: relative; top: 2px; margin-right: 5px; }
.userbox .dropdown a.clicked { padding-left: 35px; color: #987CD9; }
.userbox .dropdown a:hover { color:var(--bg-blue); padding-left: 35px; }
#dialableleadsspan .badge.badge-danger { margin: 0 0 0 10px; } 
/*maincontent*/
.page-content.elisionCont { background: transparent; }
.page-container { margin-top: 10px !important; }
.middelsection .row { margin-bottom: 5px; }
.sessionbox { /*display: inline-block;*/ display: none; margin-right: 0px; background: #dbf1fd; padding: 5px 10px; border-radius: 5px !important; top: 3px;
  position: relative; }
.sessionbox span { float: left; margin: 1.8px 3px 0 0; font-size: 12px; }
.sessionbox #sessionIDspan { float: left; margin: 0; font-size: 11px; }
.datetimebox { display: inline-block; margin-right: 0px; background: #dbf1fd; padding: 5px 10px; border-radius: 5px !important; top: 2px;
  position: relative; }
.datetimebox span { float: left; margin: 1.8px 3px 0 0; font-size: 12px; }
.datetimebox #status { float: left; margin: 0; font-size: 11px; }
#SecondSspan { display: inline-block; font-size: 14px; position: relative; top: 1px; right: 5px; }
#event_name { color: #000; float: left; font-size: 12px; letter-spacing: 0; }
#SecondSDISP { color: var(--bg-blue); float: left; margin: 0px 0 0 3px; font-size: 12px; }
.main-content .page-title { background: #fff; width: 100%; float: left; border-radius:10px !important; padding:2px 5px 5px 5px; margin:0 0 5px 0; }
.main-content .page-title .row { margin-bottom: 0; }
.main-content .page-title h1 { font-size:18px; color:#000; font-family: 'Open Sans Bold'; padding:10px; margin:0; }
.statusbox .content { background: #fff; width: 100%; float: left; border-radius: 10px !important; padding:10px; margin: 0; }
.statustext h3 { font-weight: bold; font-size: 11px; float: left; margin: 0; color: #333; }
#MainStatuSSpan { float: left; margin: -1px 0 0 4px; }
#timer_alt_display { display: inline-block; }
#ManuaLDiaLButtons { float: left; margin: 4px 0 0 0; }
.fastdial { width: 130px; float: left; position:relative; }
.fastdial .form-control { border:1px solid #d4dfef; height:32px; background:#edf2f9; border-radius:30px !important; padding: 0 10px; font-size: 12px; }
.fastdial .callbutton { display:inline-block; height:31px; width:31px; border-radius:50% !important; background-color:var(--bg-blue); color:#fff; text-align:center; font-size:16px; position: absolute;
right: 0; top: 0; padding: 8px 0; }
.fastdial .callbutton:hover { background:#666; }
.statustext { margin: 14px 0 0 0; float: left; width: 100%; letter-spacing: 0px; font-size: 11px; }
.manualdialbutton { width: 120px; float: left; text-align: center; position: relative; margin: 0 0 0 5px; }
.manualdialbutton a { position: relative; transition: all 0.3s; z-index: 1; overflow: hidden; font-weight:bold; border-radius:30px !important; display:block; text-transform:uppercase; height:32px; width: auto; line-height:32px; color:#fff; font-size:10px; }
.manualdialbutton a:hover::before { width: 100%; }
.manualdialbutton span { font-size: 22px; float: left; margin: 9px 0px 0 12px; }
.manualdialbutton p { margin:0; display: inline-block; color: #fff; letter-spacing: 1px; }

.manualdialbutton a::after { content:""; position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; z-index: -2; background-color:var(--bg-blue); }
.manualdialbutton a::before { content:""; position: absolute; width: 0%; height: 100%; left: 0; bottom: 0; z-index: -1; background-color:#539ad7; transition: all 0.3s; }

/*.callstatusbutton { display: inline-block; }
.callstatusbutton a { display:inline-block; border:2px solid #fc5a5a; background:#ffe3e3; color:#fc5a5a; border-radius:30px !important; padding:0 20px; text-transform:uppercase; height:39px; font-size:12px; font-weight:bold; line-height:36px; }*/
.callstatusbutton-box { display: inline-block; }
.callstatusbutton-box img { height: 32px; }
.callstatusbutton-box a { padding: 0; }
/*left button*/
.buttonscolumn { background: #fff; border-radius: 10px !important; padding: 5px; position: absolute; left: 5px; width: calc(105px - 5px); }
.elision-menu { width:100%; float:left; text-align:center; height: 82vh; }
.elision-menu ul { list-style:none; margin:0; padding:0; }
.elision-menu ul li { margin-bottom: 2px; }
.elision-menu ul li p { margin:0; }
.elision-menu ul li a { font-size: 11px; display: inline-block; padding: 10px 5px; border-radius: 5px !important;  transition: 0.5s; margin-bottom: 3px; position: relative; overflow: hidden; transition: 0.5s; width: 100%; }
.elision-menu ul li a::before { content: ''; position: absolute; width: 100%; height: 100%; background: linear-gradient(to right, transparent, white, transparent);
left: -100%; transition: 0.5s; top: 0; }
.elision-menu ul li a:hover::before { left: 100%; }
.elision-menu ul li a.disabled:hover::before { left: -100%; }
.elision-menu ul li a span { font-size:13px; }
.elision-menu ul li>span { width: 100%; float: left; }

.buttonscolumn .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background:#73BAEF; float: left; border-radius: 10px !important; width: 4px; }
.buttonscolumn .mCSB_scrollTools .mCSB_draggerRail {background: transparent; }
.buttonscolumn .mCSB_inside > .mCSB_container { margin-right: 0; }
.buttonscolumn .mCSB_scrollTools { width: 6px; top: 5px; right: -3px; }


/*.youarepause { background:#6b5cb1; color:#fff; }
.youarepause:hover { background:#dedbee; color:#6b5cb1; }*/
.youarepause { background:#45C1F7; color:#fff; }
.youarepause:hover { background:#c3e3f8; color:#0662a3; }
.youarepause.disabled:hover::before { left: 100% !important; }
.hangupcall.disabled { background:#fcdadb; color:#dd3437; opacity: 0.65; cursor: not-allowed; }
/*.hangupcall.disabled:hover { background:#dd3437; color:#fff; }*/
.hangupcall { background:#ec4346; color:#fff; position: relative; overflow: hidden; transition: 0.5s; }
.hangupcall:hover { background:#fcdadb; color:#dd3437; }



.recording.disabled { background:#b8eebd; color:#1e6e25; opacity: 0.65; cursor: not-allowed; }
.recording.disabled span i { color: #1e6e25 !important; }
/*.recording.disabled:hover { background:#1e6e25; color:#fff; }*/
.recording { background:#3ea447; color:#fff; }
.recording:hover {color: #fff; }
/*.recording:hover { background:#b8eebd; color:#1e6e25; }*/
.parkcall.disabled { background:#feecc4; color:#e2a00c; opacity: 0.65; cursor: not-allowed; }
/*.parkcall.disabled:hover { background:#e2a00c; color:#fff; }*/
.parkcall { background:#e8b138; color:#fff; }
.parkcall:hover { background:#feecc4; color:#e2a00c; }
/*.elision-menu ul li a:focus { color: #fff; }*/
#ParkCounterSpan { font-size: 11px; color: #000 !important; }
.parkcall:hover #ParkCounterSpan { color: #25722c !important; }
.transfercall.disabled { background:#c3e3f8; color:#0662a3; opacity: 0.65; cursor: not-allowed; }
/*.transfercall.disabled:hover { background:#46a2e3; color:#fff; }*/
.transfercall { background:#1e8edd; color:#fff; }
.transfercall:hover { background:#c3e3f8; color:#0662a3; }
.nextpause.disabled { background:#c3e3f8; color:#0662a3; opacity: 0.65; cursor: not-allowed; }
/*.nextpause.disabled:hover { background:#0662a3; color:#fff; }*/
.nextpause {background:#507dc1; color:#fff; }
.nextpause:hover {background:#c3e3f8; color:#0662a3; }
.ivrpark.disabled { background:#e8cdde; color:#b44089; opacity: 0.65; cursor: not-allowed; }
/*.ivrpark.disabled:hover { background:#b44089; color:#fff; }*/
.ivrpark { background:#b44089; color:#fff; }
.ivrpark:hover { background:#e8cdde; color:#b44089; }
.quicktransfer.disabled { background:#fddafa; color:#ab42fe; opacity: 0.65; cursor: not-allowed; }
/*.quicktransfer.disabled:hover { background:#ab42fe; color:#fff; }*/
.quicktransfer { background:#ab42fe; color:#fff; }
.quicktransfer:hover { background:#fddafa; color:#ab42fe; }
.requeue { background:#ab42fe; color:#fff; }
.requeue:hover { background:#fddafa; color:#ab42fe; }
.requeue.disabled { background:#fddafa; color:#ab42fe; opacity: 0.65; cursor: not-allowed; }
/*.requeue.disabled:hover { background:#ab42fe; color:#fff; }*/
.customtransfer.disabled { background:#dedbee; color:#5344a1; opacity: 0.65; cursor: not-allowed; }
/*.customtransfer.disabled:hover { background:#5344a1; color:#fff; }*/
.customtransfer { background:#5344a1; color:#fff; }
.customtransfer:hover { background:#dedbee; color:#5344a1; }
.pausecode { background: #3ea447; color: #fff; }
.pausecode:hover { background:#b8eebd; color:#25722c; }
.grabcall.disabled { background:#b8eebd; color:#25722c; opacity: 0.65; cursor: not-allowed; }
/*.grabcall.disabled:hover { background:#25722c; color:#fff; }*/
.grabcall { background:#25722c; color:#fff; }
.grabcall:hover { background:#b8eebd; color:#25722c !important; }
.grabcall:focus { background:#b8eebd; color:#25722c !important; }
.responsive-nav {display: none !important; }
#rightsidenav{ display: block; }
#rightsidenav .closebtn{ display: none; }
/*right nav*/
.menubox { padding: 0; height: 85vh; background-color:var(--bg-blue); /*background-image: linear-gradient(#236aa7, #3684c8, #236aa7); border-radius: 10px !important;*/ width: calc(100px - 5px); position: absolute; right: 5px; top: 0; }
.menubox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background:#73BAEF; float: left; border-radius: 10px !important; width: 4px; }
.menubox .mCSB_scrollTools .mCSB_draggerRail {background: transparent; }
.menubox .mCSB_inside > .mCSB_container { margin-right: 0; }
.menubox .mCSB_scrollTools { width: 6px; top: 5px; }
/*.menubox .mCSB_scrollTools .mCSB_dragger {cursor: pointer; width: 100%; height: 60px !important; z-index: 1; max-height: 60px !important;
  min-height: 60px !important; }*/
.menubox #sidebar { /*background: #337ab7;*/  width: 100%; border-radius: 10px !important; margin: 0 auto; float: right; }
.rightnav { width:100%; float:left; text-align:center; }
.rightnav ul { list-style:none; margin:0; padding:0; }
.rightnav ul li a.dashboard { padding: 10px 15px !important; }
.rightnav ul li { margin-bottom: 0px; border-top:1px solid var(--bg-blue);  }
.rightnav ul li:first-child { border-top: 0; }
.rightnav ul li p { margin:0 !important; }
.rightnav ul li a { color: #fff; font-size: 10px; display: block; padding: 5px 5px; transition: 0.5s; }
.rightnav ul li a:hover { background-color:var(--bg-bg-blue-hover) !importanrt; }
.rightnav ul li.active a { background-color:var(--bg-bg-blue-hover) !importanrt; }
.rightnav ul li a span { margin-bottom:3px; float:left; width:100%; }
/*.rightnav ul li a span img { width: 25px; }*/
.rightnav ul li a .dashboard-icon { width: 18px; }
.rightnav ul li a .information-icon { width: 20px; }
.rightnav ul li a .script-icon { width: 22px; }
.rightnav ul li a .form-icon { width: 18px; }
.rightnav ul li a .email-icon { width: 18px; }
.rightnav ul li a .wht-icon { width: 18px; }
.rightnav ul li a .intchat-icon { width: 22px; }
.rightnav ul li a .google-icon { width: 22px; }
.rightnav ul li a .link-icon { width: 22px; }
.rightnav ul li a .twitter-icon { width: 22px; }
.rightnav ul li a .fb-icon { width: 22px; }
.rightnav ul li a .cp-icon { width: 22px; }
#viber img { width: 16px !important; }
#WebFormSpan i, #WebFormSpanTwo i, #WebFormSpanThree i { font-size: 19px; }
/**/
.channel-box { /*display: inline-block;*/ display: none; letter-spacing: normal; font-size: 11px; color: #000; margin-right: 15px; position: relative;
top: -2px; }
.custtime-box { /*display: inline-block;*/ display: none; letter-spacing: normal; font-size: 11px; color: #000; margin-right: 15px; position: relative;
top: -2px; }
.middelscroll { height: 65vh; overflow-y: auto; scrollbar-color:#236AA7 #e4f4fc; scrollbar-width: thin; }
.middelscroll::-webkit-scrollbar { width: 8px; height: 14px; }
.middelscroll::-webkit-scrollbar-track { background: transparent; }
.middelscroll::-webkit-scrollbar-thumb { background: #236AA7; border-radius: 14px; }
.middelscroll::-webkit-scrollbar-thumb:hover { background: #236AA7; }
/*.middelscroll .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: var(--bg-blue); float: left; border-radius: 10px !important;  }
.middelscroll .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background: var(--bg-blue) !important; }
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background: #73BAEF !important; }
.middelscroll .mCSB_scrollTools .mCSB_draggerRail {background: transparent; }
.middelscroll .mCSB_inside > .mCSB_container { margin-right: 0; }
.middelscroll .mCSB_scrollTools { width: 6px; top: 0px; }
.middelscroll .mCSB_scrollTools .mCSB_draggerContainer { left: 2px; }*/
/*footer section css*/
#footer { width:100%; float:left; padding: 0; }
.footerbox { background:#fff !important; padding: 10px 0; border-top:1px solid #ddd; height: auto; } 
#footer .page-footer { background: #fff; }
#footer .footer-link { width:100%; float:left; text-align:center; padding: 0 10px; }
#footer .footer-link ul { margin:0; padding:0; list-style:none; float: right; }
#footer .footer-link ul li { display: inline-block; font-size: 12px; color: #373737; border-right: none; line-height: 18px; padding:0 10px; }
#footer .footer-link ul li:last-child { border-right:0; }
#footer .footer-link ul li a { color:#373737; }
#footer .footer-link ul li a:hover { color:#0891e0; }

.branchname-box { float: right; }
.branchname-box span { padding-right: 0px; }
#label_management { padding: 2px 4px !important; }
/*hangup popup css*/
.mobile-view-box { display: inline-block; }
.mobile-view-box2 { display: inline-block; position: relative; top: -4px; }
/*#MainHangupControl .arrow-up { display: none !important;}*/
/*#MainHangupControl #myDropdown { position: absolute; top: 0; right: 0; left: 0; }*/
.volume_box { display: inline-block; position: relative; left: 5px; top: 9px; }
.volume_box a { color: #068dd3; font-size: 16px; }
.headding-dashboard-icon { float: left; margin: 1px 7px 0 0; }
.headding-dashboard-icon img { width: 15px; }
.h-information-icon { float: left; margin: 1px 7px 0 0; }
.h-information-icon img { width: 16px; }
.h-script-icon { float: left; margin: 1px 7px 0 0; }
.h-script-icon img { width: 16px; }
.h-form-icon { float: left; margin: -1px 7px 0 0; }
.h-form-icon img { width: 16px; }
.h-email-icon { float: left; margin: 1px 7px 0 0; }
.h-email-icon img { width: 18px; }
.whatsapp-icon i { font-size: 17px; float: left; margin: 2px 7px 0 0; }
.h-intchat-icon { float: left; margin: 1px 7px 0 0; }
.h-intchat-icon img { width: 20px; }
.h-google-icon { float: left; margin: 1px 7px 0 0; }
.h-google-icon img { width: 18px; }
.h-link-icon { float: left; margin: 0px 7px 0 0; }
.h-link-icon img { width: 16px; }
.h-twitter-icon { float: left; margin: 1px 7px 0 0; }
.h-twitter-icon img { width: 16px; }
.h-fb-icon { float: left; margin: 1px 7px 0 0; }
.h-fb-icon img { width: 16px; }
/*Script Page*/
#ScriptContents table { width: 100%; }
#NewScriptContents { padding: 20px !important; font-size: 12px !important; }

/*Hangup Popup*/
.hangup-popup-content .modal-content { width: 100%; float: left; }
.hangup-popup-content .modal-dialog { max-width: 740px; width: 100%; }
.hangup-popup-content .modal-title { text-align: left; font-size: 14px; }
.hangup-popup-content .modal-header { padding: 10px; color: #fff; background-color: #337ab7; }
.hangup-popup-content .contentbox { width: 100%; float: left; padding: 10px; }
.hangup-popup-content .contentbox a { padding: 5px 10px; border-radius: 5px !important; }
#dispo_comments { border-radius: 15px !important; resize: none; border:2px solid #c3e3f8; height: 80px; margin-bottom: 5px; }
#BucketCategory a { background: #337ab7; color: #fff; border: 1px solid #337ab7; border-radius: 15px !important; word-wrap: break-word; }
#BucketCategory a:hover { background: #c3e3f8 !important; color: #0662a3 !important; }
#call_notes_dispo { border-radius: 15px !important;}
#WebFormSpan .disabled { cursor: not-allowed; }
#WebFormSpanTwo .disabled { cursor: not-allowed; }
#WebFormSpanThree .disabled { cursor: not-allowed; }
/*twitter page*/
div#twitter_page .portlet-body { padding: 10px 3px; }
/*viewagent*/
.view_agent_box { background: #236AA7; }
#AgentViewSpan td { color: #000 !important; padding: 5px 3px; } 
#AgentViewSpan .agenttitle { color: #fff !important; background: #236AA7; }
a.page-quick-sidebar-toggler { right: 325px; background: #236AA7; top: 0; border-radius: 50% !important; width: 40px; height: 40px; padding: 13px 0 0 0; }
a.page-quick-sidebar-toggler i { color: #fff; }
a.page-quick-sidebar-toggler:hover { background-color: #45C1F7 !important; }
.view_agent_box a { padding: 10px 0 !important; }
.view_agent_box .page-quick-sidebar .nav-tabs { background-color: #45C1F7; }
.view_agent_box .page-quick-sidebar .nav-tabs>li>a { color: #fff; border: 0; }
.view_agent_box .page-quick-sidebar .nav-tabs>li.active>a, .view_agent_box .page-quick-sidebar .nav-tabs>li:hover>a { border: 0; border-radius: 25px !important; background: #fff; color: #236AA7 !important; margin: 2px 0; }
.view_agent_box .page-quick-sidebar { background: #236AA7; }
#tbl_missed_calls_list { color: #fff; }
#tbl_missed_calls_list .refreshbtn { border-radius: 50% !important; width: 30px; height: 30px; padding: 6px 0 !important; }
/*facebook*/
#facebook_subpage li { border-top: 1px solid #337AB7; }
iframe#FacebookWebIFrame::-webkit-scrollbar { display: none; }
#viewcommentsdisplay { display: inline-block; }

/*Added vy vinod on 241121*/
#whts_emojitrgr { top: 12px !important; }
.whatsapp_web_container { /*border: 1px solid #009688;*/ }
.close-icon.seach-close { margin: 5px 8px 0 0 !important; }

.footer_menu { float: left; }
.footer_menu ul { margin: 0; }
.footer_menu > ul > li { padding: 0 !important; margin-left: 0px !important; }
.footer_menu ul li p { display: inline-block; margin: 0; font-size: 11px; }
.footer_menu ul li span i { font-size: 15px !important; color: #236aa7; }
.footer_menu ul li span { float: left; margin: 3px 0 0 0; display: none; }
.footer_menu > ul > li > a { background: var(--bg-blue); border-radius: 15px !important; padding: 1px 8px 2px 8px; color: #fff !important; transition: 0.5s; }
.footer_menu > ul > li > a:hover { background: #17558a; }

.lead_preview_box { float: left; margin: 1px 0 0 10px; position: relative; top: 8px; }
.rightnav ul li a span img { width: 17px !important; }
.rightnav span i { font-size: 18px; }

.whatsapp_block { position: relative; text-align: center; top: 4px; display: inline-block; }
.whatsapp_block .dropdown:hover .dropdown-menu { transform: scale(1); }
.whatsapp_block .dropdown-menu { border-radius: 15px !important; display: block; transform: scale(0); transition: ease-out 0.3s;
  padding: 10px; background: #55cd6c; margin: 7px 0 0 -60px; }
.whatsapp_block .dropdown-menu::before { border-bottom: 8px solid #e0e0e0; left: 70px; }
.whatsapp_block .dropdown-menu::after { border-bottom: 7px solid #55cd6c; left: 70px;}
.whatsapp_block .dropdown-menu ul { margin: 0; padding: 0; }
.whatsapp_block .dropdown-menu ul li { display: block; }
.whatsapp_block .dropdown-menu ul li a { font-size: 12px; color: #fff; display: block; padding:3px 8px !important; letter-spacing: normal; }
.whatsapp_block .dropdown-menu ul li a:hover { background-color: #45bd5c; }
.whatsapp_block .dropdown > a { background: #55cd6c; width: 30px; display: block; height: 30px; border-radius: 50% !important; 
  padding: 8px 0 0 0; color: #fff; font-size: 20px; }

.facebook_block { position: relative; text-align: center; top: 4px; display: inline-block; }
.facebook_block .dropdown:hover .dropdown-menu { transform: scale(1); }
.facebook_block .dropdown-menu { border-radius: 15px !important; display: block; transform: scale(0); transition: ease-out 0.3s;
  padding: 10px; background: #1877f2; margin: 7px 0 0 -60px; }
.facebook_block .dropdown-menu::before { border-bottom: 8px solid #e0e0e0; left: 70px; }
.facebook_block .dropdown-menu::after { border-bottom: 7px solid #1877f2; left: 70px;}
.facebook_block .dropdown-menu ul { margin: 0; padding: 0; }
.facebook_block .dropdown-menu ul li { display: block; }
.facebook_block .dropdown-menu ul li a { font-size: 12px; color: #fff; display: block; padding:3px 8px !important; letter-spacing: normal; }
.facebook_block .dropdown-menu ul li a:hover { background-color: #0867e2; }
.facebook_block .dropdown > a { background: #1877f2; width: 30px; display: block; height: 30px; border-radius: 50% !important; 
  padding: 8px 0 0 0; color: #fff; font-size: 16px; }

.twitter_block { position: relative; text-align: center; top: 4px; display: inline-block; margin:0 3px; }
.twitter_block .dropdown:hover .dropdown-menu { transform: scale(1); }
.twitter_block .dropdown-menu { border-radius: 15px !important; display: block; transform: scale(0); transition: ease-out 0.3s;
  padding: 10px; background: #1C9CEA; margin: 7px 0 0 -60px; }
.twitter_block .dropdown-menu::before { border-bottom: 8px solid #e0e0e0; left: 70px; }
.twitter_block .dropdown-menu::after { border-bottom: 7px solid #1C9CEA; left: 70px;}
.twitter_block .dropdown-menu ul { margin: 0; padding: 0; }
.twitter_block .dropdown-menu ul li { display: block; }
.twitter_block .dropdown-menu ul li a { font-size: 12px; color: #fff; display: block; padding:3px 8px !important; letter-spacing: normal; }
.twitter_block .dropdown-menu ul li a:hover { background-color: #0C8CDA; }
.twitter_block .dropdown > a { background: #1C9CEA; width: 30px; display: block; height: 30px; border-radius: 50% !important; 
  padding: 8px 0 0 0; color: #fff; font-size: 16px; }  

.customer_profile_block { display: inline-block; position: relative; margin: 0 0px 0 3px; top: 4px; } 
.customer_profile_block div#customer_profile {  }
.customer_profile_block a.icon { background: var(--bg-blue); width: 30px; display: block; height: 30px; border-radius: 50% !important; 
 padding: 8px 0 0 0; color: #fff; font-size: 16px; text-align: center; }
.customer_profile_block a.icon:hover { background: var(--bg-blue-hover);  }

 /*404 Notfound page*/
#notfound { position: relative; height: 60vh; width:100%; float:left; }
#notfound .notfound { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.notfound { max-width: 100%; width: 100%; line-height: 1.4; text-align: center; padding-left: 15px; padding-right: 15px;}
.notfound .notfound-404 { position: absolute; height: 100px; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%);
          transform: translateX(-50%);  z-index: -1; }
.notfound .notfound-404 h1 { color: #98b9d5; font-weight: 900; font-size: 200px; margin: 0px; position: absolute;
  left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.notfound h2 { font-size: 30px; color: #000; font-weight: 900; text-transform: uppercase; margin: 15px 0 0 0;}
.notfound p { font-size: 14px; color: #000; font-weight: 400; text-transform: uppercase; margin-top: 15px !important; margin-bottom: 0 !important; }

.back_button { width: 100%; float: left; top: 120px; position: relative; }
.back_button a { font-size: 14px; text-decoration: none; text-transform: uppercase; background:var(--bg-blue-hover); display: inline-block;
  padding: 16px 38px; border-radius: 40px; color: #fff;font-weight: 400; -webkit-transition: 0.2s all; transition: 0.2s all; border:2px solid transparent; }
.back_button a:hover { background-color:transparent; border:2px solid var(--bg-blue-hover); color:var(--bg-blue-hover); }
.link_iframe { height: 64vh; }
/*End*/
/*Transfer Call Popup css*/
#transferModal { padding-left: 0 !important; }
#Leave3WayCall a { font-size: 12px; }
#DialBlindTransfer a { font-size: 12px; }
#DialWithCustomer a { font-size: 12px; letter-spacing: normal; }
#ParkCustomerDial a { font-size: 12px; }
#ContactPullDown a { font-size: 12px; }
#DialBlindVMail a { font-size: 12px; }
#consultative_checkbox { padding: 7px 0 0 0; display: block; }
#FormPanel .table-hover > tbody > tr:hover > td { background: transparent; !important; }

/*01-12-21*/
#callsinqueuedisplay_Div .close {
  position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#callsinqueuedisplay_Div .close:hover {opacity: 1;}

#callback_list .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#callback_list .close:hover {opacity: 1;}

#ViewCommentsBox_div .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#ViewCommentsBox_div .close:hover {opacity: 1;}

#CalLNotesDisplaYBox_div .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#CalLNotesDisplaYBox_div .close:hover {opacity: 1;}

#CalLLoGDisplaYBox_div .close { position: absolute; top: 17px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#CalLLoGDisplaYBox_div .close:hover {opacity: 1;}

#LeaDInfOBox_Div .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#LeaDInfOBox_Div .close:hover {opacity: 1;}

#transferModal .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#transferModal .close:hover {opacity: 1;}

#callback_div .close { position: absolute; top: 10px; right: 20px; z-index: 9999; opacity: 0.5; background: #fff; width: 25px; height: 25px; background-position: 8px 8px;
  border-radius: 50% !important; margin: 0 !important; }
#callback_div .close:hover {opacity: 1;}

/*added css for Custom form :02/12/2021 */
#FormPanel > table { background: #fff !important; }
.custom-form { padding: 0 10px 10px 10px; background: #fff; }
div.custom-form table tr td.first-td-val {background: #f4f4f4 !important;box-shadow: none !important;border: 1px solid #ebebeb; font-family: arial; }
div.custom-form table tr td.first-td-val, div.custom-form table tr td.final-render {padding: 5px !important; font-family: arial; }
div.custom-form table tr td.final-render { background: transparent; border: 1px solid #ebebeb; font-family: arial; }
div.custom-form table tr td.final-render input { width: 100% !important !important; font-family: arial; }
div.custom-form table tr td.final-render select { width: 100% !important !important; font-family: arial; }
div.custom-form table tr td.final-render input[type="checkbox"] { display: inline-block; margin: -3px 0px 0 6px !important; }
div.custom-form table tr td.final-render input[type="radio"] { display: inline-block; margin: -2px 0px 0 6px !important; }

/*Added css for lead preview Checkbox */
#DiaLLeaDPrevieW .checkboxfield input { padding: 0; height: initial; width: initial; margin-bottom: 0; display: none!important; cursor: pointer }
#DiaLLeaDPrevieW .checkboxfield label { margin: 0; position: relative; cursor: pointer; font-size: 14px; color: #000; }
#DiaLLeaDPrevieW .checkboxfield label:before { content: ''; -webkit-appearance: none; background-color: transparent; border-radius: 2px; border: solid 2px #4287fe;
  display: inline-block; position: relative; vertical-align: middle; cursor: pointer; width: 15px; height: 15px; margin: 3px 5px 0 0; float: left; }
#DiaLLeaDPrevieW .checkboxfield input:checked+label:after { content: ''; display: block; position: absolute; top: 5px; left: 5px; width: 5px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
#DiaLLeaDPrevieW .checkboxfield input[type="checkbox"]:checked + label::before { background-color: #4287fe; border-color: #4287fe; color: #fff; }
/*End*/

/*call info page css start*/
#CallLogSpan .table-scrollable table th { background: #f4f4f4 !important; }
#LeaDInfOSpan > table { border: 1px solid #DDD !important; margin-bottom: 10px; }
#LeaDInfOSpan > table td { padding: 5px; border: 1px solid #DDD !important; }
#LeaDInfOSpan > table td:first-child { color: #000; background: #f4f4f4; width: 30%; }
/*End*/

/*Chat customer*/
#private_message { margin: 0 5px 0 0; }
#MuteCustomerChatAlert { margin: 0 5px 0 5px; }

/*hangup popup*/
#DispoSelectHAspan { max-width: 120px; width: 100%; display: block; }
#DispoSelectHAspan a { background: #E8545E; border-color: #E8545E; border-radius: 25px !important; }
#DispoSelectHAspan a:hover { background: #ec4346; border-color: #ec4346; }

/**/
.popup-head.select_group { width: 50%; background: #999; color: #fff; font-size: 12px !important; padding: 9px 10px; }
.popup-head.not_select_group { width: 50%; background: #999; color: #fff; font-size: 12px !important; padding: 9px 10px; }
#CloserSelectAdd{ font-size:12px !important; font-weight:600 !important; width: 100%; display: block; } 
#CloserSelectAdd a.add_all_btn { background:#c3e3f8; display: block; padding: 6px 0; color: #236AA7; transition: 0.5s; text-align: center; border-radius: 25px !important; }
#CloserSelectAdd a.add_all_btn:hover { background: var(--bg-blue-hover); color: #fff; }
#CloserSelectDelete{font-size:12px !important; font-weight:600 !important; width: 100%; display: block; }
#CloserSelectDelete a.delete_all_btn { background:#c3e3f8; display: block; padding: 6px 0; color: #236AA7; transition: 0.5s; text-align: center; border-radius: 25px !important; }
#CloserSelectDelete a.delete_all_btn:hover { background: var(--bg-blue-hover); color: #fff; }
.submit_reset { padding: 10px 0 0px 0; }
#CallBacKsLisT table th { background: #f4f4f4; }
.down_angle { margin: 14px 0 0 0px !important; height: 39px; }
/*Whatsapp Attachent Popup*/
#image_view .modal-header { padding: 5px 0; background: #236AA7; color: #fff; }
#image_view .modal-header a { background: #99bcdb; color: #1d415f; border: 1px solid #99bcdb; }
#image_view .modal-header a:hover { background: #fff; }
#image_view #file_display iframe { border: 0; padding: 5px; height: 350px; }

#conlist_view .modal-header { padding: 5px 0; background: #236AA7 !important; color: #fff; }
#conlist_view .modal-header a { background: #99bcdb; color: #1d415f !important; border: 1px solid #99bcdb !important; }
#conlist_view .modal-header a:hover { background: #fff; }

/***Call In Queue***/
#callsinqueuelist th { background: #f4f4f4; }

/*after integrate css add*/
.notification-box span.elisioncomminbox {
  background: #ec4346 !important;
  height: 18px;
  width: 18px;
  position: absolute;
  border-radius: 50% !important;
  top: -1px;
  right: 0px;
  padding: 2px 0 0 0 !important;
  font-size: 10px;
  color: #fff !important;
}
.sectionbox.today-status-box { height: 275px; }
/*.sectionbox.today-status-box .tab-content .tab-pane { display: block; }*/
#OutboundWhatsappPanel body {
  background-color: #fff;
}
#DispoCommentsContent { float: left; width: 100%; }
#BucketCategory ul { padding: 0 0 10px 0; }

/**/
#webrtc_header { top: 5px; }
.notification-box a i { margin: -2px 0 0 auto; }
#El_DIAL { float: left; margin: 3px 4px 0 0; }
#El_SKIP { float: left; margin: 3px 0px 0 0; }
#El_DIAL a { font-size: 10px; letter-spacing: .5px; padding: 0 2px; border-radius: 3px !important; }
#El_SKIP a { font-size: 10px; letter-spacing: .5px; padding: 0 2px; border-radius: 3px !important; }
.dspl_phn_cht_lst .col-md-5.pd-0.m-0.fnt-9 { right: 0 !important; }
/*dashboard css*/
.middelsection { width: calc(100% - 220px); margin: 0 auto; }
/*customer information form*/
.customer_information_form .row { display: flex; flex-wrap: wrap; }
.customer_information_form .row .col-md-3 { width: 20%; padding: 0 5px; }
.customer_information_form .row .col-md-2 { width: 20%; padding: 0 5px; }
.customer_information_form .row.ElisionCustInfo .col-md-4 { width: 33.33%; padding: 0 5px; }
.customer_information_form .row.ElisionCustcommt .col-md-12 { padding: 0 5px; }
.customer_information_form .ElisionCustInfo_three .col-md-4, .ElisionCustInfo_three .col-md-2 , .ElisionCustInfo_three .col-md-3 { width: 25% !important; padding: 0 5px; }

#viewcommentsdisplay input { width: 50px; box-shadow: none !important; border: 0 !important; background: var(--bg-blue); border-radius: 5px !important; position: relative; color: #fff; font-size: 12px;padding: 2px 0;}
#viewcommentsdisplay input:hover { background: #17558a; } 
#CallNotesButtons a { display: inline-block; background: var(--bg-blue); color: #fff; padding: 3px 5px; font-size: 12px; border-radius: 5px !important; }
#CallNotesButtons a:hover { background: #17558a; } 
#form_custom_fields .nav-tabs > li.active > a { color: #236AA7 !important; }
#form_custom_fields .nav-tabs > li.active>a:hover { color: #236AA7 !important; }
/*added by vinod : 03-03-2022*/
#BucketCategory ul li { margin: 0 2px 0 0; }
#DispoSelectContent { width:100%; }
/*for loging css*/
.flagicon { position: absolute; top: 12px; left: 10px; color: #ccc; }
/*Added by vinod : 13-12-2022*/
#LogiNReseT .btn { text-transform: uppercase; }