/* Global variables */
:root {
  --primary-color: #005899;
  --secondary-color: #41b6e6;
  --background-color: #f4f4f4;
  --grey-bgcolor: #b0b0b0;
  --text-color: #4d4d4d;
  --text-white: #ffffff;
  --heading-font: "Raleway", sans-serif;
  --body-font: "Open Sans", sans-serif;
}

body,
p,
li,
span,
a,
input,
textarea,
button,
select,
label,
blockquote,
td,
th,
strong {
  font-family: var(--body-font);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--heading-font);
}

p {
  font-weight: 400;
  font-size: 18px;
  /* TODO: We need to remove this and the other styling with `!important` flag because it's getting harder to override the styling on pages */
  margin: 0.5em 0 !important;
  color: var(--text-color);
  line-height: 32px;
  letter-spacing: 0.2px;
}

a:hover {
  color: var(--primary-color);
  text-decoration: none;
}

a {
  color: var(--text-color);
  text-decoration: underline;
  font-weight: 700 !important;
}

.post,
.page {
  margin: 0;
}

.divider {
  padding-block-start: 4px;
  padding-block-end: 14px;
  display: flex;
}

.divider-separator {
  border-block-start: 4px solid #41b6e6;
  width: 24px;
}

/* Star Icon */

ul.star-icon {
  list-style: none;
  padding-left: 0;
  margin-left: 20px;
}

ul.star-icon li {
  position: relative;
  margin-bottom: 10px;
}

ul.star-icon li:before {
  content: "";
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  background-image: url(../images/star.svg);
  background-size: auto;
  background-repeat: no-repeat;
  margin-top: 4px;
}

/* Button */

.btn-primary {
  background-color: var(--secondary-color);
  border: unset;
  width: auto;
}

.btn-primary:hover {
  background-color: var(--primary-color);
}

.row {
  margin-bottom: 40px;
}

/* CatFolders Document Gallery - Styles Override */

[id^="cf-app"] .icon-pdf:before {
  background-image: url("../images/catfolders-document-gallery/pdf.svg") !important;
  margin-bottom: 40px;
}

[id^="cf-app"] .icon-doc:before,
[id^="cf-app"] .icon-docx:before {
  background-image: url("../images/catfolders-document-gallery/doc.svg") !important;
}

[id^="cf-app"] .icon-xls:before,
[id^="cf-app"] .icon-xlsx:before {
  background-image: url("../images/catfolders-document-gallery/xls.svg") !important;
}

[id^="cf-app"] .icon-ppt:before,
[id^="cf-app"] .icon-pptx:before {
  background-image: url("../images/catfolders-document-gallery/ppt.svg") !important;
}

[id^="cf-app"] .icon-mov:before,
[id^="cf-app"] .icon-mp4:before {
  background-image: url("../images/catfolders-document-gallery/mp4.svg") !important;
}

[id^="cf-app"] .icon-html:before,
[id^="cf-app"] .icon-other:before {
  background-image: url("../images/catfolders-document-gallery/other.svg") !important;
}

[id^="cf-app"] .icon-wav:before {
  background-image: url("../images/catfolders-document-gallery/wav.svg") !important;
}

[id^="cf-app"] .icon-jpg:before {
  background-image: url("../images/catfolders-document-gallery/jpg.svg") !important;
}

[id^="cf-app"] .icon-zip:before {
  background-image: url("../images/catfolders-document-gallery/zip.svg") !important;
}

[id^="cf-app"] .cf-column-thumbnail {
  margin: 0 !important;
}

[id^="cf-app"] .cf-column-thumbnail,
[id^="cf-app"] .cf-column-thumbnail > span {
  background-color: #fafafa !important;
}

[id^="cf-app"] .sorting_1 {
  padding: 0 0.5rem;
}

[id^="cf-app"] .sorting_1 > div > a {
  padding: 0 0.5rem;
  text-decoration: underline !important;
  color: #0075BB !important;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

[id^="cf-app"] table.cf-table-grid {
  border-radius: 1.25rem;
}

[id^="cf-app"] table.cf-table-grid .cf-column-last.has-margin-top {
  margin-top: 1rem !important;
}

[id^="cf-app"] .cf-table.cf-table-grid.cf-has-thumbnail td:first-child.has-margin-bottom {
  margin-bottom: 1rem !important;
}

[id^="cf-app"] table.cf-table.collapsed .cf-icon {
  margin-left: 0 !important;
}

[id^="cf-app"] table.cf-table tbody > tr > td.dataTables_empty {
  text-align: center;
}

/* CatFolders Document Gallery - Styles Override END */

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#page,
#primary {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Hide the Constant Contact Form Pop-up (if necessary - by adding the `popup-ctct` class) */
body.popup-ctct .ctct-popup-form .ctct-popup-is-visible {
  display: none !important;
}
