body {
  padding-top: 75px;
}

.box-shadow {
  box-shadow: 0 2px 4px 0 var(--shadow),
  0 4px 8px 0 var(--shadow);
}

#home-quote {
  background: url('../img/bg-quote.jpg') center center;
  background-size: cover;
  background-position: 50% 70%;
}

@media (max-width: 767px) {
  #home-quote .display-4{
    font-size: 2.5rem;
  }
  body {
    padding-top: 0px;
  }
  .fixed-top {
    position: relative;
  }
}

.lista-plano li + li {
  border-top: 1px solid var(--li-border);
}

.lista-plano li {
  padding: 1rem;
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

.carousel-height{
  height: 26rem;
}

.text-sm-center{
  text-align: start !important;
}

.img-card{
  background-image: radial-gradient(circle, var(--danger-tranparent), transparent);
  border-radius: 50%;
  box-shadow: -0px -0px 35px var(--danger-tranparent), 
 0px 0px 35px var(--danger-tranparent);
}
.filtro-home{
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, transparent,transparent, var(--gray-bg)) ;
  opacity: 1;
  z-index: 0;
}
.container-colaboradores{
  height: 5.5rem;
  width:5.5rem;
  overflow: hidden;
  border-radius: 50%;
}
.img-colaboradores{
  width:5.5rem
}


@media only screen and (max-width: 768px) {
  .carousel-height{
    height: 16rem;
  }
}
@media only screen and (max-width: 495px) {
  .text-sm-center{
    text-align: center !important;
  }
  .carousel-height{
    height: 14rem;
  }
  .display-4{
    font-size: 2.5rem ;
  }
}
@media only screen and (min-width: 1500px) {
  .carousel-height{
    height: 36rem;
  }
  #home-quote{
    height: 30rem;
  }
}

/* Sobrescreve Cores bootstrap.css */
:root{
  --primary:#ea1d2c;
  --danger:#ee4c58;
  --shadow:rgba(0,0,0,.05);
  --li-border:rgba(0,0,0,.2);
  --danger-tranparent: #ee4c585e;
}

.bg-dark-gray{
  background-color: var(--gray-bg);
}

button:focus{
  outline: 1px auto var(--white) !important;
}
a.text-light:hover{
  color:var(--secondary) !important
}
.btn-outline-light:hover{
  background-color: var(--white) !important;
  color:var(--primary) !important;
}
@media (prefers-color-scheme: dark){

  :root{
    --primary:#ee4c58;
    --danger:#ee4c58;
    --white:#fff;
    --light:#0e0e0e;
    --dark:#d9d4d4;
    --gray-bg:#ffffff4a;
    --secondary:#d6d0d0;
    --shadow:rgba(255,255,255,.05);
    --li-border:rgba(255,255,255,.2);
    
  }
  button:focus{
    outline: 1px auto var(--white) !important;
  }
  .filtro-home{
    background-image: linear-gradient(to bottom, transparent,transparent, #535353); 
  }
}

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

a, .text-primary, a.text-primary:focus

{
  color: var(--primary);
}

a:hover,a.text-primary:hover {
  color: var(--danger) ;
}

.bg-primary {
  background-color: var(--primary) !important;
}

a.bg-primary:focus,a.bg-primary:hover {
  background-color: var(--danger) !important;
}

.btn-primary {
  background-color: var(--primary) !important;
  border: var(--primary) !important;

}

.btn-primary:hover{
  background-color: var(--danger) !important;
  border-color: var(--danger) !important;
  cursor: pointer;
  
}

/* Animation Button */

.button-animation{
  position: relative;
  z-index: 0;
  transition:300ms
}
.button-animation:hover{
  transform: translateY(-5%);
}
.button-animation::after {
  content: '';
  width: 30px; height: 30px;
  border-radius: 100%;
  border: 6px solid var(--primary);
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: ring cubic-bezier(0,1,.6,1.02) 3000ms infinite;
}

.button-animation:hover::after, .button-animation:focus::after {
  animation: none;
  display: none;
}

@keyframes ring {
  0% {
    width: 30px;
    height: 30px;
    opacity: 1;
  }
  60% {
    width: 30px;
    height: 30px;
    opacity: 1;
  }
  100% {
    width: 210px;
    height: 210px;
    opacity: 0;
  }
}

.hover {
  cursor: pointer;
}