header
{
	background-color: transparent !important;
	position: absolute;
	z-index: 99;
}
footer
{
	background-color: #16181b;
}
footer a
{
	color: #eeeeee;
}
.section 
{
	overflow: hidden;
	width: 100%;
	position: relative;
}
.section.section-center
{
	text-align: center;
}
.section.section-left
{
	text-align: left;
}
.section.section-right
{
	text-align: right;
}
.section .section-content
{
	display: inline-block;
	overflow: hidden;
}
.section-title
{
	font-size: 48px;
	font-family: industry;
	font-weight: 800;
	color: #ffffff;
}
.section-desc
{
	font-size: 16px;
	color: #ffffff;
	font-weight: 300;
}
.section.packages .section-desc a
{
	color: #0899f8;
	text-decoration: underline;
}
.section.packages
{
	height: 854px;
	position: relative;
	padding-top: 125px;
	background-image: url(../images/landing_top_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #16181b;
}
.packages-content .no-package
{
	font-size: 48px;
	font-family: industry;
	font-weight: 800;
	color: #ffffff;
	text-align: center;
	padding: 0 200px;
}
.packages-content .no-package a
{
	color: #dd0000;
}
.packages-content .no-package a:hover
{
	color: #b00000
}
.packages-content 
{
	margin-top: 45px;
	text-align: center;
	overflow: hidden;
}
.packages-content .content
{
	overflow: hidden;
}
.packages-content .package-item
{
	padding: 25px;
	width: 345px;
	height: 405px;
	margin-left: 20px;
	margin-right: 20px;
	display: inline-block;
	background-color: #ffffff;
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	color: #16181b;
	margin-bottom: 20px;
	vertical-align: top;
	opacity: 0.95;
	transition: all .35s ease-in-out;
}
.packages-content .package-item.has-purchased
{
	cursor: not-allowed;
}
.packages-content .package-item:hover
{
	opacity: 1;
}
.package-item .ui-corner-triangle
{
	right: -1px;
	top: 0;
	width: 1px;
	height: 0;
	position: absolute;
	border-left: 120px solid transparent;
	border-top: 120px solid #dd0000;
}
.package-item .ui-corner-triangle::before
{
	content: "";
	right: 0;
	top: -120px;
	width: 1px;
	height: 0;
	position: absolute;
	border-left: 55px solid transparent;
	border-top: 55px solid #ffffff;
	z-index: 2;
}
.package-item .ui-corner-content
{
	position: absolute;
	right: -17px;
	top: -88px;
	font-size: 16px;
	transform: rotate(45deg);
	font-weight: 700;
	color: #ffffff;
	width: 130px;
}
.package-item .name
{
	font-size: 30px;
	font-family: industry;
	font-weight: 800;
}
.package-desc
{
	margin-top: 4px;
}
.package-price
{
	margin-top: 2px;
	margin-bottom: 15px;
}
.package-item .description
{
	font-size: 14px;
	color: #000000;
	height: 80px;
}
.package-item .package-price .price
{
	font-size: 30px;
	font-family: industry;
	font-weight: 800;
	color: #dd0000;
	display: inline-block;
}
.package-item .package-price .type
{
	font-size: 14px;
	font-family: industry;
	font-weight: 800;
	display: inline-block;
	color: #dd0000;
}
.package-item .package-img
{
	width: 100%;
	text-align: center;
	padding: 15px 0;
	border-top: 1px solid #ebebeb;
	border-bottom: 1px solid #ebebeb;
}
.package-select
{
	margin-top: 15px;
}
.package-select .btn
{
	display: block;
	width: 100%;
	height: 50px;
	line-height: 50px;
	background-color: #dd0000;
	border-radius: 25px;
	color: #ffffff;
	font-weight: 700;
	text-align: center;
	font-size: 16px;
	transition: all .35s ease-in-out;
}
.package-select .btn:hover
{
	background-color: #b00000;
}
.free-trial-message
{
	font-size: 14px;
	margin-top: 10px;
}
.learn-more
{
	margin-top: 10px;
	display: block;
	position: relative;
}
.learn-more .text
{
	font-size: 14px;
	font-family: industry;
	font-weight: 800;
	color: #ffffff;
}
.learn-more .arrow
{
	margin-top: 10px;
	position: relative;
}
.learn-more .arrow img
{
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -8px;
	-webkit-animation-name: runningArrow;
	animation-name: runningArrow;
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-direction: alternate;
	-webkit-animation-direction: alternate;
}
@-webkit-keyframes runningArrow
{
	from
	{
		top: 0;
	}
	to
	{
		top: 10px;
	}
}
@keyframes runningArrow
{
	from
	{
		top: 0;
	}
	to
	{
		top: 10px;
	}
}
.section.intro-info-1
{
	height: 710px;
	background: linear-gradient(to bottom, #16181b, #16181b 50%, #313238);
}
.section.intro-info-1 .section-content,
.section.intro-info-2 .section-content
{
	width: 30%;
}
.section.intro-info-1 .section-title,
.section.intro-info-2 .section-title
{
	padding-top: 220px;
	line-height: 48px;
	text-align: left;
}
.section.intro-info-1 .section-desc,
.section.intro-info-2 .section-desc
{
	margin-top: 20px;
	line-height: 30px;
	color: #a5a6a7;
	text-align: left;
}
.section.intro-info-3 .section-title
{
	color: #1d1e1f;
	padding-top: 95px;
}
.section.intro-info-3 .section-desc
{
	color: #6c6d6f;
	line-height: 30px;
	margin-top: 15px;
}
.section.intro-info-2
{
	height: 840px;
	background-color: #31323b;
}
.section.intro-info-3
{
	height: 700px;
	background-color: #ffffff;
	background-image: url(../images/landing_pic03.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}
.section.intro-info-4
{
	height: 1280px;
	background-color: #16181b;
	background-image: url(../images/landing_pic04.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
.section.intro-info-4 .section-title
{
	padding-top: 148px;
}
.section.intro-info-4 .section-desc
{
	color: #a5a6a7;
	line-height: 30px;
	margin-top: 15px;
}
.section .intro-image
{
	width: 100%;
	height: 100%;
	position: absolute;
}
.section-btns
{
	overflow: hidden;
	margin-top: 46px;
}
.section-btns .item-device
{
	margin: 0 20px;
	display: inline-block;
}
.section.intro-info-1 .intro-image
{
	background-image: url(../images/landing_pic01.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	transform: translateX(13%);
}
.section.intro-info-2 .intro-image
{
	background-image: url(../images/landing_pic02.png);
	background-repeat: no-repeat;
	background-position: center top;
	transform: translateX(-20%);
}
/* common for md, sm, xs */
@media (max-width: 1279px)
{
	.section.packages
	{
		height: 843px;
	}
	.section-title
	{
		font-size: 46px;
	}
	.section.intro-info-1 .section-content, 
	.section.intro-info-2 .section-content 
	{
		width: 38%;
	}
	.section.intro-info-1 .intro-image
	{
		transform: translateX(28%);
	}
	.section.intro-info-2 .intro-image
	{
		transform: translateX(-32%);
	}
	.packages-content .no-package
	{
		padding: 0;
	}
}
@media (max-width: 1023px)
{
	header.header
	{
		position: absolute;
	}
	.section.packages .section-title
	{
		font-size: 36px;
	}
	.section.intro-info-1 .intro-image
	{
		transform: translateX(28%);
	}
	.section.intro-info-2 .intro-image
	{
		transform: translateX(-32%);
	}
	.packages-content .package-item:first-child
	{
		margin-left: 0;
	}
	.packages-content .package-item:last-child
	{
		margin-right: 0;
	}
	.section.intro-info-1 
	{
		height: 840px;
	}
	.section.intro-info-1 .section-title
	{
		padding-top: 183px;
	}
	.section.intro-info-2
	{
		text-align: left;
	}
	.section.intro-info-2 .section-title
	{
		padding-top: 55px;
	}
	.section.intro-info-1 .section-content, 
	.section.intro-info-2 .section-content
	{
		width: 65%;
	}
	.section.intro-info-1 .intro-image 
	{
		transform: translateX(28%);
	}
	.section.intro-info-2 .intro-image 
	{
		transform: translate(-22%, 390px);
	}
	.section.intro-info-3 .section-title
	{
		padding-top: 50px;
		line-height: 46px;
	}
	.section.intro-info-3 .section-desc
	{
		font-weight: 400;
	}
	.section.intro-info-4 .section-title
	{
		padding-top: 143px;
	}
	.packages-content .no-package
	{
		font-size: 42px;
	}
}
/* only for xs */
@media (max-width: 767px)
{
	.section.packages
	{
		height: auto;
		padding-bottom: 100px;
	}
	.section-title
	{
		font-size: 36px;
		line-height: 36px;
	}
	.section.packages .section-title
	{
		font-size: 30px;
		line-height: 30px;
		margin-bottom: 17px;
	}
	.packages.section .section-desc
	{
		font-size: 14px;
		line-height: 22px;
	}
	.packages-content .package-item
	{
		margin: 0 auto;
		margin-bottom: 25px;
	}
	.section.intro-info-1 .section-title
	{
		padding-top: 35px;
	}
	.section.intro-info-1
	{
		height: 640px;
	}
	.section.intro-info-2
	{
		height: 760px;
	}
	.section.intro-info-2 .intro-image
	{
		transform: translate(-22%, 55px);
		background-position: center bottom;
	}
	.section.intro-info-1 .section-title, 
	.section.intro-info-2 .section-title,
	.section.intro-info-3 .section-title
	{
		font-size: 36px;
		line-height: 36px;
	}
	.section.intro-info-1 .section-content, 
	.section.intro-info-2 .section-content
	{
		width: 100%;
	}
	.section.intro-info-1 .intro-image,
	.section.intro-info-2 .intro-image
	{
		background-size: 100%;
	}
	.section.intro-info-3
	{
		height: 760px;
	}
	.section.intro-info-4 .section-title
	{
		padding-top: 50px;
	}
	.section.intro-info-4 .section-desc
	{
		margin-top: 25px;
	}
	.section-btns .item-device
	{
		margin-bottom: 30px;
	}
	.section.intro-info-4
	{
		height: 1050px;
		background-position: center top;
	}
	.packages-content .no-package
	{
		font-size: 24px;
		padding-bottom: 10px;
	}
}
@media (max-width: 484px)
{
	.section-btns .item-device
	{
		margin: 0 5px;
		margin-bottom: 20px;
	}
	.section.intro-info-1 .intro-image,
	.section.intro-info-2 .intro-image
	{
		background-size: 130%;
		transform: none;
	}
	.packages-content .package-item
	{
		width: 100%;
	}
	.packages-content .no-package
	{
		font-size: 20px;
	}
}