@inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>



@{
    var TotalNumberOfItems = 0;

    var i = 0;

    //foreach (var product in Model.Item.GetItems("Products_1"))
    //{
    //    i++;
    //}

    //TotalNumberOfItems = i;
    //if (TotalNumberOfItems > 4) { TotalNumberOfItems = 4;}
    if (TotalNumberOfItems < 4)
    {
        if (Model.Item.GetItem("Blogs_1") != null)
        {
            var item = Model.Item.GetItem("Blogs_1");
            if (item.GetString("Title") != "") { TotalNumberOfItems++; }
        }
    }

    if (TotalNumberOfItems < 4)
    {
        if (Model.Item.GetItem("Blogs_2") != null)
        {
            var item = Model.Item.GetItem("Blogs_2");
            if (item.GetString("Title") != "") { TotalNumberOfItems++; }
        }
    }

    if (TotalNumberOfItems < 4)
    {
        if (Model.Item.GetItem("Blogs_3") != null)
        {
            var item = Model.Item.GetItem("Blogs_3");
            if (item.GetString("Title") != "") { TotalNumberOfItems++; }
        }
    }

    if (TotalNumberOfItems < 4)
    {
        if (Model.Item.GetItem("Blogs_4") != null)
        {
            var item = Model.Item.GetItem("Blogs_4");
            if (item.GetString("Title") != "") { TotalNumberOfItems++; }
        }
    }
    var columnsStyle = "";
    if (TotalNumberOfItems == 3) { columnsStyle = "4"; } else { columnsStyle = "3"; }

}
    @* Escape the container and section *@
    @* Divs count is equal divs in Page.cshtml *@
    </div></div></div>
    </section>
    @* ----------------------------------- *@

    <section class="multiple-paragraphs-container dw-mod">
        <div class=" dw-mod" id="">
            <div class="">
                <div class="grid">
                    
                   @foreach(var peoduct in @Model.Item.GetItem("Products_1").GetItems("Product"))
                   {
                       <br />
                   }


                    <div class="grid__col-lg-@columnsStyle grid__col-md-@columnsStyle grid__col-sm-6 grid__col-xs-12">

                        @{ var currentLink = "#";}

                        @if (Model.Item.GetItem("Blogs_1").GetString("Link") != "")
                        {
                            currentLink = Model.Item.GetItem("Blogs_1").GetString("Link");
                        }
                        <a href="@currentLink">
                            @if (Model.Item.GetItem("Blogs_1").GetString("Image") != "")
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=@Model.Item.GetItem("Blogs_1").GetString("Image")" alt="@Model.Item.GetItem("Blogs_1").GetString("Image")" />
                            }
                            else
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=/Files/Images/missing_image.jpg" alt="Missing image" />
                            }
                            <h4 class="u-no-margin" style="height:64px; padding-top:25px; font-weight:normal;">@Model.Item.GetItem("Blogs_1").GetString("Title")</h4>
                            <h6 class="u-no-margin" style="height:64px; border-bottom: 1px solid lightgray; font-weight:normal;">@Model.Item.GetItem("Blogs_1").GetString("Text")</h6>

                        </a>



                    </div>
                    <div class="grid__col-lg-@columnsStyle grid__col-md-@columnsStyle grid__col-sm-6 grid__col-xs-12">


                        @if (Model.Item.GetItem("Blogs_2").GetString("Link") != "")
                        {
                            currentLink = Model.Item.GetItem("Blogs_2").GetString("Link");
                        }
                        <a href="@currentLink">
                            @if (Model.Item.GetItem("Blogs_2").GetString("Image") != "")
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=@Model.Item.GetItem("Blogs_2").GetString("Image")" alt="@Model.Item.GetItem("Blogs_2").GetString("Image")" />
                            }
                            else
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=/Files/Images/missing_image.jpg" alt="Missing image" />
                            }
                            <h4 class="u-no-margin" style="height:64px; padding-top:25px; font-weight:normal;">@Model.Item.GetItem("Blogs_2").GetString("Title")</h4>
                            <h6 class="u-no-margin" style="height:64px; border-bottom: 1px solid lightgray; font-weight:normal;">@Model.Item.GetItem("Blogs_2").GetString("Text")</h6>

                        </a>
                    </div>
                    <div class="grid__col-lg-@columnsStyle grid__col-md-@columnsStyle grid__col-sm-6 grid__col-xs-12">


                        @if (Model.Item.GetItem("Blogs_3").GetString("Link") != "")
                        {
                            currentLink = Model.Item.GetItem("Blogs_3").GetString("Link");
                        }
                        <a href="@currentLink">
                            @if (Model.Item.GetItem("Blogs_3").GetString("Image") != "")
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=@Model.Item.GetItem("Blogs_3").GetString("Image")" alt="@Model.Item.GetItem("Blogs_3").GetString("Image")" />
                            }
                            else
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=/Files/Images/missing_image.jpg" alt="Missing image" />
                            }
                            <h4 class="u-no-margin" style="height:64px; padding-top:25px; font-weight:normal;">@Model.Item.GetItem("Blogs_3").GetString("Title")</h4>
                            <h6 class="u-no-margin" style="height:64px; border-bottom: 1px solid lightgray; font-weight:normal;">@Model.Item.GetItem("Blogs_3").GetString("Text")</h6>

                        </a>
                    </div>

                    if (Model.Item.GetItem("Blogs_4").GetString("Title") != "") {

                    <div class="grid__col-lg-@columnsStyle grid__col-md-@columnsStyle grid__col-sm-6 grid__col-xs-12">


                        @if (Model.Item.GetItem("Blogs_4").GetString("Link") != "")
                        {
                            currentLink = Model.Item.GetItem("Blogs_4").GetString("Link");
                        }
                        <a href="@currentLink">
                            @if (Model.Item.GetItem("Blogs_4").GetString("Image") != "")
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=@Model.Item.GetItem("Blogs_4").GetString("Image")" alt="@Model.Item.GetItem("Blogs_4").GetString("Image")" />
                            }
                            else
                            {
                                <img class="grid__cell-img grid__cell-img--centered b-lazy" style="max-height:400px;" src="/Files/Images/placeholder.gif" data-src="/Admin/Public/GetImage.ashx?width=300&amp;height=180&amp;crop=5&amp;FillCanvas=True&amp;Compression=75&amp;DoNotUpscale=true&amp;FillCanvas=true&amp;image=/Files/Images/missing_image.jpg" alt="Missing image" />
                            }
                            <h4 class="u-no-margin" style="height:64px; padding-top:25px; font-weight:normal;">@Model.Item.GetItem("Blogs_4").GetString("Title")</h4>
                            <h6 class="u-no-margin" style="height:64px; border-bottom: 1px solid lightgray; font-weight:normal;">@Model.Item.GetItem("Blogs_4").GetString("Text")</h6>

                        </a>
                    </div>
                    }


                </div>
        </div>
    </section>

    @* Re-enter the container and section *@
    @* Divs count is equal divs in Page.cshtml *@
    <section class="content-container center-container dw-mod">
        <div class="grid">
            <div class="grid__col-auto grid__col--bleed">
                <div class="grid">
                    @* ----------------------------------- *@