
/*本文档存放右边控制栏的盒子*/








#Control_Strip{/*功能栏 1 */
		width: 470px;
		height: 410px;
		margin-left: 20px;
		padding-top: 40px;
		opacity: 0;
		transition: opacity 0.3s ease-in-out;
	}
		#control_1_1,#control_1_2{/*主功能栏左右(背景虚化) 2 */
			/* width: 230px; */
			width: 49%;
			height: 120px;
			border-radius: 5px;
			background: rgba(61, 59, 72, 0.6);
			backdrop-filter: blur(4px);
			transition:backdrop-filter 0.4s ease;
			transition: 0.5s;
		}
			#control_1_1{/*主功能栏左 3 */
				float: left;
				align-items: center;
				justify-content: center;
			}
				#date_box{/*日期盒子 4 */
						width: 100%;
						height: 108px;
						text-align: center; /* 水平居中文字 */
						padding-top: 15px;
						font-weight: 200;
						color: white;
						transition: 0.2s;
					}
					.time_box{/*时间盒子 5 */
						font-family: Harlow Solid Italic;
						line-height: 50px;
						font-size: 38px;
						font-weight: 400;
						letter-spacing: 1px;
						transition: 0.2s;
					}
				
					.date_1{/*年月日盒子 5 */
						font-family: Harlow Solid Italic;
						line-height: 20px;
						font-size: 14px;
						font-weight: 400;
						letter-spacing: 1px;
						transition: 0.2s;
					}
					.date_2{/*星期盒子 5 */
						font-family: "微软雅黑";
						line-height: 20px;
						font-size: 14px;
						font-weight: 400;
						letter-spacing: 1px;
						transition: 0.2s;
					}

					/* #date_3{
						font-family: "微软雅黑";
						color: #a7a7a7;
						line-height: 45px;
						font-weight: 700;
						letter-spacing: 1px;
					} */
			#control_1_2{/*主功能栏右 3 */
				float: right;
				align-items: center;
				justify-content: center;
			}
				#weather_box{/*天气盒子 4 */
						width: 100%;
						height: 100%;
						text-align: center; /* 水平居中文字 */
						padding-top: 0px;
						font-weight: 200;
						color: white;
						transition: 0.2s;
						justify-content: center;
						text-align: center;
					}
						#weather_box_text{
							height: 80px;
							font-size: 14px;
							padding-top: 40px;
							text-align: center;
							transition: 0.2s;
						}
						.weather_city{
							width: 230px;
							height: 30px;
							padding-top: 12px;
							justify-content: center;
							text-align: center;
							font-size: 17px;
							transition: 0.2s;
						}
						.weather_temperature{
							padding-left: 35px;
							padding-bottom: 20px;
							margin-top: -3px;
							width: 95px;
							height: 60px;
							font-weight: 300;
							font-size: 45px;
							float: left;
							transition: 0.2s;
							transition: 0.2s ease-in-out;
						}
						.weather_weather{
							margin-top: 0px;
							padding-right: 18px;
							padding-top: 5px;
							float: right;
							font-size: 19px;
							height: 30px;
							width: 82px;
							transition: 0.2s;
						}
						.weather_winddirection{
							float: right;
							padding-right: 18px;
							font-size: 16px;
							height: 42px;
							width: 82px;
							transition: 0.2s;
						}
					
		#control_title{/*网站列表标题盒子 3 */
			width: 100%;
			height: 25px;
			float: left;
			display: flex;
			align-items: center;
			margin-top: 2%;
		}
			.control_title{/*网站列表标题文字 4 */
				text-align: left;
				font-size: 12px;
				font-weight: 500;
				color: white;
			}
		#control_2_1,#control_2_2,#control_2_4,#control_2_5{/*网站列表左边四个 3 */
			margin: 2% 2% 0 0;
		}
		#control_2_3,#control_2_6{/*网站列表右边两个 3 */
			margin: 2% 0 0 0;
		}
		#control_2_1,#control_2_2,#control_2_3,#control_2_4,#control_2_5,#control_2_6{/*网站列表控制浮动及宽高(背景虚化) 3 */
			width: 32%;
			height: 20%;
			float: left;
			border-radius: 5px;
			background: rgba(61, 59, 72, 0.6);
			backdrop-filter: blur(4px);
			transition:backdrop-filter 0.4s ease;
			color: aliceblue;
			font-size: 12px;
			display: flex;
			justify-content: center;
			align-items: center;
			transition: 0.4s;
			cursor: pointer;
		}
	
		#time_box_big{
			margin-top: 20%;
			line-height: 50px; /* 垂直居中文字 */
			text-align: center; /* 水平居中文字 */
			font-size: 130px; /* 字体大小 */
			font-weight: 700; /* 字体加粗 */
			opacity: 0.9;
			color: white;
		}
		
	#control_box{
		width: 100%;
		height: 100%;
		color: white;
		text-align: center;
		line-height: 80px;
		display: inline-block;
		/* font-size: 10px; */
	}
		
/**************************************************鼠标悬浮效果****************************************/

#control_1_1:hover,#control_1_2:hover{/*主功能栏(背景虚化)*/
		cursor: pointer;
		transition: 0.3s;
		backdrop-filter: blur(14px);
	}
	
	#control_2_1:hover,#control_2_2:hover,
	#control_2_3:hover,#control_2_4:hover,
	#control_2_5:hover,#control_2_6:hover
	{/*网站列表上左控制浮动及宽高(背景虚化)*/
		background: rgba(129, 129, 129, 0.3);
		font-size: 14px;
		transition: 0.2s;
		backdrop-filter: blur(14px);
	}
	
	.date_box:hover .date_1{/*主功能栏左*/
		transition: 0.3s;
		font-size: 15px;
	}

	.date_box:hover .date_2{/*主功能栏左*/
		transition: 0.3s;
		font-size: 15px;
	}

	.date_box:hover .time_box{/*主功能栏左*/
		transition: 0.3s;
		font-size: 44px;
	}

	#weather_box_text:hover{
		transition: 0.3s;
		font-size: 16px;
	}

	#temperature_box:hover{
		transition: 0.3s;
		/* font-size: 15px; */
	}
	#control_1_2:hover .weather_city{
		font-size: 19px;
		transition: 0.3s;
	}

	#control_1_2:hover .weather_temperature{
		font-size: 48px;
		transition: 0.2s;
		transition: 0.2s ease-in-out;
	}

	#control_1_2:hover .weather_weather{
		font-size: 21px;
		transition: 0.3s;
	}

	#control_1_2:hover .weather_winddirection{
		font-size: 18px;
		transition: 0.3s;
	}
