#page {
	box-sizing: border-box;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 200;
	background: #fff;
	display: none;
	overflow: scroll;
}

#page {
	height: 100%;
}

a {
	text-decoration: none;
	cursor: pointer;
}

#main-content {
	max-width: 1068px;
	width: 1068px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -178px 0 0 -534px;
}

#main-content.gt-four-browsers {
	margin-top: -254px;
}

#art {
	display: inline-block;
	float: left;
}

#browsers {
	display: inline-block;
	margin-left: 48px;
	max-width: 592px;
	width: 592px;
	float: left;
	margin-bottom: 16px;
}

h1 {
	font-family: PingFangSC-Regular, sans-serif, Microsoft YaHei, SimHei,
		Tahoma !important;
	font-weight: 500;
	margin-bottom: 16px;
	font-size: 32px;
	line-height: 48px;
}

#browsers p {
	margin-bottom: 24px;
	line-height: 21px;
}

.browser_not_supported-tip {
	margin-top: 100px;
	float: left;
}

.browsers-list {
	height: 141px;
	float: left;
	margin-bottom: 16px;
}

.browser {
	width: 136px;
	margin: 0 16px 16px 0;
	background: #f3f3f3;
	border-radius: 4px;
	float: left;
}

.browser a {
	display: block;
	width: 104px;
	margin: 16px 16px;
	color: #0d0d0d;
	box-sizing: content-box;
	text-align: center;
}

.browser a:visited {
	color: #0d0d0d;
}

.browser h3 {
	font-size: 14px;
	font-weight: 500;
	line-height: 16px;
	text-align: center;
}

@media ( max-width : 1127px) {
	#main-content {
		max-width: 1030px;
	}
	#art {
		width: 390px;
		height: 260px;
	}
}

@media ( max-width : 1069px) {
	#main-content {
		position: relative;
		top: inherit;
		left: inherit;
		margin: 0 auto;
		max-width: 640px;
		text-align: center;
	}
	#main-content.gt-four-browsers {
		margin-top: 0;
	}
	#browsers {
		margin-bottom: 24px;
		margin-left: 0;
	}
}

@media ( max-width : 647px) {
	#main-content {
		margin: 16px auto;
		max-width: 440px;
	}
	#art {
		width: 360px;
		height: 240px;
	}
	.browsers-list {
		margin-right: -16px;
		text-align: left;
	}
}

@media ( max-width : 491px) {
	#main-content {
		max-width: 288px;
	}
	h1 {
		font-size: 32px;
		line-height: 40px;
	}
	#art {
		width: 300px;
		height: 200px;
	}
}

#loading-container {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

@
-webkit-keyframes rotator { 0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg)
}

100%
{
-webkit-transform


:

 

rotate


(270
deg
);


                

transform


:

 

rotate


(270
deg
);


                

-ms-transform


:

 

rotate


(360
deg
)


            

}
}
@
keyframes rotator { 0% {
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg)
}

100%
{
-webkit-transform


:

 

rotate


(270
deg
);


                

transform


:

 

rotate


(270
deg
);


                

-ms-transform


:

 

rotate


(360
deg
)


            

}
}
#loading-container .spinner {
	-webkit-animation: rotator 1.4s linear infinite;
	animation: rotator 1.4s linear infinite;
}

#loading-container .spinner .path {
	stroke-dasharray: 187;
	stroke-dashoffset: 50;
	-webkit-transform-origin: center;
	transform-origin: center;
	stroke: #4285F4;
	-webkit-animation: dash 1.4s ease-in-out infinite;
	animation: dash 1.4s ease-in-out infinite;
}

.func_item{
	cursor:pointer;
}

