@prefix: deye-carousel;

.@{prefix} {
  &- {
    &root{
      position: relative;

    }

    &info {
      position: relative;
      background-size: cover;
      background-position: center;
    }

    &title {
      width: 100%;
      color: #FFFFFF;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      font-size: 24px;
    }

    &center {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
    }

    &prev {
      position: absolute;
      top: 50%;
      color: #f2f2f2;
      font-size: 24px;
      left: 8px;
      margin-top: -12px;
      cursor: pointer;
    }

    &next {
      position: absolute;
      top: 50%;
      color: #f2f2f2;
      font-size: 24px;
      right: 8px;
      margin-top: -12px;
      cursor: pointer;
    }

  }
}