/*
  Name: gp_site_styles.css
  Description:
    Stylesheet for Glasgow Polyomic web site pages.
    Note that this stylesheet is intended to extend the styles defined by 
    the Bootstrap 3 infrastructure used for the Glasgow Polyomics web site.
    Note that a separate policy ("gp" prefix, no underscores, words capitalzied) is used to highlight the names of element
    identifiers intended for use in URLs to access this specific page content within the parent page.
  Author: Glasgow Polyomics Bioinformatics Team, University of Glasgow, UK
  Version: 1.0 (Draft)
  Date Created: 15 August 2013
  Date Released: Under Development
*/


/*
  SECTION: Style definitions for textual content.

  Policy is derived from the visual style of the Glasgow Polyomics logo:
    1. All textual content uses the same font family.
    2. Define a range of sans-serif fonts to support viewing on computers with varying font installations.  
    3. Use Helvetica Neue by preference, and the default sans-serif font as the fail-safe option.
    4. Header text is shown in a dark blue taken from the company logo, suitable for display against a light-coloured background.
    5. Normal text is shown in a dark blue taken from the company logo, suitable for display against a light-coloured background.
*/

* {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
p.lead {
  color: #00355f; /* Polyomics blue */
}


/*
  SECTION: Style definitions for links embedded in text.

  Policy is derived from the visual style of the Glasgow Polyomics logo:
    1. Textual content of links uses the same font family as the text itself.
    2. Links are always underlined.
    3. Unvisited links display the text in a light blue colour to stand out from other text.
    4. Links in focus display the text in a darker blue derived as a shaded offset of the unfocused link blue.
    5. Link colours are selected to contrast against he blue taken from the company logo.
*/

p a:link,
p a:visited {
  color: #0088cc;
  text-decoration: underline;
}

p a:focus,
p a:hover,
p a:active {
  color: #005580;
}


/*
  SECTION: Style definitions for general page layout.

  Policy is:
    1. Clear all default and inherited margins and padding - specific margins and padding for individual elements must be made explicit.
    2. The width settings for a row are set as full screen width to override the values defined in Bootstrap container/row styles.
    3. The body is set for a non-responsive mode, with the main content shown in a fixed width that is centred on oversized pages.
    4. Any elements still in preparation are not displayed.
*/

* {
  margin: 0px;
  padding: 0px;
}

body {
  width: 100%;
  overflow: auto;
  background-color: #f5f5f5;
}

#gp_page_wrapper {
  width: 970px; /* Non-responsive mode of presentation */
  margin: 0px auto 0px auto;
  padding: 0px;
}

.container {
  max-width: none !important; /* Non-responsive mode of presentation */
  width: 970px;
}

.gp_row {
  width: 100%;
  margin: 0px;
  padding: 0px;
}

.inprep {
  display: none !important; /* Used during development only */
}



/*
  SECTION: Style definitions for links containing embedded images.

  Policy is:
    1. Remove any outline that would appear around embedded images within links. This avoids the display of outlines that can occur in Microsoft IE.
*/

a:link img,
a:active img,
a:focus img,
a:visited img {
  border: none;
}

a:link,
a:active,
a:focus,
a:visited {
  outline: none;
}


/*
  SECTION: Style definitions for general images embedded within text and other content.

  Policy is:
    1. Display images as a block element with maximum width set to 100% of the parent container.
*/

img {
  display: block;
  max-width: 100% !important;
  height: auto;
  overflow: hidden;
}

img.gp_embedded_text {
  display: inline;
  position: relative;
  top: -4px;
}


/*
  SECTION: Style definitions for popup cookie banner.

  Policy is:
    1. When visible, the cookie banner is to be positioned at the bottom of the page. 
    2. These style settings assume that Javascript is enabled on the website browser so the banner content is initially invisible.
    3. Support for the cookie banner is included, although this banner is initially hidden.  It will be displayed via JavaScript should it be required by the cookie usage policy.
    4. Banners are displayed using a solid colour background for emphasis.
    5. Banner colour scheme is set to Polyomics blue with light grey text to reflect the colour scheme in the company logo.
*/

#gp_cookie_banner {
  display: none;
  position: fixed;
  width: 100%;
  bottom: 0px;
  z-index: 100;
  padding: 8px 20px 8px 20px;
  background-color: #00355f; /* Polyomics blue */
  border: solid 3px #30658f;
}

.gp_banner_text p {
  font-size: 12px;
  line-height: 16px;
  color: #f5f5f5;
}

.gp_banner_button {
  margin-bottom: 2px;
}

.gp_banner_button a:link,
.gp_banner_button a:visited {
  font-size: 14px;
  color: #0088cc;
  text-decoration: underline;
}

.gp_banner_button a:focus,
.gp_banner_button a:hover,
.gp_banner_button a:active {
  color: #f5f5f5;
}


/*
  SECTION: Style definitions for page header title bar elements.

  Policy is:
    1. The layout of the page header is designed to contain a title bar with the company logos, the main page navigation bar, an optional image carousel, and a navigation breadcrumbs bar.
    2. The company title bar is displayed on a separate row at the top of the page, spanning the full width.
    3. The colour scheme for the page header elements is derived from the blue in the Glasgow Polyomics logo.
    4. The colour scheme applies a different colour shade to each page listed in the main page navigation bar to establish a thematic identity for each separate page.
    5. A linear colour gradient is used for each page header.  Note that the colour gradient starts at a lighter shade than the colour defined for each page in order to maintain visibility of the navigation bar tabs.  For example, if #00355f (Polyomics blue) is the colour shade defined for a page, the gradient colour for the page header will start at #184d77 (the next lighter shade).
*/

#gp_logo_block {
  width: 970px;
  margin: 0px auto 0px auto;
}

.gp_title_logo_left {
  float: left;
  height: 40px;
  width: auto;
  margin-top: 8px;
}

.gp_title_logo_right {
  float: right;
  height: 40px;
  width: auto;
  margin-top: 8px;
}

h2.gp_title_text {
  font-weight: bold;
  color: #ffffff;
  margin-top: 21px; /* Aligned to page navigation tabs */
  margin-left: -30px;
}

h3.gp_title_text {
  font-weight: bold;
  text-shadow: 0px 1px #ffffff;
  margin-top: 25px; /* Aligned to page navigation tabs */
  margin-left: -30px;
}

.gp_title_text {
 color: #00355f; /* Default colour shade for ancillary pages */
}

#gp_home_page .gp_title_text {
  color: #00355f; /* Specific colour shade for home page */
}

.gp_tab1_page .gp_title_text {
  color: #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page .gp_title_text {
  color: #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page .gp_title_text {
  color: #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page .gp_title_text {
  color: #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page .gp_title_text {
  color: #487da7; /* Specific colour shade for fifth tab page */
}

.gp_tab6_page .gp_title_text {
  color: #78add7; /* Specific colour shade for sixth tab page */
}

#gp_title_block {
  height: 60px;
  background-color: #00355f; /* Default colour shade for ancillary pages is Polyomics blue */
}

#gp_home_page #gp_title_block {
  background-color: #00355f; /* Specific colour shade for home page */
}

.gp_tab1_page #gp_title_block {
  background-color: #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page #gp_title_block {
  background-color: #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page #gp_title_block {
  background-color: #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page #gp_title_block {
  background-color: #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page #gp_title_block {
  background-color: #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page #gp_title_block {
  background-color: #78add7; /* Specific colour shade for sixth tab pages */
}

#gp_title_block h1,
#gp_title_block h2,
#gp_title_block h3,
#gp_title_block h4,
#gp_title_block h5,
#gp_title_block h6,
#gp_title_block p {
  color: #f5f5f5;
}


/*
  SECTION: Style definitions for page header main navigation components.

  Policy is:
    1. The layout of the page header is designed to contain a company title, a company logo, the main page navigation bar, an optional image carousel, and a navigation breadcrumbs bar.
    2. The company logo is displayed to the left of the page at a fixed height.
    3. The page navigation bar is positioned to the right of the window aligned to the company logo.
    4. The page navigation bar is displayed as fixed width tabs.
    5. The colour scheme for the page header elements is derived from the blue in the Glasgow Polyomics logo.
    6. The colour scheme applies a different colour shade to each page listed in the main page navigation bar to establish a thematic identity for each separate page.
    7. A linear colour gradient is used for each page header.  Note that the colour gradient starts at a lighter shade than the colour defined for each page in order to maintain visibility of the navigation bar tabs.  For example, if #00355f (Polyomics blue) is the colour shade defined for a page, the gradient colour for the page header will start at #184d77 (the next lighter shade +0x18).
*/

#gp_navigator_block {
  width: 970px;
  margin: 0px auto 0px auto;
  padding: 10px 10px 0px 30px;
  height: 120px;
  border-bottom: solid 4px #00355f; /* Default colour shade for ancillary pages is Polyomics blue */
}

#gp_navigator_block {
  /* background: #d1cec6; /* UoG tertiary palette grey - Pantone 428 */
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: -webkit-linear-gradient(top, #184d77, #e5e5e5);
  background: -moz-linear-gradient(top, #184d77, #e5e5e5);
  background: -o-linear-gradient(top, #184d77, #e5e5e5);
  background: -ms-linear-gradient(top, #184d77, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#184d77', endColorstr='#e5e5e5');
}

#gp_home_page #gp_navigator_block {
  background: none; /* Background is provided by image carousel */
}

.gp_tab1_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #184d77, #e5e5e5); /* Offset gradient colour shade for first tab pages */
  background: -webkit-linear-gradient(top, #184d77, #e5e5e5);
  background: -moz-linear-gradient(top, #184d77, #e5e5e5);
  background: -o-linear-gradient(top, #184d77, #e5e5e5);
  background: -ms-linear-gradient(top, #184d77, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#184d77', endColorstr='#e5e5e5');
}

.gp_tab2_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #30658f, #e5e5e5); /* Offset gradient colour shade for second tab pages */
  background: -webkit-linear-gradient(top, #30658f, #e5e5e5);
  background: -moz-linear-gradient(top, #30658f, #e5e5e5);
  background: -o-linear-gradient(top, #30658f, #e5e5e5);
  background: -ms-linear-gradient(top, #30658f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#30658f', endColorstr='#e5e5e5');
}

.gp_tab3_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #487da7, #e5e5e5); /* Offset gradient colour shade for third tab pages */
  background: -webkit-linear-gradient(top, #487da7, #e5e5e5);
  background: -moz-linear-gradient(top, #487da7, #e5e5e5);
  background: -o-linear-gradient(top, #487da7, #e5e5e5);
  background: -ms-linear-gradient(top, #487da7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#487da7', endColorstr='#e5e5e5');
}

.gp_tab4_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #6095bf, #e5e5e5); /* Offset gradient colour shade for fourth tab pages */
  background: -webkit-linear-gradient(top, #6095bf, #e5e5e5);
  background: -moz-linear-gradient(top, #6095bf, #e5e5e5);
  background: -o-linear-gradient(top, #6095bf, #e5e5e5);
  background: -ms-linear-gradient(top, #6095bf, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6095bf', endColorstr='#e5e5e5');
}

.gp_tab5_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #78add7, #e5e5e5); /* Offset gradient colour shade for fifth tab pages */
  background: -webkit-linear-gradient(top, #78add7, #e5e5e5);
  background: -moz-linear-gradient(top, #78add7, #e5e5e5);
  background: -o-linear-gradient(top, #78add7, #e5e5e5);
  background: -ms-linear-gradient(top, #78add7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#78add7', endColorstr='#e5e5e5');
}

.gp_tab6_page #gp_navigator_block {
  background: #e5e5e5; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #90c5ff, #e5e5e5); /* Offset gradient colour shade for sixth tab pages */
  background: -webkit-linear-gradient(top, #90c5ff, #e5e5e5);
  background: -moz-linear-gradient(top, #90c5ff, #e5e5e5);
  background: -o-linear-gradient(top, #90c5ff, #e5e5e5);
  background: -ms-linear-gradient(top, #90c5ff, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#90c5ff', endColorstr='#e5e5e5');
}

#gp_home_page #gp_navigator_block {
  background-color: rgba(228,228,228,0.5);
  border-bottom: none; /* No border for home page to accommodate the image carousel */
  position: relative; /* Promote position on top of carousel */
  z-index: 5;
}

.gp_tab1_page #gp_navigator_block {
  border-bottom: solid 4px #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page #gp_navigator_block {
  border-bottom: solid 4px #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page #gp_navigator_block {
  border-bottom: solid 4px #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page #gp_navigator_block {
  border-bottom: solid 4px #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page #gp_navigator_block {
  border-bottom: solid 4px #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page #gp_navigator_block {
  border-bottom: solid 4px #78add7; /* Specific colour shade for sixth tab pages */
}

#gp_safe_home a:link,
#gp_safe_home a:hover,
#gp_safe_home a:focus,
#gp_safe_home a:active,
#gp_safe_home a:visited {
  text-decoration: none;
}

#gp_page_navbar {
  float: right;
  min-height: 40px;
  width: auto;
  margin-top: 40px; /* Aligned to base of logo */
  padding: 0px;
  background: none;
  border: none;
}

#gp_page_navbar ul {
  margin: 0px;
  padding: 0px;
  border: none;
}

#gp_page_navbar li {
  float: left;
  display: block;
  min-width: 120px;
  height: 40px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 0px;
  padding-left: 2px;
}

#gp_page_navbar ul a:link,
#gp_page_navbar ul a:visited {
  color: #f5f5f5;
}

#gp_home_link a:link, 
#gp_home_link a:visited {
  background-color: #00355f;  /* Specific colour shade for home page */
  border: solid 1px #00355f;  /* Specific colour shade for home page */
}

#gp_home_link a:hover, 
#gp_home_link a:active {
 border: none;
}

#gp_tab1_link a:link, 
#gp_tab1_link a:visited {
  background-color: #00355f;  /* Specific colour shade for first tab pages */
  border: solid 1px #00355f;  /* Specific colour shade for first tab pages */
}

#gp_tab1_link a:hover, 
#gp_tab1_link a:active {
 border: none;
}

#gp_tab2_link a:link, 
#gp_tab2_link a:visited {
  background-color: #184d77;  /* Specific colour shade for second tab pages */
  border: solid 1px #184d77;  /* Specific colour shade for second tab pages */
}

#gp_tab2_link a:hover, 
#gp_tab2_link a:active { 
  border: none;
}

#gp_tab3_link a:link, 
#gp_tab3_link a:visited {
  background-color: #30658f;  /* Specific colour shade for third tab pages */
  border: solid 1px #30658f;  /* Specific colour shade for third tab pages */
}

#gp_tab3_link a:hover, 
#gp_tab3_link a:active {
  border: none;
}

#gp_tab4_link a:link, 
#gp_tab4_link a:visited {
  background-color: #487da7;  /* Specific colour shade for fourth tab pages */
  border: solid 1px #487da7;  /* Specific colour shade for fourth tab pages */
}

#gp_tab4_link a:hover, 
#gp_tab4_link a:active {
  border: none;
}

#gp_tab5_link a:link, 
#gp_tab5_link a:visited {
  background-color: #6095bf;  /* Specific colour shade for fifth tab pages */
  border: solid 1px #6095bf;  /* Specific colour shade for fifth tab pages */
}

#gp_tab5_link a:hover, 
#gp_tab5_link a:active {
  border: none;
}

#gp_tab6_link a:link, 
#gp_tab6_link a:visited {
  background-color: #78add7;  /* Specific colour shade for sixth tab pages */
  border: solid 1px #78add7;  /* Specific colour shade for sixth tab pages */
}

#gp_tab6_link a:hover, 
#gp_tab6_link a:active {
  border: none;
}

.gp_tab1_page #gp_tab1_link a:link, 
.gp_tab1_page #gp_tab1_link a:visited,
.gp_tab2_page #gp_tab2_link a:link, 
.gp_tab2_page #gp_tab2_link a:visited,
.gp_tab3_page #gp_tab3_link a:link, 
.gp_tab3_page #gp_tab3_link a:visited,
.gp_tab4_page #gp_tab4_link a:link, 
.gp_tab4_page #gp_tab4_link a:visited,
.gp_tab5_page #gp_tab5_link a:link, 
.gp_tab5_page #gp_tab5_link a:visited,
.gp_tab6_page #gp_tab6_link a:link, 
.gp_tab6_page #gp_tab6_link a:visited {
  height: 70px; /* Increase the size of the currently selected page tab so that it stretches to join the page border */
  border: none;
}


/*
  SECTION: Style definitions for page header image carousel elements.

  Policy is:
    1. The layout of the page header is designed to contain a company title, a company logo, the main page navigation bar, an optional image carousel, and a navigation breadcrumbs bar.
    2. The image carousel is displayed full width of the screen at a fixed height.
    3. The image carousel is only included on the home page.
    4. When present, the image carousel will expand to the top of the header, appearing behind the transparent header items placed above it.
    5. The colour scheme for the page header elements is derived from the blue in the Glasgow Polyomics logo.
    6. The colour scheme applies a different colour shade to each page listed in the main page navigation bar to establish a thematic identity for each separate page.
*/

#gp_carousel_block {
  position: relative;
  left: 0px;
  top: -120px; /* Aligned to top of navigation row */
  height: 240px; /* Effective height of carousel viewport is increased beyond this value by top offset */
  width: 970px;
  margin: 0px auto 0px auto;
}

#gp_carousel_block .carousel-indicators {
  position: absolute;
  top: 310px;
}

#gp_carousel_block .carousel-inner {
  position: relative;
  top: 0px; /* Image viewport for carousel is set to the full size of carousel */
  width: 100%;
  height: 360px;
  overflow: hidden;
}

#gp_carousel_block .item img {
  display: block;
  float: left;
  width: 100%;
  height: auto;
}

#gp_carousel_block .item .carousel-caption {
  display: block;
  left: 0px;
  top: 300px;  /* Fix caption block to the base of the carousel viewport */
  width: 100%;
  height: 60px;
  padding-bottom: 10px;
  text-align: center;
  background-color: #00355f;  /* Polyomics blue */
}

#gp_carousel_block h1,
#gp_carousel_block h2,
#gp_carousel_block h3,
#gp_carousel_block h4,
#gp_carousel_block h5,
#gp_carousel_block h6,
#gp_carousel_block p {
  font-size: 16px;
  color: #f5f5f5;
}

#gp_carousel_block .carousel-control {
  bottom: -120px;
}

#gp_carousel_block .icon-prev,
#gp_carousel_block .icon-next {
  font-size: 64px;
  margin-top: -64px;
  color: #ffffff;
}


/*
  SECTION: Style definitions for page breadcrumbs elements.

  Policy is:
    1. The layout of the page header is designed to contain a company title, a company logo, the main page navigation bar, an optional image carousel, and a navigation breadcrumbs bar.
    2. The navigation breadcrumb bar is displayed on a separate row below the image carousel if the carousel is present.
    3. The navigation breadcrumb bar is displayed on a separate row below the main page navigation bar if the carousel is not present.
    4. The colour scheme for the page header elements is derived from the blue in the Glasgow Polyomics logo.
    5. The colour scheme applies a different colour shade to each page listed in the main page navigation bar to establish a thematic identity for each separate page.
*/

#gp_breadcrumb_block {
  width: 970px;
  margin: 0px auto 0px auto;
  background-color: #f5f5f5;
  border-bottom: solid 4px #00355f; /* Default colour shade for ancillary pages */
}

#gp_home_page #gp_breadcrumb_block {
  border-top: solid 4px #00355f; /* Top border also required for home page due to addition of carousel */
  border-bottom: solid 4px #00355f; /* Specific colour shade for home page */
}

.gp_tab1_page #gp_breadcrumb_block {
  border-bottom: solid 4px #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page #gp_breadcrumb_block {
  border-bottom: solid 4px #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page #gp_breadcrumb_block {
  border-bottom: solid 4px #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page #gp_breadcrumb_block {
  border-bottom: solid 4px #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page #gp_breadcrumb_block {
  border-bottom: solid 4px #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page #gp_breadcrumb_block {
  border-bottom: solid 4px #78add7; /* Specific colour shade for fifth tab pages */
}

.gp_breadcrumb {
  margin-bottom: 0px;
  padding: 2px;
  background-color: #f5f5f5;
}

.gp_breadcrumb a {
  color: #0088cc;
}

.gp_breadcrumb li.active {
  color: #00355f; /* Breadcrumbs coloured by default to Polyomics blue  */
}

#gp_home_page .gp_breadcrumb li.active {
  color: #00355f; /* Breadcrumbs colour shaded to merge with home page */
}

.gp_tab1_page .gp_breadcrumb li.active {
  color: #00355f; /* Breadcrumbs colour shaded to merge with first tab pages */
}

.gp_tab2_page .gp_breadcrumb li.active {
  color: #184d77; /* Breadcrumbs colour shaded to merge with second tab pages */
}

.gp_tab3_page .gp_breadcrumb li.active {
  color: #30658f; /* Breadcrumbs colour shaded to merge with third tab pages */
}

.gp_tab4_page .gp_breadcrumb li.active {
  color: #487da7; /* Breadcrumbs colour shaded to merge with fourth tab pages */
}

.gp_tab5_page .gp_breadcrumb li.active {
  color: #6095bf; /* Breadcrumbs colour shaded to merge with fifth tab pages */
}

.gp_tab6_page .gp_breadcrumb li.active {
  color: #78add7; /* Breadcrumbs colour shaded to merge with fifth tab pages */
}


/*
  SECTION: Style definitions for page content area general layout.

  Policy is:
    1. The layout for the content area of each page is arranged using a grid system to promote consistency in the positioning of the content on each page.
    2. The content within any column is arranged into subsections in order to enable subgrouping of the content displayed on the page.
    3. The width of a subsection conforms to the width of the column in which it is contained.
    4. A page content navigator may be included on pages with extensive content.
    5. The optional page content navigator is displayed on the left of the page content area, attached to the viewport so that it is always visible when viewing the page content area.
    6. The colour used in the page content navigator is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
*/

.gp_content_block {
  padding: 20px 10px 0px 10px;
  background-color: #fafafa;
}

.gp_content_navbar ul {
  list-style-type: none;
  width: 170px;
  padding: 0px;
  margin: 20px auto 0px auto;
}

.gp_content_navbar a:link,
.gp_content_navbar a:visited {
  display: block;
  width: 100%;
  font-size: 14px;
  font-weight: bold;
  line-height: 20px;
  text-align: left;
  padding: 5px 10px 5px 10px;
  margin-top: 2px;
  text-decoration: none;
  color: #ffffff;
  background: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Default colour shade for ancillary pages */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

.gp_content_navbar a:focus,
.gp_content_navbar a:hover {
  background: #00355f; /* Default colour shade for ancillary pages */
}

#gp_home_page .gp_content_navbar a:link, 
#gp_home_page .gp_content_navbar a:visited {
  background: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Default colour shade for ancillary pages */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

#gp_home_page .gp_content_navbar a:hover, 
#gp_home_page .gp_content_navbar a:active {
  background: #00355f;  /* Specific colour shade for home page */
}

.gp_tab1_page .gp_content_navbar a:link, 
.gp_tab1_page .gp_content_navbar  a:visited {
  background: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Default colour shade for first tab pages */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

.gp_tab1_page .gp_content_navbar a:hover, 
.gp_tab1_page .gp_content_navbar a:active {
  background: #00355f;  /* Specific colour shade for first tab pages */
}

.gp_tab2_page .gp_content_navbar a:link, 
.gp_tab2_page .gp_content_navbar a:visited {
  background: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #184d77, #e5e5e5); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(top, #184d77, #e5e5e5);
  background: -moz-linear-gradient(top, #184d77, #e5e5e5);
  background: -o-linear-gradient(top, #184d77, #e5e5e5);
  background: -ms-linear-gradient(top, #184d77, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#184d77', endColorstr='#e5e5e5');
}

.gp_tab2_page .gp_content_navbar a:hover, 
.gp_tab2_page .gp_content_navbar a:active { 
  background: #184d77;  /* Specific colour shade for workflow page */
}

.gp_tab3_page .gp_content_navbar a:link, 
.gp_tab3_page .gp_content_navbar a:visited {
  background: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #30658f, #e5e5e5); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(top, #30658f, #e5e5e5);
  background: -moz-linear-gradient(top, #30658f, #e5e5e5);
  background: -o-linear-gradient(top, #30658f, #e5e5e5);
  background: -ms-linear-gradient(top, #30658f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#30658f', endColorstr='#e5e5e5');
}

.gp_tab3_page .gp_content_navbar a:hover, 
.gp_tab3_page .gp_content_navbar a:active {
  background: #30658f;  /* Specific colour shade for third tab pages */
}

.gp_tab4_page .gp_content_navbar a:link, 
.gp_tab4_page .gp_content_navbar a:visited {
  background: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #487da7, #e5e5e5); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(top, #487da7, #e5e5e5);
  background: -moz-linear-gradient(top, #487da7, #e5e5e5);
  background: -o-linear-gradient(top, #487da7, #e5e5e5);
  background: -ms-linear-gradient(top, #487da7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#487da7', endColorstr='#e5e5e5');
}

.gp_tab4_page .gp_content_navbar a:hover, 
.gp_tab4_page .gp_content_navbar a:active {
  background: #487da7;  /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page .gp_content_navbar a:link, 
.gp_tab5_page .gp_content_navbar a:visited {
  background: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #6095bf, #e5e5e5); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(top, #6095bf, #e5e5e5);
  background: -moz-linear-gradient(top, #6095bf, #e5e5e5);
  background: -o-linear-gradient(top, #6095bf, #e5e5e5);
  background: -ms-linear-gradient(top, #6095bf, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6095bf', endColorstr='#e5e5e5');
}

.gp_tab5_page .gp_content_navbar a:hover, 
.gp_tab5_page .gp_content_navbar a:active {
  background: #6095bf;  /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page .gp_content_navbar a:link, 
.gp_tab6_page .gp_content_navbar a:visited {
  background: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #78add7, #e5e5e5); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(top, #78add7, #e5e5e5);
  background: -moz-linear-gradient(top, #78add7, #e5e5e5);
  background: -o-linear-gradient(top, #78add7, #e5e5e5);
  background: -ms-linear-gradient(top, #78add7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#78add7', endColorstr='#e5e5e5');
}

.gp_tab6_page .gp_content_navbar a:hover, 
.gp_tab6_page .gp_content_navbar a:active {
  background: #78add7;  /* Specific colour shade for sixth tab pages */
}


/*
  SECTION: Style definitions for page content panel area components.

  Policy is:
    1. A range of components are used to form the content of each page.  A consistent styling will be used where the same component is included on multiple pages.
    2. The colour used for section headers and other textual elements is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
    3. Grouped content is displayed in panels surrounded by light border to promote separation of distinct content.
    4. The content in focus is identified by highlighting the colour of the panel background to enable visual feedback.
    5. Text in panel areas is displayed in a colour derived from the Glasgow Polyomics logo.
    6. Highlighted text in panel areas is displayed using reverse colours derived from the Glasgow Polyomics logo.
    7. A range of image sizes are defined to ensure a consistent presentation of icons, photograph, etc sacross pages.
*/

.gp_content_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #fafafa;
}

.gp_content_panel:hover {
  background-color: #f5f5f5;
}

.gp_content_panel h1,
.gp_content_panel h2,
.gp_content_panel h3,
.gp_content_panel h4,
.gp_content_panel h5,
.gp_content_panel h6 {
  display: block;
  width: 100%;
  padding: 4px;
  background-color: #00355f; /* Default colour shade for ancillary pages is Polyomics blue */
  color: #fafafa;
}

#gp_home_page .gp_content_panel h1,
#gp_home_page .gp_content_panel h2,
#gp_home_page .gp_content_panel h3,
#gp_home_page .gp_content_panel h4,
#gp_home_page .gp_content_panel h5,
#gp_home_page .gp_content_panel h6 {
  background-color: #00355f; /* Specific colour shade for home page */
}

.gp_tab1_page .gp_content_panel h1,
.gp_tab1_page .gp_content_panel h2,
.gp_tab1_page .gp_content_panel h3,
.gp_tab1_page .gp_content_panel h4,
.gp_tab1_page .gp_content_panel h5,
.gp_tab1_page .gp_content_panel h6 {
  background-color: #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page .gp_content_panel h1,
.gp_tab2_page .gp_content_panel h2,
.gp_tab2_page .gp_content_panel h3,
.gp_tab2_page .gp_content_panel h4,
.gp_tab2_page .gp_content_panel h5,
.gp_tab2_page .gp_content_panel h6 {
  background-color: #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page .gp_content_panel h1,
.gp_tab3_page .gp_content_panel h2,
.gp_tab3_page .gp_content_panel h3,
.gp_tab3_page .gp_content_panel h4,
.gp_tab3_page .gp_content_panel h5,
.gp_tab3_page .gp_content_panel h6 {
  background-color: #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page .gp_content_panel h1,
.gp_tab4_page .gp_content_panel h2,
.gp_tab4_page .gp_content_panel h3,
.gp_tab4_page .gp_content_panel h4,
.gp_tab4_page .gp_content_panel h5,
.gp_tab4_page .gp_content_panel h6 {
  background-color: #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page .gp_content_panel h1,
.gp_tab5_page .gp_content_panel h2,
.gp_tab5_page .gp_content_panel h3,
.gp_tab5_page .gp_content_panel h4,
.gp_tab5_page .gp_content_panel h5,
.gp_tab5_page .gp_content_panel h6 {
  background-color: #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page .gp_content_panel h1,
.gp_tab6_page .gp_content_panel h2,
.gp_tab6_page .gp_content_panel h3,
.gp_tab6_page .gp_content_panel h4,
.gp_tab6_page .gp_content_panel h5,
.gp_tab6_page .gp_content_panel h6 {
  background-color: #78add7; /* Specific colour shade for sixth tab pages */
}

.gp_content_panel p,
.gp_content_panel p.lead {
  margin-top: 10px;
  color: #00355f; /* Polyomics blue */
}

.gp_content_panel p.gp_highlight_item {
  margin-top: 10px;
  font-weight: bold;
  font-style: italic;
  color: #00355f; /* Polyomics blue */
}

.gp_content_panel div.gp_highlight_item {
  padding: 4px;
  margin-right: 10px;
  background-color: #184d77; /* Specific offset colour shade for ancillary pages */
  border: solid 2px #00355f; /* Specific offset colour shade for ancillary pages */
}

.gp_content_panel p.gp_download_note {
  margin-top: 10px;
  width: 100%;
  text-align: center;
  font-weight: bold;
  font-style: italic;
  color: #00355f; /* Polyomics blue */
}

#gp_home_page .gp_content_panel div.gp_highlight_item {
  background-color: #184d77; /* Specific offset colour shade for home page */
  border: solid 2px #00355f; /* Specific offset colour shade for home pages */
}

.gp_tab1_page .gp_content_panel div.gp_highlight_item {
  background-color: #184d77; /* Specific offset colour shade for first tab pages */
  border: solid 2px #00355f; /* Specific offset colour shade for first tab pages */
}

.gp_tab2_page .gp_content_panel div.gp_highlight_item {
  background-color: #30658f; /* Specific offset colour shade for second tab pages */
  border: solid 2px #184d77; /* Specific offset colour shade for second tab pages */
}

.gp_tab3_page .gp_content_panel div.gp_highlight_item {
  background-color: #487da7; /* Specific offset colour shade for third tab pages */
  border: solid 2px #30658f; /* Specific offset colour shade for third tab pages */
}

.gp_tab4_page .gp_content_panel div.gp_highlight_item {
  background-color: #6095bf; /* Specific offset colour shade for fourth tab pages */
  border: solid 2px #487da7; /* Specific offset colour shade for fourth tab pages */
}

.gp_tab5_page .gp_content_panel div.gp_highlight_item {
  background-color: #78add7; /* Specific offset colour shade for fifth tab pages */
  border: solid 2px #6095bf; /* Specific offset colour shade for fifth tab pages */
}

.gp_tab6_page .gp_content_panel div.gp_highlight_item {
  background-color: #90c5ff; /* Specific offset colour shade for sixth tab pages */
  border: solid 2px #78add7; /* Specific offset colour shade for sixth tab pages */
}

.gp_content_panel ul,
.gp_content_panel ol {
  margin: 10px 10px 10px 40px;
  color: #00355f; /* Polyomics blue */
}

.gp_content_panel div.gp_highlight_item p,
.gp_content_panel div.gp_highlight_item p.lead,
.gp_content_panel div.gp_highlight_item ul,
.gp_content_panel div.gp_highlight_item ol {
  font-style: italic;
  color: #ffffff;
}


/*
  SECTION: Style definitions for images used in content panel components.

  Policy is:
    1. Images are displayed in blocks with one dimension fixed and the other auto-resized to ensure scaling of original images
    2. Styles are provided to support a range of display sizes for images.
    3. Styles are provided to support a range of image uses as in subject icons, bullet icons, biography photographs, etc.
    4. Sponsor logos are displayed against a white background to ensure consistency of presentation.
*/

.gp_subject_icon_xsmall {
  display: block;
  width: 100px;
  height: auto;
  margin: 10px;
}

.gp_subject_icon_small {
  display: block;
  width: 140px;
  height: auto;
  margin: 10px;
}

.gp_subject_icon {
  display: block;
  width: 180px;
  height: auto;
  margin: 10px;
}

.gp_subject_icon_medium {
  display: block;
  width: 200px;
  height: auto;
  margin: 10px;
}

.gp_subject_icon_large {
  display: block;
  width: 260px;
  height: auto;
  margin: 10px;
}

.gp_wt_padding {
  padding: 4px 24px 8px 0px;
}

.gp_info_bullet {
  float: left;
  display: block;
  width: 36px;
  height: auto;
  margin-right: 2px;
  margin-top: 2px;
}

.gp_subject_bullet {
  float: left;
  display: block;
  width: 36px;
  height: auto;
  margin-right: 2px;
  margin-top: 8px;
}

.gp_mugshot {
  float: right;
  width: 180px;
  margin: 10px;
}

.gp_mugshot_p {
  float: right;
  width: 180px;
  margin: 10px;
  border: solid 1px #00355f; /* Polyomics blue */
}

.gp_mugshot_l {
  float: right;
  width: 240px;
  margin: 10px;
  border: solid 1px #00355f; /* Polyomics blue */
}

.gp_caption {
  text-align: center
  font-size: 11px;
  font-style: italic;
  color: #00355f; /* Polyomics blue */
}

.media a:link img,
.media a:active img,
.media a:visited img {
  background: inherit;
}

.media a:hover img,
.media a:focus img {
  background: #e7e7e7;
}

.media a:hover img.gp_downloadable,
.media a:focus img.gp_downloadable {
  border: solid 1px #00355f; /* Highlight in Polyomics blue for images used to indicate downloadable items */
}


/*
  SECTION: Style definitions for sponsor logos/sponsor logo galleries used in content panel components.

  Policy is:
    1. Logo images are displayed in blocks with one dimension fixed and the other auto-resized to ensure scaling of original images
    2. Styles are provided to support logos that are formatted as either landscape (L) or portrait (P) mode.
    3. Different heights are used to differentiate main sponsors from other sponsors.
    4. Logo images are displayed in a gallery layout with fixed spacing between each logo.
*/

.gp_sponsor_gallery {
  width: 96%;
  padding: 8px;
  margin: 0px 4px 10px 4px;
  background-color: #ffffff; /* White to match common logo image background */
  overflow: hidden;
}

.gp_sponsor_gallery .gp_main_sponsor_logo {
  float: left;
  width: auto;
  height: 70px;
  margin-right: 42px;
  margin-top: 30px;
}

.gp_sponsor_gallery .gp_main_sponsor_logo_P { /* Portrait style logos in mixed gallery */
  float: left;
  width: auto;
  height: 90px;
  margin-right: 42px;
  margin-top: 10px;
}

.gp_sponsor_gallery .gp_main_sponsor_logo_L { /* Landscape style logos in mixed gallery */
  float: left;
  width: auto;
  height: 45px;
  margin-right: 42px;
  margin-top: 45px; /* Note base is positioned higher than other icons for visual balance */
}

.gp_sponsor_gallery .gp_sponsor_logo {
  float: left;
  width: auto;
  height: 40px;
  margin-right: 24px;
  margin-top: 28px;
}

.gp_sponsor_gallery .gp_sponsor_logo_P { /* Portrait style logos in mixed gallery */
  float: left;
  width: auto;
  height: 66px;
  margin-right: 24px;
  margin-top: 4px;
}

.gp_sponsor_gallery .gp_sponsor_logo_L {/* Landscape style logos in mixed gallery */
  float: left;
  width: auto;
  height: 28px;
  margin-right: 24px;
  margin-top: 34px; /* Note base is positioned higher than other icons for visual balance */
}

.gp_sponsor_gallery a:hover img,
.gp_sponsor_gallery a:focus img {
  background: inherit; /* Match logo image background to gallery background for sponsor sections */
}


/*
  SECTION: Style definitions for photo/video galleries used in content panel components.

  Policy is:
    1. Photo and video images are displayed in blocks with one dimension fixed and the other auto-resized to ensure scaling of original images
    2. Styles are provided to support formatting of landscape photos, portrait photos, and videos.
    3. A standard height is used for all photos/videos to ensure consistency in the gallery items.
    4. Photos/videos are displayed in a gallery layout with fixed spacing between each logo.
*/

.gp_photo_gallery {
  width: 96%;
  padding: 8px;
  margin: 0px 4px 10px 4px;
  overflow: hidden;
}

.gp_photo_gallery .gp_video,
.gp_photo_gallery .gp_photo {
  float: left;
  width: auto;
  height: 180px;
  margin: 4px 4px 4px 4px;
  border: solid 1px #ffffff; /* Polyomics blue */
}

.gp_photo_gallery a:hover img,
.gp_photo_gallery a:focus img {
  background: inherit; /* Match logo image background to gallery background for sponsor sections */
} AM


/*
  SECTION: Style definitions for page content news panel components.

  Policy is:
    1. Headings and text for the news panel are displayed using a consistent colour.
    2. The colour used for the news panel headings is distinct from the main page colour shades.
    3. Highlighted text in the news panel is displayed in reverse colours from normal text.
    4. A range of image sizes are defined to ensure a consistent presentation of icons, photographs, etc across pages.
*/

.gp_news_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_news_panel h1,
.gp_news_panel h2,
.gp_news_panel h3,
.gp_news_panel h4,
.gp_news_panel h5,
.gp_news_panel h6 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4px;
  background-color: #0088cc; /* Highlight colour to emphasize the news section */
  color: #ffffff;
}

.gp_news_panel p {
  text-align: center;
  font-style: strong;
  padding: 4px;
  color: #0088cc;
}

.gp_news_panel p.gp_highlight_item {
  font-style: italic;
  background-color: #0088cc;
  color: #ffffff;
}

.gp_news_articles {
  max-height: 500px;
  overflow: hidden;
}

.gp_news_articles p.gp_highlight_item a:link,
.gp_news_articles p.gp_highlight_item a:visited {
  color: #ffffff;
  text-decoration: underline;
}

.gp_news_articles p.gp_highlight_item a:focus,
.gp_news_articles p.gp_highlight_item a:hover,
.gp_news_articles p.gp_highlight_item a:active {
  color: #005580;
}


/*
  SECTION: Style definitions for social media panel content components.

  Policy is:
    1. Social media icons are displayed in a single row, positioned to the right.
    2. Social media icons are displayed in a consistent size.
    3. Highlighted icons are used to provide visual feedback when icon is hovered.
*/

.gp_social_media_panel {
  height: 42px;
  padding: 0px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_social_media_panel span.gp_label {
  float: right;
  height: 38px;
  padding: 10px 4px 0px 4px;
  font-style: italic;
  font-weight: normal;
  color: #0088cc;
}

.gp_twitter_logo {
  float: right;
  display: block;
  height: 40px;
  width: 40px;
  background-image: url("../images/twitter-bird-light-bgs.png");
  background-repeat: no-repeat;
  transition: background-image 0.5s;
  -webkit-transition: background-image 0.5s;
}

.gp_twitter_logo:hover {
  background-image: url("../images/twitter-bird-white-on-blue.png");
  background-repeat: no-repeat;
}

.gp_facebook_logo {
  float: right;
  display: block;
  height: 40px;
  width: 40px;
  background-image: url("../images/FB-f-Logo__blue_29.png");
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-image 0.5s;
  -webkit-transition: background-image 0.5s;
}

.gp_facebook_logo:hover {
  background-color: #3b5999; /* Facebook blue background to emphasize Facebook 'f' */
  background-image: url("../images/FB-f-Logo__white_29.png");
  background-repeat: no-repeat;
  background-position: center center;
}

.gp_mailing_list_logo {
  float: right;
  display: block;
  height: 40px;
  width: 40px;
  background-image: url("../images/gp_mailinglist_icon_blue_on_white_noborder.png");
  background-repeat: no-repeat;
  background-position: center center;
  transition: background-image 0.5s;
  -webkit-transition: background-image 0.5s;
}

.gp_mailing_list_logo:hover {
  background-image: url("../images/gp_mailinglist_icon_white_on_blue.png");
  background-repeat: no-repeat;
  background-position: center center;
}


/*
  SECTION: Style definitions for page content quick links panel components.

  Policy is:
    1. Headings and text for the quick links panel are displayed using a consistent colour.
    2. The colour used for the quick links panel headings is distinct from the main page colour shades.
    3. Highlighted text in the quick links panel is displayed in reverse colours from normal text.
*/

.gp_qlinks_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_qlinks_panel h1,
.gp_qlinks_panel h2,
.gp_qlinks_panel h3,
.gp_qlinks_panel h4,
.gp_qlinks_panel h5,
.gp_qlinks_panel h6 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4px;
  background-color: #a346a3; /* Highlight colour to emphasize the quick links section */
  color: #fafafa;
}

.gp_qlinks_panel p {
  text-align: center;
  margin-bottom: 2px;
  font-weight: bold; 
}

.gp_qlinks_panel a:link,
.gp_qlinks_panel a:visited {
  color: #a346a3;
  text-decoration: underline;
}

.gp_qlinks_panel a:focus,
.gp_qlinks_panel a:hover,
.gp_qlinks_panel a:active {
  color: #00355f;
}

/*
  SECTION: Style definitions for page content expertise links panel components.

  Policy is:
    1. Headings and text for the expertise links panel are displayed using a consistent colour.
    2. The colour used for the expertise links panel headings is distinct from the main page colour shades.
    3. Highlighted text in the expertise links panel is displayed in reverse colours from normal text.
*/

.gp_expertise_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_expertise_panel h1,
.gp_expertise_panel h2,
.gp_expertise_panel h3,
.gp_expertise_panel h4,
.gp_expertise_panel h5,
.gp_expertise_panel h6 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4px;
  background-color: #468F46; /* Highlight colour to emphasize the quick links section */
  color: #fafafa;
}

.gp_expertise_panel p {
  text-align: center;
  margin-bottom: 2px;
  font-weight: bold; 
}

.gp_expertise_panel a:link,
.gp_expertise_panel a:visited {
  color: #468F46;
  text-decoration: underline;
}

.gp_expertise_panel a:focus,
.gp_expertise_panel a:hover,
.gp_expertise_panel a:active {
  color: #00355f;
}


/*

SECTION: Style definitions for page content Enquiry panel components, AMC1.

  Policy is:
    1. Headings and text for the enquiry panel are displayed using a consistent colour.
    2. The colour used for the enquiry panel headings is distinct from the main page colour shades.
    3. Highlighted text in the enquiry panel is displayed in reverse colours from normal text.
*/

.gp_enquiry_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_enquiry_panel h1,
.gp_enquiry_panel h2,
.gp_enquiry_panel h3,
.gp_enquiry_panel h4,
.gp_enquiry_panel h5,
.gp_enquiry_panel h6 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4px;
  background-color: #E87400; /* Highlight colour to emphasize the enquiry section */
  color: #fafafa;
}

.gp_enquiry_panel p {
  text-align: center;
  font-weight: bold;  color: #E87400;
}

.gp_enquiry_panel a:link,
.gp_enquiry_panel a:visited {
  color: #E87400;
}

.gp_enquiry_panel a:focus,
.gp_enquiry_panel a:hover,
.gp_enquiry_panel a:active {
  color: #00355f;
}

/*

SECTION: Style definitions for page content Twitter panel components, AMC2.

  Policy is:
    1. Headings and text for the enquiry panel are displayed using a consistent colour.
    2. The colour used for the enquiry panel headings is distinct from the main page colour shades.
    3. Highlighted text in the enquiry panel is displayed in reverse colours from normal text.
*/

.gp_twitter_panel {
  padding: 10px;
  margin: 0px auto 20px auto;
  background-color: #ffffff;
}

.gp_twitter_panel h1,
.gp_twitter_panel h2,
.gp_twitter_panel h3,
.gp_twitter_panel h4,
.gp_twitter_panel h5,
.gp_twitter_panel h6 {
  display: block;
  width: 100%;
  text-align: center;
  padding: 4px;
  background-color: #620000; /* Highlight colour to emphasize the enquiry section */
  color: #fafafa;
}

.gp_twitter_panel p {
  text-align: center;
  font-weight: bold;  color: #620000;
}

.gp_twitter_panel a:link,
.gp_twitter_panel a:visited {
  color: #620000;
}

.gp_twitter_panel a:focus,
.gp_twitter_panel a:hover,
.gp_twitter_panel a:active {
  color: #00355f;
}


/*

  SECTION: Style definitions for omics specific bullet list components.

  Policy is:
    1. The omics specific bullet list is intended to style unordered lists within the content on specific service pages.
    2. The layout is as for normal bulleted lists, but with the bullet replaced by the relevant service icon.
    3. Bullet icons re displayed at a standard size to ensure consistency across pages
*/

.gp_polyomics_list,
.gp_genomics_list,
.gp_transcriptomics_list,
.gp_proteomics_list,
.gp_metabolomics_list,
.gp_bioinformatics_list,
.gp_software_list {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}

.gp_polyomics_list li {
  background-image: url(../images/gp_polyomics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px;
  margin-top: 5px; 
}

.gp_genomics_list li {
  background-image: url(../images/gp_genomics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px;
  margin-top: 5px; 
}

.gp_transcriptomics_list li {
  background-image: url(../images/gp_transcriptomics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px; 
  margin-top: 5px; 
}

.gp_proteomics_list li {
  background-image: url(../images/gp_proteomics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px; 
  margin-top: 5px; 
}

.gp_metabolomics_list li {
  background-image: url(../images/gp_metabolomics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px; 
  margin-top: 5px; 
}

.gp_bioinformatics_list li {
  background-image: url(../images/gp_bioinformatics_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px; 
  margin-top: 5px; 
}

.gp_software_list li {
  background-image: url(../images/gp_software_icon_small.png);
  background-repeat: no-repeat;
  background-position: 0px 0px; 
  padding-left: 30px; 
  margin-top: 5px; 
}


/*
  SECTION: Style definitions for service portfolio browser content components.

  Policy is:
    1. The service portfolio browser is used to display service icons linked to service pages.
    2. Fixed, consistent sizes are used to ensure that the service icon and any interspersed text blocks  can be visually grouped into a "building blocks" visual style.
    3. Offset positioning is used to give a zigzag effect in the layout of the building blocks.
    4. The service icon in focus is reversed to enable visual feedback.
*/

.gp_service_browser {
  width: 432px;
  margin: 30px auto 0px auto !important; /* Override normal panel spacing */
  list-style-type: none;
}

.gp_service_browser li {
  float: left;
  margin: 2px;
}

.gp_service_browser li.gp_portfolio_guide {
  width: 100px;
  height: 109px;
  margin-top: 22px;
  border-radius: 10px;
  background-color: #e5e5e5;
  border: solid 1px #00355f; /* Matched to specific colour shade for services page */
}

.gp_service_browser li.gp_portfolio_guide p {
  padding: 20px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  color: #00355f; /* Matched to specific colour shade for services page */
}

.gp_service_browser li.gp_service_icon a {
  display: block;
  width: 140px;
  height: 131px;
  background-repeat: no-repeat;
  transition: background-image 0.3s;
  -webkit-transition: background-image 0.3s;
}

.gp_service_browser li.gp_icon_down {
  margin-top: 30px;
  margin-bottom: 0px;
}

.gp_service_browser li.gp_icon_up {
  margin-top: 0px;
  margin-bottom: 30px;
}

.gp_service_browser #gp_genomics_link a:link,
.gp_service_browser #gp_genomics_link a:visited {
  background-image: url("../images/gp_genomics_icon.png");
}

.gp_service_browser #gp_genomics_link a:hover,
.gp_service_browser #gp_genomics_link a:active {
  background-image: url("../images/gp_genomics_reverse_icon.png");
}

.gp_service_browser #gp_transcriptomics_link a:link,
.gp_service_browser #gp_transcriptomics_link a:visited {
  background-image: url("../images/gp_transcriptomics_icon.png");
}

.gp_service_browser #gp_transcriptomics_link a:hover,
.gp_service_browser #gp_transcriptomics_link a:active {
  background-image: url("../images/gp_transcriptomics_reverse_icon.png");
}

.gp_service_browser #gp_proteomics_link a:link,
.gp_service_browser #gp_proteomics_link a:visited {
  background-image: url("../images/gp_proteomics_icon.png");
}

.gp_service_browser #gp_proteomics_link a:hover,
.gp_service_browser #gp_proteomics_link a:active {
  background-image: url("../images/gp_proteomics_reverse_icon.png");
}

.gp_service_browser #gp_metabolomics_link a:link,
.gp_service_browser #gp_metabolomics_link a:visited {
  background-image: url("../images/gp_metabolomics_icon_MS.png");
}

.gp_service_browser #gp_metabolomics_link a:hover,
.gp_service_browser #gp_metabolomics_link a:active {
  background-image: url("../images/gp_metabolomics_reverse_icon.png");
}

.gp_service_browser #gp_bioinformatics_link a:link,
.gp_service_browser #gp_bioinformatics_link a:visited {
  background-image: url("../images/gp_bioinformatics_icon.png");
}

.gp_service_browser #gp_bioinformatics_link a:hover,
.gp_service_browser #gp_bioinformatics_link a:active {
  background-image: url("../images/gp_bioinformatics_reverse_icon.png");
}

.gp_service_browser #gp_nmr_link a:link,
.gp_service_browser #gp_nmr_link a:visited {
  background-image: url("../images/gp_metabolomics_icon_NMR.png");
}

.gp_service_browser #gp_nmr_link a:hover,
.gp_service_browser #gp_nmr_link a:active {
  background-image: url("../images/gp_metabolomics_reverse_icon.png");
}


/*
  SECTION: Style definitions for thumbnail gallery content components.

  Policy is:
    1. The thumbnail gallery is used to display a gallery of small images with text captions.
*/

.gp_gallery_item {
  float: left;
  width: 31%;
  margin-left: 2%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_course_gallery {
  width: 90%;
  *margin: 20px auto 20px auto;
}

.gp_course_gallery .gp_gallery_item {
  float: left;
  width: 22%;
  margin-left: 7%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_event_gallery {
  width: 90%;
  margin: 20px auto 20px auto;
}

.gp_event_gallery .gp_gallery_item {
  float: left;
  width: 31%;
  margin-left: 2%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_leaflet_gallery {
  width: 40%;
  margin: 10px auto 20px auto;
}

.gp_leaflet_gallery .gp_gallery_item {
  float: left;
  width: 43%;
  margin-left: 5%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_issf_gallery {
  width: 96%;
  margin: 10px auto 20px auto;
}

.gp_issf_gallery .gp_gallery_item {
  float: left;
  width: 47%;
  margin-left: 2%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_faqsheet_gallery {
  width: 80%;
  margin: 20px auto 20px auto;
}

.gp_faqsheet_gallery .gp_gallery_item {
  float: left;
  width: 22%;
  margin-left: 2%;
  margin-bottom: 3%;
  background: #00355f;
  border: solid 4px #00355f;
}

.gp_gallery_item a:link img,
.gp_gallery_item a:active img,
.gp_gallery_item a:visited img {
  display: block;
  width: 100%;
  height: auto;
  background: #f5f5f5; /* Background against which to display images with transparent regions */
  border: solid 1px #00355f; /* Matches gallery item border colour */
}

.gp_gallery_item a:hover img,
.gp_gallery_item a:focus img {
  border: solid 1px #f5f5f5;
}

.gp_gallery_item>img {
  display: block;
  width: 100%;
  height: auto;
  background: #f5f5f5; /* Background against which to display images with transparent regions */
  border: solid 1px #00355f; /* Matches gallery item border colour */
}

.gp_gallery_item .gp_caption {
  height: 60px;
  text-align: center;
}

.gp_course_gallery .gp_gallery_item .gp_caption {
  height: 60px;
  text-align: center;
  font-size: 11px;
}

.gp_event_gallery .gp_gallery_item .gp_caption {
  height: 60px;
  text-align: center;
  font-size: 12px;
}

.gp_leaflet_gallery .gp_gallery_item .gp_caption {
  height: 50px;
  text-align: center;
  font-size: 11px;
}

.gp_issf_gallery .gp_gallery_item .gp_caption {
  height: 30px;
  text-align: center;
  font-size: 14px;
}

.gp_faqsheet_gallery .gp_gallery_item .gp_caption {
  height: 50px;
  text-align: center;
  font-size: 11px;
}

.gp_gallery_item .gp_caption p {
  font-weight: bold;
  color: #e5e5e5;
}


/*
  SECTION: Style definitions for job vacancy content components.

  Policy is:
    1. Subheadings for vacancy description are displayed as white text on a coloured background.
    2. The colour of the subheadings is equal to the colour used for the page tab.
    3. All subheadings align to the left, and all descriptive text for the vacancy aligns to the left.
*/

.gp_vacancy_item {
  margin: 5px 0px 5px 0px;
  border-radius: 8px;
  border-style: solid;
  border-width: 1px;
}

.gp_vacancy_item {
  border-color: #00355f; /* Default colour shade for ancillary pages */
}

.gp_tab1_page .gp_vacancy_item {
  border-color: #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page .gp_vacancy_item {
  border-color: #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page .gp_vacancy_item {
  border-color: #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page .gp_vacancy_item {
  border-color: #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page .gp_vacancy_item {
  border-color: #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab6_page .gp_vacancy_item {
  border-color: #78add7; /* Specific colour shade for sixth tab pages */
}

.gp_vacancy_item .media-body {
  padding-top: 10px; /* Align to media icon */
}

.gp_vacancy_item dl {
  margin: 0px 10px 10px 10px;
}

.gp_vacancy_item dt {
  float: left;
  clear: left;
  width: 100px;
  padding: 2px 5px 2px 5px;
  margin-bottom: 5px;
  color: #ffffff;
}

.gp_vacancy_item dt {
  background-color: #00355f; /* Default colour shade for ancillary pages */
}

.gp_tab1_page .gp_vacancy_item dt {
  background-color: #00355f; /* Specific colour shade for first tab pages */
}

.gp_tab2_page .gp_vacancy_item dt {
  background-color: #184d77; /* Specific colour shade for second tab pages */
}

.gp_tab3_page .gp_vacancy_item dt {
  background-color: #30658f; /* Specific colour shade for third tab pages */
}

.gp_tab4_page .gp_vacancy_item dt {
  background-color: #487da7; /* Specific colour shade for fourth tab pages */
}

.gp_tab5_page .gp_vacancy_item dt {
  background-color: #6095bf; /* Specific colour shade for fifth tab pages */
}

.gp_tab5_page .gp_vacancy_item dt {
  background-color: #78add7; /* Specific colour shade for sixth tab pages */
}

.gp_vacancy_item dd {
  padding: 2px 5px 2px 5px;
  margin: 0px 0px 5px 120px;
  color: #000000;
}


/*
  SECTION: Style definitions for general table content components.

  Policy is:
    1. The colour used for table headers and other textual elements is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
    2. Linear colour gradients are used for the header and footer to give a bracketing effect.
    3. Tables are fixed in width to give a consistent feel when switching between tables containing related content.
    4. Columns are not fixed in width, but vary depending on the content.
*/

.gp_table {
  width: 90%;
  margin: 10px auto 10px auto;
  border-collapse: collapse;
}

.gp_table th {
  font-size: 14px;
  text-align: left;
  vertical-align: top;
  padding: 8px 10px 8px 10px;
  border-top: 1px solid #333333;
  border-bottom: 1px solid #333333;
  color: #ffffff;
}

.gp_table td {
  font-size: 14px;
  text-align: left;
  padding: 8px 10px 8px 10px;
  border-top: 1px solid #333333;
  border-bottom: 1px solid #333333;
}

.gp_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

#gp_home_page .gp_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Specific colour for home page */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

.gp_tab1_page .gp_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #00355f, #e5e5e5); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(top, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00355f', endColorstr='#e5e5e5');
}

.gp_tab2_page .gp_table th {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #184d77, #e5e5e5); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(top, #184d77, #e5e5e5);
  background: -moz-linear-gradient(top, #184d77, #e5e5e5);
  background: -o-linear-gradient(top, #184d77, #e5e5e5);
  background: -ms-linear-gradient(top, #184d77, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#184d77', endColorstr='#e5e5e5');
}

.gp_tab3_page .gp_table th {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #30658f, #e5e5e5); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(top, #30658f, #e5e5e5);
  background: -moz-linear-gradient(top, #30658f, #e5e5e5);
  background: -o-linear-gradient(top, #30658f, #e5e5e5);
  background: -ms-linear-gradient(top, #30658f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#30658f', endColorstr='#e5e5e5');
}

.gp_tab4_page .gp_table th {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #487da7, #e5e5e5); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(top, #487da7, #e5e5e5);
  background: -moz-linear-gradient(top, #487da7, #e5e5e5);
  background: -o-linear-gradient(top, #487da7, #e5e5e5);
  background: -ms-linear-gradient(top, #487da7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#487da7', endColorstr='#e5e5e5');
}

.gp_tab5_page .gp_table th {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #6095bf, #e5e5e5); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(top, #6095bf, #e5e5e5);
  background: -moz-linear-gradient(top, #6095bf, #e5e5e5);
  background: -o-linear-gradient(top, #6095bf, #e5e5e5);
  background: -ms-linear-gradient(top, #6095bf, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6095bf', endColorstr='#e5e5e5');
}

.gp_tab6_page .gp_table th {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #78add7, #e5e5e5); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(top, #78add7, #e5e5e5);
  background: -moz-linear-gradient(top, #78add7, #e5e5e5);
  background: -o-linear-gradient(top, #78add7, #e5e5e5);
  background: -ms-linear-gradient(top, #78add7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#78add7', endColorstr='#e5e5e5');
}

.gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #00355f, #e5e5e5); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
}

#gp_home_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #00355f, #e5e5e5); /* Specific colour for home page */
  background: -webkit-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
}

.gp_tab1_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #00355f, #e5e5e5); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #00355f, #e5e5e5);
}

.gp_tab2_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #184d77, #e5e5e5); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #184d77, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #184d77, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #184d77, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #184d77, #e5e5e5);
}

.gp_tab3_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #30658f, #e5e5e5); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #30658f, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #30658f, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #30658f, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #30658f, #e5e5e5);
}

.gp_tab4_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #487da7, #e5e5e5); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #487da7, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #487da7, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #487da7, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #487da7, #e5e5e5);
}

.gp_tab5_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #6095bf, #e5e5e5); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #6095bf, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #6095bf, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #6095bf, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #6095bf, #e5e5e5);
}

.gp_tab6_page .gp_table td.gp_row_title {
  color: #ffffff; /* Fallback in case of no gradient support in older browsers */
  font-weight: bold;
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(top, #e5e5e5, #78add7, #e5e5e5); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(top, #e5e5e5, #78add7, #e5e5e5);
  background: -moz-linear-gradient(top, #e5e5e5, #78add7, #e5e5e5);
  background: -o-linear-gradient(top, #e5e5e5, #78add7, #e5e5e5);
  background: -ms-linear-gradient(top, #e5e5e5, #78add7, #e5e5e5);
}

.gp_table tfoot td {
  font-size: 12px;
  font-style: italic;
  text-align: center;
  padding: 15px 10px 10px 10px;
  color: #ffffff;
}

.gp_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #e5e5e5); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -moz-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -o-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -ms-linear-gradient(bottom, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

#gp_home_page .gp_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #e5e5e5); /* Specific colour for home page */
  background: -webkit-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -moz-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -o-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -ms-linear-gradient(bottom, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab1_page .gp_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #e5e5e5); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -moz-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -o-linear-gradient(bottom, #00355f, #e5e5e5);
  background: -ms-linear-gradient(bottom, #00355f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab2_page .gp_table tfoot td {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #184d77, #e5e5e5); /* Specific colour for workflow page */
  background: -webkit-linear-gradient(bottom, #184d77, #e5e5e5);
  background: -moz-linear-gradient(bottom, #184d77, #e5e5e5);
  background: -o-linear-gradient(bottom, #184d77, #e5e5e5);
  background: -ms-linear-gradient(bottom, #184d77, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#184d77');
}

.gp_tab3_page .gp_table tfoot td {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #30658f, #e5e5e5); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(bottom, #30658f, #e5e5e5);
  background: -moz-linear-gradient(bottom, #30658f, #e5e5e5);
  background: -o-linear-gradient(bottom, #30658f, #e5e5e5);
  background: -ms-linear-gradient(bottom, #30658f, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#30658f');
}

.gp_tab4_page .gp_table tfoot td {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #487da7, #e5e5e5); /* Specific colour for fourth tab page */
  background: -webkit-linear-gradient(bottom, #487da7, #e5e5e5);
  background: -moz-linear-gradient(bottom, #487da7, #e5e5e5);
  background: -o-linear-gradient(bottom, #487da7, #e5e5e5);
  background: -ms-linear-gradient(bottom, #487da7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#487da7');
}

.gp_tab5_page .gp_table tfoot td {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #6095bf, #e5e5e5); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(bottom, #6095bf, #e5e5e5);
  background: -moz-linear-gradient(bottom, #6095bf, #e5e5e5);
  background: -o-linear-gradient(bottom, #6095bf, #e5e5e5);
  background: -ms-linear-gradient(bottom, #6095bf, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#6095bf');
}

.gp_tab6_page .gp_table tfoot td {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #78add7, #e5e5e5); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(bottom, #78add7, #e5e5e5);
  background: -moz-linear-gradient(bottom, #78add7, #e5e5e5);
  background: -o-linear-gradient(bottom, #78add7, #e5e5e5);
  background: -ms-linear-gradient(bottom, #78add7, #e5e5e5);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#78add7');
}

.gp_table td a:link,
.gp_table td a:active,
.gp_table td a:focus,
.gp_table td a:visited {
  outline: none;
}

.gp_table tfoot td a:link,
.gp_table tfoot td a:active,
.gp_table tfoot td a:focus,
.gp_table tfoot td a:visited {
  color: #e5e5e5;
  outline: none;
}


/*
  SECTION: Style definitions for feature table content components.

  Policy is:
    1. The colour used for table headers, row headers and other textual elements is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
    2. Linear colour gradients are used for the header and footer to give a bracketing effect.
    3. Row headers are coloured to fit in the bracket of the header and footer.
    4. Tables are fixed in width to give a consistent feel when switching between tables containing related content.
    5. Columns are not fixed in width, but vary depending on the content.
*/

.gp_feature_table {
  width: 90%;
  margin: 10px auto 10px auto;
  border-collapse: separate;
  border-spacing: 1px;
}

.gp_feature_table th {
  font-size: 14px;
  text-align: center;
  vertical-align: top;
  padding: 8px 10px 8px 10px;
  color: #ffffff;
}

.gp_feature_table td {
  font-size: 14px;
  text-align: left;
  padding: 8px 10px 8px 10px;
}

.gp_feature_table td.gp_row_title {
  width: 30%;
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
  text-align: right;
  padding: 8px 10px 8px 10px;
  background: #00355f;
  color: #ffffff;
}

.gp_feature_table td.gp_row_title {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

#gp_home_page .gp_feature_table td.gp_row_title {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for services page */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab1_page .gp_feature_table td.gp_row_title {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab2_page .gp_feature_table td.gp_row_title {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab3_page .gp_feature_table td.gp_row_title {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab4_page .gp_feature_table td.gp_row_title {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab5_page .gp_feature_table td.gp_row_title {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_tab6_page .gp_feature_table td.gp_row_title {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #90c5ff); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -moz-linear-gradient(left, #e5e5e5, #90c5ff);
  background: -o-linear-gradient(right, #e5e5e5, #90c5ff);
  background: -ms-linear-gradient(right, #e5e5e5, #90c5ff);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#90c5ff');
}

.gp_feature_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

#gp_home_page .gp_feature_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Specific colour for home page */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab1_page .gp_feature_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab2_page .gp_feature_table th {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #184d77); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #184d77);
  background: -moz-linear-gradient(left, #e5e5e5, #184d77);
  background: -o-linear-gradient(left, #e5e5e5, #184d77);
  background: -ms-linear-gradient(left, #e5e5e5, #184d77);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#184d77');
}

.gp_tab3_page .gp_feature_table th {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #30658f); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #30658f);
  background: -moz-linear-gradient(left, #e5e5e5, #30658f);
  background: -o-linear-gradient(left, #e5e5e5, #30658f);
  background: -ms-linear-gradient(left, #e5e5e5, #30658f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#30658f');
}

.gp_tab4_page .gp_feature_table th {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #487da7); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #487da7);
  background: -moz-linear-gradient(left, #e5e5e5, #487da7);
  background: -o-linear-gradient(left, #e5e5e5, #487da7);
  background: -ms-linear-gradient(left, #e5e5e5, #487da7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#487da7');
}

.gp_tab5_page .gp_feature_table th {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #6095bf); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #6095bf);
  background: -moz-linear-gradient(left, #e5e5e5, #6095bf);
  background: -o-linear-gradient(left, #e5e5e5, #6095bf);
  background: -ms-linear-gradient(left, #e5e5e5, #6095bf);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#6095bf');
}

.gp_tab6_page .gp_feature_table th {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #78add7); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #78add7);
  background: -moz-linear-gradient(left, #e5e5e5, #78add7);
  background: -o-linear-gradient(left, #e5e5e5, #78add7);
  background: -ms-linear-gradient(left, #e5e5e5, #78add7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#78add7');
}

.gp_feature_table tfoot td {
  font-size: 12px;
  font-style: italic;
  text-align: center;
  padding: 15px 10px 10px 10px;
  color: #ffffff;
}

.gp_feature_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

#gp_home_page .gp_feature_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Specific colour for home page */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab1_page .gp_feature_table tfoot td {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #00355f); /* Default colour for first tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #00355f);
  background: -moz-linear-gradient(left, #e5e5e5, #00355f);
  background: -o-linear-gradient(left, #e5e5e5, #00355f);
  background: -ms-linear-gradient(left, #e5e5e5, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#00355f');
}

.gp_tab2_page .gp_feature_table tfoot td {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #184d77); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #184d77);
  background: -moz-linear-gradient(left, #e5e5e5, #184d77);
  background: -o-linear-gradient(left, #e5e5e5, #184d77);
  background: -ms-linear-gradient(left, #e5e5e5, #184d77);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#184d77');
}

.gp_tab3_page .gp_feature_table tfoot td {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #30658f); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #30658f);
  background: -moz-linear-gradient(left, #e5e5e5, #30658f);
  background: -o-linear-gradient(left, #e5e5e5, #30658f);
  background: -ms-linear-gradient(left, #e5e5e5, #30658f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#30658f');
}

.gp_tab4_page .gp_feature_table tfoot td {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #487da7); /* Specific colour for fourth tabs page */
  background: -webkit-linear-gradient(left, #e5e5e5, #487da7);
  background: -moz-linear-gradient(left, #e5e5e5, #487da7);
  background: -o-linear-gradient(left, #e5e5e5, #487da7);
  background: -ms-linear-gradient(left, #e5e5e5, #487da7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#487da7');
}

.gp_tab5_page .gp_feature_table tfoot td {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #6095bf); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #6095bf);
  background: -moz-linear-gradient(left, #e5e5e5, #6095bf);
  background: -o-linear-gradient(left, #e5e5e5, #6095bf);
  background: -ms-linear-gradient(left, #e5e5e5, #6095bf);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#6095bf');
}

.gp_tab6_page .gp_feature_table tfoot td {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #e5e5e5, #78add7); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(left, #e5e5e5, #78add7);
  background: -moz-linear-gradient(left, #e5e5e5, #78add7);
  background: -o-linear-gradient(left, #e5e5e5, #78add7);
  background: -ms-linear-gradient(left, #e5e5e5, #78add7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#78add7');
}

.gp_feature_table td a:link,
.gp_feature_table td a:active,
.gp_feature_table td a:focus,
.gp_feature_table td a:visited {
  outline: none;
}


/*
  SECTION: Style definitions for comparison table content components.

  Policy is:
    1. The colour used for table headers and other textual elements is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
    2. Linear colour gradients are used for the header and footer to give a bracketing effect.
    3. Tables are fixed in width to give a consistent feel when switching between tables containing related content.
    4. Columns are not fixed in width, but vary depending on the content.
*/

.gp_comparison_table {
  width: 90%;
  margin: 10px auto 10px auto;
  border-collapse: separate;
  border-spacing: 4px;
}

.gp_comparison_table th {
  font-size: 14px;
  text-align: center;
  vertical-align: top;
  padding: 8px 10px 8px 10px;
  color: #ffffff;
}

.gp_comparison_table .gp_gap {
  background: transparent !important;
}

.gp_comparison_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #959595); /* Default colour for ancillary pages */
  background: -webkit-linear-gradient(bottom, #00355f, #959595);
  background: -moz-linear-gradient(bottom, #00355f, #959595);
  background: -o-linear-gradient(bottom, #00355f, #959595);
  background: -ms-linear-gradient(bottom, #00355f, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f');
}

#gp_home_page .gp_comparison_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #959595); /* Specific colour for home page */
  background: -webkit-linear-gradient(bottom, #00355f, #959595);
  background: -moz-linear-gradient(bottom, #00355f, #959595);
  background: -o-linear-gradient(bottom, #00355f, #959595);
  background: -ms-linear-gradient(bottom, #00355f, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f');
}

.gp_tab1_page .gp_comparison_table th {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #00355f, #959595); /* Specific colour for first tab pages */
  background: -webkit-linear-gradient(bottom, #00355f, #959595);
  background: -moz-linear-gradient(bottom, #00355f, #959595);
  background: -o-linear-gradient(bottom, #00355f, #959595);
  background: -ms-linear-gradient(bottom, #00355f, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f');
}

.gp_tab2_page .gp_comparison_table th {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #184d77, #959595); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(bottom, #184d77, #959595);
  background: -moz-linear-gradient(bottom, #184d77, #959595);
  background: -o-linear-gradient(bottom, #184d77, #959595);
  background: -ms-linear-gradient(bottom, #184d77, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#184d77');
}

.gp_tab3_page .gp_comparison_table th {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #30658f, #959595); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(bottom, #30658f, #959595);
  background: -moz-linear-gradient(bottom, #30658f, #959595);
  background: -o-linear-gradient(bottom, #30658f, #959595);
  background: -ms-linear-gradient(bottom, #30658f, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#30658f');
}

.gp_tab4_page .gp_comparison_table th {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #487da7, #959595); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(bottom, #487da7, #959595);
  background: -moz-linear-gradient(bottom, #487da7, #959595);
  background: -o-linear-gradient(bottom, #487da7, #959595);
  background: -ms-linear-gradient(bottom, #487da7, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#487da7');
}

.gp_tab5_page .gp_comparison_table th {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #6095bf, #959595); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(bottom, #6095bf, #959595);
  background: -moz-linear-gradient(bottom, #6095bf, #959595);
  background: -o-linear-gradient(bottom, #6095bf, #959595);
  background: -ms-linear-gradient(bottom, #6095bf, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#6095bf');
}

.gp_tab6_page .gp_comparison_table th {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(bottom, #78add7, #959595); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(bottom, #78add7, #959595);
  background: -moz-linear-gradient(bottom, #78add7, #959595);
  background: -o-linear-gradient(bottom, #78add7, #959595);
  background: -ms-linear-gradient(bottom, #78add7, #959595);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#78add7');
}

.gp_comparison_table tfoot td {
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  padding: 15px 10px 10px 10px;
  color: #ffffff;
}

.gp_comparison_table tfoot td {
  background: #00355f; /* Default colour for ancillary pages */
}

#gp_home_page .gp_comparison_table tfoot td {
  background: #00355f; /* Specific colour for home page */
}

.gp_tab1_page .gp_comparison_table tfoot td {
  background: #00355f; /* Specific colour for first tab pages */
}

.gp_tab2_page .gp_comparison_table tfoot td {
  background: #184d77; /* Specific colour for second tab pages */
}

.gp_tab3_page .gp_comparison_table tfoot td {
  background: #30658f; /* Specific colour for third tab pages */
}

.gp_tab4_page .gp_comparison_table tfoot td {
  background: #487da7; /* Specific colour for fourth tab pages */
}

.gp_tab5_page .gp_comparison_table tfoot td {
  background: #6095bf; /* Specific colour for fifth tab pages */
}

.gp_tab6_page .gp_comparison_table tfoot td {
  background: #78add7; /* Specific colour for sixth tab pages */
}

.gp_comparison_table td {
  font-size: 14px;
  text-align: center;
  padding: 8px 10px 8px 10px;
  background: #ffffff;
}

.gp_comparison_table td.gp_criterion {
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
  text-align: right;
  padding: 8px 10px 8px 10px;
  background: #00355f;
  color: #ffffff;
}

.gp_comparison_table td.gp_criterion {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #00355f); /* Default colour for ancillary page */
  background: -webkit-linear-gradient(left, #959595, #00355f);
  background: -moz-linear-gradient(left, #959595, #00355f);
  background: -o-linear-gradient(left, #959595, #00355f);
  background: -ms-linear-gradient(left, #959595, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f', GradientType='1');
}

#gp_home_page .gp_comparison_table td.gp_criterion {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #00355f); /* Specific colour for home page */
  background: -webkit-linear-gradient(left, #959595, #00355f);
  background: -moz-linear-gradient(left, #959595, #00355f);
  background: -o-linear-gradient(left, #959595, #00355f);
  background: -ms-linear-gradient(left, #959595, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f', GradientType='1');
}

.gp_tab1_page .gp_comparison_table td.gp_criterion {
  background-color: #00355f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #00355f); /* Specific colour for first tab page */
  background: -webkit-linear-gradient(left, #959595, #00355f);
  background: -moz-linear-gradient(left, #959595, #00355f);
  background: -o-linear-gradient(left, #959595, #00355f);
  background: -ms-linear-gradient(left, #959595, #00355f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#00355f', GradientType='1');
}

.gp_tab2_page .gp_comparison_table td.gp_criterion {
  background-color: #184d77; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #184d77); /* Specific colour for second tab pages */
  background: -webkit-linear-gradient(left, #959595, #184d77);
  background: -moz-linear-gradient(left, #959595, #184d77);
  background: -o-linear-gradient(left, #959595, #184d77);
  background: -ms-linear-gradient(left, #959595, #184d77);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#184d77', GradientType='1');
}

.gp_tab3_page .gp_comparison_table td.gp_criterion {
  background-color: #30658f; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #30658f); /* Specific colour for third tab pages */
  background: -webkit-linear-gradient(left, #959595, #30658f);
  background: -moz-linear-gradient(left, #959595, #30658f);
  background: -o-linear-gradient(left, #959595, #30658f);
  background: -ms-linear-gradient(left, #959595, #30658f);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#30658f', GradientType='1');
}

.gp_tab4_page .gp_comparison_table td.gp_criterion {
  background-color: #487da7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #487da7); /* Specific colour for fourth tab pages */
  background: -webkit-linear-gradient(left, #959595, #487da7);
  background: -moz-linear-gradient(left, #959595, #487da7);
  background: -o-linear-gradient(left, #959595, #487da7);
  background: -ms-linear-gradient(left, #959595, #487da7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#487da7', GradientType='1');
}

.gp_tab5_page .gp_comparison_table td.gp_criterion {
  background-color: #6095bf; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #6095bf); /* Specific colour for fifth tab pages */
  background: -webkit-linear-gradient(left, #959595, #6095bf);
  background: -moz-linear-gradient(left, #959595, #6095bf);
  background: -o-linear-gradient(left, #959595, #6095bf);
  background: -ms-linear-gradient(left, #959595, #6095bf);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#6095bf', GradientType='1');
}

.gp_tab6_page .gp_comparison_table td.gp_criterion {
  background-color: #78add7; /* Fallback in case of no gradient support in older browsers */
  background: linear-gradient(left, #959595, #78add7); /* Specific colour for sixth tab pages */
  background: -webkit-linear-gradient(left, #959595, #78add7);
  background: -moz-linear-gradient(left, #959595, #78add7);
  background: -o-linear-gradient(left, #959595, #78add7);
  background: -ms-linear-gradient(left, #959595, #78add7);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#78add7', GradientType='1');
}

.gp_comparison_table td a:link,
.gp_comparison_table td a:active,
.gp_comparison_table td a:focus,
.gp_comparison_table td a:visited {
  outline: none;
}


/*
  SECTION: Style definitions for panel content navigator components that are used to select between the display of 
           alternative content in a given content panel.

  Policy is:
    1. Panel content selector buttons are displayed in a row centred in the panel.
    2. A border is used to separate visually the selector buttons from the selected content.
    3. The currently active selector is assigned a highlight colour for visual feedback.
    4. The colour used for the active selector and other textual elements is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
*/

.gp_panel_navigator {
  width: 100%;
  text-align: center;
  padding-bottom: 20px;
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  border-bottom: solid 1px #e5e5e5; /* Separator between selectors and selected content */
}

.gp_panel_navigator .gp_selector {
  cursor: pointer;
  padding: 5px;
  margin-top: 5px;
  font-size: 12px;
  text-decoration: none;
  background-color: #ffffff;
  color: #00355f; /* Default colour for ancillary pages */
  border: solid 1px #00355f;
}

#gp_home_page .gp_panel_navigator .gp_selector {
  color: #00355f; /* Specific colour for home page */
  border: solid 1px #00355f;
}

.gp_tab1_page .gp_panel_navigator .gp_selector {
  color: #00355f; /* Specific colour for first tab pages */
  border: solid 1px #00355f;
}

.gp_tab2_page .gp_panel_navigator .gp_selector {
  color: #184d77; /* Specific colour for second tab pages */
  border: solid 1px #184d77;
}

.gp_tab3_page .gp_panel_navigator .gp_selector {
  color: #30658f; /* Specific colour for third tab pages */
  border: solid 1px #30658f;
}

.gp_tab4_page .gp_panel_navigator .gp_selector {
  color: #487da7; /* Specific colour for fourth tab pages */
  border: solid 1px #487da7;
}

.gp_tab5_page .gp_panel_navigator .gp_selector {
  color: #6095bf; /* Specific colour for fifth tab pages */
  border: solid 1px #6095bf;
}

.gp_tab6_page .gp_panel_navigator .gp_selector {
  color: #78add7; /* Specific colour for sixth tab pages */
  border: solid 1px #78add7;
}

.gp_panel_navigator .gp_selector:hover {
  text-decoration: underline;
}


/*
  SECTION: Style definitions for FAQ sheet content components.

  Policy is:
    1. Questions are styled in the normal style for embedded text links.
    2. Answers are displayed against a coloured background block for visual highlighting.
    3. The colour used for the answer background is set to the different colour shade used for the corresponding page to maintain the thematic identity of each separate page.
    4. Answer text is displayed in white to stand out against the coloured background.
    5. Links embedded in the answer text are displayed in a light blue to stand out against the coloured background.
    6. The answer block is offset on the left to provide visual separation of answers from questions.
*/

.gp_faq {
  margin-bottom: 10px;
}

.gp_faq_label {
  font-style: italic;
  margin-right: 5px;
  color: #0088cc; /* Matched to link colour. */
}

.gp_faq_a {
  margin-left: 20px;
  margin-right: 10px;
  padding: 4px;
  background-color: #184d77; /* Default offset colour shade for ancillary pages */
  border: solid 1px #00355f; /* Default colour shade for ancillary pages */
}

.gp_tab1_page .gp_faq_a {
  background-color: #184d77; /* Specific offset colour shade for first tab pages */
  border: solid 1px #00355f; /* Specific colour shade for first tab pages */
}

.gp_faq_a p,
.gp_faq_a ul,
.gp_faq_a ol {
  color: #ffffff;
}

.gp_faq_a a:link,
.gp_faq_a a:visited {
  color: #00aaee;
  text-decoration: underline;
}

.gp_faq_a a:hover,
.gp_faq_a a:focus,
.gp_faq_a a:active {
  color: #0088cc;
}


/*
  SECTION: Style definitions for workflow model content components.

  Policy is:
    1. Steps in the workflow are positioned in a clockface manner to form the the workflow cycle.
    2. Each step in the workflow can be assigned a separate colour shade.
    3. The text viewer is contained in the centre of the workflow cycle.
    4. The text viewer is fixed in size to ensure consistency when viewing the descriptions of each step.
*/

.gp_workflow {
  display: block;
  width: 500px;
  height: 450px;
  margin: 0px auto 0px auto;
  background: url(../images/workflow_cycle.png) no-repeat;
  position: relative;
}

.gp_workflow .gp_workflow_cycle {
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: url(../images/workflow_cycle.png) no-repeat;
}

.gp_workflow_cycle .gp_step1  {
  position: absolute;
  top: 31px;
  left: 195px;
}

.gp_workflow_cycle .gp_step2  {
  position: absolute;
  top: 83px;
  left: 340px;
}

.gp_workflow_cycle .gp_step3  {
  position: absolute;
  top: 160px;
  left: 385px;
}

.gp_workflow_cycle .gp_step4  {
  position: absolute;
  top: 238px;
  left: 385px;
}

.gp_workflow_cycle .gp_step5  {
  position: absolute;
  top: 315px;
  left: 340px;
}

.gp_workflow_cycle .gp_step6  {
  position: absolute;
  top: 367px;
  left: 195px;
}

.gp_workflow_cycle .gp_step7  {
  position: absolute;
  top: 315px;
  left: 55px;
}

.gp_workflow_cycle .gp_step8  {
  position: absolute;
  top: 238px;
  left: 10px;
}

.gp_workflow_cycle .gp_step9  {
  position: absolute;
  top: 160px;
  left: 10px;
}

.gp_workflow_cycle .gp_step10  {
  position: absolute;
  top: 83px;
  left: 55px;
}

.gp_workflow_cycle a {
  display: block;
  width: 110px;
  height: 42px;
  border-radius: 14px;
  padding: 10px 5px;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
  font-weight: bold;
  font-style: italic;
  cursor: pointer;
}

.gp_workflow_cycle .gp_step1 a {
  background-color: #ffd020; /* Colour shade for step 1 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step2 a {
  background-color: #ffc828; /* Colour shade for step 2 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step3 a {
  background-color: #ffc030; /* Colour shade for step 3 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step4 a {
  background-color: #ffb838; /* Colour shade for step 4 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step5 a {
  background-color: #ffb040; /* Colour shade for step 5 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step6 a {
  background-color: #ffa848; /* Colour shade for step 6 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step7 a {
  background-color: #ffa050; /* Colour shade for step 7 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step8 a {
  background-color: #ff9858; /* Colour shade for step 8 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step9 a {
  background-color: #ff9060; /* Colour shade for step 9 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow_cycle .gp_step10 a {
  background-color: #ff8868; /* Colour shade for step 9 */
  color: #00355f; /* Polyomics blue */
  border: solid 1px #00355f;
}

.gp_workflow .gp_workflow_viewer  {
  position: absolute;
  top: 140px;
  left: 130px;
  width: 240px;
  height: 160px;
  text-align: center;
  font-size: 12px;
  background-color: #ffffff;
  color: #00355f; /* Polyomics blue */
}

.gp_workflow .gp_workflow_viewer h1,
.gp_workflow .gp_workflow_viewer h2,
.gp_workflow .gp_workflow_viewer h3,
.gp_workflow .gp_workflow_viewer h4,
.gp_workflow .gp_workflow_viewer h5,
.gp_workflow .gp_workflow_viewer h6 {
  margin-top: 0px;
  margin-bottom: 0px;
  background-color: #00355f !important;
  color: #ffffff !important;
}

.gp_workflow .gp_workflow_key {
  text-align: center;
}

.gp_workflow .gp_planning_stage  a {
  background: #ddd020 !important;
  color: #00355f !important;
}

.gp_workflow .gp_sample_stage  a {
  background: #ddb028 !important;
  color: #00355f !important;
}

.gp_workflow .gp_analysis_stage  a {
  background: #dd9030 !important;
  color: #00355f !important;
}

.gp_workflow .gp_review_stage  a {
  background: #dd7038 !important;
  color: #00355f !important;
}

.gp_table .gp_planning_stage {
  font-style: italic;
  font-weight: bold;
  background: #ddd020;
  color: #00355f;
}

.gp_table .gp_sample_stage {
  font-style: italic;
  font-weight: bold;
  background: #ddb028;
  color: #00355f;
}

.gp_table .gp_analysis_stage {
  font-style: italic;
  font-weight: bold;
  background: #dd9030;
  color: #00355f;
}

.gp_table .gp_review_stage {
  font-style: italic;
  font-weight: bold;
  background: #dd7038;
  color: #00355f;
}


/*
  SECTION: Style definitions for the enquiry form components.

  Policy is:
    1. Textual input elements use a light grey background to highlight the data inputs.
    2. Forms are centred within the section that contains them.
    3. Support for an error message paragraph is included, although this  is initially hidden.  It could be displayed via JavaScript should it be required on a programmatic basis.
    4. Text for form error messages is displayed in the heading colour of the subsection to highlight the error.
*/

.gp_form fieldset {
  padding: 10px;
  margin: 20px 20px 0px 20px;
  background-color: #ffffff;
  border-radius: 8px;
  border: solid 1px #00355f; /* Polyomics blue */
}

.gp_form .gp_pattern{
  background-color: #ffffff;
  background: #ffffff url(../images/gp_pattern.png) top right no-repeat;
}

.gp_form fieldset legend {
  padding: 2px 10px 2px 10px;
  width: 160px;
  font-size: 16px;
  font-style: italic;
  font-weight: bold;
  background: transparent;
  color: #00355f;
  border: none;
}

.gp_form .gp_form_note {
  font-style: italic;
  text-align: center;
}

.gp_form textarea {
  resize: none;
}

.gp_form .gp_field {
  padding: 3px;
  background-color: #f5f5f5;
  border: solid 1px #00355f;
}

.gp_form .gp_field_small {
  display: none;
}

#gp_form_error {
  display: none;
}

.gp_form_error_report {
  font-size: 14px;
  font-style: italic;
  margin: 6px 0px 6px 0px;
  padding: 6px 0px 6px 0px;
  color: #cc3333 !important;
}

.gp_form .gp_button {
  margin-left: 20px;
  padding: 4px 20px 4px 20px;
  text-transform: capitalize;
  background-color: #00355f; /* Default colour for ancillary pages. */
  color: #ffffff;
  border-radius: 8px;
  border: solid 2px #f5f5f5
}

#gp_home_page .gp_form .gp_button {
  background-color: #00355f; /* Specific colour for home page. */
}

.gp_tab1_page .gp_form .gp_button {
  background-color: #00355f; /* Specific colour for first tab pages. */
}

.gp_tab2_page .gp_form .gp_button {
  background-color: #184d77; /* Specific colour for second tab pages. */
}

.gp_tab3_page .gp_form .gp_button {
  background-color: #30658f; /* Specific colour for third tab pages. */
}

.gp_tab4_page .gp_form .gp_button {
  background-color: #487da7; /* Specific colour for fourth tab pages. */
}

.gp_tab5_page .gp_form .gp_button {
  background-color: #6095bf; /* Specific colour for fifth tab pages. */
}

.gp_tab6_page .gp_form .gp_button {
  background-color: #78add7; /* Specific colour for sixth tab pages. */
}



/*
  SECTION: Style definitions for the scroll limiter components.

  Policy is:
    1. Scroll limiters are given a fixed position so tha they remain visible on screen.
*/

.gp_scroll_limiter {
  position: fixed;
  top: 240px;
}

/*
  SECTION: Style definitions for page footer elements.

  Policy is:
    1. The layout of the page footer is fixed to contain a funder acknowledgement area, a site notices area, and a company address area.
    2. The page footer has a light background consistent with the header, and designed to increase the visibility of the content.
    3. The funder acknowledgement area is positioned to the left of the footer on wider screens, and to the top of the footer for narrower screens.
    4. The funder acknowledgement area consists of a vertical set of partner logos acting as links to the associated partner's web site.
    5. The images for the partner logos vary in size around a base height of 40 pixels.  This variation in height is necessary in order to balance the perceived size of the text included within each logo.
    6. A black border line is displayed under the partner logo which is currently of interest (hovered on).
    7. The site notices area is positioned to the centre of the page on wider screens, and below the funder acknowledgement area on narrower screens.
    8. The site notices area contains textual navigation links to the associated pages for legal notices, cookie policy notices, etc.
    9. The company address area is positioned to the right of the footer for wider screens, and below the site notices area on narrower screens.
*/

footer {
  padding: 10px 30px 10px 30px;
  border-top: solid 2px #e5e5e5;
  background-color: #f5f5f5;
}

#gp_funder_bar {
  float: right;
  width: 200px;
  padding-right:20px;
}

#gp_funder_bar p {
  font-size: 10px;
  font-style: italic;
  font-weight: bold;
  padding-bottom: 0px;
  margin-top: 4px;
  margin-bottom: 0px;
}

#gp_funder_bar .gp_funder_logo {
  display: block;
  height: auto;
  width: 160px;
  margin: 16px 0px 24px 0px;
}

#gp_funder_bar .gp_funder_logo_medium {
  display: block;
  height: auto;
  width: 200px;
  margin: 16px 0px 24px 0px;
}

#gp_funder_bar .gp_prefixed {
  margin-top: 2px !important;
}

#gp_site_notices_bar {
  padding-top: 20px;
  text-align: center;
}

#gp_site_owner_bar {
  float: left;
  padding-top: 8px;
  padding-left: 20px;
}

#gp_site_owner_bar address {
  font-size: 11px;
}

#gp_site_owner_bar p {
  font-size: 10px;
  color: #184d77;
}