.powerful {
  font-family: 'Roboto Condensed', Arial, sans-serif;
  font-weight: bold;
  font-size: 1.3rem;
  background: linear-gradient(63deg, rgba(0,82,33,1) 0%, rgba(0,140,68,1) 17%, rgba(57,181,74,1) 35%, rgba(163,211,156,1) 55%, rgba(57,181,74,1) 73%, rgba(0,140,68,1) 86%, rgba(0,82,33,1) 100%);
  background-size: 200% auto;
  background-position-x: 90%;
  text-transform: capitalize;
  color: #000;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.callout--green-camarone {
  /* inherit p-2 u-fs-7 u-c-green-camarone */
  font-size: 95% !important;
  color: #005F27;
  padding: 1.5rem;
  border: 4px solid #A2D39C;
  border-radius: 5px;
  margin: 2rem 0;
}

.policy--values, .policy--values img {
  margin: 0 !important;
}

/* fix anchor scroll points */
.policy--divider {
  width: 7rem;
  border: 4px solid lightgrey;
  margin: 3rem auto 4rem auto;
  scroll-margin-top: 1.5rem;
}

@media (min-width: 993px) {
  .policy--divider {
    scroll-margin-top: 1rem;
  }
}

.policy--intro {
  font-size: 120%; 
}

/*move the aside box on LG/XL so it covers less of the image & sits closer to body text
and make hero text smaller because it's so long on so many of these pages */

/*lower the sidebar selectively adding `hero-image-sidebar-low` to hero class modifiers */
@media (min-width: 992px) {
  .hero-image-sidebar-low .hero-image-sidebar__wrapper {
    margin-top: 7rem;
  }      
  .sticky-top {
    top: 6rem;
  }
  .hero-image-title__wrapper {
    font-size: 3.3rem;
  }
}
@media (min-width: 1200px) {
  .hero-image-title__wrapper {
    font-size: 3.9rem;
  }
}

/* test link style change so more links don't overwhelm body copy so much
old browsers will ignore, while support for the new styles is increasing */
a {
  text-decoration-color: #A2D39C;
  text-underline-offset: 0.14em;
  text-decoration-thickness: 1.3px;
}
.u-c-orange {
  text-decoration-color: #FCC589;
}
.u-c-purple {
  text-decoration-color: #BD8CBF
}
.u-c-blue {
  text-decoration-color: #ADDCCF;
}
.u-c-pink {
  text-decoration-color: #F9CDE0;
}
.u-c-grey-light {
  text-decoration-color: #9B9B9B;
}

a:hover {
  text-decoration: none;
}

/* reduce size of subheading on mobile screens
and some extra padding built into the layouts */

@media (max-width: 768px) {
  .hero-sub-section-content {
    font-size: 1.4rem; 
  }
  
  .sticky-top .box + .box__border {
    margin-bottom: 1.8rem;
  }
  
  .box__inner {
    padding: 2rem 2rem 1rem 2rem;
  }
  
  .box__inner .btn {
    font-size: 1rem;
    }
    
  .box__inner p {
    margin: 0 0 1rem 0;
  }
}

/* style the number [1] in a box – wrap with span tags */
.vote {
   border: 1px solid currentcolor;
   padding: 0.1rem 0.35rem 0 0.35rem;
   margin: 0 0.1rem;
   font-family: Helvetica;
   font-size: 90%;
   font-weight: 700;
}

p .vote {
   margin: 0;
}

h1 .vote {
   border: 1px solid currentcolor;
   padding: 0.1rem 0.35rem 0 0.35rem;
   margin: 0 0.1rem 0 0.1rem;
   font-family: Helvetica;
   font-size: 80%;
   font-weight: 700;
   position: relative;
   top: -0.25rem;
}
