metastream_sample.css 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. /*
  2. *
  3. * Copyright 2016 Amazon.com, Inc. or its affiliates. All Rights Reserved.
  4. *
  5. * Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in
  6. * compliance with the License. A copy of the License is located at
  7. *
  8. * http://aws.amazon.com/apache2.0/
  9. *
  10. * or in the "license" file accompanying this file. This file is distributed on an "AS IS" BASIS,
  11. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
  12. * specific language governing permissions and limitations under the License.
  13. *
  14. */
  15. html, body {
  16. height: 100%;
  17. }
  18. body {
  19. margin: 0 auto;
  20. overflow: hidden;
  21. display: flex;
  22. justify-content: center;
  23. align-items: center;
  24. font-family: 'Roboto Condensed', sans-serif;
  25. font-size: 16px;
  26. }
  27. .container {
  28. height: 100%;
  29. display: flex;
  30. flex-direction: column;
  31. justify-content: center;
  32. align-items: center;
  33. }
  34. .map {
  35. width: 512px;
  36. height: 512px;
  37. position: relative;
  38. background-color: rgba(0, 0, 0, 0.5);
  39. }
  40. .position {
  41. width: 32px;
  42. height: 32px;
  43. position: absolute;
  44. bottom: calc(50% - 16px);
  45. left: calc(50% - 16px);
  46. border-radius: 50%;
  47. background-color: #ffff44;
  48. border: 3px solid #000000;
  49. transform: rotate(45deg);
  50. }
  51. .arrow {
  52. width: calc(50% + 3px);
  53. height: calc(50% + 3px);
  54. position: absolute;
  55. top: -3px;
  56. left: -3px;
  57. background-color: #ffff44;
  58. border-left: 3px solid #000000;
  59. border-top: 3px solid #000000;
  60. }