Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="This is my attempt at recreating one of the gifs Remy posted to mark jsbin's 5th birthday. Don't worry, I didn't hand code all that CSS, I used Sass, but it's not currently available on here, so I pasted in the outputted CSS." />
<script src="http://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
    <svg height='500' width='500'>
        <!-- circles -->
        <path d="M50,250 A100,100 0 0,0 100,337" class="left_circle_lower_left_left"/> 
        <path d="M100,337 A100,100 0 0,0 150,350" class="left_circle_lower_left_right"/> 
        <path d="M150,350 A100,100 0 0,0 250,250" class="left_circle_lower_right"/> 
        <path d="M50,250 A100,100 0 0,1 75,183" class="left_circle_upper_left_left"/> 
        <path d="M75,183 A100,100 0 0,1 150,150" class="left_circle_upper_left_right"/> 
        <path d="M150,150 A100,100 0 0,1 250,250" class="left_circle_upper_right"/> 
        <path d="M250,250 A100,100 0 0,0 402,335" class="right_circle_lower_left"/> 
        <path d="M402,335 A100,100 0 0,0 450,250" class="right_circle_lower_right"/>
        <path d="M250,250 A100,100 0 0,1 425,185" class="right_circle_upper_left"/>
        <path d="M425,185 A100,100 0 0,1 450,250" class="right_circle_upper_right"/>
​
        <!-- outer rectangle -->
        <path d="M75,150 L150,150" class="rectangle_horiz_top_left_left" />
        <path d="M150,150 L250,150" class="rectangle_horiz_top_left_right" />
        <path d="M250,150 L350,150" class="rectangle_horiz_top_right_left" />
        <path d="M350,150 L425,150" class="rectangle_horiz_top_right_right" />
        <path d="M75,350 L150,350" class="rectangle_horiz_bottom_left_left" />
        <path d="M150,350 L250,350" class="rectangle_horiz_bottom_left_right" />
        <path d="M250,350 L350,350" class="rectangle_horiz_bottom_right_left" />
        <path d="M350,350 L425,350" class="rectangle_horiz_bottom_right_right" />
        <path d="M75,150 L75,250" class="rectangle_vert_left_top" />
        <path d="M75,250 L75,350" class="rectangle_vert_left_bottom" />
        <path d="M425,150 L425,250" class="rectangle_vert_right_top" />
        <path d="M425,250 L425,350" class="rectangle_vert_right_bottom" />
        
        <!-- diagonals from center -->
        <path d="M75,150 L250,250" class="center_to_top_left"/> 
        <path d="M250,250 L425,350" class="center_to_bottom_right" /> 
        <path d="M75,350 L250,250" class="center_to_bottom_left"/> 
        <path d="M250,250 L425,150" class="center_to_top_right" /> 
​
        <!-- squiggles -->
        <path d="M190,215 Q200,190 230,180" class="inner_squiggle" />
        <path d="M230,180 Q250,170 250,150" class="outer_squiggle" />
​
        <!-- others -->
        <path d="M50,250 L75,250" class="horizontal_bisector_left_left_left"/>
        <path d="M75,250 L150,250" class="horizontal_bisector_left_left_right"/>
        <path d="M150,250 L250,250" class="horizontal_bisector_left_right"/>
        <path d="M250,250 L350,250" class="horizontal_bisector_right_left"/>
        <path d="M350,250 L425,250" class="horizontal_bisector_right_right_left"/>
        <path d="M425,250 L450,250" class="horizontal_bisector_right_right_right"/>
        <path d="M250,150 L250,250" class="vertical_bisector_top"/>
        <path d="M250,250 L250,350" class="vertical_bisector_bottom"/>
        <path d="M150,150 L150,250" class="vertical_line_lhs"/>
        <path d="M350,193 L350,250" class="vertical_line_right_top" />
        <path d="M350,250 L350,307" class="vertical_line_right_bottom" />
​
    </svg>
</body>
</html>
 
svg {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -250px 0 0 -250px; }
​
rect, path, circle {
  stroke-width: 1px;
  stroke: grey;
  fill: none;
  stroke-linecap: round;
  animation: none 30s infinite cubic-bezier(0.19, 1, 0.22, 1); }
​
@keyframes vertical_bisector_top {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  30.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  33.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.vertical_bisector_top {
  animation-name: vertical_bisector_top; }
​
@keyframes vertical_bisector_bottom {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  33.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.vertical_bisector_bottom {
  animation-name: vertical_bisector_bottom; }
​
@keyframes rectangle_vert_left_top {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_vert_left_top {
  animation-name: rectangle_vert_left_top; }
​
@keyframes rectangle_vert_left_bottom {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_vert_left_bottom {
  animation-name: rectangle_vert_left_bottom; }
​
@keyframes rectangle_vert_right_bottom {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_vert_right_bottom {
  animation-name: rectangle_vert_right_bottom; }
​
@keyframes rectangle_vert_right_top {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_vert_right_top {
  animation-name: rectangle_vert_right_top; }
​
@keyframes center_to_bottom_right {
  2.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.center_to_bottom_right {
  animation-name: center_to_bottom_right; }
​
@keyframes center_to_bottom_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  63.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  66.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.center_to_bottom_left {
  animation-name: center_to_bottom_left; }
​
@keyframes center_to_top_right {
  2.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  69.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.center_to_top_right {
  animation-name: center_to_top_right; }
​
@keyframes center_to_top_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  38.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  69.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.center_to_top_left {
  animation-name: center_to_top_left; }
​
@keyframes left_circle_upper_left_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_upper_left_left {
  animation-name: left_circle_upper_left_left; }
​
@keyframes left_circle_upper_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_upper_left_right {
  animation-name: left_circle_upper_left_right; }
​
@keyframes left_circle_lower_left_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_lower_left_left {
  animation-name: left_circle_lower_left_left; }
​
@keyframes left_circle_lower_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_lower_left_right {
  animation-name: left_circle_lower_left_right; }
​
@keyframes left_circle_lower_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_lower_right {
  animation-name: left_circle_lower_right; }
​
@keyframes left_circle_upper_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.left_circle_upper_right {
  animation-name: left_circle_upper_right; }
​
@keyframes right_circle_upper_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 5px;
    stroke: red; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.right_circle_upper_left {
  animation-name: right_circle_upper_left; }
​
@keyframes right_circle_upper_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 5px;
    stroke: red; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.right_circle_upper_right {
  animation-name: right_circle_upper_right; }
​
@keyframes right_circle_lower_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 5px;
    stroke: red; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.right_circle_lower_left {
  animation-name: right_circle_lower_left; }
​
@keyframes right_circle_lower_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 5px;
    stroke: red; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.right_circle_lower_right {
  animation-name: right_circle_lower_right; }
​
@keyframes horizontal_bisector_left_left_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_left_left_left {
  animation-name: horizontal_bisector_left_left_left; }
​
@keyframes horizontal_bisector_left_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_left_left_right {
  animation-name: horizontal_bisector_left_left_right; }
​
@keyframes horizontal_bisector_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_left_right {
  animation-name: horizontal_bisector_left_right; }
​
@keyframes horizontal_bisector_right_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_right_left {
  animation-name: horizontal_bisector_right_left; }
​
@keyframes horizontal_bisector_right_right_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  19.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 5px;
    stroke: red; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_right_right_left {
  animation-name: horizontal_bisector_right_right_left; }
​
@keyframes horizontal_bisector_right_right_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 5px;
    stroke: red; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.horizontal_bisector_right_right_right {
  animation-name: horizontal_bisector_right_right_right; }
​
@keyframes rectangle_horiz_top_left_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.rectangle_horiz_top_left_left {
  animation-name: rectangle_horiz_top_left_left; }
​
@keyframes rectangle_horiz_top_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.rectangle_horiz_top_left_right {
  animation-name: rectangle_horiz_top_left_right; }
​
@keyframes rectangle_horiz_top_right_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.rectangle_horiz_top_right_left {
  animation-name: rectangle_horiz_top_right_left; }
​
@keyframes rectangle_horiz_top_right_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 5px;
    stroke: red; } }
​
.rectangle_horiz_top_right_right {
  animation-name: rectangle_horiz_top_right_right; }
​
@keyframes rectangle_horiz_bottom_right_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_horiz_bottom_right_left {
  animation-name: rectangle_horiz_bottom_right_left; }
​
@keyframes rectangle_horiz_bottom_right_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_horiz_bottom_right_right {
  animation-name: rectangle_horiz_bottom_right_right; }
​
@keyframes rectangle_horiz_bottom_left_right {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 5px;
    stroke: red; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_horiz_bottom_left_right {
  animation-name: rectangle_horiz_bottom_left_right; }
​
@keyframes rectangle_horiz_bottom_left_left {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 5px;
    stroke: red; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 5px;
    stroke: red; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 5px;
    stroke: red; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.rectangle_horiz_bottom_left_left {
  animation-name: rectangle_horiz_bottom_left_left; }
​
@keyframes vertical_line_right_bottom {
  2.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 5px;
    stroke: red; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.vertical_line_right_bottom {
  animation-name: vertical_line_right_bottom; }
​
@keyframes vertical_line_right_top {
  2.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 5px;
    stroke: red; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.vertical_line_right_top {
  animation-name: vertical_line_right_top; }
​
@keyframes inner_squiggle {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.inner_squiggle {
  animation-name: inner_squiggle; }
​
@keyframes outer_squiggle {
  2.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  5.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  8.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  11.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  13.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  16.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  19.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  22.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  25% {
    stroke-width: 1px;
    stroke: grey; }
​
  27.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  30.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  33.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  36.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  38.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  41.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  44.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  47.22222% {
    stroke-width: 5px;
    stroke: red; }
​
  50% {
    stroke-width: 1px;
    stroke: grey; }
​
  52.77778% {
    stroke-width: 1px;
    stroke: grey; }
​
  55.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  58.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  61.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  63.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  66.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  69.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  72.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  75% {
    stroke-width: 1px;
    stroke: grey; }
​
  77.77778% {
    stroke-width: 5px;
    stroke: red; }
​
  80.55556% {
    stroke-width: 1px;
    stroke: grey; }
​
  83.33333% {
    stroke-width: 1px;
    stroke: grey; }
​
  86.11111% {
    stroke-width: 1px;
    stroke: grey; }
​
  88.88889% {
    stroke-width: 1px;
    stroke: grey; }
​
  91.66667% {
    stroke-width: 1px;
    stroke: grey; }
​
  94.44444% {
    stroke-width: 1px;
    stroke: grey; }
​
  97.22222% {
    stroke-width: 1px;
    stroke: grey; }
​
  100% {
    stroke-width: 1px;
    stroke: grey; } }
​
.outer_squiggle {
  animation-name: outer_squiggle; }
​
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
Aptarypro
0viewers