@font-face {
font-family: fontLight;
src: url(fonts/inter/Light.ttf);
}

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


:root {
--my-announcement-bg-color: #417c21;
--my-announcement-text-color: #ffffff;
--my-header-bg-color: #ffffff;
--my-header-text-color: #417c21;

--my-primary-bg-color: #ffffff ;
--my-secondary-bg-color: #e0e0e0 ;
--my-primary-text-color: #000000;
--my-secondary-text-color: #5a5858;
--my-buy-btn-bg-color: #417c21;
--my-buy-btn-text-color: #ffffff;
--my-btn-bg-color: #417c21;
--my-btn-text-color: #ffffff;

--my-footer-bg-color: #f7f7f5;
--my-footer-text-color: #000000;
}


.my__bg-announcement {
background-color: var(--my-announcement-bg-color);
}
.my__text-announcement {
color: var(--my-announcement-text-color);
}
.my__bg-header {
background-color: var(--my-header-bg-color);
}
.my__text-header {
color: var(--my-header-text-color);
}


.my__bg-primary {
background-color: var(--my-primary-bg-color);
}
.my__bg-secondary {
background-color: var(--my-secondary-bg-color);
}
.my__text-primary {
color: var(--my-primary-text-color);
}
.my__text-secondary {
color: var(--my-secondary-text-color);
}


.my__bg-footer {
background-color: var(--my-footer-bg-color);
}
.my__text-footer {
color: var(--my-footer-text-color);
}