IntersectionObserver is undefined in IE11

[stanleyowen]

Describe the bug
While trying to run Otlio through Internet Explorer 11 (IE11), it returns a blank page and the following error message in the console:

ReferenceError: 'IntersectionObserver' is undefined
   {
      [functions]: ,
      __proto__: { },
      description: "'IntersectionObserver' is undefined",
      message: "'IntersectionObserver' is undefined",
      name: "ReferenceError",
      number: -2146823279,
      stack: "ReferenceError: 'IntersectionObserver' is undefined
   at Anonymous function (https://otlio.netlify.app/static/js/main.2f74290b.chunk.js:1:5866)
   at Ic (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:586500)
   at t.unstable_runWithPriority (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:604316)
   at Vo (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:526666)
   at Ac (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:585958)
   at vc (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:577425)
   at Anonymous function (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:526902)
   at t.unstable_runWithPriority (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:604316)
   at Vo (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:526666)
   at Go (https://otlio.netlify.app/static/js/2.265c67cc.chunk.js:2:526849)",
      Symbol()_6.ro429zq54n5: undefined,
      Symbol()_k.ro429zq54qe: undefined,
      Symbol(mui.nested)_18.ro429zq54d: undefined,
      Symbol(react.async_mode)_14.ro429zq54d: undefined,
      Symbol(react.block)_y.ro429zq54de: undefined,
      Symbol(react.concurrent_mode)_15.ro429zq54d: undefined,
      Symbol(react.context)_s.ro429zq54qe: undefined,
      Symbol(react.debug_trace_mode)_11.ro429zq54d: undefined,
      Symbol(react.element)_m.ro429zq54qe: undefined,
      Symbol(react.forward_ref)_t.ro429zq54qe: undefined,
      Symbol(react.fragment)_o.ro429zq54qe: undefined,
      Symbol(react.fundamental)_16.ro429zq54d: undefined,
      Symbol(react.lazy)_w.ro429zq54de: undefined,
      Symbol(react.legacy_hidden)_13.ro429zq54d: undefined,
      Symbol(react.memo)_v.ro429zq54qe: undefined,
      Symbol(react.offscreen)_12.ro429zq54d: undefined,
      Symbol(react.opaque.id)_10.ro429zq54d: undefined,
      Symbol(react.portal)_n.ro429zq54qe: undefined,
      Symbol(react.profiler)_q.ro429zq54qe: undefined,
      Symbol(react.provider)_r.ro429zq54qe: undefined,
      Symbol(react.responder)_17.ro429zq54d: undefined,
      Symbol(react.scope)_z.ro429zq54de: undefined,
      Symbol(react.server.block)_19.ro429zq54d: undefined,
      Symbol(react.strict_mode)_p.ro429zq54qe: undefined,
      Symbol(react.suspense)_u.ro429zq54qe: undefined,
      Symbol(react.suspense_list)_x.ro429zq54de: undefined
   }
SCRIPT5009: 'IntersectionObserver' is undefined
2.265c67cc.chunk.js (2,526947)

To Reproduce
Steps to reproduce the behavior:

1. Open Internet Explorer
2. Visit https://otlio,netlify.app
3. Open Developer Tools > Console
4. See error

Expected behavior
No error occurred and return home page instead of blank page.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10 OS Version 2009 (Build 19043.1055)
• Browser Chrome
• Version 91.0.4472.106

[stanleyowen]

This issue will be part of #198 accomplishment as it is related to IE11.