Inconsistencies using emotion with media functions

[Brettm12345]

🐛 Bug Report

When using the included media query utilities the css template literal did not work when using @xstyled/emotion for example

  ${up(
    'md',
    css`
      height: 300px;
    `,
  )}

shown here in the docs would result in a style tag to be placed on the media query. I believe this is because the breakpoint function doesn't reduce the second property to an object take a look here. I've attempted to circumvent this by creating
theme/media.js
which allows me to do

const Wrapper = styled(Box)`
  ${up('sm')} {
    position: relative;
    flex-wrap: nowrap;
    height: 200px;
    margin-bottom: 5;
    background: white;
    border-color: transparent;
    box-shadow: 25;
  }
  &:last-of-type {
    ${up('sm')} {
      div {
        background-color: backgroundDark;
      }
    }
  }

To Reproduce

Use a css template literal as a value to any export from breakpoints.js

Expected behavior

The functions should handle the css template literal

## System:
 - OS: Linux 5.1 Arch Linux undefined
 - CPU: (8) x64 AMD Ryzen 5 1500X Quad-Core Processor
 - Memory: 1.14 GB / 15.68 GB
 - Container: Yes
 - Shell: 3.0.2 - /usr/bin/fish
## Binaries:
 - Node: 11.15.0 - /usr/bin/node
 - Yarn: 1.16.0 - /usr/bin/yarn
 - npm: 6.9.0 - /usr/bin/npm
## npmPackages:
 - @xstyled/system: ^1.5.0 => 1.5.0