1.scss

$pi: 3.14159265359;
$_precision: 10;

@function pow($base, $exp) {
  $value: $base;
  @if $exp > 1 {
    @for $i from 2 through $exp {
      $value: $value * $base;
    }
  }
  @if $exp < 1{
    @for $i from 0 through -$exp {
      $value: $value / $base;
    }
  }
  @return $value;
}

@function fact($num) {
  $fact: 1;
  @if $num > 0{
    @for $i from 1 through $num {
      $fact: $fact * $i;
    }
  }
  @return $fact;
}

@function _to_unitless_rad($angle) {
  @if unit($angle) == "deg" {
    $angle: $angle / 180deg * $pi;
  }
  @if unit($angle) == "rad" {
    $angle: $angle / 1rad;
  }
  @return $angle;
}

@function sin($angle){
  $a: _to_unitless_rad($angle);
  $sin: $a;
  @for $n from 1 through $_precision {
    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1) ) * pow($a, (2 * $n + 1));
  }
  @return $sin;
}

@function cos($angle){
  $a: _to_unitless_rad($angle);
  $cos: 1;
  @for $n from 1 through $_precision {
    $cos: $cos + ( pow(-1,$n) / fact(2*$n) ) * pow($a,2*$n);
  }
  @return $cos;
}

@function tan($angle){
  @return sin($angle) / cos($angle);
}

 

$a: 550;
$b: 110;
$s: 100;

@keyframes move {
    @for $i from 0 to $s + 1{
        $keyframeSel: $i * 100%/$s;
        $x: $a*cos(360deg/$s*$i);
        $y:$b*sin(360deg/$s * $i);

        #{$keyframeSel} {
            transform: translate(#{$x}px, #{$y}px);
        }
    }
}


.ellips{
    $w: $a *2;
    $h:$b *2;
     width: #{$w}px;
    height:#{$h}px;
    border-radius: 100%;
    border: 1px solid #333;
    position: relative;
    margin: 30px 0 0 20px;
}
.dot{
    width: 20px;
    height: 20px;
     left: $a - 10px;;
    top: $b - 10px;
    background: red;
    border-radius: 100%;
    position: absolute;
    animation: move 10s linear infinite;
}