@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)";

@brand-primary: #00b881;
@brand-secondary: #25403c;
@font-size-small: 1.4rem;


@grid-gutter-width: 40px;

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


/*========================================*/
/*============== ENTRYLIST ===============*/
/*=========== Global : section ===========*/
/*========================================*/
.page_content_section_i {
    .category-stage {
        position: relative;
        background: @brand-secondary;
        min-height: 400px;
        display: flex;
        align-items: center;

        .category-image-container {
            position: absolute;
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            opacity: 0.5;

            .categorythumbnail {
                height: 100%;
                width: 100%;
                object-fit: cover;
                object-position: center;
            }
        }
    }

    .entries-list {
        .row {
            align-items: center;
        }


        .entry-image-wrapper {
            @media @sizeXS, @sizeSM, @sizeMD {
                margin-bottom: @grid-gutter-width;
            }

            .img-container {
                position: relative;

                @media @sizeXS, @sizeSM {
                    margin-bottom: @grid-gutter-width / 2;
                }
            }

            img {
                width: 100%;

                @media @sizeMD {
                    height: 100%;
                    object-fit: cover;
                    object-position: center;
                    height: 200px;
                }
            }

            .entryvideolightboxlink {
                position: absolute;
                height: 100%;
                width: 100%;
                top: 0;
                left: 0;
                background-color: fade(@brand-secondary,20%);
                display: flex;
                justify-content: center;
                align-items: center;
                cursor: pointer;

                span {
                    position: relative;
                    color: white;
                    text-transform: uppercase;
                    font-size: @font-size-small;
                    text-align: center;
                    .transition;

                    &:before {
                        //.fontAwesome("\f144");
                        display: block;
                        //font-size: @font-size-h1;
                        font-weight: 100;
                    }
                }

                &:hover {
                    background-color: fade(@brand-secondary,30%);

                    span {
                        transform: scale(1.05);
                    }
                }
            }
        }

        .entries-item {
            .entry-row {
                align-items: center;
                margin-bottom: @grid-gutter-width;
            }

            .entry-rawtext {
                margin-bottom: @grid-gutter-width /2;
            }

            &.no-image {
                .container-fluid {
                    max-width: 1200px;
                    margin: 0 auto;
                }

                .entry-image-wrapper {
                    display: none;
                }

                .entry-text-wrapper {
                    flex: 0 0 100%;
                    max-width: 100%;
                }
            }

            &:nth-of-type(even) {

                @media @sizeMD, @sizeLG, @sizeDesktop {
                    .row {
                        flex-direction: row-reverse;
                    }
                }
            }
        }
    }
}