@media screen and (max-width: 640px) {
   body {    
   background:#fff !important;
   }
}

.ic-green {
  margin-right:3px;
  margin-top:2px;
  font-size: 15px;
  background: #42b62a;
  position:absolute;
  border-radius:100%; 
  border:3px solid #fff; 
  width:11px; 
  height:11px; 
  bottom:5px;
  right:0px;
}

.chat-typing-indicator {
	background:#fff;
    position:absolute; 
	width:100%; 
	height:100%;
	color:#999999;
	font-size:13px;
}

.noinbx {
  font-weight: 500;
  font-family: 'Roboto';
  display: block;
  margin-top: 150px;
  box-sizing: border-box;
  padding-left: 10px;
  padding-right: 10px;
  line-height: 20px;
  font-size: 16px;
  text-align: center;
  color: rgba(69, 69, 69, 0.4);
}

.not-found {
	width:100%; 
	max-width:500px; 
	height:220px; 
	background:#fff; 
	border-radius:12px; 
	border:1px solid #ddd;
    margin-top:15px; 
	position:relative; 
	box-shadow:0 1px 2px 0 rgba(0,0,0,0.15); 
	display:block; 
	box-sizing:border-box; 
	padding:10px; 
	margin-left:auto; 
	margin-right:auto;
	margin-bottom:15px;
}

.not-found-dgt {
	display:block; 
	width:100%;
	font-size:50px; 
	font-weight:bold; 
	text-align:center; 
	color:#9c9c9c;  
	margin-top:60px;
}

.not-foundSP { 
    margin-top:auto;
	display:block;
	text-align:center;
	font-size:20px;	
	line-height:24px; 
	font-size:16px; 
	font-weight:bold;
}

.silho-lodv {
    background: #fff; 
    z-index: 9999; /* Higher z-index ensures it covers content on load */
    display: flex;    
    justify-content: center; /* Added: centers image horizontally */
    align-items: center;     /* Added: centers image vertically */
    position: absolute;
    top: 0;
    bottom: 0; 
    transition: opacity 0.5s ease, visibility 0.5s ease; /* Added: smooth fade-out */
}

@media screen and (min-width: 881px) and (max-width: 1070px){
  .silho-lodv  {   
    right: 0px;
   }
}

@media screen and (min-width: 1071px) {
  .silho-lodv  { 
    width: 100%; 
    max-width: 662px;
    left: 50%;  
    transform: translateX(-50%); 
    margin-left: 204px;
   }
}

@media screen and (max-width: 880px) {
  .silho-lodv  {
    width: 100%; 
    max-width: 600px;     
    left: 50%;  
    transform: translateX(-50%); 
   }
}

/* Pulsing Image Styling */
#loader-image {
  width: 80px; /* Adjust size as needed */
  height: auto;
  animation: pulse 1.5s infinite ease-in-out;
}

@media screen and (max-width: 640px) {
	#loader-image {
	width:50px;						
	}
}

/* Keyframe Pulse Animation */
@keyframes pulse {
  0% {
    transform: scale(0.95);
    opacity: 0.6;
  }
  50% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(0.95);
    opacity: 0.6;
  }
}

/* Changed selector from #loader-wrapper to match your class name .silho-lodv */
.silho-lodv.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.msg-lodaddv {
	width:100%; 
	background:#fff;
}

@media screen and (min-width: 881px) {
  .msg-lodaddv {    
   margin-top:-9px;
   }
}

.ac-ver {
  font-size: 15px;
  color: #007fd2;
  height:15px;
  width:15px;
  background:#fff;
  border-radius:50%;
}

@media screen and (max-width: 880px) {
  .msg-chatlist-top {    
   display:none;
   }
}

.rxtn-div-del, .rxtn-div-blk {
	background:#e6ffd2; 
	z-index:5; 
	position:absolute;	
	min-width:150px; 
	height:41px;
	border-radius:41px; 
	color:#7cc046;
	border:1px solid #7cc046;
	display:none;  
	padding-left:10px;
	padding-right:10px;
	box-sizing:border-box;
	top:7px;
	left:50%;
	-webkit-transform:translateY(-50%, 0%);
	-ms-transform:translateY(-50%, 0%);
	transform:translate(-50%, 0%);
	width:auto;	
}

@media screen and (max-width: 640px) {
  .rxtn-div-del, .rxtn-div-blk {   
   top:4px;	
   color:#fff;
   background:#6c2bd9;
   border:1px solid #6c2bd9;	   		  	   
   }
}

.rxtn-inndv {
	width:auto; 
	height:100%; 
	display:flex; 
	margin-left:auto; 
	margin-right:auto; 
}

.rxtn-inndvADD {
	border-radius:36px !important;
	height:36px;
	box-sizing:border-box;
	color:#fff;
	margin-top:2.5px;
}

.rxtn-in {
   font-size: 16px;
   font-weight: 500;
   font-family: 'Roboto';
   margin:auto;
}

.rifb-dvADD {
	height:36px !important;
	font-family:'Inter',sans-serif;
	font-weight:normal !important;
	top:7px !important;
	font-weight:normal;	
	font-size:15px;
	border:none;
	min-width:auto;
}

.bada-chat-top {
	background:#fff; 
	height:54px; 
	box-sizing:border-box; 
	padding-left:10px; 
	padding-right:10px; 
	display:flex; 
	max-width:600px; 
	margin-left:auto; 
	margin-right:auto; 
	margin-top:1px;
	position:relative;
	z-index:1;
}

@media screen and (min-width: 881px) {
  .bada-chat-top {    
   display:none !important;
   }
}

@media screen and (max-width: 880px) {
  .nv-dv {    
   display:none !important;
   }
}

@media screen and (max-width: 640px) {
  .bada-chat-top {
   margin-top:0px;	      
   height:50px;
   }
}

@media screen and (max-width: 600px) {
  .bada-chat-top { 
   box-shadow:none;
   }
}

.bada-arrowryt-div {
	width:30px; 
	height:40px; 
	margin-top:auto; 
	margin-bottom:auto; 
	display:flex; 
}

.bada-arwlft-ic, .bada-arwlft-ic-mes {
	font-size:20px; 
	margin-top:auto; 
	margin-bottom:auto;
	margin-left:-3px; 
	cursor:pointer;
}

.bada-topdiv-right {
	width:40px; 
	height:40px; 
	margin-top:auto; 
	margin-bottom:auto; 
	display:block; 
}

.bada-userb-im {
	width:38px; 
	height:38px; 
	border-radius:50%; 
	object-fit:cover;
    object-position:center center; 
	border:1px solid #c9c9c9; 
	cursor:pointer;
}

.bada-userb-det {
	width:calc(100% - 70px); 
	height:40px; 
	display:flex; 
	margin-top:auto; 
	margin-bottom:auto;
}

.bada-userb-nemdv {
	display:flex; 
	width:calc(100% - 36px); 
	box-sizing:border-box; 
	padding-left:8px;
}

.bada-userb-nem {
	margin:auto 0px; 
	white-space:nowrap; 
	overflow:hidden; 
	text-overflow:ellipsis; 
	font-size:16px; 
	width:calc(100% - 36px);
}

.bada-ic-usemor, .bada-ic-usemor-mes {
	position:absolute; 
	right:15px; 
	top:50%; 
	-webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%); 
	transform:translateY(-50%); 
	background:#eee; 
	width:26px; 
	height:26px; 
	line-height:26px; 
	text-align:center;
	cursor:pointer; 
	border-radius:50%; 
	box-sizing:border-box;
}

.bada-ic-hom {
	position:absolute; 
	right:50px; 
	top:50%; 
	-webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%); 
	transform:translateY(-50%); 
	background:#eee; 
	width:26px; 
	height:26px; 
	line-height:26px; 
	text-align:center; 
	cursor:pointer; 
	border-radius:50%; 
	box-sizing:border-box;
}

@media screen and (max-width: 640px) {
  .bada-ic-usemor, .bada-ic-usemor-mes {    
   right:10px;
   }
}

@media screen and (max-width: 640px) {
  .bada-ic-hom {    
   right:45px;
   }
}

.bada-ic-usemor:hover {
	background:#e4e4e4;
}

.bada-mopt-fixd {
   position:fixed;
   top:0px;
   bottom:0px;
   left: 50%;
   -webkit-transform: translateY(-50%, 0%);
   -ms-transform: translateY(-50%, 0%);
   transform: translate(-50%, 0%);		
   width:100%;
   max-width:600px;
   height:100%;  
   display:none;
   overflow-y:auto;  
}

@media screen and (min-width: 881px) {
  .bada-mopt-fixd { 
   display:none !important;
   } 
}

.bada-mopt-sec {
  background:#fff;
  position:relative;
  margin-top:0px;	
  box-shadow:none;
  border-radius:0px;
  width:100%;
  max-width:600px;
  margin-right:auto;
  margin-left:auto;
  height:100%;
  box-sizing:border-box;
}

.bada-srch-msgs {
	width:100%; 
	height:calc(100% - 58px);	 
	margin-top:2px;
	box-sizing:border-box;
	padding-left:10px; 
	padding-right:10px;
	padding-top:5px;
	background:#fff;
}

@media screen and (max-width: 640px) {
  .bada-srch-msgs { 
    height:calc(100% - 51px);
    margin-top:1px;   
   }
}

.bada-mopt-inner {   
  box-sizing:border-box; 
  padding:0px 15px;
}

@media screen and (max-width: 880px) {	
  .bada-mopt-inner {    
   position:absolute;
   bottom:0px;
   top:0px;
   width:100%;
   max-width:600px;
  }	
}

@media screen and (max-width: 640px) {	
  .bada-mopt-inner {    
   padding-left:10px;
   padding-right:10px;
   padding-bottom:10px;
  }	
}

.bada-header {    
   width:100%; 
   height:55px; 
   border-bottom:1px solid #e4e4e4;
   box-shadow:0 2px 1px -1px rgba(0,0,0,0.06);   
   display:flex;    
}

.bada-header-tp {    
   width:100%; 
   height:55px; 
   border-bottom:1px solid #e4e4e4;
   box-shadow:0 2px 1px -1px rgba(0,0,0,0.06);   
   display:flex;
   position:fixed; 
   top:0px; 
   background:#fff; 
   padding-left:10px; 
   padding-right:10px; 
   box-sizing:border-box;    
}

@media screen and (max-width: 640px) {	  
  .bada-header, .bada-header-tp   { 
   height:50px;    
  }	
}

.bada-header-btm {
   width:100%; 
   height:65px; 
   border-top:1px solid #e4e4e4;
   box-shadow:0 -2px 1px -1px rgba(0,0,0,0.06); 
   display:flex;
   position:fixed; 
   bottom:0px; 
   background:#fff; 
   padding-left:5px; 
   padding-right:5px; 
   box-sizing:border-box;
}

.bada-edt-mid {	
	overflow-y:auto; 
	background:#fff; 
	margin-top:55px; 
	width:100%; 
	height:calc(100% - 120px);
}

@media screen and (max-width: 640px) {	  
    .bada-edt-mid   { 
    margin-top:50px; 
	height:calc(100% - 115px);   
    }	
}

.bada-txtria-dv {
	width:calc(100% - 20px); 
	height:auto;   
	margin-top:10px; 
	box-sizing:border-box; 
	margin-left:auto; 
	margin-right:auto;
	display:flex;
}

.bada-txtria {
	width:calc(100% - 50px); 
	height:100px;
	overflow-y:auto; 
	border-radius:12px; 
	background:#eee; 
	border:1px solid #e4e4e4; 
	box-sizing:border-box;
	margin-right:10px;
	padding:10px;
	outline:none;
	font-size:15px;
	font-family:'Inter',sans-serif;
	resize:none;
	line-height:24px;
}

@media screen and (max-width: 500px) {
   .bada-txtria {    
   line-height:20px;
   }
}

.bada-prfpic-dv {
	width:50px;
	height:100%;
	box-sizing:border-box;
	padding-left:10px;
}

.bada-prfpic {
	width:40px;
	height:40px;
	border-radius:50%;
	box-sizing:border-box;
	border:1px solid #e4e4e4;	
}

.bada-pic-dv {
	width:calc(100% - 20px);   
	margin-top:15px; 
	box-sizing:border-box; 
	display:block;
	margin-left:auto;
	margin-right:auto;
	position:relative;
}

.bada-pic {
	width:calc(100% - 50px); 
	max-width:300px;
	height:auto; 
	border-radius:12px; 
	border:1px solid #e4e4e4;	
	box-sizing:border-box;		
	margin-bottom:10px;
}

.bada-pic-two {
	width:auto; 
	position:absolute; 
	right:0px; 
	display:flex;
}

.bada-upde-dv {
	width:100%;
	height:44px;
	border-radius:44px;
	background:#6c2bd9;
	color:#fff;
	display:flex;
	cursor:pointer;
	margin-top:10px;
	outline:none;
	border:1px solid #6c2bd9;
	box-sizing:border-box;
}

.bada-upde-sp {
	margin:auto;
    font-size: 16px;
    font-weight: 500;
    font-family: 'Roboto';
}

.bada-lft {   
   font-size:17px; 
   color:#202020;
   width:100%; 
   height:100%; 
   display:inline-flex; 
   align-items:center;   
}

.badadet-back-icon  {   
   position:relative;
   font-size:20px; 
   cursor:pointer;
   margin-left:-3px;
}

.badadet-clos-icon {
   background:#eee;
   position:relative;   
   cursor:pointer;
   width:26px; 
   height:26px;
   line-height:26px;
   text-align:center;
   border-radius:50%;     
}

.badadet-clos-icon:hover {
   background:#e7e7e7; 
}

.bada-expla {      
   margin:auto;
   font-size: 17px;
   font-weight:bold;
}

.bada-det-hse {    
	margin-top:10px; 
	position:absolute;
	top:140px;	
	width:calc(100% - 30px);		
	max-height:calc(100% - 140px);	
	overflow-y:auto;
	box-sizing:border-box; 
    padding-top:0px;
    padding-bottom:0px;
    padding-left:0px;
    padding-right:0px;
    margin-top:0px; 
}

@media screen and (max-width: 640px) {
  .bada-det-hse {	   
    width:calc(100% - 20px);		   		  	   
   }
}

.bada-det-bf {
   box-sizing:border-box; 
   padding-top:15px; 
   padding-bottom:15px;
   display:flex;
   text-decoration:none;
   outline:none;
   color:#454545; 
   cursor:pointer;
   border-bottom:1px solid #e4e4e4;
   line-height:22px;
}

.bada-det-im {
    width: 50px;
    height: 50px;
    border-radius: 50%;
	margin-right:10px;    
    border: 1px solid #e4e4e4;
    object-fit:cover;
    object-position:center center;
}

.bada-carnems-hse {
   display:flex;
}

.bada-carnems-dv {   
    margin:auto 0;	
}

.bada-carnem-a {   
    font-weight:bold;
}

.bada-carnem-b {   
    color:#999999;
}

.bada-dt-optdiv {   
    padding-left:10px;
	padding-right:10px;	  
	cursor:pointer;
	line-height:22px;
}

.bada-dt-optdiv:hover {   
    background:#eee !important;
}

.bada-dt-icon {   
   font-size:16px;  
   width:22px; 
   display:inline-block;  
}

.bada-dl-expla {    
   border:1px solid #e4e4e4;
   background:#fff;
   border-radius:0px;
   min-height:60px;
   width:calc(100% - 2px);
   marging-top:3px;
   margin-bottom:10px;
   display:none;
}

.bada-blk-expla {    
   border:1px solid #e4e4e4;
   background:#fff;
   border-radius:0px;
   min-height:60px;
   width:calc(100% - 2px);
   marging-top:3px;
   margin-bottom:10px;
   display:none;
}

#badadl-cht, #badablk-user {	
	width:calc(100% - 22px);	
	height:100%;
	display:inline-block;
	padding-top:12px;
	padding-bottom:12px;		
}

.bada-dt-tri {
	width: 0;
	height: 0;
	border-top:12px solid transparent;
	border-bottom:12px solid transparent;
	border-right:13px solid #e4e4e4;
	-ms-transform:rotate(90deg); /* IE 9 */
    transform:rotate(90deg);
	margin-left:30px;
	margin-top:-19px;		
}

.badadt-tri-inner {
	position: relative;
	top: -11px;  
	left: 2px; 
	width:0;
	height:0;
	border-top:11px solid transparent;  
	border-bottom:11px solid transparent; 
	border-right:12px solid #fff;
	color:#fff;	
}

.bada-exp-dv {
   box-sizing:border-box;
   padding:10px;   
   margin-top:-5px;
}

.bada-car-rp {
   box-sizing:border-box;
   padding:10px;  
   margin-top:-5px;
}

.bada-sp-no, .bada-sp-cancel {
   padding:6px 10px;
   background:#f0f0f0;   
   border-radius:5px;
   border: 1px solid #e4e4e4;  
   min-width:60px;
   text-align:center;
   display:inline-block;
   cursor:pointer;
   margin-bottom:5px;
}

.bada-sp-block, .bada-sp-yes {
   padding:6px 10px;
   background:#007fd2;
   color: #fff;
   border-radius:5px;
   border: 1px solid #3893cf;
   margin-left:20px;
   min-width:60px;
   text-align:center;
   display:inline-block;
   cursor:pointer;
   margin-bottom:5px;
}
/**********************************************************/

.msg-outer-main {    
    background:transparent;	
}

@media screen and (min-width: 881px) {
  .msg-outer-main  {    
   display:flex;
   position:fixed;
   top:56px;
   bottom:0px;
   width:100%;
   overflow:auto;    	  		  		  		      
   }
}

@media screen and (max-width: 880px) {
  .msg-outer-main  {
   position:fixed;
   top:0px;
   bottom:0px;
   width:100%;
   height:100%;       	  		  		  		      
   }
} 

.msg-carryTwo {    
   background:#fff; 
} 

@media screen and (min-width: 881px) {
  .msg-carryTwo  {    
   max-width:1070px;
   width:100%;
   height:100%; 
   display:flex;
   margin:auto; 
   box-shadow: 0 1px 2px 1px rgba(0,0,0,0.1);        	  		  		  		      
   }
}

@media screen and (max-width: 880px) {
  .msg-carryTwo {    
   position:fixed;
   width:100%;
   bottom:0px;
   top:0px;    	  		  		  		      
   }
}

.msg-carryTwo-a {    
    background:#fff;
	position:relative;	
} 

.msg-carryTwo-b {    
    background:#fff;
} 

@media screen and (min-width: 881px) {
  .msg-carryTwo-a  {    
   width:38%; 
   max-width:100%;   
   display:block;    	  		  		  		      
   }
} 

@media screen and (min-width: 881px) {
  .msg-carryTwo-b  {    
   width:calc(62% - 1px);
   border-left:1px solid #e4e4e4; 
   max-width:100%;   
   display:block;    	  		  		  		      
   }
}

@media screen and (max-width: 880px) {
  .msg-carryTwo-a  {
   margin-right:auto;
   margin-left:auto;
   max-width:600px;
   height:100%;    	  		  		  		      
   }
} 

@media screen and (max-width: 880px) {
  .msg-carryTwo-b  {
      display:none; 	  		  		  		      
   }
}

.msg-chatlist-top  {   
   height:56px; 
   width:100%;
   position:relative; 
   box-sizing:border-box;    
   padding-left:10px; 
   padding-right:10px;         	  		  		  		      
}

@media screen and (max-width: 640px) {	
   .msg-chatlist-top {
   padding-left:7px; 
   padding-right:7px; 			
   }	
}

@media screen and (max-width: 640px) {	
   .msg-chatlist-top {
   height:50px; 			
   }	
}

.msg-chatlist-tpdv  {    
   width:100%; 
   height:calc(100% - 1px);       
   border-bottom:1px solid #e4e4e4; 
   display:flex;    	  		  		  		      
}

.msg-bck-divo {
   width:40px; 
   height:40px;     
   display:flex; 
   margin-top:auto;
   margin-bottom:auto;
   font-size:20px;   
}

.msg-bckdivo-ic {
	margin:auto 0;
	cursor:pointer;
}

.msg-tt-det {    
   width:calc(100% - 40px); 
   height:40px;     
   display:flex;   
   margin-top:auto;
   margin-bottom:auto;  
}

@media screen and (max-width: 880px) {
  .msg-tt-det {	   
    width:calc(100% - 42px);		   		  	   
   }
}

.msg-tt-nemdv {    
   display:flex; 
   width:50%;
   height:100%; 
   box-sizing:border-box;   
}

.msg-tt-nem {   
   margin:auto 0px;
   white-space:nowrap; 
   overflow:hidden; 
   text-overflow:ellipsis; 
   font-weight: bold;   
   font-size:16px;
}

.msg-tt-moredet {
   display:block;      
   width:70%;
   height:100%;
   position:relative;     
   text-align:right;       
}

.msg-sel-delete {	
	height:40px;
	position:absolute;
	width:calc(100% - 40px);
	font-size:16px;
	font-weight: 500;
    font-family: 'Roboto';
	text-align:right;
	display:flex;
}

.msg-sel-div {   
   box-sizing:border-box;
   padding-right:10px;
   position:absolute;
   right:0px;     
}

.sel-sp-dv {
   position:absolute;
   right:60px;
   top:50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%); 
}

#sel-num {
	padding-left:5px;
	height:100%;	
	color:#007fd2;
	display:none;
}

.msg-sel-ic {
	font-size:22px;
	display:inline-block;
	width:40px;
	height:40px;
	text-align:center;
	line-height:40px;
	border-radius:100%;
	margin-left:10px;
	cursor:pointer;
	background:#eee;	
}

.msg-sel-ic:hover {
	background:#e7e7e7;
}

.msg-del-ic {
	font-size:19px;
	display:inline-block;
	width:40px;
	height:40px;
	text-align:center;
	line-height:40px;
	border-radius:100%;
	margin-left:10px;
	cursor:pointer;
	background:rgba(0,127,210, 0.2);
	color:#202020;
	display:none;
}

.msg-del-ic:hover {
	background:rgba(0,127,210, 0.2);
}

.msg-tt-create {    
	width:40px; 
	height:40px; 
	border-radius:100%; 
	text-align:center; 
	float:right; 	 
	display:flex; 
	cursor:pointer;
	text-decoration:none;
	outline:none;
	color:#202020;
	background:#eee;
}

.msg-tt-create:hover {
    background:#e7e7e7;	
}

.msg-ttcreate-icon {
    margin:auto;
	font-size:20px;	
}

/*====================================================================================
    CREATE NEW MESSAGE
======================================================================================*/

.msg-fxd {
   position:absolute;
   top:0px;
   bottom:0px;
   left:0px;
   right:0px;	
   width:100%;
   height:100%;
   z-index:4; 
   background:rgba(0,0,0,0.3);
   display:none;    
}

@media screen and (max-width: 880px) {	
  .msg-fxd {
   display:none !important;			
  }	
}

@media screen and (max-width: 640px), screen and (max-height: 600px) {
  .msg-fxd { 	
	position:fixed;
	padding-bottom:15px;
	overflow-y:auto;	
  }
}

.pst-form { 
   margin:auto;         
   box-sizing:border-box;
   width:100% !important; 
   max-width:400px;    
}

@media screen and (max-width: 499px) {	
  .pst-form {
   margin-top:0px;
   max-width:100% !important;
   width:100% !important;   			
  }	
}

.pst-main-msg {    
   width:100%;
   max-width:400px;   
   box-sizing:border-box;   
   padding-top:8px;
   padding-bottom:8px;   
}

@media screen and (min-width: 641px) and (max-height: 600px)  {
   .pst-main-msg {        
   padding-top:0px;
   padding-bottom:0px;  	
  }
}

@media screen and (min-width: 641px) and (min-height: 601px)  {
   .pst-main-msg {        
    max-height:600px;
    margin:auto;	
  }
}

@media screen and (min-width: 641px) {
  .pst-main-msg  {   
  position:fixed;
  bottom:0px;
  top:0px; 
  }
}

@media screen and (max-width: 640px) {
  .pst-main-msg  { 
  position:fixed;
  left:0px;
  right:0px;
  top:0px;
  bottom:0px;
  height:100%;
  width:100%;
  }
}

.insert-msg {  
   width:100%;
   height:100%;
   margin-right:auto;
   margin-left:auto;
   background:#fff;
}

@media screen and (min-width: 641px)  {
   .insert-msg {       
   border-radius:8px;	   
   box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3);   	
  }
}

@media screen and (min-width: 641px) and (max-height: 600px)  {
   .insert-msg  {        
   border-radius:0px;  	
  }
}

.msg-sec {   
  box-sizing:border-box; 
  padding:0px 15px;  
}

@media screen and (max-width: 640px) {	
  .msg-sec {    
   padding-left:10px;
   padding-right:10px;
  }	
}

.msg-header {    
   width:100%; 
   height:56px;       
   display:flex;   
}

@media screen and (max-width: 640px) {
  .hednots {    
   height:50px;
   }
}

.pst-tpdv {    
   width:100%; 
   height:35px; 
   margin:auto;   
   display:flex;   
}

.msgdv-a {
   width:35px;
   height:35px;   
}

.msg-pstback-icon  {   
   position:relative;
   font-size:20px; 
   cursor:pointer;
   width:35px;
   height:35px;
   line-height:35px;
   text-align:left;
   display:inline-block;
   margin-left:-3px;      
}


@media screen and (min-width: 401px) {
  .msg-pstback-icon { 
  visibility:hidden;
  }
}

@media screen and (min-width: 401px) {
  .msg-pstback-icon   {		  
	font-size:24px;
	background:#e7e8eb;
	width:35px;
	height:35px;
	line-height:35px;
	text-align:center;
	border-radius:50%;			   
   }
   .msg-pstback-icon:hover   {		  
	background:#cfd0d3;		   
   }
}

.msgdv-c {
   width:35px;
   height:35px;   
}

.msg-pstclos-icon {
   background:#e7e8eb; 
   position:relative;
   font-size:20px;
   cursor:pointer;
   width:35px;
   height:35px;
   line-height:35px;
   display:inline-block;          
}

@media screen and (max-width: 400px) {
  .msg-pstclos-icon { 
  visibility:hidden;
  }
}

@media screen and (min-width: 401px) {
  .msg-pstclos-icon  {		  
	font-size:24px;	
	width:35px;
	height:35px;
	line-height:35px;
	text-align:center;
	border-radius:50%;				   
   }
   .msg-pstclos-icon:hover   {		  
	background:#cfd0d3;		   
   }
}

.msgdv-b {    
   width:calc(100% - 70px);      
   font-size:17px;
   font-weight:bold;   
   display:inline-block;
   height:35px;
   line-height:35px;   
   text-align:center;
}

@media screen and (min-width: 641px), screen and (min-height: 601px) {	
  .msgdv-b-mobi {   
   font-size:17px !important;  	 	 
  }
}

@media screen and (min-width: 641px), screen and (min-height: 601px) {	
  .msgdv-b {   
   font-size:19px;  	 	 
  }
}

@media screen and (max-width: 500px) {
  .msgdv-b {   
     margin:auto 0px;  	 	 
  }
}

@media screen and (max-width: 499px) {
  .msgdv-b {   
     font-size:17px !important;  	 	 
  }
}

.div-search-msgcon {    
    width: 100%;
    box-sizing: border-box;
    padding-top: 5px;
    padding-bottom:10px;	
}

.div-nots-alt {    
    width: 100%;
	margin-top:47px;
	height:50px; 
	display:flex;	
}

.msgs-hse {     
   width:100%;         
   position:fixed;
   top:110px;
   bottom:10px;
   overflow-y:auto;
   max-width:370px;
   left:50%; transform:translateX(-50%);
}

@media screen and (min-width: 641px) and (min-height: 601px)  {
  .msgs-hse {
   margin-top:50px;
   top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);          
   height:464px;     	
  }
}

@media screen and (max-width: 400px) {
  .msgs-hse {
   width:calc(100% - 20px);     	
  }
}

.msg-botdiv {	
	width:100%;
	height:50px;
	display:block;		
	text-align:center;
	display:flex;	
}

.msg-lodmo {	
	padding:10px;	
	margin:auto;	
	border-radius:6px;
	background-image: -webkit-linear-gradient(top, rgba(227,227,227,0) 0%, rgba(227,227,227,1) 100%);
	border:1px solid #ababab;
	min-width:150px;
	cursor:pointer;		
}

/*====================================================================================
    MESSAGE SKELETON
======================================================================================*/
.msg-skele-a {
	background:#fff;	
	position:absolute;
	height:calc(100% - 56px);
	width:100%;
	top:56px;
	bottom:0px;	
	box-sizing:border-box;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:9px; 
	padding-right:10px;
	z-index:3;	
}

@media screen and (max-width: 880px) {
  .msg-skele-a {    
   padding-top:0px;
   position:fixed;
   max-width:600px;
   }
}

@media screen and (max-width: 640px) {
  .msg-skele-a {    
   top:50px;
   height:calc(100% - 50px);
   padding-left:1px;
   }
}

@media screen and (max-width: 600px) {
  .msg-skele-a {    
   left:0px;
   right:0px;
   }
}

@media screen and (max-width: 640px) {
	.msg-skele-abottom {
		display:none;
	}
}

.msg-skele-b {
	background:#fff;
	position:relative;
	height:100%;
	max-height:100%;
	max-width:600px;
	box-sizing:border-box;
	padding-right:15px;
	padding-left:15px;
	z-index:3;
	margin-top:-220px;
	margin-left:auto;
	margin-right:auto;		
}

@media screen and (max-width: 640px) {
  .msg-skele-b {	   
    padding-right:10px;
	padding-left:10px;		   		  	   
   }
}

.msg-skele-btop {
   height:55px;
   border-bottom:1px solid #e4e4e4;		
   display:flex;   
}

@media screen and (max-width: 640px) {
  .msg-skele-btop  {	   
    height:50px;		   		  	   
   }
}

.msg-btoplft {		  
   width:40px;
   height:40px;
   border-radius:100%;
   margin-top:auto;
   margin-bottom:auto;      
}

.msg-btopmid, .msg-atoplft {		  
   width:calc(100% - 70px);   
   height:40px;
   box-sizing:border-box;
   padding:10px;
   display:flex;
   margin-top:auto;
   margin-bottom:auto; 	   
}

.msg-btoprgt {		  
   width:30px;   
   height:40px;
   box-sizing:border-box;   
   display:flex;
   padding-left:4px;
   margin-top:auto;
   margin-bottom:auto;    	   
}

.msg-btopmid-dv, .msg-atoplft-dv {		  
   width:90%;
   max-width:120px;   
   height:12px;   
   border-radius:12px;
   margin:auto 0;	   
}

.msg-btoprgt-dv {		  
   width:26px;   
   height:26px;   
   border-radius:50%;
   margin:auto 0;      	   
}

.msgske-spine-dv {
   height:60px;
   width:100%;
   text-align:center;
   position: absolute;
   left: 50%;
   top: 50%;
   -webkit-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%); 
   display:flex;    	   
}

.msgske-spine-icon {
  animation: div-rotate 0.9s infinite steps(8);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transform-origin: 50% 50%;
  -webkit-transform-origin: 50% 50%;
  position:relative;  
  font-size:30px;
  width:30px;
  height:30px;
  margin:auto;
  color:rgba(32,32,32,0.4);   
}

.msg-ske-txtarea {		  
   width:calc(100% - 84px);   
   height:42px;
   border-radius:44px;
   background:#f0f0f0;   
   border:1px solid #e4e4e4;
   position:absolute;
   bottom:10px;      	   
}

@media screen and (max-width: 640px) {
  .msg-ske-txtarea {
   width:calc(100% - 74px);
   }
}

.msg-ske-snd {		  
   width:42px;   
   height:42px;
   border-radius:100%;
   background:#f0f0f0;   
   border:1px solid #e4e4e4;
   position:absolute;
   right:15px;
   bottom:10px;      	   
}

@media screen and (max-width: 640px) {
  .msg-ske-snd  {
   right:10px;
   }
}

@keyframes placeHolderShimmer{
    0%{
        background-position: -200px 0
    }
    100%{
        background-position: 200px 0
    }
}

.animated-bg {
    animation-duration:1s;
    animation-fill-mode:forwards;
    animation-iteration-count:infinite;
    animation-name:placeHolderShimmer;
    animation-timing-function:linear;    
    background:linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size:800px 100px;	    
}

/*--=============== BEGIN ====================================*/
.msg-begn {	
	position:absolute;
	padding:10px;
	box-sizing:border-box;
	width:100%;
	height:220px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	display:flex;
}

.begin-div-icdv {	
	height:52px;
	width:52px;
	border-radius:50%;
	padding:10px;
	border:2px solid #202020;	
	display:flex;
	margin-left:auto;
	margin-right:auto;
}

.msg-begin-icon {
	font-size:36px;
	margin:auto;
}

.msg-begin-sec {	
	margin-top:15px;
	text-align:center;
}

.car-begin-snd {
	display:flex; margin-top:15px;
}

.msg-begin-snd {
	background:#6c2bd9;
	color:#fff;	
	text-align:center;
	border-radius:5px;
	display:inline-block;
	margin:auto;	
	padding:8px 10px;
	cursor:pointer;	
}