123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201 |
- /*
- 0 - 600px: Phone
- 600 - 900px: Tablet portrait
- 900 - 1200px: Tablet landscape
- [1200 - 1800] is where our normal styles apply
- 1800px + : Big desktop
-
- $breakpoint arguement choices:
- - phone
- - tab-port
- - tab-land
- - big-desktop
-
- ORDER: Base + typography > general layout + grid > page layout > components
-
- 1em = 16px
- */
-
-
- /* Orbitron */
-
- @font-face {
- font-family: "Orbitron";
- src: url("../assets/font/orbitron/Orbitron-Regular.ttf") format("truetype");
- font-weight: 400;
- font-style: normal;
- }
-
- @font-face {
- font-family: "Orbitron";
- src: url("../assets/font/orbitron/Orbitron-Medium.ttf") format("truetype");
- font-weight: 500;
- font-style: normal;
- }
-
- @font-face {
- font-family: "Orbitron";
- src: url("../assets/font/orbitron/Orbitron-SemiBold.ttf") format("truetype");
- font-weight: 600;
- font-style: normal;
- }
-
- @font-face {
- font-family: "Orbitron";
- src: url("../assets/font/orbitron/Orbitron-Bold.ttf") format("truetype");
- font-weight: 700;
- font-style: normal;
- }
-
-
- /* Orbitron end */
-
-
- /* Satoshi */
-
- @font-face {
- font-family: "Satoshi";
- src: url("../assets/font/satoshi/Satoshi-Regular.ttf") format("truetype");
- font-weight: 400;
- font-style: normal;
- }
-
- @font-face {
- font-family: "Satoshi";
- src: url("../assets/font/satoshi/Satoshi-Medium.ttf") format("truetype");
- font-weight: 500;
- font-style: normal;
- }
-
- @font-face {
- font-family: "Satoshi";
- src: url("../assets/font/satoshi/Satoshi-Bold.ttf") format("truetype");
- font-weight: 700;
- font-style: normal;
- }
-
-
- /* Satoshi end */
-
- *,
- *::after,
- *::before {
- margin: 0;
- padding: 0;
- box-sizing: inherit;
- font-family: "Orbitron", sans-serif;
- }
-
- .satoshi_font {
- font-family: "Satoshi", sans-serif;
- }
-
- html {
- font-size: 100%;
- }
-
- body {
- box-sizing: border-box;
- overflow-x: hidden;
- }
-
- @media only screen and (max-width: 56.25em) {
- body {
- padding: 0;
- }
- }
-
- .bg-green {
- background-color: #3bb78f;
- background: linear-gradient(90deg, #3bb78f 0%, #0bab64 35%, #3bb78f 100%);
- }
-
- .font-3 {
- font-size: 3rem;
- }
-
- .font-1_5 {
- font-size: 2rem;
- }
-
- .font-1_7 {
- font-size: 1.7rem;
- }
-
- .font-2 {
- font-size: 2.2rem;
- }
-
- .font-2_2 {
- font-size: 2.2rem;
- }
-
- .subtitle_1 {
- font-size: 1.5rem;
- }
-
- .gap-1 {
- gap: 0.7rem;
- }
-
- .banner_heading_4 {
- font-size: 3rem;
- }
-
- .padding_top_14 {
- padding-top: 14rem;
- }
-
- .padding_top_10 {
- padding-top: 10rem;
- }
-
- .p-6 {
- padding: 5rem;
- }
-
- .vh_60 {
- height: 60vh;
- }
-
- .vh-77 {
- height: 77vh;
- }
-
- .vh-85 {
- height: 85vh;
- }
-
- .vh-15 {
- height: 15vh;
- }
-
- .fw-600 {
- font-weight: 600;
- }
-
- .fw-700 {
- font-weight: 700;
- }
-
- .h-200p {
- height: 200px;
- }
-
-
- /* button */
-
- .button_dark {
- clip-path: polygon(75% 0, 86% 30%, 99% 66%, 100% 100%, 0 100%, 0 61%, 0 0);
- padding-right: 1.7rem;
- padding-bottom: 0.6rem;
- padding-top: 0.6rem;
- border-radius: 10px;
- }
-
-
- /* footer */
-
- .footer-wrapper li {
- line-height: 2rem;
- }
|