.cas-gallery-preloaded
  display: none
.cas-image-gallery,
  display: table
  +screen(not-mobile)
    background: #efefef
  border-radius: 3px
  width: 100%
  & > .container
    +screen(not-mobile)
      margin: 15px

  .upload-input
    padding: 10px 0
  .edit-buttons
    padding-bottom: 10px

  .images
    width: 100%
    display: table

  .image-container
    position: relative
    display: table
    float: left
    +screen(mobile)
      width: 50% !important
    +screen(not-mobile)
      width: 33.3%
    +screen(desktop)
      width: 25%
    +screen(desktop-hd)
      width: 20%
    background-image: asset-url("cas/loading.gif")
    background-repeat: no-repeat
    background-position: center
    background-size: 20px
    & > .image-margin
      margin: 2px 1px
    .unselected-but-selectable
      .check
        background-color: rgba(255, 255, 255, 0.05)
        border: 1px solid rgba(255, 255, 255, 0.3)
    .selection
      display: none
      width: 100%
      height: 100%
      position: absolute
      top: 0
      bottom: 0
      .check
        background-image: asset-url("cas/check.svg")
        background-color: #11ce70
    &[data-is-cover=true]
      .cover-indication
        display: block
    .cover-indication
      display: none
    .cover-indication
      display: none
      width: 100%
      height: 100%
      position: absolute
      top: 0
      bottom: 0
      .cover-symbol
        background-image: asset-url("cas/white-star.svg")
        background-color: #1da7ee
        width: 20px
        height: 20px
        position: absolute
        bottom: 15px
        left: 15px
        background-repeat: no-repeat
        background-position: center
        background-size: 24px
        border-radius: 50px
        border: 1px solid white
        z-index: 10
    .overlay
      width: 100%
      height: 100%
      background-color: rgba(255, 255, 255, 0.5)
      position: absolute
      z-index: 9
    .check
      width: 20px
      height: 20px
      position: absolute
      bottom: 15px
      right: 15px
      background-repeat: no-repeat
      background-position: center
      background-size: 20px
      border-radius: 50px
      border: 1px solid white
      z-index: 10
  .image
    position: relative
    width: 100%
    padding-bottom: 75%
    display: table
    float: left
    margin: 0px
    background-size: cover
    background-position: center

    .image-options
      width: 100%
      height: 100%
      display: none

      .buttons
        z-index: 10
        display: table
        position: absolute
        bottom: 0px
        margin-left: 50%
        width: 140px
        left: -70px
        .btn
          text-align: center
          width: 140px
          display: table
          padding: 6px 0px
          border-radius: 3px
          background: rgba(255, 255, 255, 0.8)
          margin-bottom: 10px