.audience__wrapper{
	&>h2{
		margin-top: 0px;
		font-size: 28px;
		line-height: 125%;
		font-weight: 600;
		color:#111928;
	}
	& .regular__table{
		&>.top{
			display: flex;
			align-items:center;
			justify-content:space-between;
			& .period__wrapper{
				margin-right: 8px;
				&>input{
					height: 37px;
					border-radius: 8px;
					outline:none;
					border:1px solid #D1D5DB;
					padding-left: 35px;
					padding-right: 11px;
					width: 90px;
					background:url('../img/period.svg');
					background-repeat: no-repeat;
					background-size: 16px;
					background-position: 12px center;
				}
			}
			& .controls{
				display: flex;
				align-items:center;
				justify-content:flex-end;
				&>.group__dropdown{
					margin-right: 8px;
					& .dropdown{
						min-width: 170px;

					}
				}
				&>.regular-btn{
					margin-right: 8px;
				}
			}
			& .find__form{
				width: 100%;
				max-width: 645px;
				& form{
					width: 100%;
					max-width: 100%;
				}
			}
		}
	}
}


.audience__wrapper .regular__table>.top .controls>.regular-btn{
	white-space: nowrap;
}
.audience__wrapper .regular__table>.top .find__form{
	margin-right: 15px;
}
.modal__side.profile__side .inner__modal>.modal__box .double .chat__box{
	height: calc(100vh - 53px);
}

.chat__list{
		padding:16px;
		
		& .day__mark{
			display: flex;
			align-items:center;
			justify-content:center;
			margin:24px 0px;
			&:nth-child(1){
				margin-top: 0px;
			}
			&>span{
				display: inline-flex;
				width: 100%;
				min-height: 1px;
				background-color:#E5E7EB;
			}
			&>p{
				margin:0px;
				margin:0px 15px;
				white-space: nowrap;
				font-size: 14px;
				line-height: 20px;
				color:#6B7280;
				font-weight: 400;
			}
		}
		width: 100%;
		height: calc(100vh - 320px);
		overflow-y:auto;
		&::-webkit-scrollbar {
		  width: 4px;
		  height: 4px;
		}
		 
		&::-webkit-scrollbar-track {

		}
		 
		&::-webkit-scrollbar-thumb {
			border-radius: 250px;
		  background-color:rgb(28,69,194);
		}
	}
.elem__chat{
		margin-bottom: 24px;
		display: flex;
		align-items:flex-start;
		justify-content:flex-start;
		& .message{
			width: 100%;
			& .desc{
				&>p{
					margin:0px;
					font-size: 14px;
					line-height: 130%;
					font-weight: 400;
					color:#1F2A37;
					margin-bottom: 15px;
					&:last-child{
						margin-bottom: 0px;
					}
				}
			}
			&>.title{
				display: flex;
				align-items:center;
				justify-content:flex-start;
				flex-wrap:wrap;
				margin-bottom: 2px;
				&>span{
					display: inline-flex;
					font-size: 12px;
					line-height: 150%;
					font-weight: 400;
					color:#6B7280;
					padding-top: 4px;
				}
				&>p{
					margin:0px;
					margin-right: 4px;
					font-size: 16px;
					line-height: 150%;
					font-weight: 600;
					color:#111928;
				}
			}
		}
		& .author{
			display: flex;
			align-items:center;
			justify-content:center;
			margin-right: 8px;
			&.logo{
				&>span{
					&>img{
						max-width: 24px;
						max-height: 24px;
					}
				}
			}
			&>span{
				display: flex;
				align-items:center;
				justify-content:center;
				min-width: 45px;
				max-width: 45px;
				min-height: 45px;
				max-height: 45px;
				border-radius: 250px;
			}
		}
	}


.chat__controls{
			width: 100%;
			padding-left: 16px;
			padding-bottom: 24px;
			padding-top: 30px;
			padding-right: 16px;
			& .bottom__buttons{
				display: flex;
				align-items:center;
				justify-content:space-between;
				padding:12px 20px;
				border-left: 1px solid #E5E7EB;
				border-right: 1px solid #E5E7EB;
				border-bottom:1px solid #E5E7EB;
				border-bottom-left-radius: 8px;
				border-bottom-right-radius: 8px;
				& .right{
					display: flex;
					align-items:center;
					justify-content:flex-end;
					&>button{
						display: inline-flex;
						align-items:center;
						justify-content:center;
						padding-left: 27px;
						padding-right: 27px;
						background-color:#111928;
						transition:.3s ease all;
						&:hover{
							background-color:#1C45C2;
						}
						&:active{
							background-color:#1C45C2;
						}
					}
					&>span{
						display: block;
						margin-right: 24px;
						font-size: 12px;
						line-height: 150%;
						font-weight: 400;
						color:#4B5563;
						& span{
							color:#111928;
						}
					}
				}
				& ul{
					padding:0px;
					list-style-type: none;
					margin:0px;
					display: flex;
					align-items:center;
					justify-content:flex-start;
					&>li{
						margin-right: 15px;
						&>a{
							display: inline-flex;
							align-items:center;
							justify-content:center;
							text-decoration: none;
							&.opened{
								&.stroke{
									& svg path{
										fill:none;
										stroke:#1C45C2;
									}
								}
								& svg path{
									fill:#1C45C2;
								}
							}
							&:hover{
								&.stroke{
									& svg path{
										fill:none;
										stroke:#1C45C2;
									}
								}
								& svg path{
									fill:#1C45C2;
								}
							}
							& svg path{
								transition:.3s ease all;
							}
						}
						&:last-child{
							margin-right: 0px;
						}
					}
				}
			}
			&>textarea{
				width: 100%;
				height: 115px;
				background-color:#fff;
				border:0px;
				outline:none;
				border-left: 1px solid #E5E7EB;
				border-right: 1px solid #E5E7EB;
				border-bottom:1px solid #E5E7EB;
				padding:15px 20px;
				font-size: 14px;
				color:#000;
			}
			& .top__buttons{
				border:1px solid #E5E7EB;
				border-top-left-radius: 8px;
				border-top-right-radius: 8px;
				overflow-x:auto;
				overflow-y:hidden;
				background-color:#fff;
				position: relative;
				height: 36px;
				&::-webkit-scrollbar {
				  width: 4px;
				  height: 4px;
				}
				 
				&::-webkit-scrollbar-track {

				}
				 
				&::-webkit-scrollbar-thumb {
					border-radius: 250px;
				  background-color:rgb(28,69,194);
				}
				& ul{
					position: absolute;
					left: 0px;
					top:0px;
					width: 100%;
					padding:0px;
					list-style-type: none;
					margin:0px;
					display: flex;
					align-items:center;
					justify-content:center;
					&>li{
						display: flex;
						width: 100%;
						align-items:center;
						justify-content:center;
						border-right:1px solid #E5E7EB;
						&:last-child{
							border-right:0px;
						}
						&>a{
							&.current{
								background-color:#F9FAFB;
							}
							display: inline-flex;
							width: 100%;
							align-items:center;
							justify-content:center;
							font-size: 12px;
							line-height: 18px;
							color:#4B5563;
							font-weight: 500;
							text-decoration: none;
							padding:7px 15px;
							transition:.3s ease all;
							&:hover{
								background-color:#F9FAFB;
							}
							& span{
								display: inline-flex;
								margin-right: 4px;
								& img{
									min-width: 16px;
									max-width: 16px;
								}
							}
						}
					}
				}
			}
		}
.chat__controls .top__buttons ul{
	justify-content:flex-start;
}






.select__tags{
	width: 100%;
	max-width: 335px;
	background-color:#FFFFFF;
	border-radius: 6px;
	border:1px solid #E5E7EB;
	box-shadow:0px 8px 12px rgba(0,0,0,.04);
	z-index: 10;
	position: absolute;
	& .workroom{
		& ul{
			padding:0px;
			list-style-type: none;
			margin:0px;
			max-height: 150px;
			overflow-y:auto;
			&::-webkit-scrollbar {
			  width: 4px;
			  height: 4px;
			}
			 
			&::-webkit-scrollbar-track {

			}
			 
			&::-webkit-scrollbar-thumb {
				border-radius: 250px;
			  background-color:rgb(28,69,194);
			}
			&>li{
				&>a{
					display: flex;
					align-items:center;
					justify-content:flex-start;
					padding:8px 16px;
					text-decoration: none;
					font-size: 14px;
					line-height: 150%;
					color:#0E1217;
					font-weight: 400;
					transition:.4s ease all;
					&:hover{
						background-color:#F3F3F3;
					}
				}
			}
		}
		&>p{
			margin-top: 0px;
			margin-bottom: 4px;
			font-size: 14px;
			line-height: 150%;
			font-weight: 500;
			color:#0E1217;
			padding-left: 16px;
			padding-right: 16px;
		}
	}
	& .search__tags{
		padding:12px 16px;
		& form{
			width: 100%;
			&>input{
				width: 100%;
				height: 40px;
				border:1px solid #E5E7EB;
				border-radius: 8px;
				padding-left: 12px;
				padding-right: 12px;
				outline:none;
				color:#000;
			}
		}
	}
	& .title{
		padding:12px 16px;
		border-bottom:1px solid #E5E7EB;
		&>p{
			margin:0px;
			font-size: 14px;
			line-height: 150%;
			font-weight: 600;
			color:#0E1217;
		}
	}
}
.choose__time>a.active svg path{
	fill:#1C45C2;
}
.choose__template--box{
	min-width: 335px;
	max-width: 335px;
	box-shadow:0px 8px 12px rgba(0,0,0,.04);
	position: absolute;
	left: 50%;
	transform:translateX(-50%);
	background-color:#fff;
	border-radius: 6px;
	border:1px solid #E5E7EB;
	& .schedule{
		border-top:1px solid #E5E7EB;
		&>a{
			display: inline-flex;
			align-items:center;
			justify-content:flex-start;
			text-decoration: none;
			& span{
				display: inline-flex;
				margin-right: 4px;
			}

			font-size: 14px;
			line-height: 150%;
			font-weight: 600;
			color:#111928;
			padding:13px 16px;
			transition:.3s ease all;
			&:hover{
				opacity:.7;
			}
		}
	}
	& .list{
		padding:8px 0px;
		&>a{
			display: inline-flex;
			align-items:center;
			justify-content:flex-start;
			text-decoration: none;
			padding:8px 16px;
			font-size: 14px;
			line-height: 150%;
			width: 100%;
			font-weight: 400;
			color:#111928;
			transition:.3s ease all;
			&:hover{
				background-color:#F9FAFB;
			}
		}
	}
	&>.head{
		&>p{
			margin:0px;
			font-size: 14px;
			line-height: 150%;
			font-weight: 500;
			color:#111928;
		}
		padding:12px 16px;
		border-bottom:1px solid #E5E7EB;
	}
	bottom:100%;
	top:auto;
	margin-bottom: 18px;
}
.choose__time{
	position: relative;
}
.elem__chat:last-child{
	margin-bottom: 0px;
}
.scheduled__message{
	width: calc(100% - 53px);
	margin-left: auto;
	margin-bottom: 16px;
	&:last-child{
		margin-bottom: 0px;
	}
	& .inner{
		display: flex;
		align-items:center;
		justify-content:space-between;
		padding:8px 12px;
		border-radius: 6px;
		background-color:#E5E7EB;
		& .right{
			display: flex;
			align-items:center;
			justify-content:flex-end;
			&>a{
				display: inline-flex;
				margin-right: 8px;

				&:last-child{
					margin-right: 0px;
				}
			}
		}
		& .left{
			margin-right: 12px;
			&>p{
				margin:0px;
				display: flex;
				align-items:center;

				font-size: 14px;
				color:rgba(17,25,40,.7);
				justify-content:flex-start;
				&>span{
					display: inline-flex;
					margin-right: 8px;
				}
			}
		}
	}
}
.top__buttons{
	position: relative;
	& .main__button{
		position: relative;
		&>span{
			display: inline-flex;
			position: absolute;
			top:50%;
			right: 10px;
			transform:translateY(-50%);
		}
		&>a{
			height: 36px;
			display: flex;
			align-items:center;
			justify-content:center;
			text-decoration: none;
			font-size: 12px;
			line-height: 16px;
			color:#4B5563;
			font-weight: 500;
			justify-content:flex-start;
			padding-left: 15px;
			& span{
				display: inline-flex;
				margin-right: 4px;
			}
		}
	}
}


 .chat__controls .top__buttons ul{
	flex-direction:column;
}
 .chat__controls .top__buttons{
	position: relative;
}
 .chat__controls .top__buttons{
	overflow-x:visible;
	overflow-y:visible;
}
 .chat__controls .top__buttons ul{
	bottom:100%;
	top:auto;
	border:1px solid #E5E7EB;
	background-color:#fff;
	max-height: 180px;
	overflow-y:auto;
	border-radius: 6px;
	&::-webkit-scrollbar {
	  width: 4px;
	  height: 4px;
	}
	 
	&::-webkit-scrollbar-track {

	}
	 
	&::-webkit-scrollbar-thumb {
		border-radius: 250px;
	  background-color:rgb(28,69,194);
	}
}
 .chat__controls .top__buttons ul>li>a{

	align-items:flex-start;
	justify-content:flex-start;
}
 .contacts__list .contacts__list--box>.contact__element>.top>p{
	width: calc(100% - 100px);
	 overflow:hidden;
	  display:inline-block;
	  text-overflow: ellipsis;
	  white-space: nowrap;
}
 .contacts__list .contacts__list--box>.contact__element.smaller{

	padding-left: 20px;
}
.owned{
	display: flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom: 4px;
	& .controls{
		display: flex;
		align-items:center;
		justify-content:flex-end;
		&>span{
			display: inline-flex;
			margin-right: 8px;
			&:last-child{
				margin-right: 0px;
			}
		}
	}
	&>.left{
		display: flex;
		align-items:center;
		justify-content:flex-start;
		width: calc(100% - 60px);
		&>span{
			display: inline-flex;
			align-items:center;
			margin-right: 8px;
		}
		&>p{
			margin:0px;
			font-size: 16px;
			line-height: 140%;
			font-weight: 600;
			color:#111928;
			
			 overflow:hidden;
			  display:inline-block;
			  text-overflow: ellipsis;
			  white-space: nowrap;
		}
	}
}
.chat__wrapper .right .btns .square{
	min-height: 37px;
	padding:0px;
	min-width: 37px;
	align-items:center;
	justify-content:center;
}

.select__template--wrapper{
	position: absolute;
	z-index: 10;
	border-radius: 6px;
	border:1px solid #E5E7EB;
	background-color:#fff;
	max-width: 335px;
	box-shadow:0px 8px 12px rgba(0,0,0,.04);
	& .inner{
		& .list{
			max-height: 195px;
			overflow-y:auto;
			&::-webkit-scrollbar {
			  width: 4px;
			  height: 4px;
			}
			 
			&::-webkit-scrollbar-track {

			}
			 
			&::-webkit-scrollbar-thumb {
				border-radius: 250px;
			  background-color:rgb(28,69,194);
			}
			&>.elem{
				display: flex;
				flex-direction:column;
				align-items:flex-start;
				padding:14px 15px;
				text-decoration: none;
				border-bottom: 1px solid #E5E7EB;
				transition:.3s ease all;
				&:hover{
					background-color:#F9FAFB;
				}
				&:last-child{
					border-bottom:0px;
				}
				&>p{
					font-size: 12px;
					line-height: 150%;
					font-weight: 400;
					color:#4B5563;
					overflow: hidden;
				    display: -webkit-box;
				    -webkit-line-clamp: 2;
				    -webkit-box-orient: vertical;
					margin:0px;
				}
				&>.top{
					display: flex;
					align-items:center;
					margin-bottom: 4px;
					justify-content:flex-start;
					&>p{
						margin:0px;
						font-size: 14px;
						line-height: 150%;
						font-weight: 500;
						color:#111928;
					}
					&>span{
						display: inline-flex;
						margin-right: 4px;
						& img{
							min-width: 16px;
							max-width: 16px;
						}
					}
				}
			}
		}
		& .search{

			padding:12px 16px;
			border-bottom:1px solid #E5E7EB;
			&>input{
				width: 100%;
				height: 40px;
				padding-left: 12px;
				padding-right: 12px;
				border:1px solid #E5E7EB;
				border-radius: 8px;
			}
		}
		&>.title{

			padding:12px 16px;
			border-bottom:1px solid #E5E7EB;

			&>p{
				margin:0px;
				font-size: 14px;
				line-height: 150%;
				font-weight: 600;
				color:#111928;
			}
		}
	}
}
@media (max-width: 1360px){
	 .chat__controls>textarea{
		height: 80px;
	}
	 .chat__controls{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	 .chat__controls .bottom__buttons{
		padding:7px 20px;
	}
}
@media (max-width: 1200px){
	.select__template--wrapper{
		max-width: 270px;
		margin-left: 80px;
	}
	.choose__template--box{
		min-width: 260px;
		max-width: 260px;
		margin-left: 60px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double{
		flex-direction:column;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double>.contact__info{
		padding:15px;
		max-width: 100%;
		border-right:0px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double .chat__box{
		height: auto;
	}
	.chat__list{
		max-height: 450px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head{
		padding:10px 15px;
	}
	.chat__list{
		height: auto;
		max-height: 450px;
	}
}
@media (max-width: 991px){
	.modal__side.profile__side .inner__modal>.modal__box .double>.contact__info>ul{
		margin-bottom: 16px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double>.contact__info .row__table{
		margin-bottom: 16px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double .contact__info .contact__group{
		margin-bottom: 16px;
		flex-direction:column;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double .contact__info .contact__group>.elem:nth-child(1){
		margin-right: 0px;
		margin-bottom: 15px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double .contact__info .contact__group>.elem:nth-child(2){
		min-width: 0px;
		max-width: 100%;
		width: 100%;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head{
		flex-direction:column;
		position: relative;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head>.left{
		width: 100%;
		margin-bottom: 10px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right{
		width: 100%;
		justify-content:flex-start;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right>a:last-child{
		position: absolute;
		right: 5px;
		top:5px;
	}
	.audience__wrapper .regular__table>.top .find__form{
		max-width: 100%;
		width: 100%;
		margin-right: 0px;
		margin-bottom: 10px;
	}
	.audience__wrapper .regular__table>.top .controls{
		margin-left: auto;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right{
		justify-content:space-between;
		width: 100%;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right>a{
		margin-right: 0px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head>.left .tags .tag{
		margin:4px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head>.left .tags{
		margin-left: -4px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right .email__tags>.el{
		margin:4px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right .email__tags{
		margin-left: -4px;
		flex-wrap:wrap;
		margin-top: -4px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .double>.contact__info>ul{
		justify-content:flex-start;
		overflow-x:auto;
		&::-webkit-scrollbar {
		  width: 6px;
		  height: 4px;
		}
		 
		&::-webkit-scrollbar-track {

		}
		 
		&::-webkit-scrollbar-thumb {
			border-radius: 250px;
		  background-color:rgb(28,69,194);
		}
	}
}
@media (max-width: 767px){
	.chat__controls>textarea{
		height: 65px;
	}
	.chat__list .day__mark{
		margin:15px 0px;
	}
	.chat__list{
		padding:10px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head>.left{
		flex-wrap:wrap;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head>.left{
		margin-bottom: 5px;
	}
	.modal__side.profile__side .inner__modal>.modal__box .head .right .email__tags{
		flex-wrap:wrap;
	}

	.modal__side.profile__side .inner__modal>.modal__box .head>.left .tags{
		margin:4px;
		flex-wrap:wrap;
		margin-left: -4px;
	}
	.audience__wrapper .regular__table>.top .controls{
		position: relative;
	}
	.audience__wrapper .regular__table>.top .controls .filter__btn{
		position: absolute;
		right: 0px;
		bottom:0px;
	}
	.audience__wrapper .regular__table>.top .period__wrapper{
		width: calc(100% - 47px);
		margin-right: auto;
		&>input{
			width: 100%!important;
		}
	}
	.audience__wrapper .regular__table>.top .controls>.group__dropdown{
		width: 100%;
		margin-bottom: 8px;
		margin-right: 0px;
		&>a{
			width: 100%;
			max-width: 100%;
		}
	}
	.audience__wrapper .regular__table>.top .controls{
		flex-direction:column;
		width: 100%;
		&>.regular-btn{
			width: 100%;
			margin-right: 0px;
			margin-bottom: 8px;
		}
	}
	 .chat__controls .bottom__buttons .right>button{
		padding-left: 11px;
		padding-right: 11px;
	}
	 .chat__controls .bottom__buttons .right>span{
		margin-right: 8px;
	}
	 .chat__controls .bottom__buttons ul>li{
		margin-right: 8px;
	}
	 .chat__controls{
		padding:10px;
	}
	 .chat__controls .bottom__buttons{
		padding:7px 12px;
	}
}

@media (max-width: 640px){
	.modal__side.profile__side .inner__modal>.modal__box .double>.contact__info .row__table .list__tables>.elem__table{
		flex-direction:column;
		align-items:flex-start;
		&>span{
			margin-bottom: 5px;
		}
	}
}
@media (max-width: 480px){
	.chat__controls .bottom__buttons .right>span{
		font-size: 11px;
	}
	.chat__controls .bottom__buttons ul>li{
		margin-right: 6px;
	}
}