:root {
    --black: #1c1c1c;
    --gray: #505050;
    --white: #f2f2f2;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
    text-decoration: none;
}

/* 
100 - thin
200 - extralight
300 - light
400 - normal
500 - medium
600 - semibold
700 - bold
800 - extrabold
900 - boldest
*/

@font-face {
    font-family: Playfair Display;
    src: url("./fonts/PlayfairDisplay-VariableFont_wght.ttf");
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Thin.ttf");
    font-weight: 100;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-ExtraLight.ttf");
    font-weight: 200;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Light.ttf");
    font-weight: 300;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Regular.ttf");
    font-weight: 400;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Medium.ttf");
    font-weight: 500;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-SemiBold.ttf");
    font-weight: 600;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Bold.ttf");
    font-weight: 700;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-ExtraBold.ttf");
    font-weight: 800;
}

@font-face {
    font-family: Fira Sans;
    src: url("./fonts/FiraSans-Black.ttf");
    font-weight: 900;
}