/*
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;
}