style.css 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144
  1. /* -- footer -- */
  2. html {
  3. position: relative;
  4. min-height: 100%;
  5. }
  6. body {
  7. margin-bottom: 60px;
  8. font-family: 'Khand', sans-serif;
  9. }
  10. .footer {
  11. position: absolute;
  12. bottom: 0;
  13. width: 100%;
  14. height: 60px;
  15. background-color: #f5f5f5;
  16. }
  17. .container .text-muted {
  18. margin: 20px 0;
  19. }
  20. .footer > .container {
  21. padding-right: 15px;
  22. padding-left: 15px;
  23. }
  24. /* -- -- */
  25. h3 {
  26. display:inline-block;
  27. font-size: 32px;
  28. line-height: 36px;
  29. position: relative;
  30. margin-top:28px;
  31. margin-bottom:15px;
  32. }
  33. h3:before{
  34. left: -40px;
  35. height: 0;
  36. height:1px;
  37. }
  38. h3:before, h3:after {
  39. content: "";
  40. position: absolute;
  41. bottom: 10px;
  42. height: 1px;
  43. width: 40px;
  44. margin: 0 -15px;
  45. background-color: #533834;
  46. }
  47. h3:after{
  48. right: -40px;
  49. }
  50. h5 {
  51. font-size: 16px;
  52. line-height: 22px;
  53. margin: 0 0 15px;
  54. font-weight: 400;
  55. }
  56. .item {
  57. position: relative;
  58. overflow: hidden;
  59. margin-bottom:20px;
  60. }
  61. .item h4, .price {
  62. z-index: 0;
  63. position: relative;
  64. background-color: #fff;
  65. right: 0;
  66. position: absolute;
  67. }
  68. .item .price {
  69. padding-left: 8px;
  70. }
  71. .item h4, .item p {
  72. display: block;
  73. clear: both;
  74. color: #533834;
  75. }
  76. .item p {
  77. clear: both;
  78. color: #938372;
  79. margin-left:10px;
  80. }
  81. .dots {
  82. background-image: linear-gradient(to right,rgba(56,47,47,.5) 33%,rgba(0,0,0,0) 0%);
  83. background-position: bottom;
  84. background-size: 3px 1px;
  85. background-repeat: repeat-x;
  86. height: 1px;
  87. width: 100%;
  88. position: absolute;
  89. top: 22px;
  90. }
  91. /* Dots in IE */
  92. @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  93. .dots {
  94. background: transparent url('/img/dot.gif') repeat-x bottom left;
  95. }
  96. }
  97. .badge {
  98. display: inline-block;
  99. padding: 0 10px;
  100. background: #d2c82a;
  101. font-size: 12px;
  102. font-weight: 300;
  103. line-height: 26px;
  104. color: #fff;
  105. text-align: center;
  106. vertical-align: middle;
  107. text-transform: uppercase;
  108. border: 1px solid rgba(0,0,0,.05);
  109. letter-spacing: 1px;
  110. border-radius: 3px;
  111. margin: -5px 5px 0 0;
  112. }
  113. .note {
  114. padding: 0 6px;
  115. min-width: 23px;
  116. background: rgba(0,0,0,0);
  117. border: 1px solid #382f2f;
  118. color: #382f2f;
  119. box-sizing: border-box;
  120. border-radius: 500px;
  121. line-height: 21px;
  122. }
  123. .veggie {
  124. color:#82b440;
  125. border-color:#82b440;
  126. }
  127. .spicy {
  128. color:#ec4e00;
  129. border-color:#ec4e00;
  130. }
  131. .price {
  132. position: absolute;
  133. font-size:22px;
  134. font-weight:400;
  135. right: 0;
  136. }
  137. .item h4 {
  138. display: inline-block;
  139. padding-right: 8px;
  140. max-width: 80%;
  141. text-transform: capitalize;
  142. margin-bottom:4px;
  143. position: relative;
  144. }