html {
  scroll-behavior: smooth;
}

:root {
  /* Saturated brand-hue blue: distinct from the near-black body text, ~5.7:1 on white (AA) */
  --link-color: #1565c0;
  /* Darker shade for hover on always-underlined inline body links */
  --link-color-hover: #0d4f8c;
  /* System monospace stack for <code> / <kbd> */
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo,
          Consolas, "Liberation Mono", monospace;
}

body {
  padding-top: 0px;
  padding-bottom: 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  background-color: #ffffff;
  color: #222222;
}

strong {
  font-weight: 500;
}

/* Keep images from overflowing their container on narrow viewports. Several
   guide pages embed screenshots with hard width/height attributes (e.g.
   width="636"); without this they push the page wider than the phone viewport,
   which also shoves the fixed-navbar hamburger off-screen. */
img {
  max-width: 100%;
  height: auto;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
}

p {
  font-size: 17px;
  font-weight: 400;
}

h3 {
  font-weight: 400;
}

h2 + ol {
    margin-top: 15px;
}
h2 + ul {
    margin-top: 15px;
}
h3 + ol {
    margin-top: 15px;
}
h3 + ul {
    margin-top: 15px;
}
h4 + ol {
    margin-top: 15px;
}
h4 + ul {
    margin-top: 15px;
}
h5 + ol {
    margin-top: 15px;
}
h5 + ul {
    margin-top: 15px;
}

a {
  color: var(--link-color);
  font-weight: 400;
  text-decoration: none;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

a:focus {
  outline: 0 none;
}

a:hover {
  text-decoration: underline;
}

/* Inline links in page body content stay underlined so they're set apart from
   surrounding text by more than colour alone. Since the underline is always on,
   they shift colour on hover for feedback.
   Chrome links (nav, footer, buttons, print/anchor helpers) are excluded. */
.section-std-pg a:not(.btn):not(.anchor):not(.print) {
  text-decoration: underline;
}

.section-std-pg a:not(.btn):hover {
  color: var(--link-color-hover);
}

/* ...but not links that only wrap an image */
.section-std-pg a:has(> img) {
  text-decoration: none;
}

.navbar-nav .nav-link {
  font-weight: 400;
}

a.anchor {
  display: block;
  position: relative;
  top: -70px;
  visibility: hidden;
}

a.print{
  font-size: 18px;
  font-weight: 400;
}

.bio {
  background-color: #3a3a3a;
  margin-top: 20px;
  padding-left: 22px;
  padding-right: 22px;
  padding-bottom: 10px;
}

.bio p {
  color: #ffffff;
  font-size: 14px;
  line-height: 1.6;
}

.btn {
  margin: 0px;
  padding: 14px 28px 14px 28px;
  border: 0;
  border-radius: 8px;
  font-weight: 400;
  transition: box-shadow .15s ease-in-out;
}

.btn, .btn:hover, .btn:focus, .btn:active {
  text-decoration: none;
}

.btn:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
}

.btn-border {
  border-style: solid;
  border-width: 2px;
  padding: 12px 26px 12px 26px;
}

.btn:focus, .btn:active:focus, .btn.active:focus {
  outline: 0 none;
  border-color: #4c82a4;
}

.btn-primary {
  background: #4c82a4;
  color: #ffffff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
  background: #447493;
  border-color: #4c82a4;
}
.btn-primary:active {
  background: #3c6681;
  box-shadow: none;
  border-color: #4c82a4;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  background-color: #3c6681;
  border-color: #4c82a4;
}

.btn-accent {
  background: #c2571b;
  color: #ffffff;
}
.btn-accent:hover, .btn-accent:focus, .btn-accent:active, .btn-accent.active, .open > .dropdown-toggle.btn-accent {
  background: #a84714;
  border-color: #c2571b;
  color: #ffffff;
}
.btn-accent:active {
  background: #8f3c10;
  box-shadow: none;
  border-color: #c2571b;
  color: #ffffff;
}
.btn-accent:active:hover,
.btn-accent.active:hover,
.open > .dropdown-toggle.btn-accent:hover,
.btn-accent:active:focus,
.btn-accent.active:focus,
.open > .dropdown-toggle.btn-accent:focus,
.btn-accent:active.focus,
.btn-accent.active.focus,
.open > .dropdown-toggle.btn-accent.focus {
  background-color: #8f3c10;
  border-color: #c2571b;
  color: #ffffff;
}

.btn-outline {
    background-color: #ffffff;
    color: #4c82a4;
}
.btn-primary.btn-outline {
    color: #4c82a4;
}
.btn-primary.btn-outline:hover, .btn-primary.btn-outline:focus, .btn-primary.btn-outline:active, .btn-primary.btn-outline.active, .open > .dropdown-toggle.btn-primary.btn-outline {
  background: #e7eff4;
  border-color: #4c82a4;
  color: #4c82a4;
}
.btn-primary.btn-outline:active {
  background: #dae6ee;
  box-shadow: none;
  border-color: #4c82a4;
  color: #4c82a4;
}
.btn-primary.btn-outline:active:hover,
.btn-primary.btn-outline.active:hover,
.open > .dropdown-toggle.btn-primary.btn-outline:hover,
.btn-primary.btn-outline:active:focus,
.btn-primary.btn-outline.active:focus,
.open > .dropdown-toggle.btn-primary.btn-outline:focus,
.btn-primary.btn-outline:active.focus,
.btn-primary.btn-outline.active.focus,
.open > .dropdown-toggle.btn-primary.btn-outline.focus {
  background-color: #dae6ee;
  border-color: #4c82a4;
  color: #4c82a4;
}

.navbar.fixed-top {
  box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.navbar-news-content:before {
   content: "Order 2027 Tax Updates";
}

.navbar a {
   font-weight: 300;
}

/* The "More" dropdown is part of the nav, so its items use the dark nav-link
   text colour rather than the blue inline-link colour. Bootstrap's
   :hover/:focus state is left as-is. */
.navbar-nav .dropdown-menu .dropdown-item {
  color: #222222;
  font-weight: 400;
}

/* Suppress Bootstrap's blue :active highlight while an item is being clicked. */
.navbar-nav .dropdown-menu .dropdown-item:active {
  color: #222222;
  background-color: transparent;
}


.btn-news {
  font-size: 14px !important;
  font-weight: 300;
  text-transform: none !important;
  width: 100%;
  max-width: 250px;
  background: #4c82a4 !important;
  color: #ffffff !important;
  line-height: 1.4 !important;

  padding: 10px 16px 9px 16px !important;
}

/* BRAND LOGO FIX */
.navbar-brand {
  /* Forces the anchor wrapper to match the exact text height of the links */
  line-height: 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-right: 1.5rem;

  /* Ensures flex centering applies precisely inside the logo area */
  display: inline-flex !important;
  align-items: center !important;
}

.navbar-brand img {
  display: block;
  margin: 0 !important;
  /* If the navbar is still too tall, cap the image height slightly (e.g., 48px) */
  max-height: 48px;
  width: auto;
}


.btn-news:hover, .btn-news:focus, .btn-news:active, .btn-news.active, .open > .dropdown-toggle.btn-news {
  background: #447493 !important;
}

.btn-news:active {
  background: #3c6681 !important;
  box-shadow: none !important;
}

.allow-word-wrap {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.col-centered {
  float: none;
  margin: 0 auto;
}

.container-fluid {
  max-width: 1680px;
}

.container-fluid > .section-border {
  max-width: 900px;
}

.section-border > .section-std-pg {
  max-width: 700px;
}
.container-fluid > .section-std-pg {
  max-width: 700px;
}

.footer-main-links ul {
  margin-top: 0;
  margin-bottom: 10px;
}

.footer-list-group .footer-heading {
  color: #828282;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .5px;
  font-size: 14px;
  margin-top: 25px;
  margin-bottom: 8px;
}

.footer-main-links li {
  color: #ffffff;
  margin-left: 0;
  padding-left: 0;
  list-style-type: none;
  letter-spacing: .5px;
}

.fa_adjust-rt {
  vertical-align: top;
  padding-top: 1px;
  padding-left: 2px;
}

.fa_adjust-user-plus {
  vertical-align: top;
  padding-top: 1px;
  padding-left: 5px;
}

.fa_adjust-exchange {
  position: relative;
  top: -3px;
}

.fa_adjust-cloud {
  position: relative;
  top: -2px;
}

.fa-print-font {
  font-size: 130%;
  font-weight: 300;
}

.fa-smile-o-font {
  font-size: 130%;
  font-weight: 400;
}

.checkmark {
  border-radius: 50%;
  width: 50px;
  height: 50px;
  color: #ffffff;
  background: #4c82a4;
  border: none;
  font-size: 24px;
  text-align: center;
  vertical-align: bottom;
  padding-top: 10px;
  margin-top: 10px;
  float: left;
  box-shadow: 0 6px 14px rgba(76, 130, 164, .45);
}

.checkmark-text {
  margin-left: 80px;
}

.img-responsive img {
  max-width: 100%;
}

.jumbotron {
  text-align: center;
  background-image: url("../img/jumbotron_adobestock_88922803_1720x1147.jpg");
  background-size: cover;
  background-position: center top;
  min-height: 730px;
  max-width: 1680px;
  margin-bottom: 0px;
}

.jumbotron-div {
  padding: 40px 45px 50px 45px;
}

.jumbotron-msg {
  padding-top: 120px;
  padding-left: 40%;
  padding-right: 10%;
}

.jumbotron h1,
.jumbotron .h1 {
  color: #4c82a4;
  margin-bottom: 25px;
  font-weight: 500;
}

.jumbotron p {
  margin-bottom: 30px;
  font-size: 24px;
  font-weight: 400;
  color: #4c82a4;
}

.jumbotron-panel {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .18);
}

.help-faq h5 {
  margin-bottom: 0px;
}
.help-faq p {
  margin-bottom: 25px;
}

.issues-sub-hdr {
  font-size: 24px;
  font-weight: 400;
}

.std-sub-hdr {
  font-weight: 500;
}

.footer-list-group ul {
  padding-left: 0px;
  margin-left: 0;
  list-style-type: none;
}

.footer-list-group ul > li {
  font-size: 14px;
  color: #ffffff;
  padding-top: 4px;
  padding-bottom: 4px;
}

.footer-list-group ul > li > a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 300;
}

.footer-list-group ul > li > a:hover {
  text-decoration: underline;
}

.footer-sub-links {
  margin-top: 35px;
  text-align: center;
}
.footer-sub-links .div-logo-copyright {
  margin-top: 20px;
  padding-bottom: 40px;
}
.footer-sub-links .div-logo-copyright img.img-logo-copyright {
  display: inline;
  margin-right: 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  max-width: 125px;
  max-height: 24px;
}
.footer-sub-links .copyright {
  color: #ffffff;
  opacity: .5;
  font-weight: 300;
  font-size: 12px;
}
.footer-sub-links .trademark {
  display: block;
  margin-top: 8px;
  color: #ffffff;
  opacity: .5;
  font-weight: 300;
  font-size: 12px;
}

.navbar-easypay-logo {
  padding-top: 18px;
  padding-right: 10px;
}
.navbar-easypay-logo img {
  max-width: 150px;
  max-height: 29px;
}

.color-easypay-blue {
  color: #4c82a4;
}
.bk-color-easypay-blue {
  background-color: #4c82a4;
}
.bk-color-easypay-light-blue {
  background-color: #e7eff4;
}
.bk-color-footer {
  background-color: #303030;
  padding-top: 50px;
  border-top: 3px solid #4c82a4;
}
.bk-color-white {
  background-color: #ffffff;
}
.bk-color-tooltip {
  background-color: #ffffca;
}

.font-easystub {
  font-weight: 400;
  font-style: italic;
}

.section-footer {
  margin-bottom: 50px;
}

.section-footer p {
  padding-top: 0px;
  padding-bottom: 0px;
  font-size: 14px;
  font-weight: 300;
}

.section-quote-value h2 {
  font-weight: 400;
  font-size: 36px;
}

.section-quote-value p {
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.5;
}

code {
  font-family: var(--mono);
  font-size: 0.95em;
  font-weight: 400;
  color: #111111;
  background-color: #eef2f5;    /* faint tint of the site's #4c82a4 */
  padding: 0em 0.4em 0.1em 0.4em;
  overflow-wrap: anywhere;        /* long paths wrap on mobile */
  /* 1. Turns the dot into a slash for SF Mono (Mac) & Cascadia (Windows) */
  font-variant-numeric: slashed-zero;
  /* 2. Direct OpenType override for older browsers/environments */
  font-feature-settings: "zero" 1;
}

/* buttons, keys, and menu items the user clicks */
kbd {
  font-family: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, sans-serif;
  font-size: 0.95em;
  color: #222222;
  background-color: #f6f8fa;
  border: 1px solid #d0d7de;
  border-bottom-width: 2px;
  border-radius: 0.25rem;
  padding: 0em 0.4em 0.1em 0.4em;
  box-shadow: none;
  white-space: nowrap;
}

/* nested combos like Ctrl+C */
kbd kbd {
  border: 0;
  padding: 0;
  font-size: 100%;
}

/* computer output, messages the software displays back */
samp {
  /* font-family: "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; */
  font-family: Consolas, "Courier New", monospace;
  font-size: 1em;
  font-weight: 600;
  color: #111111;
  padding: 0em 0.2em;
}

/* labels displayed in the software or web site */
.ui-label {
  font-family: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, sans-serif;
  font-weight: 400;
  color: #111111;
  /* background-color: #e7eff4; */
  background-color: #eef2f5;    /* faint tint of the site's #4c82a4 */
  padding: 0em 0.4em 0.1em 0.4em;
  border: none;
}

/* menu navigation styling */
.menu-path {
  font-family: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, sans-serif;
  font-weight: 400;
  color: #111111;
  background-color: #eef2f5;    /* faint tint of the site's #4c82a4 */
  padding: 1px 6px;
}

.price-enlarge-150 {
  font-size: 150%;
  font-weight: 400;
}

.price-enlarge-110 {
  font-size: 110%;
  font-weight: 400;
}

.font-size-110-pct {
  font-size: 110%;
}

.div-support-img {
  text-align: center;
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
}

.section-support {
  padding: 50px 0px 50px 0px;
  max-width: 992px;
}
.section-support h2 {
  font-weight: 400;
}
.section-support p {
  padding-top: 20px;
  padding-bottom: 30px;
}

.section-try {
  padding: 50px 0px 50px 0px;
  max-width: 992px;
}
.section-try h2 {
  font-weight: 400;
}
.section-try p {
  padding-top: 10px;
  padding-bottom: 10px;
}

.div-try-img-col {
  text-align: center;
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
}

.div-try-text {
  text-align: center;
  padding: 20px 0 0 0;
}

.padding-top-5 {
  padding-top: 5px;
}
.padding-top-10 {
  padding-top: 10px;
}
.padding-top-20 {
  padding-top: 20px;
}

.padding-bottom-10 {
  padding-bottom: 10px;
}
.padding-bottom-20 {
  padding-bottom: 20px;
}
.padding-bottom-30 {
  padding-bottom: 30px;
}
.padding-bottom-40 {
  padding-bottom: 40px;
}
.padding-bottom-60 {
  padding-bottom: 60px;
}
.padding-bottom-80 {
  padding-bottom: 80px;
}

.div-cra-xml-link {
  padding: 20px 0px 10px 0px;
  margin: 0px 0px 20px 0px;
}

.div-cra-xml-link p {
  padding: 20px 0px 20px 0px;
}

.div-help-faq-hdr {
  padding-bottom: 60px;
}

.div-help-faq-hdr.pb-tight {
  padding-bottom: 20px;
}

.div-help-faq-hdr > .heading-xs {
  margin-bottom: 20px;
}

.border-top-rule {
  border-top: 1px solid #000000;
  padding-top: 40px;
}

.div-news {
  padding-bottom: 30px;
}

.div-help-faq-list {
  padding-bottom: 20px;
}

form .error {
  color: #ff0000;
}

.div-demoform-form {
  padding-top: 15px;
  padding-bottom: 10px;
}

.margin-bottom-0 {
  margin-bottom: 0px;
}
.margin-bottom-5 {
  margin-bottom: 5px;
}
.margin-bottom-5 > li {
  margin-bottom : 5px;
}

.margin-bottom-10 {
  margin-bottom: 10px;
}
.margin-bottom-10 > li {
  margin-bottom : 10px;
}

.margin-bottom-15 {
  margin-bottom: 15px;
}

.margin-bottom-20 {
  margin-bottom: 20px;
}

.margin-bottom-30 {
  margin-bottom: 30px;
}

.margin-bottom-50 {
  margin-bottom: 50px;
}

.margin-top-15 {
  margin-top: 15px !important;
}

.margin-top-20 {
  margin-top: 20px;
}

.div-download-list ul, .div-download-list ol {
  padding-bottom: 5px;
}

.div-help-faq-subhdr {
  padding-bottom: 15px;
}

.section-std-pg {
  padding-top: 35px;
  padding-bottom: 30px;
}

.section-std-pg h2, .section-std-pg h3, .section-std-pg h4, .section-std-pg h5, .section-std-pg h6 {
  letter-spacing: .2px;
}

.section-std-pg p {
  padding-top: 0px;
  padding-bottom: 0px;
  font-size: 17px;
  font-weight: 400;
}

.section-std-pg ul, .section-std-pg ol {
  font-size: 17px;
  font-weight: 400;
  padding-left: 15px;
}

.section-std-pg li {
  font-size: 17px;
  font-weight: 400;
  padding-left: 0;
}

.section-std-pg ul > li {
  list-style-type: disc;
}

.section-std-pg ol > li {
  list-style-type: decimal;
}

.section-avast p {
  padding-top: 10px;
}

.news-date p {
  font-size: 17px;
  font-weight: 400;
  padding-bottom: 15px;
}

.section-contact-wrapper {
  padding-top: 0px;
  padding-bottom: 10px;
}

.section-std-pg.contact-body-lg p {
  font-size: 18px;
}

.contact-body-lg .hours-of-operation p {
  font-size: 18px;
}

.checklist-wrapper {
  padding-top: 40px;
}

.feature-card {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .08);
  padding: 30px 25px 25px 25px;
  overflow: hidden;
  transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
}

.feature-card:hover {
  box-shadow: 0 10px 28px rgba(0, 0, 0, .12);
  transform: translateY(-3px);
}

.div-homepage-checklist {
  padding-top: 40px;
  padding-bottom: 75px;
}

.div-homepage-checklist h3 {
  font-size: 24px;
  font-weight: 400;
  letter-spacing: .2px;
}

.div-homepage-checklist p {
  font-size: 18px;
  padding-top: 2px;
  padding-bottom: 0px;
}

.div-why-easypay {
  padding-bottom: 50px;
  border-bottom: 1px dotted #4c82a4;
}

.try-easypay {
  color: #002e5d;
  padding-top: 40px;
  padding-bottom: 40px;
}
.try-easypay h2 {
  font-weight: 400;
}
.try-easypay p {
  padding-top: 15px;
  padding-bottom: 20px;
  font-size: 22px;
}

.table-no-border > thead > tr > th,
.table-no-border > tbody > tr > th,
.table-no-border > tfoot > tr > th,
.table-no-border > thead > tr > td,
.table-no-border > tbody > tr > td,
.table-no-border > tfoot > tr > td {
  border-top: none;
}

.table-no-border > tbody > tr > td {
  line-height: 15px;
}

.div-demoform-table {
  padding: 30px 30px 20px 30px;
}

.table-demoform {
  color: #ffffff;
  font-size: 16px;
  font-weight: 300;
  table-layout: fixed;
}

.table-demoform,
.table-demoform > :not(caption) > * > * {
  background-color: transparent;
  color: #ffffff;
  border: 0;
}

.table-seminars {
  font-size: 16px;
  table-layout: fixed;
}

.brochure {
  color: #002e5d;
  padding-top: 50px;
  padding-bottom: 60px;
}
.brochure p {
  font-size: 18px;
  padding-top: 20px;
}

.carousel-control-prev, .carousel-control-next {
  background: none !important;
  outline: 0;
}

.carousel-content {
  display: flex;
  align-items: center;
  margin: 0 auto;
}

.carousel-inner {
  padding-bottom: 10px;
}

/* Side padding clears the prev/next arrow controls. Uniform at every width. */
.carousel {
  padding: 0 50px;
}

.section-testimonials {
  font-weight: 300;
  margin-bottom: 30px;
  padding-bottom: 0px;
}

blockquote {
  border-left: none;
}

.section-testimonials blockquote {
  padding-top: 30px;
  padding-bottom: 30px;
}

.section-testimonials h3 {
  font-size: 30px;
  font-weight: 400;
  letter-spacing: 2px;
  margin-top: 25px;
  margin-bottom: 0px;
}
.section-testimonials p {
  font-size: 22px;
  color: #ffffff;
}

p.section-testimonials-footer {
  padding-top: 0px;
  font-size: 16px;
  font-weight: 300;
  letter-spacing: .2px;
  line-height: 1.3;
  color: #ffffff;
}

.div-great-value p {
  padding-top: 15px;
  padding-bottom: 0px;
  margin-bottom: 5px;
}

.div-single-quote blockquote {
  padding: 10px 0px 0px 0px;
  margin-bottom: 0px;
}

/* Blue quote-value band: consistent vertical breathing room at every width.
   Horizontal padding still varies by breakpoint (see the @media blocks). */
.div-multi-quote,
.div-great-value,
.div-single-quote {
  padding-top: 40px;
  padding-bottom: 60px;
}
.div-multi-quote {
  padding-left: 0;
  padding-right: 0;
}

p.single-quote-footer {
  padding-top: 0px;
  padding-bottom: 0px;
  font-size: 18px;
  font-weight: 300;
  letter-spacing: .2px;
  line-height: 1.3;
  color: #ffffff;
}

.easypay-features-caption {
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding-top: 20px;
  padding-bottom: 10px;
}

.div-training-dates {
  padding-top: 35px;
  padding-bottom: 30px;
}

.training-dates p {
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: #002e5d;
}

.page-caption {
  margin-top: 50px;
  padding-top: 50px;
  padding-bottom: 40px;
}

.hours-of-operation {
  padding-top: 5px;
  padding-bottom: 20px;
}

.hours-of-operation p {
  font-weight: 500;
}

.link-lg li {
  font-size: 18px;
  padding-bottom: 2px;
}

.link-xlg li {
  font-size: 22px;
  padding-bottom: 2px;
}

.easypay-features-link-arrow {
  padding-top: 50px;
  font-size: 20px;
  letter-spacing: 1.2px;
  text-transform: none;
  color: var(--link-color);
}

a.easypay-features-link-text:after {
  content: '\f105';
  font-family: "Font Awesome 6 Free";
  font-weight: 900; /* Required for the Solid style */
  padding-left: 8px;
}

.easypay-features-link-arrow a:hover {
  text-decoration: none;
  color: #000;
}

.easypay-features-link-arrow a {
  color: var(--link-color);
  font-weight: 400;
  text-decoration: none;
}

.text-dk-blue {
  color: #355b72;
}

.text-color-red {
  color: #dd1144; /*#C7254E;*/ /*#d9534f;*/
}

.text-white {
  color: #ffffff;
}

.saving-calc-input-col {
  max-width: 340px;
}

.div-savings-calc-results {
  background: #4c82a4;
  color: #ffffff;
  border: 0px;
  padding-top: 30px;
  padding-bottom: 20px;
  padding-left: 0px;
  padding-right: 0px;
}

.savings-calc-results-hdr {
  font-weight: 400;
  font-size: 34px;
  padding-bottom: 15px;
}

.savings-calc-hdr-underline {
  border-bottom: 2px solid;
  padding-bottom: 2px;
}

.savings-calc-results-label {
  font-weight: 400 !important;
  font-size: 34px;
  border: 0;
}

.savings-calc-results-amt {
  font-weight: 400;
  font-size: 34px;
  color: #ffffff;
  background: #4c82a4;
  border: 0;
  width: 240px;
  text-align: left;
  padding-left: 0px;
  -webkit-text-fill-color: #ffffff; /* Override iOS / Android font color change */
}

.savings-calc-table-amt {
  font-weight: 300;
  font-size: 16px;
  color: #ffffff;
  background: #4c82a4;
  border: 0px;
  width: 94px;
  text-align: right;
  vertical-align: top;
  padding: 0px;
  -webkit-text-fill-color: #ffffff; /* Override iOS / Android font color change */
}

.savings-calc-table-color > :not(caption) > * > * {
  background-color: #4c82a4; /* Custom color */
  color: white;              /* The text color */
  border-bottom-color: #4c82a4;
  border-bottom-width: 1px;
}

.savings-calc-table-color td.separator {
  border-bottom: 1px solid #ffffff !important;
}

.savings-calc-results-footer {
  font-size: 18px;
  font-weight: 300;
}

.div-savings-calc-table-footer ol > li {
  font-size: 16px;
  font-weight: 300;
  color: #ffffff;
  background: #4c82a4;
  padding-bottom: 15px;
}

.div-savings-calc-table-footer ol > li > a {
  color: #ffffff;
  font-weight: 400;
  text-decoration: underline;
}


/* Prefixed with .section-std-pg to keep outranking the generic
   `.section-std-pg a:not(.btn):hover` colour shift (white-on-blue context) */
.section-std-pg .div-savings-calc-table-footer ol > li > a:hover {
  color: #cccccc;
}

.div-savings-calc-table {
  max-width: 280px;
  padding-left: 10px;
  padding-right: 10px;
}

.savings-calc-table-easypay {
  margin-right: 40px;
}

.div-savings-calc-table tr {
  padding-top: 0px;
  padding-bottom: 0px;
}

.table-savings-calc-results {
  font-size: 16px;
  font-weight: 300;
  table-layout: fixed;
}

.table-savings-calc-results th.first {
  width: 60%;
  font-size: 20px;
  font-weight: 300;
}
.table-savings-calc-results th.second {
  width: 40%;
  font-size: 20px;
  font-weight: 300;
}

.separator {
  border-bottom: 1px solid white;
}

.div-wrapper {
  margin: 0px 0px 0px 0px;
}

label {
  font-weight: 400 !important;
}

/* ============================================================
   RESPONSIVE
   One block per breakpoint, mobile-first order.
   Bootstrap breakpoints only: 576 / 768 / 992.
   Anything that used to target a device-specific width
   (340 / 360 / 412 / 460 / 799) now folds into the nearest
   standard tier.
   ============================================================ */

@media screen and (min-width: 576px) {
  .div-demoform-table {
    padding: 30px 30px 20px 30px;
  }
  .table-demoform th.first {
    font-size: 20px;
    font-weight: 400;
    width: 25%;
  }
  .table-demoform th.second {
    font-size: 20px;
    font-weight: 400;
    width: 75%;
  }
}

@media screen and (min-width: 768px) {
  /* Nav links trimmed to match the slimmer navbar height. */
  .navbar-nav .nav-link {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    font-size: 14px;
    color: #222222;
  }
  /* Matches the default Bootstrap .dropdown-item font size in the "More" menu */
  .navbar-nav .nav-link.nav-link-fs-16 {
    font-size: 1rem;
  }

  h3 {
    font-size: 36px;
  }
  .section-std-pg h2, .section-std-pg h4 {
    font-size: 28px;
    font-weight: 300;
  }
  .section-std-pg h3, .section-std-pg h5 {
    font-size: 24px;
    font-weight: 300;
  }
  .heading-sm {
    font-size: 24px;
    font-weight: 300;
  }
  .heading-xs {
    font-size: 22px;
    font-weight: 600;
  }
  .section-std-pg h2.heading-sm {
    font-size: 24px;
    font-weight: 300;
  }
  .section-std-pg h2.heading-xs {
    font-size: 22px;
    font-weight: 600;
  }
  .section-std-pg h3.std-sub-hdr {
    font-size: 19px;
    font-weight: 500;
  }
  .try-easypay h2 {
    font-size: 28px;
  }
  .hours-of-operation p {
    font-size: 24px;
  }
  .page-caption-lg h3 {
    font-size: 42px;
    font-weight: 400;
  }
  .page-caption-md h1, .page-caption-md h3 {
    font-size: 36px;
    font-weight: 400;
  }
  .div-support-text h2 {
    font-size: 36px;
  }
  .div-support-text p {
    font-size: 20px;
  }
  .div-try-text h2 {
    font-size: 36px;
  }
  .div-try-text p {
    font-size: 20px;
  }
  .row-contact {
    padding-left: 60px;
  }

  .section-quote-value .bottom {
    border-bottom: none;
  }
  .section-quote-value {
    margin-top: 35px;
    margin-bottom: 30px;
    margin-left: 0px;
    margin-right: 0px;
  }
  .div-great-value {
    padding-left: 80px;
    padding-right: 40px;
  }
  .div-single-quote {
    padding-left: 40px;
    padding-right: 80px;
  }
  .btn-lg {
    font-size: 20px;
  }
  .div-try-img-col {
    padding-right: 15px;
  }
  .div-try-text-col {
    padding-left: 15px;
  }
}

@media screen and (min-width: 768px) and (max-width: 991.98px) {
  .div-support-text {
    padding: 10px 0px 0px 0px;
    text-align: right;
  }
}

@media screen and (min-width: 992px) {
  .bio {
    margin-top: 0px;
  }
  .footer-sub-links {
    margin-top: 50px;
    border-top: 1px solid #444444;
  }
  .footer-sub-links .div-logo-copyright {
    margin-top: 5px;
  }
  .footer-sub-links .div-logo-copyright img.img-logo-copyright {
    display: inline;
    margin-right: 10px;
  }
  .footer-sub-links .copyright {
    color: #ffffff;
    opacity: .5;
    font-size: 12px;
  }

  .div-support-text {
    padding: 40px 0px 0px 0px;
    text-align: right;
  }
  .div-support-text p {
    font-size: 22px;
  }
  .div-try-text p {
    font-size: 22px;
  }
}

@media screen and (max-width: 767.98px) {
  .btn-news {
    margin-top: 10px !important;
    padding: 12px 16px 11px 16px !important;
  }
  /* The navbar is .fixed-top, so its expanded hamburger menu is pinned to the
     viewport. On short screens (e.g. iPhone SE) the full link list is taller
     than the screen, pushing "News" and "Contact Us" off the bottom with no
     way to reach them. Cap the open menu to the space below the navbar and let
     it scroll. dvh keeps the last item reachable while Safari's toolbars show. */
  .navbar.fixed-top .navbar-collapse {
    max-height: calc(100vh - 64px);
    max-height: calc(100dvh - 64px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
  }

  h3 {
    font-size: 30px;
  }
  .section-std-pg h2, .section-std-pg h4 {
    font-size: 24px;
    font-weight: 400;
  }
  .section-std-pg h3, .section-std-pg h5 {
    font-size: 20px;
    font-weight: 400;
  }
  .heading-sm {
    font-size: 20px;
    font-weight: 400;
  }
  .heading-xs {
    font-size: 20px;
    font-weight: 600;
  }
  .section-std-pg h2.heading-sm {
    font-size: 20px;
    font-weight: 400;
  }
  .section-std-pg h2.heading-xs {
    font-size: 20px;
    font-weight: 600;
  }
  .section-std-pg h3.std-sub-hdr {
    font-size: 18px;
    font-weight: 500;
  }
  .try-easypay h2 {
    font-size: 24px;
  }
  .hours-of-operation p {
    font-size: 22px;
  }
  .page-caption-lg h3 {
    font-size: 30px;
    font-weight: 400;
  }
  .page-caption-md h1 {
    font-size: 30px;
    font-weight: 400;
  }
  .div-support-text h2 {
    font-size: 30px;
  }
  .div-support-text p {
    font-size: 18px;
  }
  .div-try-text h2 {
    font-size: 30px;
  }
  .div-try-text p {
    font-size: 18px;
  }
  .section-try {
    padding: 50px 0px 50px 0px;
  }
  .div-try-img-col {
    padding-right: 15px;
  }
  .div-try-text-col {
    padding-left: 15px;
  }
  .row-contact {
    padding-left: 0px;
  }
  .img-windows-logo {
    max-height: 30px;
  }

  .section-quote-value h2 {
    font-size: 30px;
  }
  .section-quote-value .bottom {
    border-bottom: 1px dotted white;
  }
  .section-quote-value .right {
    border-right: none;
  }
  .section-quote-value {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 20px;
    margin-right: 20px;
  }
  .div-great-value {
    padding-left: 10px;
    padding-right: 10px;
  }
  .div-single-quote {
    padding-left: 10px;
    padding-right: 10px;
  }
  .btn-lg {
    font-size: 18px;
  }

  .section-support {
    padding: 30px 0px 50px 0px;
  }
  .div-support-text {
    padding: 0px 0px 0px 0px;
    text-align: center;
  }

  .jumbotron-msg {
    padding-top: 120px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .jumbotron {
    padding-left: 20px;
    padding-right: 20px;
    min-height: 600px;
  }
  .jumbotron h1,
  .jumbotron .h1 {
    font-size: 42px;
  }
  .container .jumbotron,
  .container-fluid .jumbotron {
    padding-left: 20px;
    padding-right: 20px;
  }
}

@media screen and (max-width: 575.98px) {
  .footer-sub-links .div-logo-copyright img.img-logo-copyright {
    display: block;
    margin: 0 auto 10px;
  }

  .section-testimonials h3 {
    font-size: 24px;
    letter-spacing: 1.5px;
  }
  .section-testimonials p {
    font-size: 18px;
  }
  p.section-testimonials-footer {
    font-size: 14px;
  }
  .training-dates p {
    font-size: 18px;
  }

  /* was @media (max-width: 460.98px) */
  .easypay-features-caption {
    font-size: 16px;
    font-weight: 400;
  }
  .savings-calc-table-easypay {
    margin-right: 0px;
  }

  /* was @media (max-width: 340px) */
  .savings-calc-results-padding {
    padding-left: 0px;
    padding-right: 0px;
  }

  /* was @media (max-width: 412px) */
  .jumbotron-div {
    padding: 25px 20px 20px 20px;
  }
  .jumbotron-msg {
    padding-top: 80px;
  }
  .jumbotron p {
    font-size: 20px;
  }

  .div-demoform-table {
    padding: 20px 15px 10px 15px;
  }
  .table-demoform th.first {
    font-size: 16px;
    font-weight: 400;
    width: 40%;
  }
  .table-demoform th.second {
    font-size: 16px;
    font-weight: 400;
    width: 60%;
  }
}

@media print {
  .noprint {
    display: none;
  }
}
