.circle-wrapper
    {
     
      transform: translateY(-520px) translateX(300px) ;

      position: absolute;
      top:0px;
      right:0px;
    }
    .circle-sun
    {

      position:relative;
      width:1000px;
      height:1000px;
      float:right;
      
      margin-bottom:100px;

      background-image: url('/assets/img/home/ring-edge/circle-bg.svg');
      background-repeat:no-repeat;
      background-position: bottom right;
     


    }
    .circle
    {
      height:100%;
      width:100%;
      bottom:20px;
      left:50px;
      border-radius:1200px;
      position:absolute;
      
    }
    .point
    {
      transition: all .5s;
      position:absolute;
      padding:12px 16px;
      cursor: pointer;
      display: flex;
      align-items: center;

      font-family: 'Greycliff CF Bold';
      font-size:14px;
      border-radius:200px;
      background-color:#fff;
      -moz-box-shadow:0px 0px 15px rgba(0,0,0,0.2);
      -webkit-box-shadow:0px 0px 15px rgba(0,0,0,0.2);
      box-shadow:0px 0px 15px rgba(0,0,0,0.2);

      
    }
    .point svg
    {
      margin-right:7px;
    }
    .point.active
    {
      transition: all .5s;
      background-color: #773DBD;
      color:#fff;
    }
    .point svg path
    {
      stroke: #773DBD;
    }
    .point.active svg path
    {
      stroke: white;
    }
    

    .edge-card.active, .scroller-item.active
    {
      opacity:1;
      transform: translateX(0px);
      
    }
   
    .edge-card, .scroller-item
    {
      transition: all .5s;
      opacity: 0;
      transform: translateX(200px);
      border:1px solid #F15B2A80;
      border-radius:32px;
      padding: 24px;
      
    }
    .scroller-item
    {
      padding:0px;
      border:unset;
      border-radius: unset;
    }
    .edge-card img, .scroller-item img  
    {
      width:100%;
      border-radius:20px;
    }

    .edge-card .card-title, .scroller-item .card-title
    {
     /* margin-top:25px; */
      margin-bottom:20px;
      font-family: 'Greycliff CF Bold';
      font-size: 26px;
      font-weight: 400;
    }
    .edge-card .card-body
    {
     
      font-family: 'Greycliff CF';
      font-size: 18px;
      font-weight: 400;
   }
   .edge-arrow
   {
      /* float:left; */
      display: inline-block;
      margin-bottom:35px;
      background-color: rgba(241, 91, 42, .4);
      border-radius:200px;
      width:40px;
      height:40px;
      padding:9px 13px;
      transition: all .5s;
      cursor: pointer;
   }
   .edge-arrow i 
   {
    color:#fff;
   }
   .edge-arrow:hover
   {
    background-color: rgba(241, 91, 42, 1);
   }



   
@media only screen and (max-width: 1199px) 
{


    .edge-card, .scroller-item
    {
        
        transform: translateX(0px);

    }

}