/* Extra small devices (phones, 575px and down) */
@media only screen and (max-width: 575px) {
  html { font-size: 10px }
  .mobile { display: block }
  .reg { display: none }

  h1 { font-size: 2.5rem }
  h2, h3, h4, h6, p, li a, .about-title, .happens { font-size: 1.5rem }
  h5, .smiles, .values { font-size: 2rem }
  .wp-block-button__link { font-size: 1.4rem; padding: .7rem 1.875rem .5rem }

  .wp-block-group { padding: 0 10% }
}

/* Small devices (portrait tablets and large phones, 576px and up) */
@media only screen and (min-width: 576px) {
  html { font-size: 11px }
  .mobile { display: none }
  .reg { display: block }

  h1, .happens { font-size: 2rem }
  .about-title, .values { font-size: 1.5rem }
  h2, h5 { font-size: 1.25rem }
  h3, p  { font-size: 1.25rem }
  h4, h6, li a { font-size: 1rem }
  .smiles { font-size: 2.25rem }
  .wp-block-button__link { font-size: .9rem; padding: .7rem 1.3rem .5rem }

  .wp-block-group { padding: 0 10% }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  html { font-size: 12px }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  html { font-size: 13px }
}

 /* Extra large devices */
@media only screen and (min-width: 1200px) {
  html { font-size: 14px }
}

/* Extra EXTRA Large devices */
@media only screen and (min-width: 1640px) {
  html { font-size: 16px }
}