/* BuddyFile's Bootstrap 3 layout and custom artwork, kept outside vendor files.
   The application still uses this markup with Bootstrap 5's current JS/CSS. */

/* The default theme previously used Bootstrap's Helvetica typography. */
body:is(#BS-default, #BS-default-themed) {
  --buddyfile-jumbotron-bg: #eee;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
}
body:is(#BS-default, #BS-default-themed) :is(h1, h2, h3, h4, h5, h6) {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  margin-top: 20px;
  margin-bottom: 10px;
}
body:is(#BS-default, #BS-default-themed) h1 { font-size: 36px; }
body:is(#BS-default, #BS-default-themed) h2 { font-size: 30px; }
body:is(#BS-default, #BS-default-themed) h3 { font-size: 24px; }
body:is(#BS-default, #BS-default-themed) h4 { font-size: 18px; }
body:is(#BS-default, #BS-default-themed) h5 { font-size: 14px; }
body:is(#BS-default, #BS-default-themed) h6 { font-size: 12px; }
body:is(#BS-default, #BS-default-themed) .panel-title { margin: 0; font-size: 16px; }
body:is(#BS-default, #BS-default-themed) .modal-title { margin: 0; font-size: 18px; }
body:is(#BS-default, #BS-default-themed) #progress-circle .speedIndicator h3 { margin-top: 1rem; font-size: 1.5rem; }

/* Jumbotron was removed from Bootstrap 5: restore the upload/result frame. */
.jumbotron {
  padding: 30px 15px;
  margin-bottom: 30px;
  color: inherit;
  background-color: var(--buddyfile-jumbotron-bg, var(--bs-tertiary-bg));
  border: 1px solid var(--bs-border-color);
  border-radius: 6px;
}
.jumbotron h1 { color: inherit; }
.jumbotron > hr { border-top-color: var(--bs-border-color); }
@media (min-width: 768px) {
  .jumbotron { padding: 48px 60px; }
  .jumbotron h1 { font-size: 40px; }
}

/* These two classes were custom BuddyFile rules in the old Font Awesome file. */
.fa.fa-fw-main {
  display: inline-block;
  width: 70px;
  height: 70px;
  border: 2px solid #2b2b2b;
  border-radius: 50%;
  font-size: 40px;
  color: #2e6da4;
  text-align: center;
  line-height: 66px;
  margin-right: 8px;
}
.fa.fa-lg-main { vertical-align: -5%; }
#landingInfoRow h2 { font-size: 30px; line-height: 1.25; }
body:is(#BS-darkly, #BS-slate, #BS-superhero) .fa.fa-fw-main {
  border-color: var(--bs-border-color);
  color: var(--bs-link-color);
}

/* Controls, semantic colours and helpers used throughout the PHP templates. */
.btn-xs, .btn-group-xs > .btn { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; }
.btn-lg, .btn-group-lg > .btn { padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px; }
.input-sm { min-height: 30px; padding: 5px 10px; font-size: 12px; border-radius: 3px; }
.input-lg { min-height: 46px; padding: 10px 16px; font-size: 18px; border-radius: 6px; }
.img-responsive, .thumbnail > img { display: block; max-width: 100%; height: auto; }
.center-block { display: block; margin-right: auto; margin-left: auto; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-justify { text-align: justify; }
.progress { position: relative; }
.progress-usedSpace { height: 32px; margin-bottom: 20px; }
.progress.progress-usedSpace .progress-text { inset: 0; width: 100%; display: flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1; }
.progress-usedSpace .progress-text .label { font-size: inherit; line-height: 1.2; padding: 4px 8px; }
.progress-bar-success { background-color: var(--bs-success); }
.progress-bar-info { background-color: var(--bs-info); }
.progress-bar-warning { background-color: var(--bs-warning); }
.progress-bar-danger { background-color: var(--bs-danger); }
.progress-bar-primary { background-color: var(--bs-primary); }
.progress-bar.active { animation: progress-bar-stripes 1s linear infinite; }
.label-info { background-color: var(--bs-info); }
.bg-success { background-color: var(--bs-success-bg-subtle) !important; }
.bg-info { background-color: var(--bs-info-bg-subtle) !important; }
.bg-warning { background-color: var(--bs-warning-bg-subtle) !important; }
.bg-danger { background-color: var(--bs-danger-bg-subtle) !important; }
.bg-warning .text-warning { color: var(--bs-warning-text-emphasis) !important; }
.bg-danger .text-danger { color: var(--bs-danger-text-emphasis) !important; }
.panel-success { border-color: var(--bs-success-border-subtle); }
.panel-success > .panel-heading { color: var(--bs-success-text-emphasis); background: var(--bs-success-bg-subtle); }
.panel-info { border-color: var(--bs-info-border-subtle); }
.panel-info > .panel-heading { color: var(--bs-info-text-emphasis); background: var(--bs-info-bg-subtle); }
.panel-warning { border-color: var(--bs-warning-border-subtle); }
.panel-warning > .panel-heading { color: var(--bs-warning-text-emphasis); background: var(--bs-warning-bg-subtle); }
.panel-danger { border-color: var(--bs-danger-border-subtle); }
.panel-danger > .panel-heading { color: var(--bs-danger-text-emphasis); background: var(--bs-danger-bg-subtle); }
.thumbnail { display: block; padding: 4px; margin-bottom: 20px; border: 1px solid var(--bs-border-color); border-radius: 4px; }
.thumbnail .caption { padding: 9px; }

.input-group-btn { position: relative; display: flex; flex-shrink: 0; white-space: nowrap; }
.input-group > .form-control:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .input-group-btn > .btn { border-radius: 0; height: 100%; }
.input-group > .input-group-btn:last-child > .btn:last-of-type { border-top-right-radius: var(--bs-border-radius); border-bottom-right-radius: var(--bs-border-radius); }
.input-group > .input-group-btn:first-child > .btn:first-of-type { border-top-left-radius: var(--bs-border-radius); border-bottom-left-radius: var(--bs-border-radius); }
.form-horizontal .form-group { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.form-horizontal .form-group > [class*="col-"] { padding-right: 15px; padding-left: 15px; }
.form-horizontal .control-label { padding-top: 7px; }
@media (min-width: 768px) {
  .form-horizontal .control-label { text-align: right; }
  .form-inline .form-group { display: inline-flex; align-items: center; margin-bottom: 0; }
  .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; }
}

/* Restore navigation state and responsive helpers removed/renamed in v5. */
.navbar-inverse .navbar-nav > li > a { color: #9d9d9d; }
.navbar-inverse .navbar-nav > li > a:hover { color: #fff; }
.navbar-inverse .navbar-nav > .active > a { color: #fff; background-color: #080808; }
.navbar-default .navbar-nav > .active > a { color: var(--bs-body-color); background-color: var(--bs-secondary-bg); }
.navbar-nav > li > a { padding: 15px; line-height: 20px; }
.navbar .dropdown-menu { min-width: 160px; }
.caret { display: inline-block; width: 0; height: 0; vertical-align: middle; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; }
.dropdown-toggle:has(.caret, .fa)::after { display: none; } /* Avoid a second caret beside a template's own icon. */
.visible-xs, .visible-sm, .visible-md, .visible-lg { display: none !important; }
@media (max-width: 767px) {
  .visible-xs { display: block !important; }
  .hidden-xs { display: none !important; }
  .navbar-toggle { display: block; }
  .navbar-header { width: 100%; display: flex; }
  .navbar-collapse { flex-basis: 100%; }
  .navbar .navbar-collapse.collapse:not(.show) { display: none; }
  .navbar-nav { flex-direction: column; }
  .navbar-right { margin-left: 0; }
  .navbar-inverse .navbar-toggle { color: #fff; border-color: #777; }
  body #landingInfoRow h2 { font-size: 26px; }
}
@media (min-width: 768px) {
  .navbar-toggle { display: none; }
  .navbar-header { width: auto; }
  .navbar-collapse.collapse { display: flex; }
  .navbar-nav { flex-direction: row; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm { display: block !important; }
  .hidden-sm { display: none !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md { display: block !important; }
  .hidden-md { display: none !important; }
}
@media (min-width: 1200px) {
  .visible-lg { display: block !important; }
  .hidden-lg { display: none !important; }
}

/* The old sticky footer used a fixed 110px height; content now determines it. */
html, body { min-height: 100%; }
body { display: flex; flex-direction: column; }
#wrapper_main { flex: 1 0 auto; min-height: 0; height: auto; margin: 0; padding-bottom: 30px; }
#push { display: none; }
#footer { flex-shrink: 0; height: auto; padding: 15px 0; }
#footer h6 { margin-top: 0; }
#footer p { margin-bottom: 0; }
#footer a { text-decoration: none; }
#footer a:hover { text-decoration: underline; }

/* Grid rules follow below: the PHP views were written for 768/992/1200px. */

.row { --bs-gutter-x: 30px; }
.container, .container-fluid { --bs-gutter-x: 30px; }
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { flex: 0 0 auto; width: 100%; }
.col-xs-offset-0, .col-xs-offset-1, .col-xs-offset-2, .col-xs-offset-3, .col-xs-offset-4, .col-xs-offset-5, .col-xs-offset-6, .col-xs-offset-7, .col-xs-offset-8, .col-xs-offset-9, .col-xs-offset-10, .col-xs-offset-11, .col-xs-offset-12, .col-sm-offset-0, .col-sm-offset-1, .col-sm-offset-2, .col-sm-offset-3, .col-sm-offset-4, .col-sm-offset-5, .col-sm-offset-6, .col-sm-offset-7, .col-sm-offset-8, .col-sm-offset-9, .col-sm-offset-10, .col-sm-offset-11, .col-sm-offset-12, .col-md-offset-0, .col-md-offset-1, .col-md-offset-2, .col-md-offset-3, .col-md-offset-4, .col-md-offset-5, .col-md-offset-6, .col-md-offset-7, .col-md-offset-8, .col-md-offset-9, .col-md-offset-10, .col-md-offset-11, .col-md-offset-12, .col-lg-offset-0, .col-lg-offset-1, .col-lg-offset-2, .col-lg-offset-3, .col-lg-offset-4, .col-lg-offset-5, .col-lg-offset-6, .col-lg-offset-7, .col-lg-offset-8, .col-lg-offset-9, .col-lg-offset-10, .col-lg-offset-11, .col-lg-offset-12 { margin-left: 0; }
.col-xs-1 { width: 8.33333333%; }
.col-xs-2 { width: 16.66666667%; }
.col-xs-3 { width: 25.00000000%; }
.col-xs-4 { width: 33.33333333%; }
.col-xs-5 { width: 41.66666667%; }
.col-xs-6 { width: 50.00000000%; }
.col-xs-7 { width: 58.33333333%; }
.col-xs-8 { width: 66.66666667%; }
.col-xs-9 { width: 75.00000000%; }
.col-xs-10 { width: 83.33333333%; }
.col-xs-11 { width: 91.66666667%; }
.col-xs-12 { width: 100.00000000%; }
.col-xs-offset-0 { margin-left: 0.00000000%; }
.col-xs-offset-1 { margin-left: 8.33333333%; }
.col-xs-offset-2 { margin-left: 16.66666667%; }
.col-xs-offset-3 { margin-left: 25.00000000%; }
.col-xs-offset-4 { margin-left: 33.33333333%; }
.col-xs-offset-5 { margin-left: 41.66666667%; }
.col-xs-offset-6 { margin-left: 50.00000000%; }
.col-xs-offset-7 { margin-left: 58.33333333%; }
.col-xs-offset-8 { margin-left: 66.66666667%; }
.col-xs-offset-9 { margin-left: 75.00000000%; }
.col-xs-offset-10 { margin-left: 83.33333333%; }
.col-xs-offset-11 { margin-left: 91.66666667%; }
.col-xs-offset-12 { margin-left: 100.00000000%; }
@media (min-width: 768px) {
.col-sm-1 { width: 8.33333333%; }
.col-sm-2 { width: 16.66666667%; }
.col-sm-3 { width: 25.00000000%; }
.col-sm-4 { width: 33.33333333%; }
.col-sm-5 { width: 41.66666667%; }
.col-sm-6 { width: 50.00000000%; }
.col-sm-7 { width: 58.33333333%; }
.col-sm-8 { width: 66.66666667%; }
.col-sm-9 { width: 75.00000000%; }
.col-sm-10 { width: 83.33333333%; }
.col-sm-11 { width: 91.66666667%; }
.col-sm-12 { width: 100.00000000%; }
.col-sm-offset-0 { margin-left: 0.00000000%; }
.col-sm-offset-1 { margin-left: 8.33333333%; }
.col-sm-offset-2 { margin-left: 16.66666667%; }
.col-sm-offset-3 { margin-left: 25.00000000%; }
.col-sm-offset-4 { margin-left: 33.33333333%; }
.col-sm-offset-5 { margin-left: 41.66666667%; }
.col-sm-offset-6 { margin-left: 50.00000000%; }
.col-sm-offset-7 { margin-left: 58.33333333%; }
.col-sm-offset-8 { margin-left: 66.66666667%; }
.col-sm-offset-9 { margin-left: 75.00000000%; }
.col-sm-offset-10 { margin-left: 83.33333333%; }
.col-sm-offset-11 { margin-left: 91.66666667%; }
.col-sm-offset-12 { margin-left: 100.00000000%; }
}
@media (min-width: 992px) {
.col-md-1 { width: 8.33333333%; }
.col-md-2 { width: 16.66666667%; }
.col-md-3 { width: 25.00000000%; }
.col-md-4 { width: 33.33333333%; }
.col-md-5 { width: 41.66666667%; }
.col-md-6 { width: 50.00000000%; }
.col-md-7 { width: 58.33333333%; }
.col-md-8 { width: 66.66666667%; }
.col-md-9 { width: 75.00000000%; }
.col-md-10 { width: 83.33333333%; }
.col-md-11 { width: 91.66666667%; }
.col-md-12 { width: 100.00000000%; }
.col-md-offset-0 { margin-left: 0.00000000%; }
.col-md-offset-1 { margin-left: 8.33333333%; }
.col-md-offset-2 { margin-left: 16.66666667%; }
.col-md-offset-3 { margin-left: 25.00000000%; }
.col-md-offset-4 { margin-left: 33.33333333%; }
.col-md-offset-5 { margin-left: 41.66666667%; }
.col-md-offset-6 { margin-left: 50.00000000%; }
.col-md-offset-7 { margin-left: 58.33333333%; }
.col-md-offset-8 { margin-left: 66.66666667%; }
.col-md-offset-9 { margin-left: 75.00000000%; }
.col-md-offset-10 { margin-left: 83.33333333%; }
.col-md-offset-11 { margin-left: 91.66666667%; }
.col-md-offset-12 { margin-left: 100.00000000%; }
}
@media (min-width: 1200px) {
.col-lg-1 { width: 8.33333333%; }
.col-lg-2 { width: 16.66666667%; }
.col-lg-3 { width: 25.00000000%; }
.col-lg-4 { width: 33.33333333%; }
.col-lg-5 { width: 41.66666667%; }
.col-lg-6 { width: 50.00000000%; }
.col-lg-7 { width: 58.33333333%; }
.col-lg-8 { width: 66.66666667%; }
.col-lg-9 { width: 75.00000000%; }
.col-lg-10 { width: 83.33333333%; }
.col-lg-11 { width: 91.66666667%; }
.col-lg-12 { width: 100.00000000%; }
.col-lg-offset-0 { margin-left: 0.00000000%; }
.col-lg-offset-1 { margin-left: 8.33333333%; }
.col-lg-offset-2 { margin-left: 16.66666667%; }
.col-lg-offset-3 { margin-left: 25.00000000%; }
.col-lg-offset-4 { margin-left: 33.33333333%; }
.col-lg-offset-5 { margin-left: 41.66666667%; }
.col-lg-offset-6 { margin-left: 50.00000000%; }
.col-lg-offset-7 { margin-left: 58.33333333%; }
.col-lg-offset-8 { margin-left: 66.66666667%; }
.col-lg-offset-9 { margin-left: 75.00000000%; }
.col-lg-offset-10 { margin-left: 83.33333333%; }
.col-lg-offset-11 { margin-left: 91.66666667%; }
.col-lg-offset-12 { margin-left: 100.00000000%; }
}

@media (min-width: 576px) and (max-width: 767px) { .container { max-width: none; } }
@media (min-width: 768px) { .container { max-width: 750px; } }
@media (min-width: 992px) { .container { max-width: 970px; } }
@media (min-width: 1200px) { .container { max-width: 1170px; } }
.SFSCharts .panel-title a { color: inherit; text-decoration: none; }
.SFSCharts .legendLayer .background { fill: var(--bs-body-bg); fill-opacity: .95; stroke: var(--bs-border-color); }
.SFSCharts .legendLayer text { fill: var(--bs-body-color); }
#updownloadsPanel .xAxis .tickLabel { transform: none; margin: 0; }

