Senior - Portfolio

<!doctype html> <html class="no-js" lang="en"> <head> <title>Senior - Portfolio</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" /> <link rel="shortcut icon" href="/assets/master/favicon.ico"> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"> <link rel="stylesheet" type="text/css" href="/css/dist/font-icons.min.css"> <link rel="stylesheet" type="text/css" href="/css/dist/umbraco-blockgridlayout.css" /> <link rel="stylesheet" type="text/css" href="/css/dist/site.min.css" /> <script type="text/javascript" src="/js/src/jquery.min.js"></script> <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script> <script defer src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.16.0/jquery.validate.min.js"></script> <script defer src="https://ajax.aspnetcdn.com/ajax/mvc/5.2.3/jquery.validate.unobtrusive.min.js"></script>  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-T9H9262');</script> <script> !function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments)}; if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0'; n.queue=[];t=b.createElement(e);t.async=!0; t.src=v;s=b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t,s)}(window, document,'script', 'https://connect.facebook.net/en_US/fbevents.js'); fbq('init', '1796947050870859'); fbq('track', 'PageView'); </script> <noscript><img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1796947050870859&ev=PageView&noscript=1" /></noscript> </head> <body data-mobile-nav-style="classic">  <header class="header header-"> <nav class="navbar navbar-expand-lg navbar-dark bg-transparent header-light fixed-top header-reverse-scroll"> <div class="container-fluid nav-header-container"> <div class="col-auto col-sm-6 col-lg-2 me-auto ps-lg-0"> <a class="navbar-brand" href="/"> <img src="/assets/master/logo-header.png" data-at2x="/assets/master/logo-header.png" class="default-logo" alt="Logo" /> <img src="/assets/master/logo-header-alt.png" data-at2x="/assets/master/logo-header-alt.png" class="alt-logo" alt="Logo" /> <img src="/assets/master/logo-header-alt.png" data-at2x="/assets/master/logo-header-alt.png" class="mobile-logo" alt="Logo" /> </a> </div> <div class="col-auto menu-order px-lg-0"> <button class="navbar-toggler float-end" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation"> <span class="navbar-toggler-line"></span> <span class="navbar-toggler-line"></span> <span class="navbar-toggler-line"></span> <span class="navbar-toggler-line"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav alt-font"> <li class="nav-item dropdown simple-dropdown"> <a href="/who-we-help/" class="nav-link">Who we help</a> </li> <li class="nav-item dropdown simple-dropdown"> <a href="/portfolio/" class="nav-link">Portfolio</a> </li> <li class="nav-item dropdown simple-dropdown"> <a href="/about/us/" class="nav-link">About us</a> </li> <li class="nav-item dropdown simple-dropdown"> <a href="/contact/" class="nav-link">Contact</a> </li> </ul> </div> </div> <div class="col-auto text-end pe-0 font-size-0"> <div class="header-social-icon d-inline-block"> <a href="https://www.facebook.com/seniorinternet" target="_blank"><i class="fab fa-facebook-f"></i></a> <a href="https://twitter.com/seniorinternet" target="_blank"><i class="fa-brands fa-x-twitter"></i></a> <a href="https://www.linkedin.com/company/senior-internet-ltd" target="_blank"><i class="fab fa-linkedin-in"></i></a> <a href="https://www.youtube.com/channel/UCfMTHOU8d0rgv72RlugWDAw" target="_blank"><i class="fa-brands fa-youtube"></i></a> </div> </div> </div> </nav> </header>  <div class="content"> <div class="title position-relative"> <div class="container"> <h1 class="m-0 font-weight-700 text-white text-center">Portfolio</h1> </div> <div class="breadcrumb position-absolute"> <ul> <li> <a href="/">Senior</a> </li> <li> <a href="/portfolio/">Portfolio</a> </li> </ul> </div> </div> <div class="umb-block-grid" data-grid-columns="12;" style="--umb-block-grid--grid-columns: 12;"> <div class="umb-block-grid__layout-container"> <div class="umb-block-grid__layout-item" data-content-element-type-alias="portfolioComponent" data-content-element-type-key="f52843ef-3c84-4d50-a13d-6df37ddda06c" data-element-udi="umb://element/4e2c1600873f4effa551f7f6ac5e60f2" data-col-span="12" data-row-span="1" style=" --umb-block-grid--item-column-span: 12; --umb-block-grid--item-row-span: 1; ">  <section class="p-0"> <div class="intro bg-light-gray" style="background-image: url('/assets/bg/intro-02.png');"> <div class="container"> <div class="content w-50 sm-w-100"> <h2>Check out a selection of our work</h2> <p></p> <ul class="portfolio-filter grid-filter nav nav-tabs border-0 margin-65px-top font-weight-300"> <li class="nav active"><a data-filter="*" href="#">All</a></li> </ul> </div> </div> </div> <div class="portfolio bg-white"> <div class="container-fluid"> <div class="row"> <div class="col-12 filter-content"> <ul class="portfolio-wrapper grid grid-loading grid-4col xl-grid-4col lg-grid-3col md-grid-2col sm-grid-2col xs-grid-1col gutter-extra-large text-center" data-opacity="0.9"> <li class="grid-sizer"></li> <li class="grid-item Membership grid-item-double wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/agcas/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/ug0h40fk/portfolio.jpg?rmode=pad&width=915&height=745" alt="AGCAS"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>AGCAS</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>The Association of Graduate Careers Advisory Services</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item- wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/bpca/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/nvnfkvml/portfolio.jpg?rmode=pad&width=915&height=745" alt="BPCA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>BPCA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>The British Pest Control Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item- wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/ipa-uk/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/wq2ojl4f/portfolio.jpg?rmode=pad&width=915&height=745" alt="IPA-UK"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>IPA-UK</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>The Interational Police Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item-double wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/naj/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/q4nbtrtz/portfolio.jpg?rmode=pad&width=915&height=745" alt="NAJ"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>NAJ</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>National Association of Jewellers</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Retail grid-item- wow animate__fadeIn" data-categories="Retail"> <a href="/portfolio/bira/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/rmgllzv0/portfolio.jpg?rmode=pad&width=915&height=745" alt="Bira"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>Bira</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>British Independent Retailers Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Retail grid-item- wow animate__fadeIn" data-categories="Retail"> <a href="/portfolio/newsworks/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/ufvkkl50/portfolio.jpg?rmode=pad&width=915&height=745" alt="Newsworks"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>Newsworks</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Newsworks</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Retail grid-item-double wow animate__fadeIn" data-categories="Retail"> <a href="/portfolio/pca/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/p4llvgq1/portfolio.jpg?rmode=pad&width=915&height=745" alt="PCA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>PCA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Property Care Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Charity grid-item- wow animate__fadeIn" data-categories="Charity"> <a href="/portfolio/hrf/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/hvraes01/portfolio.jpg?rmode=pad&width=915&height=745" alt="HRF"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>HRF</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Human Race Foundation</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Retail grid-item- wow animate__fadeIn" data-categories="Retail"> <a href="/portfolio/bpa/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/eb0kzyhk/portfolio.jpg?rmode=pad&width=915&height=745" alt="BPA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>BPA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>British Parking Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Retail grid-item- wow animate__fadeIn" data-categories="Retail"> <a href="/portfolio/ade/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/o3lhypzj/portfolio.jpg?rmode=pad&width=915&height=745" alt="ADE"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>ADE</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>The Association for Decentralised Energy</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item- wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/nuclear-institute/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/qq0lggc3/portfolio.jpg?rmode=pad&width=915&height=745" alt="Nuclear Institute"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>Nuclear Institute</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Nuclear Institute</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item- wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/midlands-innovation/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/n4kic2wm/portfolio.jpg?rmode=pad&width=915&height=745" alt="MI"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>MI</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Midlands Innovation</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item- wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/ppa/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/yhmdcdgq/portfolio.jpg?rmode=pad&width=915&height=745" alt="PPA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>PPA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Potato Processors' Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item-double wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/mia/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/rg2bbksl/portfolio.jpg?rmode=pad&width=915&height=745" alt="MIA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>MIA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Meetings Industry Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership grid-item-double wow animate__fadeIn" data-categories="Membership"> <a href="/portfolio/bsda/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/vfgo20i5/portfolio.jpg?rmode=pad&width=915&height=745" alt="BSDA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>BSDA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>British Soft Drinks Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Education grid-item- wow animate__fadeIn" data-categories="Education"> <a href="/portfolio/itssar/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/f25jrl5e/portfolio.jpg?rmode=pad&width=915&height=745" alt="ITSSAR"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>ITSSAR</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Independent Training Standards Scheme and Register</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> <li class="grid-item Membership Education grid-item- wow animate__fadeIn" data-categories="Membership,Education"> <a href="/portfolio/ga/"> <div class="portfolio-box"> <div class="portfolio-image"> <img src="/media/kgnh5hqw/portfolio.jpg?rmode=pad&width=915&height=745" alt="GA"> <div class="portfolio-hover bg-transparent-white justify-content-between d-flex flex-row align-items-end padding-3-rem-tb padding-4-rem-lr xl-padding-2-rem-all"> <div class="text-start"> <h3 class="margin-5px-bottom font-weight-700 text-black move-top-bottom-self"><span>GA</span></h3> <p class="mb-0 text-extra-medium font-weight-300 move-bottom-top-self"><span>Geography Association</span></p> </div> <img class="position-absolute top-50px right-50px move-right-left lg-top-30px lg-right-30px sm-top-20px sm-right-20px" src="/assets/icons/arrow-top-right.svg"> </div> </div> </div> </a> </li> </ul> </div> </div> </div> </div> </section> <script> $(function () { //extract categories const categories = $('.portfolio .grid-item') .map(function () { return $(this).attr('data-categories').split(",").map(c => c.trim()); }) .get() .flat() .filter(cat => cat !== ""); //remove duplicate categories const uniqueCategories = [...new Set(categories)]; //generate filter links const filters = uniqueCategories.map(category => { return $('<li class="nav"><a data-filter=".' + category + '" href="#">' + category + '</a></li>'); }); //append filters $('.portfolio-filter').append(filters); }); </script> </div> <div class="umb-block-grid__layout-item" data-content-element-type-alias="callToActionCostCalculator" data-content-element-type-key="4b61b380-375b-462a-b39d-add3fee3a0ed" data-element-udi="umb://element/6be82e3a5457430e88f54d966076a094" data-col-span="12" data-row-span="1" style=" --umb-block-grid--item-column-span: 12; --umb-block-grid--item-row-span: 1; ">  <section class="cta-strip cta-strip-cc d-flex align-items-center bg-light-teal wow animate__fadeIn"> <div class="container"> <div class="row align-items-center justify-content-center"> <div class="col-12 col-xl-8 col-md-8 col-sm-10 position-relative text-center text-md-start sm-margin-30px-bottom"> <h2 class="font-weight-700 text-black mb-0">How much should you spend on a website?</h2> <h2 class="font-weight-700 mb-0 text-white open-cc">Try out our website cost calculator ></h2> </div> <div class="col-12 col-xl-4 col-md-4 position-relative text-center text-md-end"> <img class="icon box-shadow-double-large border-radius-50 open-cc" src="/media/5owf22wz/calculator.svg?rmode=pad&width=138&height=138" alt="icon" /> </div> </div> </div> </section> <div id="cost-calculator"> <div class="umb-block-grid" data-grid-columns="12;" style="--umb-block-grid--grid-columns: 12;"> <div class="umb-block-grid__layout-container"> <div class="umb-block-grid__layout-item" data-content-element-type-alias="costCalculator" data-content-element-type-key="52a34325-a8a4-4d36-ac56-4cc363bdd42d" data-element-udi="umb://element/5fac94c0fbc6490ea48ce1bda17a0baf" data-col-span="12" data-row-span="1" style=" --umb-block-grid--item-column-span: 12; --umb-block-grid--item-row-span: 1; ">  <section class="cost-calculator shape-large shape-right position-relative pb-0 bg-blue"> <div class="shape bg-teal d-none d-xl-block position-absolute border-radius-50"></div>  <div id="request-callback" class="modal align-items-center position-absolute top-0px right-0px bottom-0px left-0px bg-light-gray"> <div class="close position-absolute top-30px right-30px"> <img src="/assets/icons/close.svg" alt="Close" /> </div> <div class="container"> </div> </div> <div id="callback-later" class="modal align-items-center position-absolute top-0px right-0px bottom-0px left-0px bg-light-gray"> <div class="close position-absolute top-30px right-30px"> <img src="/assets/icons/close.svg" alt="Close" /> </div> <div class="container"> </div> </div> <div id="discuss-pricing" class="modal align-items-center position-absolute top-0px right-0px bottom-0px left-0px bg-light-gray"> <div class="close position-absolute top-30px right-30px"> <img src="/assets/icons/close.svg" alt="Close" /> </div> <div class="container"> </div> </div> <div class="container"> <h2 class="heading">Website cost calculator</h2> <div class="d-block d-xl-flex">  <div class="cost-calculator-container lg-margin-90px-bottom md-margin-75px-bottom sm-margin-50px-bottom padding-40px-bottom"> <div class="calculator position-relative">  <div class="tt position-absolute top-15px right-15px z-index-2"> <div class="tt-icon d-flex justify-content-center align-items-center border-radius-50 w-30px h-30px"> <p class="m-0">?</p> </div> <div class="tt-text position-absolute padding-10px-all"> <p class="m-0 text-white">Roll your cursor over the scale or tap to select.</p> </div> </div>  <div class="swiper-container position-relative padding-80px-top md-padding-60px-top"> <div class="cost-calculator-wrapper swiper-wrapper border-radius-30px">  </div>  </div> </div> </div>  <div class="cost-calculator-images d-none d-xl-block margin-40px-left">  </div> </div> </div> </section> </div> </div> </div> </div> </div> </div> </div> </div>  <footer class="footer footer-dark"> <div class="footer-middle padding-40px-tb"> <div class="container"> <div class="row justify-content-center"> <div class="col-12 col-md-6 col-xl-3 md-margin-50px-bottom xs-margin-25px-bottom"> <span class="text-extra-medium font-weight-500 d-block text-white margin-30px-bottom xs-margin-10px-bottom">Services</span> <ul class="d-block d-md-flex flex-wrap"> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/membership-websites/">Membership Websites</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/seo-optimisation/">SEO Optimisation</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/content-management-systems/">Content Management Systems</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/wordpress-websites/">Wordpress Websites</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/drupal-websites/">Drupal Websites</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/hosting-domains/">Hosting & Domains</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/services/branding-graphic-design/">Branding & Graphics Design</a> </li> </ul> </div> <div class="col-12 col-md-6 col-xl-3 md-margin-50px-bottom xs-margin-25px-bottom"> <span class="text-extra-medium font-weight-500 d-block text-white margin-30px-bottom xs-margin-10px-bottom">Technology</span> <ul class="d-block d-md-flex flex-wrap"> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/technology/memberbase-crm/">Memberbase CRM</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/technology/umbraco/">Umbraco</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/technology/river-cpd/">River CPD</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/technology/microsoft-dynamics-365/">Microsoft Dynamics 365</a> </li> </ul> </div> <div class="col-12 col-md-6 col-xl-3 md-margin-50px-bottom xs-margin-25px-bottom"> <span class="text-extra-medium font-weight-500 d-block text-white margin-30px-bottom xs-margin-10px-bottom">Integrations</span> <ul class="d-block d-md-flex flex-wrap"> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-zoho/">Integrate with Zoho</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-hubspot/">Integrates with Hubspot</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/oomi/">Integrates with OOMI</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-eudonet/">Integrates with Eudonet</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-d365/">Integrates with D365</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-salesforce/">Integrates with Salesforce</a> </li> </ul> </div> <div class="col-12 col-md-6 col-xl-3 md-margin-50px-bottom xs-margin-25px-bottom"> <span class="text-extra-medium font-weight-500 d-block text-white margin-30px-bottom xs-margin-10px-bottom">‎</span> <ul class="d-block d-md-flex flex-wrap"> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-xero/">Integrates with Xero</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-quickbooks/">Integrates with Quickbooks</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-worldpay/">Integrates with WorldPay</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-elavon/">Integrates with Elavon</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-stripe/">Integrates with Stripe</a> </li> <li class="w-100 margin-10px-bottom text-medium"> <a class="d-block" href="/integrates/with-paypal/">Integrates with Paypal</a> </li> </ul> </div> </div> </div> </div> <div class="container"> <div class="footer-bottom padding-40px-top padding-65px-bottom"> <div class="row"> <div class="col-12 col-md-6 sm-margin-10px-bottom xs-margin-15px-bottom"> <ul class="footer-horizontal-link d-flex flex-wrap flex-column flex-sm-row justify-content-sm-center justify-content-md-start"> <li class="text-extra-small"> <a href="/legal/gdpr-policy/">GDPR Policy</a> </li> <li class="text-extra-small"> <a href="/legal/privacy/">Privacy</a> </li> <li class="text-extra-small"> <a href="/legal/cookies/">Cookies</a> </li> <li class="text-extra-small"> <a href="/legal/complaints/">Complaints</a> </li> <li class="text-extra-small"> <a href="/about/careers/">Careers</a> </li> <li class="text-extra-small"> <a href="/legal/terms-of-business/" target="">Terms</a> </li> </ul> </div> <div class="col-12 col-md-6 text-start text-sm-center text-md-end last-paragraph-no-margin"> <p class="text-extra-small">Company No.: 03901114, VAT No.: 764391214</p> </div> </div> </div> </div> </footer>  <script type="text/javascript" defer src="/js/dist/concat.min.js"></script> <script type="text/javascript" defer src="/js/dist/forms.js"></script> </body> </html>

CINXE.COM

Senior - Portfolio