@import "../../../assets/sass/config";
@import "../../../assets/sass/box";

.color-lump-container{
  width: 18%;
  box-sizing: border-box;
  padding: 0 $space-xs;

  &:first-child{
    padding: 0 $space-xs 0 0;
  }


  .color-lump-main{
    @include box();
    @include flex-column();
    @include flex-justify-center();
    width: 100%;
    height: 74px;
    padding: 0 $space-default 0 $space-default;
    box-sizing: border-box;
    font-size: $font-default;
    color: $color-white;
    border-radius: 4px;

    &.color-lump-main-border{
      border-radius: 4px 4px 0 0;
    }

    .color-lump-main-color{
      opacity: .7;
      line-height: 24px;
    }
  }

  .color-lump-secondary{
    @include box();
    .color-lump-secondary-box{
      @include box();
      @include flex();
      height: 40px;

      &:first-child{
        border-radius: 0 0 0 4px;
      }
      &:last-child{
        border-radius: 0 0 4px 0;
      }
    }
  }
}