@charset "UTF-8";

:root {
 --bg-light-gray:#ececec;
 --type-gray:#8e8e8e;
 --type-black:#1e1e1d;
 --heading-font:'BrownStd', Arial, Helvetica, sans-serif;
 --body-font:"Portrait";
}

/* Resets */

*, *:before, *:after {
  box-sizing: border-box;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}

input, button, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.clearfix:before, .clearfix:after {
  content: '';
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}

html, body {
  height: 100%;
  min-height: 100%;
}

html {
  font-size: 10px;
}

/* General */

body {
  background: #fff;
  color: #000;
  font-size: 15px;
  line-height: 1.4;
  font-family: 'BrownStd', Arial, Helvetica, sans-serif;
  display: flex;
  flex-direction: column;
}

.wrapper {
  text-align: center;
  letter-spacing: 1px;
  flex: 1;
}

header {
  font-size: 19px;
  line-height: 24px;
  font-weight: bold;
  padding: 32px 30px 28px;
  text-transform: uppercase;;
}

h1 {
  font-size: 32px;
  line-height: 42px;
  letter-spacing: 2px;
  padding-left: 2px;
  margin-bottom: 20px;
  text-transform: uppercase;
  font-weight: bold;
}

p {
  margin-bottom: 20px;
}

main section {
  background: #007A87;
  padding: 30px 38px;
  color: #fff;
}

main section form {
  background: #fff;
  padding: 30px 30px 6px;
  mix-width: 300px;
  box-shadow: 0 3px 3px rgba(0,0,0,0.6);
  margin: 0 auto;
  flex: 1;
}

main section form > div {
  margin-bottom: 24px;
}

main section form .disclaimer {
  background: #f2f2f2;
  padding: 20px 20px 10px;
}

main section form .disclaimer h6 {
  color: #004e5a;
  font-size: 14px;
  margin: 0 0 10px;
  letter-spacing: 0;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}

main section form .disclaimer p {
  color: #9b9b9b;
  font-size: 12px;
  margin: 0 0 10px;
  letter-spacing: 0;
  text-align: center;
}

main section form .disclaimer p a,
main section form .disclaimer p a:visited {
  color: #9b9b9b;
  text-decoration: none;
}

main section form .disclaimer p a:hover,
main section form .disclaimer p a:active,
main section form .disclaimer p a:focus {
  text-decoration: underline;
}

main section form input[type="text"] {
  font-family: 'BrownStd', Arial, Helvetica, sans-serif;
  font-size: 18px;
  letter-spacing: 1px;
  padding-left: 1px;
  border: 1px solid #656565;
  background: #fff;
  color: #004e5a;
  padding: 12px 20px 8px;
  border-radius: 0;
  display: block;
  width: 100%;
  text-transform: uppercase;
}

main section form input[type="text"]:focus {
  border-color: #007f87;
}

::-webkit-input-placeholder {
  color: #9b9b9b;
}
::-moz-placeholder {
  color: #9b9b9b;
}
:-ms-input-placeholder {
  color: #9b9b9b;
}
:-moz-placeholder {
  color: #9b9b9b;
}
::placeholder {
  color: #9b9b9b;
}

main section form input[type="submit"] {
  font-family: 'BrownStd', Arial, Helvetica, sans-serif;
  font-size: 18px;
  letter-spacing: 1px;
  border-radius: 0;
  background-color: #000;
  color: #fff;
  padding: 18px 20px 14px;
  text-transform: uppercase;
  border: none;
  width: 100%;
  text-decoration: none;
  transition: 250ms background-color ease;
  cursor: pointer;
}

main section form input[type="submit"]:hover,
main section form input[type="submit"]:active,
main section form input[type="submit"]:focus {
  background-color: #2b2b2b;
}

.styledCheckbox {
  margin-bottom: 15px;
}

.styledCheckbox input[type="checkbox"] {
  visibility: hidden;
  position: absolute;
  left: -9999px;
}

.styledCheckbox input[type="checkbox"]:checked + label {
  background: #004e5a;
  color: #fff;
}

.styledCheckbox input[type="checkbox"]:checked + label::after {
  font-family: FontAwesome;
  content: "\f00c";
  color: #fff;
  font-size: 24px;
  line-height: 24px;
  text-align: center;
  border: none;
}

.styledCheckbox label {
  font-family: 'BrownStd', Arial, Helvetica, sans-serif;
  border: 1px solid #004e5a;
  color: #004e5a;
  display: block;
  width: 105px;
  height: 38px;
  border-radius: 2px;
  padding: 11px 10px 6px 50px;
  font-size: 18px;
  line-height: 20px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 auto;
  text-align: left;
  cursor: pointer;
  position: relative;
}

.styledCheckbox label::after {
  content: " ";
  display: block;
  width: 30px;
  height: 20px;
  border: 1px solid #6e989e;
  position: absolute;
  top: 8px;
  left: 10px;
}

aside {
  padding: 30px;
}

aside > div {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 57.89%;
  position: relative;
}

aside > div span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
}

aside > div.culture {
  background-image: url('http://image.info.greenwichpeninsula.co.uk/lib/fe9213727761067477/m/2/20f759d6-197b-4e5c-af29-74c15a1adfd6.jpg');
}

aside > div.food {
  background-image: url('http://image.info.greenwichpeninsula.co.uk/lib/fe9213727761067477/m/2/2475591c-b5c7-457e-951e-e19dacd49e2e.jpg');
}

aside > div.downtime {
  background-image: url('http://image.info.greenwichpeninsula.co.uk/lib/fe9213727761067477/m/2/e80f4b95-e97f-4f2c-8cab-3c8779377245.jpg');
}

aside > div + div {
  margin-top: 30px;
}

._19Re a svg {
   fill: #9c9c9c;
   -webkit-transition: all .4s ease;
   -o-transition: all .4s ease;
   transition: all .4s ease
}

._19Re a svg,
._19Re a svg path {
  stroke: #9c9c9c
}

._19Re a svg path:last-of-type {
  fill: #9c9c9c
}

._19Re a:hover svg {
  fill: var(--type-black);
  -webkit-transition: all .4s ease;
  -o-transition: all .4s ease;
  transition: all .4s ease
}

._19Re a:hover svg,
._19Re a:hover svg path {
  stroke: var(--type-black)
}

._19Re a:hover svg path:last-of-type {
  fill: var(--type-black)
}

footer {
  --vertical-margin: 40px;
  --horizontal-margin: 1rem;
  --baseline-font-size: 16px;
  --baseline-line-height: 25px;
  --baseline-letter-spacing: 0.5px;
  --reduced-font-size: 13px;
  --reduced-font-letter-spacing: 2.5px;
  --reduced-font-line-height: 2.5px;
  background: var(--bg-light-gray);
  font-family: var(--heading-font);
  font-size: 12px;
  line-height: var(--baseline-line-height);
  letter-spacing: var(--baseline-letter-spacing);
  padding: 40px 1rem
}

footer p {
  color: var(--type-gray);
}

footer a {
  color: var(--type-gray);
  text-decoration: none;
  -webkit-transition: color .5s ease;
  -o-transition: color .5s ease;
  transition: color .5s ease;
  will-change: color
}

footer a:hover {
  color: var(--type-black)
}

footer .kdk4 {
  margin-bottom: 1rem;
  margin-bottom: var(--vertical-margin)
}

footer .kdk4 p span {
  display: inline-block;
  margin-right: 3px;
  text-transform: uppercase
}

footer .kdk4 p a {
  display: inline-block;
  margin-right: var(--horizontal-margin)
}

footer .kdk4 ._35LS {
  margin-bottom: var(--vertical-margin)
}

footer .kdk4 ._35LS p {
  font-size: 9px;
  letter-spacing: 2.77px;
  margin: 0;
  text-transform: uppercase
}

footer .kdk4 ._35LS a {
  font-size: var(--baseline-font-size);
  text-transform: none;
  letter-spacing: .5px
}

footer .kdk4 ._35LS .e-3P {
  color: var(--type-gray);
  font-size: var(--reduced-font-size);
  border: 1px solid;
  padding: 0 16px;
  min-width: 115px;
  border-radius: 16px;
  margin-bottom: 40px;
  text-transform: uppercase;
  letter-spacing: 2.5px;
}

footer .kdk4 ._35LS .e-3P:hover {
  color: var(--type-black);
}

footer .kdk4 ._35LS ._1QqV {
  font-family: var(--body-font);
}

footer .ZE_U p {
  margin:0;
  letter-spacing:1.3px;
}

footer ._3Ro5 {
  margin-bottom: var(--vertical-margin);
}

footer ._1PeS > div a {
  display: inline-block;
  padding: 5px 1rem 5px 0;
}

footer ._1PeS p {
  margin: 0;
}

@media (min-width:768px) {

  .wrapper {
    text-align: left;
  }

  header {
    padding-left: 38px;
    padding-right: 38px;
  }

  main {
    display: flex;
  }

  main section {
    flex: 1;
  }

  aside {
    padding-top: 0;
    width: 300px;
  }

  footer {
    --horizontal-margin:1rem;
    font-size: var(--reduced-font-size);
    padding: 40px 34px
  }

  footer .kdk4 {
    margin-bottom: calc(var(--vertical-margin)*1.5)
  }

  footer ._1PeS > div:first-of-type {
    margin-bottom: var(--vertical-margin)
  }

  footer ._1PeS > div:first-of-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }

  footer ._1PeS > div:first-of-type a {
    display: block;
    padding-right: 1rem
  }

  footer ._1PeS > div:last-of-type p {
    display: inline-block;
    margin: 0 1rem 0 0
  }
}

@media (min-width:1024px) {

  header {
    padding-left: 60px;
    padding-right: 60px;
  }

  h1 {
    font-size: 64px;
    line-height: 70px;
    letter-spacing: 4px;
    padding-left: 4px;
    margin-bottom: 40px;
  }

  main section {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  main section .content {
    flex: 1;
    margin-right: 20px;
    display: flex;
    max-width: 82rem;
  }

  main section .content .copy {
    margin-right: 6rem;
  }

  aside {
    width: 360px;
  }

  footer .kdk4 {
    margin-bottom: var(--vertical-margin)
  }

  footer ._1PeS {
    margin: 0
  }

  footer ._1PeS,
  footer ._1PeS > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }

  footer ._1PeS > div {
    width: 50%
  }

  footer ._1PeS > div a {
    display: block;
    padding-right: 1rem
  }

  footer ._1PeS > div:first-of-type {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin: 0
  }

  footer ._1PeS > div:last-of-type {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-align: right;
    width: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
  }

  footer ._1PeS > div:last-of-type p {
    margin: 0 1rem 0 0;
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0
  }

  footer ._1PeS > div:last-of-type a {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
  }
}

@media (min-width:1300px) {

  aside {
    width: 468px;
  }
}