ToxyFlake

CSS "ЖМИ БУЛКИ!"

Aug 5th, 2021 (edited)
152
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import url('https://fonts.googleapis.com/css2?family=Underdog&display=swap');
  2. html {
  3. font-size: 10px;
  4. font-family: 'Underdog', cursive;
  5. background-color: white;
  6. }
  7. h1 {
  8.      font-size: 100px;
  9.      margin-bottom: 5px;
  10.      margin-top: 5px;
  11.      color: #6e1700;
  12. }
  13. h2 {
  14.      font-size: 70px;
  15.      margin-bottom: 5px;
  16.      margin-top: 5px;
  17.      color: #6e1700;
  18. }
  19. h3 {
  20.      font-size: 20px;
  21.      margin-bottom: 5px;
  22.      margin-top: 5px;
  23.      color: #6e1700;
  24. }
  25. h4 {
  26.      font-size: 20px;
  27.      margin-bottom: 5px;
  28.      margin-top: 5px;
  29.      color: #6e1700;
  30. }
  31. p {
  32.      font-size: 15px;
  33.      margin-bottom: 5px;
  34.      margin-top: 5px;
  35.      color: #6e1700;
  36. }
  37.  
  38. .page{
  39.     width:100%;
  40.     height:100vh;
  41.     display:flex;
  42.     align-items: center;
  43. }
  44.  
  45. .container-main {
  46.      display: flex;
  47.      flex-direction: column;
  48.      justify-content: center;
  49.      align-items: center;
  50.      width: 800px;
  51.      height: 900px;
  52.      margin: 0 auto;
  53.     box-shadow: 0 14px 28px gray, 0 10px 10px gray;
  54. }
  55. #container {
  56.   display: flex;
  57.   flex-direction: column;
  58.   justify-content: center;
  59.   width: 100%;
  60. }
  61. #container-shop {
  62.     flex: 1;
  63.     background-color: #ecc6a5;
  64.     width: 100%;
  65.     margin-bottom: 20px;
  66. }
  67. #container-upgrade {
  68.   display: flex;
  69.   justify-content: center;
  70.   width: 100%;
  71. }
  72. #container-upgrade div {
  73.     display: inline-block;
  74.   padding: 10px;
  75.   border: 5px solid #ecc6a5;
  76. }
  77.  
  78. #container div {
  79.   padding: 10px 0;
  80.   border: none;
  81. }
  82. #box1 {
  83.     flex: 1;
  84.     background-color: #f7e7dc;
  85.     text-align: center;
  86.     width: 100%;
  87. }
  88.  
  89. #container-box3 {
  90.     flex: 1;
  91.     display: inline-block;
  92.     background-color: #fdfaf4;
  93.     text-align: center;
  94.     width: 100%;
  95.     width: 800px;
  96. }
  97. #box3-1 {
  98.     display: inline-block;
  99.     flex: 1;
  100.     background-color: #fdfaf4;
  101.     width: 100%;
  102. }
  103. #box4 {
  104.     flex: 1;
  105.     background-color: #f7e7dc;
  106.     text-align: center;
  107.     width: 300px;
  108.     margin: 0 auto;
  109. }
  110. #box5 {
  111.     flex: 1;
  112.     background-color: #f7e7dc;
  113.     text-align: center;
  114. }
  115.  
  116. #box5-1-1 {
  117.     flex: 1;
  118.     background-color: #f4e0cb;
  119.     justify-content: center;
  120. }
  121. #box5-1-2 {
  122.     flex: 1;
  123.     background-color: #de9f68;
  124.     flex-basis: 50%;
  125. }
  126. #box5-1-3 {
  127.     flex: 1;
  128.     background-color: #d1884d;
  129.     text-align:center;
  130. }
  131. #box6 {
  132.     flex: 1;
  133.     background-color: #de9f68;
  134.     text-align:center;
  135.     width: 100%;
  136. }
RAW Paste Data