@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');

:root {
    --font-experiment-body: "IBM Plex Sans", Arial, sans-serif;
    --font-experiment-ui: "IBM Plex Sans", Arial, sans-serif;
    --font-experiment-heading: "IBM Plex Sans", Arial, sans-serif;
}

html,
body {
    font-family: var(--font-experiment-body) !important;
    font-size: 15px;
    line-height: 1.5;
}

body,
p,
span,
li,
dt,
dd,
blockquote,
figcaption,
small,
time,
article,
section,
main {
    font-family: var(--font-experiment-body);
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.display-1,
.display-2,
.display-3,
.display-4,
.page-title,
.section-title,
.card-title,
.modal-title,
.list-group-header,
.dropdown-header,
legend {
    font-family: var(--font-experiment-heading) !important;
    font-weight: 600;
    line-height: 1.2;
}

b,
strong,
.font-weight-bold,
.font-weight-bolder {
    font-weight: 700;
}

button,
label,
select,
textarea,
input,
optgroup,
option,
summary,
th,
td,
caption,
nav,
header,
footer,
aside,
table,
.btn,
.badge,
.breadcrumb,
.card-header,
.custom-control,
.custom-file,
.custom-select,
.dropdown-item,
.dropdown-menu,
.form-control,
.form-check,
.form-group,
.form-text,
.input-group,
.input-group-text,
.list-group-item,
.modal-content,
.nav,
.navbar,
.page-item,
.page-link,
.pagination,
.tab-pane,
.table,
.toast,
.tooltip,
.popover,
.top-bar,
.top-bar-item,
.top-bar-brand,
.top-bar-list,
.tile,
.hamburger,
.menu,
.menu-item,
.menu-link {
    font-family: var(--font-experiment-ui) !important;
}

input,
select,
textarea,
button,
.btn,
.form-control,
.input-group-text,
.dropdown-item,
.page-link,
.menu-link,
.nav-link,
.table,
.badge {
    line-height: 1.35;
}

.fa,
.fal,
.far,
.fas {
    font-family: "Font Awesome 5 Pro" !important;
}

.fab {
    font-family: "Font Awesome 5 Brands" !important;
}

.fad {
    font-family: "Font Awesome 5 Duotone" !important;
}
