/*Circular layout*/

.circleMap {
  width: 500px;
  height: 500px;
  min-height: 500px;
  min-width: 500px;
  border-radius: 50%;
  border: 1px dashed #888888;
  position: relative;
  margin: 50px;
}
.circleMap__items {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
  position: absolute;
  text-align: center;
}

/*

.circleMap img {
  height: 100px;
  width: 100px;
  border-radius: 50px;
  border: 2px solid #642577;
  object-fit: cover;
}
.circleMap--text {
  background-color: #f5f5f5;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  text-align: center;
}

*/

/*Positions*/

.top {
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.left {
  top: 50%;
  left: 0;
  transform: translateX(-50%) translateY(-50%);
}
.right {
  top: 50%;
  right: 0;
  transform: translateX(50%) translateY(-50%);
}
.bottom {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(50%);
}
.center {
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

/*Text Color*/
/*
.yl {
  color: #968d1f;
}
.vl {
  color: #8e0ae0;
}
.rd {
  color: #ff0000;
}
.cb {
  color: #388e8b;
}
*/
