<div class="badge__wrapper">
  <div class="stitches">
    <div class="stitches__outer-bg">
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
    </div>
    <div class="stitches__outer-overlay">
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
    </div>
    <div class="stitches__inner-bg">
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i></div>
    </div>
    <div class="stitches__inner-overlay">
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i><i></i><i></i><i></i><i></i></div>
      <div class="block"><i></i><i></i></div>
    </div>

    <div class="stitches__outer-circle"></div>
    <div class="stitches__inner-circle"></div>
  </div>

  <div class="mission">
    <div class="infinity">
      <span>T</span>
      <span>O</span>
      <span></span>
      <span>I</span>
      <span>N</span>
      <span>F</span>
      <span>I</span>
      <span>N</span>
      <span>I</span>
      <span>T</span>
      <span>Y</span>
      <span></span>
      <span>A</span>
      <span>N</span>
      <span>D</span>
      <span></span>
      <span>B</span>
      <span>E</span>
      <span>Y</span>
      <span>O</span>
      <span>N</span>
      <span>D</span>
      <span></span>
      <span class="char-star">&#8902;</span>
      <span></span>
      <span>2</span>
      <span>0</span>
      <span>1</span>
      <span>7</span>
      <span></span>
      <span>-</span>
      <span></span>
      <span>2</span>
      <span>0</span>
      <span>3</span>
      <span>7</span>
    </div>

    <div class="proxima">
      <span class="char-star">&#8902;</span>
      <span>P</span>
      <span>R</span>
      <span>O</span>
      <span>X</span>
      <span>I</span>
      <span>M</span>
      <span>A</span>
      <span></span>
      <span>C</span>
      <span>E</span>
      <span>N</span>
      <span>T</span>
      <span>A</span>
      <span>U</span>
      <span>R</span>
      <span>I</span>
      <span></span>
      <span>B</span>
      <span class="char-star">&#8902;</span>
    </div>
  </div>

  <div class="badge__cut">
    <div class="laser"></div>
    <div class="laserball"></div>
    <div class="starcross">
      <span></span>
      <span></span>
      <span></span>
      <span></span>
    </div>
    <div class="starcentauri">
      <span><i></i></span>
      <span><i></i></span>
    </div>
    <div class="badge__earth">
      <div class="smoke">
        <span></span>
        <span></span>
        <span></span>
        <span></span>
      </div>
    </div>
  </div>
</div>

progress,sub,sup{vertical-align:baseline}button,hr,input{overflow:visible}html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0} figcaption, menu,article,aside,details,figure,footer,header,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0} [hidden],template{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{}button,select{text-transform:none}[type=submit], [type=reset],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}

$stitchDegreeOuter: 4deg;
$stitchDegreeOuterTot: $stitchDegreeOuter * 5;
$stitchDegreeInner: 5deg;
$stitchDegreeInnerTot: $stitchDegreeInner * 5;

$charsDegree: 5deg;

html{
  height: 100%;
}

body{
  background: rgb(17,16,60);
  background: -moz-radial-gradient(center, ellipse cover,  rgba(17,16,60,1) 0%, rgba(22,12,12,1) 100%);
  background: -webkit-radial-gradient(center, ellipse cover,  rgba(17,16,60,1) 0%,rgba(22,12,12,1) 100%);
  background: radial-gradient(ellipse at center,  rgba(17,16,60,1) 0%,rgba(22,12,12,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#11103c', endColorstr='#160c0c',GradientType=1 );
  font-family: "proxima-nova";
}

.badge__wrapper{
  background: #999;
  border-radius: 50%;
  height: 250px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%);
  width: 250px;
}

.mission{
  background: #045BA2;
  border: 4px solid #045BA2;
  border-radius: 50%;
  height: 294px;
  left: -26px;
  position: absolute;
  top: -26px;
  width: 294px;
}

.infinity{
  height: 145px;
  left: calc(50% - 5px);
  position: absolute;
  top: 2px;
  transform: rotate(-87deg);
  transform-origin: bottom center;
  width: 10px;

  span{
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    height: 145px;
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: bottom center;
    width: 10px;

    &.char-star{
      font-size: 32px;
      height: 150px;
    }

    &:nth-child(2){ transform: rotate(5deg); }
    &:nth-child(3){ transform: rotate(10deg); }
    &:nth-child(4){ transform: rotate(15deg); }
    &:nth-child(5){ transform: rotate(18deg); }
    &:nth-child(6){ transform: rotate(24deg); }
    &:nth-child(7){ transform: rotate(29deg); }
    &:nth-child(8){ transform: rotate(32deg); }
    &:nth-child(9){ transform: rotate(38deg); }
    &:nth-child(10){ transform: rotate(41deg); }
    &:nth-child(11){ transform: rotate(46deg); }
    &:nth-child(12){ transform: rotate(51deg); }
    &:nth-child(13){ transform: rotate(56deg); }
    &:nth-child(14){ transform: rotate(62deg); }
    &:nth-child(15){ transform: rotate(68deg); }
    &:nth-child(16){ transform: rotate(73deg); }
    &:nth-child(17){ transform: rotate(78deg); }
    &:nth-child(18){ transform: rotate(83deg); }
    &:nth-child(19){ transform: rotate(88deg); }
    &:nth-child(20){ transform: rotate(93deg); }
    &:nth-child(21){ transform: rotate(99deg); }
    &:nth-child(22){ transform: rotate(105deg); }
    &:nth-child(23){ transform: rotate(110deg); }
    &:nth-child(24){ transform: rotate(115deg); }
    &:nth-child(25){ transform: rotate(125deg); }
    &:nth-child(26){ transform: rotate(130deg); }
    &:nth-child(27){ transform: rotate(135deg); }
    &:nth-child(28){ transform: rotate(141deg); }
    &:nth-child(29){ transform: rotate(145deg); }
    &:nth-child(30){ transform: rotate(149deg); }
    &:nth-child(31){ transform: rotate(154deg); }
    &:nth-child(32){ transform: rotate(156deg); }
    &:nth-child(33){ transform: rotate(160deg); }
    &:nth-child(34){ transform: rotate(165deg); }
    &:nth-child(35){ transform: rotate(170deg); }
    &:nth-child(36){ transform: rotate(175deg); }
  }
}

.proxima{
  bottom: 2px;
  height: 145px;
  left: calc(50% - 5px);
  position: absolute;
  transform: rotate(54deg);
  transform-origin: top center;
  width: 10px;

  span{
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    height: 145px;
    left: 0;
    line-height: 272px;
    position: absolute;
    top: 0;
    transform-origin: top center;
    width: 10px;

    &.char-star{
      font-size: 32px;
      height: 150px;
    }

    &:nth-child(2){ transform: rotate(-12deg); }
    &:nth-child(3){ transform: rotate(-17deg); }
    &:nth-child(4){ transform: rotate(-22deg); }
    &:nth-child(5){ transform: rotate(-28deg); }
    &:nth-child(6){ transform: rotate(-34deg); }
    &:nth-child(7){ transform: rotate(-37deg); }
    &:nth-child(8){ transform: rotate(-44deg); }
    &:nth-child(9){ transform: rotate(-49deg); }
    &:nth-child(10){ transform: rotate(-53deg); }
    &:nth-child(11){ transform: rotate(-59deg); }
    &:nth-child(12){ transform: rotate(-64deg); }
    &:nth-child(13){ transform: rotate(-70deg); }
    &:nth-child(14){ transform: rotate(-74deg); }
    &:nth-child(15){ transform: rotate(-79deg); }
    &:nth-child(16){ transform: rotate(-85deg); }
    &:nth-child(17){ transform: rotate(-91deg); }
    &:nth-child(18){ transform: rotate(-93deg); }
    &:nth-child(19){ transform: rotate(-97deg); }
    &:nth-child(20){ transform: rotate(-107deg); }
  }
}

.stitches{
  border-radius: 50%;
  height: 310px;
  left: -30px;
  position: absolute;
  top: -30px;
  width: 310px;
  z-index: 2;
}

.stitches__outer-bg,
.stitches__inner-bg{
  left: calc(50% - 5px);
  position: absolute;
  transform-origin: bottom center;
  top: 0;
  width: 10px;
  z-index: 1;

  .block{
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: bottom center;
    width: 10px;
  }

  i{
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: bottom center;
    width: 10px;
    z-index: 0;

    &:before,
    &:after{
      background: #f7941e;
      border-radius: 2px;
      content: "";
      height: 8px;
      position: absolute;
      top: 0;
      width: 4px;
    }

    &:before{ left: 0; }
    &:after{ right: 1px; }
  }
}

.stitches__outer-bg,
.stitches__outer-overlay{
  height: 155px;

  .block{
    height: 155px;

    &:nth-child(2){ transform: rotate($stitchDegreeOuterTot*1); }
    &:nth-child(3){ transform: rotate($stitchDegreeOuterTot*2); }
    &:nth-child(4){ transform: rotate($stitchDegreeOuterTot*3); }
    &:nth-child(5){ transform: rotate($stitchDegreeOuterTot*4); }
    &:nth-child(6){ transform: rotate($stitchDegreeOuterTot*5); }
    &:nth-child(7){ transform: rotate($stitchDegreeOuterTot*6); }
    &:nth-child(8){ transform: rotate($stitchDegreeOuterTot*7); }
    &:nth-child(9){ transform: rotate($stitchDegreeOuterTot*8); }
    &:nth-child(10){ transform: rotate($stitchDegreeOuterTot*9); }
    &:nth-child(11){ transform: rotate($stitchDegreeOuterTot*10); }
    &:nth-child(12){ transform: rotate($stitchDegreeOuterTot*11); }
    &:nth-child(13){ transform: rotate($stitchDegreeOuterTot*12); }
    &:nth-child(14){ transform: rotate($stitchDegreeOuterTot*13); }
    &:nth-child(15){ transform: rotate($stitchDegreeOuterTot*14); }
    &:nth-child(16){ transform: rotate($stitchDegreeOuterTot*15); }
    &:nth-child(17){ transform: rotate($stitchDegreeOuterTot*16); }
    &:nth-child(18){ transform: rotate($stitchDegreeOuterTot*17); }
  }

  i{
    height: 155px;

    &:before,
    &:after{
      height: 8px;
    }

    &:nth-child(2){ transform: rotate($stitchDegreeOuter*1); }
    &:nth-child(3){ transform: rotate($stitchDegreeOuter*2); }
    &:nth-child(4){ transform: rotate($stitchDegreeOuter*3); }
    &:nth-child(5){ transform: rotate($stitchDegreeOuter*4); }
  }
}

.stitches__inner-bg,
.stitches__inner-overlay{
  height: 125px;
  top: 30px;

  .block{
    height: 125px;

    &:nth-child(2){ transform: rotate($stitchDegreeInnerTot*1); }
    &:nth-child(3){ transform: rotate($stitchDegreeInnerTot*2); }
    &:nth-child(4){ transform: rotate($stitchDegreeInnerTot*3); }
    &:nth-child(5){ transform: rotate($stitchDegreeInnerTot*4); }
    &:nth-child(6){ transform: rotate($stitchDegreeInnerTot*5); }
    &:nth-child(7){ transform: rotate($stitchDegreeInnerTot*6); }
    &:nth-child(8){ transform: rotate($stitchDegreeInnerTot*7); }
    &:nth-child(9){ transform: rotate($stitchDegreeInnerTot*8); }
    &:nth-child(10){ transform: rotate($stitchDegreeInnerTot*9); }
    &:nth-child(11){ transform: rotate($stitchDegreeInnerTot*10); }
    &:nth-child(12){ transform: rotate($stitchDegreeInnerTot*11); }
    &:nth-child(13){ transform: rotate($stitchDegreeInnerTot*12); }
    &:nth-child(14){ transform: rotate($stitchDegreeInnerTot*13); }
    &:nth-child(15){ transform: rotate($stitchDegreeInnerTot*14); }
  }

  i{
    height: 125px;

    &:before,
    &:after{
      height: 6px;
    }

    &:nth-child(2){ transform: rotate($stitchDegreeInner*1); }
    &:nth-child(3){ transform: rotate($stitchDegreeInner*2); }
    &:nth-child(4){ transform: rotate($stitchDegreeInner*3); }
    &:nth-child(5){ transform: rotate($stitchDegreeInner*4); }
  }
}

.stitches__outer-overlay,
.stitches__inner-overlay{
  left: calc(50% - 5px);
  position: absolute;
  transform-origin: bottom center;
  width: 10px;
  z-index: 2;

  .block{
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: bottom center;
    width: 10px;
  }

  i{
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: bottom center;
    width: 10px;
    z-index: 1;

    &:before,
    &:after{
      background: #ffe395;
      border-radius: 1px;
      content: "";
      height: 8px;
      position: absolute;
      top: 0;
      width: 2px;
    }

    &:before{ left: 1px; }
    &:after{ right: 2px; }
  }
}

.stitches__outer-overlay{
  top: 0;

  i{
    &:before,
    &:after{
      height: 5px;
      top: 2px;
    }
  }
}

.stitches__inner-overlay{
  top: 30px;

  i{
    &:before,
    &:after{
      height: 3px;
      top: 1px;
    }
  }
}

.stitches__outer-circle{
  border: 5px solid #CD853F;
  border-radius: 50%;
  height: 298px;
  left: 1px;
  position: absolute;
  width: 298px;
  top: 1px;
  z-index: 0;
}

.stitches__inner-circle{
  border: 3px solid #FFA500;
  border-radius: 50%;
  height: 242px;
  left: 31px;
  position: absolute;
  width: 242px;
  top: 31px;
  z-index: 0;
}

.badge__cut{
  background: #111;
  border-radius: 50%;
  height: 246px;
  left: 2px;
  overflow: hidden;;
  position: absolute;
  top: 2px;
  width: 246px;
  z-index: 1;
}

.badge__earth{
  background: rgba(17, 16, 60, 1);
  box-shadow: 0 0 0 3px #e13e41, 0 0 0 7px #f1b425, 0 0 0 14px #0b4fb0;
  border-radius: 50%;
  height: 400px;
  left: -75px;
  position: absolute;
  top: 180px;
  width: 400px;
  z-index: 0;

  &:before{
    background: rgba(17, 16, 60, 1);
    border-radius: 50%;
    content: "";
    height: 400px;
    left: 0;
    position: absolute;
    top: 0;
    width: 400px;
    z-index: 1;
  }

  &:after{
    background: rgba(0,0,0,.4);
    border-radius: 50%;
    content: "";
    height: 360px;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 360px;
    z-index: 1;
  }
}

.laserball{
  background: #bbb;
  border-radius: 50%;
  box-shadow: 0 0 0px 4px #222;
  height: 20px;
  left: calc(50% - 10px);
  overflow: hidden;
  position: absolute;
  top: 155px;
  width: 20px;
  z-index: 1;

  &:before{
    background: #999;
    border: 2px solid #444;
    border-radius: 50%;
    content: "";
    height: 8px;
    left: calc(50% - 6px);
    position: absolute;
    top: -6px;
    width: 8px;
  }
}

.laser{
  border-style: solid;
  border-width: 220px 8px 0 8px;
  border-color: #830E17 transparent transparent transparent;
  height: 0;
  left: calc(50% - 8px);
  position: absolute;
  top: 0;
  width: 0;
  z-index: 0;

  &:before{
    border-style: solid;
    border-width: 130px 3px 0 3px;
    border-color: #EB0132 transparent transparent transparent;
    content: "";
    height: 0;
    left: -3px;
    position: absolute;
    top: -220px;
    width: 0;
  }
}

.smoke{
  height: 80px;
  left: calc(50% - 60px);
  position: absolute;
  top: -75px;
  width: 120px;
  z-index: 0;

  span{
    bottom: 0;
    height: 70px;
    left: calc(50% - 7px);
    position: absolute;
    transform-origin: bottom center;
    width: 14px;

    &:nth-child(1),
    &:nth-child(2){
      &:before,
      &:after{
        border-style: solid;
        border-width: 0 7px 70px 7px;
        border-color: transparent transparent #fff transparent;
        bottom: 0;
        content: "";
        height: 0;
        left: calc(50% - 7px);
        position: absolute;
        transform-origin: bottom center;
        width: 0;
      }

      &:before{
        transform: rotate(20deg);
      }

      &:after{
        transform: rotate(55deg);
      }
    }

    &:nth-child(1){
      transform: rotate(-75deg);
    }

    &:nth-child(3){
      left: calc(50% - 5px);
      transform: rotate(34deg);

      &:before{
        border-style: solid;
        border-width: 0 5px 60px 5px;
        border-color: transparent transparent #fff transparent;
        bottom: 0;
        content: "";
        height: 0;
        left: calc(50% - 5px);
        position: absolute;
        width: 0;
      }

      &:after{
        border-style: solid;
        border-width: 0 10px 50px 10px;
        border-color: transparent transparent #fff transparent;
        bottom: 0;
        content: "";
        height: 0;
        left: calc(50% - 10px);
        position: absolute;
        transform: rotate(34deg);
        transform-origin: bottom center;
        width: 0;
      }
    }

    &:nth-child(4){
      left: calc(50% - 7px);
      transform: rotate(-36deg);

      &:before{
        border-style: solid;
        border-width: 0 5px 60px 5px;
        border-color: transparent transparent #fff transparent;
        bottom: 0;
        content: "";
        height: 0;
        left: calc(50% - 5px);
        position: absolute;
        width: 0;
      }

      &:after{
        border-style: solid;
        border-width: 0 10px 50px 10px;
        border-color: transparent transparent #fff transparent;
        bottom: 0;
        content: "";
        height: 0;
        left: calc(50% - 10px);
        position: absolute;
        transform: rotate(-36deg);
        transform-origin: bottom center;
        width: 0;
      }
    }
  }
}

.starcross{
  height: 110px;
  left: 135px;
  position: absolute;
  top: 40px;
  width: 80px;

  span{
    background: #fff;
    border-radius: 50%;
    position: absolute;
  }

  span:nth-child(1),
  span:nth-child(2){
    height: 10px;
    left: 30px;
    top: 80px;
    width: 10px;
  }

  span:nth-child(1){
    left: 40px;
    top: 0;
  }

  span:nth-child(2){
    left: 10px;
    top: 45px;
  }

  span:nth-child(3){
    height: 6px;
    left: 35px;
    top: 85px;
    width: 6px;
  }

  span:nth-child(4){
    height: 14px;
    left: 70px;
    top: 30px;
    width: 14px;
  }
}

.starcentauri{
  height: 100px;
  left: 20px;
  position: absolute;
  top: 30px;
  width: 100px;

  span{
    background: #fff;
    border-radius: 50%;
    height: 14px;
    left: 70px;
    position: absolute;
    top: 30px;
    width: 14px;

    &:before,
    &:after,
    i:before,
    i:after{
      border-style: solid;
      content: "";
      height: 0;
      position: absolute;;
      width: 0;
    }

    &:before{
      border-width: 0 2px 20px 2px;
      border-color: transparent transparent #fff transparent;
      left: 5px;
      top: -18px;
    }

    &:after{
      border-color: #fff transparent transparent transparent;
      border-width: 20px 2px 0 2px;
      bottom: -18px;
      left: 5px;
    }

    i{
      left: 50%;
      position: absolute;
      top: 0;
    }

    i:before{
      border-color: transparent #fff transparent transparent;
      border-width: 2px 20px 2px 0;
      left: -22px;
      top: 5px;
    }

    i:after{
      border-color: transparent transparent transparent #fff;
      border-width: 2px 0 2px 20px;
      right: -22px;
      top: 5px;
    }

    &:nth-child(1){
      left: 10px;
      top: 90px;
    }

    &:nth-child(2){
      left: 60px;
      top: 60px;
    }
  }
}

/*
 * EMBED STYLING
*/
@media (max-width: 800px){
  html,
  body{
    height: 600px;
    overflow: hidden;
    width: 800px;
  }
}