/* Define --main-bg-color here */
:root {
  --xdark-olive-green: #4D5B55;
  --dark-olive-green: #56685c;
  --med-olive-green: #6f8175;
  --light-olive-green: #bfc8c2;
  --dark-blue: #205565;
  --dark-brown: #612b2b;
  --light-brown: #a75f2d;
}

/* For each class, set some colors */
.light-olive-green {
  background-color: #bfc8c2;
}

.darkbrown {
  background-color: #612b2b;
}

.lightbrown {
  background-color: #a75f2d;
}

.xtra-dark-green {
 background-color: #4D5B55;
}

.img-border {
  border: 1px solid #4D5B55;
}

.img-float-right {
  max-width: 100%;
  float: right;
  padding-left: 2rem;
  margin-top: 3rem;
}

.disclaimer {
  margin-right: 0.25rem;
}

.img-float-right-small {
  max-width: 320px;
  float: right;
  padding-left: 2rem;
  margin-bottom: 2rem;
}

.img-float-left {
  max-width: 100%;
  float: left;
  object-fit: cover;
}

.img-float-left-small {
  max-width: 320px;
  float: left;
  padding-right: 2rem;
  margin-bottom: 2rem;
}

@media (max-width: 600px){
  .img-float-right-small,
  .img-float-right {
    max-width: 100%;
    float: none;
    padding-left: 0;
  }

  .img-float-left-small,
  .img-float-left {
    max-width: 100%;
    float: none;
    padding-left: 0;
  }
}

h2 {
  margin-bottom: 0;
}

.card.light-olive-green h2 a,
.card.light-olive-green p a {
  color: #000;
  text-decoration: none;
}

.card.darkbrown h2 a,
.card.darkbrown p a,
.card.lightbrown h2 a,
.card.lightbrown p a {
  color: #fff;
  text-decoration: none;
}

.card.light-olive-green {
    display: grid;
    grid-template-rows: 1fr 320px 54px;
    align-items: start;
}

.cta .extra.content {
  margin-top: -3.2rem;
}

.card.light-olive-green .extra.content:hover  {
  background-color: #56685c;
  color: white;
}

.card.charcoal .extra.content .read-more,
.card.darkbrown .extra.content .read-more,
.card.light-olive-green .extra.content .read-more {
  margin-right: 0.25rem;
}

.card.charcoal .extra.content .read-more:hover,
.card.darkbrown .extra.content .read-more:hover,
.card.light-olive-green .extra.content .read-more:hover {
  margin-right: -.75rem;
}

.cta .extra.content a span.read-more {
  margin-right: .25rem;
}

.cta .extra.content a span.read-more:hover {
  margin-right: -.75rem;
}

.cta .extra.content:hover {
    background-color: rgba(0, 0, 0, 0.3);
}

.padding-x-2 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.resources-card {
  background-color: #bfc8c2;
  color: #000;
  margin-bottom: 1rem;
} 

.card__text {
 padding: 2rem;
}

.card__text h2 a {
  font-weight: 700;
  margin: 1rem 0;
  text-decoration: none;
  color: #000000;
}

.card__text ul {
  list-style: none;
  padding-left: 0;
}

.card__text ul li {
 line-height: 2.2;
 border-bottom: 1px solid #4D5B55;
}

.card__text ul a:link {
  text-decoration: none;
  color: #000000;
}

.card__text ul li a {
  display: flex;
  gap: 1rem;
  justify-content: flex-start;
  align-items: center;
}

.featured {
  font-size: 1.2rem;
  padding: 1.6rem;
  padding-bottom: 0.2rem;
  background: #eeece1;
}

.slanted {
  padding: 1rem 2rem;
  background-color: pink;
  max-width: 55%;
  position: absolute;
  top: calc(67% + 5px);
  right: -45px;
  overflow: hidden;
  display: inline-block;
  transform: skew(-45deg);
}

.slanted_text {
  margin: 0;
  padding: 0 2rem;
  transform: skew(45deg);
}

.card.light-olive-green.one ,
.card.light-olive-green.two {
  display: grid;
  grid-template-rows: 1fr 262px 54px;
  align-items: start;
}

.card.light-olive-green.three {
  display: grid;
  grid-template-rows: 1fr 280px 54px;
  align-items: start;
}

.landing-page-header .heading-description p {
  padding: 0 0 20px;
}

.usa-summary-box {
    background-color: #f8e7e7;
    border: 1px #ffd1c9 solid;
}

.article-content .topics-print-share-sect {
	display: none;
}

.node-last-updated {
    margin-top: 2rem;
    padding: 1rem 0;
    border-top: 1px solid #ccc;
}

.layout-sidebar-first .block-block-content {
  border: 1px solid #ccc;
  float: left;
  width: 100%;
  padding: 0 15px;
  margin-top: 25px;
}

.layout-sidebar-first #block-owhemailsignupside.block-block-content .input-group .input-group-btn {
  float: right;
  max-width: 35%;
  min-width: 35%;
}

.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

.layout-sidebar-first #block-owhemailsignupside.block-block-content .figure.col-md-3 img {
  max-width: 40px;
  padding-right: 5px;
  height: auto;
  float: left;
}