:root {
  --teal: #008080;
  --dark-slate: #182828;
  --decor-bg: #f1f1f1;
  --footer-bg: #D3D3D3;
  --extra-highlight: #7ed957;
  --gray-text: #3b3b3b; }

body.soft, .card.soft {
  background-color: #FAF9F6 !important; }

.nav {
  --bs-link-color: var(--teal);
  --bs-link-hover-color: var(--dark-slate); }

.footer {
  --bs-link-color: #000;
  --bs-link-hover-color: var(--dark-slate); }

.alert {
  padding: 10px !important; }
  .alert .btn-close {
    padding: 15px 15px !important; }

.extra-highlight {
  background-color: var(--bs-success);
  color: #FFF;
  vertical-align: middle; }

.navbar {
  background-color: #efefef;
  height: 70px; }

.tab-content {
  background-color: #fff; }

.dark-bg-blue {
  background-color: #1F6357;
  color: #FFF; }

.teal {
  background-color: var(--teal);
  color: #FFF; }

.dark-slate {
  background-color: var(--dark-slate);
  color: #FFF; }

.dark-bg {
  background-color: #0E1818;
  color: #FFF; }

h1, h2, h3, h4, h5, h6 {
  color: var(--teal) !important;
  font-weight: bolder !important; }

.download-holder {
  display: flex;
  gap: 10px;
  align-items: center; }
  .download-holder .btn {
    margin-top: 10px;
    flex: 1; }
  .download-holder .or {
    margin-top: 10px; }

.decor {
  height: 0px; }
  .decor svg {
    height: 300px;
    position: relative;
    top: -300px;
    z-index: -1;
    fill: var(--decor-bg);
    width: 100%; }

.target-area {
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(/loading.svg);
  padding: 30px; }

.decor-container {
  background-color: var(--decor-bg); }

.subtitle {
  color: var(--dark-slate) !important;
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 5px; }

ul.features {
  margin-top: 10px; }
  ul.features li {
    font-size: 18px;
    padding-bottom: 10px; }

.target-header {
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 5px; }

.emphasis-text {
  color: var(--teal) !important; }

.popover {
  box-shadow: var(--bs-box-shadow) !important; }

i.bi {
  color: var(--teal) !important; }

.error-page {
  text-align: center;
  font-size: 22px;
  font-weight: 400;
  color: var(--teal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  min-height: 600px;
  background: #fff; }

.download-btn, .br-icon {
  height: 70px;
  margin-right: 5px; }

.img-area {
  text-align: center; }
  .img-area img {
    max-height: 550px; }

.screenshots {
  text-align: center; }

.target-image img {
  aspect-ratio: 0.7727; }

.card.quote {
  background-color: #008080 !important;
  color: #fff !important; }
  .card.quote .blockquote {
    font-size: 18px; }
  .card.quote footer.blockquote-footer {
    padding-top: 10px;
    color: #fff;
    font-style: italic; }

.cta {
  font-size: 18px;
  font-weight: 400;
  padding-bottom: 10px; }

.callout {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.6em;
  color: var(--gray-text); }

#page_description {
  font-size: 16px;
  font-weight: 300;
  padding-right: 10px; }

@media only screen and (max-width: 600px) {
  .subtitle {
    font-size: 20px; }
  .target-area {
    padding-top: 10px;
    line-height: 1.2;
    background-size: 50%; }
  #page_description, .middle-spacer {
    display: none; } }

.footer {
  background-color: var(--footer-bg);
  color: #888;
  text-align: center; }
  .footer a.footer-link {
    color: #888;
    font-weight: 600; }

.nowrap {
  white-space: nowrap; }

.admin table {
  width: 100%; }

.admin table th, .admin table td {
  text-align: left; }

.admin table tr td {
  border-bottom: 1px solid #DDD;
  padding: 15px 0 15px 2px; }

.stars-section {
  padding: 10px 0 10px 0;
  display: flex;
  align-items: center; }
  .stars-section .star-text {
    font-size: 12px; }
  .stars-section .stars {
    height: 30px;
    margin-right: 10px; }

.featuring {
  margin-top: 20px;
  font-size: 16px;
  font-weight: 600;
  color: var(--gray-text); }

.red-text {
  color: #E74B3B; }

.green-text {
  color: #32cd32; }

.review {
  font-size: 30px;
  font-weight: bold; }
  .review i.bi {
    color: #FFC000 !important;
    padding-left: 5px; }

.faq-section .faq {
  margin-top: 20px;
  margin-bottom: 40px; }
  .faq-section .faq .card-header {
    font-size: 20px;
    font-weight: 600; }
  .faq-section .faq .card-text {
    font-size: 18px; }
    .faq-section .faq .card-text ol li {
      margin-bottom: 10px; }

.m-t-sm {
  margin-top: 6px; }

.m-b-sm {
  margin-bottom: 6px; }

.side-padding {
  padding: 0 10px 0 10px; }

#ballistics_report {
  scroll-margin-top: 100px; }
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */
