/* _|   _ \   __|    __|
  |    __/   _|   \__ \        _|  (_-<  (_-<
___|  _|    _|    ____/  _)  \__|  ___/  ___/

See: https://github.com/ipfs-shipyard/ipfs-css
*/

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 300;
  src: local('Inter ExtraLight'),
    local('Inter-ExtraLight'),
    url(static/Inter-ExtraLight.a41f98d0.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-ExtraLight.e19bfcb1.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-ExtraLight.a09fa2ba.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 300;
  src: local('Inter ExtraLight Italic'),
    local('Inter-ExtraLightItalic'),
    url(static/Inter-ExtraLightItalic.6c92211d.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-ExtraLightItalic.11788b15.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-ExtraLightItalic.f5569dcd.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 400;
  src: local('Inter'),
    local('Inter-Regular'),
    url(static/Inter-Regular.e5bda372.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-Regular.81862cd5.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-Regular.b5481466.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 400;
  src: local('Inter Italic'),
    local('Inter-Italic'),
    url(static/Inter-Italic.3f606b77.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-Italic.e8e2ffb4.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-Italic.c3f70b5a.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 500;
  src: local('Inter Medium'),
    local('Inter-Medium'),
    url(static/Inter-Medium.be1d8a9f.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-Medium.0e42f2ba.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-Medium.a1ba9143.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 500;
  src: local('Inter Medium Italic'),
    local('Inter-MediumItalic'),
    url(static/Inter-MediumItalic.fdb9494a.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-MediumItalic.247e4373.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-MediumItalic.a50ebc10.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 600;
  src: local('Inter SemiBold'),
    local('Inter-SemiBold'),
    url(static/Inter-SemiBold.5e00470a.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-SemiBold.b4f3a1d1.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-SemiBold.f7d8c2c7.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 600;
  src: local('Inter SemiBold Italic'),
    local('Inter-SemiBoldItalic'),
    url(static/Inter-SemiBoldItalic.72bd01d5.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-SemiBoldItalic.02fc7624.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-SemiBoldItalic.925129e3.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 700;
  src: local('Inter Bold'),
    local('Inter-Bold'),
    url(static/Inter-Bold.01e06a41.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-Bold.c7f6e18b.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-Bold.9ec49f17.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 700;
  src: local('Inter Bold Italic'),
    local('Inter-BoldItalic'),
    url(static/Inter-BoldItalic.28372ba9.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-BoldItalic.c5aef144.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-BoldItalic.9b6c6557.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  normal;
  font-weight: 800;
  src: local('Inter ExtraBold'),
    local('Inter-ExtraBold'),
    url(static/Inter-ExtraBold.a9e704f9.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-ExtraBold.a8ab4346.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-ExtraBold.988fce7c.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Inter';
  font-style:  italic;
  font-weight: 800;
  src: local('Inter ExtraBold Italic'),
    local('Inter-ExtraBoldItalic'),
    url(static/Inter-ExtraBoldItalic.8f5c59bd.woff2) format("woff2"), /* Super modern browsers */
    url(static/Inter-ExtraBoldItalic.b93df5b1.woff) format('woff'), /* Pretty modern browsers */
    url(static/Inter-ExtraBoldItalic.09a4d963.otf) format('opentype'); /* non-IE */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: local('Montserrat Light'),
    local('Montserrat-Light'),
    url(static/Montserrat-Light.42c790d4.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-Light.7810cfba.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-Light.82d72028.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 300;
  src: local('Montserrat Light Italic'),
    local('Montserrat-LightItalic'),
    url(static/Montserrat-LightItalic.ead88e6e.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-LightItalic.55c9de7f.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-LightItalic.89ba4707.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'),
    local('Montserrat-Regular'),
    url(static/Montserrat-Regular.ee41bcfc.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-Regular.31c95f88.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-Regular.e5e97825.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: local('Montserrat Italic'),
    local('Montserrat-Italic'),
    url(static/Montserrat-Italic.f05d91af.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-Italic.22702a61.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-Italic.37189e3b.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: local('Montserrat Medium'),
    local('Montserrat-Medium'),
    url(static/Montserrat-Medium.a55186c7.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-Medium.dc60ffda.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-Medium.bd07d8f7.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 500;
  src: local('Montserrat Medium Italic'),
    local('Montserrat-MediumItalic'),
    url(static/Montserrat-MediumItalic.9334e263.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-MediumItalic.439fed29.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-MediumItalic.08c529d7.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: local('Montserrat SemiBold'),
    local('Montserrat-SemiBold'),
    url(static/Montserrat-SemiBold.74f83cd2.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-SemiBold.c207acb0.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-SemiBold.3f0cfa73.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 600;
  src: local('Montserrat SemiBold Italic'),
    local('Montserrat-SemiBoldItalic'),
    url(static/Montserrat-SemiBoldItalic.d5e338bf.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-SemiBoldItalic.95ec58cc.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-SemiBoldItalic.8f333b4b.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: local('Montserrat Bold'),
    local('Montserrat-Bold'),
    url(static/Montserrat-Bold.9014bbdf.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-Bold.eb07bdff.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-Bold.cdd4a4a6.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 700;
  src: local('Montserrat Bold Italic'),
    local('Montserrat-BoldItalic'),
    url(static/Montserrat-BoldItalic.f8204f79.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-BoldItalic.df65dfac.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-BoldItalic.60dfb796.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 800;
  src: local('Montserrat ExtraBold'),
    local('Montserrat-ExtraBold'),
    url(static/Montserrat-ExtraBold.97914248.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-ExtraBold.94c18ebc.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-ExtraBold.7bcbc38a.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

@font-face {
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 800;
  src: local('Montserrat ExtraBold Italic'),
    local('Montserrat-ExtraBoldItalic'),
    url(static/Montserrat-ExtraBoldItalic.f580b7e6.woff2) format('woff2'), /* Super modern browsers */
    url(static/Montserrat-ExtraBoldItalic.fdf05047.woff) format('woff'), /* Pretty modern browsers */
    url(static/Montserrat-ExtraBoldItalic.551a2914.eot?#iefix) format('embedded-opentype'); /* IE6-IE8 */
}

/* IPFS theme.css - Generated from https://github.com/ipfs-shipyard/ipfs-css/blob/master/theme.json */

/* ---- font ----- */

.sans-serif { font-family: 'Inter', system-ui, sans-serif; }

.montserrat { font-family: 'Montserrat', 'Verdana', system-ui, sans-serif; }

.monospace { font-family: Consolas, monaco, monospace; }

/* ---- color ----- */

.navy { color: #0b3a53; }

.navy-muted { color: #244e66; }

.aqua { color: #69c4cd; }

.aqua-muted { color: #9ad4db; }

.gray { color: #b7bbc8; }

.gray-muted { color: #d9dbe2; }

.charcoal { color: #34373f; }

.charcoal-muted { color: #7f8491; }

.red { color: #ea5037; }

.red-muted { color: #f36149; }

.yellow { color: #f39021; }

.yellow-muted { color: #f9a13e; }

.teal { color: #378085; }

.teal-muted { color: #439a9d; }

.green { color: #0cb892; }

.green-muted { color: #0aca9f; }

.snow { color: #edf0f4; }

.snow-muted { color: #f7f8fa; }

.link { color: #117eb3; }

.washed-blue { color: #F0F6FA; }

.bg-navy { background-color: #0b3a53; }

.bg-navy-muted { background-color: #244e66; }

.bg-aqua { background-color: #69c4cd; }

.bg-aqua-muted { background-color: #9ad4db; }

.bg-gray { background-color: #b7bbc8; }

.bg-gray-muted { background-color: #d9dbe2; }

.bg-charcoal { background-color: #34373f; }

.bg-charcoal-muted { background-color: #7f8491; }

.bg-red { background-color: #ea5037; }

.bg-red-muted { background-color: #f36149; }

.bg-yellow { background-color: #f39021; }

.bg-yellow-muted { background-color: #f9a13e; }

.bg-teal { background-color: #378085; }

.bg-teal-muted { background-color: #439a9d; }

.bg-green { background-color: #0cb892; }

.bg-green-muted { background-color: #0aca9f; }

.bg-snow { background-color: #edf0f4; }

.bg-snow-muted { background-color: #f7f8fa; }

.bg-link { background-color: #117eb3; }

.bg-washed-blue { background-color: #F0F6FA; }

.hover-navy:hover, .hover-navy:focus { color: #0b3a53; }

.hover-navy-muted:hover, .hover-navy-muted:focus { color: #244e66; }

.hover-aqua:hover, .hover-aqua:focus { color: #69c4cd; }

.hover-aqua-muted:hover, .hover-aqua-muted:focus { color: #9ad4db; }

.hover-gray:hover, .hover-gray:focus { color: #b7bbc8; }

.hover-gray-muted:hover, .hover-gray-muted:focus { color: #d9dbe2; }

.hover-charcoal:hover, .hover-charcoal:focus { color: #34373f; }

.hover-charcoal-muted:hover, .hover-charcoal-muted:focus { color: #7f8491; }

.hover-red:hover, .hover-red:focus { color: #ea5037; }

.hover-red-muted:hover, .hover-red-muted:focus { color: #f36149; }

.hover-yellow:hover, .hover-yellow:focus { color: #f39021; }

.hover-yellow-muted:hover, .hover-yellow-muted:focus { color: #f9a13e; }

.hover-teal:hover, .hover-teal:focus { color: #378085; }

.hover-teal-muted:hover, .hover-teal-muted:focus { color: #439a9d; }

.hover-green:hover, .hover-green:focus { color: #0cb892; }

.hover-green-muted:hover, .hover-green-muted:focus { color: #0aca9f; }

.hover-snow:hover, .hover-snow:focus { color: #edf0f4; }

.hover-snow-muted:hover, .hover-snow-muted:focus { color: #f7f8fa; }

.hover-link:hover, .hover-link:focus { color: #117eb3; }

.hover-washed-blue:hover, .hover-washed-blue:focus { color: #F0F6FA; }

.hover-bg-navy:hover, .hover-bg-navy:focus { background-color: #0b3a53; }

.hover-bg-navy-muted:hover, .hover-bg-navy-muted:focus { background-color: #244e66; }

.hover-bg-aqua:hover, .hover-bg-aqua:focus { background-color: #69c4cd; }

.hover-bg-aqua-muted:hover, .hover-bg-aqua-muted:focus { background-color: #9ad4db; }

.hover-bg-gray:hover, .hover-bg-gray:focus { background-color: #b7bbc8; }

.hover-bg-gray-muted:hover, .hover-bg-gray-muted:focus { background-color: #d9dbe2; }

.hover-bg-charcoal:hover, .hover-bg-charcoal:focus { background-color: #34373f; }

.hover-bg-charcoal-muted:hover, .hover-bg-charcoal-muted:focus { background-color: #7f8491; }

.hover-bg-red:hover, .hover-bg-red:focus { background-color: #ea5037; }

.hover-bg-red-muted:hover, .hover-bg-red-muted:focus { background-color: #f36149; }

.hover-bg-yellow:hover, .hover-bg-yellow:focus { background-color: #f39021; }

.hover-bg-yellow-muted:hover, .hover-bg-yellow-muted:focus { background-color: #f9a13e; }

.hover-bg-teal:hover, .hover-bg-teal:focus { background-color: #378085; }

.hover-bg-teal-muted:hover, .hover-bg-teal-muted:focus { background-color: #439a9d; }

.hover-bg-green:hover, .hover-bg-green:focus { background-color: #0cb892; }

.hover-bg-green-muted:hover, .hover-bg-green-muted:focus { background-color: #0aca9f; }

.hover-bg-snow:hover, .hover-bg-snow:focus { background-color: #edf0f4; }

.hover-bg-snow-muted:hover, .hover-bg-snow-muted:focus { background-color: #f7f8fa; }

.hover-bg-link:hover, .hover-bg-link:focus { background-color: #117eb3; }

.hover-bg-washed-blue:hover, .hover-bg-washed-blue:focus { background-color: #F0F6FA; }

.fill-navy { fill: #0b3a53; }

.fill-navy-muted { fill: #244e66; }

.fill-aqua { fill: #69c4cd; }

.fill-aqua-muted { fill: #9ad4db; }

.fill-gray { fill: #b7bbc8; }

.fill-gray-muted { fill: #d9dbe2; }

.fill-charcoal { fill: #34373f; }

.fill-charcoal-muted { fill: #7f8491; }

.fill-red { fill: #ea5037; }

.fill-red-muted { fill: #f36149; }

.fill-yellow { fill: #f39021; }

.fill-yellow-muted { fill: #f9a13e; }

.fill-teal { fill: #378085; }

.fill-teal-muted { fill: #439a9d; }

.fill-green { fill: #0cb892; }

.fill-green-muted { fill: #0aca9f; }

.fill-snow { fill: #edf0f4; }

.fill-snow-muted { fill: #f7f8fa; }

.fill-link { fill: #117eb3; }

.fill-washed-blue { fill: #F0F6FA; }

.hover-fill-navy:hover, .hover-fill-navy:focus { fill: #0b3a53; }

.hover-fill-navy-muted:hover, .hover-fill-navy-muted:focus { fill: #244e66; }

.hover-fill-aqua:hover, .hover-fill-aqua:focus { fill: #69c4cd; }

.hover-fill-aqua-muted:hover, .hover-fill-aqua-muted:focus { fill: #9ad4db; }

.hover-fill-gray:hover, .hover-fill-gray:focus { fill: #b7bbc8; }

.hover-fill-gray-muted:hover, .hover-fill-gray-muted:focus { fill: #d9dbe2; }

.hover-fill-charcoal:hover, .hover-fill-charcoal:focus { fill: #34373f; }

.hover-fill-charcoal-muted:hover, .hover-fill-charcoal-muted:focus { fill: #7f8491; }

.hover-fill-red:hover, .hover-fill-red:focus { fill: #ea5037; }

.hover-fill-red-muted:hover, .hover-fill-red-muted:focus { fill: #f36149; }

.hover-fill-yellow:hover, .hover-fill-yellow:focus { fill: #f39021; }

.hover-fill-yellow-muted:hover, .hover-fill-yellow-muted:focus { fill: #f9a13e; }

.hover-fill-teal:hover, .hover-fill-teal:focus { fill: #378085; }

.hover-fill-teal-muted:hover, .hover-fill-teal-muted:focus { fill: #439a9d; }

.hover-fill-green:hover, .hover-fill-green:focus { fill: #0cb892; }

.hover-fill-green-muted:hover, .hover-fill-green-muted:focus { fill: #0aca9f; }

.hover-fill-snow:hover, .hover-fill-snow:focus { fill: #edf0f4; }

.hover-fill-snow-muted:hover, .hover-fill-snow-muted:focus { fill: #f7f8fa; }

.hover-fill-link:hover, .hover-fill-link:focus { fill: #117eb3; }

.hover-fill-washed-blue:hover, .hover-fill-washed-blue:focus { fill: #F0F6FA; }

.border-navy, .b--navy { border-color: #0b3a53; }

.border-navy-muted, .b--navy-muted { border-color: #244e66; }

.border-aqua, .b--aqua { border-color: #69c4cd; }

.border-aqua-muted, .b--aqua-muted { border-color: #9ad4db; }

.border-gray, .b--gray { border-color: #b7bbc8; }

.border-gray-muted, .b--gray-muted { border-color: #d9dbe2; }

.border-charcoal, .b--charcoal { border-color: #34373f; }

.border-charcoal-muted, .b--charcoal-muted { border-color: #7f8491; }

.border-red, .b--red { border-color: #ea5037; }

.border-red-muted, .b--red-muted { border-color: #f36149; }

.border-yellow, .b--yellow { border-color: #f39021; }

.border-yellow-muted, .b--yellow-muted { border-color: #f9a13e; }

.border-teal, .b--teal { border-color: #378085; }

.border-teal-muted, .b--teal-muted { border-color: #439a9d; }

.border-green, .b--green { border-color: #0cb892; }

.border-green-muted, .b--green-muted { border-color: #0aca9f; }

.border-snow, .b--snow { border-color: #edf0f4; }

.border-snow-muted, .b--snow-muted { border-color: #f7f8fa; }

.border-link, .b--link { border-color: #117eb3; }

.border-washed-blue, .b--washed-blue { border-color: #F0F6FA; }

.ipfs-gradient-0 { background-image: -webkit-gradient(linear, left bottom, left top, from(#041727),to(#043b55)); background-image: linear-gradient(to top, #041727 0%,#043b55 100%); }

.transition-all {
  -webkit-transition: .2s ease all;
  transition: .2s ease all;
}

.no-select {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.force-select {
  -webkit-user-select: all;
     -moz-user-select: all;
      -ms-user-select: all;
          user-select: all;
}

.no-pointer-events {
  pointer-events: none;
}

.focus-underline:focus {
  text-decoration: underline;
}

.focus-outline:focus {
  outline: 0;
  box-shadow: 0 0 0 .2rem rgba(201, 210, 215, .4);
}

.focus-outline-red:focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(243, 97, 73, 0.4);
}

.focus-outline-green:focus {
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(10, 202, 159, 0.4);
}

.stroke-current-color {
  stroke: currentColor;
}

.fill-current-color {
  fill: currentColor;
}

.fill-white {
  fill: white;
}


.LinksTable .ReactVirtualized__Table__Grid {
  background: rgba(255,255,255,0.7)
}

/*!
 * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
 * Copyright 2015 Daniel Cardoso <@DanielCardoso>
 * Licensed under MIT
 */
.la-ball-triangle-path,
.la-ball-triangle-path > div {
    position: relative;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.la-ball-triangle-path {
    display: block;
    font-size: 0;
    color: #fff;
}
.la-ball-triangle-path.la-dark {
    color: #333;
}
.la-ball-triangle-path > div {
    display: inline-block;
    float: none;
    background-color: currentColor;
    border: 0 solid currentColor;
}
.la-ball-triangle-path {
    width: 32px;
    height: 32px;
}
.la-ball-triangle-path > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    border-radius: 100%;
}
.la-ball-triangle-path > div:nth-child(1) {
    -webkit-animation: ball-triangle-path-ball-one 2s 0s ease-in-out infinite;
       -moz-animation: ball-triangle-path-ball-one 2s 0s ease-in-out infinite;
         -o-animation: ball-triangle-path-ball-one 2s 0s ease-in-out infinite;
            animation: ball-triangle-path-ball-one 2s 0s ease-in-out infinite;
}
.la-ball-triangle-path > div:nth-child(2) {
    -webkit-animation: ball-triangle-path-ball-two 2s 0s ease-in-out infinite;
       -moz-animation: ball-triangle-path-ball-two 2s 0s ease-in-out infinite;
         -o-animation: ball-triangle-path-ball-two 2s 0s ease-in-out infinite;
            animation: ball-triangle-path-ball-two 2s 0s ease-in-out infinite;
}
.la-ball-triangle-path > div:nth-child(3) {
    -webkit-animation: ball-triangle-path-ball-tree 2s 0s ease-in-out infinite;
       -moz-animation: ball-triangle-path-ball-tree 2s 0s ease-in-out infinite;
         -o-animation: ball-triangle-path-ball-tree 2s 0s ease-in-out infinite;
            animation: ball-triangle-path-ball-tree 2s 0s ease-in-out infinite;
}
.la-ball-triangle-path.la-sm {
    width: 16px;
    height: 16px;
}
.la-ball-triangle-path.la-sm > div {
    width: 4px;
    height: 4px;
}
.la-ball-triangle-path.la-2x {
    width: 64px;
    height: 64px;
}
.la-ball-triangle-path.la-2x > div {
    width: 20px;
    height: 20px;
}
.la-ball-triangle-path.la-3x {
    width: 96px;
    height: 96px;
}
.la-ball-triangle-path.la-3x > div {
    width: 30px;
    height: 30px;
}
/*
 * Animations
 */
@-webkit-keyframes ball-triangle-path-ball-one {
    0% {
        -webkit-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
}
@-moz-keyframes ball-triangle-path-ball-one {
    0% {
        -moz-transform: translate(0, 220%);
             transform: translate(0, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -moz-transform: translate(110%, 0);
             transform: translate(110%, 0);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -moz-transform: translate(220%, 220%);
             transform: translate(220%, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -moz-transform: translate(0, 220%);
             transform: translate(0, 220%);
    }
}
@-o-keyframes ball-triangle-path-ball-one {
    0% {
        -o-transform: translate(0, 220%);
           transform: translate(0, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -o-transform: translate(110%, 0);
           transform: translate(110%, 0);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -o-transform: translate(220%, 220%);
           transform: translate(220%, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -o-transform: translate(0, 220%);
           transform: translate(0, 220%);
    }
}
@keyframes ball-triangle-path-ball-one {
    0% {
        -webkit-transform: translate(0, 220%);
           -moz-transform: translate(0, 220%);
             -o-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
           -moz-transform: translate(110%, 0);
             -o-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
           -moz-transform: translate(220%, 220%);
             -o-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
           -moz-transform: translate(0, 220%);
             -o-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
}
@-webkit-keyframes ball-triangle-path-ball-two {
    0% {
        -webkit-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
}
@-moz-keyframes ball-triangle-path-ball-two {
    0% {
        -moz-transform: translate(110%, 0);
             transform: translate(110%, 0);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -moz-transform: translate(220%, 220%);
             transform: translate(220%, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -moz-transform: translate(0, 220%);
             transform: translate(0, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -moz-transform: translate(110%, 0);
             transform: translate(110%, 0);
    }
}
@-o-keyframes ball-triangle-path-ball-two {
    0% {
        -o-transform: translate(110%, 0);
           transform: translate(110%, 0);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -o-transform: translate(220%, 220%);
           transform: translate(220%, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -o-transform: translate(0, 220%);
           transform: translate(0, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -o-transform: translate(110%, 0);
           transform: translate(110%, 0);
    }
}
@keyframes ball-triangle-path-ball-two {
    0% {
        -webkit-transform: translate(110%, 0);
           -moz-transform: translate(110%, 0);
             -o-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
           -moz-transform: translate(220%, 220%);
             -o-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
           -moz-transform: translate(0, 220%);
             -o-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
           -moz-transform: translate(110%, 0);
             -o-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
}
@-webkit-keyframes ball-triangle-path-ball-tree {
    0% {
        -webkit-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
}
@-moz-keyframes ball-triangle-path-ball-tree {
    0% {
        -moz-transform: translate(220%, 220%);
             transform: translate(220%, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -moz-transform: translate(0, 220%);
             transform: translate(0, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -moz-transform: translate(110%, 0);
             transform: translate(110%, 0);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -moz-transform: translate(220%, 220%);
             transform: translate(220%, 220%);
    }
}
@-o-keyframes ball-triangle-path-ball-tree {
    0% {
        -o-transform: translate(220%, 220%);
           transform: translate(220%, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -o-transform: translate(0, 220%);
           transform: translate(0, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -o-transform: translate(110%, 0);
           transform: translate(110%, 0);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -o-transform: translate(220%, 220%);
           transform: translate(220%, 220%);
    }
}
@keyframes ball-triangle-path-ball-tree {
    0% {
        -webkit-transform: translate(220%, 220%);
           -moz-transform: translate(220%, 220%);
             -o-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
    17% {
        opacity: .25;
    }
    33% {
        opacity: 1;
        -webkit-transform: translate(0, 220%);
           -moz-transform: translate(0, 220%);
             -o-transform: translate(0, 220%);
                transform: translate(0, 220%);
    }
    50% {
        opacity: .25;
    }
    66% {
        opacity: 1;
        -webkit-transform: translate(110%, 0);
           -moz-transform: translate(110%, 0);
             -o-transform: translate(110%, 0);
                transform: translate(110%, 0);
    }
    83% {
        opacity: .25;
    }
    100% {
        opacity: 1;
        -webkit-transform: translate(220%, 220%);
           -moz-transform: translate(220%, 220%);
             -o-transform: translate(220%, 220%);
                transform: translate(220%, 220%);
    }
}

