.woocommerce,
.woocommerce-page
{
    .mobile-columns-1
    {
        ul.products
        {
            li.product
            {
                @media only screen and (max-width: 768px) {
                    width: 100%;
                }
            }
        }
    }

    ul.product-categories
    {
        margin-bottom: 0;
    }

    ul.product-categories + ul.products
    {
        margin-top: calc( 35px - 1.3% );
    }

    ul.products
    {
        .woocommerce-loop-product__link
        {
            &:hover
            {
                opacity: 1;
            }
        }

        li.product
        {
            margin: 0 25px 25px 0;

            &.last
            {
                margin-right: 0;
            }
        }

        @media only screen and (min-width: 769px) {

            &.columns-1
            {
                li.product
                {
                    width: 100%;
                }
            }

            &.columns-2
            {
                li.product
                {
                    width: calc( ( 100% - 25px ) / 2 );
                }
            }

            &.columns-3
            {
                li.product
                {
                    width: calc( ( 100% - 50px ) / 3 );
                }
            }

            &.columns-4
            {
                li.product
                {
                    width: calc( ( 100% - 75px ) / 4 );
                }
            }

            &.columns-5
            {
                li.product
                {
                    width: calc( ( 100% - 100px ) / 5 );

                    @media only screen and (max-width: 1024px) {
                        width: calc( ( 100% - 75px ) / 4 );
                        &.last
                        {
                            clear: none;
                            margin-right: 25px;
                        }
                        &:nth-child(4n+4)
                        {
                            margin-right: 0;
                        }
                        &:nth-child(4n+5)
                        {
                            clear: both !important;
                        }
                        &.first
                        {
                            clear: none;
                        }
                    }
                }
            }

            &.columns-6
            {
                li.product
                {
                    width: calc( ( 100% - 125px ) / 6 );

                    @media only screen and (max-width: 1024px) {
                        width: calc( ( 100% - 75px ) / 4 );
                        &.last
                        {
                            clear: none;
                            margin-right: 25px;
                        }
                        &:nth-child(4n+4)
                        {
                            margin-right: 0;
                        }
                        &:nth-child(4n+5)
                        {
                            clear: both !important;
                        }
                        &.first
                        {
                            clear: none;
                        }
                    }
                }
            }
        }
    }
}
