@charset "utf-8";
/* CSS Document */

/*
Author  : We Sort / Ben Edmonds
URL     : wesort.co.uk
Twitter : @we_sort
*/

/* This stylesheet builds on top of reset-n-grid.css */

/**
 * @license
 * MyFonts Webfont Build ID 3330523, 2017-01-12T05:56:30-0500
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: TwCenMTStd-Bold by Monotype
 * URL: http://www.myfonts.com/fonts/mti/twentieth-century-mt/std-bold/
 * Copyright: Font software Copyright 1997 Adobe Systems Incorporated. Typeface designs Copyright 1997 The Monotype Corporation. All rights reserved.
 *
 * Webfont: Soleil-Bold by TypeTogether
 * URL: http://www.myfonts.com/fonts/type-together/soleil/bold/
 * Copyright: Copyright (c) 2011 by Wolfgang Homola, distributed by TypeTogether. All rights reserved.
 *
 * Webfont: Soleil by TypeTogether
 * URL: http://www.myfonts.com/fonts/type-together/soleil/regular/
 * Copyright: Copyright (c) 2011 by Wolfgang Homola, distributed by TypeTogether. All rights reserved.
 *
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3330523
 * Licensed pageviews: 250,000
 *
 * © 2017 MyFonts Inc
*/


/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/32d1db");


@font-face {font-family: 'TwCenMTStd-Bold';src: url('/assets/webfonts/32D1DB_0_0.eot');src: url('/assets/webfonts/32D1DB_0_0.eot?#iefix') format('embedded-opentype'),url('/assets/webfonts/32D1DB_0_0.woff2') format('woff2'),url('/assets/webfonts/32D1DB_0_0.woff') format('woff'),url('/assets/webfonts/32D1DB_0_0.ttf') format('truetype');}


@font-face {font-family: 'Soleil-Bold';src: url('/assets/webfonts/32D1DB_1_0.eot');src: url('/assets/webfonts/32D1DB_1_0.eot?#iefix') format('embedded-opentype'),url('/assets/webfonts/32D1DB_1_0.woff2') format('woff2'),url('/assets/webfonts/32D1DB_1_0.woff') format('woff'),url('/assets/webfonts/32D1DB_1_0.ttf') format('truetype');}


@font-face {font-family: 'Soleil';src: url('/assets/webfonts/32D1DB_2_0.eot');src: url('/assets/webfonts/32D1DB_2_0.eot?#iefix') format('embedded-opentype'),url('/assets/webfonts/32D1DB_2_0.woff2') format('woff2'),url('/assets/webfonts/32D1DB_2_0.woff') format('woff'),url('/assets/webfonts/32D1DB_2_0.ttf') format('truetype');}


html {
  height: 100%;
  min-height: 100%;
  overflow-y: scroll;
  scroll-behavior: smooth;
  --scroll-behavior: smooth;
 }
body {
  height: 100%;
  min-height: 100%;
  font-size: 1.25rem;
  line-height: 1.35;
  font-family: 'Soleil', Verdana, sans-serif;
  font-style: normal;
  font-feature-settings: "liga" 0, "clig" 0;
  -webkit-font-smoothing: antialiased;
  color: #000000;
}
img {
  width: 100%;
}
img.no-max {
  width: initial;
}
.print-only {
  display: none;
}
.ie-only.notice {
  font-size: 1rem;
  border: 1px solid #999999;
  padding: 0.5rem;
  margin-bottom: 1rem;
}


/* Colour Themes
---------------------------*/

/* Issue 1 */
.bg-yellow {
  background-color: #FFC400;
}
.text-yellow,
.bg-yellow .paypal-btn,
.bg-yellow .submit-button,
.bg-yellow #mc_embed_signup input
{
  color: #FFC400;
}

/* Issue 2 */
.bg-pink {
  background-color: #FF7387;
}
.text-pink,
.bg-pink .paypal-btn,
.bg-pink .submit-button,
.bg-pink #mc_embed_signup input
{
  color: #FF7387;
}

/* Issue 3 */
.bg-aqua {
  background-color: #50e1c2;
}
.text-aqua,
.bg-aqua .paypal-btn,
.bg-aqua .submit-button,
.bg-aqua #mc_embed_signup input
{
  color: #50e1c2;
}

/* Issue 4 */
.bg-152323 {
  background-color: #152323;
}
.text-cfdada {
    color: #cfdada;
}


/* Newsletter */
.bg-blue {
  background-color: #5da0e7;
}
.text-blue,
.bg-blue .paypal-btn,
.bg-blue .submit-button,
.bg-blue #mc_embed_signup input
{
  color: #5da0e7;
}

.bg-blue-dark {
  background-color: #2A53A1;
}
.bg-black {
  background-color: #000000;
}


/* Header, Homepage,  Footer
---------------------------*/
#page {
  margin:0 auto;
  padding: 1rem;
  max-width: 75rem;
  min-height: 100%;
}
header, header a, .button-wrap {
  font-family: 'TwCenMTStd-Bold', Verdana, sans-serif;
  border: none;
}
main .grid-col, header {
  margin-bottom: 1rem;
}
nav.first {
  display: inline-block;
  margin: 1rem auto;
}
nav li {
  display: inline-block;
  padding-right: 1rem;
}
nav li:last-child {
  padding-right: 0;
}
.logo-wrap {
  max-width: 75%;
}
.avatar-icon {
  /*margin-top: 1rem;*/
  width: 3rem;
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  cursor: pointer;
}
.mb-single {
  margin-bottom: 1rem !important;
}
.mb-double {
  margin-bottom: 2rem !important;
}
.mb-quad {
  margin-bottom: 4rem !important;
}
.image-wrap {
  position: relative;
}
.first-image {
  position: relative;
  top: 0;
  opacity: 1;
  transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
  -moz-transition: opacity 1s ease;
}
.second-image {
  position: absolute;
  top: 0;
  left: 0;
}
.img-swap:hover .first-image {
  opacity: 0;
  cursor: pointer;
}
.img-swap-auto .first-image {
  animation: img-swap-auto 5s ease infinite;
  opacity: 0;
  animation-direction: normal;
}
@keyframes img-swap-auto {
  0%   { opacity: 0; }
  50%  { opacity: 1; }
  60%  { opacity: 1; }
  100% { opacity: 0; }
}
.shop-cover-image {
  width: 100%;
  padding: 3rem 1rem;
}
.spread-image {
  /*margin-bottom: 0 !important;*/
}



/*  Typography
---------------------------*/
p {
  margin-bottom: 1rem;
}
p:last-child {
  margin-bottom: 0;
}
p {
  max-width: 50rem;
}
.quote p {
  margin-left: auto;
  margin-right: auto;
}
.left-indent p {
  margin-left: auto;
  margin-right: auto;
}
h1, h2 {
  font-weight: normal;
}
b, strong, .type-bold {
  font-family: 'Soleil-Bold', Verdana, sans-serif;
  font-weight: normal;
}
a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid;
}
a:hover ,
.current,
nav a:hover {
  color: #2A53A1;
}
.text-cfdada a:hover,
.text-cfdada .current,
.text-cfdada header a:hover  {
  color: #6492e7;
}
a.logo:hover {
    color: currentColor;
}



.type-center {
  text-align: center;
}
.type-large {
  font-size: 1.65rem;
  line-height: 1.2;
}
.type-uppercase {
  text-transform: uppercase;
}
.bullets {
  list-style: initial;
}
.bullets li {
  margin-left: 1rem;
}
.quote {
  margin: 2rem auto;
}

/*  PayPal
---------------------------*/
.button-wrap {
  position: relative;
  display: table;
  text-align: center;
  margin: -2rem auto 0;
  width: 100%;
  padding: 0 3rem;
}
.button-wrap tr {
  background: none !important;
}
.button-wrap table, .button-wrap td {
  border: none;
  padding: 0;
}
.paypal-btn {
  min-width: 100%;
  display: inline-block;
  color: #FFF;
  background: #000000;
  font-size: inherit;
  font-family: 'Soleil-Bold', Verdana, sans-serif;
  line-height: 1;
  text-align: center;
  padding: 0.9rem 1rem 0.75rem 1rem;
  margin-top: 2rem;
  border-radius: 0.25rem;
  border: 0;
  cursor: pointer;
  outline: none;
}
.button-wrap select {
  font-family: 'Soleil-Bold', Verdana, sans-serif;
  border: none;
  padding: 0.35rem 0.25rem 0.25rem 0.25rem;
  height: 1.75rem;
  border-radius: 0;
}

.submit-button,
#mc_embed_signup input {
  background: #000000;
}

.paypal-btn:disabled,
.paypal-btn[disabled] {
  cursor: not-allowed;
  background-color: #444;
}



/*  Mailchimp
---------------------------*/
.width-input {
  width: 20rem;
}
#mc_embed_signup label {
  display: inline-block;
  width: 10rem;
}
#mc_embed_signup input {
  font-family: 'Soleil', Verdana, sans-serif;
  font-size: inherit;
  border: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0.1rem 0.25rem;
  margin-bottom: 1rem;
}
#mc_embed_signup .submit-button {
  cursor: pointer;
  font-size: inherit;
  font-family: 'Soleil-Bold', Verdana, sans-serif;
  border-radius: 0.25rem;
  padding: 0.75rem 1rem 0.6rem;
}

.width-shipping {
  display: inline-block;
  width: 9rem;
}
.call-to-action {
  text-align: center;
  margin: 2rem auto;
  /*border: 0.25rem solid;*/
  padding: 2rem;
  max-width: 62rem;
  border-radius: 0.5rem;
}
.call-to-action p {
  /*text-align: left;*/
  max-width: initial;
  font-weight: 600;
}

/* ------------------------------------------------------------
                          BREAKPOINTS
---------------- Set here AND reset-n-grid.css  ---------------

/* -- Breakpoint (.bp1)
-- Same as above, but each class has ".bp1-" prefix
------------------------------------------------------------- */
@media only screen and (min-width: 30em) {
  .shop-cover-image {
    padding: 3rem;
  }
  .button-wrap {
    padding: 0 4.5rem;
  }
}
/* -- Breakpoint (.bp2)
------------------------------------------------------------- */
@media only screen and (min-width: 48em) {
  #page {
    padding: 2rem;
  }
  header {
    margin-bottom: 3rem;
  }
  main .grid-col {
    margin-bottom: 2rem;
  }
  nav.first {
    float: right;
    margin-top: -0.25rem;
  }
  .type-large .quote {
    font-size: 2.5rem;
  }
  .issue-1 .issue-title {
    height: 7rem;
  }
  .spec-creds {
    margin-left: 4rem;
    padding-right: 8rem;
  }
  .left-border {
    border-left: 0.25rem solid;
  }
  .button.standard, .button.special-edition {
    /*background: #001B2B;*/
    color: #FFC400;
  }
  .avatar-icon {
    /*float: right;*/
    /*margin-top: -4.75rem;*/
    width: 4rem;
    right: 2rem;
    bottom: 2rem;
  }
  .homepage footer {
    margin-top: -10rem;
  }
  .homepage footer {
    padding-right: 5rem;
  }
}



/* -- Breakpoint 3 (.bp3)
------------------------------------------------------------- */
@media only screen and (min-width: 75em) {

}

@media only screen and (min-width: 85em) {
  .avatar-icon {
    right: unset;
    left: calc(50% + 29em);
  }
}

/* -- Breakpoint 4 (.bp4)
------------------------------------------------------------- */
@media only screen and (min-width: 90em) {


}



/* Print specific styles
------------------------------------------------------------- */
@media print {
  /* Styles */
  .print-only {
    display: block;
  }
  .print-none {
    display: none;
  }
  * {
    -webkit-print-color-adjust: exact;
    background-color: none;
    color: #000000 !important;
    font-size: 18pt;
  }
  a {
    color: #666666 !important;
    text-decoration: none !important;
    border-bottom: none;
  }
  a:after {
    font-size: 10pt;
    content: " [" attr(href) "]";
    font-family: monospace;
    word-wrap: break-word;
  }

  img {
    display: block;
    page-break-inside: avoid !important;
  }


}


/*  END  */