/*
 * Styles for the CKEditor 5 template library (ckeditor5_templates/ckeditor5_template.json).
 * Copied from the "WYSIWYG Template Styles" Asset Injector CSS on templates-fsu-master01
 * (last edited 2026-10-23). Loaded by the framework library and built into the editor
 * stylesheets by ckeditor5/build.py.
 */

/* ==========================================================================
   Global Fixes
   ========================================================================== */

/* Fix for arrow images escaping container */
.blocks .item > img {
  width: -webkit-fill-available;
}

/* Shared responsive image reset (used by Hover Card variants) */
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ==========================================================================
   Hero Hover with Overlay (HeroItem Version)
   ========================================================================== */

.HeroItem {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  background-size: cover !important;
  background-position: 50% !important;
  box-shadow: 8px 8px 10px -4px rgb(21 21 21 / 40%);
}
/* --- Equal-height fix: desktop only, left column matches right grid's height ---
   Bootstrap 3's .row/.col-* are float-based, so columns never match height on
   their own. Below, only the outer row becomes a flex container (at >=992px,
   the same breakpoint col-md-6 already uses) so Bootstrap's own 50% widths
   keep working unmodified - flexbox resolves % width against the row's real
   content width, same as floats do, unlike CSS grid's pre-sized tracks.
   Only the LEFT column is turned into a flex container; the right column and
   its nested 2x2 grid are left as completely standard Bootstrap 3 floats, so
   there's no chance of the nested grid collapsing into a single line. */
@media (min-width: 992px) {
  .hero-gallery-ada > .row {
    display: flex;
  }
  .hero-gallery-ada > .row > .col-md-6:first-child {
    display: flex;
  }
  .hero-gallery-ada > .row > .col-md-6:first-child > .HeroItem {
    flex: 1 1 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .hero-gallery-ada > .row > .col-md-6:first-child > .HeroItem > img.img-responsive {
    flex: 1 1 auto;
    width: 100%;
    object-fit: cover;
  }
  /* Right column: stretch to the row's full height too, then pass that
     height down through its two nested rows so the 2x2 grid's images fill
     the column instead of leaving empty space below them. The nested
     columns keep their plain Bootstrap col-sm-6/col-md-6 widths - only
     display/flex-direction and height-related props are added, so the
     2x2 wrapping behavior at sm/md set earlier is untouched. */
  .hero-gallery-ada > .row > .col-md-6:last-child {
    display: flex;
    flex-direction: column;
  }
  .hero-gallery-ada > .row > .col-md-6:last-child > .row {
    display: flex;
    flex: 1 1 0;
  }
  .hero-gallery-ada > .row > .col-md-6:last-child > .row > [class*="col-"] {
    display: flex;
  }
  .hero-gallery-ada > .row > .col-md-6:last-child > .row > [class*="col-"] > .HeroItem {
    flex: 1 1 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .hero-gallery-ada > .row > .col-md-6:last-child > .row > [class*="col-"] > .HeroItem > img.img-responsive {
    flex: 1 1 auto;
    width: 100%;
    object-fit: cover;
  }
}
.HeroItem:before {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  position: absolute;
  opacity: 0;
  display: block;
  z-index: 10;
  background-color: #000;
  transition: all .25s ease;
}
.HeroItem:hover:before,
.HeroItem:focus-within:before {
  opacity: .6;
}
.HeroItem .HeroItemTitle {
  max-width: calc(100% - 20px);
  color: #ebebeb;
  position: relative;
  bottom: 0;
  left: 10px;
  font-size: 1.2em;
  font-weight: 700;
  padding: 5px 20px;
  z-index: 10;
  text-shadow: 0 0 10px rgb(21 21 21 / 80%);
  transition: .25s ease;
  display: block;
  margin-top: -63px;
}
.HeroItem .HeroItemTitle:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(21, 21, 21, .8);
	transition: .25s ease-out;
	transition-property: background;
	z-index: -2;
	opacity: .95;
	color: #ebebeb;
	}
.HeroItem:hover > h3.HeroItemTitle::before,
.HeroItem:focus-within > h3.HeroItemTitle::before {
	background: none;
	transition: .25s ease-out;
}
.HeroItemLink a {
	border: none;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-decoration: none;
	z-index: 11;
	background: transparent;
}
.HeroItemLink a:focus {
	outline: 3px solid #fff;
	outline-offset: -4px;
	box-shadow: 0 0 0 6px rgba(21, 21, 21, .8);
}
.HeroItemLink a:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
 }
.HeroItemLink a:focus-visible {
	outline: 3px solid #fff;
	outline-offset: -4px;
	box-shadow: 0 0 0 6px rgba(21, 21, 21, .8);
}
@media screen and (max-width: 992px) and (min-width: 1192px) {
	.HeroItem .HeroItemTitle {
	font-size: .9em;
	padding: 5px 11px;
}
}
.s3-bs-edit {
	box-shadow: 8px 8px 10px -4px rgb(21 21 21 / 40%);
}
/* END Hero Hover with Overlay (HeroItem Version) */

/* ==========================================================================
   Custom Quote
   ========================================================================== */

.custom-quote {
  position: relative;
  padding: 20px 60px 30px;
  line-height: 1.5;
}

.custom-quote .quote-icon {
  font-family: 'FontAwesome', sans-serif;
  font-size: 45px;
  font-style: normal;
  color: #782f40;
  position: absolute;
}

.custom-quote .icon-before {
  top: 20px;
  left: 0;
}

.custom-quote .icon-after {
  bottom: 20px;
  right: 0;
}

.custom-quote footer p {
  display: inline;
}
/* END Custom Quote */


/* ==========================================================================
   Shared Timeline Styles
   ========================================================================== */

#block-timeline .header-subdue {
  margin-bottom: 0.25em;
  font-size: 2.4rem;
}

.timeline {
  margin: 0 0 1em;
  padding: 10px 10px 10px 0;
}

.timeline > :is(.item, .item3, .item5) {
  box-sizing: border-box;
  padding: 10px 10px 15px 50px;
  background-image: var(--timeline-marker, none);
  background-position: 5px 0;
  background-repeat: no-repeat;
  background-size: 40px auto;
}

.timeline :is(.item, .item3, .item5) .header {
  margin: 0 0 0.25rem;
  font-size: 1.777rem;
}

.timeline :is(.item, .item3, .item5) p {
  margin: 0 0 0.25rem;
  font-size: 1.333rem;
}

/* Mobile marker images */
.timeline .item-start    { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-v-start.png"); }
.timeline .item-next     { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-v-next.png"); }
.timeline .item-current  { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-v-current.png"); }
.timeline .item-end      { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-v-end.png"); }
.timeline .item-complete { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-v-complete.png"); }

@media (min-width: 768px) {
  .timeline {
    display: flex;
    flex-wrap: wrap;
    padding-left: 10px;
  }

  .timeline > :is(.item, .item3, .item5) {
    flex: 0 0 var(--timeline-item-width);
    padding: 50px 10px 10px;
    text-align: center;
    background-position: 50% 0;
    background-size: auto 40px;
  }

  /* Number of timeline steps */
  .timeline > .item3 { --timeline-item-width: 33.3333%; }
  .timeline > .item  { --timeline-item-width: 25%; }
  .timeline > .item5 { --timeline-item-width: 20%; }

  /* Desktop marker images */
  .timeline .item-start    { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-h-start.png"); }
  .timeline .item-next     { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-h-next.png"); }
  .timeline .item-current  { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-h-current.png"); }
  .timeline .item-end      { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-h-end.png"); }
  .timeline .item-complete { --timeline-marker: url("https://webservices.its.fsu.edu/images/timeline/timeline-h-complete.png"); }
}
/* END Shared Timeline Styles */


/* ==========================================================================
   FAQ Bubbles
   ========================================================================== */

.card-content {
  position: relative;
  background: #782f40;
  color: #fff;
  margin: 0 0 40px 0;
  padding: 20px 16px 20px 20px;
  border-radius: 10px;
}

.card-content :before {
  content: "";
  position: absolute;
  bottom: -30px;
  right: 80px;
  border-width: 0 0 30px 50px;
  border-style: solid;
  border-color: transparent #782f40;
  display: block;
  width: 0;
}

.card-content :after {
  content: "";
  position: absolute;
  bottom: -30px;
  right: 110px;
  border-width: 0 0 30px 20px;
  border-style: solid;
  border-color: transparent #f6f6f6;
  display: block;
  width: 0;
}

.card-link a {
  border: none;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  text-decoration: none;
  z-index: 10;
  background: transparent;
}

.element-invisible {
  position: absolute !important;
  overflow: hidden;
  height: 1px;
}

@media screen and (max-width: 1199px) and (min-width: 994px) {
  .card-content { height: 235px; }
}
@media screen and (max-width: 991px) and (min-width: 634px) {
  .card-content { margin: 0 0 50px 0; }
}
@media screen and (max-width: 633px) and (min-width: 488px) {
  .card-content { height: 125px; margin: 0 0 50px 0; }
}
@media screen and (max-width: 487px) and (min-width: 416px) {
  .card-content { margin: 0 0 50px 0; height: 160px; }
}
@media screen and (max-width: 415px) and (min-width: 369px) {
  .card-content { margin: 0 0 50px 0; height: 190px; }
}
@media screen and (max-width: 368px) {
  .card-content { height: 205px; margin: 0 0 50px 0; }
}
/* END FAQ Bubbles */


/* ==========================================================================
   Call Out with Garnet Overlay
   ========================================================================== */

.background {
  background-size: cover;
}

.gtText   { color: #782f40; }
.gdText   { color: #ceb888; }
.gd1cText { color: #dacaa6; }
.gd2cText { color: #e7dcc4; }
.gd3cText { color: #f3ede1; }
.cText    { color: #ffffff; }
/* END Call Out with Garnet Overlay */


/* ==========================================================================
   Banner with Left to Right Gradient
   ========================================================================== */

.callout-title {
  color: #ceb888;
}

.text {
  color: #ffffff;
  width: 40%;
}

@media screen and (max-width: 768px) {
  .text { width: 75%; }
}
@media screen and (max-width: 480px) {
  .text { width: 100%; }
}
/* END Banner with Left to Right Gradient */


/* ==========================================================================
   Banner with Right to Left Gradient
   ========================================================================== */

.pullRight {
  float: right;
  width: 40%;
  text-align: right;
}

.callout-title {
  color: #fff;
  text-shadow: 3px 3px 0 #000;
}

.textRight {
  color: #fff;
}

@media screen and (max-width: 768px) {
  .pullRight { width: 75%; }
}
@media screen and (max-width: 480px) {
  .pullRight { width: 100%; }
}
/* END Banner with Right to Left Gradient */


/* ==========================================================================
   Text Block 2 with Garnet Border
   ========================================================================== */

.outer {
  position: relative;
  border: 2px solid #782f40;
  padding: 20px;
  height: 135px;
}

/* H2 variant */
.block-2-title h2 {
  position: absolute;
  margin-top: -50px;
  background-color: #f4f4f4;
  padding: 5px 20px;
}

/* H3 variant */
.block-2-title h3 {
  position: absolute;
  margin-top: -45px;
  background-color: #f4f4f4;
  padding: 5px 20px;
}

@media screen and (max-width: 991px) {
  .outer.outer-mobile {
    margin-top: 40px;
  }
  .block-2-title h2 { margin-top: -43px; }
  .block-2-title h3 { margin-top: -43px; }
}
@media (min-width: 768px) and (max-width: 990px) {
  .block-2-title h2 { margin-top: -50px; }
}
@media screen and (max-width: 455px) and (min-width: 374px) {
  .outer { height: 155px !important; }
}
@media screen and (max-width: 373px) and (min-width: 314px) {
  .outer { height: 185px !important; }
}
/* END Text Block 2 with Garnet Border */


/* ==========================================================================
   Text Wrap Left / Right
   ========================================================================== */

.moreLeftMargin {
  margin: 0.5em 24px 0.8em 0;
}

.moreRightMargin {
  margin: .5em 0 .8em 24px;
}
/* END Text Wrap Left / Right */


/* ==========================================================================
   Hover Cards (Style D - base, with description)
   ========================================================================== */

.links-grid__image {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  cursor: pointer;
}

.links-grid__image:focus-within {
  outline: 2px solid #ceb888;
  outline-offset: 2px;
}

.stretched-link::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  content: "";
}

h3.links-grid__title {
  margin: 0 0 10px 0;
  padding: 0;
}

.links-grid__title {
  font-weight: 700 !important;
}

.links-grid__image img {
  width: 100%;
  transition: .2s ease;
}

.links-grid--style-d .links-grid__image:after {
  content: "";
  background-color: rgba(0, 0, 0, 0) 0%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000000 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.links-grid--style-d .links-grid__image:hover img {
  transform: scale(1.07, 1.07);
}

.links-grid--style-d .links-grid__title {
  font-size: 2rem;
  font-weight: 300;
  color: #fff;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  z-index: 2;
  line-height: normal;
  display: inline-block;
  margin-bottom: 0;
}

.links-grid--style-d .links-grid__title a {
  font-size: 2.2rem;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  text-shadow: 1px 1px #000;
}

.links-grid--style-d .links-grid__title a:hover,
.links-grid--style-d .links-grid__title a:focus {
  color: #fff;
  text-decoration: none;
}

.links-grid--style-d .links-grid__title:before {
  content: "";
  background: #ceb888;
  height: 2px;
  width: 30%;
  display: block;
  top: 0;
  position: absolute;
  z-index: 2;
  left: 25px;
  transition: .2s ease;
}

.links-grid--style-d .links-grid__image:hover .links-grid__title:before {
  width: 50%;
}

.links-grid--style-d .links-grid__image:hover .links-grid__title:after {
  font-size: 2rem;
}

.links-grid--style-d .links-grid__caption {
  position: absolute;
  color: #fff !important;
  bottom: 0;
  z-index: 2;
  padding: 7px 25px;
  min-height: 30px;
  width: 100%;
  overflow: hidden;
  line-height: 1.1;
}

.links-grid--style-d .links-grid__caption a {
  background-image: none;
}

p.links-grid__description--first {
  margin: 0;
  padding: 0;
}

.links-grid--style-d .links-grid__description--first,
.links-grid--style-d .links-grid__description--second {
  font-size: 1.3rem;
  font-weight: 300;
  color: #ffffff;
}

.links-grid--style-d .links-grid__description--first a,
.links-grid--style-d .links-grid__description--second a {
  background-image: none;
}

@media screen and (max-width: 991px) {
  .links-grid--style-d-3 .links-grid__caption-3,
  .links-grid--style-d-4 .links-grid__caption-4 {
    position: absolute;
    color: #fff;
    bottom: 0;
    z-index: 2;
    padding: 15px 25px !important;
    min-height: 30%;
    width: 100%;
    overflow: hidden;
    line-height: 4;
  }

  .links-grid--style-d-3 .links-grid__title-3,
  .links-grid--style-d-4 .links-grid__title-4 {
    font-size: 3.5rem !important;
    font-weight: 300;
    color: #fff;
    bottom: 0;
    width: 100%;
    z-index: 2;
    line-height: normal;
    display: inline-block;
    margin-bottom: 0;
  }
}
/* END Hover Cards (Style D) */


/* ==========================================================================
   Hover Cards without Description 2
   ========================================================================== */

.links-grid__image-2 {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}

.links-grid__image-2 img {
  width: 100%;
  transition: .2s ease;
}

.links-grid__title-2 {
  font-weight: 700 !important;
}

.card-link-2 a {
  z-index: 10;
}

.links-grid--style-d-2 .links-grid__image-2:after {
  content: "";
  background-color: transparent;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, #000000 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.links-grid--style-d-2 .links-grid__image-2:hover img {
  transform: scale(1.07, 1.07);
}

.links-grid--style-d-2 .links-grid__title-2 {
  font-size: 3.5rem;
  font-weight: 300;
  color: #fff;
  bottom: 0;
  width: 100%;
  /* overflow: hidden; */
  z-index: 2;
  line-height: normal;
  display: inline-block;
  margin-bottom: 0;
}

.links-grid--style-d-2 .links-grid__title-2:before {
  content: "";
  background: #ceb888;
  height: 2px;
  width: 30%;
  display: block;
  top: 0;
  position: absolute;
  z-index: 2;
  left: 25px;
  transition: .2s ease;
}

.links-grid--style-d-2 .links-grid__image-2:hover .links-grid__title-2:before {
  width: 50%;
}

.links-grid--style-d-2 .links-grid__image-2:hover .links-grid__title-2:after {
  font-size: 2rem;
}

.links-grid--style-d-2 .links-grid__caption-2 {
  position: absolute;
  color: #fff;
  bottom: 0;
  z-index: 2;
  padding: 15px 25px;
  min-height: 30%;
  width: 100%;
  overflow: hidden;
  line-height: 4;
}

.links-grid--style-d-2 .links-grid__caption-2 a {
  background-image: none;
}

.links-grid--style-d-2 .links-grid__description--first-2,
.links-grid--style-d-2 .links-grid__description--second {
  font-size: 1.3rem;
  font-weight: 300;
  color: #ffffff;
}

.links-grid--style-d-2 .links-grid__description--first-2 a,
.links-grid--style-d-2 .links-grid__description--second a {
  background-image: none;
}

@media screen and (min-width: 768px) {
  .links-grid--style-d-2 .links-grid__description--first-2,
  .links-grid--style-d-2 .links-grid__description--second {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 480px) {
  .links-grid--style-d-2 .links-grid__description--first-2,
  .links-grid--style-d-2 .links-grid__description--second {
    font-size: 1.2rem;
  }
}
/* END Hover Cards without Description 2 */


/* ==========================================================================
   Hover Cards without Description 3
   ========================================================================== */

.links-grid__image-3 {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}

.links-grid__image-3 img {
  width: 100%;
  transition: .2s ease;
}

.card-link-3 a {
  z-index: 10;
}

.links-grid--style-d-3 .links-grid__image-3:after {
  content: "";
  background-color: rgba(0, 0, 0, 0) 0%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000000 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.links-grid--style-d-3 .links-grid__image-3:hover img {
  transform: scale(1.07, 1.07);
}

.links-grid--style-d-3 .links-grid__title-3 {
  font-size: 2.5rem;
  font-weight: 700;
  color: #fff;
  bottom: 0;
  width: 100%;
  z-index: 2;
  line-height: normal;
  display: inline-block;
  margin-bottom: 0;
}

.links-grid--style-d-3 .links-grid__title-3:before {
  content: "";
  background: #ceb888;
  height: 2px;
  width: 30%;
  display: block;
  top: 0;
  position: absolute;
  z-index: 2;
  left: 25px;
  transition: .2s ease;
}

.links-grid--style-d-3 .links-grid__image-3:hover .links-grid__title-3:before {
  width: 50%;
}

.links-grid--style-d-3 .links-grid__image-3:hover .links-grid__title-3:after {
  font-size: 2rem;
}

.links-grid--style-d-3 .links-grid__caption-3 {
  font-size: 1.75rem;
  color: #fff;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  z-index: 2;
  position: absolute;
  padding: 15px 25px;
  min-height: 30%;
}

.links-grid--style-d-3 .links-grid__caption-3 a {
  background-image: none;
}

.links-grid--style-d-3 .links-grid__description--first-3,
.links-grid--style-d-3 .links-grid__description--second {
  font-size: 1.3rem;
  font-weight: 300;
  color: #ffffff;
}

.links-grid--style-d-3 .links-grid__description--first-3 a,
.links-grid--style-d-3 .links-grid__description--second a {
  background-image: none;
}
/* END Hover Cards without Description 3 */


/* ==========================================================================
   Hover Cards without Description 4
   ========================================================================== */

.links-grid__image-4 {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}

.links-grid__image-4 img {
  width: 100%;
  transition: .2s ease;
}

.links-grid__title-4 {
  font-weight: 700 !important;
}

.card-link-4 a {
  z-index: 10;
}

.links-grid--style-d-4 .links-grid__image-4:after {
  content: "";
  background-color: rgba(0, 0, 0, 0) 0%;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000000 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.links-grid--style-d-4 .links-grid__image-4:hover img {
  transform: scale(1.07, 1.07);
}

.links-grid--style-d-4 .links-grid__title-4 {
  font-size: 1.75rem;
  font-weight: 300;
  color: #fff;
  bottom: 0;
  width: 100%;
  z-index: 2;
  line-height: normal;
  display: inline-block;
  margin-bottom: 0;
}

.links-grid--style-d-4 .links-grid__title-4:before {
  content: "";
  background: #ceb888;
  height: 2px;
  width: 30%;
  display: block;
  top: 0;
  position: absolute;
  z-index: 2;
  left: 25px;
  transition: .2s ease;
}

.links-grid--style-d-4 .links-grid__image-4:hover .links-grid__title-4:before {
  width: 50%;
}

.links-grid--style-d-4 .links-grid__image-4:hover .links-grid__title-4:after {
  font-size: 2rem;
}

.links-grid--style-d-4 .links-grid__caption-4 {
  position: absolute;
  color: #fff;
  bottom: 0;
  z-index: 2;
  padding: 7px 25px;
  width: 100%;
  min-height: 30%;
  overflow: hidden;
}

.links-grid--style-d-4 .links-grid__caption-4 a {
  background-image: none;
}

.links-grid--style-d-4 .links-grid__description--first-4,
.links-grid--style-d-4 .links-grid__description--second {
  font-size: 1.3rem;
  font-weight: 300;
  color: #ffffff;
}

.links-grid--style-d-4 .links-grid__description--first-4 a,
.links-grid--style-d-4 .links-grid__description--second a {
  background-image: none;
}

@media screen and (min-width: 768px) {
  .links-grid--style-d-4 .links-grid__description--first-4,
  .links-grid--style-d-4 .links-grid__description--second {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 480px) {
  .links-grid--style-d-4 .links-grid__description--first-4,
  .links-grid--style-d-4 .links-grid__description--second {
    font-size: 1.2rem;
  }
}
/* END Hover Cards without Description 4 */


/* ==========================================================================
   Accessible Accordions
   ========================================================================== */

.accordion-content {
  display: none;
  padding: 1em 0 1em 3.15em;
}

.accordion-title {
  color: #666;
  position: relative;
  cursor: pointer;
  text-transform: none;
  padding: 16px 0 17px 50px;
  border-top: 1px solid #e9e9e9;
  margin: 0;
  transition: color 0.3s ease-in-out;
  -webkit-transition: color 0.3s ease-in-out;
}

.accordion-title:hover {
  color: #242424;
}

.accordion-title:before {
  content: "\f105";
  position: absolute;
  left: 2px;
  top: 12px;
  width: 35px;
  height: 35px;
  font-family: FontAwesome;
  font-weight: bold;
  text-indent: 2px;
  line-height: 30px;
  text-align: center;
  font-size: 20px;
  color: #ccc;
  border: 2px solid #ccc;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
}

.accordion-title:hover:before {
  color: #333;
  border-color: #333;
}

.accordion-title.active:before {
  background-color: rgba(0, 0, 0, 1);
  transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  border-color: #000;
  color: #fff;
}

.accordion-title.active:hover:before {
  color: #fff;
  border-color: #333;
}

.accordion .s3-w .accordion-title {
  border: 1px solid #e9e9e9;
}

.s3-w .accordion-title {
  border-top: 1px solid #e9e9e9;
}

.s3-w .accordion-title.active {
  border-top: 2px solid #333;
}
/* END Accessible Accordions */


/* ==========================================================================
   Scrolling Stats
   ========================================================================== */

.its-counter h2 {
  color: #782f40;
  font-size: 400%;
}
/* END Scrolling Stats */


/* ==========================================================================
   Automated Icon List
   ========================================================================== */

.list-icons li span {
  padding-right: .25em;
  width: 1em;
}
/* END Automated Icon List */