.messenger-body {
	display: flex;
	flex-direction: column;
	height: 100%;
}

	
.messenger-body {

	b {
		font-weight: 800!important;
	}
	.header {
		padding-top: 10px;
		
		padding-bottom: 16px;
        border-bottom: 1px solid rgba(43, 72, 130, 0.05);
		
	}
	
	.body {
		flex: 1; 
		overflow: auto; 
		display: flex;
		flex-direction: column-reverse;
		padding: 14px 0px;
		padding-right: 5px;
		position: relative;
	}

	.footer {
		padding-top: 16px;
		border-top: 1px solid rgba(43, 72, 130, 0.05);
	}


	.modal-dialog-title {
		color: rgb(0, 9, 26);
		font-size: 23px;
		font-weight: 700;
		line-height: 120%;
		
	}

	.cross-close-dialog-modal {
		
		cursor: pointer;
		display: block;
		
		
	}

	.attachment-open-modal-btn {
		cursor: pointer;
		opacity: .3;
		transition: .1s;
	}
	.attachment-open-modal-btn:hover {
		
		opacity: .6;
	}

	.input-area textarea {
		resize: none;
		width: 100%;
		height: 80px;
		
		outline: none;
		border: none;
		
		
		color: rgb(0, 9, 26);
		font-family: Raleway;
		font-size: 14px;
		font-weight: 500;
		line-height: 140%;
		text-align: left;
		display: block;
		background: transparent;
		
	}
	.input-area textarea::placeholder {
		
		
		color: rgba(0, 9, 26, .4);
		
	}

	.input-area {
		position: relative;
	}

	.send-message-btn {
		width: 50px;
		height: 50px;
		border: 0.8px solid rgba(43, 72, 130, 0.05);
		border-radius: 999px;
		box-shadow: 0px 12px 20px 0px rgba(0, 17, 51, 0.06);
		background: rgb(255, 255, 255);
		position: relative;
		cursor: pointer;
	}
	.send-message-btn svg {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}


	.send-message-area {
		height: 80px;
		display: table;
		
	}


	.input-msg-background {
		padding: 15px;
		border-radius: 20px;
		background: rgba(43, 72, 130, 0.05);
		
		
	}

	.align {
		
		display: table-cell;
		vertical-align: middle;
		
	}

	.chat-first-loader {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}


	.sys-message-block {
		color: rgb(0, 173, 92);
		font-size: 14px;
		font-weight: 600;
		line-height: 120%;
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	
	.sys-message-block-date {
		position: absolute;
		bottom: -9px;
		right: 15px;
		
		color: rgb(0, 173, 92);
        font-size: 12px;
        font-weight: 600;
        line-height: 120%;
        text-align: center;
		background: white;
		padding: 2px 10px 1px 10px;
		
	}

	.sys-message-block .label {
		border: 1px solid rgb(0, 173, 92);
		padding: 15px 30px;
		border-radius: 20px;
		position: relative;
		
	}

	.message-block {
		margin-top: 10px;
		margin-bottom: 5px;
	}

	
	.header-avatar .avatar-block {
		width: 61px;
		height: 61px;
	}
	
	.header-avatar .chat-no-avatar .label {
		font-size: 22px;
	}
	
	.header-avatar .chat-no-avatar {
		width: 61px;
		height: 61px;
	}
	
	.header-dialog-name {
        color: rgb(0, 0, 0);
        font-size: 17px;
        font-weight: 700;
        line-height: 130%;
    }

	.avatar-block {
		width: 32px;
		height: 32px;
		background-size: cover!important;
		background-position: center!important;
		background-repeat: no-repeat!important;
		border-radius: 999px;
	}
	
	.chat-no-avatar {
		width: 32px;
		height: 32px;
		border-radius: 999px;
		background: rgb(194, 214, 255);
		position: relative;
	}
	
	.chat-no-avatar .label {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: rgb(255, 255, 255);
		font-size: 14px;
		font-weight: 800;
		line-height: 120%;
		text-align: center;
	}
	
	.chat-partner-block .back {
		border-radius: 0px 10px 10px 10px;
		background: rgb(242, 242, 247);
		padding: 8px 16px;
		display: inline-block;
		
	}
	.chat-partner-block .text {
		color: rgb(102, 102, 104);
		font-size: 14px;
		font-weight: 600;
		line-height: 14px;
		line-height: 120%;
		white-space: normal;
		word-wrap: break-word;
		overflow-wrap: break-word;
		padding-bottom: 10px;
		max-width: 400px;
		
		
	}
	.chat-partner-block svg {
		vertical-align: top;
		display: block;
	}
	
	.chat-partner-block .sender-name {
		color: rgb(0, 9, 26);
		font-size: 14px;
		font-weight: 600;
		line-height: 14px;
		text-align: left;
		margin-bottom: 6px;
	}
	
	.chat-partner-block .time {
		color: rgb(102, 102, 104);
		font-size: 12px;
		font-weight: 500;
		line-height: 14px;
		text-align: right;
	}
	
	
	
	
	
	.chat-block .back {
		border-radius: 10px 0px 10px 10px;
		background: rgb(0, 173, 92);
		padding: 8px 16px;
		display: inline-block;
		margin-left: auto;
		/* max-width: calc(100% - 44.72px); */
		max-width: 100%;
	}
	
	.chat-block .text {
		color: rgb(255, 255, 255);
		font-size: 14px;
		font-weight: 600;
		line-height: 120%;
		text-align: left;
		white-space: normal;
		word-wrap: break-word;
		overflow-wrap: break-word;
		padding-bottom: 10px;
		max-width: 400px;
		
		
	}
	.chat-block .sender-name {
		color: rgb(230, 235, 245);
		font-size: 14px;
		font-weight: 600;
		line-height: 14px;
		text-align: left;
		margin-bottom: 6px;
		
	}
	
	
	.chat-block .time {
		color: rgb(255, 255, 255);
		font-size: 12px;
		font-weight: 500;
		line-height: 14px;
		text-align: right;
	}
	
	.chat-block svg {
		vertical-align: top;
		display: block;
		margin-left: -1px;
	}
	
	
	.chat-block {
		display: flex;
		justify-content: flex-end;
	}
	
	.date-block {
		color: rgb(102, 102, 104);
		font-size: 12px;
		font-weight: 500;
		line-height: 14px;
		text-align: center;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	
	.attach-ico-block {
		position: relative;
		min-width: 21px;
	}
	
	.count-attachment .notification-badge {
		
		position: absolute;
		top: -6px;
		right: -3px;
		margin: 0!important;
		
	}
	
	.message-image-previews {
		margin-left: -4px;
		margin-right: -4px;
		padding-bottom: 10px;
	}
	
	.chat-msg-image-preview {
		width: 75px;
		padding-top: 140%;
		background-size: cover!important;
		background-position: center!important;
		background-repeat: no-repeat!important;
		border-radius: 5px;
		
	}
	
	
	.no-messages-text {
		color: rgba(20, 41, 82, 0.3);
		font-size: 20px;
		font-weight: 600;
		line-height: 140%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		text-align: center;
		width: 100%;
	}
	
	
	
	.last-online {
        color: rgb(102, 102, 104);
        font-size: 12px;
        font-weight: 500;
        line-height: 14px;
        text-align: left;
        margin-top: 3px;
    }
	
	
	.adtabs-block {
		margin-right: -4px;
		margin-left: -4px;
		
	} 
	
	
	.advert-tag-item {
		
		width: 70px;
		padding-top: 120%;
		background-size: cover!important;
		background-position: center!important;
		background-repeat: no-repeat!important;
		border-radius: 15px;
		cursor: pointer;
		position: relative;
	}
	
	.advert-tag-item.active {
		outline: 2px solid rgb(0, 173, 92);
		
	}
	.advert-tag-item .notification-badge {
		position: absolute;
		top: 0px;
		right: -5px;
		
	}
	
	
	
	
	
}



















#load-photo-modal {
	
	
	
	.loaded-photo {
		padding: 10px 30px 0px 30px;
		margin-left: -5px;
		margin-right: -5px;
	}
	.load-photo-btn-block {
		padding: 30px 30px 0px 30px;
	}
	
	
	.load-image-btn {
		border-radius: 8px;
		background: rgb(23, 43, 54);
		height: 54px;
		position: relative;
		width: 100%;
		cursor: pointer;
		transition: .1s;
	}
	.load-image-btn .label {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100%;
		transform: translate(-50%, -50%);
		color: rgb(255, 255, 255);
		font-size: 17px;
		font-weight: 600;
		line-height: 130%;
		text-align: center;
		padding-bottom: 2px;
		transition: .1s;
	}

	.load-image-btn:hover {
		background: rgb(50, 79, 93);
	}

	.load-photo-btn-block label {
		display: block;
	}

	.upload-photo-item {
		padding-top: calc(100% * 1.2);
		background-size: cover!important;
		background-position: center!important;
		background-repeat: no-repeat!important;
		outline: 1px solid rgba(0, 34, 102, 0.1);
		border-radius: 10px;
		margin-top: 10px;
		position: relative;
	}
	
	.load-screen {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background-color: rgba(0, 0, 0, 0.6);
		border-radius: 10px;
		z-index: 1;
	}
	
	.load-screen-loader {
		height: 100%;
		width: 100%;
		position: relative;
		
		
		
	}
	
	.load-screen-loader .spinner-border-parent {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 2;
		
	}
	
	.spinner-border.text-light {
		color: white!important;
		
	}
	
	
		
	.close-upload-photo-modal {
		box-sizing: border-box;
		border: 1px solid rgba(0, 102, 153, 0.15);
		border-radius: 8px;
		background: rgb(255, 255, 255);
		height: 54px;
		position: relative;
		width: 100%;
		cursor: pointer;
		transition: .1s;
	}

	.close-upload-photo-modal .label {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100%;
		transform: translate(-50%, -50%);
		color: rgba(0, 17, 26, 0.8);
		font-size: 17px;
		font-weight: 600;
		line-height: 130%;
		text-align: center;
		padding-bottom: 2px;
		transition: .1s;
	}

	.close-upload-photo-modal:hover {
		border: 1px solid rgb(0, 173, 92);
	}

	.close-upload-photo-modal:hover .label {
		color: rgb(0, 173, 92);
	}

	
	.upload-photo-cross {
		
		position: absolute;
		top: -15px;
		right: -15px; 
		transform: scale(0.6);
	}
	
	.upload-photo-set {
		position: relative;
		cursor: pointer;
	}
	
	
}






#chat-modal .modal-dialog {
	
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	
}


#chat-modal .modal-content {
	border-radius: 0px 0px 0px 0px;
	height: 100vh;
	
}


.modal.modal-slide .modal-dialog {
	transform: translateX(100%);
	transition: transform 0.1s ease-out;
}

.modal.modal-slide.show .modal-dialog {
	transform: translateX(0);
}


.open-url {
	position: absolute;
	right: -5px;
	bottom: -5px;
	width: 25px;
	height: 25px;
	background: white;
	border-radius: 999px;
	/* box-shadow: 0px 10px 20px 0px rgba(0, 17, 51, 0.1); */
	
	
}

.open-url img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}









@media (max-width: 924px) {
	
	#chat-modal .modal-dialog {
		max-width: 100%;
		margin-left: 0px;
	}
	
}