@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

@font-face {
    font-family: 'BloggerSans';
    src: url('../fonts/Blogger_Sans.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-Bold';
    src: url('../fonts/Blogger_Sans-Bold.otf') format('opentype');
    font-weight: bold;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-Italic';
    src: url('../fonts/Blogger_Sans-Italic.otf') format('opentype');
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-BoldItalic';
    src: url('../fonts/Blogger_Sans-Bold_Italic.otf') format('opentype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-Light';
    src: url('../fonts/Blogger_Sans-Light.otf') format('opentype');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-LightItalic';
    src: url('../fonts/Blogger_Sans-Light_Italic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-Medium';
    src: url('../fonts/Blogger_Sans-Medium.otf') format('opentype');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'BloggerSans-MediumItalic';
    src: url('../fonts/Blogger_Sans-Medium_Italic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
:root {
    --black: #000;
    --white: #fff;
    --primary:#506071;
    --secundary:#808080;
    --terciario:#84B0B4;
    --cta:#6286A2;
}