@sizeXXS: ~"only screen and (max-width: 384px)";
@sizeXS: ~"only screen and (max-width: 575.9px)";
@sizeSM: ~"only screen and (min-width: 576px) and (max-width: 767.9px)";
@sizeMD: ~"only screen and (min-width: 768px) and (max-width: 991.9px)";
@sizeLG: ~"only screen and (min-width: 992px) and (max-width: 1199.9px)";
@sizeXL: ~"only screen and (min-width: 1200px) and (max-width: 1400px)";
@sizeXXL: ~"only screen and (min-width: 1400px)";

@sizeMobile: ~"only screen and (max-width: 1199.9px)";
@sizeDesktop: ~"only screen and (min-width: 1200px)";
@boxShadowDefault: 3px 3px 6px fade(black,8%);

@brand-primary: #00b881;
@brand-secondary: #25403c;
@gray-base: #000;
@text-color: @brand-secondary;

@gray-lightest: lighten(@gray-base, 96%); // #f5f5f5
@grid-gutter-width: 40px;

.transition(@property: all) {
    transition: @property 0.15s linear;
}


.newscardlist {

    .item-link {
        background-color: white;
        display: block;
        height: 100%;
        position: relative;
        color: @text-color;
        box-shadow: @boxShadowDefault;

        .row {
            height: 100%;
            flex-direction: column;
            flex-wrap: nowrap;
        }

        .item-thumbnail {
            flex: 0 0 auto;
        }

        .item-content {
            flex: 0 1 100%;
            padding-bottom: @grid-gutter-width * 1.5;
        }

        .item-texts {
            padding: calc(~"@{grid-gutter-width} / 2");
        }

        .img-container {
            position: relative;
            overflow: hidden;
            background-color: fade(@brand-primary,20%);
            .transition;

            &:after {
                content: "";
                display: block;
                padding-top: 65%;
            }

            &:before {
                content: "";
                height: 60%;
                width: 60%;
                background-image: url(/custom/images/placeholder.svg);
                background-size: contain;
                background-repeat: no-repeat;
                background-position: center;
                display: block;
                position: absolute;
                opacity: 0.5;
                top: 50%;
                left: 50%;
                .transition;
                transform: translate(-50%,-50%);
            }

            img {
                position: absolute;
                top: 0;
                left: 0;
                height: 100%;
                width: 100%;
                object-fit: cover;
                object-position: center;
                .transition;
            }
        }

        .item-more {
            display: inline-block;
            position: absolute;
            bottom: @grid-gutter-width/2;
            right: @grid-gutter-width;
            .transition;

            .icon {

            }
        }

        &:hover, &:active, &:focus {
            .img-container {
                img {
                    transform: scale(1.05);
                }

                &:before {
                    transform: translate(-50%,-50%) scale(1.1);
                }
            }
        }
    }
    .homenews-list-1{
        .item-link .row{
            flex-direction:row;
            flex-wrap:wrap;
        }
    }
}