Advertisement
Guest User

Untitled

a guest
Dec 7th, 2022
81
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.05 KB | None | 0 0
  1. /* http://meyerweb.com/eric/tools/css/reset/
  2.     v2.0 | 20110126
  3.     License: none (public domain)
  4. */
  5.  
  6. html, body, div, span, applet, object, iframe,
  7. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  8. a, abbr, acronym, address, big, cite, code,
  9. del, dfn, em, img, ins, kbd, q, s, samp,
  10. small, strike, strong, sub, sup, tt, var,
  11. b, u, i, center,
  12. dl, dt, dd, ol, ul, li,
  13. fieldset, form, label, legend,
  14. table, caption, tbody, tfoot, thead, tr, th, td,
  15. article, aside, canvas, details, embed,
  16. figure, figcaption, footer, header, hgroup,
  17. menu, nav, output, ruby, section, summary,
  18. time, mark, audio, video {
  19.     margin: 0;
  20.     padding: 0;
  21.     border: 0;
  22.     font-size: 100%;
  23.     font: inherit;
  24.     vertical-align: baseline;
  25. }
  26. /* HTML5 display-role reset for older browsers */
  27. article, aside, details, figcaption, figure,
  28. footer, header, hgroup, menu, nav, section {
  29.     display: block;
  30. }
  31. body {
  32.     line-height: 1;
  33. }
  34. ol, ul {
  35.     list-style: none;
  36. }
  37. blockquote, q {
  38.     quotes: none;
  39. }
  40. blockquote:before, blockquote:after,
  41. q:before, q:after {
  42.     content: '';
  43.     content: none;
  44. }
  45. table {
  46.     border-collapse: collapse;
  47.     border-spacing: 0;
  48. }
  49.  
  50. html {
  51.     box-sizing: border-box;
  52.     font-family: 'Poppins', sans-serif;
  53. }
  54.  
  55. body {
  56.     background-color: #529ffa;
  57.     display: flex;
  58.     justify-content: center;
  59.     min-height: 100vh;
  60. }
  61.  
  62. .panel {
  63.     background-color: white;
  64.     border-radius: 10px;
  65.     padding: 15px 25px;
  66.     width: 100%;
  67.     min-height: 960px;
  68.     display: flex;
  69.     flex-direction: column;
  70.     text-align: center;
  71.     text-transform: uppercase;
  72. }
  73.  
  74. .pricing-plan {
  75.     border-bottom: 1px solid #e1f1ff;
  76. }
  77.  
  78. .pricing-plan:last-child {
  79.     margin-bottom: 25px;
  80.     max-width: 100%;
  81. }
  82.  
  83. .pricing-img {
  84.     margin-bottom: 25px;
  85.     max-width: 100%;
  86. }
  87.  
  88. .pricing-header {
  89.     color: #888;
  90.     font-weight: 600;
  91.     letter-spacing: 1px;
  92. }
  93.  
  94. .pricing-features {
  95.     margin: 50px 0 25px;
  96.     color: #015ff9;
  97. }
  98.  
  99. .pricing-features-item {
  100.     font-weight: 600;
  101.     letter-spacing: 1px;
  102.     font-size: 12px;
  103.     line-height: 1.5;
  104.     padding: 15px 0;
  105.     border-top: 1px solid #e1f1ff;
  106. }
  107.  
  108. .pricing-features-item:last-child {
  109.     border-bottom: 1px solid #e1f1ff;
  110. }
  111.  
  112. .pricing-price {
  113.     color: #016ff9;
  114.     display: block;
  115.     font-size: 32px;
  116.     font-weight: 700;
  117. }
  118.  
  119. .pricing-button {
  120.     border: 1px solid #9dd1ff;
  121.     border-radius: 10px;
  122.     display: inline-block;
  123.     padding: 15px 35px;
  124.     text-decoration: none;
  125.     margin: 25px 0;
  126. }
  127.  
  128. .pricing-button:hover,
  129. .pricing-button:focus {
  130.     background-color: #e1f1ff;
  131. }
  132.  
  133. .pricing-button.is-featured {
  134.     border: 1px solid #9dd1ff;
  135.     background-color: #48aaff;
  136. }
  137.  
  138. .pricing-button.is-featured:hover,
  139. .pricing-button.is-featured:focus {
  140.     background-color: #269aff;
  141.     color: white;
  142. }
  143.  
  144. @media (min-width: 900px) {
  145.     .panel {
  146.         flex-direction: row;
  147.     }
  148.  
  149.     .pricing-plan {
  150.         border-bottom: none;
  151.         border-right: 1px solid #e1f1ff;
  152.         padding: 30px 50px;
  153.     }
  154.  
  155.     .pricing-plan:last-child {
  156.         border-right: none;
  157.     }
  158. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement