/* Homepage-specific */

#animation-intro,
     .entry-content .il-reusable-block.header-primary { height:calc(83vh - 70px)!important; }
.il-reusable-block.header-primary { padding-top:7rem; }
.il-reusable-block.grid-factoids .card-container > div { justify-content:center; }
.il-reusable-block.grid-product-group { background-position:0% 200%!important; }
.il-reusable-block.grid-product-group .card-img .stk-img-wrapper,
.il-reusable-block.grid-product-group .card-img .stk-img-wrapper img { border-radius: 1rem 1rem 0 0; }










@keyframes example {
  from {
    position: relative;
    top: 75px;
	transform: scale(1.2);
  }
  to {
    position: relative;
    top: 0;
	transform: scale(1);
  }
}
.hero-top-text {
  position: relative;
  top: 75px;
	transform: scale(1.2);
  animation-duration: 1250ms;
  animation-delay: 1250ms;
  animation-name: example;
  animation-fill-mode: forwards;
  animation-direction: normal;
}
@keyframes example2 {
  from {
    position: relative;
    top: -75px;
	transform: scale(1.2);
  }
  to {
    position: relative;
    top: 0;
	transform: scale(1);
  }
}
.hero-bottom-text {
  position: relative;
  top: -75px;
	transform: scale(1.2);
  animation-name: example2;
  animation-duration: 1250ms;
  animation-delay: 1250ms;
  animation-fill-mode: forwards;
  animation-direction: normal;
}
@keyframes example3 {
  from {
    opacity: 0;
    display:none;
  }
  to {
    opacity: 1;
    display:inline;
  }
}
[class*='hero-bookend-text']{
  opacity: 0;
height:0;
  display: inline;
}
[class*='hero-bookend-text'][class*='-1']{
 animation: example3 1250ms linear 1500ms forwards normal, example3 500ms linear 5500ms forwards reverse;
}
[class*='hero-bookend-text'][class*='-2']{
 animation: example3 1250ms linear 5500ms forwards normal, example3 500ms linear 9500ms forwards reverse;
}
.opacity-change {
	animation-name: opacity-change;
	animation: opacity-change 9s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	-webkit-animation-name: opacity-change;
	-webkit-animation: opacity-change 9s;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
}
@keyframes opacity-change {
	0%{
	  opacity: 0%;
	}
	8% {
	  opacity: 100%;
	}
	88% {
	  opacity: 100%;
	}
	100% {
	  opacity: 0%;
	}
}
.fade-up {
	animation-name: fade-up;
	animation: fade-up 9s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	-webkit-animation-name: fade-up;
	-webkit-animation: fade-up 9s;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	}
@keyframes fade-up {
	0% {
	  transform: translateY(.75em);
	}

	33%,
	100% {
	  transform: translateY(-.75em);
	}
}
.fade-down {
	animation-name: fade-down;
	animation: fade-down 9s;
	animation-fill-mode: forwards;
	animation-iteration-count: infinite;
	-webkit-animation-name: fade-down;
	-webkit-animation: fade-down 9s;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
}
@keyframes fade-down {
	0% {
	  transform: translateY(-.75em);
	}
	33%,
	100% {
	  transform: translateY(.75em);
	}
}
@media only screen and (max-width:715px) {
	#rolodex-container {
	  margin: 0 auto;
	  height: 2em;
	  overflow: hidden;
	  text-align: center;
	}

	ul.rolodex {
	  margin: 0px auto;
	  width: 100%;
	  list-style-type: none;
	  padding: 0px;
	}

	ul.rolodex li {
	  margin: 0px;
	  width: 100%;
	  height: 1em !important;
	  padding: 2px;
	  font-size: 2em;
	  list-style-type: none;
	}

	.rolodex {
	  animation-name: rolly-scrolly;
	  animation: rolly-scrolly 9s;
	  animation-fill-mode: forwards;
	  animation-iteration-count: infinite;
	  -webkit-animation-name: rolly-scrolly;
	  -webkit-animation: rolly-scrolly 9s;
	  -webkit-animation-fill-mode: forwards;
	  -webkit-animation-iteration-count: infinite;
	  -moz-animation-fill-mode: forwards;
	  -ms-animation-fill-mode: forwards;
	  -o-animation-fill-mode: forwards;
	}


	@keyframes rolly-scrolly {

	  0%,
	  5% {
	    transform: translateY(0em);
	  }

	  5%,
	  17% {
	    transform: translateY(-1em);
	  }

	  17%,
	  29% {
	    transform: translateY(-2.9em);
	  }

	  29%,
	  41% {
	    transform: translateY(-4.8em);
	  }

	  41%,
	  53% {
	    transform: translateY(-6.7em);
	  }

	  53%,
	  65% {
	    transform: translateY(-8.6em);
	  }

	  65%,
	  100% {
	    opacity: 100%;
	    transform: translateY(-10.5em);
	  }

	}
	}

	@media only screen and (min-width:716px) {
	#rolodex-container {
	  margin: 0 auto;
	  height: 4em;
	  overflow: hidden;
	  text-align: center;
	}

	ul.rolodex {
	  margin: 0px auto;
	  width: 100%;
	  list-style-type: none;
	  padding: 0px;
	}

	ul.rolodex li {
	  margin: 0px;
	  width: 100%;
	  height: 1em !important;
	  padding: 1px;
	  font-size: 4em;
	  list-style-type: none;
	}

	.rolodex {
	  animation-name: rolly-scrolly;
	  animation: rolly-scrolly 9s;
	  animation-fill-mode: forwards;
	  animation-iteration-count: infinite;
	  -webkit-animation-name: rolly-scrolly;
	  -webkit-animation: rolly-scrolly 9s;
	  -webkit-animation-fill-mode: forwards;
	  -webkit-animation-iteration-count: infinite;
	  -moz-animation-fill-mode: forwards;
	  -ms-animation-fill-mode: forwards;
	  -o-animation-fill-mode: forwards;
	}


	@keyframes rolly-scrolly {

	  0%,
	  5% {
	    transform: translateY(0em);
	  }

	  5%,
	  17% {
	    transform: translateY(-1em);
	  }

	  17%,
	  29% {
	    transform: translateY(-5.25em);
	  }

	  29%,
	  41% {
	    transform: translateY(-9.35em);
	  }

	  41%,
	  53% {
	    transform: translateY(-13em);
	  }

	  53%,
	  65% {
	    transform: translateY(-17em);
	  }

	  65%,
	  100% {
	    transform: translateY(-21em);
	  }
	}
}






.il-reusable-block.tab-product-group .plethoraplugins-tabs a::before {
    height:1.15rem!important;
    width:1.15rem!important;
}
.il-reusable-block.tab-product-group .plethoraplugins-tabs a>span { margin-left:2rem!important; }
@media only screen and (min-width:768px) {
    .entry-content .il-reusable-block.grid-7-8-cards .il-block-card { max-width: calc((100% / 2) - 1rem); }
    .header-tabs .plethoraplugins-tabs li a span { font-size:3rem!important; color:#000000;}
.header-tabs .plethoraplugins-tabs li a.active span { font-size:3rem!important; color:#472ec1;}
a.active.js-plethoraplugins-tabs--link span{color:#5200ff;}
a.js-plethoraplugins-tabs--link {font-family:Hellix SemiBold,Verdana,Arial,Helvetica,sans-serif!important;}
.il-reusable-block.tab-product-group .plethoraplugins-tabs-container {margin-top:0!important;}
}
    .tab-card { flex-direction:column; }
    .tab-card .card-copy { flex-grow:1; }
    .tab-card .card-img {
        border-radius:1rem 1rem 0 0;
        object-fit:cover;
        object-position:center;
    }
    @media only screen and (min-width:576px) {
        .tab-card .card-img {
            height:150px;
            object-position:50% 25%;
        }
    }
    @media only screen and (min-width:768px) {
        .tab-card .card-img { height:auto; }
    }
    @media only screen and (min-width:992px) {
        .js-plethoraplugins-tab-panel { min-height:930px; }
        .tab-card .card-img { height:175px; }
    }
    @media only screen and (min-width:1200px) {
        .js-plethoraplugins-tab-panel { min-height:875px; }
    }
    @media only screen and (min-width:1500px) {
        .js-plethoraplugins-tab-panel { min-height:525px; }
        .tab-card { flex-direction:unset; }
        .tab-card .card-copy { flex-grow:unset; }
        .tab-card .card-img {
            border-radius:1rem 0 0 1rem;
            height:100%;
            object-position:center;
        }
    }