Elements Guide

Footer

> Footer Design

  • A blue-300-background stripe may be used above the main contents of the footer to list all locations. The locations may link to contact information for each location or their respective local websites and appear in alphabetical order.
  • The main content of the footer is divided into two sections:
    • Contact Details:
      This column should contain the logo of Medicover Diagnostics, along with any contact information and social media links
    • Website Main Pages:
      This section is further divided into columns and contains all the main pages the user might be looking for when visiting the site. Each column contains a category with its submenu items.
  • The final part of the footer is separated from the rest with a line and contains both the copyright information and links to legal documens or pages with legal information.

> Tablet Design

Changes on Tablet

  1. The locations stripe scrolls horizontally if there is not enough space to display all countries
  2. The two sections of the main part of the footer become stacked vertically - i.(Contact Details) appears on top of ii.(Website Main Pages). Contact Details are centered while the Main Pages Section has a Blue-900 background at 20% opacity.
  3. The line separating the last part of the footer is removed

> Mobile Design

Changes on Mobile

  1. Website Main Pages element is turned into an accordion. The accordion title is white with a Blue-900 background and Intense Blue border and icon while the accordion content has a Blue-900 background with white text
  2. The last part of the footer becomes stacked vertically with the links on top of the copyright information.