/* Transparent Accordion */
.accordion {
    --bs-accordion-btn-bg: rgba(255, 255, 255, .0);
    --bs-accordion-active-bg: rgba(255, 255, 255, .2);
    --bs-accordion-active-color: rgba(30, 51, 91, 1);
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-bg: rgba(255, 255, 255, .0);
    --bs-accordion-color:rgba(30, 51, 91, 1);
    --bs-accordion-focus-border-color: unset;
    --bs-accordion-border-width: 0;
}
.accordion-header:first-of-type {
    margin: 0;
}
.accordion-button:not(.collapsed) {
    box-shadow: none;
}
/*-- end Accordion --*/
/***** SLIDE IN ANIMATIONS ON LOAN TYPES ON HOME PAGE *****/
.animBlock {
    opacity: 0;
    filter: alpha(opacity=0);
    position: relative;
    -webkit-transition: all .55s ease-in;
    -moz-transition: all .55s ease-in;
    -ms-transition: all .55s ease-in;
    -o-transition: all .55s ease-in;
    transition: all .55s ease-in;
  }
  .animBlock[data-position="left"] { left: -5%; overflow-x:hidden;}
  .animBlock[data-position="right"] { right: -5%; overflow-x:hidden;}
  .animBlock[data-position="top"] { top: -5%; overflow-x:hidden;}
  .animBlock[data-position="bottom"] { bottom: -5%; overflow-x:hidden;}
  
  .animBlock[data-position="left"].viewed {
    left: 0%;
    opacity: 1;
    filter: alpha(opacity=100);
  }
  .animBlock[data-position="right"].viewed {
    right: 0%;
    opacity: 1;
    filter: alpha(opacity=100);
  }
  .animBlock[data-position="top"].viewed {
    top: 0%;
    opacity: 1;
    filter: alpha(opacity=100);
  }
  .animBlock[data-position="bottom"].viewed {
    bottom: 0%;
    opacity: 1;
    filter: alpha(opacity=100);
  }
  /* END SLIDE IN ANIMATIONS ON LOAN TYPES ON HOME PAGE */


  /*-- CSS FOR INFINITE SCROLLER --*/
.scroller {
    max-width: 100%;
}
.scroller[data-animated="true"] {
    overflow: hidden;
    mask: liner-gradient(90deg, transparent, white 20%, white 80%, transparent);
    -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}
.scroller[data-animated="true"] .scroller__inner  {
    flex-wrap: nowrap;
    width: max-content;
    animation: scroll 40s
        /*var(--_animation-duration, 40s)
        var(--_animation-direction, forwards)*/
        linear infinite;
}
.scroller[data-direction="left"] {
    --_animation-direction: forwards;
}
.scroller[data-direction="right"] {
    --_animation-direction: reverse;
}
.scroller[data-speed="slow"] {
    --_animation-duration: 120s;
}
.scroller[data-speed="fast"] {
    --_animation-duration: 20s;
}
.scroller__inner .card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: none;
}
.scroller__inner .card img {
    padding:5px;
    width: 75%;
    height: auto;
    margin:0 auto;
}
.scroller__inner {
    display: flex;
    /*justify-content:space-around;*/
    gap: 1rem;
    padding-block: 1rem;
    flex-wrap: wrap;
}

@keyframes scroll {
    to {
        transform: translate(calc(-50% - 0.5rem));
    }
}
/* END INFINITE SCROLLER CSS */