﻿.wrap {
  height: 270px;
  width: 300px;
  position: relative;
  overflow: hidden;
}

.trapezoidLink:first-child > .trapezoid {
  top: 187px;
  left: 74px;
  transform: rotate(-150deg);
}
.trapezoidLink:nth-child(2) > .trapezoid {
  top: 151px;
  left: 39px;
  transform: rotate(-120deg);
}
.trapezoidLink:nth-child(3) > .trapezoid {
  top: 103px;
  left: 25px;
  transform: rotate(-90deg);
}
.trapezoidLink:nth-child(4) > .trapezoid {
  top: 55px;
  left: 37px;
  transform: rotate(-60deg);
}
.trapezoidLink:nth-child(5) > .trapezoid {
  top: 19px;
  left: 72px;
  transform: rotate(-30deg);
}
.trapezoidLink:nth-child(6) > .trapezoid {
  top: 7px;
  position: relative;
}
.trapezoidLink:nth-child(7) > .trapezoid {
  top: 19px;
  left: 168px;
  transform: rotate(30deg);
}
.trapezoidLink:nth-child(8) > .trapezoid {
  top: 55px;
  left: 203px;
  transform: rotate(60deg);
}
.trapezoidLink:nth-child(9) > .trapezoid {
  top: 103px;
  left: 216px;
  transform: rotate(90deg);
}
.trapezoidLink:nth-child(10) > .trapezoid {
  top: 151px;
  left: 204px;
  transform: rotate(120deg);
}
.trapezoidLink:nth-child(11) > .trapezoid {
  top: 187px;
  left: 169px;
  transform: rotate(150deg);
}
.circlecenter {
  height: 57%;
  width: 49%;
  position: relative;
  top: 0%;
  /* left: 25%; */
  background: #FFFFFF;
  border-radius: 50%;
  text-align: center;
  display: flex;
  justify-content: center;
  margin: auto;
  z-index: 4;
}

.scoreText {
    font-size: 42px;
    color: darkgrey;
}

.trapezoidBehind {
    border-top: 52px solid #EC4390;
    border-left: 13px solid transparent;
    z-index: 1;
    width: 71px;
    border-right: 13px solid transparent;
    position: absolute;
    border-top-left-radius: 50% 5px;
    border-top-right-radius: 50% 5px;
}

.trapezoideBehind-bottom {
    position: absolute;
    background-color: #EC4390;
    width: 41px;
    z-index: 3;
    height: 17px;
    border-radius: 100%;
}

.trapezoidBehind-0 {
    top: 188px;
    left: 67px;
    width: 72px;
    transform: rotate(-150deg);
}

.trapezoideBehind-bottom-0 {
    top: 182px;
    left: 95px;
    width: 43px;
    transform: rotate(-150deg);
}

.trapezoidBehind-1 {
    top: 151px;
    left: 31px;
    width: 72px;
    transform: rotate(-120deg);
}

.trapezoideBehind-bottom-1 {
    top: 156px;
    left: 69px;
    transform: rotate(-120deg);
}

.trapezoidBehind-2 {
    top: 102px;
    left: 17px;
    width: 71px;
    transform: rotate(-90deg);
}

.trapezoideBehind-bottom-2 {
    top: 119px;
    left: 60px;
    transform: rotate(-90deg);
}

.trapezoidBehind-3 {
    top: 53px;
    left: 30px;
    width: 71px;
    transform: rotate(-60deg);
}

.trapezoideBehind-bottom-3 {
    top:83px;
    left: 68px;
    transform: rotate(-60deg);
}

.trapezoidBehind-4 {
    top: 16px;
    left: 65px;
    width: 71px;
    transform: rotate(-30deg);
}

.trapezoideBehind-bottom-4 {
    top: 55px;
    left: 93px;
    transform: rotate(-30deg);
}

.trapezoidBehind-5 {
    top: 4px;
    left: 114px;
    width: 71px;
}

.trapezoideBehind-bottom-5 {
    top: 46px;
    left: 130px;
}

.trapezoidBehind-6 {
    top: 16px;
    left: 164px;
    transform: rotate(30deg);
    width: 71px;
}

.trapezoideBehind-bottom-6 {
    top: 55px;
    left: 165px;
    transform: rotate(30deg);
}

.trapezoidBehind-7 {
    top: 53px;
    left: 199px;
    width: 71px;
    transform: rotate(60deg);
}

.trapezoideBehind-bottom-7 {
    top: 83px;
    left: 191px;
    transform: rotate(60deg);
}

.trapezoidBehind-8 {
    top: 102px;
    left: 212px;
    width: 71px;
    transform: rotate(90deg);
}

.trapezoideBehind-bottom-8 {
    top: 118px;
    left: 200px;
    transform: rotate(90deg);
}

.trapezoidBehind-9 {
    top: 151px;
    left: 200px;
    width: 71px;
    transform: rotate(120deg);
}

.trapezoideBehind-bottom-9 {
    top: 155px;
    left: 190px;
    width: 42px;
    transform: rotate(120deg);
}

.trapezoidBehind-10 {
    top: 188px;
    left: 164px;
    width: 72px;
    transform: rotate(150deg);
}

.trapezoideBehind-bottom-10 {
    top: 181px;
    left: 162px;
    width: 46px;
    height: 18px;
    transform: rotate(150deg);
}

