:root {
  --bgcolor: #fff;
  --fgcolor: #000;
  --ahover-color: #111;
  --sidecolor: #ccc;
  --iconcolor: #999;
  --iconcolordark: #666;
  --black-5: rgba(0, 0, 0, 0.5);
  --black-75: rgba(0, 0, 0, 0.75);
  --black-50: rgba(0, 0, 0, 0.5);
  --black-30: rgba(0, 0, 0, 0.3);
  --black-25: rgba(0, 0, 0, 0.25);
  --white-75: rgba(255, 255, 255, 0.75);
  --white-5: rgba(255, 255, 255, 0.5);
  --white-25: rgba(255, 255, 255, 0.25);
  --white-6: rgba(255, 255, 255, 0.6);
  --light-gray: rgba(204, 204, 204, 0.5);
  --blank-gray: rgba(204, 204, 204, 0.1);
  --dark-gray: #7c7c7c;
  --max-opacity: 1;
  --color-gold: #c4a123;
  --color-dark-gold: darkgoldenrod;
  --color-green: darkolivegreen;
  --color-green-light: green;
  --footer-bg: #cccccc;
}
.related-quotes-container {
  position: relative;
  margin: 3rem -10rem;
}
.related-quotes-container .related-quotes {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  position: relative;
  background-color: var(--sidecolor);
  overflow: hidden;
  min-height: 24rem;
  /* Or set a fixed height */
  margin: 0;
  padding: 0;
  /* SLIDER */
  /* SLIDES */
  /* PREV/NEXT, CONTAINERS & ANCHORS */
  /* NAVIGATION */
  /* NAVIGATION BUTTONS */
  /* ALL: */
  /* ACTIVE */
  /* PREV/NEXT CONTAINERS VISIBILITY */
  /* ALL: */
  /* ACTIVE: */
  /* More slides? Add here more rules */
  /* SLIDER ANIMATION POSITIONS */
  /* YOU'RE THE DESIGNER!
       ____________________
       All above was mainly to get it working :)
       related-quotes CUSTOM STYLES / OVERRIDES HERE: */
  color: #fff;
  text-align: center;
}
.related-quotes-container .related-quotes:before,
.related-quotes-container .related-quotes:after {
  position: absolute;
  font-family: 'FontAwesome';
  content: "\f10d";
  font-size: 1.5rem;
  color: var(--iconcolordark);
}
.related-quotes-container .related-quotes:before {
  top: 3rem;
  left: 13rem;
}
.related-quotes-container .related-quotes:after {
  bottom: 3rem;
  right: 13rem;
  transform: rotate(180deg);
}
.related-quotes-container .related-quotes .slider-0 {
  position: absolute;
  height: 100%;
  width: 100%;
  white-space: nowrap;
  font-size: 0;
  transition: 0.8s;
  text-align: center;
  margin: 0;
}
.related-quotes-container .related-quotes .slider-0 > * {
  font-size: 1rem;
  display: inline-block;
  white-space: normal;
  vertical-align: top;
  height: 100%;
  width: 100%;
}
.related-quotes-container .related-quotes .slider-0 .q-0 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-1 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-2 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-3 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-4 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-5 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-6 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-7 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-8 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-9 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-10 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-11 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 .q-12 {
  padding: 1rem 10%;
}
.related-quotes-container .related-quotes .slider-0 div {
  padding: 1rem;
}
.related-quotes-container .related-quotes .slider-0 div .q-quote-title {
  font-family: 'FuturaBT-Light', Sans-serif, sans-serif;
  font-weight: 600;
  font-size: 1.8rem;
  line-height: normal;
}
.related-quotes-container .related-quotes .slider-0 div .q-quote-url {
  color: white;
}
.related-quotes-container .related-quotes .slider-0 div .q-quote-body {
  font-size: 1rem;
  color: #000;
}
.related-quotes-container .related-quotes .slider-0 div .q-quote-source {
  font-style: italic;
}
.related-quotes-container .related-quotes .slider-0 {
  height: 100%;
  white-space: nowrap;
  font-size: 0;
  transition: 0.8s;
}
.related-quotes-container .related-quotes .slider-0 > * {
  font-size: 1rem;
  display: inline-block;
  white-space: normal;
  vertical-align: top;
  height: 100%;
  width: 100%;
  background: none 50% no-repeat;
  background-size: cover;
}
.related-quotes-container .related-quotes .prevNext {
  position: absolute;
  z-index: 1;
  top: 50%;
  width: 100%;
  height: 0;
}
.related-quotes-container .related-quotes .prevNext div + div {
  visibility: hidden;
  /* Hide all but first P/N container */
}
.related-quotes-container .related-quotes .prevNext a {
  background: #fff;
  position: absolute;
  width: 60px;
  height: 60px;
  line-height: 60px;
  /* If you want to place numbers */
  text-align: center;
  opacity: 0.7;
  transition: 0.3s;
  transform: translateY(-50%);
  left: 0;
}
.related-quotes-container .related-quotes .prevNext a:hover {
  opacity: 1;
}
.related-quotes-container .related-quotes .prevNext a + a {
  left: auto;
  right: 0;
}
.related-quotes-container .related-quotes .bullets {
  position: absolute;
  z-index: 2;
  padding: 10px 0;
  width: 100%;
  text-align: center;
  bottom: 2rem;
}
.related-quotes-container .related-quotes .bullets a {
  display: inline-block;
  width: 11px;
  height: 11px;
  line-height: 11px;
  text-decoration: none;
  text-align: center;
  transition: 0.3s;
  background: var(--dark-gray);
  font-size: 1px;
}
.related-quotes-container .related-quotes .bullets a.active {
  background: #ffffff;
}
.related-quotes-container .related-quotes .bullets a:hover {
  background: #000 !important;
}
.related-quotes-container .related-quotes .bullets a,
.related-quotes-container .related-quotes .bullets a:hover,
.related-quotes-container .related-quotes .bullets a:active {
  content: '';
  color: transparent;
}
.related-quotes-container .related-quotes > s:target ~ .bullets > * {
  background: rgba(255, 255, 255, 0.5);
}
.related-quotes-container .related-quotes #s0:target ~ .bullets > *:nth-child(0) {
  background: #ffffff;
}
.related-quotes-container .related-quotes #s-1:target ~ .bullets > *:nth-child(1) {
  transform: translateX(calc(-100% * 1));
}
.related-quotes-container .related-quotes #s-2:target ~ .bullets > *:nth-child(2) {
  transform: translateX(calc(-100% * 2));
}
.related-quotes-container .related-quotes #s-3:target ~ .bullets > *:nth-child(3) {
  transform: translateX(calc(-100% * 3));
}
.related-quotes-container .related-quotes #s-4:target ~ .bullets > *:nth-child(4) {
  transform: translateX(calc(-100% * 4));
}
.related-quotes-container .related-quotes #s-5:target ~ .bullets > *:nth-child(5) {
  transform: translateX(calc(-100% * 5));
}
.related-quotes-container .related-quotes #s-6:target ~ .bullets > *:nth-child(6) {
  transform: translateX(calc(-100% * 6));
}
.related-quotes-container .related-quotes #s-7:target ~ .bullets > *:nth-child(7) {
  transform: translateX(calc(-100% * 7));
}
.related-quotes-container .related-quotes #s-8:target ~ .bullets > *:nth-child(8) {
  transform: translateX(calc(-100% * 8));
}
.related-quotes-container .related-quotes #s-9:target ~ .bullets > *:nth-child(9) {
  transform: translateX(calc(-100% * 9));
}
.related-quotes-container .related-quotes #s-10:target ~ .bullets > *:nth-child(10) {
  transform: translateX(calc(-100% * 10));
}
.related-quotes-container .related-quotes #s-11:target ~ .bullets > *:nth-child(11) {
  transform: translateX(calc(-100% * 11));
}
.related-quotes-container .related-quotes #s-12:target ~ .bullets > *:nth-child(12) {
  transform: translateX(calc(-100% * 12));
}
.related-quotes-container .related-quotes > s:target ~ .prevNext > * {
  visibility: hidden;
}
.related-quotes-container .related-quotes #s0:target ~ .prevNext > *:nth-child(1) {
  visibility: visible;
}
.related-quotes-container .related-quotes #s-1:target ~ .prevNext > *:nth-child(1) {
  transform: translateX(calc(-100% * 1));
}
.related-quotes-container .related-quotes #s-2:target ~ .prevNext > *:nth-child(2) {
  transform: translateX(calc(-100% * 2));
}
.related-quotes-container .related-quotes #s-3:target ~ .prevNext > *:nth-child(3) {
  transform: translateX(calc(-100% * 3));
}
.related-quotes-container .related-quotes #s-4:target ~ .prevNext > *:nth-child(4) {
  transform: translateX(calc(-100% * 4));
}
.related-quotes-container .related-quotes #s-5:target ~ .prevNext > *:nth-child(5) {
  transform: translateX(calc(-100% * 5));
}
.related-quotes-container .related-quotes #s-6:target ~ .prevNext > *:nth-child(6) {
  transform: translateX(calc(-100% * 6));
}
.related-quotes-container .related-quotes #s-7:target ~ .prevNext > *:nth-child(7) {
  transform: translateX(calc(-100% * 7));
}
.related-quotes-container .related-quotes #s-8:target ~ .prevNext > *:nth-child(8) {
  transform: translateX(calc(-100% * 8));
}
.related-quotes-container .related-quotes #s-9:target ~ .prevNext > *:nth-child(9) {
  transform: translateX(calc(-100% * 9));
}
.related-quotes-container .related-quotes #s-10:target ~ .prevNext > *:nth-child(10) {
  transform: translateX(calc(-100% * 10));
}
.related-quotes-container .related-quotes #s-11:target ~ .prevNext > *:nth-child(11) {
  transform: translateX(calc(-100% * 11));
}
.related-quotes-container .related-quotes #s-12:target ~ .prevNext > *:nth-child(12) {
  transform: translateX(calc(-100% * 12));
}
.related-quotes-container .related-quotes #s0:target ~ .slider-0 {
  transform: translateX(0%);
  -webkit-transform: translateX(0%);
}
.related-quotes-container .related-quotes #s-1:target ~ .slider-0 {
  transform: translateX(calc(-100% * 1));
}
.related-quotes-container .related-quotes #s-2:target ~ .slider-0 {
  transform: translateX(calc(-100% * 2));
}
.related-quotes-container .related-quotes #s-3:target ~ .slider-0 {
  transform: translateX(calc(-100% * 3));
}
.related-quotes-container .related-quotes #s-4:target ~ .slider-0 {
  transform: translateX(calc(-100% * 4));
}
.related-quotes-container .related-quotes #s-5:target ~ .slider-0 {
  transform: translateX(calc(-100% * 5));
}
.related-quotes-container .related-quotes #s-6:target ~ .slider-0 {
  transform: translateX(calc(-100% * 6));
}
.related-quotes-container .related-quotes #s-7:target ~ .slider-0 {
  transform: translateX(calc(-100% * 7));
}
.related-quotes-container .related-quotes #s-8:target ~ .slider-0 {
  transform: translateX(calc(-100% * 8));
}
.related-quotes-container .related-quotes #s-9:target ~ .slider-0 {
  transform: translateX(calc(-100% * 9));
}
.related-quotes-container .related-quotes #s-10:target ~ .slider-0 {
  transform: translateX(calc(-100% * 10));
}
.related-quotes-container .related-quotes #s-11:target ~ .slider-0 {
  transform: translateX(calc(-100% * 11));
}
.related-quotes-container .related-quotes #s-12:target ~ .slider-0 {
  transform: translateX(calc(-100% * 12));
}
.related-quotes-container .related-quotes a {
  border-radius: 50%;
  margin: 0 3px;
  color: rgba(0, 0, 0, 0.8);
  text-decoration: none;
}