

.circletext {
  border-radius:50%!important;
  display: inline-block!important;
    padding-top: 6rem;
}

.circlemodal {
  padding:0!important;
}

/* .circlemodal:first-of-type {
  z-index:-2;
}

.circlemodal:nth-of-type(2n) {
  z-index:-1;
} */
.bigtext {
  font-size: 1.8rem!important;
}
.sections .section {
  height: 9.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1.6rem; }
  .sections .section .section-title {
    position: relative;
    width: 3.4rem;
    height: 9.6rem; }
    .sections .section .section-title span {
      text-align: center;    
  display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      height: 3.4rem;
      width: 9.6rem;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-transform: translateX(calc(-50% + 1.7rem)) translateY(calc(50% + 1.4rem)) rotate(-90deg);
      -ms-transform: translateX(calc(-50% + 1.7rem)) translateY(calc(50% + 1.4rem)) rotate(-90deg);
      transform: translateX(calc(-50% + 1.7rem)) translateY(calc(50% + 1.4rem)) rotate(-90deg);     
  line-height: 1.5rem;
}
  .sections .section .content {
    margin: 0 -.8rem;
    width: 100%;
    height: 9.6rem;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; }
  .sections .section .item {
    padding: 0 .8rem;
    width: 100%;
    text-align: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0; }
    .sections .section .item .text {
      background: #2E318F;
      color: #ffffff;
      -webkit-border-radius: 0.4rem;
      border-radius: 0.4rem;
      background-clip: padding-box !important;
      /* stops bg color from leaking outside the border: */
      width: 100%;
      height: 100%;
      margin: 0;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      font-size: 1.4rem;
      line-height: 2rem; }
      .sections .section .item .text.light-blue {
        background: #BFC2E6;
        color: #2E318F; }

.open-modal {
  cursor: pointer;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  position: relative;
  -webkit-transition: .2s ease;
  -o-transition: .2s ease;
  transition: .2s ease; }
  .open-modal:hover {
    -webkit-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02); }
    .open-modal:hover .text {
      -webkit-box-shadow: 0 8px 16px rgba(51, 51, 51, 0.15);
      box-shadow: 0 8px 16px rgba(51, 51, 51, 0.15); }


.sections .section .item .text.red {
   background:#CE5368;
    color:#fff;
}
.sections .section .item .text.yellow{
  background:#DFAE41;
    color:#2E318F;
}
.sections .section .item .text.blue{
   background:#2E318F;
    color:#fff;
}

  .sections .section .item .text {
   
    word-break: break-word;
}
.text.light-blue{
font-size: 1rem!important;
}

.sections .section .item .text.light-blue-bigtext{
background: #BFC2E6!important;
    color: #2E318F!important;
}
/*******************************************************************/
/* ftrtch dino */
/* [type: CSS] [file:ilearn-grid-grid-title-subtitle-guid] [127.1723] DESIGN*/
/*******************************************************************/
/* 0.2 D>D */
/* db 158 */