/*    CSS Reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: 200;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

/* STYLES */


  body {
    font-size: 1rem;
    font-family: "Roboto", Helvetica, sans-serif;
    font-weight: 300;
  }

  main {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center;
  }

  main > div {
    height: 100vh;
    flex-grow: 1;
    flex-basis: 50%;
    display: flex;
    align-items: center;
    text-align: center;
  }

  section {
    margin: 0 auto;
/*    width: 450px;
    height: 450px;
    padding: 100px;
    background-color: none;
    border-radius: 100%;
    mix-blend-mode: none;
*/
  }

  .left {
    background-color: #000;
  }

  .right {
    background-color: #fff;
  }