.cta-fixed {
  opacity: 0;
  animation: fadeInUp 0.6s ease-out .5s 1 forwards;
  position:fixed;
  bottom:75px;
  margin-bottom:0px;
  z-index: 1040;
  right:-225px;
  display: flex;
  flex-direction: column;
  @include media-breakpoint-up(lg) {
    right:-220px;
    bottom:75%;
    margin-bottom: -90px;
  }
  

  
.cta {
    overflow:visible;
    height: 60px; 
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    margin-bottom:10px;
    
  }
  span.icon {
    display:block;
    height:60px;
    width:60px;
    float:left;
    background:$secondary;
    border-radius:50%;
    margin-right:20px;
    color:white;
    line-height:60px;
    text-align: center;
    box-shadow: 0 0 10px rgba(#000000, 0.3);
  }


  
  a {
    width:300px;
    transform: translateX(0);
    display: flex;
    height: 100%;
    align-items: center;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    transition: transform .3s ease-in-out, background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out, color 0.4s ease-in-out;
    color:transparent;
    background-color: #329636; 
    font-weight: bold;
    
    &:first-of-type {
      margin-bottom:15px;
    }
    &:hover {
      background-color:$secondary;
      box-shadow: 0 0 15px rgba(#000000, 0.5);
      color:white;
      transform: translateX(-220px);

    }
    svg {
      width: 16px!important;
      height: auto!important;
      vertical-align: middle;
      
      @include media-breakpoint-up(lg) {
        width: 20px!important;
      }
      path {
        fill: $white;
      }
    }
  }

}



/* Styling Icon */
.cta-fixed li a span::before {
  color: black;
  display: block;
  height: 60px;
  width: 60px;
  float: left;
  background: #cf0;
  border-radius: 50%;
  margin-right: 20px;
  color: black;
  line-height: 60px;
  text-align: center;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  font-size: 30px !important;
}

.cta-fixed li {list-style:none !important;}
.btn-link {
	float: right;
	margin-right: -42px;
}