@font-face {
  font-family: 'Guardian Text Sans Web';
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.svg#GuardianTextSansWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

body,
html {
  margin: 0;
  font-family: 'Guardian Text Sans Web'; }

* {
  box-sizing: border-box; }

a {
  text-decoration: none; }

body {
  max-width: 420px;
  background-color: #fff; }

.select__wrapper {
  position: relative;
  border-top: 1px solid #dfdfdf;
  border-bottom: 1px solid #dfdfdf; }
  .select__wrapper:after {
    content: '';
    height: 18px;
    width: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: #dfdfdf; }

.select__header {
  padding: 4px 0; }

.select__content {
  position: relative;
  color: #333;
  font-family: 'Guardian Text Sans Web';
  font-weight: 400;
  font-size: 14px;
  line-height: 1.3;
  margin: 6px 0 0;
  padding: 5px;
  border-top: 1px solid #dfdfdf; }
  .select__content:before {
    content: '';
    height: 18px;
    width: 1px;
    position: absolute;
    right: 0;
    top: 0;
    background-color: #dfdfdf; }

.select-logo {
  max-width: 250px;
  margin-top: 4px;
  display: block; }

.select-logo__guardian,
.select-logo__tagline {
  fill: #333; }

.select__source {
  display: block;
  margin-bottom: 18px; }
  .select__source a {
    color: inherit;
    border-bottom: 1px solid transparent; }

.select__headline {
  display: block;
  font-size: 18px; }
  .select__headline a {
    color: #333;
    border-bottom: 1px solid transparent; }

.select__reason a {
  color: #333;
  border-bottom: 1px solid #333; }

.select__wrapper--news .select-logo__select {
  fill: #e20101; }

.select__wrapper--news .select-logo__bracket-upper {
  fill: #ae160c; }

.select__wrapper--news .select-logo__bracket-lower {
  fill: #ec4f36; }

.select__wrapper--news .select__source {
  color: #e20101; }

.select__wrapper--news .select__source a:hover,
.select__wrapper--news .select__headline a:hover,
.select__wrapper--news .select__reason a:hover {
  border-bottom-color: #ec4f36; }

.select__wrapper--news .select__reason a {
  border-bottom-color: #e20101; }

.select__wrapper--opinion .select-logo__select {
  fill: #ee6401; }

.select__wrapper--opinion .select-logo__bracket-upper {
  fill: #bf5302; }

.select__wrapper--opinion .select-logo__bracket-lower {
  fill: #f17e01; }

.select__wrapper--opinion .select__source {
  color: #ee6401; }

.select__wrapper--opinion .select__source a:hover,
.select__wrapper--opinion .select__headline a:hover,
.select__wrapper--opinion .select__reason a:hover {
  border-bottom-color: #f17e01; }

.select__wrapper--opinion .select__reason a {
  border-bottom-color: #ee6401; }

.select__wrapper--sport .select-logo__select {
  fill: #0083ca; }

.select__wrapper--sport .select-logo__bracket-upper {
  fill: #00558b; }

.select__wrapper--sport .select-logo__bracket-lower {
  fill: #3ea9e4; }

.select__wrapper--sport .select__source {
  color: #0083ca; }

.select__wrapper--sport .select__source a:hover,
.select__wrapper--sport .select__headline a:hover,
.select__wrapper--sport .select__reason a:hover {
  border-bottom-color: #3ea9e4; }

.select__wrapper--sport .select__reason a {
  border-bottom-color: #0083ca; }

.select__wrapper--lifestyle .select-logo__select {
  fill: #bf3682; }

.select__wrapper--lifestyle .select-logo__bracket-upper {
  fill: #7b1b6a; }

.select__wrapper--lifestyle .select-logo__bracket-lower {
  fill: #f3abcd; }

.select__wrapper--lifestyle .select__source {
  color: #bf3682; }

.select__wrapper--lifestyle .select__source a:hover,
.select__wrapper--lifestyle .select__headline a:hover,
.select__wrapper--lifestyle .select__reason a:hover {
  border-bottom-color: #f3abcd; }

.select__wrapper--lifestyle .select__reason a {
  border-bottom-color: #bf3682; }

.select__wrapper--arts .select-logo__select {
  fill: #ac8853; }

.select__wrapper--arts .select-logo__bracket-upper {
  fill: #6c583e; }

.select__wrapper--arts .select-logo__bracket-lower {
  fill: #ebcd9c; }

.select__wrapper--arts .select__source {
  color: #ac8853; }

.select__wrapper--arts .select__source a:hover,
.select__wrapper--arts .select__headline a:hover,
.select__wrapper--arts .select__reason a:hover {
  border-bottom-color: #ebcd9c; }

.select__wrapper--arts .select__reason a {
  border-bottom-color: #ac8853; }