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