@import "../common/colors";
.core-image {
  position: relative;
  max-height: inherit;
  max-width: inherit;
  
  .core-image-progress
  {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  
  
  img {
    width: inherit;
    height: inherit;
    border-radius: 50%;
  }
  
  //Type
  &.core-image-type-rouded {
    border-radius: 50%;
  }
  //Size
  &.core-image-size-sm {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
  }
  &.core-image-size-md {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
  }
  &.core-image-size-lg {
    width: 128px;
    height: 128px;
    min-width: 128px;
    min-height: 128px;
  }
  &.core-image-size-xlg {
    width: 256px;
    height: 256px;
    min-width: 256px;
    min-height: 256px;
  }
  
  //State
  &.edit {
    .core-image-holder {
      width: inherit;
      height: inherit;
 
      /* background: rgba(255,87,34,0.5); */
      border-radius: 50%;
      position: absolute;
      top: 0;
      
      &:hover {
        background: rgba(255, 255, 255, 0.5);
        cursor: pointer;
      }
      
    }
  }
}