* {
	margin:0px;
	padding:0px;
	border:0px;
	list-style:none;
	color:inherit;
	font-weight:normal;
	box-sizing:border-box;
	font-style:normal;
	-webkit-tap-highlight-color:transparent;
	outline:none;
	text-decoration:none;
	font-family:"UKIJ Tor" !important;
}
body {
	width:100%;
	overflow-x:hidden;
	background: #f7f7f7;
	color:rgb(140,140,140);
}
img {
	vertical-align:middle;
	max-width:100%;
}
/*加载图标*/
.loading_box {
	position:fixed;
	bottom:45%;
	left:40%;
	z-index:1000;
}
.loading_box img {
	height:85px;
	width:100px;
}
/*底部导航*/
.foot-nav {
	position:fixed;
	left:0px;
	bottom:0px;
	width:100%;
	height:60px;
	background:rgb(255,255,255);
	z-index:99999;
	box-shadow:rgba(0,0,0,0.4) 0px 5px 5px 2px;
}
.foot-nav li {
	width:100%;
	height:100%;
	direction:rtl;
}
.foot-nav li a {
	font-size:13px;
	color:rgb(131,131,131);
	display:flex;
	flex-direction:column;
	width:33.333%;
	float:right;
	text-align:center;
}
.foot-nav li a i {
	width:35px;
	height:35px;
	margin:0px auto;
	display:block;
}
.foot-nav li a img {
	width:47px;
	height:47px;
	margin:-15px auto 0px;
	display:block;
}
.foot-nav li a.home i {
	background:url("/static/index/imges/lover.png") center bottom / 70% no-repeat;
}
.foot-nav li a.home.select i {
	background-image:url("/static/index/imges/loverbtn.png");
}
.foot-nav li a.top i {
	background:url("/static/index/imges/homes.png") center bottom / 70% no-repeat;
}
.foot-nav li a.top.select i {
	background-image:url("/static/index/imges/homesbtn.png");
}
.foot-nav li a.user i {
	background:url("/static/index/imges/users.png") center bottom / 70% no-repeat;
}
.foot-nav li a.user.select i {
	background-image:url("/static/index/imges/usersbtn.png");
}
.foot-nav li a p {
	padding-top:3px;
	color:#1296db;
}
.foot-nav li a.select p {
	color:#d4237a;
	font-weight:900;
}
/*群列表*/
.group {
	width:96%;
	height:100px;
	background:white;
	margin:0 auto;
	margin-top:10px;
	border-radius:4px;
}
.group_item {
	width:100%;
	height:90px;
	direction:rtl;
}
.group_logo {
	width:21%;
	height:80px;
	background:#f3f0f0;
	float:right;
	margin-top:7px;
	margin-right:3%;
}
.group_logo img {
	width:100%;
	height:100%;
	border-radius:5px;
}
.group_title {
	width:72%;
	height:80px;
	margin-top:7px;
	float:left;
	direction:rtl;
}
.group_view {
	width:100%;
	height:25px;
	line-height:25px;
	font-size:12px;
	color:#999;
}
.group_name {
	width:100%;
	height:40px;
	line-height:40px;
	font-size:15px;
	color:#333;
}
.group_btn {
	width:25%;
	height:37px;
	background:#2d5fff;
	line-height:37px;
	font-size:15px;
	text-align:center;
	color:white;
	border-radius:3px;
	position:absolute;
	margin-top:30px;
	margin-left:13px;
}
/*群聊天页面*/
.title {
	width:100%;
	height:40px;
	background:white;
	line-height:40px;
	text-align:center;
	direction:rtl;
	font-size:16px;
	color:#444;
}
.show {
	width:92%;
	height:400px;
	background:white;
	margin:0 auto;
	margin-top:20px;
	border-radius:4px;
}
.show_name {
	width:100%;
	height:70px;
	line-height:70px;
	font-size:18px;
	color:#333;
	font-weight:bold;
	overflow:hidden;
}
.show_qrcode {
	width:55%;
	height:190px;
	background:#e7e7e7;
	margin:0 auto;
	border-radius:3px;
	margin-top:30px;
}
.show_qrcode img {
	width:100%;
	height:100%;
}
.show_eror {
	width:100%;
	height:60px;
	line-height:60px;
	text-align:center;
	font-size:15px;
	color:#555;
}
.chat-container {
	width:400px;
	height:600px;
	margin:30px auto;
	background-color:#fff;
	border-radius:10px;
	box-shadow:0 10px 20px rgba(0,0,0,0.2);
	overflow:hidden;
}
.header {
	height:60px;
	padding:10px;
	display:flex;
	align-items:center;
}
.user-info {
	margin-left:auto;
	display:flex;
	align-items:center;
}
.avatar-container {
	width:40px;
	height:40px;
	border-radius:20px;
	overflow:hidden;
	margin-right:10px;
}
.avatar {
	width:100%;
}

.message {
	margin:10px 15px;
	max-width:70%;
	padding:10px;
	border-radius:8px;
	font-size:15px;
}
.self-message {
	background-color:#adff2f;
	margin-left:auto;
	text-align:right;
}
.other-message {
	background-color:#eee;
	margin-right:auto;
	text-align:left;
}
.username {
	font-weight:bold;
}
.input-box {
	height:60px;
	display:flex;
	align-items:center;
}
#input-message {
	flex-grow:2;
	height:40px;
	padding:5px;
	margin:0 10px;
	border-radius:5px;
	border:1px solid #ccc;
}
#send-btn {
	width:80px;
	height:40px;
	background-color:#4caf50;
	color:#fff;
	border:none;
	border-radius:5px;
	cursor:pointer;
	transition:background-color 0.2s ease-out;
}
#send-btn:hover {
	background-color:#3e8e41;
}
/*个人中心页面*/
.userlist {
	width:100%;
	height:200px;
	background:#2d5fff;
}
.user_logo {
	width:70px;
	height:70px;
	margin:0 auto;
	text-align:center;
}
.user_logo img {
	width:100%;
	height:100%;
	border-radius:50%;
}
.user_name {
	width:100%;
	height:50px;
	line-height:50px;
	text-align:center;
	font-size:17px;
	color:white;
}
.usermore {
	width:96%;
	height:200px;
	margin:0 auto;
	background:white;
	margin-top:-35px;
	border-radius:10px;
}
.more_item {
	width:100%;
	display:block;
	overflow:hidden;
}
.morelist {
	width:33%;
	float:right;
	text-align:center;
	align-items:center;
	justify-content:center;
	margin-top:14px;
}
.morelist_logo {
	width:45px;
	height:45px;
	border-radius:50px;
	text-align:center;
	margin:0 auto;
}
.morelist_logo img {
	width:100%;
	height:100%;
}
.morelist_title {
	height:40px;
	line-height:40px;
	font-size:14px;
	color:#4b4b4b;
	text-align:center;
}
.lover {
	width:96%;
	height:110px;
	background:white;
	margin:0 auto;
	border-radius:4px;
	margin-top:10px;
}
.lover_logo {
	width:22%;
	height:83px;
	background:#f3f3f3;
	float:right;
	margin-top:12px;
	margin-right:3%;
	border-radius:5px;
}
.lover_logo img {
	width:100%;
	height:100%;
}
.lover_item {
	width:73%;
	height:90px;
	float:left;
	margin-top:10px;
}
.lover_title {
	width:100%;
	height:25px;
	line-height:25px;
	direction:rtl;
	color:#444;
	font-size:14px;
}
.lover_titles {
	width:100%;
	height:25px;
	line-height:25px;
	direction:rtl;
	color:#a5a5a5;
	font-size:13px;
}
.lover_flex {
	width:100%;
	display:flex;
	height:25px;
	direction:rtl;
	line-height:25px;
	margin-top:10px;
}
.lover_more {
	font-size:14px;
	padding:0px 12px;
	margin:0px 3px;
	border-radius:3px;
}
.ab {
	background:#f2f5fe;
	color:#2d5fff;
}
.ac {
	background:#feeeee;
	color:red;
}
.ad {
	background:#f6efff;
	color:#8216fa;
}
.addinfo {
	width:30% !important;
	background:#E91E63 !important;
	height:45px !important;
	line-height:45px !important;
	border-radius:30px !important;
	color:white !important;
	font-size:14px !important;
}
.jobnav {
	width:96%;
	height:50px;
	background:rgb(255,255,255);
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-around;
	margin:0 auto;
	margin-top:10px;
}
.jobnav  a {
	font-size:13px;
	width:33%;
	height:45px;
	border-radius:4px;
}
.jobnav  a i {
	width:22px;
	height:22px;
}
.jobnav  a.task i {
	background:url("/static/index/imges/males.png") center bottom / 90% no-repeat;
	position:absolute;
	margin-left:20px;
	margin-top:11px;
}
.jobnav  a.task.selector i {
	background-image:url("/static/index/imges/malebtn.png");
	position:absolute;
	margin-top:11px;
	margin-left:21px;
}
.jobnav  a.tasks i {
	background:url("/static/index/imges/female.png") center bottom / 90% no-repeat;
	position:absolute;
	margin-top:11px;
	margin-left:21px;
}
.jobnav  a.tasks.selector i {
	background-image:url("/static/index/imges/femalebtn.png");
	position:absolute;
	margin-top:11px;
	margin-left:21px;
}
.jobnav  a p {
	color:#8a8a8a;
	font-size:16px;
	line-height:45px;
}
.jobnav  a.selector p {
	color:#E91E63;
	font-size:16px;
	text-align:center;
}
.main {
	width:100%;
	height:184px;
	background:white;
}
.swiper-slide img {
	margin-top:5px;
}
.detaillogo {
	width:100%;
	height:240px;
	overflow:hidden;
}
.detaillogo img {
	width:100%;
	height:100%;
	overflow:hidden;
}
.detail {
	width:100%;
	height:70px;
	background:white;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-around;
	direction:rtl;
}
.detailitem {
	width:100%;
	height:70px;
	border:1px solid #f5f5f5;
	border-bottom-style:solid;
	border-bottom:0px solid white;
	border-top:0px solid white;
}
.detail_age {
	width:100%;
	height:35px;
	line-height:35px;
	font-size:15px;
	color:#b9b9b9;
}
.detail_agetext {
	width:100%;
	height:25px;
	line-height:25px;
	font-size:15px;
	color:#020202;
}
.list {
	width:96%;
	background:white;
	margin-top:5px;
	margin:0 auto;
	margin-top:5px;
	border-radius:5px;
}
.listtitle {
	width:96%;
	height:50px;
	display:flex;
	direction:rtl;
	align-items:center;
	margin:0 auto;
}
.listicon {
	width:10px;
	align-items:center;
	color:#c8c8c8;
}
.listname {
	font-size:14px;
	color:#999;
}
.content {
	width:100%;
	direction:rtl;
	padding:5px 10px;
	line-height:25px;
	font-size:15px;
	color:#3c3c3c;
	text-align:justify;
}
.phoneitem {
	width:96%;
	background:white;
	margin:0 auto;
}
.wechat_item {
	width:100%;
	height:30px;
	display:flex;
	align-items:center;
	direction:rtl;
	line-height:30px;
}
.wechat {
	font-size:14px;
	color:black;
}
.wechatnumber {
	font-size:18px;
	color:#ee0000;
	line-height:25px;
	margin-top:8px;
	margin-right:9px;
}
.isnumber {
	font-size: 16px;
	color: #ff2020;
	line-height:25px;
	margin-top:8px;
	margin-right: 12px;
}
.qrcode {
	width:45%;
	height:165px;
	background: #ffffff;
	margin:0 auto;
	margin-top:15px;
}
.qrcode img {
	width: 100%;
	height: 100%;
	}.pay {
	width:50%;
	height:45px;
	background:#E91E63;
	margin:0 auto;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:center;
	border-radius:5px;
	direction:rtl;
	margin-top: 30px;
}
.pay_logo {
	width:22px;
	height:23px;
	margin-left:5px;
}
.pay_logo img {
	width:100%;
	height:100%;
}
.pay_name {
	color:white;
	font-size:16px;
}
.height {
	width:100%;
	height:125px;
	background:white;
}
.dialogoverlay {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.5);
	z-index:9999;
	display:none;
}
.dialogbox {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	background-color:white;
	padding:20px;
	border-radius:5px;
	width:72%;
	text-align:center;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
}
.dialogs {
	width:75%;
	height:180px;
	background:#e3e3e3;
	margin:0 auto;
}
.dialogs img {
	width:100%;
	height:100%;
}
.dialog {
	width:75%;
	height:180px;
	background:#e3e3e3;
	margin:0 auto;
}
.dialog img {
	width:100%;
	height:100%;
}
.dialog_title {
	width:100%;
	height:40px;
	line-height:40px;
	font-size:14px;
	text-align:center;
	color:#999;
}
.confirm {
	width:60%;
	height:40px;
	margin:0 auto;
	line-height:40px;
	font-size:14px;
	text-align:center;
	color:#fff;
	background:#2d5fff;
	border-radius:5px;
	margin-top:14px;
}
.homelist {
	width:100%;
	height:65px;
	background:white;
	position:fixed;
	bottom:0;
	direction:rtl;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-around;
}
.submit {
	width:45%;
	height:50px;
	line-height:50px;
	background:#6845f6;
	color:white;
	font-size:15px;
	text-align:center;
	border-radius:5px;
}
.return {
	width:45%;
	height:50px;
	line-height:50px;
	background:#f8f6ff;
	color:#6845f6;
	font-size:15px;
	text-align:center;
	border:1px solid #6845f67d;
}
.comment {
	width:96%;
	background:white;
	margin:0 auto;
}
.comment_title {
	width:100%;
	height:50px;
	line-height:50px;
	direction:rtl;
	padding:3px;
	font-size:15px;
	color:red;
	margin-top:10px;
}
.comment_item {
	width:100%;
	height:50px;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-around;
	overflow:hidden;
	direction:rtl;
}
.commentinput {
	width:31%;
	height:45px;
	line-height:45px;
	background:#f6f6f6;
	font-size:14px;
	color:#666;
	text-align:center;
}
.activess {
	background:#eeeaff;
	color:#6a45f6;
	border:1px solid #6845f6;
	border-radius:5px;
}
.comment_phone {
	width:96%;
	margin:0 auto;
	background:wheat;
	height:45px;
	line-height:45px;
	direction:rtl;
}
.comment_phone input {
	width:100%;
	height:45px;
	line-height:45px;
	font-size:15px;
	color:#999;
	background:#f8f8f8;
	border-radius:5px;
	direction:rtl;
	padding:0 10px;
}
.comment_textarea {
	width:96%;
	height:100px;
	background:wheat;
	margin:0 auto;
	margin-top:10px;
}
.comment_textarea textarea {
	width:100%;
	height:100px;
	background:#f8f8f8;
	padding:5px 10px;
	direction:rtl;
	font-size:14px;
}
.tab-container {
	width:100%;

}
.tabs{
    	background: white;
}
.tabs li {
	width:100%;
	display:flex;
	align-items:center;
	justify-content:space-around;
	height: 45px;
	background: white;
}
.tabs li.active {
	background: #2d5fff;
	color:white;
	height: 45px;
}
.tab-content {
}
.tab-content.active {
	display:block;
}
.tablist ul {
	width:100%;
	height: 45px;
	line-height:45px;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:center;
	direction:rtl;
	position: fixed;
}
.kongye{
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: white;
    font-size: 19px;
    color: #9999;
    padding-top: 250px;
}
.addtitle{
    width: 96%;
    height: 60px;
    line-height: 60px;
    background: white;
    margin: 0 auto;
    margin-top: 3px;
    color: #6845f6;
    text-align: center;
}
.lover_area{
    width: 94%;
    height: 45px;
    margin: 0 auto;
    text-align: center;
    background: whitesmoke;
    line-height: 45px;
    color: #666;
    border-radius: 5px;
}
.gender{
    width: 96%;
    height: 45px;
    margin: 0 auto;
    line-height: 45px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    direction: rtl;
}
.genderitem{
    width: 40%;
    height: 46px;
    line-height: 46px;
    background: whitesmoke;
}
.activearea{
    width: 40%;
    height: 46px;
    line-height: 46px;
    background: #f8f6ff;
    color: #6845f6;
    font-size: 15px;
    text-align: center;
    border: 1px solid #6045f6;
    border-radius: 5px;
}
.lover_input{
    width: 96%;
    height: 45px;
    margin: 0 auto;
    line-height: 45px;
    background: whitesmoke;
    direction: ltr;
    padding: 0 8px;
    font-size: 16px;
}
.lover_input input{
    width: 96%;
    height: 45px;
    margin: 0 auto;
    line-height: 45px;
    background: whitesmoke;
    font-size: 14px;
}
.ageitem{
    width: 96%;
    height: 45px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    direction: rtl;
}
.age_input{
    width: 31%;
    height: 45px;
    line-height: 45px;
    background: whitesmoke;
    border-radius: 5px;
}
.age_input input{
    width: 100%;
    height: 45px;
    line-height: 45px;
    background: whitesmoke;
    text-align: center;
    color: #999;
    border-radius: 5px;
    font-size: 14px;
}
.userimges{
    width: 30%;
    height: 110px;
    background: #ebebeb;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 5px;
}
.userimges img{
    width: 60px;
    height: 60px;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    justify-content: center;
}
.layui-upload-file{
    display: none !important;
}
.logocss{
    width: 50%;
    height: 50px;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
    margin-top: 24px;
}
.overlay {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.75);
	z-index:9999;
	display:none;
}
.popup {
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	background-color:#fff;
	padding:15px;
	border-radius:5px;
	width:80%;
	max-width:100%;
	z-index:10000;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
	display:none;
}
.popupheader {
	justify-content:space-between;
	align-items:center;
	padding-bottom:10px;
	margin-bottom:10px;
	border-bottom:1px solid #ccc;
	text-align:center;
}
.popupheader h2 {
	font-size:18px;
	margin:0;
}
.popupcontent {
	width:100%;
	text-align:center;
	font-size:15px;
	line-height:30px;
	color:#333;
}

.popupitem{
	width:100%;
	height:50px;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-evenly;
	margin-top:5px;
	direction:rtl;
}
.moneybtn {
	width:48%;
	height:45px;
	background: #6845f6;
	line-height:45px;
	text-align:center;
	font-size:16px;
	color:#ffff;
	border-radius:3px;
}
.returnbtn {
	width:48%;
	height:45px;
	line-height:43px;
	text-align:center;
	font-size:16px;
	color: #6845f6;
	border-radius:3px;
	border: 1px solid #6845f6;
}
.dialog {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 81%);
  z-index: 999999;
}

.dialog-content {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   background-color: #fff;
   border-radius: 5px;
   box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
   width: 80%;
   height: 180px;
}
.login_title{
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    border-bottom: 1px solid #a9a9a9;
}
.login_alfet{
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 10px;
    text-align: center;
    font-size: 15px;
    color: #000;
}
.login_item{
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    direction: rtl;
    margin-top: 15px;
}
.ok{
    width: 45%;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
    color: #fff;
    background: #8642ff;
    border-radius: 5px;
}
.no{
    width: 45%;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
    color: #8f53fa;
    background: #f5f0ff;
    border-radius: 5px;
    border: 1px solid #8f53fa;
}
.aoverlay {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.75);
	z-index: 999998;
	display:none;
}
.apopup {
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	background-color:#fff;
	padding:15px;
	border-radius:5px;
	width:80%;
	max-width:100%;
	z-index: 199990000;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
	display:none;
}
.apopup-header {
	justify-content:space-between;
	align-items:center;
	padding-bottom:10px;
	margin-bottom:10px;
	border-bottom:1px solid #ccc;
	text-align:center;
}
.apopup-header h2 {
	font-size:18px;
	margin:0;
}
.apopup-content {
	width:100%;
	text-align:center;
	font-size:15px;
	line-height:30px;
	color:#333;
}
/*.btn-popup:hover {
	*/
/*	background-color:#0066b3;
	*/
/*
}
*/
.apopup_item {
	width:100%;
	height:50px;
	display:flex;
	align-items:center;
	text-align:center;
	justify-content:space-evenly;
	margin-top:5px;
	direction:rtl;
}
.amoneybtn {
	width:48%;
	height:45px;
	background: #2d5fff;
	line-height:45px;
	text-align:center;
	font-size:16px;
	color:#ffff;
	border-radius:3px;
}
.areturnbtn {
	width:48%;
	height:45px;
	line-height:43px;
	text-align:center;
	font-size:16px;
	color: #2d5fff;
	border-radius:3px;
	border: 1px solid #2d5fff;
}
.chat{
    width: 100%;
    overflow: hidden;
    background-color: #f5f5f5;
    overflow-y: scroll;
}
.chatuser{
    display: flex;
    margin-left: 5px;
}
.chatlogo{
    width: 13%;
    height: 50px;
    border-radius: 5px;
    background: #cbcbcb;
    margin-left: 5px;
}
.chatlogo img{width: 100%;height: 100%;border-radius: 5px;}
.chatusername{
    font-size: 15px;
    color: #909090;
    width: 60px;
    height: 20px;
    line-height: 20px;
    float: right;
}
.chatcontent{
    background: white;
    color: #333;
    margin-left: 70px;
    margin-top: -15px;
    display: inline-block;
    letter-spacing: 0;
    padding: 0 10px;
    line-height: 30px;
    font-size: 15px;
    border-radius: 5px;
    align-items: center;
    direction: rtl;
    margin-right: 10px;
}
#pay-dialog {
  position: fixed;
  display: flex;
  flex-direction: column;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 81%);
  z-index: 999999;
}
#pay-dialogs {
  width: 80%;
  height: 200px;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #FFFFFF;
  border: 1px solid #CCCCCC;
  z-index: 100;
  border-radius: 5px;
}

#pay-dialog h2 {
  margin-top: 0;
  width: 100%;
  height: 50px;
  line-height: 50px;
  text-align: center;
  border-bottom: 1px solid #ededed;
  font-size: 19px;
}

#pay-dialog p {
  text-align: center;
  direction: rtl;
  font-size: 15px;
  width: 100%;
  height: 70px;
  line-height: 25px;
  margin-top: 10px;
  color: #333;
}
.alert_item{
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    direction: rtl;
}
.alertyes{
    width: 60%;
    height: 45px;
    background: #8845ff;
    border-radius: 3px;
    line-height: 45px;
    color: white;
}
.alertno{
    width: 45%;
    height: 45px;
    background: #ede4ff;
    border-radius: 3px;
    line-height: 45px;
    color: #8845ff;
    border: 1px solid #8845ff7a;
}
.messages {
      display: flex;
      margin: 10px;
      margin-top: 14px;
    }

    .avatars {
      height: 50px;
      width: 50px;
      background-size: cover;
      border-radius: 6px;
      margin-right: 10px;
      float: left;
    }

    .contents {
      background-color: #ffffff;
      padding: 5px 10px;
      max-width: 200px;
      border-radius: 5px;
    }

    .contents:last-child {
      margin-bottom: 0;
      margin-top: 25px;
      margin-left: -50px;
      color: #4c4c4c;
      float: left;
      direction: rtl;
      text-align: justify;
      padding: 5px;
    }
    .pop{
    width: 18%;
    height: 70px;
    background: red;
    position: fixed;
    bottom: 15%;
    border-radius: 5px;
    right: 0;
    margin-right: 3px;
}
    .pop_logo{
        overflow: hidden;
        
    }
    .pop_logo img{
    width: 100%;
    height: 100%;
    border-radius: 5px;
}