Contenido fijo de fondo completo en CSS3

En este Tutoriales En Linea les traemos este truco de efecto que permite efectos visuales en estructura y diseño en contenido fijo de fondo completo - full background fixed content en CSS3.
Establezca el relleno izquierdo y derecho del elemento al 50% del ancho del elemento padre menos la mitad del contenido del ancho igual. No es necesario establecer el ancho ~

<style>
  main{
    width: 100%;
  }
  h2.title {
    color: white;
    margin-top: 1em;
    margin-bottom: 1em;
  }
  header{
    background: #7890b4;
    color: white;
  }
  footer{
    background: rgba(180,160,120,.05);
  }
  .main > header,
  .main > section,
  .main > footer{
      padding: .1em calc(50% - 329px);
      text-align: justify;
      hyphens: auto;
  }
</style>

  <main class="main">
    <header>
      <h2 class="title">Trucos y efecto en CSS3 - Tutoriales En Linea</h2>
    </header>
    <section>
      <p>Tutoriales En Linea es un portal web de tutoriales, cursos, manuales, trucos, tips, novedades, video tutoriales, formas de ganar dinero online, entretenimiento y demás. También es un sistemas instructivos de autoaprendizaje que pretenden simular al maestro y muestran al usuario el desarrollo de algún procedimiento o los pasos para realizar determinada actividad...</p>
    </section>
    <footer>
      <p>&copy; 2019 TL</p>
      <p>Trucos de CSS3 que necesita saber para el desarrollador web.</p>
    </footer>
 </main>

Ver resultado