/* --------------- System Tabs  --------------- */
.tabs ul.primary li a,
.tabs ul.primary li a:hover,
.tabs ul.primary li a:focus {
  background:#006898; /* background of tab - same as navigation */
  color:#fff;/* font colour of text on tabs */
  border:none; /* border colour around tabs - same as left & right on navigation */
  font-weight:bold; /* tab font weight */
}
.tabs ul.primary li a:hover,
.tabs ul.primary li a:focus {
  background:#003f5b; /* background of tab - same as navigation hover */
  color:#fff;
  border:none; /* border colour around tabs on hover - same as left & right on navigation */
}
.tabs ul.primary li.is-active a,
.tabs ul.primary li.is-active a:hover,
.tabs ul.primary li.is-active a:focus {
  background:#ffc700; /* background of tab - same as navigation hover */
  color:#006898;
  border:none; /* border colour around tabs on hover - same as left & right on navigation */
}
.tabs ul.secondary li a.active {
  background:#efefef;
}


@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 320px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (min-resolution: 192dpi) and (min-width: 320px),
only screen and (min-resolution: 2dppx) and (min-width: 320px) { 
  /* Mobile & Small screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 700px) {
  /* Tablet & Medium screen, non-retina */
  
  /* --------------- System Tabs  --------------- */
  .tabs ul.primary li a,
  .tabs ul.primary li a:hover,
  .tabs ul.primary li a:focus {
    border-bottom:none;
  }

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (-o-min-device-pixel-ratio: 2/1)  and (min-width: 700px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min-resolution: 192dpi) and (min-width: 700px),
only screen and (min-resolution: 2dppx) and (min-width: 700px) { 
  /* Tablet & Medium screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 1024px) {
  /* Desktop & Large screen, non-retina */

  /* --------------- System Tabs  --------------- */

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min-resolution: 192dpi) and (min-width: 1024px),
only screen and (min-resolution: 2dppx) and (min-width: 1024px) { 
  /* Desktop & Large screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 1280px) {
  /* Desktop & Extra Large screen, non-retina */

  /* --------------- System Tabs  --------------- */

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1280px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min-resolution: 192dpi) and (min-width: 1280px),
only screen and (min-resolution: 2dppx) and (min-width: 1280px) { 
  /* Desktop & Extra Large screen, retina, stuff to override above media query */

}
