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

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

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

:root{
    /* COLORS */
    --color-primary: #FDDC2C;
    --text-color: #333333;
    --placeholder: #989898;
    /* FONTS */
    --title-font: DMSans-Bold;
    --subtitle-font: DMSans-Medium;
    --paragraph-font: DMSans-Regular;
}

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

html{
    scroll-behavior: smooth;
}

h2{
    font-family: var(--subtitle-font);
    text-align: center;
    font-size: 35px;
}
h2,p{
    color: var(--text-color);
}
p{
    font-family: var(--paragraph-font);
}

/* Padding-generales */

header,section,footer{
    padding: 2em 7.5em;
}


/* MEDIA QUERYS */

@media only screen and (max-width: 1366px){
    header,section,footer{
        padding: 2em 4em;
    }
}


@media only screen and (max-width: 1024px){
    header,section,footer{
        padding: 1em 2em;
    }
}

@media only screen and (max-width: 560px){
    header,section,footer{
        padding: 1em;
    }
}