skeleton.css 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. /*
  2. * Responsive grid pixel system - v1.1
  3. * Copyright 2018, Marketify
  4. * Author: Marketify
  5. */
  6. .clearfix{
  7. *zoom: 1;
  8. clear:both;
  9. }
  10. .clearfix:before,
  11. .clearfix:after {
  12. display: table;
  13. line-height: 0;
  14. content: "";
  15. }
  16. .clearfix:after {
  17. clear: both;
  18. }
  19. /*------------------------------------------------------------------*/
  20. /* SKELETON OR GRID
  21. /*------------------------------------------------------------------*/
  22. .container {
  23. max-width: 1250px;
  24. width:100%;
  25. margin-left: auto;
  26. margin-right: auto;
  27. height:auto;
  28. padding:0px 40px;
  29. position:relative;
  30. clear:both;
  31. -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  32. -moz-box-sizing: border-box; /* Firefox, other Gecko */
  33. box-sizing: border-box; /* Opera/IE 8+ */
  34. }
  35. .container.full{
  36. max-width:100%;
  37. }
  38. .row {
  39. height:auto;
  40. }
  41. [class*="fl-col"], .fl-sidebar{
  42. float: left;
  43. margin-right: 4%;
  44. }
  45. [class*="fl-col"].float-right{
  46. float:right;
  47. }
  48. [class*="fl-col"].last, .fl-sidebar.last, [class*="fl-col"].no-space, .fl-col-12{
  49. margin-right:0px;
  50. }
  51. .fl-col-12 { width: 100%; }
  52. .fl-col-9 { width: 74%; }
  53. .fl-col-8 { width: 65.3333%; }
  54. .fl-col-6 { width: 48%; }
  55. .fl-col-4 { width: 30.6666%; }
  56. .fl-col-3 { width: 22%; }
  57. .fl-sidebar { width: 30.6666%; }
  58. .fl-col-9.no-space { width: 78%; }
  59. .fl-col-8.no-space { width: 69.3333%; }
  60. .fl-col-6.no-space { width: 52%; }
  61. .fl-col-4.no-space { width: 34.6666%; }
  62. .fl-col-3.no-space { width: 26%; }
  63. @media (max-width: 1040px) {
  64. .fl-sidebar { width: 100%; clear:both; margin-right:0px; padding:50px 0px; }
  65. .fl-col-8.fix { width:100%; }
  66. .container{padding:0px 20px;}
  67. }
  68. @media (max-width: 768px) {
  69. .fl-col-12 { width: 100%; }
  70. .fl-col-9 { width: 100%; }
  71. .fl-col-8 { width: 100%; }
  72. .fl-col-6 { width: 100%; }
  73. .fl-col-4 { width: 100%; }
  74. .fl-col-3 { width: 100%; }
  75. }
  76. @media (max-width: 480px) {
  77. .container{padding:0px 10px;}
  78. }