// About
.morphext > .animated {
  display: inline-block;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

.rotate-title {
  font-size: 2rem;
  font-weight: 300;
  margin-top: 3rem;
}

.history-list {
  margin: 0 0 8rem;
  padding: 0;
  list-style: none;

  li {
    margin: 25px 0;
    padding: 0;
    clear: both;

    p {
      margin-left: 53px;
    }
  }

  h3 {
    margin: 0 0 -27px 0;
    padding: 0;
    font-weight: 600;
    font-size: 1.6rem;
    color: $primary-color;
  }
}

.history-list li .thumb {
  background: transparent url(../images/history-thumb.png) no-repeat 0 0;
  width: 227px;
  height: 160px;
  margin: 0 0 3rem;
  padding: 0;
  float: left;

  img {
    border-radius: 50%;
    margin: .7rem .8rem;
    width: 145px;
    height: 145px;
  }
}

.history-list li .featured-box {
  text-align: left;
  margin-left: 225px;
  margin-bottom: 5rem;
  min-height: 115px;
  background: linear-gradient(to bottom, #FFF 1%, #fcfcfc 98%) repeat scroll 0 0 transparent;
  border-bottom: 1px solid #DFDFDF;
  border-left: 1px solid #ECECEC;
  border-radius: 0;
  border-right: 1px solid #ECECEC;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.08);
}

.history-list li .featured-box .box-content {
  border-top: 0.4rem solid $primary-color;
  padding: 3rem 3rem 1rem 3rem;
  position: relative;
  top: -1px;
}

@media screen and (max-width: 479px) {
  .history-list li .thumb {
    display: none;
  }

  .history-list li .featured-box {
    margin-left: 0;
  }
}

@include mq('md') {}


@include mq('lg') {}


@include mq('xl') {}
