.o_website_sale_image_list .o_kanban_view.o_kanban_ungrouped.o_attachments_previews {
    width: auto;

    .o_kanban_record.o_attachment.o_website_sale_image_card {
        border: none;
        background: none;
        margin: 0 0 $grid-gutter-width*0.2;
        padding: $o-mail-attachment-margin;
        flex: 0 1 50%;

        @include media-breakpoint-up(md) {
            flex: 0 0 percentage(1/3);
        }

        @include media-breakpoint-up(lg) {
            flex: 0 0 percentage(1/5);
        }

        @include media-breakpoint-up(xl) {
            flex: 0 0 percentage(1/6);
        }

        .o_image_box {
            padding-top: 50%;

            @include media-breakpoint-up(md) {
                padding-top: 75%;
            }
        }

        .o_image_overlay {
            bottom: 16%;
            background: rgba(gray('900'), 0.2);
        }

        .o_website_sale_image_card_title {
            @include o-text-overflow(block);
            padding:6px;
            position: relative;
            background: gray('200');
            color:$headings-color;
        }

        .o_website_sale_image_card_remove, .o_website_sale_image_card_size {
            @include o-position-absolute(0, 0);
            border-radius: 0 2px;
        }

        .o_website_sale_image_card_size {
            left: 0;
            right: auto;
            border-radius: 0 0 2px;
            font-weight: normal;
            font-size: $font-size-sm - 1;

            &.label-normal {
                background-color: gray('200');
                color: $body-color;
            }
        }
    }
}

.o_website_sale_image_modal {
    .o_website_sale_image_modal_container {
        border-left: 1px solid gray('400');

        .o_field_image {
            margin-bottom: 0;
            box-shadow: 0 2px 10px gray('300');

            > img {
                border: 1px solid gray('400');
                min-height: 200px;
                max-height: 350px; // Fallback for browsers that dosn't support responsive units
                max-height: 50vh;
                width: auto;
            }

            .o_form_image_controls {
                @include o-hover-opacity(0.7, 1);
                padding: 2%;
            }
        }
    }
}
