_devices.scss 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. //
  2. // DEVICES
  3. //
  4. .device {
  5. position: relative;
  6. background-size: cover;
  7. }
  8. .device .app-screenshot {
  9. position: absolute;
  10. width: 240px;
  11. height: auto;
  12. }
  13. .device .video-container {
  14. position: absolute;
  15. width: 240px;
  16. height: 426.66px;
  17. padding-bottom: 0;
  18. margin-left: 24px;
  19. margin-top: 90.67px;
  20. overflow: hidden;
  21. }
  22. // Video
  23. .video-container iframe {
  24. position: absolute;
  25. top:0;
  26. left: 0;
  27. width: 100%;
  28. height: 100%;
  29. }
  30. //
  31. // iPhone SE Silver Vertical
  32. //
  33. .device.iphone-se-silver-vertical {
  34. width: 288px;
  35. height: 608px;
  36. background-image: url(../../images/devices/iphone-se-silver-vertical.png);
  37. }
  38. .device.iphone-se-silver-vertical .app-screenshot {
  39. top: 91px;
  40. left: 25px;
  41. width: 240px;
  42. }
  43. //
  44. // iPhone SE Space Gray Vertical
  45. //
  46. .device.iphone-se-space-gray-vertical {
  47. width: 288px;
  48. height: 608px;
  49. background-image: url(../../images/devices/iphone-se-space-gray-vertical.png);
  50. }
  51. .device.iphone-se-space-gray-vertical .app-screenshot {
  52. top: 91px;
  53. left: 25px;
  54. width: 240px;
  55. }
  56. //
  57. // iPod Touch Blue Vertical
  58. //
  59. .device.ipod-touch-blue-vertical {
  60. width: 291px;
  61. height: 614px;
  62. background-image: url(../../images/devices/ipod-touch-blue-vertical.png);
  63. }
  64. .device.ipod-touch-blue-vertical .app-screenshot {
  65. top: 87px;
  66. left: 23px;
  67. width: 246px;
  68. }