anwi_website/dist/css/main.css

/*
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 {
  background-color: rgb(0, 0, 0);
  border-radius: 0 275px 0 0;
  clip-path: polygon(100% 0%, 100% 0%, 81% 100%, 92% -95%, 100% 100%, 0 100%, 0% 70%, 0 0);
}
.footer-wrapper li {
  line-height: 2rem;
}