*, *::after, *::before { -webkit-box-sizing: border-box; box-sizing: border-box; }
html,body{width: 100%; height: 100%;}
body {
	font-family: 'Roboto','Helvetica Neue', Helvetica,'微软雅黑',Microsoft YaHei, 'Segoe UI', Arial, sans-serif;
	color: #fff;
	background: #1A2542;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin:0;
	font-size: 16px;
}
.container a {
	outline: none;
	color: #fff;
	text-decoration: none;
	transition: color 0.2s;
}
.container ul, .container li{
	list-style: none;
	padding: 0;
	margin: 0;
}
.container a:hover, .container a:focus {
	color: #fff;
	text-decoration: none;
}
.container{
	position: relative;
	width: 100%;
	height: 100%;
	margin:150px auto;
	padding: 0px;
}
.parallaxTilt_hover{
	position: absolute;
	width: 400px;
	height: 400px;
	left: calc(50% - 200px);
	top: calc(50% - 200px);
}
.tilter_figure{
	position: relative;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
.tilter_image, .tilter_deco, .tilter_caption{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: .5s ease-out;
    transform: translate3d(0,0,0);
}
.tilter_deco{
    background-color: rgba(40,150,200,0.3);
}
.tilter_figure .tilter_title {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 6em;
    position: absolute;
    left: -105px;
    bottom: 60px;
}
.tilter_figure .tilter_tag {
    display: inline-block;
    padding: 12px 12px 12px 0;
    margin: 0;
    position: absolute;
    left: -100px;
    bottom: 12px;
    text-align: left;
    border-top: 2px solid #FB0033;
}
.tilter_figure .tilter_tag span {
    font-size: 1em;
    font-weight: bold;
}
@media (max-width: 480px){
	.parallaxTilt_hover{
		width: 200px;
		height: 200px;
		left: calc(50% - 100px);
		top: calc(50% - 100px);
	}
	.tilter_figure .tilter_title {
	    font-size: 3em;
	    left: -40px;
	    top: 70px;
	}
	.tilter_figure .tilter_tag {
	    left: -40px;
	    bottom: 12px;
	}
}