.request-device span {
  display: block;
  padding: .5em 0;
}
.row-fluid .phone-block.request-device {
  background: #3498db;
  color: #fff;
  bottom: 0;
  right: 0;
  margin-bottom: 20px;
  position: relative;
  display: table;
}
.row-fluid .phone-block.request-device > div {
  padding: 0 30px;
  text-align: center;
  margin: 0;
  display: table-cell;
  vertical-align: middle;
}
.row-fluid .phone-block.request-device > div span {
  display: block;
  padding: 1em 0;
}
.row-fluid .phone-block.request-device > div .highlight {
  font-size: 1.2em;
  line-height: 1.5em;
}
.row-fluid .phone-block.request-device .btn,
.row-fluid .phone-block.request-device .btn:hover,
.row-fluid .phone-block.request-device .btn:focus,
.row-fluid .phone-block.request-device .btn:active,
.row-fluid .phone-block.request-device .btn .btn.active {
  background: #fff;
  color: #3498db;
}
.row-fluid .phone-block.request-device .close {
  position: absolute;
  top: 0;
  right: 5px;
  font-size: 30px;
}
footer {
  background: #000;
  color: #fff;
  padding: 60px 0;
}
footer a {
  color: #fff;
  text-decoration: none;
}
footer a:hover {
  color: #fff;
}
footer .oursky-logo {
  width: 100px;
}
footer .external-link {
  width: 85px;
  float: right;
  display: inline-block;
  text-align: center;
}
footer .external-link img {
  width: 62px;
}
footer .internal-link {
  margin: 10px;
}
footer .internal-link:first-of-type {
  margin-left: 0px;
}
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}
#container-wrap {
  min-height: 100%;
  position: relative;
  overflow: hidden;
}
#container-wrap > .container {
  padding-bottom: 300px;
  padding-top: 20px;
}
.container {
  position: relative;
}
.btn {
  color: #fff;
  font-weight: bold;
  text-shadow: none;
  background: #3498db;
  border-color: #3498db;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}
.btn:hover,
.btn:focus,
.btn:active,
.btn .btn.active {
  color: #fff;
  background: #3498db;
}
.progress {
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
.progress-striped .bar {
  background-color: #3498db;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  font-size: 11px;
}
.left-icon-add {
  background: url(../images/icon-add.png) no-repeat 5px center;
  padding-left: 34px;
}
.left-icon-download {
  background: url(../images/icon-download.png) no-repeat 5px center;
  padding-left: 39px;
}
.submit-mockup {
  text-align: center;
  margin: 0 auto 20px;
}
#email-subscription-modal {
  width: 660px;
  margin-left: -330px;
}
#email-subscription-modal .modal-body {
  max-height: none;
  display: table;
}
#email-subscription-modal .modal-body .dismiss {
  position: absolute;
  right: 15px;
  bottom: 15px;
}
#email-subscription-modal .modal-body h4 {
  font-size: 24px;
  line-height: 28px;
  font-weight: normal;
  margin: 0 0 84px 0;
}
#email-subscription-modal .modal-body p {
  margin-bottom: 8px;
}
#email-subscription-modal .modal-left {
  float: left;
  width: 300px;
}
#email-subscription-modal .modal-left img {
  border-radius: 10px;
}
#email-subscription-modal .modal-right {
  padding-left: 20px;
  display: table-cell;
  vertical-align: middle;
}
#shotbot-modal .modal-body {
  max-height: 500px;
  padding: 5px;
}
#shotbot-modal .shotbot-hide {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
#email-subscription-modal form,
#download-modal form {
  margin-bottom: 0;
}
#email-subscription-modal form input,
#download-modal form input,
#email-subscription-modal form button,
#download-modal form button {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
#email-subscription-modal form button,
#download-modal form button {
  margin-top: 10px;
}
#email-subscription-modal form label,
#download-modal form label {
  display: inline-block;
  margin-left: 10px;
}
.static-page {
  padding-bottom: 30px;
}
.static-page .title {
  margin-bottom: 20px;
}
.static-page .content {
  margin-bottom: 30px;
}
.static-page .content h2 {
  font-size: 17.5px;
  line-height: 20px;
}
.static-page .content p {
  margin-bottom: 20px;
  text-align: justify;
}
.static-page ul {
  margin-bottom: 20px;
}
.device-list-page .model-name,
.device-list-page .color,
.device-list-page .available-perspectives {
  width: 150px;
}
.cycle-pics {
  width: 296px;
  height: 296px;
  padding: 0;
  margin: 0 auto;
  overflow: hidden;
}
.cycle-pics img {
  padding: 0;
  border: none;
  background-color: transparent;
  width: 296px;
  height: 296px;
  top: 0;
  left: 0;
}
.phone-block.request-device {
  height: 296px;
  width: 100%;
  padding: 0;
}
@media (min-width: 1200px) {
  .cycle-pics,
  .phone-block.request-device {
    width: 370px;
    height: 370px;
  }
  .cycle-pics img {
    width: 370px;
    height: 370px;
  }
  .row-fluid .phone-block.request-device {
    font-size: 1.5em;
  }
}
@media (max-width: 979px) {
  .cycle-pics,
  .phone-block.request-device {
    height: 228px;
  }
  .cycle-pics {
    width: 228px;
    height: 228px;
  }
  .cycle-pics img {
    width: 228px;
    height: 228px;
  }
}
@media (max-width: 767px) {
  .container {
    padding: 0 20px;
  }
  footer {
    text-align: center;
  }
  footer .external-link {
    margin-top: 20px;
    float: none;
  }
}
h1.tagline {
  width: 100%;
  padding-top: 14px;
  padding-bottom: 12px;
  text-align: center;
  font-family: freight-sans-pro;
  font-weight: 500;
  font-size: 48px;
  line-height: 52px;
  text-shadow: 0 0 4px #999;
  color: #fff;
}
@media (max-width: 767px) {
  h1.tagline {
    font-size: 28px;
    line-height: 32px;
  }
}
h2.sub-tagline {
  width: 100%;
  padding-bottom: 12px;
  text-align: center;
  font-family: freight-sans-pro;
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: #eee;
}
@media (max-width: 767px) {
  h2.sub-tagline {
    font-size: 12px;
    line-height: 16px;
  }
}
.social {
  text-align: center;
}
.social ul {
  list-style: none;
}
.social ul li {
  display: inline-block;
  line-height: 11px;
}
@-webkit-keyframes bummer {
  100% {
    -webkit-transform: scale(1, 1);
  }
}
@keyframes bummer {
  100% {
    transform: scale(1, 1);
  }
}
.banner {
  width: 100%;
  max-width: 1200px;
  -webkit-animation: bummer 0.6s;
  animation: bummer 0.6s;
  -webkit-transform: scale(0.8, 0.8);
  transform: scale(0.8, 0.8);
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
.hero {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top right, rgba(255, 255, 255, 0.4) 0%, rgba(0, 0, 0, 0.4) 120%) #dcdcdc;
  background-blend-mode: multiply,multiply;
  padding: 40px;
  text-align: center;
}
.hero a.try-new-phone-button {
  padding: 10px 20px;
  background-image: linear-gradient(to right, #ed6ea0 0%, #ec8c69 100%);
  border: none;
  transition: transform 0.1s ease-out;
  display: inline-block;
  box-shadow: 0px 0px 8px #666;
  margin: 4px;
}
.hero a.try-new-phone-button:hover {
  transform: translate(0px, 1px);
  box-shadow: 0px 0px 2px #444;
}
.hero a.try-new-phone-button.iphonex {
  background-image: linear-gradient(to right, #0ba360 0%, #3cba92 100%);
}
.hero a.try-new-phone-button.pixel {
  background-image: linear-gradient(to right, #0acffe 0%, #495aff 100%);
}
.hero a.instant-iphonex {
  color: #eee;
  text-decoration: underline;
}
.home {
  margin-bottom: 20px;
}
.home .device-type {
  text-align: center;
  margin-bottom: 34px;
}
.home .device-type .device-container {
  height: 90px;
}
.home .device-type h3 {
  margin-bottom: 0px;
}
.home .device-type ul {
  background-color: white;
  z-index: 99;
  list-style: none;
  height: 90px;
}
.home .device-type ul li {
  display: inline-block;
  cursor: pointer;
  font-weight: bold;
  color: #D1D1D1;
}
.home .device-type ul li:hover {
  color: #000;
  text-decoration: underline;
}
.home .device-type ul li:hover .icon {
  background-color: #000;
}
.home .device-type ul .icon {
  display: inline-block;
  width: 53px;
  height: 53px;
  position: relative;
  top: 21px;
  margin-left: 51px;
  margin-right: 9px;
  border-radius: 100%;
  background-color: #D1D1D1;
  background-repeat: no-repeat;
  background-position: center;
}
.home .device-type ul .ios-nav > .icon {
  background-size: 40%;
  background-image: url("/static/images/types/Apple.svg");
}
.home .device-type ul .android-nav > .icon {
  background-size: 50%;
  background-image: url("/static/images/types/Android.svg");
}
.home .device-type ul .windows-nav > .icon {
  background-size: 50%;
  background-image: url("/static/images/types/Windows.svg");
}
.home .device-type ul .laptop-nav > .icon {
  background-size: 70%;
  background-image: url("/static/images/types/Laptops.svg");
}
.home .device-type ul .tv-nav > .icon {
  background-size: 60%;
  background-image: url("/static/images/types/TV.svg");
}
.home .phone-type {
  margin: 0 0 20px 0;
}
.home .phone-block {
  background: url(../images/gradient_silver.png);
  background-size: 20px 100%;
  padding: 0;
  position: relative;
  text-align: center;
  margin-bottom: 20px;
}
.home .phone-block .phone-desc {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: left;
  background: rgba(0, 0, 0, 0.85);
  color: #fff;
  z-index: 999;
  padding: 5px 0;
  min-height: 32px;
}
.home .phone-block .phone-desc .name,
.home .phone-block .phone-desc .desc {
  margin: 0 85px 0 5px;
}
.home .phone-block .phone-desc .name {
  line-height: 20px;
}
.home .phone-block .phone-desc .desc {
  font-size: 12px;
  line-height: 12px;
}
.home .phone-block .phone-desc .btn {
  line-height: 32px;
  float: right;
  background: #fff;
  color: #000;
  margin-right: 5px;
  padding: 0 24px;
  font-weight: bold;
  border: none;
}
.home .device-menu {
  list-style: none;
  margin: 0 0 32px 0;
}
.home .device-menu li {
  padding: 8px 4px;
  text-align: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin-left: 0;
}
.home .device-menu a {
  text-decoration: none;
}
.home .device-anchor {
  display: block;
  position: relative;
  top: -94px;
  visibility: hidden;
}
.home .ios-device,
.home .android-device,
.home .windows-device,
.home .laptop-device,
.home .tv-device {
  display: none;
}
@keyframes anim-flash {
  50% {
    background-color: orange;
  }
  100% {
    background-color: transparent;
  }
}
.home .devices-container {
  margin-left: -1000px;
  margin-right: -1000px;
  padding-left: 1000px;
  padding-right: 1000px;
}
.home .devices-container.flash {
  animation-name: anim-flash;
  animation-duration: 1s;
}
.home[tab="ios"] .device-menu.ios-device {
  display: block;
}
.home[tab="ios"] .platform-container.ios-device {
  display: block;
}
.home[tab="ios"] .device-type ul > .ios-nav {
  color: #000;
}
.home[tab="ios"] .device-type ul > .ios-nav .icon {
  background-color: #000;
}
.home[tab="android"] .device-menu.android-device {
  display: block;
}
.home[tab="android"] .platform-container.android-device {
  display: block;
}
.home[tab="android"] .device-type ul > .android-nav {
  color: #000;
}
.home[tab="android"] .device-type ul > .android-nav .icon {
  background-color: #000;
}
.home[tab="windows"] .device-menu.windows-device {
  display: block;
}
.home[tab="windows"] .platform-container.windows-device {
  display: block;
}
.home[tab="windows"] .device-type ul > .windows-nav {
  color: #000;
}
.home[tab="windows"] .device-type ul > .windows-nav .icon {
  background-color: #000;
}
.home[tab="laptop"] .device-menu.laptop-device {
  display: block;
}
.home[tab="laptop"] .platform-container.laptop-device {
  display: block;
}
.home[tab="laptop"] .device-type ul > .laptop-nav {
  color: #000;
}
.home[tab="laptop"] .device-type ul > .laptop-nav .icon {
  background-color: #000;
}
.home[tab="tv"] .device-menu.tv-device {
  display: block;
}
.home[tab="tv"] .platform-container.tv-device {
  display: block;
}
.home[tab="tv"] .device-type ul > .tv-nav {
  color: #000;
}
.home[tab="tv"] .device-type ul > .tv-nav .icon {
  background-color: #000;
}
.top-message-wrapper {
  position: relative;
  margin: auto;
  min-height: 20px;
  padding: 10px;
  color: #fff;
  background-color: #2ecca2;
  text-align: center;
  z-index: 1;
}
@media (min-width: 1200px) {
  .home .phone-type {
    margin: 0 0 30px 0;
  }
  .home .phone-block {
    margin-bottom: 30px;
  }
}
@media (min-width: 768px) and (max-width: 979px) {
  .home .cycle-pics {
    width: 228px;
    height: 228px;
  }
  .home .cycle-pics img {
    width: 228px;
    height: 228px;
  }
}
@media (max-width: 979px) {
  .home > .device-type > .device-container > ul > li span {
    display: none;
  }
  .home > .device-type > .device-container > ul > li .icon {
    margin: 10px;
  }
}
@media (max-width: 500px) {
  .home > .device-type > .device-container > ul > li .icon {
    margin: 0px;
  }
  .home > .device-type > .device-container > ul {
    margin-left: 0px;
  }
}
@media (max-width: 979px) {
  .home .device-menu {
    display: none !important;
  }
}
.upload {
  margin-bottom: 30px;
}
.upload .phone-icon {
  background: #3498db;
  padding: 10px 0;
}
.upload .phone-info,
.upload .view-desc,
.upload .credits,
.upload .request-device {
  margin-bottom: 20px;
}
.upload .request-device .highlight {
  text-transform: uppercase;
  font-weight: bold;
}
.upload .upload-block {
  border: #000 5px dashed;
  text-align: center;
  margin-bottom: 20px;
  padding: 10px 0;
}
.upload .file {
  position: relative;
  font-weight: 400;
  font-size: 12px;
  line-height: 24px;
  width: 200px;
  padding: 8px 0;
  color: #ffffff;
  margin: 10px auto;
  background-image: -ms-linear-gradient(top left, #000000 0%, #000000 0%);
  background-image: -moz-linear-gradient(top left, #000000 0%, #000000 0%);
  background-image: -o-linear-gradient(top left, #000000 0%, #000000 0%);
  background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #000000), color-stop(0, #000000));
  background-image: -webkit-linear-gradient(top left, #000000 0%, #000000 0%);
  background-image: linear-gradient(to bottom right, #000000 0%, #000000 0%);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  cursor: pointer;
}
.upload .file #fileupload {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  cursor: pointer;
  padding-bottom: 10px;
}
.upload #upload-mockup {
  padding: 40px 20px;
  margin: 0;
}
.upload #upload-mockup span.select-files {
  display: block;
}
.upload #upload-mockup span.add-files {
  display: none;
}
.upload #upload-mockup.loading {
  padding: 10px 20px;
}
.upload #upload-mockup.loading .file {
  margin: 10px 0;
}
.upload #upload-mockup.loading span.select-files {
  display: none;
}
.upload #upload-mockup.loading span.add-files {
  display: block;
}
.upload #upload-mockup.loading h2,
.upload #upload-mockup.loading p {
  display: none;
}
.upload .files-progress {
  padding: 10px 20px 0 20px;
}
.upload .files-progress .ratio-warning .name {
  background: url(../images/warning-icon.png) right center no-repeat;
}
.upload .files-progress .name {
  float: left;
  width: 120px;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-right: 20px;
  font-weight: bold;
}
.upload .files-progress .progress-block {
  margin-bottom: 20px;
}
.upload .files-progress .progress-block .progress {
  margin-left: 150px;
}
.upload .files-progress .progress {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  background: #d8d8d8;
}
.upload .files-progress .progress .bar {
  background: #000;
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
.upload .files-progress .progress-block.complete .bar {
  background: #3498db;
}
.upload .files-progress .progress-block.error {
  color: #fe5656;
}
.upload .files-progress .progress-block.error .progress {
  background: none;
}
.upload .files-progress .progress-block.error .progress .bar {
  background: none;
}
.upload .ratio-warning-block {
  display: none;
  text-align: left;
  padding-left: 30px;
  margin-left: 20px;
  background: url(../images/warning-icon.png) center left no-repeat;
}
.upload #create-mockup button {
  color: #fff;
  font-size: 24.5px;
  font-weight: bold;
  text-shadow: none;
  background-color: #3498db;
  padding: 20px 0;
  border: none;
  width: 100%;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.download {
  margin-bottom: 20px;
}
.download .download-link {
  text-align: center;
  padding-right: 30px;
  border-right: 1px solid #ccc;
}
.download .download-link a.btn {
  display: block;
  font-size: 22px;
  font-weight: bold;
  text-shadow: none;
  background: #3498db;
  padding: 20px 0;
  border: none;
  color: #fff;
  margin-bottom: 5px;
}
.download .share-link h4 {
  margin-bottom: 5px;
}
.download .share-link input {
  background: #fff;
}
.download .share-link .fb_iframe_widget {
  line-height: 10px;
}
.download .remarks {
  margin-bottom: 20px;
}
.download #showcase-carousel {
  margin-bottom: 0;
}
.download #showcase-carousel .carousel-inner {
  background-color: #333;
}
.download #showcase-carousel .carousel-inner > .item > img {
  width: 70%;
  margin: 0 auto;
}
.download #showcase-carousel .carousel-control {
  background: none;
  border: none;
}
.download .share-url {
  margin-bottom: 0;
}
.download .buttons-wrapper {
  display: inline-flex;
  margin-left: 4px;
  margin-top: 4px;
  vertical-align: middle;
}
.download .buttons-wrapper .fb-share-button,
.download .buttons-wrapper .twitter-share-button {
  margin-left: 4px;
}
#share-modal {
  text-align: center;
}
#share-modal .button-container {
  padding: 20px;
}
#share-modal .button-container .button {
  text-decoration: none;
  cursor: pointer;
  color: white;
  background-color: #ddd;
  border: 0;
  border-radius: 4px;
  padding: 10px 18px;
  font-size: 16px;
  font-weight: 400;
  margin: 10px 10px;
}
@media only screen and (max-width: 570px) {
  #share-modal .button-container .button {
    display: block;
  }
}
#share-modal .button-container .button.facebook {
  color: white;
  background-color: #3b5998;
}
#share-modal .button-container .button.twitter {
  color: white;
  background-color: #55acee;
}
@media only screen and (max-width: 570px) {
  #share-modal {
    padding: 10px;
  }
}
.home .phone-5s-gold,
.upload .phone-5s-gold {
  background: url(../images/gradient_gold.png);
  background-size: 20px 100%;
}
.home .phone-5s-grey,
.upload .phone-5s-grey {
  background: url(../images/gradient_black.png);
  background-size: 20px 100%;
}
.home .phone-5s-silver,
.upload .phone-5s-silver {
  background: url(../images/gradient_silver.png);
  background-size: 20px 100%;
}
.home .phone-5c-blue,
.upload .phone-5c-blue {
  background: #5ac6ff;
}
.home .phone-5c-green,
.upload .phone-5c-green {
  background: #a0ec6f;
}
.home .phone-5c-red,
.upload .phone-5c-red {
  background: #ff8282;
}
.home .phone-5c-white,
.upload .phone-5c-white {
  background: #f1f1f2;
}
.home .phone-5c-yellow,
.upload .phone-5c-yellow {
  background: #fdeb75;
}
.home .fish-bg,
.upload .fish-bg {
  background: url(../images/fish_bg1.jpg);
  background-size: cover;
}
.home .fish-bg2,
.upload .fish-bg2 {
  background: url(../images/fish_bg2.jpg);
  background-size: cover;
}
.home .fish-bg3,
.upload .fish-bg3 {
  background: url(../images/fish_bg3.jpg);
  background-size: cover;
}
.home .fish-bg4,
.upload .fish-bg4 {
  background: url(../images/fish_bg4.jpg);
  background-size: cover;
}
