html{
  font-size: 62.5%;
}

body {
  
  padding: 2rem;
  line-height: 2rem;
}

h1 {
  margin-top: 4rem;
  margin-bottom: 2rem;
  line-height: 4rem;
  /*font-size: 4.235801032rem;*/
  font-size: 2.4rem;
}

h2 {
  margin-top: 2rem;
  margin-bottom: 2rem;
  line-height: 4rem;
  /*font-size: 2.617924rem;*/
  font-size: 1.8rem;
}

h3 {
  margin-top: 2rem;
  margin-bottom: 2rem;
  line-height: 2rem;
  /*font-size: 1.618rem;*/
  font-size: 1.6rem;
}

.container{
  width: 90%;
  margin:0 auto;
}

p {

  margin-top: 2rem;
  margin-bottom: 2rem;
  line-height: 2rem;
  letter-spacing: 0.2rem;
  font-size: 1.8rem;
  font-family: 'Long Cang', cursive;
  color: #888;
}

p.yinyong{
    margin: 0 auto;
    width: 80%;
    color: #ee3f4d;
    font-style: italic;
}

p.blue{
  color: #22a2c3;
  font-style: italic;
}

.grid {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.grid .line {
  box-shadow: 0 1px 0 #eee;
  line-height: 2rem;
  font-size: 1rem;
}

.garter {
  box-shadow: 0 1px 0 #ffaaaa, inset 0 1px 0 #ffaaaa;
}

/*@media only screen and (max-width: 500px) {
    p {
        font-size: :1rem;
    }

}
@media only screen and (min-width: 501px) {
    p {
        font-size: :1.5rem;
    }

}*/