/*
 * Theme layer on top of Bootstrap 5.
 *
 * The theme's own CSS was written on top of Bootstrap 3's components (panels,
 * navbar, breadcrumb, modal). Bootstrap 5 dropped or reshaped those, so this
 * file restores the base look the theme relies on. It holds design values
 * only, no Bootstrap 3 code.
 */

/* Type defaults Bootstrap 3 set and the theme assumes */
h1, h2, h3 { margin-top: 20px; }
h4, h5, h6 { margin-top: 10px; }
a:focus, a:hover { color: #23527c; }
.small, small { font-size: 85%; }
ol, ul { margin-bottom: 10px; padding-left: 40px; }
td, th { padding: 0; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
dl { margin-bottom: 20px; }
b, strong { font-weight: 700; }
label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700; }
hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; opacity: 1; }
img { vertical-align: middle; }
.list-inline { padding-left: 0; margin-left: -5px; list-style: none; }
.list-inline > .list-inline-item { display: inline-block; margin-right: 0; padding-right: 5px; padding-left: 5px; }

/* Bootstrap 3 cleared floats and contained child margins on these */
.container::before, .container::after, .container-fluid::before, .container-fluid::after,
.nav::before, .nav::after, .navbar::before, .navbar::after, .navbar-header::before, .navbar-header::after,
.navbar-collapse::before, .navbar-collapse::after, .panel-body::before, .panel-body::after { content: " "; display: table; }
.container::after, .container-fluid::after, .nav::after, .navbar::after, .navbar-header::after,
.navbar-collapse::after, .panel-body::after { clear: both; }

/* Bootstrap 3 sized containers with width, not max-width (theme CSS caps
   max-width, which would otherwise let containers stretch on tablets) */
@media (min-width: 768px) { .container { width: 750px; } }
@media (min-width: 992px) { .container { width: 970px; } }
@media (min-width: 1200px) { .container { width: 1170px; } }

/* Columns were positioned in Bootstrap 3 */
.row > * { position: relative; min-height: 1px; }
/* Below 992px every column in these themes is full width. Keep rows as plain
   blocks there, as in Bootstrap 3, so vertical spacing between stacked
   sections stays the same (flex rows stop margins collapsing). These themes
   use no col-xs/col-sm widths below 100%, so nothing else changes. */
@media (max-width: 991.98px) {
	.row { display: block; }
	.row::before, .row::after { content: ""; display: table; }
	.row::after { clear: both; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
	.row > [class*="col-sm-"] { float: left; }
}

/* Icons (replace Glyphicons) */
.icon { display: inline-block; vertical-align: -0.125em; }
.more-less .icon-minus { display: none; }
.more-less.is-open .icon-plus { display: none; }
.more-less.is-open .icon-minus { display: inline-block; }

/* Navbar: Bootstrap 3 layout (floats) the theme was styled against */
.navbar { display: block; position: relative; min-height: 50px; margin-bottom: 20px; padding: 0; border: 1px solid transparent; }
.navbar > .container, .navbar > .container-fluid { display: block; }
.navbar-default { background-color: #f8f8f8; border-color: #e7e7e7; }
.navbar-collapse { border-top: 1px solid transparent; }
.navbar-default .navbar-collapse { border-color: #e7e7e7; }
.navbar-default .navbar-brand { color: #777; }
.navbar-default .navbar-nav > li > a { color: #777; }
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover { color: #333; background-color: transparent; }
.navbar-default .navbar-nav > .active > a { color: #555; background-color: #e7e7e7; }
.navbar-brand > img { display: block; }
.navbar-brand { float: left; height: 50px; margin: 0; padding: 15px; font-size: 18px; line-height: 20px; }
.navbar-collapse { padding-right: 15px; padding-left: 15px; }
.nav { display: block; padding-left: 0; margin-bottom: 0; list-style: none; }
.nav > li { position: relative; display: block; }
.nav > li > a { position: relative; display: block; padding: 10px 15px; }
.navbar-nav { display: block; margin: 7.5px -15px; }
.navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; line-height: 20px; }
@media (min-width: 768px) {
	.navbar { border-radius: 4px; }
	.navbar-header { float: left; }
	.navbar-header.float-end { float: right !important; }
	.navbar .navbar-collapse { display: block !important; width: auto; border-top: 0; box-shadow: none; }
	.navbar-nav { float: left; margin: 0; }
	.navbar-nav > li { float: left; }
	.navbar-nav > li > a { padding-top: 15px; padding-bottom: 15px; }
	.navbar-right { float: right !important; margin-right: -15px; }
	.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: -15px; }
	.container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: 0; margin-left: 0; }
}

/* Breadcrumb */
.breadcrumb { display: block; padding: 8px 15px; margin-bottom: 20px; list-style: none; background-color: #f5f5f5; border-radius: 4px; }
.breadcrumb > .breadcrumb-item { display: inline-block; padding-left: 0; }
.breadcrumb > .breadcrumb-item.active { color: #777; }

/* Panels (accordion on Features and FAQs) */
.panel { margin-bottom: 20px; background-color: #fff; border: 1px solid transparent; border-radius: 4px; box-shadow: 0 1px 1px rgba(0, 0, 0, .05); }
.panel-body { padding: 15px; }
.panel-heading { padding: 10px 15px; border-bottom: 1px solid transparent; border-top-left-radius: 3px; border-top-right-radius: 3px; }
.panel-title { margin-top: 0; margin-bottom: 0; font-size: 16px; color: inherit; }
.panel-title > a { color: inherit; }
.panel-default { border-color: #ddd; }
.panel-default > .panel-heading { color: #333; background-color: #f5f5f5; border-color: #ddd; }
.panel-group { margin-bottom: 20px; }
.panel-group .panel { margin-bottom: 0; border-radius: 4px; }
.panel-group .panel + .panel { margin-top: 5px; }
.panel-group .panel-heading { border-bottom: 0; }
.panel-group .panel-heading + .panel-collapse > .panel-body { border-top: 1px solid #ddd; }

/* Full-screen menu modal */
.modal-menu .modal-dialog { pointer-events: auto; }
.modal-menu .modal-content { border: 0; border-radius: 0; }

/* Pills (FAQ categories) */
.nav-pills > li { float: left; }
.nav-pills > li + li { margin-left: 2px; }
.nav-pills > li > .nav-link { border-radius: 4px; }

/* Forms (Contact Form 7 with Bootstrap markup) */
.form-group { margin-bottom: 15px; }
.help-block { display: block; margin-top: 5px; margin-bottom: 10px; color: #737373; }
.form-control { height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.428571429; color: #555; border-color: #ccc; border-radius: 4px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); }
textarea.form-control { height: auto; }
.badge { display: inline-block; min-width: 10px; padding: 3px 7px; font-size: 12px; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: middle; background-color: #777; border-radius: 10px; }
@media (min-width: 768px) { .navbar-left { float: left !important; } }

/* Tables keep Bootstrap 3's look */
.table { --bs-table-bg: transparent; --bs-table-color: inherit; --bs-table-hover-bg: #f5f5f5; --bs-table-hover-color: inherit; margin-bottom: 20px; }
.table > thead:first-child > tr:first-child > th, .table > thead:first-child > tr:first-child > td { border-top: 0; }
.table > :not(caption) > * > * { border-bottom-width: 0; border-top: 1px solid #ddd; line-height: 1.428571429; vertical-align: top; }
.table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #ddd; }

/* Close button (cookie banner) */
.close { float: right; font-size: 21px; font-weight: 700; line-height: 1; color: #000; text-shadow: 0 1px 0 #fff; opacity: .2; }
.close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; opacity: .5; }
button.close { padding: 0; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; appearance: none; }