/* Document
   ========================================================================== */

* {
  box-sizing: border-box;
}

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  -webkit-text-decoration: underline;
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}

/**
 * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
 * A thin layer on top of normalize.css that provides a starting point more
 * suitable for web applications.
 */

/**
 * Removes the default spacing and border for appropriate elements.
 */

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

button {
  background-color: transparent;
  background-image: none;
  padding: 0;
}

/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}

fieldset {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/**
 * Tailwind custom reset styles
 */

/**
 * 1. Use the user's configured `sans` font-family (with Tailwind's default
 *    sans-serif font stack as a fallback) as a sane default.
 * 2. Use Tailwind's default "normal" line-height so the user isn't forced
 *    to override it to ensure consistency even when using the default theme.
 */

html {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 1 */
  line-height: 1.5; /* 2 */
}

/**
 * 1. Prevent padding and border from affecting element width.
 *
 *    We used to set this in the html element and inherit from
 *    the parent element for everything else. This caused issues
 *    in shadow-dom-enhanced elements like <details> where the content
 *    is wrapped by a div with box-sizing set to `content-box`.
 *
 *    https://github.com/mozdevs/cssremedy/issues/4
 *
 *
 * 2. Allow adding a border to an element by just adding a border-width.
 *
 *    By default, the way the browser specifies that an element should have no
 *    border is by setting it's border-style to `none` in the user-agent
 *    stylesheet.
 *
 *    In order to easily add borders to elements by just setting the `border-width`
 *    property, we change the default border-style for all elements to `solid`, and
 *    use border-width to hide them instead. This way our `border` utilities only
 *    need to set the `border-width` property instead of the entire `border`
 *    shorthand, making our border utilities much more straightforward to compose.
 *
 *    https://github.com/tailwindcss/tailwindcss/pull/116
 */

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e2e8f0; /* 2 */
}

/*
 * Ensure horizontal rules are visible by default
 */

hr {
  border-top-width: 1px;
}

/**
 * Undo the `border-style: none` reset that Normalize applies to images so that
 * our `border-{width}` utilities have the expected effect.
 *
 * The Normalize reset is unnecessary for us since we default the border-width
 * to 0 on all elements.
 *
 * https://github.com/tailwindcss/tailwindcss/issues/362
 */

img {
  border-style: solid;
}

textarea {
  resize: vertical;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #a0aec0;
}

input::placeholder,
textarea::placeholder {
  color: #a0aec0;
}

button,
[role="button"] {
  cursor: pointer;
}

table {
  border-collapse: collapse;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/**
 * Reset links to optimize for opt-in styling instead of
 * opt-out.
 */

a {
  color: inherit;
  text-decoration: inherit;
}

/**
 * Reset form element properties that are easy to forget to
 * style explicitly so you don't inadvertently introduce
 * styles that deviate from your design system. These styles
 * supplement a partial reset that is already applied by
 * normalize.css.
 */

button,
input,
optgroup,
select,
textarea {
  padding: 0;
  line-height: inherit;
  color: inherit;
}

/**
 * Use the configured 'mono' font family for elements that
 * are expected to be rendered with a monospace font, falling
 * back to the system monospace stack if there is no configured
 * 'mono' font family.
 */

pre,
code,
kbd,
samp {
  font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/**
 * Make replaced elements `display: block` by default as that's
 * the behavior you want almost all of the time. Inspired by
 * CSS Remedy, with `svg` added as well.
 *
 * https://github.com/mozdevs/cssremedy/issues/14
 */

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  vertical-align: middle;
}

/**
 * Constrain images and videos to the parent width and preserve
 * their instrinsic aspect ratio.
 *
 * https://github.com/mozdevs/cssremedy/issues/14
 */

img,
video {
  max-width: 100%;
  height: auto;
}

*{color:rgba(0,0,0,.87)}

*:focus{outline:none}

main{align-items:center;display:flex;flex-direction:column;width:100%}

section#cta{align-items:center;display:flex;flex-direction:column;padding:128px 0;padding:8rem 0;position:relative}

section#cta h2{font-family:"Source Serif Pro",serif;font-size:52px;font-size:3.25rem;font-weight:600;margin:0 0 10px}

section#cta p{color:rgba(0,0,0,.6);font-size:20px;font-size:1.25rem;margin-bottom:40px;max-width:704px;max-width:44rem;text-align:center}

section#cta a[role=button]{background-image:linear-gradient(0deg, #4277ce, rgb(126.75, 162.7142857143, 221.75));border-radius:.125rem;color:#fff;font-weight:500;padding:15px 40px;transition:all .2s;z-index:1}

section#cta a[role=button]:hover{background-image:linear-gradient(0deg, rgb(40.25, 83.7857142857, 155.25), #4277ce)}

section#cta a[role=link]{color:rgba(0,0,0,.6);padding-top:10px;transition:color .2s}

section#cta a[role=link]:hover{color:rgba(0,0,0,.87)}

section#cta img{position:absolute;width:50%}

section#cta img.bottom{bottom:0;left:0}

section#cta img.top{right:0;top:0}

@media(max-width: 900px){section#cta{padding:4rem 1.5rem}section#cta h2{font-size:30px}section#cta p{font-size:16px;max-width:550px}}

.marvel-device{display:inline-block;position:relative;box-sizing:content-box !important}

.marvel-device .screen{width:100%;position:relative;height:100%;z-index:3;background:#fff;overflow:hidden;display:block;border-radius:1px;box-shadow:0 0 0 3px #111}

.marvel-device .top-bar,.marvel-device .bottom-bar{height:3px;background:#000;width:100%;display:block}

.marvel-device .middle-bar{width:3px;height:4px;top:0px;left:90px;background:#000;position:absolute}

.marvel-device.iphone8{width:375px;height:667px;padding:105px 24px;background:#d9dbdc;border-radius:56px;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.2)}

.marvel-device.iphone8:before{width:calc(100% - 12px);height:calc(100% - 12px);position:absolute;top:6px;content:"";left:6px;border-radius:50px;background:#f8f8f8;z-index:1}

.marvel-device.iphone8:after{width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;top:8px;content:"";left:8px;border-radius:48px;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.1),inset 0 0 6px 3px #fff;z-index:2}

.marvel-device.iphone8 .home{border-radius:100%;width:68px;height:68px;position:absolute;left:50%;margin-left:-34px;bottom:22px;z-index:3;background:#303233;background:linear-gradient(135deg, rgb(48, 50, 51) 0%, rgb(181, 183, 185) 50%, rgb(240, 242, 242) 69%, rgb(48, 50, 51) 100%)}

.marvel-device.iphone8 .home:before{background:#f8f8f8;position:absolute;content:"";border-radius:100%;width:calc(100% - 8px);height:calc(100% - 8px);top:4px;left:4px}

.marvel-device.iphone8 .top-bar{height:14px;background:#bfbfc0;position:absolute;top:68px;left:0}

.marvel-device.iphone8 .bottom-bar{height:14px;background:#bfbfc0;position:absolute;bottom:68px;left:0}

.marvel-device.iphone8 .sleep{position:absolute;top:190px;right:-4px;width:4px;height:66px;border-radius:0px 2px 2px 0px;background:#d9dbdc}

.marvel-device.iphone8 .volume{position:absolute;left:-4px;top:188px;z-index:0;height:66px;width:4px;border-radius:2px 0px 0px 2px;background:#d9dbdc}

.marvel-device.iphone8 .volume:before{position:absolute;left:2px;top:-78px;height:40px;width:2px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone8 .volume:after{position:absolute;left:0px;top:82px;height:66px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone8 .camera{background:#3c3d3d;width:12px;height:12px;position:absolute;top:24px;left:50%;margin-left:-6px;border-radius:100%;z-index:3}

.marvel-device.iphone8 .sensor{background:#3c3d3d;width:16px;height:16px;position:absolute;top:49px;left:134px;z-index:3;border-radius:100%}

.marvel-device.iphone8 .speaker{background:#292728;width:70px;height:6px;position:absolute;top:54px;left:50%;margin-left:-35px;border-radius:6px;z-index:3}

.marvel-device.iphone8.gold{background:#f9e7d3}

.marvel-device.iphone8.gold .top-bar,.marvel-device.iphone8.gold .bottom-bar{background:#fff}

.marvel-device.iphone8.gold .sleep,.marvel-device.iphone8.gold .volume{background:#f9e7d3}

.marvel-device.iphone8.gold .home{background:#cebba9;background:linear-gradient(135deg, rgb(206, 187, 169) 0%, rgb(249, 231, 211) 50%, rgb(206, 187, 169) 100%)}

.marvel-device.iphone8.black{background:#464646;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.7)}

.marvel-device.iphone8.black:before{background:#080808}

.marvel-device.iphone8.black:after{box-shadow:inset 0 0 3px 0 rgba(0,0,0,.1),inset 0 0 6px 3px #212121}

.marvel-device.iphone8.black .top-bar,.marvel-device.iphone8.black .bottom-bar{background:#212121}

.marvel-device.iphone8.black .volume,.marvel-device.iphone8.black .sleep{background:#464646}

.marvel-device.iphone8.black .camera{background:#080808}

.marvel-device.iphone8.black .home{background:#080808;background:linear-gradient(135deg, rgb(8, 8, 8) 0%, rgb(70, 70, 70) 50%, rgb(8, 8, 8) 100%)}

.marvel-device.iphone8.black .home:before{background:#080808}

.marvel-device.iphone8.landscape{padding:24px 105px;height:375px;width:667px}

.marvel-device.iphone8.landscape .sleep{top:100%;border-radius:0px 0px 2px 2px;right:190px;height:4px;width:66px}

.marvel-device.iphone8.landscape .volume{width:66px;height:4px;top:-4px;left:calc(100% - 188px - 66px);border-radius:2px 2px 0px 0px}

.marvel-device.iphone8.landscape .volume:before{width:40px;height:2px;top:2px;right:-78px;left:auto;border-radius:2px 2px 0px 0px}

.marvel-device.iphone8.landscape .volume:after{left:-82px;width:66px;height:4px;top:0;border-radius:2px 2px 0px 0px}

.marvel-device.iphone8.landscape .top-bar{width:14px;height:100%;left:calc(100% - 68px - 14px);top:0}

.marvel-device.iphone8.landscape .bottom-bar{width:14px;height:100%;left:68px;top:0}

.marvel-device.iphone8.landscape .home{top:50%;margin-top:-34px;margin-left:0;left:22px}

.marvel-device.iphone8.landscape .sensor{top:134px;left:calc(100% - 49px - 16px)}

.marvel-device.iphone8.landscape .speaker{height:70px;width:6px;left:calc(100% - 54px - 6px);top:50%;margin-left:0px;margin-top:-35px}

.marvel-device.iphone8.landscape .camera{left:calc(100% - 32px);top:50%;margin-left:0px;margin-top:-5px}

.marvel-device.iphone8plus{width:414px;height:736px;padding:112px 26px;background:#d9dbdc;border-radius:56px;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.2)}

.marvel-device.iphone8plus:before{width:calc(100% - 12px);height:calc(100% - 12px);position:absolute;top:6px;content:"";left:6px;border-radius:50px;background:#f8f8f8;z-index:1}

.marvel-device.iphone8plus:after{width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;top:8px;content:"";left:8px;border-radius:48px;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.1),inset 0 0 6px 3px #fff;z-index:2}

.marvel-device.iphone8plus .home{border-radius:100%;width:68px;height:68px;position:absolute;left:50%;margin-left:-34px;bottom:24px;z-index:3;background:#303233;background:linear-gradient(135deg, rgb(48, 50, 51) 0%, rgb(181, 183, 185) 50%, rgb(240, 242, 242) 69%, rgb(48, 50, 51) 100%)}

.marvel-device.iphone8plus .home:before{background:#f8f8f8;position:absolute;content:"";border-radius:100%;width:calc(100% - 8px);height:calc(100% - 8px);top:4px;left:4px}

.marvel-device.iphone8plus .top-bar{height:14px;background:#bfbfc0;position:absolute;top:68px;left:0}

.marvel-device.iphone8plus .bottom-bar{height:14px;background:#bfbfc0;position:absolute;bottom:68px;left:0}

.marvel-device.iphone8plus .sleep{position:absolute;top:190px;right:-4px;width:4px;height:66px;border-radius:0px 2px 2px 0px;background:#d9dbdc}

.marvel-device.iphone8plus .volume{position:absolute;left:-4px;top:188px;z-index:0;height:66px;width:4px;border-radius:2px 0px 0px 2px;background:#d9dbdc}

.marvel-device.iphone8plus .volume:before{position:absolute;left:2px;top:-78px;height:40px;width:2px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone8plus .volume:after{position:absolute;left:0px;top:82px;height:66px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone8plus .camera{background:#3c3d3d;width:12px;height:12px;position:absolute;top:29px;left:50%;margin-left:-6px;border-radius:100%;z-index:3}

.marvel-device.iphone8plus .sensor{background:#3c3d3d;width:16px;height:16px;position:absolute;top:54px;left:154px;z-index:3;border-radius:100%}

.marvel-device.iphone8plus .speaker{background:#292728;width:70px;height:6px;position:absolute;top:59px;left:50%;margin-left:-35px;border-radius:6px;z-index:3}

.marvel-device.iphone8plus.gold{background:#f9e7d3}

.marvel-device.iphone8plus.gold .top-bar,.marvel-device.iphone8plus.gold .bottom-bar{background:#fff}

.marvel-device.iphone8plus.gold .sleep,.marvel-device.iphone8plus.gold .volume{background:#f9e7d3}

.marvel-device.iphone8plus.gold .home{background:#cebba9;background:linear-gradient(135deg, rgb(206, 187, 169) 0%, rgb(249, 231, 211) 50%, rgb(206, 187, 169) 100%)}

.marvel-device.iphone8plus.black{background:#464646;box-shadow:inset 0 0 3px 0 rgba(0,0,0,.7)}

.marvel-device.iphone8plus.black:before{background:#080808}

.marvel-device.iphone8plus.black:after{box-shadow:inset 0 0 3px 0 rgba(0,0,0,.1),inset 0 0 6px 3px #212121}

.marvel-device.iphone8plus.black .top-bar,.marvel-device.iphone8plus.black .bottom-bar{background:#212121}

.marvel-device.iphone8plus.black .volume,.marvel-device.iphone8plus.black .sleep{background:#464646}

.marvel-device.iphone8plus.black .camera{background:#080808}

.marvel-device.iphone8plus.black .home{background:#080808;background:linear-gradient(135deg, rgb(8, 8, 8) 0%, rgb(70, 70, 70) 50%, rgb(8, 8, 8) 100%)}

.marvel-device.iphone8plus.black .home:before{background:#080808}

.marvel-device.iphone8plus.landscape{padding:26px 112px;height:414px;width:736px}

.marvel-device.iphone8plus.landscape .sleep{top:100%;border-radius:0px 0px 2px 2px;right:190px;height:4px;width:66px}

.marvel-device.iphone8plus.landscape .volume{width:66px;height:4px;top:-4px;left:calc(100% - 188px - 66px);border-radius:2px 2px 0px 0px}

.marvel-device.iphone8plus.landscape .volume:before{width:40px;height:2px;top:2px;right:-78px;left:auto;border-radius:2px 2px 0px 0px}

.marvel-device.iphone8plus.landscape .volume:after{left:-82px;width:66px;height:4px;top:0;border-radius:2px 2px 0px 0px}

.marvel-device.iphone8plus.landscape .top-bar{width:14px;height:100%;left:calc(100% - 68px - 14px);top:0}

.marvel-device.iphone8plus.landscape .bottom-bar{width:14px;height:100%;left:68px;top:0}

.marvel-device.iphone8plus.landscape .home{top:50%;margin-top:-34px;margin-left:0;left:24px}

.marvel-device.iphone8plus.landscape .sensor{top:154px;left:calc(100% - 54px - 16px)}

.marvel-device.iphone8plus.landscape .speaker{height:70px;width:6px;left:calc(100% - 59px - 6px);top:50%;margin-left:0px;margin-top:-35px}

.marvel-device.iphone8plus.landscape .camera{left:calc(100% - 29px);top:50%;margin-left:0px;margin-top:-5px}

.marvel-device.iphone5s,.marvel-device.iphone5c{padding:105px 22px;background:#2c2b2c;width:320px;height:568px;border-radius:50px}

.marvel-device.iphone5s:before,.marvel-device.iphone5c:before{width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;content:"";left:4px;border-radius:46px;background:#1e1e1e;z-index:1}

.marvel-device.iphone5s .sleep,.marvel-device.iphone5c .sleep{position:absolute;top:-4px;right:60px;width:60px;height:4px;border-radius:2px 2px 0px 0px;background:#282727}

.marvel-device.iphone5s .volume,.marvel-device.iphone5c .volume{position:absolute;left:-4px;top:180px;z-index:0;height:27px;width:4px;border-radius:2px 0px 0px 2px;background:#282727}

.marvel-device.iphone5s .volume:before,.marvel-device.iphone5c .volume:before{position:absolute;left:0px;top:-75px;height:35px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone5s .volume:after,.marvel-device.iphone5c .volume:after{position:absolute;left:0px;bottom:-64px;height:27px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone5s .camera,.marvel-device.iphone5c .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:32px;left:50%;margin-left:-5px;border-radius:5px;z-index:3}

.marvel-device.iphone5s .sensor,.marvel-device.iphone5c .sensor{background:#3c3d3d;width:10px;height:10px;position:absolute;top:60px;left:160px;z-index:3;margin-left:-32px;border-radius:5px}

.marvel-device.iphone5s .speaker,.marvel-device.iphone5c .speaker{background:#292728;width:64px;height:10px;position:absolute;top:60px;left:50%;margin-left:-32px;border-radius:5px;z-index:3}

.marvel-device.iphone5s.landscape,.marvel-device.iphone5c.landscape{padding:22px 105px;height:320px;width:568px}

.marvel-device.iphone5s.landscape .sleep,.marvel-device.iphone5c.landscape .sleep{right:-4px;top:calc(100% - 120px);height:60px;width:4px;border-radius:0px 2px 2px 0px}

.marvel-device.iphone5s.landscape .volume,.marvel-device.iphone5c.landscape .volume{width:27px;height:4px;top:-4px;left:calc(100% - 180px);border-radius:2px 2px 0px 0px}

.marvel-device.iphone5s.landscape .volume:before,.marvel-device.iphone5c.landscape .volume:before{width:35px;height:4px;top:0px;right:-75px;left:auto;border-radius:2px 2px 0px 0px}

.marvel-device.iphone5s.landscape .volume:after,.marvel-device.iphone5c.landscape .volume:after{bottom:0px;left:-64px;z-index:999;height:4px;width:27px;border-radius:2px 2px 0px 0px}

.marvel-device.iphone5s.landscape .sensor,.marvel-device.iphone5c.landscape .sensor{top:160px;left:calc(100% - 60px);margin-left:0px;margin-top:-32px}

.marvel-device.iphone5s.landscape .speaker,.marvel-device.iphone5c.landscape .speaker{height:64px;width:10px;left:calc(100% - 60px);top:50%;margin-left:0px;margin-top:-32px}

.marvel-device.iphone5s.landscape .camera,.marvel-device.iphone5c.landscape .camera{left:calc(100% - 32px);top:50%;margin-left:0px;margin-top:-5px}

.marvel-device.iphone5s .home{border-radius:36px;width:68px;box-shadow:inset 0 0 0 4px #2c2b2c;height:68px;position:absolute;left:50%;margin-left:-34px;bottom:19px;z-index:3}

.marvel-device.iphone5s .top-bar{top:70px;position:absolute;left:0}

.marvel-device.iphone5s .bottom-bar{bottom:70px;position:absolute;left:0}

.marvel-device.iphone5s.landscape .home{left:19px;bottom:50%;margin-bottom:-34px;margin-left:0px}

.marvel-device.iphone5s.landscape .top-bar{left:70px;top:0px;width:3px;height:100%}

.marvel-device.iphone5s.landscape .bottom-bar{right:70px;left:auto;bottom:0px;width:3px;height:100%}

.marvel-device.iphone5s.silver{background:#bcbcbc}

.marvel-device.iphone5s.silver:before{background:#fcfcfc}

.marvel-device.iphone5s.silver .volume,.marvel-device.iphone5s.silver .sleep{background:#d6d6d6}

.marvel-device.iphone5s.silver .top-bar,.marvel-device.iphone5s.silver .bottom-bar{background:#eaebec}

.marvel-device.iphone5s.silver .home{box-shadow:inset 0 0 0 4px #bcbcbc}

.marvel-device.iphone5s.gold{background:#f9e7d3}

.marvel-device.iphone5s.gold:before{background:#fcfcfc}

.marvel-device.iphone5s.gold .volume,.marvel-device.iphone5s.gold .sleep{background:#f9e7d3}

.marvel-device.iphone5s.gold .top-bar,.marvel-device.iphone5s.gold .bottom-bar{background:#fff}

.marvel-device.iphone5s.gold .home{box-shadow:inset 0 0 0 4px #f9e7d3}

.marvel-device.iphone5c{background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.2)}

.marvel-device.iphone5c .top-bar,.marvel-device.iphone5c .bottom-bar{display:none}

.marvel-device.iphone5c .home{background:#242324;border-radius:36px;width:68px;height:68px;z-index:3;position:absolute;left:50%;margin-left:-34px;bottom:19px}

.marvel-device.iphone5c .home:after{width:20px;height:20px;border:1px solid hsla(0,0%,100%,.1);border-radius:4px;position:absolute;display:block;content:"";top:50%;left:50%;margin-top:-11px;margin-left:-11px}

.marvel-device.iphone5c.landscape .home{left:19px;bottom:50%;margin-bottom:-34px;margin-left:0px}

.marvel-device.iphone5c .volume,.marvel-device.iphone5c .sleep{background:#ddd}

.marvel-device.iphone5c.red{background:#f96b6c}

.marvel-device.iphone5c.red .volume,.marvel-device.iphone5c.red .sleep{background:#ed5758}

.marvel-device.iphone5c.yellow{background:#f2dc60}

.marvel-device.iphone5c.yellow .volume,.marvel-device.iphone5c.yellow .sleep{background:#e5ce4c}

.marvel-device.iphone5c.green{background:#97e563}

.marvel-device.iphone5c.green .volume,.marvel-device.iphone5c.green .sleep{background:#85d94d}

.marvel-device.iphone5c.blue{background:#33a2db}

.marvel-device.iphone5c.blue .volume,.marvel-device.iphone5c.blue .sleep{background:#2694cd}

.marvel-device.iphone4s{padding:129px 27px;width:320px;height:480px;background:#686868;border-radius:54px}

.marvel-device.iphone4s:before{content:"";width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;left:4px;z-index:1;border-radius:50px;background:#1e1e1e}

.marvel-device.iphone4s .top-bar{top:60px;position:absolute;left:0}

.marvel-device.iphone4s .bottom-bar{bottom:90px;position:absolute;left:0}

.marvel-device.iphone4s .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:72px;left:134px;z-index:3;margin-left:-5px;border-radius:100%}

.marvel-device.iphone4s .speaker{background:#292728;width:64px;height:10px;position:absolute;top:72px;left:50%;z-index:3;margin-left:-32px;border-radius:5px}

.marvel-device.iphone4s .sensor{background:#292728;width:40px;height:10px;position:absolute;top:36px;left:50%;z-index:3;margin-left:-20px;border-radius:5px}

.marvel-device.iphone4s .home{background:#242324;border-radius:100%;width:72px;height:72px;z-index:3;position:absolute;left:50%;margin-left:-36px;bottom:30px}

.marvel-device.iphone4s .home:after{width:20px;height:20px;border:1px solid hsla(0,0%,100%,.1);border-radius:4px;position:absolute;display:block;content:"";top:50%;left:50%;margin-top:-11px;margin-left:-11px}

.marvel-device.iphone4s .sleep{position:absolute;top:-4px;right:60px;width:60px;height:4px;border-radius:2px 2px 0px 0px;background:#4d4d4d}

.marvel-device.iphone4s .volume{position:absolute;left:-4px;top:160px;height:27px;width:4px;border-radius:2px 0px 0px 2px;background:#4d4d4d}

.marvel-device.iphone4s .volume:before{position:absolute;left:0px;top:-70px;height:35px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone4s .volume:after{position:absolute;left:0px;bottom:-64px;height:27px;width:4px;border-radius:2px 0px 0px 2px;background:inherit;content:"";display:block}

.marvel-device.iphone4s.landscape{padding:27px 129px;height:320px;width:480px}

.marvel-device.iphone4s.landscape .bottom-bar{left:90px;bottom:0px;height:100%;width:3px}

.marvel-device.iphone4s.landscape .top-bar{left:calc(100% - 60px);top:0px;height:100%;width:3px}

.marvel-device.iphone4s.landscape .camera{top:134px;left:calc(100% - 72px);margin-left:0}

.marvel-device.iphone4s.landscape .speaker{top:50%;margin-left:0;margin-top:-32px;left:calc(100% - 72px);width:10px;height:64px}

.marvel-device.iphone4s.landscape .sensor{height:40px;width:10px;left:calc(100% - 36px);top:50%;margin-left:0;margin-top:-20px}

.marvel-device.iphone4s.landscape .home{left:30px;bottom:50%;margin-left:0;margin-bottom:-36px}

.marvel-device.iphone4s.landscape .sleep{height:60px;width:4px;right:-4px;top:calc(100% - 120px);border-radius:0px 2px 2px 0px}

.marvel-device.iphone4s.landscape .volume{top:-4px;left:calc(100% - 187px);height:4px;width:27px;border-radius:2px 2px 0px 0px}

.marvel-device.iphone4s.landscape .volume:before{right:-70px;left:auto;top:0px;width:35px;height:4px;border-radius:2px 2px 0px 0px}

.marvel-device.iphone4s.landscape .volume:after{width:27px;height:4px;bottom:0px;left:-64px;border-radius:2px 2px 0px 0px}

.marvel-device.iphone4s.silver{background:#bcbcbc}

.marvel-device.iphone4s.silver:before{background:#fcfcfc}

.marvel-device.iphone4s.silver .home{background:#fcfcfc;box-shadow:inset 0 0 0 1px #bcbcbc}

.marvel-device.iphone4s.silver .home:after{border:1px solid rgba(0,0,0,.2)}

.marvel-device.iphone4s.silver .volume,.marvel-device.iphone4s.silver .sleep{background:#d6d6d6}

.marvel-device.nexus5{padding:50px 15px 50px 15px;width:320px;height:568px;background:#1e1e1e;border-radius:20px}

.marvel-device.nexus5:before{border-radius:600px/50px;background:inherit;content:"";top:0;position:absolute;height:103.1%;width:calc(100% - 26px);top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}

.marvel-device.nexus5 .top-bar{width:calc(100% - 8px);height:calc(100% - 6px);position:absolute;top:3px;left:4px;border-radius:20px;background:#181818}

.marvel-device.nexus5 .top-bar:before{border-radius:600px/50px;background:inherit;content:"";top:0;position:absolute;height:103%;width:calc(100% - 26px);top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}

.marvel-device.nexus5 .bottom-bar{display:none}

.marvel-device.nexus5 .sleep{width:3px;position:absolute;left:-3px;top:110px;height:100px;background:inherit;border-radius:2px 0px 0px 2px}

.marvel-device.nexus5 .volume{width:3px;position:absolute;right:-3px;top:70px;height:45px;background:inherit;border-radius:0px 2px 2px 0px}

.marvel-device.nexus5 .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:18px;left:50%;z-index:3;margin-left:-5px;border-radius:100%}

.marvel-device.nexus5 .camera:before{background:#3c3d3d;width:6px;height:6px;content:"";display:block;position:absolute;top:2px;left:-100px;z-index:3;border-radius:100%}

.marvel-device.nexus5.landscape{padding:15px 50px 15px 50px;height:320px;width:568px}

.marvel-device.nexus5.landscape:before{width:103.1%;height:calc(100% - 26px);border-radius:50px/600px}

.marvel-device.nexus5.landscape .top-bar{left:3px;top:4px;height:calc(100% - 8px);width:calc(100% - 6px)}

.marvel-device.nexus5.landscape .top-bar:before{width:103%;height:calc(100% - 26px);border-radius:50px/600px}

.marvel-device.nexus5.landscape .sleep{height:3px;width:100px;left:calc(100% - 210px);top:-3px;border-radius:2px 2px 0px 0px}

.marvel-device.nexus5.landscape .volume{height:3px;width:45px;right:70px;top:100%;border-radius:0px 0px 2px 2px}

.marvel-device.nexus5.landscape .camera{top:50%;left:calc(100% - 18px);margin-left:0;margin-top:-5px}

.marvel-device.nexus5.landscape .camera:before{top:-100px;left:2px}

.marvel-device.s5{padding:60px 18px;border-radius:42px;width:320px;height:568px;background:#bcbcbc}

.marvel-device.s5:before,.marvel-device.s5:after{width:calc(100% - 52px);content:"";display:block;height:26px;background:inherit;position:absolute;border-radius:500px/40px;left:50%;transform:translateX(-50%)}

.marvel-device.s5:before{top:-7px}

.marvel-device.s5:after{bottom:-7px}

.marvel-device.s5 .bottom-bar{display:none}

.marvel-device.s5 .top-bar{border-radius:37px;width:calc(100% - 10px);height:calc(100% - 10px);top:5px;left:5px;background:radial-gradient(rgba(0, 0, 0, 0.02) 20%, transparent 60%) 0 0,radial-gradient(rgba(0, 0, 0, 0.02) 20%, transparent 60%) 3px 3px;background-color:#fff;background-size:4px 4px;background-position:center;z-index:2;position:absolute}

.marvel-device.s5 .top-bar:before,.marvel-device.s5 .top-bar:after{width:calc(100% - 48px);content:"";display:block;height:26px;background:inherit;position:absolute;border-radius:500px/40px;left:50%;transform:translateX(-50%)}

.marvel-device.s5 .top-bar:before{top:-7px}

.marvel-device.s5 .top-bar:after{bottom:-7px}

.marvel-device.s5 .sleep{width:3px;position:absolute;left:-3px;top:100px;height:100px;background:#cecece;border-radius:2px 0px 0px 2px}

.marvel-device.s5 .speaker{width:68px;height:8px;position:absolute;top:20px;display:block;z-index:3;left:50%;margin-left:-34px;background-color:#bcbcbc;background-position:top left;border-radius:4px}

.marvel-device.s5 .sensor{display:block;position:absolute;top:20px;right:110px;background:#3c3d3d;border-radius:100%;width:8px;height:8px;z-index:3}

.marvel-device.s5 .sensor:after{display:block;content:"";position:absolute;top:0px;right:12px;background:#3c3d3d;border-radius:100%;width:8px;height:8px;z-index:3}

.marvel-device.s5 .camera{display:block;position:absolute;top:24px;right:42px;background:#000;border-radius:100%;width:10px;height:10px;z-index:3}

.marvel-device.s5 .camera:before{width:4px;height:4px;background:#3c3d3d;border-radius:100%;position:absolute;content:"";top:50%;left:50%;margin-top:-2px;margin-left:-2px}

.marvel-device.s5 .home{position:absolute;z-index:3;bottom:17px;left:50%;width:70px;height:20px;background:#fff;border-radius:18px;display:block;margin-left:-35px;border:2px solid #000}

.marvel-device.s5.landscape{padding:18px 60px;height:320px;width:568px}

.marvel-device.s5.landscape:before,.marvel-device.s5.landscape:after{height:calc(100% - 52px);width:26px;border-radius:40px/500px;transform:translateY(-50%)}

.marvel-device.s5.landscape:before{top:50%;left:-7px}

.marvel-device.s5.landscape:after{top:50%;left:auto;right:-7px}

.marvel-device.s5.landscape .top-bar:before,.marvel-device.s5.landscape .top-bar:after{width:26px;height:calc(100% - 48px);border-radius:40px/500px;transform:translateY(-50%)}

.marvel-device.s5.landscape .top-bar:before{right:-7px;top:50%;left:auto}

.marvel-device.s5.landscape .top-bar:after{left:-7px;top:50%;right:auto}

.marvel-device.s5.landscape .sleep{height:3px;width:100px;left:calc(100% - 200px);top:-3px;border-radius:2px 2px 0px 0px}

.marvel-device.s5.landscape .speaker{height:68px;width:8px;left:calc(100% - 20px);top:50%;margin-left:0;margin-top:-34px}

.marvel-device.s5.landscape .sensor{right:20px;top:calc(100% - 110px)}

.marvel-device.s5.landscape .sensor:after{left:-12px;right:0px}

.marvel-device.s5.landscape .camera{top:calc(100% - 42px);right:24px}

.marvel-device.s5.landscape .home{width:20px;height:70px;bottom:50%;margin-bottom:-35px;margin-left:0;left:17px}

.marvel-device.s5.black{background:#1e1e1e}

.marvel-device.s5.black .speaker{background:#000}

.marvel-device.s5.black .sleep{background:#1e1e1e}

.marvel-device.s5.black .top-bar{background:radial-gradient(rgba(0, 0, 0, 0.05) 20%, transparent 60%) 0 0,radial-gradient(rgba(0, 0, 0, 0.05) 20%, transparent 60%) 3px 3px;background-color:#2c2b2c;background-size:4px 4px}

.marvel-device.s5.black .home{background:#2c2b2c}

.marvel-device.lumia920{padding:80px 35px 125px 35px;background:#fd0;width:320px;height:533px;border-radius:40px/3px}

.marvel-device.lumia920 .bottom-bar{display:none}

.marvel-device.lumia920 .top-bar{width:calc(100% - 24px);height:calc(100% - 32px);position:absolute;top:16px;left:12px;border-radius:24px;background:#000;z-index:1}

.marvel-device.lumia920 .top-bar:before{background:#1e1e1e;display:block;content:"";width:calc(100% - 4px);height:calc(100% - 4px);top:2px;left:2px;position:absolute;border-radius:22px}

.marvel-device.lumia920 .volume{width:3px;position:absolute;top:130px;height:100px;background:#1e1e1e;right:-3px;border-radius:0px 2px 2px 0px}

.marvel-device.lumia920 .volume:before{width:3px;position:absolute;top:190px;content:"";display:block;height:50px;background:inherit;right:0px;border-radius:0px 2px 2px 0px}

.marvel-device.lumia920 .volume:after{width:3px;position:absolute;top:460px;content:"";display:block;height:50px;background:inherit;right:0px;border-radius:0px 2px 2px 0px}

.marvel-device.lumia920 .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:34px;right:130px;z-index:5;border-radius:5px}

.marvel-device.lumia920 .speaker{background:#292728;width:64px;height:10px;position:absolute;top:38px;left:50%;margin-left:-32px;border-radius:5px;z-index:3}

.marvel-device.lumia920.landscape{padding:35px 80px 35px 125px;height:320px;width:568px;border-radius:2px/100px}

.marvel-device.lumia920.landscape .top-bar{height:calc(100% - 24px);width:calc(100% - 32px);left:16px;top:12px}

.marvel-device.lumia920.landscape .volume{height:3px;right:130px;width:100px;top:100%;border-radius:0px 0px 2px 2px}

.marvel-device.lumia920.landscape .volume:before{height:3px;right:190px;top:0px;width:50px;border-radius:0px 0px 2px 2px}

.marvel-device.lumia920.landscape .volume:after{height:3px;right:430px;top:0px;width:50px;border-radius:0px 0px 2px 2px}

.marvel-device.lumia920.landscape .camera{right:30px;top:calc(100% - 140px)}

.marvel-device.lumia920.landscape .speaker{width:10px;height:64px;top:50%;margin-left:0;margin-top:-32px;left:calc(100% - 48px)}

.marvel-device.lumia920.black{background:#000}

.marvel-device.lumia920.white{background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.2)}

.marvel-device.lumia920.blue{background:#00acdd}

.marvel-device.lumia920.red{background:#cc3e32}

.marvel-device.htc-one{padding:72px 25px 100px 25px;width:320px;height:568px;background:#bebebe;border-radius:34px}

.marvel-device.htc-one:before{content:"";display:block;width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;top:2px;left:2px;background:#adadad;border-radius:32px}

.marvel-device.htc-one:after{content:"";display:block;width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;left:4px;background:#eee;border-radius:30px}

.marvel-device.htc-one .top-bar{width:calc(100% - 4px);height:635px;position:absolute;background:#424242;top:50px;z-index:1;left:2px}

.marvel-device.htc-one .top-bar:before{content:"";width:calc(100% - 4px);height:100%;position:absolute;background:#000;top:0px;z-index:1;left:2px}

.marvel-device.htc-one .bottom-bar{display:none}

.marvel-device.htc-one .speaker{height:16px;width:216px;display:block;position:absolute;top:22px;z-index:2;left:50%;margin-left:-108px;background:radial-gradient(#343434 25%, transparent 50%) 0 0,radial-gradient(#343434 25%, transparent 50%) 4px 4px;background-size:4px 4px;background-position:top left}

.marvel-device.htc-one .speaker:after{content:"";height:16px;width:216px;display:block;position:absolute;top:676px;z-index:2;left:50%;margin-left:-108px;background:inherit}

.marvel-device.htc-one .camera{display:block;position:absolute;top:18px;right:38px;background:#3c3d3d;border-radius:100%;width:24px;height:24px;z-index:3}

.marvel-device.htc-one .camera:before{width:8px;height:8px;background:#000;border-radius:100%;position:absolute;content:"";top:50%;left:50%;margin-top:-4px;margin-left:-4px}

.marvel-device.htc-one .sensor{display:block;position:absolute;top:29px;left:60px;background:#3c3d3d;border-radius:100%;width:8px;height:8px;z-index:3}

.marvel-device.htc-one .sensor:after{display:block;content:"";position:absolute;top:0px;right:12px;background:#3c3d3d;border-radius:100%;width:8px;height:8px;z-index:3}

.marvel-device.htc-one.landscape{padding:25px 72px 25px 100px;height:320px;width:568px}

.marvel-device.htc-one.landscape .top-bar{height:calc(100% - 4px);width:635px;left:calc(100% - 685px);top:2px}

.marvel-device.htc-one.landscape .speaker{width:16px;height:216px;left:calc(100% - 38px);top:50%;margin-left:0px;margin-top:-108px}

.marvel-device.htc-one.landscape .speaker:after{width:16px;height:216px;left:calc(100% - 692px);top:50%;margin-left:0;margin-top:-108px}

.marvel-device.htc-one.landscape .camera{right:18px;top:calc(100% - 38px)}

.marvel-device.htc-one.landscape .sensor{left:calc(100% - 29px);top:60px}

.marvel-device.htc-one.landscape .sensor :after{right:0;top:-12px}

.marvel-device.ipad{width:576px;height:768px;padding:90px 25px;background:#242324;border-radius:44px}

.marvel-device.ipad:before{width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;content:"";display:block;top:4px;left:4px;border-radius:40px;background:#1e1e1e}

.marvel-device.ipad .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:44px;left:50%;margin-left:-5px;border-radius:100%}

.marvel-device.ipad .top-bar,.marvel-device.ipad .bottom-bar{display:none}

.marvel-device.ipad .home{background:#242324;border-radius:36px;width:50px;height:50px;position:absolute;left:50%;margin-left:-25px;bottom:22px}

.marvel-device.ipad .home:after{width:15px;height:15px;margin-top:-8px;margin-left:-8px;border:1px solid hsla(0,0%,100%,.1);border-radius:4px;position:absolute;display:block;content:"";top:50%;left:50%}

.marvel-device.ipad.landscape{height:576px;width:768px;padding:25px 90px}

.marvel-device.ipad.landscape .camera{left:calc(100% - 44px);top:50%;margin-left:0;margin-top:-5px}

.marvel-device.ipad.landscape .home{top:50%;left:22px;margin-left:0;margin-top:-25px}

.marvel-device.ipad.silver{background:#bcbcbc}

.marvel-device.ipad.silver:before{background:#fcfcfc}

.marvel-device.ipad.silver .home{background:#fcfcfc;box-shadow:inset 0 0 0 1px #bcbcbc}

.marvel-device.ipad.silver .home:after{border:1px solid rgba(0,0,0,.2)}

.marvel-device.macbook{width:960px;height:600px;padding:44px 44px 76px;margin:0 auto;background:#bebebe;border-radius:34px}

.marvel-device.macbook:before{width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;content:"";display:block;top:4px;left:4px;border-radius:30px;background:#1e1e1e}

.marvel-device.macbook .top-bar{width:calc(100% + 140px);height:40px;position:absolute;content:"";display:block;top:680px;left:-70px;border-bottom-left-radius:90px 18px;border-bottom-right-radius:90px 18px;background:#bebebe;box-shadow:inset 0px -4px 13px 3px rgba(34,34,34,.6)}

.marvel-device.macbook .top-bar:before{width:100%;height:24px;content:"";display:block;top:0;left:0;background:#f0f0f0;border-bottom:2px solid #aaa;border-radius:5px;position:relative}

.marvel-device.macbook .top-bar:after{width:16%;height:14px;content:"";display:block;top:0;background:#ddd;position:absolute;margin-left:auto;margin-right:auto;left:0;right:0;border-radius:0 0 20px 20px;box-shadow:inset 0px -3px 10px #999}

.marvel-device.macbook .bottom-bar{background:rgba(0,0,0,0);width:calc(100% + 140px);height:26px;position:absolute;content:"";display:block;top:680px;left:-70px}

.marvel-device.macbook .bottom-bar:before,.marvel-device.macbook .bottom-bar:after{height:calc(100% - 2px);width:80px;content:"";display:block;top:0;position:absolute}

.marvel-device.macbook .bottom-bar:before{left:0;background:#f0f0f0;background:linear-gradient(to right, #747474 0%, #c3c3c3 5%, #ebebeb 14%, #979797 41%, #f0f0f0 80%, #f0f0f0 100%, #f0f0f0 100%)}

.marvel-device.macbook .bottom-bar:after{right:0;background:#f0f0f0;background:linear-gradient(to right, #f0f0f0 0%, #f0f0f0 0%, #f0f0f0 20%, #979797 59%, #ebebeb 86%, #c3c3c3 95%, #747474 100%)}

.marvel-device.macbook .camera{background:#3c3d3d;width:10px;height:10px;position:absolute;top:20px;left:50%;margin-left:-5px;border-radius:100%}

.marvel-device.macbook .home{display:none}

.marvel-device.iphone-x{width:375px;height:812px;padding:26px;background:#fdfdfd;box-shadow:inset 0 0 11px 0 #000;border-radius:66px}

.marvel-device.iphone-x .overflow{width:100%;height:100%;position:absolute;top:0;left:0;border-radius:66px;overflow:hidden}

.marvel-device.iphone-x .shadow{border-radius:100%;width:90px;height:90px;position:absolute;background:radial-gradient(ellipse at center, rgba(0, 0, 0, 0.6) 0%, rgba(255, 255, 255, 0) 60%)}

.marvel-device.iphone-x .shadow--tl{top:-20px;left:-20px}

.marvel-device.iphone-x .shadow--tr{top:-20px;right:-20px}

.marvel-device.iphone-x .shadow--bl{bottom:-20px;left:-20px}

.marvel-device.iphone-x .shadow--br{bottom:-20px;right:-20px}

.marvel-device.iphone-x:before{width:calc(100% - 10px);height:calc(100% - 10px);position:absolute;top:5px;content:"";left:5px;border-radius:61px;background:#000;z-index:1}

.marvel-device.iphone-x .inner-shadow{width:calc(100% - 20px);height:calc(100% - 20px);position:absolute;top:10px;overflow:hidden;left:10px;border-radius:56px;box-shadow:inset 0 0 15px 0 hsla(0,0%,100%,.66);z-index:1}

.marvel-device.iphone-x .inner-shadow:before{box-shadow:inset 0 0 20px 0 #fff;width:100%;height:116%;position:absolute;top:-8%;content:"";left:0;border-radius:200px/112px;z-index:2}

.marvel-device.iphone-x .screen{border-radius:40px;box-shadow:none}

.marvel-device.iphone-x .top-bar,.marvel-device.iphone-x .bottom-bar{width:100%;position:absolute;height:8px;background:rgba(0,0,0,.1);left:0}

.marvel-device.iphone-x .top-bar{top:80px}

.marvel-device.iphone-x .bottom-bar{bottom:80px}

.marvel-device.iphone-x .volume,.marvel-device.iphone-x .volume:before,.marvel-device.iphone-x .volume:after,.marvel-device.iphone-x .sleep{width:3px;background:#b5b5b5;position:absolute}

.marvel-device.iphone-x .volume{left:-3px;top:116px;height:32px}

.marvel-device.iphone-x .volume:before{height:62px;top:62px;content:"";left:0}

.marvel-device.iphone-x .volume:after{height:62px;top:140px;content:"";left:0}

.marvel-device.iphone-x .sleep{height:96px;top:200px;right:-3px}

.marvel-device.iphone-x .camera{width:6px;height:6px;top:9px;border-radius:100%;position:absolute;left:154px;background:#0d4d71}

.marvel-device.iphone-x .speaker{height:6px;width:60px;left:50%;position:absolute;top:9px;margin-left:-30px;background:#171818;border-radius:6px}

.marvel-device.iphone-x .notch{position:absolute;width:210px;height:30px;top:26px;left:108px;z-index:4;background:#000;border-bottom-left-radius:24px;border-bottom-right-radius:24px}

.marvel-device.iphone-x .notch:before,.marvel-device.iphone-x .notch:after{content:"";height:8px;position:absolute;top:0;width:8px}

.marvel-device.iphone-x .notch:after{background:radial-gradient(circle at bottom left, transparent 0, transparent 70%, black 70%, black 100%);left:-8px}

.marvel-device.iphone-x .notch:before{background:radial-gradient(circle at bottom right, transparent 0, transparent 70%, black 70%, black 100%);right:-8px}

.marvel-device.iphone-x.landscape{height:375px;width:812px}

.marvel-device.iphone-x.landscape .top-bar,.marvel-device.iphone-x.landscape .bottom-bar{width:8px;height:100%;top:0}

.marvel-device.iphone-x.landscape .top-bar{left:80px}

.marvel-device.iphone-x.landscape .bottom-bar{right:80px;bottom:auto;left:auto}

.marvel-device.iphone-x.landscape .volume,.marvel-device.iphone-x.landscape .volume:before,.marvel-device.iphone-x.landscape .volume:after,.marvel-device.iphone-x.landscape .sleep{height:3px}

.marvel-device.iphone-x.landscape .inner-shadow:before{height:100%;width:116%;left:-8%;top:0;border-radius:112px/200px}

.marvel-device.iphone-x.landscape .volume{bottom:-3px;top:auto;left:116px;width:32px}

.marvel-device.iphone-x.landscape .volume:before{width:62px;left:62px;top:0}

.marvel-device.iphone-x.landscape .volume:after{width:62px;left:140px;top:0}

.marvel-device.iphone-x.landscape .sleep{width:96px;left:200px;top:-3px;right:auto}

.marvel-device.iphone-x.landscape .camera{left:9px;bottom:154px;top:auto}

.marvel-device.iphone-x.landscape .speaker{width:6px;height:60px;left:9px;top:50%;margin-top:-30px;margin-left:0}

.marvel-device.iphone-x.landscape .notch{height:210px;width:30px;left:26px;bottom:108px;top:auto;border-top-right-radius:24px;border-bottom-right-radius:24px;border-bottom-left-radius:0}

.marvel-device.iphone-x.landscape .notch:before,.marvel-device.iphone-x.landscape .notch:after{left:0}

.marvel-device.iphone-x.landscape .notch:after{background:radial-gradient(circle at bottom right, transparent 0, transparent 70%, black 70%, black 100%);bottom:-8px;top:auto}

.marvel-device.iphone-x.landscape .notch:before{background:radial-gradient(circle at top right, transparent 0, transparent 70%, black 70%, black 100%);top:-8px}

.marvel-device.note8{width:400px;height:822px;background:#000;border-radius:34px;padding:45px 10px}

.marvel-device.note8 .overflow{width:100%;height:100%;position:absolute;top:0;left:0;border-radius:34px;overflow:hidden}

.marvel-device.note8 .speaker{height:8px;width:56px;left:50%;position:absolute;top:25px;margin-left:-28px;background:#171818;z-index:1;border-radius:8px}

.marvel-device.note8 .camera{height:18px;width:18px;left:86px;position:absolute;top:18px;background:#212b36;z-index:1;border-radius:100%}

.marvel-device.note8 .camera:before{content:"";height:8px;width:8px;left:-22px;position:absolute;top:5px;background:#212b36;z-index:1;border-radius:100%}

.marvel-device.note8 .sensors{height:10px;width:10px;left:120px;position:absolute;top:22px;background:#1d233b;z-index:1;border-radius:100%}

.marvel-device.note8 .sensors:before{content:"";height:10px;width:10px;left:18px;position:absolute;top:0;background:#1d233b;z-index:1;border-radius:100%}

.marvel-device.note8 .more-sensors{height:16px;width:16px;left:285px;position:absolute;top:18px;background:#33244a;box-shadow:0 0 0 2px hsla(0,0%,100%,.1);z-index:1;border-radius:100%}

.marvel-device.note8 .more-sensors:before{content:"";height:11px;width:11px;left:40px;position:absolute;top:4px;background:#214a61;z-index:1;border-radius:100%}

.marvel-device.note8 .sleep{width:2px;height:56px;background:#000;position:absolute;top:288px;right:-2px}

.marvel-device.note8 .volume{width:2px;height:120px;background:#000;position:absolute;top:168px;left:-2px}

.marvel-device.note8 .volume:before{content:"";top:168px;width:2px;position:absolute;left:0;background:#000;height:56px}

.marvel-device.note8 .inner{width:100%;height:calc(100% - 8px);position:absolute;top:2px;content:"";left:0px;border-radius:34px;border-top:2px solid #9fa0a2;border-bottom:2px solid #9fa0a2;background:#000;z-index:1;box-shadow:inset 0 0 6px 0 hsla(0,0%,100%,.5)}

.marvel-device.note8 .shadow{box-shadow:inset 0 0 60px 0 #fff,inset 0 0 30px 0 hsla(0,0%,100%,.5),0 0 20px 0 #fff,0 0 20px 0 hsla(0,0%,100%,.5);height:101%;position:absolute;top:-0.5%;content:"";width:calc(100% - 20px);left:10px;border-radius:38px;z-index:5;pointer-events:none}

.marvel-device.note8 .screen{border-radius:14px;box-shadow:none}

.marvel-device.note8.landscape{height:400px;width:822px;padding:10px 45px}

.marvel-device.note8.landscape .speaker{height:56px;width:8px;top:50%;margin-top:-28px;margin-left:0;right:25px;left:auto}

.marvel-device.note8.landscape .camera{top:86px;right:18px;left:auto}

.marvel-device.note8.landscape .camera:before{top:-22px;left:5px}

.marvel-device.note8.landscape .sensors{top:120px;right:22px;left:auto}

.marvel-device.note8.landscape .sensors:before{top:18px;left:0}

.marvel-device.note8.landscape .more-sensors{top:285px;right:18px;left:auto}

.marvel-device.note8.landscape .more-sensors:before{top:40px;left:4px}

.marvel-device.note8.landscape .sleep{bottom:-2px;top:auto;right:288px;width:56px;height:2px}

.marvel-device.note8.landscape .volume{width:120px;height:2px;top:-2px;right:168px;left:auto}

.marvel-device.note8.landscape .volume:before{right:168px;left:auto;top:0;width:56px;height:2px}

.marvel-device.note8.landscape .inner{height:100%;width:calc(100% - 8px);left:2px;top:0;border-top:0;border-bottom:0;border-left:2px solid #9fa0a2;border-right:2px solid #9fa0a2}

.marvel-device.note8.landscape .shadow{width:101%;height:calc(100% - 20px);left:-0.5%;top:10px}

footer{background-color:#1e2a2f;display:flex;justify-content:center;padding:100px 40px 120px}

footer .footer__content{display:flex;flex-direction:column;max-width:1120px;width:100%}

footer .top{align-items:center;display:flex;flex-direction:column;margin-bottom:50px}

footer .top img{margin-bottom:15px;max-width:250px}

footer .top span{color:#b7c4d2;font-size:18px;font-weight:500}

footer .bottom{align-items:center;border-top:4px solid #575f67;display:flex;justify-content:space-between;padding-top:20px}

footer .bottom__left{color:#575f67;display:flex}

footer .bottom__left div{color:inherit}

footer .bottom__left div span{color:inherit}

footer .bottom__left a{margin-left:20px;transition:color .2s}

footer .bottom__left a:hover{color:#86919c}

footer .bottom__right{display:flex}

footer .bottom__right a{height:22px;width:22px}

footer .bottom__right a:not(:first-child){margin-left:10px}

footer .bottom__right a svg{fill:#575f67;height:100%;transition:fill .2s;width:100%}

footer .bottom__right a:hover svg{fill:#86919c}

@media(max-width: 750px){footer .bottom{flex-direction:column}footer .bottom__left{align-items:center;flex-direction:column;margin-top:20px}footer .bottom__left a{margin:30px 0 0}footer .bottom__right{margin:30px 0 0}}

.hamburger{padding:0;display:inline-block;cursor:pointer;transition-property:opacity,filter;transition-duration:.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:rgba(0,0,0,0);border:0;margin:0;overflow:visible;opacity:.75}

.hamburger:hover{opacity:1}

.hamburger:focus{outline:none}

.hamburger.is-active:hover{opacity:.7}

.hamburger.is-active .hamburger-inner,.hamburger.is-active .hamburger-inner::before,.hamburger.is-active .hamburger-inner::after{background-color:#241c15}

.hamburger-box{width:24px;height:18px;display:inline-block;position:relative}

.hamburger-inner{display:block;top:50%;margin-top:1px}

.hamburger-inner,.hamburger-inner::before,.hamburger-inner::after{width:24px;height:2px;background-color:#241c15;border-radius:4px;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}

.hamburger-inner::before,.hamburger-inner::after{content:"";display:block}

.hamburger-inner::before{top:-8px}

.hamburger-inner::after{bottom:-8px}

.hamburger--squeeze .hamburger-inner{transition-duration:.075s;transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)}

.hamburger--squeeze .hamburger-inner::before{transition:top .075s .12s ease, opacity .075s ease}

.hamburger--squeeze .hamburger-inner::after{transition:bottom .075s .12s ease, transform .075s cubic-bezier(0.55, 0.055, 0.675, 0.19)}

.hamburger--squeeze.is-active .hamburger-inner{transform:rotate(45deg);transition-delay:.12s;transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)}

.hamburger--squeeze.is-active .hamburger-inner::before{top:0;opacity:0;transition:top .075s ease, opacity .075s .12s ease}

.hamburger--squeeze.is-active .hamburger-inner::after{bottom:0;transform:rotate(-90deg);transition:bottom .075s ease, transform .075s .12s cubic-bezier(0.215, 0.61, 0.355, 1)}

header{align-items:center;display:flex;height:90px;justify-content:center;padding:0 24px;padding:0 1.5rem;width:100%}

header.desktop{display:flex}

header.mobile{display:none}

@media(max-width: 900px){header.desktop{display:none}header.mobile{display:flex;height:60px;padding:0;position:relative}header.mobile .header__container{background:#fff;height:100%;padding:0 1.5rem;z-index:2}header.mobile .header__container__logo{align-items:center;display:flex;width:150px}header.mobile .header__container__logo img.icon{height:24px;margin-right:6px}header.mobile .header__container__logo img.text{height:20px;transform:translateY(2px)}header.mobile #mobile-menu{background:#fff;border-bottom:2px solid #e2e8f0;display:flex;flex-direction:column;padding:0 1.5rem;position:absolute;top:100%;transform:translateY(-100%);transition:transform .3s;width:100%;z-index:1}header.mobile #mobile-menu.is-active{transform:translateY(0%)}header.mobile #mobile-menu>a{color:#4277ce;font-weight:500;padding:.5rem 0;transition:color .2s}header.mobile #mobile-menu>a:hover{color:rgb(35,72.8571428571,135)}header.mobile #mobile-menu div{align-items:center;display:flex;padding:1.5rem 0}header.mobile #mobile-menu div .login{align-items:center;display:flex;color:rgba(0,0,0,.6);transition:color .2s}header.mobile #mobile-menu div .login:hover{color:rgba(0,0,0,.87)}header.mobile #mobile-menu div .login svg{margin-right:5px;width:.875rem}header.mobile #mobile-menu div .signup{background-image:linear-gradient(0deg, #4277ce, rgb(126.75, 162.7142857143, 221.75));border-radius:.125rem;color:#fff;margin-right:20px;padding:.5rem .75rem .6rem;transition:all .2s}header.mobile #mobile-menu div .signup:hover{background-image:linear-gradient(0deg, rgb(40.25, 83.7857142857, 155.25), #4277ce)}}

.header__container{align-items:center;display:flex;justify-content:space-between;max-width:1248px;max-width:78rem;position:relative;width:100%}

.header__container__logo{align-items:center;display:flex;width:150px}

.header__container__logo:hover .icon{transform:scale(1.05)}

.header__container__logo .icon{height:32px;margin-right:8px;transition:transform .2s}

.header__container__logo .text{height:22px}

.header__container__middle{left:50%;position:absolute;transform:translateX(-50%)}

.header__container__middle a{color:#4277ce;transition:color .2s}

.header__container__middle a:hover{color:rgb(35,72.8571428571,135)}

.header__container__right{align-items:center;display:flex}

.header__container__right .login{align-items:center;display:flex;color:rgba(0,0,0,.6);transition:color .2s}

.header__container__right .login:hover{color:rgba(0,0,0,.87)}

.header__container__right .login svg{margin-right:5px;width:14px;width:.875rem}

.header__container__right .signup{background-image:linear-gradient(0deg, #4277ce, rgb(126.75, 162.7142857143, 221.75));border-radius:.125rem;color:#fff;padding:8px 12px 9.6px;padding:.5rem .75rem .6rem;transition:all .2s}

.header__container__right .signup:hover{background-image:linear-gradient(0deg, rgb(40.25, 83.7857142857, 155.25), #4277ce)}

.header__container nav>a{font-weight:500;padding:0 24px}

#title{background-color:#f1f4f6;border-bottom:1px solid #f0f2f3;display:flex;flex-direction:column;margin-top:50px;padding-bottom:80px;width:100%}

#title .slant{border-top:1px solid rgba(43,104,170,.51);box-shadow:0 1px 3px 0 rgba(209,237,255,.33),41px 27px 0 25px #f1f4f6;position:relative;top:-12px;transform:rotate(-1deg);width:100%}

#title .content{align-items:center;display:flex;flex-direction:column;margin-top:46px;text-align:center}

#title .content h1{color:#000;font-family:"Source Serif Pro",serif;font-size:42px;font-weight:600;letter-spacing:.5px;line-height:52px;margin:0 0 15px -2px}

@media(max-width: 680px){#title .content h1{font-size:36px;line-height:1.3}}

#title .content .text{max-width:645px}

#title .content .text p{color:#244864;font-size:18px;line-height:31px}

@media(max-width: 700px){#title .content{padding:0 23px 0 13px}}

*{box-sizing:border-box}

#title .text{max-width:100% !important}

.features{display:flex;justify-content:center;padding:0 20px}

@media(max-width: 700px){.features{padding:0 15px}}

.features__wrapper{width:100%}

@media(min-width: 1200px){.features__wrapper{max-width:1170px}}

.features__wrapper{max-width:970px;position:relative}

@media(max-width: 970px){.features__wrapper__left{display:none}}

.features__wrapper__left{position:absolute;top:0;left:0}

.features__wrapper__left>nav{margin-top:20px}

.features__wrapper__left>nav li{font-size:15px;line-height:32px;color:#565656;opacity:.75;transition:all .2s}

.features__wrapper__left>nav li.header{font-size:13px;font-weight:600;padding-top:10px;opacity:1}

.features__wrapper__left>nav li:not(.header):hover{color:#007dcc;-webkit-text-decoration:underline;text-decoration:underline}

.features__wrapper__right{width:75%;margin-left:25%}

@media(max-width: 970px){.features__wrapper__right{width:100%;margin-left:0}}

.features__wrapper__right>article{margin-top:40px;border-top:1px solid #ddd;padding-top:40px}

@media(max-width: 700px){.features__wrapper__right>article{padding-top:0;margin-top:0}}

.features__wrapper__right>article:focus{outline:none}

.features__wrapper__right>article:first-child{margin-top:0;border-top:0}

.features__wrapper__right>article>.article-header{padding-top:30px;text-align:center}

.features__wrapper__right>article>.article-header>h2{font-family:"Source Serif Pro",serif;font-weight:600;font-size:31px}

@media(max-width: 700px){.features__wrapper__right>article>.article-header>h2{font-size:28px}}

.features__wrapper__right>article>.article-header>h2{line-height:40px;color:#22252b}

.features__wrapper__right>article>.article-header>h2>span{display:none}

@media(max-width: 700px){.features__wrapper__right>article>.article-header>h2>span{display:block}}

.features__wrapper__right>article>.article-header>h4{color:#565656;font-size:17px;margin-top:25px;line-height:1.8}

.features__wrapper__right>article>.article-header a{color:#4277ce;-webkit-text-decoration:underline;text-decoration:underline;transition:color .2s}

.features__wrapper__right>article>.article-header a:hover{color:rgb(35,72.8571428571,135)}

.features__wrapper__right>article .screenshot{margin:60px 0 0;position:relative}

@media(max-width: 700px){.features__wrapper__right>article .screenshot{margin:30px 0 0}}

.features__wrapper__right>article .screenshot__desktop{position:relative;width:100%;z-index:1;overflow:hidden;border-radius:5px}

.features__wrapper__right>article .screenshot__desktop .bar{background:rgba(32,32,32,.6196078431);box-sizing:border-box;border-bottom:2px solid #eee;height:25px;padding:0 8px;text-align:left;width:100%}

.features__wrapper__right>article .screenshot__desktop .bar .circle{background:#eee;border-radius:50%;display:inline-block;height:8px;margin-top:8px;margin-right:4px;width:8px}

.features__wrapper__right>article .screenshot__desktop__container img{border:0;border-radius:0;box-shadow:none;max-width:100%;display:block}

.features__wrapper__right>article .screenshot__mobile{position:absolute;z-index:1;right:-40px;bottom:-40px}

@media(max-width: 970px){.features__wrapper__right>article .screenshot__mobile{display:none}}

.features__wrapper__right>article .article-content{display:flex;flex-wrap:wrap;padding:60px 0 20px}

@media(max-width: 700px){.features__wrapper__right>article .article-content{padding:30px 0 20px}}

.features__wrapper__right>article .article-content__item{padding:0 15px;width:50%}

@media(max-width: 700px){.features__wrapper__right>article .article-content__item{width:100%}}

.features__wrapper__right>article .article-content__item>h3{color:#22252b;font-size:18px;font-weight:600;margin-bottom:20px}

.features__wrapper__right>article .article-content__item>p{margin-bottom:30px;font-size:17px;color:#565656;line-height:1.8}

.features__wrapper__right>article .article-content__item a{color:#4277ce;-webkit-text-decoration:underline;text-decoration:underline;transition:color .2s}

.features__wrapper__right>article .article-content__item a:hover{color:rgb(35,72.8571428571,135)}

.features__wrapper__right>article a.btn{background-image:linear-gradient(0deg, #4277ce, rgb(126.75, 162.7142857143, 221.75));border-radius:.125rem;color:#fff;display:block;min-width:200px;padding:8px 12px 9.6px;padding:.5rem .75rem .6rem;text-align:center;transition:all .2s}

.features__wrapper__right>article a.btn:hover{background-image:linear-gradient(0deg, rgb(40.25, 83.7857142857, 155.25), #4277ce)}

.marvel-device img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}

.marvel-device.iphone8{width:175px;height:311.2666666667px;padding-top:49px;padding-bottom:49px;padding-left:11.2px;padding-right:11.2px;border-radius:26.1333333333px}

.marvel-device.iphone8.black{box-shadow:inset 0 0 1.4px 0 rgba(0,0,0,.7)}

.marvel-device.iphone8:before{width:calc(100% - 5.6px);height:calc(100% - 5.6px);left:2.8px;top:2.8px;border-radius:23.3333333333px}

.marvel-device.iphone8:after{width:calc(100% - 7.4666666667px);height:calc(100% - 7.4666666667px);left:3.7333333333px;top:3.7333333333px;border-radius:22.4px}

.marvel-device.iphone8 .top-bar{height:6.5333333333px;top:31.7333333333px}

.marvel-device.iphone8 .sleep{top:88.6666666667px;right:-1.8666666667px;width:1.8666666667px;height:30.8px;border-radius:0px 0.9333333333px 0.9333333333px 0px}

.marvel-device.iphone8 .volume{left:-1.8666666667px;top:87.7333333333px;width:1.8666666667px;height:30.8px;border-radius:0.9333333333px 0px 0px 0.9333333333px}

.marvel-device.iphone8 .volume:before{left:.9333333333px;top:-36.4px;height:18.6666666667px;width:.9333333333px;border-radius:0.9333333333px 0px 0px 0.9333333333px}

.marvel-device.iphone8 .volume:after{left:0px;top:38.2666666667px;height:30.8px;width:1.8666666667px;border-radius:0.9333333333px 0px 0px 0.9333333333px}

.marvel-device.iphone8 .camera{width:5.6px;height:5.6px;top:11.2px;margin-left:-2.8px}

.marvel-device.iphone8 .sensor{width:7.4666666667px;height:7.4666666667px;top:22.8666666667px;left:62.5333333333px}

.marvel-device.iphone8 .speaker{width:7.4666666667px;height:7.4666666667px;top:22.8666666667px;left:62.5333333333px;margin-left:-16.3333333333px;border-radius:2.8px}

.marvel-device.iphone8 .screen{border-radius:.4666666667px;box-shadow:0 0 0 1.4px #111}

.marvel-device.iphone8 .home{width:31.7333333333px;height:31.7333333333px;margin-left:-15.8666666667px;bottom:10.2666666667px}

.marvel-device.iphone8 .home:before{width:calc(100% - 3.7333333333px);height:calc(100% - 3.7333333333px);top:1.8666666667px;left:1.8666666667px}

.marvel-device.iphone8 .bottom-bar{height:6.5333333333px;bottom:31.7333333333px}

.ipad{width:100%;height:0;padding-bottom:172.197309417%;position:relative}

.ipad .ipad-container{padding:11.71875% 3.2552083333%;position:absolute;top:0;left:0;bottom:0;right:0;background:#111;border-radius:44px}

.ipad .ipad-container:before{width:98.9583333333%;height:98.9583333333%;position:absolute;content:"";display:block;top:.5208333333%;left:.5208333333%;border-radius:40px;background:#1e1e1e}

.ipad .ipad-container .camera{background:#3c3d3d;width:1.3020833333%;height:1.3020833333%;position:absolute;top:5.7291666667%;left:50%;margin-left:-.6510416667%;border-radius:100%}

.ipad .ipad-container .screen{width:100%;position:relative;height:100%;z-index:3;background:#fff;overflow:hidden;display:block;border-radius:1px;box-shadow:0 0 0 3px #111}

.ipad .ipad-container .home{background:#242324;border-radius:50%;width:6.5104166667%;height:6.5104166667%;height:0;padding-bottom:6.5104166667%;position:absolute;left:50%;margin-left:-3.2552083333%;bottom:2.8645833333%}

.ipad .ipad-container .home:after{width:30%;height:0;padding-bottom:30%;margin-top:-16%;margin-left:-16%;border:1px solid hsla(0,0%,100%,.1);border-radius:8%;position:absolute;display:block;content:"";top:50%;left:50%}

.ipad.landscape{padding-bottom:58.0729166667%}

.ipad.landscape .ipad-container{padding:3.2552083333% 11.71875%}

.ipad.landscape .ipad-container .camera{left:94.2708333333%;top:50%;margin-left:0;margin-top:-.6510416667%}

.ipad.landscape .ipad-container .home{top:50%;left:2.8645833333%;margin-left:0;margin-top:-3.2552083333%}

.ipad.silver .ipad-container{background:#bcbcbc}

.ipad.silver .ipad-container:before{background:#fcfcfc}

.ipad.silver .ipad-container .home{background:#fcfcfc;box-shadow:inset 0 0 0 1px #bcbcbc}

.ipad.silver .ipad-container .home:after{border:1px solid rgba(0,0,0,.2)}

.ipad img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}

/*# sourceMappingURL=features-9d04fd501eb2cfa50da5.css.map*/