@media (max-width: 1080px) {
  html {
    font-size: 93.75%;
  }
}

@media (max-width: 720px) {
  html {
    font-size: 87.5%;
  }
}

body {
  font: 400 1rem "Droid Sans", Arial, sans-serif;
  line-height: 1.7;
  color: #777;
  background: #fff;
}

html,
body {
  scroll-behavior: smooth;
}

#page {
  margin-top: 7rem;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

.goto-top {
  position: fixed;
  bottom: 4rem;
  right: 1rem;
  opacity: 0;
  cursor: pointer;
  visibility: hidden;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.goto-top.active {
  opacity: 1;
  visibility: visible;
}
.goto-top span {
  width: 50px;
  height: 50px;
  display: table;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
}
.goto-top a:hover {
  text-decoration: none;
  outline: none;
  background-color: var(--gray-dark);
}

#loader {
  min-height: 700px;
  background: #fff url(../images/loader.gif) no-repeat center center;
}

.contact-whats-app {
  position: fixed;
  bottom: 8rem;
  right: 1rem;
  width: 4rem;
  height: 4rem;
  z-index: 99;
  color: #fff;
  cursor: pointer;
  background-color: #66d55f;
}

.mt-container {
  margin-top: 9.5rem;
}

@media (max-width: 1200px) {
  .mt-container {
    margin-top: 0;
  }
}

.bg-copyright {
  background-color: rgb(51 51 51 / 40%);
}

.title-page {
  font-size: 2.3rem;
}

svg.icon-size {
  color: var(--bs-blue);
}

.icon-size {
  font-size: xxx-large;
}

footer a {
  color: #fff;
  font-weight: 700;
}

footer ul {
  list-style: none;
}

footer a:hover {
  color: #cfccccde;
  text-decoration: none;
}

.file-image-size {
  font-size: 3.5rem;
}

.file-input {
  opacity: 0;
  z-index: 10;
  cursor: pointer;
  position: absolute;
  width: 100% !important;
  height: 100% !important;
}

.container-file {
  background-color: #f5f5f5;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  padding: 1.5rem !important;
  margin-right: auto !important;
  margin-left: auto !important;
  cursor: pointer;
  width: 20rem;
  height: 25rem;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.opacity-0 {
  opacity: 0;
}

.top-toast {
  top: 6rem;
  z-index: 5;
}

.container-file:hover,
.container-file-over {
  background-color: #e1e2e2;
}

svg.card-private-label {
  color: var(--bs-orange) !important;
}
svg.card-alimentacao {
  color: #66d55f !important;
}
svg.card-refeicao {
  color: var(--bs-indigo) !important;
}
svg.card-consignado {
  color: var(--bs-blue) !important;
}
svg.card-bonus {
  color: var(--bs-yellow) !important;
}
svg.card-combustivel {
  color: #85a8be !important;
}
svg.card-saude-farmacia {
  color: var(--bs-cyan) !important;
}

ul.lead {
  list-style-type: "✓ ";
}

/* custom classes bootstrap */

.navbar {
  opacity: 0.9;
  filter: brightness(1.2);
  -webkit-filter: brightness(1.2);
}
.navbar a {
  font-size: 1.1rem;
}

.dropdown-divider {
  border-top: 1px solid #b4b8bc;
}
.dropdown-item:not(.active):hover {
  background-color: #c2c2c3;
}

.nav-item a.btn {
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
}

.card.position-sticky {
  top: 8em;
}

legend.sticky-top {
  top: 4.3em;
}

@media (max-width: 992px) {
  legend.sticky-top {
    top: 3.8em;
  }
}
