main.css 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. html, body {
  2. margin: 0px;
  3. padding: 0px;
  4. font-size: 0;
  5. }
  6. body {
  7. height: 100%;
  8. font-family: 'Open Sans', sans-serif;
  9. }
  10. h1 {
  11. margin: 0px;
  12. padding: 0px;
  13. font-size: 72px;
  14. white-space: nowrap;
  15. font-weight: normal;
  16. }
  17. h1 a:link {
  18. text-decoration: none;
  19. }
  20. footer {
  21. background: black;
  22. color: white;
  23. font-size: 16px;
  24. font-family: 'Open Sans', sans-serif;
  25. height: 130px;
  26. }
  27. .dark {
  28. color: #B03C41;
  29. }
  30. .bright {
  31. color: #EF1D26;
  32. }
  33. .light {
  34. color: #F35D63;
  35. }
  36. .order-button {
  37. display: block;
  38. position: relative;
  39. font-weight: normal;
  40. border-radius: 15px;
  41. padding: 4px 10px;
  42. background-color: #EF1D26;
  43. color: white;
  44. font-family: "Fjalla One", Arial, sans-serif;
  45. font-size: 48px;
  46. border: 0px;
  47. -webkit-box-shadow: 0px 0px 10px 0px #444444;
  48. -moz-box-shadow: 0px 0px 10px 0px #444444;
  49. box-shadow: 0px 0px 10px 0px #444444;
  50. text-decoration: none;
  51. white-space: nowrap;
  52. }
  53. .order-button:hover {
  54. cursor: pointer;
  55. background-color: white;
  56. color: #EF1D26;
  57. }
  58. .footer-section {
  59. width: 31%;
  60. float: left;
  61. text-align: center;
  62. padding: 1%;
  63. }
  64. .button-center {
  65. width: 250px;
  66. margin: auto;
  67. text-align: center;
  68. }
  69. .shift-right {
  70. padding-left: 50%;
  71. }
  72. #wrapper {
  73. min-height: 100%;
  74. padding-bottom: 130px;
  75. margin-bottom: -130px;
  76. }
  77. #banner {
  78. margin-top: 70px;
  79. padding-bottom: 20px;
  80. background-color: white;
  81. }
  82. #banner img {
  83. width: 100%;
  84. }
  85. #header-text {
  86. font-family: "Lobster", Arial, sans-serif;
  87. position: absolute;
  88. top: 0px;
  89. left: 0px;
  90. }
  91. #top-order-button {
  92. margin-top: -50px;
  93. }
  94. #detail-section {
  95. background: url('../images/background.jpg');
  96. background-size: 100%;
  97. background-repeat: repeat-y;
  98. }
  99. #detail-content {
  100. width: 768px;
  101. margin: auto;
  102. height: 380px;
  103. }
  104. #detail-image {
  105. float: left;
  106. width: 380px;
  107. }
  108. #detail-text {
  109. float: left;
  110. width: 370px;
  111. padding: 5px;
  112. text-align: center;
  113. font-size: 26px;
  114. }
  115. #detail-text a {
  116. white-space: nowrap;
  117. }
  118. #detail-text a:link {
  119. text-decoration: none;
  120. color: #004FFF;
  121. }
  122. #detail-text a:hover {
  123. text-decoration: underline;
  124. }
  125. #detail-text a:visited {
  126. color: #004FFF;
  127. }
  128. #feature-section {
  129. clear: both;
  130. color: white;
  131. background-color: #52060F;
  132. height: 260px;
  133. padding-bottom: 20px;
  134. }
  135. #feature-content {
  136. width: 768px;
  137. margin: auto;
  138. }
  139. #feature-content h1 {
  140. margin: 0px;
  141. padding: 10px;
  142. font-style: italic;
  143. font-size: 36px;
  144. text-align: center;
  145. text-shadow: 2px 2px #000000;
  146. }
  147. #feature-content .feature{
  148. font-family: "Fjalla One", Arial, sans-serif;
  149. font-size: 18px;
  150. float: left;
  151. width: 33%;
  152. text-align: center;
  153. }
  154. #inline-order-button {
  155. margin-top: -80px;
  156. }
  157. #action-section {
  158. clear: both;
  159. width: 768px;
  160. margin: auto;
  161. background-color: white;
  162. font-size: 18px;
  163. padding-top: 50px;
  164. height: 420px;
  165. }
  166. #commitment-text {
  167. float: left;
  168. width: 300px;
  169. text-align: center;
  170. }
  171. #commitment-text h1 {
  172. font-family: "Fjalla One", Arial, sans-serif;
  173. font-size: 48px;
  174. }
  175. #commitment-image {
  176. float: left;
  177. padding-left: 50px;
  178. }