@media (max-width: 1150px) {
    /* 在小屏幕上应用的样式 */
	.body{
	grid-template-columns: 4fr;
	
	}
	#l2{
		display:none;
	}
	.hitokoto{
		width: 80%;
		transform: scale(0.85);
		transition: 0.5s;
	}
	.normaltext{
		width: 80%;
		transform: scale(0.85);
		transition: 0.5s;
	}
	
	.navdiv{
		width: 40%;
		min-width: 30vh;
	}
	.hitokoto:hover{
		transform: scale(0.95);
	}
	.normaltext:hover{
		transform: scale(0.95);
	}
	.icon-m{
		display: none;
	}
	.menu-button {
		display: none;
	}
	.close-button {
		display: none;
	}
	.navcard{
		display: none;
	}
}

@media (max-width: 768px) {
    /* 在小屏幕上应用的样式 */
	.body{
		height: 73%;
		grid-template-columns: 4fr;
		grid-template-rows: 4fr 2fr;
	}
	#l2{
		display:none;
	}
	.hitokoto{
		width: 80%;
		opacity: 1;
		transform: scale(0.80);
		transition: all 0.5s;
	}
	
	.normaltext{
		width: 80%;
		transform: scale(0.80);
		transition: 0.5s;
	}

	.navdiv{
		width: 40%;
		min-width: 30vh;
		height: 30%;
	}
	.hitokoto:hover{
		transform: scale(0.85);
	}
	.normaltext:hover{
		transform: scale(0.85);
	}
	#r2{
		display: none;
	}
	#l1{
	    display: none;
	}
	.date{
		display: none;
	}
	.clock{
		display: none;
	}
	.header{
		height: 12%;
	}
	.img-self{
	    transform: scale(0.8);
	}
	.icon-m{
		display: flex;
		width:100%;
		height: 70%;
		margin: 0;
		padding: 0;
		align-items: center;
		justify-content: center;;
	}
	.icon{
		display: none;
	}	
	.menu-button{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background: rgb(0 0 0 / 25%);
	    backdrop-filter: blur(10px);
    	border-radius: 8px;
    	height:7%;
    	width: 15%;
    	position: fixed;
    	bottom: 10%;
    	transition: transform 0.2s ease;
	}
	.menu-button:hover{
	    transform: scale(1.10);
		transition: 0.5s;
	}
	.close-button{
		display: none;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background: rgb(0 0 0 / 25%);
	    backdrop-filter: blur(10px);
    	border-radius: 8px;
    	height:7%;
    	width: 15%;
    	position: fixed;
    	bottom: 10%;
    	transition: transform 0.2s ease;
	}
	
	.close-button:hover{
	    transform: scale(1.10);
		transition: 0.5s;
	}
	
	.navcard{
		display: none;	
		background: rgb(0 0 0 / 25%);
		backdrop-filter: blur(10px);
		border-radius: 8px;
		position: fixed;
		opacity: 0;
		transition: all 0.5s;
		height: 50%;
		width: 80%;
		top:25%;
	}
}