Advertisement
Guest User

Untitled

a guest
Jan 21st, 2020
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.03 KB | None | 0 0
  1. html,
  2. body {
  3. margin: 0;
  4. padding: 0;
  5.  
  6. }
  7.  
  8. {
  9. font-family: "Open Sans","Arial", sans-serif;
  10. box-sizing: border-box;
  11. font-size: 12px;
  12. }
  13.  
  14. header {
  15. display: flex;
  16. background-color: #444444;
  17. text-transform: uppercase;
  18. border: none;
  19. padding-left: 100px;
  20. }
  21. nav > ul {
  22. display: flex;
  23. list-style: none;
  24. padding-left: 0;
  25.  
  26. }
  27.  
  28. nav a {
  29. text-decoration: none;
  30. color: #fff;
  31.  
  32. }
  33.  
  34. nav a:hover {
  35. border-bottom: 1px solid #9ac051;
  36. }
  37.  
  38. nav li {
  39. padding-right: 40px;
  40.  
  41. }
  42. .main-site a {
  43. font-weight: 700;
  44.  
  45. }
  46.  
  47. /*Navigation*/
  48.  
  49. .main-img{
  50. height: 400px;
  51. background-image: url("../images/dewang-gupta-272186-unsplash.jpg");
  52. background-repeat: no-repeat;
  53. background-size: cover;
  54. background-position: bottom;
  55. display: flex;
  56. justify-content: center;
  57. align-items: center;
  58. color: #fff;
  59. }
  60.  
  61. .main-text {
  62. text-align: center;
  63. }
  64.  
  65. .main-text h1 {
  66. font-family: "Times New Roman", serif;
  67. font-size: 45px;
  68. text-transform: uppercase;
  69. margin: 0;
  70. }
  71.  
  72. .main-text h2{
  73. font-size: 18px;
  74. font-weight: 200;
  75. margin: 25px 0;
  76. }
  77.  
  78. .main-text .offer-btn {
  79. background-color: #9ac051;
  80. color: #fff;
  81. padding: 10px 20px;
  82. border: none;
  83. border-radius: 5px;
  84. cursor: pointer;
  85. }
  86.  
  87. .main-text .offer-btn:hover {
  88. background-color: #004C0D;
  89. }
  90.  
  91.  
  92.  
  93. .why-us {
  94. height: 300px;
  95. background-color: #fcfbfb;
  96. border-bottom: 1px solid #f2f2f2;
  97. color: #444444;
  98. display:flex;
  99. align-items: center;
  100. justify-content: space-between;
  101. padding: 0 100px;
  102. }
  103. .points h3 {
  104. font-family: "Times New Roman", serif;
  105. margin: 15px 0 30px 0;
  106. font-size: 18px;
  107. }
  108.  
  109. .points ul {
  110. list=style: none;
  111. padding-left: 0;
  112. }
  113.  
  114. .points i {
  115. color: #9ac051;
  116. padding-right:15px;
  117. }
  118.  
  119. .points li {
  120. font-size: 9px;
  121. margin-bottom: 20px;
  122. }
  123. .points li span {
  124. font-size: 9px;
  125. font-weight: 600;
  126. }
  127.  
  128. .image img {
  129. border-radius: 5px;
  130.  
  131. }
  132. .offer {
  133. display:flex;
  134. padding: 0 100px;
  135. justify-content: space-between;
  136. }
  137.  
  138. .offer figure {
  139. width: 200px;
  140. background-color: #fcfbfb;
  141. border: .5px solid #f2f2f2;
  142. margin: 50px 0;
  143. border-radius: 10px;
  144. display:flex;
  145. flex-direction: column;
  146. align-items: center;
  147. }
  148.  
  149. .offer h5{
  150. color: #9ac051;
  151. text-transform: uppercase;
  152. font-weight: 200;
  153. }
  154.  
  155. .offer p{
  156. color:#444444;
  157. margin: 0;
  158. text-align: center;
  159. font-size: 9px;
  160. padding: 0 20px;
  161. }
  162.  
  163. .offer .read-more-less-btn {
  164. background-color: $9ac051;
  165. color: #fff;
  166. font-size: 8px;
  167. padding: 5px 15px;
  168. border-radius: 5px;
  169. border: none;
  170. margin: 20px 0;
  171. }
  172.  
  173. .offer .circle-img{
  174. height: 100px;
  175. width: 100px;
  176. border-radius: 50%;
  177.  
  178. background-repeat: no-repeat;
  179. background-size: cover;
  180. margin-top: 20px;
  181. }
  182. .offer .skin-therapy {
  183. background-image: url("../images/love-romantic-bath-candlelight.jpg");
  184. background-position: bottom;
  185. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement