.header_style {
background-color: var(--header-bg);
color: var(--header-text);
border-bottom-width: var(--header-border-weight);
border-bottom-color: var(--header-border-colour);
font-family: var(--header-font);
}

.footer_style {
background-color: var(--footer-bg);
color: var(--footer-text);
border-top-width: var(--footer-border-weight);
border-top-color: var(--footer-border-colour);
font-family: var(--footer-font);
}

.footer_compliance_style {
background-color: var(--footer-compliance-bg);
color: var(--footer-compliance-text);
border-top-width: var(--footer-compliance-border-weight);
border-top-color: var(--footer-compliance-border-colour);
font-family: var(--footer-compliance-font);
}

.buttons {
border-radius: var(--button-shape);
text-align: center;
padding: 0.5rem 1rem;
display: flex;
justify-content: center;
align-items: center;
font-weight: 700;
cursor: pointer !important;
}

.header_primary_button{
background-color: var(--header-primary);
color: var(--header-primary-text);
}

.header_primary_button:hover {
background-color: var(--header-primary-hover) !important;
}

.header_secondary_button{
border-width: 1px;
border-color: var(--header-secondary);
color: var(--header-text);
}

.header_secondary_button:hover {
background-color: var(--header-bg-hover) !important;
}

.bg-primary-colour {
background-color: var(--team-primary-colour) !important;
color: var(--team-primary-colour-text);
}

.text-use-primary-colour {
color: var(--team-primary-colour) !important;
}

.bg-secondary-colour {
background-color: var(--team-secondary-colour) !important;
color: var(--team-secondary-colour-text);
}

.text-use-secondary-colour {
color: var(--team-secondary-colour) !important;
}

.bg-accent-colour {
background-color: var(--team-accent-colour) !important;
color: var(--team-accent-colour-text);
}

.text-use-accent-colour {
color: var(--team-accent-colour) !important;
}

.bg-primary-colour-with-hover {
background-color: var(--team-primary-colour) !important;
color: var(--team-primary-colour-text);
}

.bg-primary-colour-with-hover:hover {
background-color: var(--team-primary-colour-hover) !important;
}

.bg-secondary-colour-with-hover {
background-color: var(--team-secondary-colour) !important;
color: var(--team-secondary-colour-text);
}

.bg-secondary-colour-with-hover:hover {
background-color: var(--team-secondary-colour-hover) !important;
}

.bg-accent-colour-with-hover {
background-color: var(--team-accent-colour) !important;
color: var(--team-accent-colour-text);
}

.bg-accent-colour-with-hover:hover {
background-color: var(--team-accent-colour-hover) !important;
}

.primary-colour-border {
border-color: var(--team-primary-colour) !important;
}

.border-use-text-colour {
border-color: var(--team-primary-colour-text) !important;
}

.secondary-colour-border {
border-color: var(--team-secondary-colour) !important;
}

.accent-colour-border {
border-color: var(--team-accent-colour) !important;
}

.focus-within-accent-colour-border:focus-within {
border-color: var(--team-accent-colour) !important;
}

.focus-accent-colour-border:focus {
border-color: var(--team-accent-colour) !important;
}

.focus-reduced-accent-colour-outline:focus-within {
outline: 4px solid var(--team-opaque-accent-colour);
}

.focus-reduced-primary-colour-outline:focus-within {
outline: 4px solid var(--team-opaque-primary-colour);
}

.focus-within-primary-colour-border:focus-within {
border-color: var(--team-primary-colour) !important;
}

.focus-primary-colour-border:focus {
border-color: var(--team-primary-colour) !important;
}

.bg-primary-reduced-opacity {
background-color: var(--team-opaque-primary-colour) !important;
}

.bg-secondary-reduced-opacity {
background-color: var(--team-opaque-secondary-colour) !important;
}

.bg-accent-reduced-opacity {
background-color: var(--team-opaque-accent-colour) !important;
}

.page-footer-facebook-svg {
width: 1.5rem;
height: 1.5rem;
fill: var(--footer-text);
}

.page-footer-svg-container {
width: 1.5rem;
height: 1.5rem;
display: flex;
justify-content: center;
align-items: center;
border-radius: 9999px;
background-color: var(--footer-text);
}

.page-footer-facebook-svg:hover, .page-footer-svg-container:hover{
opacity: 0.7;
}

.page-footer-svg-container svg {
fill: var(--footer-bg);
}

.footer_links ul li a:hover {
opactity: 1;
}