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

.marvel-device .screen {
    width: 100%;
    position: relative;
    height: 100%;
    z-index: 3;
    background: white;
    overflow: hidden;
    display: block;
    border-radius: 0.01vw;
    -webkit-box-shadow: 0 0 0 0.03vw #111;
    box-shadow: 0 0 0 0.03vw #111
}

.marvel-device .top-bar,
.marvel-device .bottom-bar {
    height: 0.03vw;
    background: black;
    width: 100%;
    display: block
}

.marvel-device .middle-bar {
    width: 0.03vw;
    height: 0.04vw;
    top: 0vw;
    left: 0.9vw;
    background: black;
    position: absolute
}

.marvel-device.iphone8 {
    width: 3.75vw;
    height: 6.67vw;
    padding: 1.05vw 0.24vw;
    background: #d9dbdc;
    border-radius: 0.56vw;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.2)
}

.marvel-device.iphone8:before {
    width: calc(100% - 0.12vw);
    height: calc(100% - 0.12vw);
    position: absolute;
    top: 0.06vw;
    content: '';
    left: 0.06vw;
    border-radius: 0.5vw;
    background: #f8f8f8;
    z-index: 1
}

.marvel-device.iphone8:after {
    width: calc(100% - 0.16vw);
    height: calc(100% - 0.16vw);
    position: absolute;
    top: 0.08vw;
    content: '';
    left: 0.08vw;
    border-radius: 0.48vw;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #fff;
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #fff;
    z-index: 2
}

.marvel-device.iphone8 .home {
    border-radius: 100%;
    width: 0.68vw;
    height: 0.68vw;
    position: absolute;
    left: 50%;
    margin-left: -0.34vw;
    bottom: 0.22vw;
    z-index: 3;
    background: #303233;
    background: linear-gradient(135deg, #303233 0%, #b5b7b9 50%, #f0f2f2 69%, #303233 100%)
}

.marvel-device.iphone8 .home:before {
    background: #f8f8f8;
    position: absolute;
    content: '';
    border-radius: 100%;
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    top: 0.04vw;
    left: 0.04vw
}

.marvel-device.iphone8 .top-bar {
    height: 0.14vw;
    background: #bfbfc0;
    position: absolute;
    top: 0.68vw;
    left: 0
}

.marvel-device.iphone8 .bottom-bar {
    height: 0.14vw;
    background: #bfbfc0;
    position: absolute;
    bottom: 0.68vw;
    left: 0
}

.marvel-device.iphone8 .sleep {
    position: absolute;
    top: 1.9vw;
    right: -0.04vw;
    width: 0.04vw;
    height: 0.66vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw;
    background: #d9dbdc
}

.marvel-device.iphone8 .volume {
    position: absolute;
    left: -0.04vw;
    top: 1.88vw;
    z-index: 0;
    height: 0.66vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: #d9dbdc
}

.marvel-device.iphone8 .volume:before {
    position: absolute;
    left: 0.02vw;
    top: -0.78vw;
    height: 0.4vw;
    width: 0.02vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone8 .volume:after {
    position: absolute;
    left: 0vw;
    top: 0.82vw;
    height: 0.66vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone8 .camera {
    background: #3c3d3d;
    width: 0.12vw;
    height: 0.12vw;
    position: absolute;
    top: 0.24vw;
    left: 50%;
    margin-left: -0.06vw;
    border-radius: 100%;
    z-index: 3
}

.marvel-device.iphone8 .sensor {
    background: #3c3d3d;
    width: 0.16vw;
    height: 0.16vw;
    position: absolute;
    top: 0.49vw;
    left: 1.34vw;
    z-index: 3;
    border-radius: 100%
}

.marvel-device.iphone8 .speaker {
    background: #292728;
    width: 0.7vw;
    height: 0.06vw;
    position: absolute;
    top: 0.54vw;
    left: 50%;
    margin-left: -0.35vw;
    border-radius: 0.06vw;
    z-index: 3
}

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

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

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

.marvel-device.iphone8.gold .home {
    background: #cebba9;
    background: linear-gradient(135deg, #cebba9 0%, #f9e7d3 50%, #cebba9 100%)
}

.marvel-device.iphone8.black {
    background: #464646;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.7);
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.7)
}

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

.marvel-device.iphone8.black:after {
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #212121;
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #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, #080808 0%, #464646 50%, #080808 100%)
}

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

.marvel-device.iphone8.landscape {
    padding: 0.24vw 1.05vw;
    height: 3.75vw;
    width: 6.67vw
}

.marvel-device.iphone8.landscape .sleep {
    top: 100%;
    border-radius: 0vw 0vw 0.02vw 0.02vw;
    right: 1.9vw;
    height: 0.04vw;
    width: 0.66vw
}

.marvel-device.iphone8.landscape .volume {
    width: 0.66vw;
    height: 0.04vw;
    top: -0.04vw;
    left: calc(100% - 1.88vw - 0.66vw);
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8.landscape .volume:before {
    width: 0.4vw;
    height: 0.02vw;
    top: 0.02vw;
    right: -0.78vw;
    left: auto;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8.landscape .volume:after {
    left: -0.82vw;
    width: 0.66vw;
    height: 0.04vw;
    top: 0;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8.landscape .top-bar {
    width: 0.14vw;
    height: 100%;
    left: calc(100% - 0.68vw - 0.14vw);
    top: 0
}

.marvel-device.iphone8.landscape .bottom-bar {
    width: 0.14vw;
    height: 100%;
    left: 0.68vw;
    top: 0
}

.marvel-device.iphone8.landscape .home {
    top: 50%;
    margin-top: -0.34vw;
    margin-left: 0;
    left: 0.22vw
}

.marvel-device.iphone8.landscape .sensor {
    top: 1.34vw;
    left: calc(100% - 0.49vw - 0.16vw)
}

.marvel-device.iphone8.landscape .speaker {
    height: 0.7vw;
    width: 0.06vw;
    left: calc(100% - 0.54vw - 0.06vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.35vw
}

.marvel-device.iphone8.landscape .camera {
    left: calc(100% - 0.32vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.05vw
}

.marvel-device.iphone8plus {
    width: 4.14vw;
    height: 7.36vw;
    padding: 1.12vw 0.26vw;
    background: #d9dbdc;
    border-radius: 0.56vw;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.2)
}

.marvel-device.iphone8plus:before {
    width: calc(100% - 0.12vw);
    height: calc(100% - 0.12vw);
    position: absolute;
    top: 0.06vw;
    content: '';
    left: 0.06vw;
    border-radius: 0.5vw;
    background: #f8f8f8;
    z-index: 1
}

.marvel-device.iphone8plus:after {
    width: calc(100% - 0.16vw);
    height: calc(100% - 0.16vw);
    position: absolute;
    top: 0.08vw;
    content: '';
    left: 0.08vw;
    border-radius: 0.48vw;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #fff;
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #fff;
    z-index: 2
}

.marvel-device.iphone8plus .home {
    border-radius: 100%;
    width: 0.68vw;
    height: 0.68vw;
    position: absolute;
    left: 50%;
    margin-left: -0.34vw;
    bottom: 0.24vw;
    z-index: 3;
    background: #303233;
    background: linear-gradient(135deg, #303233 0%, #b5b7b9 50%, #f0f2f2 69%, #303233 100%)
}

.marvel-device.iphone8plus .home:before {
    background: #f8f8f8;
    position: absolute;
    content: '';
    border-radius: 100%;
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    top: 0.04vw;
    left: 0.04vw
}

.marvel-device.iphone8plus .top-bar {
    height: 0.14vw;
    background: #bfbfc0;
    position: absolute;
    top: 0.68vw;
    left: 0
}

.marvel-device.iphone8plus .bottom-bar {
    height: 0.14vw;
    background: #bfbfc0;
    position: absolute;
    bottom: 0.68vw;
    left: 0
}

.marvel-device.iphone8plus .sleep {
    position: absolute;
    top: 1.9vw;
    right: -0.04vw;
    width: 0.04vw;
    height: 0.66vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw;
    background: #d9dbdc
}

.marvel-device.iphone8plus .volume {
    position: absolute;
    left: -0.04vw;
    top: 1.88vw;
    z-index: 0;
    height: 0.66vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: #d9dbdc
}

.marvel-device.iphone8plus .volume:before {
    position: absolute;
    left: 0.02vw;
    top: -0.78vw;
    height: 0.4vw;
    width: 0.02vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone8plus .volume:after {
    position: absolute;
    left: 0vw;
    top: 0.82vw;
    height: 0.66vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone8plus .camera {
    background: #3c3d3d;
    width: 0.12vw;
    height: 0.12vw;
    position: absolute;
    top: 0.29vw;
    left: 50%;
    margin-left: -0.06vw;
    border-radius: 100%;
    z-index: 3
}

.marvel-device.iphone8plus .sensor {
    background: #3c3d3d;
    width: 0.16vw;
    height: 0.16vw;
    position: absolute;
    top: 0.54vw;
    left: 1.54vw;
    z-index: 3;
    border-radius: 100%
}

.marvel-device.iphone8plus .speaker {
    background: #292728;
    width: 0.7vw;
    height: 0.06vw;
    position: absolute;
    top: 0.59vw;
    left: 50%;
    margin-left: -0.35vw;
    border-radius: 0.06vw;
    z-index: 3
}

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

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

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

.marvel-device.iphone8plus.gold .home {
    background: #cebba9;
    background: linear-gradient(135deg, #cebba9 0%, #f9e7d3 50%, #cebba9 100%)
}

.marvel-device.iphone8plus.black {
    background: #464646;
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.7);
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.7)
}

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

.marvel-device.iphone8plus.black:after {
    -webkit-box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #212121;
    box-shadow: inset 0 0 0.03vw 0 rgba(0, 0, 0, 0.1), inset 0 0 0.06vw 0.03vw #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, #080808 0%, #464646 50%, #080808 100%)
}

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

.marvel-device.iphone8plus.landscape {
    padding: 0.26vw 1.12vw;
    height: 4.14vw;
    width: 7.36vw
}

.marvel-device.iphone8plus.landscape .sleep {
    top: 100%;
    border-radius: 0vw 0vw 0.02vw 0.02vw;
    right: 1.9vw;
    height: 0.04vw;
    width: 0.66vw
}

.marvel-device.iphone8plus.landscape .volume {
    width: 0.66vw;
    height: 0.04vw;
    top: -0.04vw;
    left: calc(100% - 1.88vw - 0.66vw);
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8plus.landscape .volume:before {
    width: 0.4vw;
    height: 0.02vw;
    top: 0.02vw;
    right: -0.78vw;
    left: auto;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8plus.landscape .volume:after {
    left: -0.82vw;
    width: 0.66vw;
    height: 0.04vw;
    top: 0;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone8plus.landscape .top-bar {
    width: 0.14vw;
    height: 100%;
    left: calc(100% - 0.68vw - 0.14vw);
    top: 0
}

.marvel-device.iphone8plus.landscape .bottom-bar {
    width: 0.14vw;
    height: 100%;
    left: 0.68vw;
    top: 0
}

.marvel-device.iphone8plus.landscape .home {
    top: 50%;
    margin-top: -0.34vw;
    margin-left: 0;
    left: 0.24vw
}

.marvel-device.iphone8plus.landscape .sensor {
    top: 1.54vw;
    left: calc(100% - 0.54vw - 0.16vw)
}

.marvel-device.iphone8plus.landscape .speaker {
    height: 0.7vw;
    width: 0.06vw;
    left: calc(100% - 0.59vw - 0.06vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.35vw
}

.marvel-device.iphone8plus.landscape .camera {
    left: calc(100% - 0.29vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.05vw
}

.marvel-device.iphone5s,
.marvel-device.iphone5c {
    padding: 1.05vw 0.22vw;
    background: #2c2b2c;
    width: 3.2vw;
    height: 5.68vw;
    border-radius: 0.5vw
}

.marvel-device.iphone5s:before,
.marvel-device.iphone5c:before {
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    position: absolute;
    top: 0.04vw;
    content: '';
    left: 0.04vw;
    border-radius: 0.46vw;
    background: #1e1e1e;
    z-index: 1
}

.marvel-device.iphone5s .sleep,
.marvel-device.iphone5c .sleep {
    position: absolute;
    top: -0.04vw;
    right: 0.6vw;
    width: 0.6vw;
    height: 0.04vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw;
    background: #282727
}

.marvel-device.iphone5s .volume,
.marvel-device.iphone5c .volume {
    position: absolute;
    left: -0.04vw;
    top: 1.8vw;
    z-index: 0;
    height: 0.27vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: #282727
}

.marvel-device.iphone5s .volume:before,
.marvel-device.iphone5c .volume:before {
    position: absolute;
    left: 0vw;
    top: -0.75vw;
    height: 0.35vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone5s .volume:after,
.marvel-device.iphone5c .volume:after {
    position: absolute;
    left: 0vw;
    bottom: -0.64vw;
    height: 0.27vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone5s .camera,
.marvel-device.iphone5c .camera {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.32vw;
    left: 50%;
    margin-left: -0.05vw;
    border-radius: 0.05vw;
    z-index: 3
}

.marvel-device.iphone5s .sensor,
.marvel-device.iphone5c .sensor {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.6vw;
    left: 1.6vw;
    z-index: 3;
    margin-left: -0.32vw;
    border-radius: 0.05vw
}

.marvel-device.iphone5s .speaker,
.marvel-device.iphone5c .speaker {
    background: #292728;
    width: 0.64vw;
    height: 0.1vw;
    position: absolute;
    top: 0.6vw;
    left: 50%;
    margin-left: -0.32vw;
    border-radius: 0.05vw;
    z-index: 3
}

.marvel-device.iphone5s.landscape,
.marvel-device.iphone5c.landscape {
    padding: 0.22vw 1.05vw;
    height: 3.2vw;
    width: 5.68vw
}

.marvel-device.iphone5s.landscape .sleep,
.marvel-device.iphone5c.landscape .sleep {
    right: -0.04vw;
    top: calc(100% - 1.2vw);
    height: 0.6vw;
    width: 0.04vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.iphone5s.landscape .volume,
.marvel-device.iphone5c.landscape .volume {
    width: 0.27vw;
    height: 0.04vw;
    top: -0.04vw;
    left: calc(100% - 1.8vw);
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone5s.landscape .volume:before,
.marvel-device.iphone5c.landscape .volume:before {
    width: 0.35vw;
    height: 0.04vw;
    top: 0vw;
    right: -0.75vw;
    left: auto;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone5s.landscape .volume:after,
.marvel-device.iphone5c.landscape .volume:after {
    bottom: 0vw;
    left: -0.64vw;
    z-index: 999;
    height: 0.04vw;
    width: 0.27vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone5s.landscape .sensor,
.marvel-device.iphone5c.landscape .sensor {
    top: 1.6vw;
    left: calc(100% - 0.6vw);
    margin-left: 0vw;
    margin-top: -0.32vw
}

.marvel-device.iphone5s.landscape .speaker,
.marvel-device.iphone5c.landscape .speaker {
    height: 0.64vw;
    width: 0.1vw;
    left: calc(100% - 0.6vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.32vw
}

.marvel-device.iphone5s.landscape .camera,
.marvel-device.iphone5c.landscape .camera {
    left: calc(100% - 0.32vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -0.05vw
}

.marvel-device.iphone5s .home {
    border-radius: 0.36vw;
    width: 0.68vw;
    -webkit-box-shadow: inset 0 0 0 0.04vw #2c2b2c;
    box-shadow: inset 0 0 0 0.04vw #2c2b2c;
    height: 0.68vw;
    position: absolute;
    left: 50%;
    margin-left: -0.34vw;
    bottom: 0.19vw;
    z-index: 3
}

.marvel-device.iphone5s .top-bar {
    top: 0.7vw;
    position: absolute;
    left: 0
}

.marvel-device.iphone5s .bottom-bar {
    bottom: 0.7vw;
    position: absolute;
    left: 0
}

.marvel-device.iphone5s.landscape .home {
    left: 0.19vw;
    bottom: 50%;
    margin-bottom: -0.34vw;
    margin-left: 0vw
}

.marvel-device.iphone5s.landscape .top-bar {
    left: 0.7vw;
    top: 0vw;
    width: 0.03vw;
    height: 100%
}

.marvel-device.iphone5s.landscape .bottom-bar {
    right: 0.7vw;
    left: auto;
    bottom: 0vw;
    width: 0.03vw;
    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 {
    -webkit-box-shadow: inset 0 0 0 0.04vw #bcbcbc;
    box-shadow: inset 0 0 0 0.04vw #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: white
}

.marvel-device.iphone5s.gold .home {
    -webkit-box-shadow: inset 0 0 0 0.04vw #f9e7d3;
    box-shadow: inset 0 0 0 0.04vw #f9e7d3
}

.marvel-device.iphone5c {
    background: white;
    -webkit-box-shadow: 0 0.01vw 0.02vw 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 0.01vw 0.02vw 0 rgba(0, 0, 0, 0.2)
}

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

.marvel-device.iphone5c .home {
    background: #242324;
    border-radius: 0.36vw;
    width: 0.68vw;
    height: 0.68vw;
    z-index: 3;
    position: absolute;
    left: 50%;
    margin-left: -0.34vw;
    bottom: 0.19vw
}

.marvel-device.iphone5c .home:after {
    width: 0.2vw;
    height: 0.2vw;
    border: 0.01vw solid rgba(255, 255, 255, 0.1);
    border-radius: 0.04vw;
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    left: 50%;
    margin-top: -0.11vw;
    margin-left: -0.11vw
}

.marvel-device.iphone5c.landscape .home {
    left: 0.19vw;
    bottom: 50%;
    margin-bottom: -0.34vw;
    margin-left: 0vw
}

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

.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: 1.29vw 0.27vw;
    width: 3.2vw;
    height: 4.8vw;
    background: #686868;
    border-radius: 0.54vw
}

.marvel-device.iphone4s:before {
    content: '';
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    position: absolute;
    top: 0.04vw;
    left: 0.04vw;
    z-index: 1;
    border-radius: 0.5vw;
    background: #1e1e1e
}

.marvel-device.iphone4s .top-bar {
    top: 0.6vw;
    position: absolute;
    left: 0
}

.marvel-device.iphone4s .bottom-bar {
    bottom: 0.9vw;
    position: absolute;
    left: 0
}

.marvel-device.iphone4s .camera {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.72vw;
    left: 1.34vw;
    z-index: 3;
    margin-left: -0.05vw;
    border-radius: 100%
}

.marvel-device.iphone4s .speaker {
    background: #292728;
    width: 0.64vw;
    height: 0.1vw;
    position: absolute;
    top: 0.72vw;
    left: 50%;
    z-index: 3;
    margin-left: -0.32vw;
    border-radius: 0.05vw
}

.marvel-device.iphone4s .sensor {
    background: #292728;
    width: 0.4vw;
    height: 0.1vw;
    position: absolute;
    top: 0.36vw;
    left: 50%;
    z-index: 3;
    margin-left: -0.2vw;
    border-radius: 0.05vw
}

.marvel-device.iphone4s .home {
    background: #242324;
    border-radius: 100%;
    width: 0.72vw;
    height: 0.72vw;
    z-index: 3;
    position: absolute;
    left: 50%;
    margin-left: -0.36vw;
    bottom: 0.3vw
}

.marvel-device.iphone4s .home:after {
    width: 0.2vw;
    height: 0.2vw;
    border: 0.01vw solid rgba(255, 255, 255, 0.1);
    border-radius: 0.04vw;
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    left: 50%;
    margin-top: -0.11vw;
    margin-left: -0.11vw
}

.marvel-device.iphone4s .sleep {
    position: absolute;
    top: -0.04vw;
    right: 0.6vw;
    width: 0.6vw;
    height: 0.04vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw;
    background: #4D4D4D
}

.marvel-device.iphone4s .volume {
    position: absolute;
    left: -0.04vw;
    top: 1.6vw;
    height: 0.27vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: #4D4D4D
}

.marvel-device.iphone4s .volume:before {
    position: absolute;
    left: 0vw;
    top: -0.7vw;
    height: 0.35vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone4s .volume:after {
    position: absolute;
    left: 0vw;
    bottom: -0.64vw;
    height: 0.27vw;
    width: 0.04vw;
    border-radius: 0.02vw 0vw 0vw 0.02vw;
    background: inherit;
    content: '';
    display: block
}

.marvel-device.iphone4s.landscape {
    padding: 0.27vw 1.29vw;
    height: 3.2vw;
    width: 4.8vw
}

.marvel-device.iphone4s.landscape .bottom-bar {
    left: 0.9vw;
    bottom: 0vw;
    height: 100%;
    width: 0.03vw
}

.marvel-device.iphone4s.landscape .top-bar {
    left: calc(100% - 0.6vw);
    top: 0vw;
    height: 100%;
    width: 0.03vw
}

.marvel-device.iphone4s.landscape .camera {
    top: 1.34vw;
    left: calc(100% - 0.72vw);
    margin-left: 0
}

.marvel-device.iphone4s.landscape .speaker {
    top: 50%;
    margin-left: 0;
    margin-top: -0.32vw;
    left: calc(100% - 0.72vw);
    width: 0.1vw;
    height: 0.64vw
}

.marvel-device.iphone4s.landscape .sensor {
    height: 0.4vw;
    width: 0.1vw;
    left: calc(100% - 0.36vw);
    top: 50%;
    margin-left: 0;
    margin-top: -0.2vw
}

.marvel-device.iphone4s.landscape .home {
    left: 0.3vw;
    bottom: 50%;
    margin-left: 0;
    margin-bottom: -0.36vw
}

.marvel-device.iphone4s.landscape .sleep {
    height: 0.6vw;
    width: 0.04vw;
    right: -0.04vw;
    top: calc(100% - 1.2vw);
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.iphone4s.landscape .volume {
    top: -0.04vw;
    left: calc(100% - 1.87vw);
    height: 0.04vw;
    width: 0.27vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone4s.landscape .volume:before {
    right: -0.7vw;
    left: auto;
    top: 0vw;
    width: 0.35vw;
    height: 0.04vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.iphone4s.landscape .volume:after {
    width: 0.27vw;
    height: 0.04vw;
    bottom: 0vw;
    left: -0.64vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

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

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

.marvel-device.iphone4s.silver .home {
    background: #fcfcfc;
    -webkit-box-shadow: inset 0 0 0 0.01vw #bcbcbc;
    box-shadow: inset 0 0 0 0.01vw #bcbcbc
}

.marvel-device.iphone4s.silver .home:after {
    border: 0.01vw solid rgba(0, 0, 0, 0.2)
}

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

.marvel-device.nexus5 {
    padding: 0.5vw 0.15vw 0.5vw 0.15vw;
    width: 3.2vw;
    height: 5.68vw;
    background: #1e1e1e;
    border-radius: 0.2vw
}

.marvel-device.nexus5:before {
    border-radius: 6vw / 0.5vw;
    background: inherit;
    content: '';
    top: 0;
    position: absolute;
    height: 103.1%;
    width: calc(100% - 0.26vw);
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.marvel-device.nexus5 .top-bar {
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.06vw);
    position: absolute;
    top: 0.03vw;
    left: 0.04vw;
    border-radius: 0.2vw;
    background: #181818
}

.marvel-device.nexus5 .top-bar:before {
    border-radius: 6vw / 0.5vw;
    background: inherit;
    content: '';
    top: 0;
    position: absolute;
    height: 103.0%;
    width: calc(100% - 0.26vw);
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

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

.marvel-device.nexus5 .sleep {
    width: 0.03vw;
    position: absolute;
    left: -0.03vw;
    top: 1.1vw;
    height: 1vw;
    background: inherit;
    border-radius: 0.02vw 0vw 0vw 0.02vw
}

.marvel-device.nexus5 .volume {
    width: 0.03vw;
    position: absolute;
    right: -0.03vw;
    top: 0.7vw;
    height: 0.45vw;
    background: inherit;
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.nexus5 .camera {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.18vw;
    left: 50%;
    z-index: 3;
    margin-left: -0.05vw;
    border-radius: 100%
}

.marvel-device.nexus5 .camera:before {
    background: #3c3d3d;
    width: 0.06vw;
    height: 0.06vw;
    content: '';
    display: block;
    position: absolute;
    top: 0.02vw;
    left: -1vw;
    z-index: 3;
    border-radius: 100%
}

.marvel-device.nexus5.landscape {
    padding: 0.15vw 0.5vw 0.15vw 0.5vw;
    height: 3.2vw;
    width: 5.68vw
}

.marvel-device.nexus5.landscape:before {
    width: 103.1%;
    height: calc(100% - 0.26vw);
    border-radius: 0.5vw / 6vw
}

.marvel-device.nexus5.landscape .top-bar {
    left: 0.03vw;
    top: 0.04vw;
    height: calc(100% - 0.08vw);
    width: calc(100% - 0.06vw)
}

.marvel-device.nexus5.landscape .top-bar:before {
    width: 103%;
    height: calc(100% - 0.26vw);
    border-radius: 0.5vw / 6vw
}

.marvel-device.nexus5.landscape .sleep {
    height: 0.03vw;
    width: 1vw;
    left: calc(100% - 2.1vw);
    top: -0.03vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.nexus5.landscape .volume {
    height: 0.03vw;
    width: 0.45vw;
    right: 0.7vw;
    top: 100%;
    border-radius: 0vw 0vw 0.02vw 0.02vw
}

.marvel-device.nexus5.landscape .camera {
    top: 50%;
    left: calc(100% - 0.18vw);
    margin-left: 0;
    margin-top: -0.05vw
}

.marvel-device.nexus5.landscape .camera:before {
    top: -1vw;
    left: 0.02vw
}

.marvel-device.s5 {
    padding: 0.6vw 0.18vw;
    border-radius: 0.42vw;
    width: 3.2vw;
    height: 5.68vw;
    background: #bcbcbc
}

.marvel-device.s5:before,
.marvel-device.s5:after {
    width: calc(100% - 0.52vw);
    content: '';
    display: block;
    height: 0.26vw;
    background: inherit;
    position: absolute;
    border-radius: 5vw / 0.4vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.marvel-device.s5:before {
    top: -0.07vw
}

.marvel-device.s5:after {
    bottom: -0.07vw
}

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

.marvel-device.s5 .top-bar {
    border-radius: 0.37vw;
    width: calc(100% - 0.1vw);
    height: calc(100% - 0.1vw);
    top: 0.05vw;
    left: 0.05vw;
    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%) 0.03vw 0.03vw;
    background-color: white;
    background-size: 0.04vw 0.04vw;
    background-position: center;
    z-index: 2;
    position: absolute
}

.marvel-device.s5 .top-bar:before,
.marvel-device.s5 .top-bar:after {
    width: calc(100% - 0.48vw);
    content: '';
    display: block;
    height: 0.26vw;
    background: inherit;
    position: absolute;
    border-radius: 5vw / 0.4vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.marvel-device.s5 .top-bar:before {
    top: -0.07vw
}

.marvel-device.s5 .top-bar:after {
    bottom: -0.07vw
}

.marvel-device.s5 .sleep {
    width: 0.03vw;
    position: absolute;
    left: -0.03vw;
    top: 1vw;
    height: 1vw;
    background: #cecece;
    border-radius: 0.02vw 0vw 0vw 0.02vw
}

.marvel-device.s5 .speaker {
    width: 0.68vw;
    height: 0.08vw;
    position: absolute;
    top: 0.2vw;
    display: block;
    z-index: 3;
    left: 50%;
    margin-left: -0.34vw;
    background-color: #bcbcbc;
    background-position: top left;
    border-radius: 0.04vw
}

.marvel-device.s5 .sensor {
    display: block;
    position: absolute;
    top: 0.2vw;
    right: 1.1vw;
    background: #3c3d3d;
    border-radius: 100%;
    width: 0.08vw;
    height: 0.08vw;
    z-index: 3
}

.marvel-device.s5 .sensor:after {
    display: block;
    content: '';
    position: absolute;
    top: 0vw;
    right: 0.12vw;
    background: #3c3d3d;
    border-radius: 100%;
    width: 0.08vw;
    height: 0.08vw;
    z-index: 3
}

.marvel-device.s5 .camera {
    display: block;
    position: absolute;
    top: 0.24vw;
    right: 0.42vw;
    background: black;
    border-radius: 100%;
    width: 0.1vw;
    height: 0.1vw;
    z-index: 3
}

.marvel-device.s5 .camera:before {
    width: 0.04vw;
    height: 0.04vw;
    background: #3c3d3d;
    border-radius: 100%;
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    margin-top: -0.02vw;
    margin-left: -0.02vw
}

.marvel-device.s5 .home {
    position: absolute;
    z-index: 3;
    bottom: 0.17vw;
    left: 50%;
    width: 0.7vw;
    height: 0.2vw;
    background: white;
    border-radius: 0.18vw;
    display: block;
    margin-left: -0.35vw;
    border: 0.02vw solid black
}

.marvel-device.s5.landscape {
    padding: 0.18vw 0.6vw;
    height: 3.2vw;
    width: 5.68vw
}

.marvel-device.s5.landscape:before,
.marvel-device.s5.landscape:after {
    height: calc(100% - 0.52vw);
    width: 0.26vw;
    border-radius: 0.4vw / 5vw;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.marvel-device.s5.landscape:before {
    top: 50%;
    left: -0.07vw
}

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

.marvel-device.s5.landscape .top-bar:before,
.marvel-device.s5.landscape .top-bar:after {
    width: 0.26vw;
    height: calc(100% - 0.48vw);
    border-radius: 0.4vw / 5vw;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

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

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

.marvel-device.s5.landscape .sleep {
    height: 0.03vw;
    width: 1vw;
    left: calc(100% - 2vw);
    top: -0.03vw;
    border-radius: 0.02vw 0.02vw 0vw 0vw
}

.marvel-device.s5.landscape .speaker {
    height: 0.68vw;
    width: 0.08vw;
    left: calc(100% - 0.2vw);
    top: 50%;
    margin-left: 0;
    margin-top: -0.34vw
}

.marvel-device.s5.landscape .sensor {
    right: 0.2vw;
    top: calc(100% - 1.1vw)
}

.marvel-device.s5.landscape .sensor:after {
    left: -0.12vw;
    right: 0vw
}

.marvel-device.s5.landscape .camera {
    top: calc(100% - 0.42vw);
    right: 0.24vw
}

.marvel-device.s5.landscape .home {
    width: 0.2vw;
    height: 0.7vw;
    bottom: 50%;
    margin-bottom: -0.35vw;
    margin-left: 0;
    left: 0.17vw
}

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

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

.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%) 0.03vw 0.03vw;
    background-color: #2c2b2c;
    background-size: 0.04vw 0.04vw
}

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

.marvel-device.lumia920 {
    padding: 0.8vw 0.35vw 1.25vw 0.35vw;
    background: #ffdd00;
    width: 3.2vw;
    height: 5.33vw;
    border-radius: 0.4vw / 0.03vw
}

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

.marvel-device.lumia920 .top-bar {
    width: calc(100% - 0.24vw);
    height: calc(100% - 0.32vw);
    position: absolute;
    top: 0.16vw;
    left: 0.12vw;
    border-radius: 0.24vw;
    background: black;
    z-index: 1
}

.marvel-device.lumia920 .top-bar:before {
    background: #1e1e1e;
    display: block;
    content: '';
    width: calc(100% - 0.04vw);
    height: calc(100% - 0.04vw);
    top: 0.02vw;
    left: 0.02vw;
    position: absolute;
    border-radius: 0.22vw
}

.marvel-device.lumia920 .volume {
    width: 0.03vw;
    position: absolute;
    top: 1.3vw;
    height: 1vw;
    background: #1e1e1e;
    right: -0.03vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.lumia920 .volume:before {
    width: 0.03vw;
    position: absolute;
    top: 1.9vw;
    content: '';
    display: block;
    height: 0.5vw;
    background: inherit;
    right: 0vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.lumia920 .volume:after {
    width: 0.03vw;
    position: absolute;
    top: 4.6vw;
    content: '';
    display: block;
    height: 0.5vw;
    background: inherit;
    right: 0vw;
    border-radius: 0vw 0.02vw 0.02vw 0vw
}

.marvel-device.lumia920 .camera {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.34vw;
    right: 1.3vw;
    z-index: 5;
    border-radius: 0.05vw
}

.marvel-device.lumia920 .speaker {
    background: #292728;
    width: 0.64vw;
    height: 0.1vw;
    position: absolute;
    top: 0.38vw;
    left: 50%;
    margin-left: -0.32vw;
    border-radius: 0.05vw;
    z-index: 3
}

.marvel-device.lumia920.landscape {
    padding: 0.35vw 0.8vw 0.35vw 1.25vw;
    height: 3.2vw;
    width: 5.68vw;
    border-radius: 0.02vw / 1vw
}

.marvel-device.lumia920.landscape .top-bar {
    height: calc(100% - 0.24vw);
    width: calc(100% - 0.32vw);
    left: 0.16vw;
    top: 0.12vw
}

.marvel-device.lumia920.landscape .volume {
    height: 0.03vw;
    right: 1.3vw;
    width: 1vw;
    top: 100%;
    border-radius: 0vw 0vw 0.02vw 0.02vw
}

.marvel-device.lumia920.landscape .volume:before {
    height: 0.03vw;
    right: 1.9vw;
    top: 0vw;
    width: 0.5vw;
    border-radius: 0vw 0vw 0.02vw 0.02vw
}

.marvel-device.lumia920.landscape .volume:after {
    height: 0.03vw;
    right: 4.3vw;
    top: 0vw;
    width: 0.5vw;
    border-radius: 0vw 0vw 0.02vw 0.02vw
}

.marvel-device.lumia920.landscape .camera {
    right: 0.3vw;
    top: calc(100% - 1.4vw)
}

.marvel-device.lumia920.landscape .speaker {
    width: 0.1vw;
    height: 0.64vw;
    top: 50%;
    margin-left: 0;
    margin-top: -0.32vw;
    left: calc(100% - 0.48vw)
}

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

.marvel-device.lumia920.white {
    background: white;
    -webkit-box-shadow: 0 0.01vw 0.02vw 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 0.01vw 0.02vw 0 rgba(0, 0, 0, 0.2)
}

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

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

.marvel-device.htc-one {
    padding: 0.72vw 0.25vw 1vw 0.25vw;
    width: 3.2vw;
    height: 5.68vw;
    background: #bebebe;
    border-radius: 0.34vw
}

.marvel-device.htc-one:before {
    content: '';
    display: block;
    width: calc(100% - 0.04vw);
    height: calc(100% - 0.04vw);
    position: absolute;
    top: 0.02vw;
    left: 0.02vw;
    background: #adadad;
    border-radius: 0.32vw
}

.marvel-device.htc-one:after {
    content: '';
    display: block;
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    position: absolute;
    top: 0.04vw;
    left: 0.04vw;
    background: #eeeeee;
    border-radius: 0.3vw
}

.marvel-device.htc-one .top-bar {
    width: calc(100% - 0.04vw);
    height: 6.35vw;
    position: absolute;
    background: #424242;
    top: 0.5vw;
    z-index: 1;
    left: 0.02vw
}

.marvel-device.htc-one .top-bar:before {
    content: '';
    position: absolute;
    width: calc(100% - 0.04vw);
    height: 100%;
    position: absolute;
    background: black;
    top: 0vw;
    z-index: 1;
    left: 0.02vw
}

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

.marvel-device.htc-one .speaker {
    height: 0.16vw;
    width: 2.16vw;
    display: block;
    position: absolute;
    top: 0.22vw;
    z-index: 2;
    left: 50%;
    margin-left: -1.08vw;
    background: radial-gradient(#343434 25%, transparent 50%) 0 0, radial-gradient(#343434 25%, transparent 50%) 0.04vw 0.04vw;
    background-size: 0.04vw 0.04vw;
    background-position: top left
}

.marvel-device.htc-one .speaker:after {
    content: '';
    height: 0.16vw;
    width: 2.16vw;
    display: block;
    position: absolute;
    top: 6.76vw;
    z-index: 2;
    left: 50%;
    margin-left: -1.08vw;
    background: inherit
}

.marvel-device.htc-one .camera {
    display: block;
    position: absolute;
    top: 0.18vw;
    right: 0.38vw;
    background: #3c3d3d;
    border-radius: 100%;
    width: 0.24vw;
    height: 0.24vw;
    z-index: 3
}

.marvel-device.htc-one .camera:before {
    width: 0.08vw;
    height: 0.08vw;
    background: black;
    border-radius: 100%;
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    margin-top: -0.04vw;
    margin-left: -0.04vw
}

.marvel-device.htc-one .sensor {
    display: block;
    position: absolute;
    top: 0.29vw;
    left: 0.6vw;
    background: #3c3d3d;
    border-radius: 100%;
    width: 0.08vw;
    height: 0.08vw;
    z-index: 3
}

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

.marvel-device.htc-one.landscape {
    padding: 0.25vw 0.72vw 0.25vw 1vw;
    height: 3.2vw;
    width: 5.68vw
}

.marvel-device.htc-one.landscape .top-bar {
    height: calc(100% - 0.04vw);
    width: 6.35vw;
    left: calc(100% - 6.85vw);
    top: 0.02vw
}

.marvel-device.htc-one.landscape .speaker {
    width: 0.16vw;
    height: 2.16vw;
    left: calc(100% - 0.38vw);
    top: 50%;
    margin-left: 0vw;
    margin-top: -1.08vw
}

.marvel-device.htc-one.landscape .speaker:after {
    width: 0.16vw;
    height: 2.16vw;
    left: calc(100% - 6.92vw);
    top: 50%;
    margin-left: 0;
    margin-top: -1.08vw
}

.marvel-device.htc-one.landscape .camera {
    right: 0.18vw;
    top: calc(100% - 0.38vw)
}

.marvel-device.htc-one.landscape .sensor {
    left: calc(100% - 0.29vw);
    top: 0.6vw
}

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

.marvel-device.ipad {
    width: 5.76vw;
    height: 7.68vw;
    padding: 0.9vw 0.25vw;
    background: #242324;
    border-radius: 0.44vw
}

.marvel-device.ipad:before {
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    position: absolute;
    content: '';
    display: block;
    top: 0.04vw;
    left: 0.04vw;
    border-radius: 0.4vw;
    background: #1e1e1e
}

.marvel-device.ipad .camera {
    background: #3c3d3d;
    width: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.44vw;
    left: 50%;
    margin-left: -0.05vw;
    border-radius: 100%
}

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

.marvel-device.ipad .home {
    background: #242324;
    border-radius: 0.36vw;
    width: 0.5vw;
    height: 0.5vw;
    position: absolute;
    left: 50%;
    margin-left: -0.25vw;
    bottom: 0.22vw
}

.marvel-device.ipad .home:after {
    width: 0.15vw;
    height: 0.15vw;
    margin-top: -0.08vw;
    margin-left: -0.08vw;
    border: 0.01vw solid rgba(255, 255, 255, 0.1);
    border-radius: 0.04vw;
    position: absolute;
    display: block;
    content: '';
    top: 50%;
    left: 50%
}

.marvel-device.ipad.landscape {
    height: 5.76vw;
    width: 7.68vw;
    padding: 0.25vw 0.9vw
}

.marvel-device.ipad.landscape .camera {
    left: calc(100% - 0.44vw);
    top: 50%;
    margin-left: 0;
    margin-top: -0.05vw
}

.marvel-device.ipad.landscape .home {
    top: 50%;
    left: 0.22vw;
    margin-left: 0;
    margin-top: -0.25vw
}

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

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

.marvel-device.ipad.silver .home {
    background: #fcfcfc;
    -webkit-box-shadow: inset 0 0 0 0.01vw #bcbcbc;
    box-shadow: inset 0 0 0 0.01vw #bcbcbc
}

.marvel-device.ipad.silver .home:after {
    border: 0.01vw solid rgba(0, 0, 0, 0.2)
}

.marvel-device.macbook {
    width: 9.6vw;
    height: 6vw;
    padding: 0.44vw 0.44vw 0.76vw;
    margin: 0 auto;
    background: #bebebe;
    border-radius: 0.34vw
}

.marvel-device.macbook:before {
    width: calc(100% - 0.08vw);
    height: calc(100% - 0.08vw);
    position: absolute;
    content: '';
    display: block;
    top: 0.04vw;
    left: 0.04vw;
    border-radius: 0.3vw;
    background: #1e1e1e
}

.marvel-device.macbook .top-bar {
    width: calc(100% + 2 * 0.7vw);
    height: 0.4vw;
    position: absolute;
    content: '';
    display: block;
    top: 6.8vw;
    left: -0.7vw;
    border-bottom-left-radius: 0.9vw 0.18vw;
    border-bottom-right-radius: 0.9vw 0.18vw;
    background: #bebebe;
    -webkit-box-shadow: inset 0vw -0.04vw 0.13vw 0.03vw rgba(34, 34, 34, 0.6);
    box-shadow: inset 0vw -0.04vw 0.13vw 0.03vw rgba(34, 34, 34, 0.6)
}

.marvel-device.macbook .top-bar:before {
    width: 100%;
    height: 0.24vw;
    content: '';
    display: block;
    top: 0;
    left: 0;
    background: #f0f0f0;
    
    border-radius: 0.05vw;
    position: relative
}

.marvel-device.macbook .top-bar:after {
    width: 16%;
    height: 0.14vw;
    content: '';
    display: block;
    top: 0;
    background: #ddd;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    border-radius: 0 0 0.2vw 0.2vw;
    -webkit-box-shadow: inset 0vw -0.03vw 0.1vw #999;
    box-shadow: inset 0vw -0.03vw 0.1vw #999
}

.marvel-device.macbook .bottom-bar {
    background: transparent;
    width: calc(100% + 2 * 0.7vw);
    height: 0.26vw;
    position: absolute;
    content: '';
    display: block;
    top: 6.8vw;
    left: -0.7vw
}

.marvel-device.macbook .bottom-bar:before,
.marvel-device.macbook .bottom-bar:after {
    height: calc(100% - 0.02vw);
    width: 0.8vw;
    content: '';
    display: block;
    top: 0;
    position: absolute
}

.marvel-device.macbook .bottom-bar:before {
    left: 0;
    background: #f0f0f0;
    background: -webkit-gradient(linear, left top, right top, from(#747474), color-stop(5%, #c3c3c3), color-stop(14%, #ebebeb), color-stop(41%, #979797), color-stop(80%, #f0f0f0), color-stop(100%, #f0f0f0), to(#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: -webkit-gradient(linear, left top, right top, from(#f0f0f0), color-stop(0%, #f0f0f0), color-stop(20%, #f0f0f0), color-stop(59%, #979797), color-stop(86%, #ebebeb), color-stop(95%, #c3c3c3), to(#747474));
    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: 0.1vw;
    height: 0.1vw;
    position: absolute;
    top: 0.2vw;
    left: 50%;
    margin-left: -0.05vw;
    border-radius: 100%
}

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

.marvel-device.iphone-x {
    width: 3.75vw;
    height: 8.12vw;
    padding: 0.26vw;
    background: #fdfdfd;
    -webkit-box-shadow: inset 0 0 0.11vw 0 black;
    box-shadow: inset 0 0 0.11vw 0 black;
    border-radius: 0.66vw
}

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

.marvel-device.iphone-x .shadow {
    border-radius: 100%;
    width: 0.9vw;
    height: 0.9vw;
    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: -0.2vw;
    left: -0.2vw
}

.marvel-device.iphone-x .shadow--tr {
    top: -0.2vw;
    right: -0.2vw
}

.marvel-device.iphone-x .shadow--bl {
    bottom: -0.2vw;
    left: -0.2vw
}

.marvel-device.iphone-x .shadow--br {
    bottom: -0.2vw;
    right: -0.2vw
}

.marvel-device.iphone-x:before {
    width: calc(100% - 0.1vw);
    height: calc(100% - 0.1vw);
    position: absolute;
    top: 0.05vw;
    content: '';
    left: 0.05vw;
    border-radius: 0.61vw;
    background: black;
    z-index: 1
}

.marvel-device.iphone-x .inner-shadow {
    width: calc(100% - 0.2vw);
    height: calc(100% - 0.2vw);
    position: absolute;
    top: 0.1vw;
    overflow: hidden;
    left: 0.1vw;
    border-radius: 0.56vw;
    -webkit-box-shadow: inset 0 0 0.15vw 0 rgba(255, 255, 255, 0.66);
    box-shadow: inset 0 0 0.15vw 0 rgba(255, 255, 255, 0.66);
    z-index: 1
}

.marvel-device.iphone-x .inner-shadow:before {
    -webkit-box-shadow: inset 0 0 0.2vw 0 #FFFFFF;
    box-shadow: inset 0 0 0.2vw 0 #FFFFFF;
    width: 100%;
    height: 116%;
    position: absolute;
    top: -8%;
    content: '';
    left: 0;
    border-radius: 2vw / 1.12vw;
    z-index: 2
}

.marvel-device.iphone-x .screen {
    border-radius: 0.4vw;
    -webkit-box-shadow: none;
    box-shadow: none
}

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

.marvel-device.iphone-x .top-bar {
    top: 0.8vw
}

.marvel-device.iphone-x .bottom-bar {
    bottom: 0.8vw
}

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

.marvel-device.iphone-x .volume {
    left: -0.03vw;
    top: 1.16vw;
    height: 0.32vw
}

.marvel-device.iphone-x .volume:before {
    height: 0.62vw;
    top: 0.62vw;
    content: '';
    left: 0
}

.marvel-device.iphone-x .volume:after {
    height: 0.62vw;
    top: 1.4vw;
    content: '';
    left: 0
}

.marvel-device.iphone-x .sleep {
    height: 0.96vw;
    top: 2vw;
    right: -0.03vw
}

.marvel-device.iphone-x .camera {
    width: 0.06vw;
    height: 0.06vw;
    top: 0.09vw;
    border-radius: 100%;
    position: absolute;
    left: 1.54vw;
    background: #0d4d71
}

.marvel-device.iphone-x .speaker {
    height: 0.06vw;
    width: 0.6vw;
    left: 50%;
    position: absolute;
    top: 0.09vw;
    margin-left: -0.3vw;
    background: #171818;
    border-radius: 0.06vw
}

.marvel-device.iphone-x .notch {
    position: absolute;
    width: 2.1vw;
    height: 0.3vw;
    top: 0.26vw;
    left: 1.08vw;
    z-index: 4;
    background: black;
    border-bottom-left-radius: 0.24vw;
    border-bottom-right-radius: 0.24vw
}

.marvel-device.iphone-x .notch:before,
.marvel-device.iphone-x .notch:after {
    content: '';
    height: 0.08vw;
    position: absolute;
    top: 0;
    width: 0.08vw
}

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

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

.marvel-device.iphone-x.landscape {
    height: 3.75vw;
    width: 8.12vw
}

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

.marvel-device.iphone-x.landscape .top-bar {
    left: 0.8vw
}

.marvel-device.iphone-x.landscape .bottom-bar {
    right: 0.8vw;
    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: 0.03vw
}

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

.marvel-device.iphone-x.landscape .volume {
    bottom: -0.03vw;
    top: auto;
    left: 1.16vw;
    width: 0.32vw
}

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

.marvel-device.iphone-x.landscape .volume:after {
    width: 0.62vw;
    left: 1.4vw;
    top: 0
}

.marvel-device.iphone-x.landscape .sleep {
    width: 0.96vw;
    left: 2vw;
    top: -0.03vw;
    right: auto
}

.marvel-device.iphone-x.landscape .camera {
    left: 0.09vw;
    bottom: 1.54vw;
    top: auto
}

.marvel-device.iphone-x.landscape .speaker {
    width: 0.06vw;
    height: 0.6vw;
    left: 0.09vw;
    top: 50%;
    margin-top: -0.3vw;
    margin-left: 0
}

.marvel-device.iphone-x.landscape .notch {
    height: 2.1vw;
    width: 0.3vw;
    left: 0.26vw;
    bottom: 1.08vw;
    top: auto;
    border-top-right-radius: 0.24vw;
    border-bottom-right-radius: 0.24vw;
    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: -0.08vw;
    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: -0.08vw
}

.marvel-device.note8 {
    width: 4vw;
    height: 8.22vw;
    background: black;
    border-radius: 0.34vw;
    padding: 0.45vw 0.1vw
}

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

.marvel-device.note8 .speaker {
    height: 0.08vw;
    width: 0.56vw;
    left: 50%;
    position: absolute;
    top: 0.25vw;
    margin-left: -0.28vw;
    background: #171818;
    z-index: 1;
    border-radius: 0.08vw
}

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

.marvel-device.note8 .camera:before {
    content: '';
    height: 0.08vw;
    width: 0.08vw;
    left: -0.22vw;
    position: absolute;
    top: 0.05vw;
    background: #212b36;
    z-index: 1;
    border-radius: 100%
}

.marvel-device.note8 .sensors {
    height: 0.1vw;
    width: 0.1vw;
    left: 1.2vw;
    position: absolute;
    top: 0.22vw;
    background: #1d233b;
    z-index: 1;
    border-radius: 100%
}

.marvel-device.note8 .sensors:before {
    content: '';
    height: 0.1vw;
    width: 0.1vw;
    left: 0.18vw;
    position: absolute;
    top: 0;
    background: #1d233b;
    z-index: 1;
    border-radius: 100%
}

.marvel-device.note8 .more-sensors {
    height: 0.16vw;
    width: 0.16vw;
    left: 2.85vw;
    position: absolute;
    top: 0.18vw;
    background: #33244a;
    -webkit-box-shadow: 0 0 0 0.02vw rgba(255, 255, 255, 0.1);
    box-shadow: 0 0 0 0.02vw rgba(255, 255, 255, 0.1);
    z-index: 1;
    border-radius: 100%
}

.marvel-device.note8 .more-sensors:before {
    content: '';
    height: 0.11vw;
    width: 0.11vw;
    left: 0.4vw;
    position: absolute;
    top: 0.04vw;
    background: #214a61;
    z-index: 1;
    border-radius: 100%
}

.marvel-device.note8 .sleep {
    width: 0.02vw;
    height: 0.56vw;
    background: black;
    position: absolute;
    top: 2.88vw;
    right: -0.02vw
}

.marvel-device.note8 .volume {
    width: 0.02vw;
    height: 1.2vw;
    background: black;
    position: absolute;
    top: 1.68vw;
    left: -0.02vw
}

.marvel-device.note8 .volume:before {
    content: '';
    top: 1.68vw;
    width: 0.02vw;
    position: absolute;
    left: 0;
    background: black;
    height: 0.56vw
}

.marvel-device.note8 .inner {
    width: 100%;
    height: calc(100% - 0.08vw);
    position: absolute;
    top: 0.02vw;
    content: '';
    left: 0vw;
    border-radius: 0.34vw;
    border-top: 0.02vw solid #9fa0a2;
    border-bottom: 0.02vw solid #9fa0a2;
    background: black;
    z-index: 1;
    -webkit-box-shadow: inset 0 0 0.06vw 0 rgba(255, 255, 255, 0.5);
    box-shadow: inset 0 0 0.06vw 0 rgba(255, 255, 255, 0.5)
}

.marvel-device.note8 .shadow {
    -webkit-box-shadow: inset 0 0 0.6vw 0 white, inset 0 0 0.3vw 0 rgba(255, 255, 255, 0.5), 0 0 0.2vw 0 white, 0 0 0.2vw 0 rgba(255, 255, 255, 0.5);
    box-shadow: inset 0 0 0.6vw 0 white, inset 0 0 0.3vw 0 rgba(255, 255, 255, 0.5), 0 0 0.2vw 0 white, 0 0 0.2vw 0 rgba(255, 255, 255, 0.5);
    height: 101%;
    position: absolute;
    top: -0.5%;
    content: '';
    width: calc(100% - 0.2vw);
    left: 0.1vw;
    border-radius: 0.38vw;
    z-index: 5;
    pointer-events: none
}

.marvel-device.note8 .screen {
    border-radius: 0.14vw;
    -webkit-box-shadow: none;
    box-shadow: none
}

.marvel-device.note8.landscape {
    height: 4vw;
    width: 8.22vw;
    padding: 0.1vw 0.45vw
}

.marvel-device.note8.landscape .speaker {
    height: 0.56vw;
    width: 0.08vw;
    top: 50%;
    margin-top: -0.28vw;
    margin-left: 0;
    right: 0.25vw;
    left: auto
}

.marvel-device.note8.landscape .camera {
    top: 0.86vw;
    right: 0.18vw;
    left: auto
}

.marvel-device.note8.landscape .camera:before {
    top: -0.22vw;
    left: 0.05vw
}

.marvel-device.note8.landscape .sensors {
    top: 1.2vw;
    right: 0.22vw;
    left: auto
}

.marvel-device.note8.landscape .sensors:before {
    top: 0.18vw;
    left: 0
}

.marvel-device.note8.landscape .more-sensors {
    top: 2.85vw;
    right: 0.18vw;
    left: auto
}

.marvel-device.note8.landscape .more-sensors:before {
    top: 0.4vw;
    left: 0.04vw
}

.marvel-device.note8.landscape .sleep {
    bottom: -0.02vw;
    top: auto;
    right: 2.88vw;
    width: 0.56vw;
    height: 0.02vw
}

.marvel-device.note8.landscape .volume {
    width: 1.2vw;
    height: 0.02vw;
    top: -0.02vw;
    right: 1.68vw;
    left: auto
}

.marvel-device.note8.landscape .volume:before {
    right: 1.68vw;
    left: auto;
    top: 0;
    width: 0.56vw;
    height: 0.02vw
}

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

.marvel-device.note8.landscape .shadow {
    width: 101%;
    height: calc(100% - 0.2vw);
    left: -0.5%;
    top: 0.1vw
}
