/* entire container, keeps perspective */
.flip_container {
  perspective: 1000px;
}
/* flip the pane when hovered */
.flip_container .flip {
  transform: rotateY(180deg);
}

.flip_container .unflip {
  transform: rotateY(0deg);
}
.flip_container,
.flip_front,
.flip_back {
  /*   width: 320px;
  height: 480px; */
  cursor: pointer;
}

/* flip speed goes here */
.flip,
.unflip {
  transition: 0.6s;
  transform-style: preserve-3d;
  position: relative;
}

/* hide back of pane during swap */
.flip_front,
.flip_back {
  backface-visibility: hidden;
  -webkit-perspective: 0;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  top: 0;
  left: 0;
}

/* front pane, placed above back */
.flip_front {
  z-index: 2;
  /* for firefox 31 */
  transform: rotateY(0deg);
}

/* back, initially hidden pane */
.flip_back {
  position: absolute;
  transform: rotateY(180deg);
}
/* .flip_back strong {
 font-size: 150%; 
} */
.flipicon {
  position: absolute;
  bottom: 10px;
  right: 15px;
}
.flipicon > span {
  font-style: italic;
  font-size: 85%;
}
.card-deck .card {
  width: 100% !important;
  margin-bottom: 20px;
  border: 1px solid #ccc;
}
.af-card,
.card-body:after {
  content: "";
  display: table;
  clear: both;
}
.card:hover .flipicon {
  animation: pulse 0.9s alternate ease-in-out infinite;
}

@keyframes pulse {
  0% {
    color: #000;
  }
  100% {
    color: #999;
  }
}
ol.list-2 {
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
}
.card-body ol li {
  font-family: Montserrat, sans-serif;
  font-size: 90%;
}
.card-body ol li ol li {
  font-family: "Crimson Pro", serif;
  font-size: 18px;
}
.unrestricted-vid,
.af-interactive {
  max-width: 1100px;
  margin: 0 auto;
}
.af-interactive,
.af-card {
  border: 1px solid #ddd;
}
.af-card {
  position: relative;
  width: 100%;
  text-align: center;
  padding: 2rem 1rem;
  height: 100% !important;
  color: #fff;
}
.af-interactive > div::before {
  position: absolute;
  display: inline-block;
  background-color: #efefef;
  color: #bbb;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
  content: "\f128";
  font-size: 3rem;
  padding-top: 20px;
  text-align: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.af-card i {
  font-size: 5.5rem;
  margin-bottom: 15px;
}

.af-interactive {
  cursor: pointer;
}

.af-card-1 i,
.af-card-11 i {
  margin-right: 15px;
  line-height: inherit !important;
  vertical-align: middle;
}
.af-card-1 .showicon {
  position: absolute;
  bottom: 0;
  right: 35px;
  text-decoration: underline;
}
.af-card-1 .showicon,
.af-card-1 .showicon i {
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  vertical-align: top;
}

.af-card-1 .showicon i {
  font-size: 20px;
}

.af-card-1 h5,
.af-card-11 h5 {
  padding-top: 20px;
  font-size: 1.8rem;
}

.volunteer-opps h5 {
  text-align: center;
  margin-top: 5px;
  margin-bottom: 25px;
}
.volunteer-opps h5 a {
  color: #111;
}

/* semi-transparent backgrounds */

.cc-bg-gold-op40 {
  background-color: rgba(208, 155, 44, 0.4);
}

.cc-bg-black-op40 {
  background-color: rgb(0, 0, 0, 0.4);
}

.cc-bg-tigergold-op40 {
  background-color: rgba(239, 171, 30, 0.4);
}

.cc-bg-metallicgold-op40 {
  background-color: rgba(134, 117, 78, 0.4);
}

.cc-bg-pikespeakblue-op40 {
  background-color: rgba(71, 100, 175, 0.4);
}

.cc-bg-palmerred-op40 {
  background-color: rgba(201, 84, 39, 0.4);
}

.cc-bg-coloradosky-op40 {
  background-color: rgba(116, 206, 226, 0.4);
}

.cc-bg-cutlerstone-op40 {
  background-color: rgba(239, 225, 211, 0.4);
}

.cc-bg-armstrongquadgreen-op40 {
  background-color: rgba(145, 175, 70, 0.4);
}

.cc-bg-westernbark-op40 {
  background-color: rgba(72, 51, 23, 0.4);
}

.cc-bg-rockymountainpurple-op40 {
  background-color: rgba(95, 70, 95, 0.4);
}

.cc-bg-strawberry-op40 {
  background-color: rgba(239, 64, 96, 0.4);
}

.cc-bg-plum-op40 {
  background-color: rgba(173, 34, 126, 0.4);
}

.cc-bg-lime-op40 {
  background-color: rgba(191, 215, 48, 0.4);
}

.cc-bg-blueberry-op40 {
  background-color: rgba(91, 196, 190, 0.4);
}

.cc-bg-grapefruit-op40 {
  background-color: rgba(243, 113, 90, 0.4);
}

.cc-bg-spruce-op40 {
  background-color: rgba(101, 150, 151, 0.4);
}

.cc-bg-darksand-op40 {
  background-color: rgba(123, 103, 70, 0.4);
}

.cc-bg-winterdawn-op40 {
  background-color: rgba(112, 146, 175, 0.4);
}

.cc-bg-summersunset-op40 {
  background-color: rgba(224, 126, 46, 0.4);
}

.cc-bg-moss-op40 {
  background-color: rgba(161, 178, 143, 0.4);
}

.cc-bg-brick-op40 {
  background-color: rgba(130, 43, 26, 0.4);
}

.cc-bg-facred-op40 {
  background-color: rgba(229, 27, 31, 0.4);
}