HEX
Server: Microsoft-IIS/10.0
System: Windows NT ITPWINWEBSVR22 10.0 build 20348 (Windows Server 2022) AMD64
User: www.conferencesearch.co.uk (0)
PHP: 8.3.30
Disabled: NONE
Upload Files
File: D:/web/groundscrewcentre/inc-template-home.asp
<%
' (SS,14/8/14) Bootstrap version
' (SS,28/11/14) added call to sub CustomShowHolidayNotice
' (SS,2/3/15) improvement news section, to only show up to a certain a point to avoid getting too long. Added a link to More News.
' (SS,14/8/17) modified to add lazy loading feature see https://stackoverflow.com/questions/27675968/lazy-load-not-work-in-bootstrap-carousel
' src changed to data-lazy-load-src (except first image) and javascript added to get the image later
' see https://stackoverflow.com/questions/27675968/lazy-load-not-work-in-bootstrap-carousel

' (SS,21/11/17) carousel improvements, including breaking down to separate ShowHomeCarouselItem routine
' These changes were original made on 5/5/16 to CIRC, now applied here

' (SS,13/09/19) New for Ground Screws using Bootstrap 4
' (SS,12/5/20) replaced some text with GetWebText("Home") in Sub ShowHomePageText
' (SS,09/03/22) added Spring 2022 banner image, expires on 31/03/2022
' (SS,01/04/22) replaced banner with new Trial Kit one
' (SS,14/11/22) changed to Black Friday banner
' (SS,01/12/22) reverted back to Trial Kit banner
' (SS,02/12/22) new December Pro Install banner
' (SS,03/01/23) reverted back to Trial Kit banner
' (SS,18/07/23) Change to Sub ShowTopGridBannerImage to show a different image
' (SS,19/07/23) Change to Sub ShowTopGridBannerImage to add image map for two different links, later changed to split image into two
' (SS,18/08/23) Change to Sub ShowTopGridBannerImage to add a top summer sale image, shown until end of August
' (SS,31/08/23) Change to Sub ShowTopGridBannerImage to add a add new top banner for summer sale until 23rd Sep 2023
' (SS,16/11/23) Change to Sub ShowTopGridBannerImage to show Black Friday Sale 2023 banner for 76/11/23 to 31/11/23

Sub ShowPage_home
%>
  <div class="row">


<%CustomShowHolidayNotice "H", 0%>

<%

    ' ShowHomePageText   

    ShowTopGrid
    
    ShowAppGrid

    ShowVideo    

%>
             

  </div> <!-- row -->

<%
End Sub


' HOME PAGE
' (SS,12/5/20) replaced some text with GetWebText("Home")
' (SS,16/11/20) change the background and moved to the top
' "background-color:#84A743"
' hsl(81, 43%, 46%)
Sub ShowHomePageTextOld
%>
<div class="jumbotron jumbotron-fluid text-center mx-auto pt-3 pb-1 mb-0" style="background-color:hsl(81, 43%, 60%)">
  <div class="container">
    <h1>Why Use The Ground Screw Centre</h1>
    <div class="text-left">
    <%=GetWebText("Home")%>
    </div>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV0
%>
<div class="jumbotron jumbotron-fluid text-center mx-auto pt-3 pb-1 mb-0" style="background-color:hsl(81, 43%, 60%)">
  <div class="container">
    <h1>Why Use The Ground Screw Centre</h1>
    <div class="text-left">
    <%=GetWebText("Home")%>
    </div>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV1
%>
<div class="" style="background-color:#92B74D">
  <div class="container22">
    <div class="text-left">
      <img class="img-fluid" src="images/slides/ground-screws-usps-4.png" alt="UK's leading supplier of self install ground screws">   
    </div>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV2
%>
<div class="text-center mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(0, 0%, 33%)">Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 35%)">1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(0, 0%, 33%)">Unrivaled Technical Knowledge<br>10 Years Experience</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 35%)">Professional Install Available<br>(Includes Timber Base)</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV3
%>
<div class="text-center mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 25%)">Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 40%)">1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 25%)">Unrivaled Technical Knowledge<br>10 Years Experience</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 40%)">Professional Install Available<br>(Includes Timber Base)</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV4
%>
<div class="text-center mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner" style="background-color:hsl(81, 43%, 25%)">Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 40%)">1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 25%)">Unrivaled Technical Knowledge<br>10 Years Experience</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 40%)">Professional Install Available<br>(Includes Timber Base)</h1>
  </div>
</div>
<%
End Sub

' far fa-check-square
Sub ShowHomePageTextV5
%>
<div class="text-center mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner" style="text-transform: uppercases; background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="text-transform: uppercases; background-color:hsl(81, 43%, 40%)"><i class="fas fa-certificate"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="text-transform: uppercases; background-color:hsl(81, 43%, 25%)"><i class="far fa-check-circle"></i>&nbsp; Unrivaled Technical Knowledge<br>10 Years Experience</h1>
    <h1 class="banner" style="text-transform: uppercases; background-color:hsl(81, 43%, 40%)"><i class="fas fa-thumbs-up"></i>&nbsp; Professional Install Available<br>(Includes Timber Base)</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV6
%>
<div class="text-center mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner" style="background-color:hsl(81, 43%, 25%)">Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 40%)">1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 25%)">Unrivaled Technical Knowledge</h1>
    <h1 class="banner" style="background-color:hsl(81, 43%, 40%)">Professional Install Available</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV7
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Unrivaled Technical Knowledge</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; Professional Install Available</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV8
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-circle"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-circle"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-circle"></i>&nbsp; Unrivaled Technical Knowledge</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-circle"></i>&nbsp; Professional Install Available</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV9
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="fas fa-certificate"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="fas fa-certificate"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="fas fa-certificate"></i>&nbsp; Unrivaled Technical Knowledge</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="fas fa-certificate"></i>&nbsp; Professional Install Available</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV10
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="fas fa-thumbs-up"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="fas fa-thumbs-up"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="fas fa-thumbs-up"></i>&nbsp; Unrivaled Technical Knowledge</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="fas fa-thumbs-up"></i>&nbsp; Professional Install Available</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV11
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-thumbs-up"></i>&nbsp; Over 15,000 Ground Screws Sold in 2020</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-thumbs-up"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-thumbs-up"></i>&nbsp; Unrivaled Technical Knowledge</h1>
    <h1 class="banner banner-left" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-thumbs-up"></i>&nbsp; Professional Install Available</h1>
  </div>
</div>
<%
End Sub

' (SS,24/11/20) as requested
Sub ShowHomePageTextV12
%>
<div class="text-left mx-auto" style="background-color:hsl(81, 43%, 60%)">
  <div class="text-center mx-auto">
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; 1000's of Ground Screws Sold in 2020</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; 1000+ Customers in the UK &amp; Europe</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Unrivalled Technical Knowledge<br>10 Years Experience</h1>
    <h1 class="banner" style="text-transform: uppercase; background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; Professional Install Available<br>Includes Timber Base</h1>
  </div>
</div>
<%
End Sub

Sub ShowHomePageTextV13
%>
<div class="" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; 1000s of Ground Screws Sold in 2020</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; 1000s of Customers in the UK &amp; Europe</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Unrivalled Technical Knowledge - 10 Years Experience</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; Professional Install Available - Includes Timber Base</h1>
  </div>
</div>
<%
End Sub

' (SS,29/1/21) same as V13 but background alternated due to position change
Sub ShowHomePageTextV14
%>
<div class="" style="background-color:hsl(81, 43%, 60%)">
  <div class="">
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; 1000s of Ground Screws Sold in 2020</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; 1000s of Customers in the UK &amp; Europe</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 40%)"><i class="far fa-check-square"></i>&nbsp; Unrivalled Technical Knowledge - 10 Years Experience</h1>
    <h1 class="banner2 banner-left2" style="background-color:hsl(81, 43%, 25%)"><i class="far fa-check-square"></i>&nbsp; Professional Install Available - Includes Timber Base</h1>
  </div>
</div>
<%
End Sub


Sub ShowVideo
' (SS,24/11/20) replaced video N8lolQpVThM with dqDofKUenb4
%>

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/dqDofKUenb4?rel=0" allowfullscreen></iframe>
</div>

<%
End Sub

Sub ShowTopGrid
  ShowTopGridHeader
  
  ' ShowTopGridBenefits
  
  'Dim LVersion
  'LVersion = Request.QueryString("v")
  'If LVersion = "" Then  
  '  ShowHomePageTextV14  ' (SS,16/11/20) moved here 
  'ElseIf LVersion = "0" Then
  '  ShowHomePageTextV0
  'ElseIf LVersion = "1" Then
  '  ShowHomePageTextV1    
  'ElseIf LVersion = "2" Then
  '  ShowHomePageTextV2    
  'ElseIf LVersion = "2" Then
  '  ShowHomePageTextV2
  'ElseIf LVersion = "3" Then
  '  ShowHomePageTextV3 
  'ElseIf LVersion = "4" Then
  '  ShowHomePageTextV4
  'ElseIf LVersion = "5" Then
  '  ShowHomePageTextV5
  'ElseIf LVersion = "6" Then
  '  ShowHomePageTextV6
  'ElseIf LVersion = "7" Then
  '  ShowHomePageTextV7
  'ElseIf LVersion = "8" Then
  '  ShowHomePageTextV8
  'ElseIf LVersion = "9" Then
  '  ShowHomePageTextV9    
  'ElseIf LVersion = "10" Then
  '  ShowHomePageTextV10   
  'ElseIf LVersion = "11" Then
  '  ShowHomePageTextV11
  'ElseIf LVersion = "12" Then
  '  ShowHomePageTextV12
  'ElseIf LVersion = "13" Then
  '  ShowHomePageTextV13
  'ElseIf LVersion = "15" Then
  '  ShowHomePageTextV14        
  'End If 
  
  ' (SS,1/11/21) replaced above with following
  'ShowHomePageTextV14
  ' (SS,1/11/21) replaced above with following Children In Need banner image
  ' (SS,10/1/22) new January sale banner replaces Children In Need banner
  ' (SS,31/1/22) added If with date range to only show before 1/2/22
  
  ' If Date() >= CDate("10/01/2022") And Date() <= CDate("31/01/2022") Then
  ' (SS,14/2/22) replaced above with following or Feb 22
  ' If Date() >= CDate("14/02/2022") And Date() < CDate("01/03/2022") Then
  ' If Date() >= CDate("09/03/2022") And Date() <= CDate("31/03/2022") Then
  ' (SS,1/4/22) removed the above if, no limit for new trial kit banner
    ShowTopGridBannerImage
  ' End If
  
  ' (SS,29/1/21) moved from above to here
  ShowTopGridBenefits
  
  ShowTopGridBigImage
  
 ' ShowTopGridSmallImages
  
  'ShowTopGridBenefitsBlack
  
  ShowTopGridFooter
End Sub

Sub ShowTopGridHeader
%>     
    <div class="container-fluid usp-container px-0">    
<%
End Sub

Sub ShowTopGridFooter
%>     
    </div>  
<%
End Sub

Sub ShowTopGridBannerImageOld
%>   
      <div class="row">  
        <div class="col">
          <a href="products.asp?code=CASESTUDY004&name=diy-sos-children-in-need-st-michael-youth-project">
            <img class="img-fluid" src="images/banner/children-in-need.png" alt="Supporting Children in Need">         
          </a>
        </div>
      </div>
<%  
End Sub

Sub ShowTopGridBannerImageOld2
%>   
      <div class="row">  
        <div class="col">
          <img class="img-fluid" src="images/banner/commercial-range.png" alt="Commercial Range" usemap="#image-map">

<map name="image-map">
    <area target="" alt="Commercial Range" title="Commercial Range" href="products.asp?cat=Ground+Screws" coords="0,0,642,345" shape="rect">
    <area target="" alt="Trial Kit" title="Trial Kit" href="products.asp?code=TRIALKIT&amp;name=ground-screw-trial-installation-kit" coords="637,0,1279,345" shape="rect">
</map>          
        </div>
      </div>     
<%  
End Sub


' (SS,10/1/22) replaced above with following
' (SS,14/2/22) changed sale-jan-2022.png to sale-feb-2022.png and updated alt to February Sale
' (SS,09/3/22) changed sale-feb-2022.png to sale-spring-2022.png and updated alt to Spring Sale
' (SS,01/4/22) changed sale-spring-2022.png to trial-kit.png, and added link to the trial kit product page
' (SS,01/12/22) renamed back from ShowTopGridBannerImageTrialKit to ShowTopGridBannerImage to go back to this from ShowTopGridBannerImageBlackFriday below
' (SS,03/12/22) renamed back to ShowTopGridBannerImage due to new December Pro Install banner 
' (SS,03/01/23) renamed back from ShowTopGridBannerImageTrialKit to ShowTopGridBannerImage to go back to this from ShowTopGridBannerImageBlackFriday below
' (SS,18/07/23) changed from trial-kit.png to commercial-range.png, alt="Trial Kit" to "Commercial Range"
' (SS,19/07/23) added image map for different link in each half of image (used http://www.image-map.net/ to create the map)
' (SS,19/07/23) image map links don't work correctly for responsive i.e. mobile devices when image is resized smaller, fixed by using two image (split in half)
Sub ShowTopGridBannerImagePrev
%>   
      <div class="row">  
        <div class="col" style="padding-right:0px">
          <a href="products.asp?cat=Ground+Screws">
            <img class="img-fluid" src="images/banner/commercial-range-left.png" alt="Commercial Range">          
          </a>
        </div>
        <div class="col" style="padding-left:0px">
          <a href="products.asp?code=TRIALKIT&amp;name=ground-screw-trial-installation-kit">
            <img class="img-fluid" src="images/banner/trial-kit-right.png" alt="Trial Kit">          
          </a>
        </div>        
      </div>     
<%  
End Sub

' (SS,10/1/22) replaced above with following
' (SS,14/2/22) changed sale-jan-2022.png to sale-feb-2022.png and updated alt to February Sale
' (SS,09/3/22) changed sale-feb-2022.png to sale-spring-2022.png and updated alt to Spring Sale
' (SS,01/4/22) changed sale-spring-2022.png to trial-kit.png, and added link to the trial kit product page
' (SS,01/12/22) renamed back from ShowTopGridBannerImageTrialKit to ShowTopGridBannerImage to go back to this from ShowTopGridBannerImageBlackFriday below
' (SS,03/12/22) renamed back to ShowTopGridBannerImage due to new December Pro Install banner 
' (SS,03/01/23) renamed back from ShowTopGridBannerImageTrialKit to ShowTopGridBannerImage to go back to this from ShowTopGridBannerImageBlackFriday below
' (SS,18/07/23) changed from trial-kit.png to commercial-range.png, alt="Trial Kit" to "Commercial Range"
' (SS,19/07/23) added image map for different link in each half of image (used http://www.image-map.net/ to create the map)
' (SS,19/07/23) image map links don't work correctly for responsive i.e. mobile devices when image is resized smaller, fixed by using two image (split in half)
' (SS,18/08/23) Change to Sub ShowTopGridBannerImage to add a top summer sale image (previous version above), shown until end of August
' (SS,31/08/23) Added new top banner for summer sale until 23rd Sep 2023
' (SS,16/11/23) Added Black Friday Sale 2023 banner from 17/11/2023 to 30/11/2023
Sub ShowTopGridBannerImage
%>
<%If Date() >= CDate("18/08/2023") And Date() <= CDate("31/08/2023") Then%>
      <div class="row">
        <div class="col" style="padding-right:0px">
          <img class="img-fluid" src="images/banner/summer-sale-top.png" width="1280" height="124" alt="Summer Sale">          
        </div>
      </div>
<%End If%>
<%If Date() >= CDate("01/09/2023") And Date() <= CDate("23/09/2023") Then%>
      <div class="row">
        <div class="col" style="padding-right:0px">
          <img class="img-fluid" src="images/banner/summer-sale-top-ends-23rd-Sep-2023.png" width="1280" height="124" alt="Summer Sale">          
        </div>
      </div>
<%End If%>
<%If Date() >= CDate("17/11/2023") And Date() <= CDate("30/11/2023") Then%>
      <div class="row">
        <div class="col">
          <img class="img-fluid" src="images/banner/black-friday-sale-2023.png" width="1140" height="178" alt="Black Friday Sale">
        </div>
      </div>
<%End If%>
      <div class="row">
        <div class="col" style="padding-right:0px">
          <a href="products.asp?cat=Ground+Screws">
            <img class="img-fluid" src="images/banner/commercial-range-left.png" width="640" height="350" alt="Commercial Range">          
          </a>
        </div>
        <div class="col" style="padding-left:0px">
          <a href="products.asp?code=TRIALKIT&amp;name=ground-screw-trial-installation-kit">
            <img class="img-fluid" src="images/banner/trial-kit-right.png" width="640" height="350" alt="Trial Kit">          
          </a>
        </div>        
      </div>
<%  
End Sub

' (SS,10/1/22) replaced above with following
' (SS,14/2/22) changed sale-jan-2022.png to sale-feb-2022.png and updated alt to February Sale
' (SS,09/3/22) changed sale-feb-2022.png to sale-spring-2022.png and updated alt to Spring Sale
' (SS,01/4/22) changed sale-spring-2022.png to trial-kit.png, and added link to the trial kit product page
' (SS,14/11/22) changed trial-kit.png to black-friday-sale.png and remove link (see above ShowTopGridBannerImageTrialKit for previous version)
' (SS,01/12/22) renamed Sub to add BlackFriday at the end, i.e. disabled this and put the TrialKit one back on
Sub ShowTopGridBannerImageBlackFriday
%>   
      <div class="row">  
        <div class="col">
          <img class="img-fluid" src="images/banner/black-friday-sale.png" alt="Black Friday Sale">
        </div>
      </div>
<%  
End Sub

' (SS,02/12/22) new December Pro Install banner
' (SS,03/01/23) removed by renaming from ShowTopGridBannerImage to ShowTopGridBannerImageDecemberProInstallay below
Sub ShowTopGridBannerImageDecemberProInstall
%>   
      <div class="row">  
        <div class="col">
          <img class="img-fluid" src="images/banner/december-pro-install.png" alt="December Pro Install">
        </div>
      </div>
<%  
End Sub

Sub ShowTopGridBigImage
%>
      <div class="row d-block d-md-none no-gutters">
        <div class="col px-3 py-2" style="background-color:#92B74D">  
          <h1 class="mb-0" style="font-weight: bold; line-height: 1"><small class="font-weight-bold">UK's Leading Supplier of Ground&nbsp;Screws</small></h1>
        </div>
      </div>    
      <div class="row">  
        <div class="col">          
          <img class="img-fluid" src="images/slides/ground-screws-3.jpg" alt="UK's leading supplier of self install ground screws">         
          <div class="d-none d-md-block" style="position: absolute; bottom: 8px; left: 24px;">              
            <h1 style="display: block;
  margin-bottom: 5px;
  padding-top: 15px;
  font-weight: bold;
  color: white;
  text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -5px 35px rgba(255,255,255,0.3), 2px 2px 2px rgba(206,89,55,0);"
  >UK's Leading Supplier of Ground&nbsp;Screws</h1>
          </div>
          <!--
          <div class="bottom-left" style="position: absolute; top: 12px; left: 26px;">
            <a class="btn btn-lg btn-success btn-strong hidden-xs" href="products.asp?page=calculator" role="button">Ground Screw Calculator <i class="fa fa-calculator"></i></a>            
          </div>
          -->
        </div>
      </div>
<%
End Sub

Sub ShowTopGridSmallImages
%>
      <div class="row no-gutters">
        <div class="col">
          <img class="img-fluid" src="images/slides/slide1-a-cr.jpg" alt="">
        </div>
        <div class="col">
          <img class="img-fluid" src="images/slides/slide1-c-cr.jpg" alt="">
        </div>        
        <div class="col">
          <img class="img-fluid" src="images/slides/slide1-b-cr.jpg" alt="">
        </div>
        <div class="col">
          <img class="img-fluid" src="images/slides/slide1-d-cr.jpg" alt="">
        </div>
      </div>
<%
End Sub

' (SS,24/4/20) replaced Eco Friendly with No Skips and moved to second place, need to replace the image
' added &nbsp; to No Digging No Concrete for better breaks (to force break betweeb Digging and No)
' replaced environmentally-friendly.svg with no-skips.svg
' (SS,10/5/20) replaced Quick and Easy quick-and-easy.svg, with Environmentally Friendly and environmentally-friendly.svg
Sub ShowTopGridBenefits
%>
    <a href="products.asp?page=uses" class="text-decoration-none">
      <div class="row no-gutters">        
        <div class="col-6 col-md-3 text-center" style="background-color:#84A743">
          <img class="img-fluid" src="images/icons/no-digging.svg" alt="">
          <div class="top-grid-item-name">No&nbsp;Digging No&nbsp;Concrete</div>
        </div>
        <div class="col-6 col-md-3 text-center" style="background-color:#78983D">
          <img class="img-fluid" src="images/icons/no-skips-3.svg" alt="">
          <div class="top-grid-item-name">No Skips</div>
        </div>        
        <div class="col-6 col-md-3 text-center" style="background-color:#6B8837">
          <img class="img-fluid" src="images/icons/environmentally-friendly.svg" alt=""> 
          <div class="top-grid-item-name">Environmentally Friendly</div>
        </div>
        <div class="col-6 col-md-3 text-center" style="background-color:#607931">
          <img class="img-fluid" src="images/icons/saves-money.svg" alt="">
          <div class="top-grid-item-name">Saves Money</div>
        </div>
      </div>
    </a>
<%
End Sub

Sub ShowTopGridBenefitsBlack
%>
      <div class="row no-gutters">
        <div class="col-lg-3 col-md-3 col-sm-6 text-center" style="background-color:#99BC58">
          <img class="img-fluid" src="images/icons/no-digging-black.svg" alt="">
          <div class="top-grid-item-name-black">No Digging No concrete</div>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-6 text-center" style="background-color:#A3C168">
          <img class="img-fluid" src="images/icons/quick-and-easy-black.svg" alt="">
          <div class="top-grid-item-name-black">Quick and Easy</div>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-6 text-center" style="background-color:#ABC877">
          <img class="img-fluid" src="images/icons/saves-money-black.svg" alt="">
          <div class="top-grid-item-name-black">Saves Money</div>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-6 text-center" style="background-color:#B5CE86">
          <img class="img-fluid" src="images/icons/environmentally-friendly-black.svg" alt="">
          <div class="top-grid-item-name-black">Eco Friendly</div>
        </div>
      </div>
<%
End Sub


' --- START OF USP GRID TEMPLATES --- '

Sub ShowUSPGridHeader
%>
    <div class="container-fluid usp-container px-0">    
      <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
           <h2 class="usp-title">Benefits of Ground Screws</h2>
        </div>
      </div>
      <div class="row grid no-gutters">
<%
End Sub

Sub ShowUSPGridItem(AHeading, AImageName, AExtraText, ABackgroundNo)
%>
<!-- START OF USP GRID ITEM -->          
        <div class="col-lg-4 col-md-4 col-xs-12">
          <div class="usp-grid-item usp-grid-item-bg<%=ABackgroundNo%>">
            <img class="usp-grid-item-image img-fluid" src="images/usp/<%=AImageName%>" alt="<%=AHeading%>" /><br />           
            <div class="usp-grid-item-name"><%=AHeading%></div>
            <div class="usp-grid-item-extra-text"><%=AExtraText%></div>
          </div>
        </div>
<!-- END OF USP GRID ITEM -->
<%
End Sub

Sub ShowUSPGridFooter
%>
      </div>        
    </div>			
<%
End Sub

Sub ShowUSPGrid
  ShowUSPGridHeader
  
  ShowUSPGridItem "No Digging. No Concrete", "no-digging.png", "No digging foundations meaning No Concrete", 1
  ShowUSPGridItem "Quick &amp; Easy to set up", "quick-and-easy.png", "", 2
  ShowUSPGridItem "Saves Money", "saves-money.png", "compared to conventional foundation methods", 1
  ShowUSPGridItem "Fully Re-usable", "fully-re-usable.png", "", 2
  ShowUSPGridItem "No impact on environment", "no-impact.png", "No impact on environment and water courses during use of after removal", 1
  ShowUSPGridItem "No landfill waste", "no-landfill-waste.png", "", 2
  
  ShowUSPGridFooter
End Sub

' --- END OF USP GRID TEMPLATES --- '


' --- START OF APPLICATION GRID TEMPLATES --- '

Sub ShowAppGridHeader
%>
    <div class="container-fluid app-container px-0">
      <div class="row grid no-gutters">
<%
End Sub

' (SS,9/5/20) added class="text-decoration-none" to remove underline, only thing that worked
' help from https://stackoverflow.com/questions/11828829/twitter-bootstrap-how-to-get-rid-of-underlined-button-text-when-hovering-over-a
Sub ShowAppGridItemOld(AHeading, AImageName, APage)
%>
<!-- START OF APP GRID ITEM -->
      
        <div class="col-6 col-md-4">
          <a href="products.asp?page=<%=APage%>" class="text-decoration-none">
            <div class="app-grid-item">
              <img class="app-grid-item-image img-fluid" src="images/app4/<%=AImageName%>" alt="<%=AHeading%>" />          
              <div class="app-grid-item-name"><%=AHeading%></div>
            </div>
           </a>
        </div>
     
<!-- END OF APP GRID ITEM -->
<%
End Sub

' (SS,29/1/21) new version wihout hyperlinks, also had to remove the hover over light grey colour (.app-grid-item:hover)
Sub ShowAppGridItem(AHeading, AImageName, APage)
%>
<!-- START OF APP GRID ITEM -->
      
        <div class="col-6 col-md-4">
            <div class="app-grid-item">
              <img class="app-grid-item-image img-fluid" src="images/app4/<%=AImageName%>" alt="<%=AHeading%>" />          
              <div class="app-grid-item-name"><%=AHeading%></div>
            </div>
        </div>
     
<!-- END OF APP GRID ITEM -->
<%
End Sub

Sub ShowAppGridFooter
%>
      </div>        
    </div>			
<%
End Sub

Sub ShowAppGrid
  ShowAppGridHeader
  
  ShowAppGridItem "Large Garden Buildings", "large-garden-buildings.jpg", "LargeGardenBuildings"
  ShowAppGridItem "Summerhouses / Sheds", "summerhouses-sheds.jpg", "SummerhousesSheds"
  ShowAppGridItem "Decking / Landscaping", "decking.jpg", "DeckingLandscaping"
  ShowAppGridItem "Fencing", "fencing-2.jpg", "Fencing"
  ShowAppGridItem "Sports Facilities", "sports-facilities.jpg", "SportsFacilities"
  ShowAppGridItem "Miscellaneous", "miscellaneous.jpg", "Miscellaneous"
  
  ShowAppGridFooter
End Sub

' --- END OF APPLICATION GRID TEMPLATES --- '
%>