summaryrefslogtreecommitdiff
path: root/test.scss
blob: e3a02e1a7039ed3a5897dc0647afcdab4f257522 (plain)
  1. @import 'h5bp/helpers';
  2. @import 'compass/css3';
  3. .topbar .footer {
  4. background-color: #336699;
  5. }
  6. //.topbar ul {
  7. // display: block;
  8. // margin: 3em 0;
  9. //}
  10. #content {
  11. width: 96%;
  12. max-width: none;
  13. margin: 2%;
  14. }
  15. .inlinepage {
  16. position: relative;
  17. //set to make inline header position work
  18. border: 0;
  19. padding: 0;
  20. margin: 0 0 1em 0;
  21. background-color: transparent;
  22. height: 18em;
  23. overflow: hidden;
  24. }
  25. //set to annull style.css
  26. .inlinecontent {
  27. margin-top: 0;
  28. }
  29. .inlineheader {
  30. display: block;
  31. position: absolute;
  32. bottom: 0;
  33. left: 0;
  34. width: 100%;
  35. a {
  36. font-weight: normal;
  37. color: white;
  38. background-color: #6699cc;
  39. display: block;
  40. padding: 0.5em;
  41. opacity: 0.8;
  42. }
  43. }
  44. .inlinecontent p {
  45. margin-bottom: 0;
  46. margin-top: 0;
  47. }
  48. .inlinefooter,
  49. .inlineheader .author,
  50. .sidebar,
  51. .farbar {
  52. @include h5bp-hidden;
  53. }
  54. //Responsive design
  55. @media screen and (max-width: 480px) {
  56. #content {
  57. width: 100%;
  58. margin: 0;
  59. }
  60. .columns {
  61. @include column-count(1);
  62. }
  63. .inlinepage {
  64. margin: 0;
  65. }
  66. }
  67. @media screen and (min-width: 480px) and (max-width: 700px) {
  68. .columns {
  69. @include column-count(2);
  70. }
  71. }
  72. @media screen and (min-width: 701px) {
  73. .columns {
  74. @include column-count(3);
  75. }
  76. }