/*------------- #ACCORDIONS --------------*/


.crumina-accordion {
  list-style: none;
  margin: 0;
  padding: 0;
}

.accordion-group{
  list-style: none;
}

.accordion-panel {
  position: relative;
  background: $white-color;
  box-shadow: 17px 0 60px rgba(0, 0, 0, .1);
  border-radius: 50px;
  margin-bottom: 10px;

  &:after {
    content: '';
    display: block;
    width: 1px;
    height: auto;
    position: absolute;
    left: 65px;
    top: 20px;
    bottom: 20px;
    background-color: #cccccc;
    transition: all .3s ease;
  }
}

.accordion-heading {
  display: flex;
  align-items: center;
  padding: 25px 30px;
  font-size: 18px;
  transition: all .3s ease;
  width: 100%;
  line-height: 1;
  color: $heading-color;

  @media (max-width: 980px) {
    font-size: 14px;
  }

  @media (max-width: 768px) {
    padding: 20px;
  }

  span + span {
    padding-left: 30px;
    width: 100%;
  }

  .icon {
    font-size: 20px;
    color: #cccccc;
    padding-right: 30px;
    transition: all .3s ease;
    opacity: 1;

    @media (max-width: 768px) {
      padding: 0 15px;
    }
  }
}

.crumina-accordion .panel-info {
  font-size: 15px;
  line-height: 1.3;

  position: relative;
  padding: 10px 20px 30px 97px;
  border-radius: 0 0 50px 50px;
  margin-bottom: 5px;
  transition: all .3s ease;

  > * {
    float: none;
  }

  @media (max-width: 480px) {
    padding-left: 83px;
  }
}

.crumina-accordion .panel-heading {
  margin-bottom: 10px;
  transition: all .3s ease;

  i {
    transition: all .3s ease;
  }

  &.active {
    border-radius: 50px 50px 0 0;
    margin-bottom: 10px;
    transition: all .3s ease;

    .accordion-heading {
      transition: all .3s ease;

      i {
        transform: rotate(90deg);
        color: var(--primary-accent-color);
      }
    }

    a {
      padding-bottom: 0;
      color: var(--primary-accent-color);
    }
  }

  &:hover .accordion-heading {
    color: var(--primary-accent-color);

    i {
      color: var(--primary-accent-color);
    }
  }
}

.accordion__title {
  font-size: 19px;
  font-weight: 300;
}

.accordion__content__a {
  display: inline-block !important;
  color: #2dafd6 !important;
  font-size: 15px;
  text-decoration: underline;
}

.accordion__module .after::after {
  right: 72%;
  top: 36%;
  width: 2%;
}

/*=====================================================
                Transition
=======================================================*/

.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}

.fade.in {
  opacity: 1;
}

.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

tr.collapse.in {
  display: table-row;
}

tbody.collapse.in {
  display: table-row-group;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transition-duration: .35s;
  -o-transition-duration: .35s;
  transition-duration: .35s;
  -webkit-transition-property: height, visibility;
  -o-transition-property: height, visibility;
  transition-property: height, visibility;
}