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

@font-face {
    font-family: Poppins;
    src: url(/fonts/Poppins-Regular.ttf);
}

@font-face {
    font-family: Poppins-medium;
    src: url(/fonts/Poppins-Medium.ttf);
}

@font-face {
    font-family: Poppins-semibold;
    src: url(/fonts/Poppins-SemiBold.ttf);
}

:root{
    --labs-red: #EF5350;
    --black: #333332;
    --labs-orange: #EC6D31;
    --labs-yellow: #FAB722;
    --white: #FFFFFF;

    /* Fonts var */

    --paragraph-font: Poppins;
    --link-font: Poppins-medium;
    --title-font: Poppins-semibold;
}

label{
    font-family: var(--paragraph-font);
}

p{
    font-family: var(--paragraph-font);
    font-size: 1.6rem;
}

a{
    font-family: var(--link-font);
    font-size: 1.8rem;
    text-decoration: none;
}

h1,h2,h3{
    font-family: var(--title-font);
}

h1{
    font-size: 3.2rem;
    color: var(--black);
}

h2{
    font-size: 2.8rem;
}

h3{
    font-size: 2.2rem;
}

html{
    font-size: 62.5%;
}

.btn{
    display: flex;
    padding: 1rem 1.5rem;
    background: var(--labs-red);
    border-radius: 10px;
    color: var(--white);
}

.btn:hover{
    background: #F23936;
}


.header__container,
.main__container,
.footer__container{
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}


.title__container{
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        gap: 10px;
}



.line {
    width: 100%;
    height: 2px;
    border-top: 2px dotted var(--labs-red);
}