/* Portal layout contract while server-rendered views retain their original class names.
   Loaded after Bootstrap 5 and before portal styles. No Bootstrap 3 runtime is loaded.
   sm/md/lg retain 768/992/1200px: changing them would move existing settings columns. */
body { font-size: 14px; line-height: 1.42857143; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
p { margin: 0 0 10px; }
label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700; }
button, input, optgroup, select, textarea { font: inherit; }
input[type="checkbox"], input[type="radio"] { margin: 4px 0 0; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
th { text-align: left; }
hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; opacity: 1; }
.container, .container-fluid { padding-left: 15px; padding-right: 15px; max-width: none; }
.container { width: auto; }
@media (min-width: 768px) { .container { width: 750px; } }
@media (min-width: 992px) { .container { width: 970px; } }
@media (min-width: 1200px) { .container { width: 1170px; } }
/* Existing Web Forms rows include server wrappers as well as columns. Keep their
   established flow; feature-specific portal CSS may opt these rows into grid/flex. */
.row { display: block; margin: 0 -15px; }
.row > * { flex-shrink: 1; width: auto; max-width: none; padding: 0; margin-top: 0; }
.row::before, .row::after, .container::before, .container::after,
.container-fluid::before, .container-fluid::after { display: table; content: " "; }
.row::after, .container::after, .container-fluid::after { clear: both; }
[class^="col-sm-"], [class*=" col-sm-"], [class^="col-md-"], [class*=" col-md-"],
[class^="col-lg-"], [class*=" col-lg-"] {
  position: relative; float: none; width: 100%; min-height: 1px; padding: 0 15px;
}
.center-block { display: block; margin-left: auto; margin-right: auto; }
.img-responsive { display: block; max-width: 100%; height: auto; }
.pull-left { float: left !important; }
.pull-right { float: right !important; }
.hidden { display: none !important; }
@media (max-width: 767px) { .hidden-xs { display: none !important; } }
@media print { .hidden-print { display: none !important; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.btn { --bs-btn-font-size: 14px; --bs-btn-padding-x: 12px; --bs-btn-padding-y: 6px; --bs-btn-border-radius: 4px; line-height: 1.42857143; }
.btn-default { --bs-btn-color: #333; --bs-btn-bg: #fff; --bs-btn-border-color: #ccc; --bs-btn-hover-color: #333; --bs-btn-hover-bg: #e6e6e6; --bs-btn-hover-border-color: #adadad; --bs-btn-active-bg: #d4d4d4; }
.btn-lg { --bs-btn-font-size: 18px; --bs-btn-padding-x: 16px; --bs-btn-padding-y: 10px; }
.btn-sm { --bs-btn-font-size: 12px; --bs-btn-padding-x: 10px; --bs-btn-padding-y: 5px; }
.form-group { margin-bottom: 15px; }
.form-control { height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; border-radius: 4px; }
textarea.form-control { height: auto; }
.panel { margin-bottom: 20px; background: #fff; border: 1px solid transparent; border-radius: 4px; box-shadow: 0 1px 1px rgb(0 0 0 / 5%); }
.panel-default { border-color: #ddd; }
.panel-heading { padding: 10px 15px; border-bottom: 1px solid transparent; border-radius: 3px 3px 0 0; }
.panel-default > .panel-heading { color: #333; background: #f5f5f5; border-color: #ddd; }
.panel-body { padding: 15px; }
.panel-body::after { display: table; content: ""; clear: both; }
.well { min-height: 20px; padding: 19px; margin-bottom: 20px; background: #f5f5f5; border: 1px solid #e3e3e3; border-radius: 4px; }
/* The portal header uses its own menu markup rather than Bootstrap navbar markup. */
#topMain.nav { display: block; }
#topMain.nav > li { position: relative; display: block; float: left; }
#topMain.nav > li > a { position: relative; display: block; padding: 10px 15px; }
#topNav .dropdown-menu { margin: 2px 0 0; padding: 5px 0; font-size: 14px; list-style: none; }
#topNav .dropdown-menu > li > a { display: block; padding: 3px 20px; clear: both; font-weight: 400; line-height: 1.42857143; color: #333; white-space: nowrap; }
#topNav .dropdown-menu > li > a:hover { background-color: #f5f5f5; text-decoration: none; }
#topNav .dropdown-menu .divider { height: 1px; margin: 9px 0; overflow: hidden; background: #e5e5e5; }
.dropdown-toggle::after { display: none; }
.caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; }

/* Responsive column widths used by the authored portal views. */
@media (min-width: 768px) {
  .col-sm-1 { float: left; width: 8.33333333%; }
  .col-sm-2 { float: left; width: 16.66666667%; }
  .col-sm-3 { float: left; width: 25%; }
  .col-sm-4 { float: left; width: 33.33333333%; }
  .col-sm-5 { float: left; width: 41.66666667%; }
  .col-sm-6 { float: left; width: 50%; }
  .col-sm-7 { float: left; width: 58.33333333%; }
  .col-sm-8 { float: left; width: 66.66666667%; }
  .col-sm-9 { float: left; width: 75%; }
  .col-sm-10 { float: left; width: 83.33333333%; }
  .col-sm-11 { float: left; width: 91.66666667%; }
  .col-sm-12 { float: left; width: 100%; }
}
@media (min-width: 992px) {
  .col-md-1 { float: left; width: 8.33333333%; }
  .col-md-2 { float: left; width: 16.66666667%; }
  .col-md-3 { float: left; width: 25%; }
  .col-md-4 { float: left; width: 33.33333333%; }
  .col-md-5 { float: left; width: 41.66666667%; }
  .col-md-6 { float: left; width: 50%; }
  .col-md-7 { float: left; width: 58.33333333%; }
  .col-md-8 { float: left; width: 66.66666667%; }
  .col-md-9 { float: left; width: 75%; }
  .col-md-10 { float: left; width: 83.33333333%; }
  .col-md-11 { float: left; width: 91.66666667%; }
  .col-md-12 { float: left; width: 100%; }
}
@media (min-width: 1200px) {
  .col-lg-1 { float: left; width: 8.33333333%; }
  .col-lg-2 { float: left; width: 16.66666667%; }
  .col-lg-3 { float: left; width: 25%; }
  .col-lg-4 { float: left; width: 33.33333333%; }
  .col-lg-5 { float: left; width: 41.66666667%; }
  .col-lg-6 { float: left; width: 50%; }
  .col-lg-7 { float: left; width: 58.33333333%; }
  .col-lg-8 { float: left; width: 66.66666667%; }
  .col-lg-9 { float: left; width: 75%; }
  .col-lg-10 { float: left; width: 83.33333333%; }
  .col-lg-11 { float: left; width: 91.66666667%; }
  .col-lg-12 { float: left; width: 100%; }
}