* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}


.usertop {
	width: 25rem;
	height: 10rem;
	 display: flex;
  align-items: center; 
}
.usertop2 {
	width: 25rem;
	height: 3.5rem;
	 display: flex;
  align-items: center; 
}
.usertopl {
	display: inline-block;
	width: 10rem;
    height: 10rem;	
}
.usertopl img{
	width: 9rem;
	height: 9rem;
    border-radius: 50%;
    display: block;
	margin:.5rem;
}


.usertopr {
	display: inline-block;
	width: 15rem;
    margin:.5rem;
	
}

.usertopr2 {
	display: inline-block;

    margin:.5rem;
	
}

.usertopr h1{
	display: inline-block;
    margin:.5rem;
	font-family: SimHei;
	font-size: 1.2rem;
	color: #fd21e2;
}
.usertopr2 h1{
	display: inline-block;
    margin:.5rem;
	font-family: SimHei;
	font-size: 1.2rem;
	color: #fd21e2;
}
.usertopr img{
	width: 1.5rem;

}

.usertopr a{
	
    margin:.5rem;
	
}

.usermo {
	 margin:.5rem;
	width: 25rem;
	height: 5rem;
	 display: flex;
  align-items: center; 
  border-radius: 1rem;
  background-image: url('../img/bg.jpg');
}

.usermol {
	display: inline-block;
	width: 18rem;
    height: 5rem;	
}

.usermor {
	display: inline-block;
	width: 9rem;
    height: 5rem;	
	display: flex;
	align-items: center; 
}

.usermol h1{
 margin:.5rem;
	font-family: SimHei;
	font-size: 2rem;
	color: purple;
}

.usermol h3{
 margin:.5rem;
	font-family: SimHei;
	font-size: 1rem;
	color: purple;
}

.cz {
	width: 8rem;
	height: 2.5rem;
	background-color:white;
  border-radius: 1.5rem;
  	display: flex;
	align-items: center;
	 justify-content: center; 
	
}

.cz a {
	 font-family: SimHei;
	font-size: 1.2rem;
	color: purple;
}


.user {
	 margin:.5rem;
	width: 25rem;
	height: 6rem;
	 display: flex;
  align-items: center; 

  
}

.user1, .user2, .user3 {
	 text-align: center;
	width: 32%;
}

.user img{
	margin:.5rem; 
	width: 40%;
	
	
}

.dai {
	 margin:2rem .5rem;
	width: 25rem;
	height: 4rem;
	 display: flex;
  align-items: center; 
 border-top: .1rem solid #000;
 border-bottom: .1rem solid #000;
  
}

.dai a{
	padding-left:1rem;
	 font-family: SimHei;
	font-size: 1.2rem;

  
}

.container {
  position: relative; /* 确保容器是定位的上下文 */
}

.footer {

 position: fixed;
    bottom: 0;
           max-width: 25rem;
    background-color: #f8f9fa; /* 背景颜色 */
    text-align: center; /* 文本居中 */
}

.fl {
	display: inline-block;
	width: 48%;
 	height:3rem;
	
}

.fr {
	display: inline-block;
	width: 48%;
    height:3rem;

}

.footer img{
	margin:.5rem; 
	width: 15%;
}




.cz2 {
	width: 8rem;
	height: 2.5rem;
	background-color:#cd19f3;
  border-radius: 1.5rem;
  	display: flex;
	align-items: center;
	 justify-content: center; 
	
}

.cz2 a {
	 font-family: SimHei;
	font-size: 1.2rem;
	color: white;
}

.top {
	width: 25rem;
	height: 3rem;
	background-color:#ff3ceb;
	 display: flex;
  align-items: center; 
}
.search {
	width: 25rem;
	height: 3rem;
	padding:0 1rem;
	text-align: center;
	 display: flex;
  align-items: center; 
}
.search input{
padding: 0.275rem 0.45rem;
border: 1px solid #ced4da;
}
.search select{
padding: 0.275rem 0.45rem;
border: 1px solid #ced4da;
}
.search button {
    color: #fff;
    background-color: #c224d9;
    border-color: #c224d9;
    padding: 0.375rem 0.75rem;
}
.topr {
	width: 50%;
	height: 5rem;
	
		 display: flex;
  align-items: center; 
}

.topr a{
 padding-left:1.5rem;
 color:white;
}

.topl {
	width: 50%;
	height: 5rem;
	padding:.5rem;
	 display: flex;
  align-items: center; 
}

.topl img{
	width: 50%;
	padding:.5rem;
	 display: flex;
  align-items: center; 
}
.city {
	margin:.5rem;
}

.city h1 {
	
	font-family: SimHei;
	font-size: 1.5rem;
}

.city h2 {
	display: inline-block;
	margin:.5rem;
	font-family: SimHei;
	font-size: 1rem;
}

.city a {
	padding:.2rem .8rem;
	 border: 1px solid black;
	 border-radius: .5rem;
}

.cname {
	padding:1.5rem .8rem;
}
.edit{
	padding:1rem .8rem;
}

.edit input {
    width: 35%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.edit button {
    color: #fff;
    background-color: #c224d9;
    border-color: #c224d9;
	padding:.375rem .75rem;
}

.edit textarea {
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.edit select {
    padding: 0.275rem 0.45rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}



.masonry {
    padding: .3rem;
  column-count: 2; /* 列数 */
  column-gap: .1rem; /* 列间距 */
}
 
.masonry2 {
  width: 100%; /* 使图片宽度适应列宽 */
  display: block; /* 防止图片下方有空隙 */
  margin-bottom: .1rem; /* 图片间的间距 */
}

.masonry2 img{
  width: 100%; /* 使图片宽度适应列宽 */
  margin-bottom: .1rem; /* 图片间的间距 */
}

@keyframes shake {
  0% { transform: translateY(0); }
  25% { transform: translateY(-.2rem); }
  50% { transform: translateY(.2rem); }
  75% { transform: translateY(-.2rem); }
  100% { transform: translateY(0); }
}
 


.chat {
	 margin:1rem;
 width: 80%; /* 或者具体的宽度 */
    margin-left: auto;
    margin-right: auto;
	height: 3rem;
	
     display: flex;
	 align-items: center;
    justify-content: center;
  border-radius: 1rem;
  background-image: url('../img/bg.jpg');
  animation: shake 3s infinite;
}

.chat a{
	font-family: SimHei;
	font-size: 1.8rem;
	color:white;
}

.chat button{
	all: unset;
	font-family: SimHei;
	font-size: 1.8rem;
	color:white;
}

.pagination {
 width: 85%; /* 或者具体的宽度 */
    margin-left: auto;
    margin-right: auto;
	
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem;
    text-align: center;

}

.pagination a {
    display: inline-block;
    padding: 5px 10px;
    margin: 0 5px;
    border: 1px solid #ccc;
    text-decoration: none;
    color: #000000;
}

.lianxi {
	 margin:1rem;
 width: 85%; /* 或者具体的宽度 */
    margin-left: auto;
    margin-right: auto;
     display: flex;
	 align-items: center;
  border-radius: 1rem;
  border: .2rem dashed #f33fab; /* 2px 宽度，虚线样式，黑色 */
    padding: 1rem; 
}

table {
	 margin:1rem;
 width: 85%; /* 或者具体的宽度 */
    margin-left: auto;
    margin-right: auto;
  border: .2rem dashed #f33fab; /* 2px 宽度，虚线样式，黑色 */
    padding: 1rem; 
}

tr,caption{
	padding: 1rem 0; 
}

.ibutton{
	width:100%;
	background-color:#ff28b3;
	color:white;
	padding:.2rem;
}

 .masonry2 form{ 	width:100%;
display: inline-block; }


.topl a { font-size: 2rem; font-family: SimHei;color: antiquewhite;} 
.yq {width: 25rem;align-items: center; } 
.yq img {width: 100%; }