customnft.css 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
  1. #block-nft {
  2. padding: 30px 0;
  3. margin-bottom: 40px;
  4. font-family: "Proxima Nova",sans-serif;
  5. color: #181c47;}
  6. #block-nft h2 {
  7. font-family: 'Poppins', sans-serif;
  8. font-weight: bolder;
  9. font-size: 3.7rem;
  10. }
  11. #block-nft p {
  12. font-size: 1.8rem;
  13. line-height: 3rem;
  14. }
  15. #block-nft {
  16. padding: 0;
  17. }
  18. #block-nft .v-tabs-stage h2 {
  19. font-size: 2.5rem;
  20. }
  21. #block-nft .v-tabs .owl-page span {
  22. background: #EA5413;
  23. }
  24. #block-nft .sec05 {
  25. background-color: white;
  26. }
  27. .sec05::after {
  28. display: none;
  29. }
  30. .nft-tabs {
  31. max-width: 100%;
  32. }
  33. .nft-tabs-nav {
  34. margin-block-start: 0;
  35. padding-left: 0;
  36. }
  37. .nft-tabs-nav li {
  38. float: left;
  39. width: 18%;
  40. list-style: none;
  41. margin: 0 1%;
  42. }
  43. .nft-tabs-nav li a {
  44. color: #EA5413;
  45. font-size: 2.5rem;
  46. letter-spacing: 2px;
  47. display: block;
  48. font-weight: 600;
  49. padding: 10px 0;
  50. text-align: center;
  51. text-decoration: none;
  52. border: 1px solid #EA5413;
  53. border-radius: 10rem;
  54. }
  55. .nft-tabs-nav li a:hover {
  56. color: white;
  57. background-color: #EA5413;
  58. }
  59. .nft-tabs-nav li.nft-tab-active a {
  60. color: white;
  61. background-color: #EA5413;
  62. }
  63. .nft-tabs-stage {
  64. clear: both;
  65. padding: 40px 30px 10px 30px;
  66. position: relative;
  67. top: -1px;
  68. text-align: left;
  69. }
  70. #block-nft .nft-tabs-stage h2 {
  71. font-size: 2.5rem;
  72. }
  73. #block-carbon p {
  74. font-size: 1.8rem;
  75. }
  76. #block-carbon .sec05 {
  77. background-color: white;
  78. padding-top: 1rem;
  79. padding-bottom: 1rem;
  80. }
  81. #block-carbon .sec06 {
  82. transform: none;
  83. box-shadow: none;
  84. background-color: #FFEBE2;
  85. position: relative;
  86. }
  87. #block-carbon .sec06::after {
  88. content: "";
  89. position: absolute;
  90. top: -66px;
  91. left: 0;
  92. display: block;
  93. width: 100%;
  94. height: 66px;
  95. transform: rotate(180deg);
  96. background-image: url("https://i.imgur.com/fR4Tz5V.png");
  97. background-size: 3840px 66px;
  98. background-position: 0 0;
  99. }
  100. #block-carbon .sec06 .container {
  101. transform: none;
  102. box-shadow: none;
  103. background-color: #FFEBE2;
  104. margin-top: 0;
  105. }
  106. #block-carbon .container.mb-spec {
  107. margin-bottom: 80px;
  108. }
  109. #gamefi-rank {
  110. width: 100%;
  111. text-align: center;
  112. border-radius: 5px;
  113. /* box-shadow: 1px 1px 5px 1px rgba(201, 201, 201, 0.637); */
  114. padding: 1.5rem;
  115. border-bottom: 1px solid rgb(230, 230, 230);
  116. margin-bottom: 1rem;
  117. }
  118. @media (max-width: 576px) {
  119. #gamefi-rank {
  120. display: none;
  121. }
  122. }
  123. #gamefi-rank-mb {
  124. width: 100%;
  125. text-align: center;
  126. border-radius: 2rem;
  127. box-shadow: 1px 1px 5px 1px rgba(201, 201, 201, 0.637);
  128. padding: 1.5rem;
  129. display: none;
  130. }
  131. @media (max-width: 576px) {
  132. #gamefi-rank-mb {
  133. display: block;
  134. }
  135. }
  136. #gamefi-rank-mb th, #gamefi-rank th {
  137. text-align: center;
  138. padding: 1rem;
  139. color: gray;
  140. font-size: 1.8rem;
  141. }
  142. #gamefi-rank-mb td, #gamefi-rank tr td {
  143. padding: 3rem 0;
  144. }
  145. #gamefi-rank-mb tr img, #gamefi-rank tr img {
  146. width: 35px;
  147. }
  148. #block-carbon .sec08 {
  149. background-color: #FFEBE2;
  150. position: relative;
  151. }
  152. #block-carbon .sec08::after {
  153. display: none;
  154. content: "";
  155. position: absolute;
  156. top: -30px;
  157. left: 0;
  158. display: block;
  159. width: 100%;
  160. height: 66px;
  161. transform: rotate(180deg);
  162. background-image: url("https://i.imgur.com/fR4Tz5V.png");
  163. background-size: 3840px 66px;
  164. background-position: 0 0;
  165. }
  166. .gamefi-go:hover {
  167. text-decoration: none;
  168. color: white;
  169. }
  170. .rank_data {
  171. display: grid;
  172. grid-template-columns: repeat(6, 1fr);
  173. grid-template-rows: auto;
  174. padding: 1rem 0;
  175. background: white;
  176. box-shadow: 1px 1px 5px 1px rgba(201, 201, 201, 0.637);
  177. border-radius: 1rem;
  178. margin-bottom: 1rem;
  179. transition: all .5s;
  180. }
  181. .rank_data span {
  182. vertical-align: bottom;
  183. }
  184. .rank_data_name {
  185. font-weight: 700;
  186. }
  187. .rank_data:hover {
  188. transform: translate(-2px, -2px);
  189. }
  190. .back-deco {
  191. position: absolute;
  192. width: 150px;
  193. height: 150px;
  194. left: 50%;
  195. top: 0;
  196. background-color: hotpink;
  197. z-index: 0;
  198. }
  199. .sec-5g .advantages-list {
  200. text-align: start;
  201. }
  202. .sec-5g .txt-block .rankblock span {
  203. background-color: transparent;
  204. color: transparent;
  205. }
  206. @media (max-width: 576px) {
  207. .nft-tabs-nav li a {
  208. color: #EA5413;
  209. font-size: 1rem;
  210. letter-spacing: 2px;
  211. display: block;
  212. font-weight: 600;
  213. padding: 10px 0;
  214. text-align: center;
  215. text-decoration: none;
  216. border: 1px solid #EA5413;
  217. border-radius: 2rem;
  218. }
  219. }