style.css 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. @font-face {
  2. font-family: "Pacifico";
  3. src: URL('Pacifico-Regular.ttf') format('truetype');
  4. }
  5. body {
  6. background-color: lightsalmon;
  7. }
  8. #main {
  9. width: 280px;
  10. margin-right: auto;
  11. margin-left: auto;
  12. background-color: lightgray;
  13. margin-top: 40px;
  14. padding: 20px;
  15. border-radius: 10px;
  16. -webkit-box-shadow: 0px 10px 5px 0px rgba(50, 50, 50, 0.75);
  17. -moz-box-shadow: 0px 10px 5px 0px rgba(50, 50, 50, 0.75);
  18. box-shadow: 0px 10px 5px 0px rgba(50, 50, 50, 0.75);
  19. font-family: sans-serif;
  20. }
  21. #header {
  22. text-align: center;
  23. margin-bottom: 10px;
  24. font-family: "Pacifico", cursive;
  25. }
  26. #screen {
  27. width: 95%;
  28. height: 25px;
  29. line-height: 25px;
  30. padding: 8px;
  31. border-radius: 10px;
  32. margin-right: auto;
  33. margin-left: auto;
  34. background-color: #8ea386;
  35. margin-bottom: 50px;
  36. text-align: right;
  37. overflow: hidden;
  38. }
  39. #calc-buttons {
  40. list-style: none;
  41. padding: 0;
  42. height: 230px;
  43. }
  44. .calc-button {
  45. padding-top: 5px;
  46. padding-bottom: 5px;
  47. height: 20px;
  48. line-height: 20px;
  49. width: 60px;
  50. margin-left: 5px;
  51. margin-right: 5px;
  52. margin-top: 10px;
  53. margin-bottom: 10px;
  54. float: left;
  55. color: white;
  56. background-color: #454545;
  57. text-align: center;
  58. vertical-align: middle;
  59. border-radius: 5px;
  60. cursor: default;
  61. -webkit-touch-callout: none;
  62. -webkit-user-select: none;
  63. -khtml-user-select: none;
  64. -moz-user-select: none;
  65. -ms-user-select: none;
  66. user-select: none;
  67. }
  68. .calc-big {
  69. width: 130px;
  70. }