@charset "utf-8";

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


img {
	max-width: 100%;
}


@font-face {
	font-family: 'AileronThin';
	src: url("./../font/Aileron-Thin-13.ttf") format("truetype");
}

/* @font-face {
	font-family: 'AileronRegular';
	src: url("./../font/Aileron-Regular-10.otf") format("truetype");
} */

/* @font-face {
	font-family: 'AileronBlack';
	src: url("./../font/Aileron-Black-2.otf") format("truetype");
} */

/* @font-face {
	font-family: 'AileronBold';
	src: url("./../font/Aileron-Bold-4.otf") format("truetype");
} */

/* @font-face {
	font-family: 'AileronHeavy';
	src: url("./../font/Aileron-Heavy-6.otf") format("truetype");
} */

@font-face {
	font-family: 'SourceSansProRegular';
	src: url("./../font/SourceSansPro-Regular.ttf") format("truetype");
}

@font-face {
	font-family: 'SourceSansProBold';
	src: url("./../font/SourceSansPro-Bold.ttf") format("truetype");
}

/* 应用动画的类 - 只执行一次并保留最终状态 */
.text-gradient.animated {
	animation: singleFadeInUp 1.5s ease forwards;
	position: relative;
}

/* 单个动画 - 从下往上淡入 */
@keyframes singleFadeInUp {
	0% {
		opacity: 0;
		transform: translateY(3rem);
		/* 100px -> 5rem */
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}


/* This used to work for parent element of button divs */

/* But it is not enough now, below dont hide play button parent div */

.cover-video::-webkit-media-controls-panel {

	display: none !important;

	-webkit-appearance: none;

}

/* Old shadow dom for play button */

.cover-video::--webkit-media-controls-play-button {

	display: none !important;

	-webkit-appearance: none;

}

/* New shadow dom for play button */

/* This one works */

.cover-video::-webkit-media-controls-start-playback-button {

	display: none !important;

	-webkit-appearance: none;

}

/* 兼容 Safari / 苹果手机 / PC 全平台淡入淡出 */
.text-gradient {
	opacity: 0;
	transform: translateY(25px);
	-webkit-transform: translateY(25px);
	transition: opacity 0.8s ease-in, transform 0.8s cubic-bezier(0.26, 0.67, 0.48, 0.91);
	-webkit-transition: opacity 0.8s ease-in, -webkit-transform 0.8s cubic-bezier(0.26, 0.67, 0.48, 0.91);
	 will-change: opacity, transform;
}

.text-gradient.fade-in {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
}