style.css 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. /* styles for Klaus Zimmermann's site */
  2. html {
  3. font-family: Verdana, Helvetica, Arial, sans-serif;
  4. font-size: 1.2em;
  5. background: #543200;
  6. }
  7. body {
  8. margin: 0;
  9. padding: 0;
  10. }
  11. a, a:visited {
  12. color: #276DBF;
  13. text-decoration: none;
  14. }
  15. a:hover {
  16. text-decoration: underline;
  17. }
  18. body header {
  19. margin: 0;
  20. background: #DAB196;
  21. padding: 1.2em 5px;
  22. }
  23. body header h1, body header h2 {
  24. font-weight: normal;
  25. margin: 0.4em 0;
  26. }
  27. body header h2 {
  28. font-size: 1.3em;
  29. }
  30. body nav {
  31. background: #BF7F22;
  32. }
  33. body nav > ul {
  34. list-style-type: none;
  35. margin: 0;
  36. padding-left: 0;
  37. }
  38. body nav ul li {
  39. display: inline-block;
  40. float: left;
  41. }
  42. body nav ul li a, body nav ul li a:visited {
  43. color: #2F1C00;
  44. display: block;
  45. padding: 12px;
  46. transition: background 0.3s, color 0.3s;
  47. }
  48. body nav ul li a:hover {
  49. text-decoration: none;
  50. background: #523100;
  51. color: #D1B488;
  52. }
  53. body nav ul:after {
  54. display: block;
  55. visibility: hidden;
  56. height: 0;
  57. content: '.';
  58. clear: both;
  59. }
  60. body section#main {
  61. background: #F7E0BE;
  62. color: #1F1508;
  63. padding: 1.4em 15px;
  64. }
  65. body footer {
  66. padding: 1.5em;
  67. background: #543200;
  68. color: #E5D7C3;
  69. text-align: center;
  70. font-size: 0.8em;
  71. }
  72. /* Responsive design section! */
  73. @media screen and (max-width: 500) {
  74. html {
  75. font-size: 1em;
  76. }
  77. }