* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Lato */
@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Light.ttf') format('opentype');
    font-weight: 300;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Regular.ttf') format('opentype');
    font-weight: 400;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Medium.ttf') format('opentype');
    font-weight: 600;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Bold.ttf') format('opentype');
    font-weight: 700;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/lato/Lato-Black.ttf') format('opentype');
    font-weight: 900;
}

/* Hanken_Grotesk */

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-Light.ttf') format('opentype');
    font-weight: 300;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-Regular.ttf') format('opentype');
    font-weight: 400;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-Medium.ttf') format('opentype');
    font-weight: 500;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-SemiBold.ttf') format('opentype');
    font-weight: 600;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-Bold.ttf') format('opentype');
    font-weight: 700;
}

@font-face {
    font-family: 'HankenGrotesk';
    src: url('../fonts/Hanken_Grotesk/static/HankenGrotesk-Black.ttf') format('opentype');
    font-weight: 900;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;


}

a {
    text-decoration: none;
}

.container {
    max-width: 1296px;
    width: 100%;
    margin: 0 auto;
    padding-left: 16px !important;
    padding-right: 16px !important;
}


body {
    /* padding-top: 190px; */
}

@media (min-width: 768px) and (max-width: 991px) {
    body {
        /* padding-top: 180px; */
    }
}

@media (min-width: 600px) and (max-width: 767px) {
    body {
        /* padding-top: 165px ; */
    }
}

@media (min-width: 320px) and (max-width: 599px) {
    body {
        /* padding-top: 160px ; */
    }
}