* {
    margin: 0;
    padding: 0;
}

body {
    background-color: #333;
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}

section {
    position: relative;
    width: 38rem;
    height: 38rem;
    margin: 3rem auto 0;
    background: url(background.png) no-repeat;
    background-size: cover;
    font: bold 1.6rem simkai, KaiTi, '楷体', '楷体_GB2312', STKaiti, '微软雅黑';
    color: #a81821;
    border-radius: 1.5rem;
    -webkit-box-shadow: -2px 2px 6px 1px rgb(229, 216, 201, .5);
    box-shadow: -2px 2px 6px 1px rgb(229, 216, 201, .5);
    -webkit-text-shadow: -2px 2px 1px rgba(0, 0, 0, .25);
    text-shadow: -2px 2px 1px rgba(0, 0, 0, .25);
    -webkit-overflow: hidden;
    overflow: hidden;
}

section::before {
    content: '';
    display: inline-block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: url(Heather.png) no-repeat;
    background-size: cover;
    -webkit-mix-blend-mode: multiply;
    mix-blend-mode: multiply;
    z-index: 2;
}


section h1 {
    display: block;
    position: relative;
    height: 1.8em;
    padding-top: 4rem;
    white-space: nowrap;
}

section h1 span {
    display: inline-block;
    position: absolute;
    width: 42%;
}

section h1 span:nth-child(1) {
    left: 0;
    text-align: right;
}
section h1 span:nth-child(2) {
    left: 30%;
    text-align: center;
}
section h1 span:nth-child(3) {
    right: 0;
    text-align: left;
}

section div {
    position: absolute;
    bottom: 3rem;
    width: 100%;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
}

section div h1{
			text-align: center; 
			color: rgba(255, 255, 255, 0);
			position: relative;
		}
.fm{
  position: absolute;
    left: calc(33%);
opacity:0;
  margin-top:1.2em;
  color:#fff;
  line-height: 1.4;
  text-align: center;
  /* 实现文字动起来的效果 */
  animation:  am 6s 1 forwards;
  transition:all 0.01s ease-out;
}
		@keyframes am{
			0%{
				opacity:0;
			}
			100%{
				opacity:1;
			}
		}
section div h2,
section div h3 {
    background-image: -o-linear-gradient(top, #c0131f, #bd0000);
    background-image: -moz-linear-gradient(top, #c0131f, #bd0000);
    background-image: -webkit-linear-gradient(top, #c0131f, #bd0000);
    background-image: linear-gradient(top, #c0131f, #bd0000);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

strong{
font-size: xxx-large;
font-size: -webkit-xxx-large;
color:rgba(255,215,0,0.75);
}

::selection {
    background: #c0131f;
    color: #fff;
}

:-webkit-selection {
    background: #c0131f;
    color: #fff;
}

::-moz-selection {
    background: #c0131f;
    color: #fff;
}