html, body {
  margin: 0;
  padding: 0;
}

body, input, textarea, button {
  font-family: inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 14px;
  color: #535353;
}

a {
  color: #000000;
  text-decoration: none;
}

/*Header*/
header {
  padding: 15px 50px;
  display: flex;
  align-items: center;
}

  .header-left {
    display: flex;
    align-items: center;
    -webkit-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
  }
  
    .header-brand {
      font-size: 30px;
      font-weight: 300;
      color: #1D1D33;
      margin: 0px;
      font-family: monospace;
    }

  .header-right {
    margin: 0px 0px 0px auto;
    display: flex;
    align-items: center;
    gap: 30px;
  }

    .header-logo {
      height: 21px;
      border: 1px solid dimgray;
      border-radius: 10px;
      padding: 8px;
    }

/*Main*/
main {
  min-height: 88vh;
  padding: 30px 25vw 20px;
}
  
  .title {
    font-size: 42px;
    padding: 10vh 0px;
    font-family: monospace;
  }

  .main-icon {
    font-size: 60px;
    padding: 10px 0px;
  }

  main h2 {
    font-size: 30px;
    margin: 30px 0px;
  }

  main b {
    display: block;
    margin: 35px 0px 20px;
    font-size: 21px;
  }

  main p {
    font-size: 17px;
    line-height: 24px;
  }

  main img {
    display: block;
    width: 80%;
    margin: 25px auto;
    border: 3px;
  }

  .main-cn p {
    font-size: 16px;
  }


/*Footer*/
footer {
  padding: 15px 0;
  width: 100%;
  text-align: center;
  font-size: 14px;
}

@media only screen and (max-width: 600px) {
  header {
    padding: 15px 20px;
  }

    .header-brand {
      font-size: 24px;
    }

    .header-logo {
      height: 16px;
      border-radius: 6px;
      padding: 4px;
    }

  main {
    padding: 10px 20px;
  }
}