*{
  padding: 0;
  margin: 0;
}
body{
    background: #ffffff;
}
.container{
    width: 700px;
    height: auto;
    margin: 80px auto;
    position: relative;
}
.circle{
    width: 600px;
    height: 600px;
    border: solid 50px #000000;
    border-radius: 50%;
    top: 70px;
    position: absolute;
    z-index: 10;
}
.a-1{
    width: 100px;
    height: 770px;
    background: #000000;
    transform: skewX(-25deg);
    position: absolute;
    left: 200px;
    z-index: 30;
}
.a-2{
    width: 100px;
    height: 380px;
    background: #000000;
    position: absolute;
    left: 400px;
    z-index: 30;
}
.a-3{
    width: 190px;
    height: 100px;
    background: #000000;
    position: absolute;
    left: 210px;
    top: 450px;
    z-index: 40;
}
.arrow-right{
    width: 0;
    height: 0;
    border-top: 90px solid transparent;
    border-bottom: 90px solid transparent;
    border-left: 120px solid #000000;
    left: 400px;
    top: 410px;
    position: absolute;
       z-index: 50;
}
.arrow-down{
    width: 0;
    height: 0;
    border-bottom: 80px solid transparent;
    border-right: 100px solid #000000;
    left: 400px;
    top: 380px;
    position: absolute;
    z-index: 60;
}
.arrow-left{
    width: 0;
    height: 0;
    border-top: 80px solid transparent;
    border-right: 100px solid #000000;
    left: 400px;
    top: 540px;
    position: absolute;
    z-index: 70;
}
.black-bar-1, .black-bar-2{
    width: 25px;
    height: 80px;
    background: #ffffff;
    transform: skewX(-25deg);
    position: absolute;
}
.black-bar-1{
    left: 158px;
    top: 650px;
    z-index: 80;
}
.black-bar-2{
    left: 72px;
    top: 565px;
    z-index: 90;
}
/* .footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1rem;
  background-color: #000;
  text-align: center;
} */
 /* .footer p {
text-decoration: none;
color: #fff;
}
.footer a {
  text-decoration: none;
  color: red;
}
.footer a:hover {
  text-decoration: underline;
  color: gray;
} */