/* 创建两个不相等的彼此并排的浮动列 */
	/* 左列 */
	.leftcolumn
	{
		float: left;
		width: 70%;
		background-color: #f1f1f1;
		padding: 20px;
	}

	/* 右列 */
	.rightcolumn
	{
		float: left;
		width: 30%;
		background-color: #f1f1f1;
		padding: 20px;
		padding-left: 0;
	}

	/* 为文章添加卡片效果 */
	.card
	{
		background-color: white;
		padding: 20px;
		margin-bottom: 20px;
		overflow: hidden;
	}

	/* 清除列之后的浮动 */
	.row:after
	{
		content: "";
		display: table;
		clear: both;
	}

	/* 响应式布局 - 当屏幕的宽度小于 800 像素时，使两列堆叠而不是并排 */
	@media screen and (max-width: 800px)
	{
		.leftcolumn, .rightcolumn
		{
			width: 100%;
			padding: 0;
		}
		
		.arrow
		{
			font-size: 32px;
			border-radius: 3px;
		}
	}
	
	/* 响应式布局 - 当屏幕的宽度小于 400 像素时，使导航链接堆叠而不是并排 */
	@media screen and (max-width: 400px)
	{
		.topnav a
		{
			float: none;
			width: 100%;
		}
	}


	/* -----------------------广告轮播--------------------------  */
	.advbox
	{
		width: 95vw;
		height: 45vw;
		overflow: hidden;
	}
	
	.advimg
	{
		position: absolute;
		animation-name: adv;
		animation-duration: 1s;
		display: none;
		width: 100%;
		height: auto;
		z-index: -1;
	}

	.advbox img:first-child
	{
		display: block;
	}		

	@keyframes adv
	{
		from {opacity: 0;}
		to   {opacity: 1;}
	}
	
	.arrow
	{
		display: block;
		font-size: 100px;
		color: white;
		border: 1px solid #c0c0c0;
		border-radius: 10px;
		box-shadow: 1px 1px 3px rgb(100, 100, 100, 0.3);
		background-color: #e0e0e0;
	}
	
	#arrow_left
	{
		float: left;
	}
	
	#arrow_right
	{
		float: right;
	}
	
	.advpoint
	{
		text-align: center;
		vertical-align: middle;
	}
	
	@keyframes roll
	{
		to {transform: translate(-3784px);}
	}
	
	.scroll_img
	{
		animation: roll 66s linear infinite;
	}
	
	.full_img
	{
		max-width: 100%;
	}