/**
 * PONCHO.IS WEBSITE
 * ------------------------------------------------------------------------------------------------
 * Copyright 2018 Poncho Inc. All Rights Reserved.
 *
 */

/** --- WEBFONTS --- */
/**
 * @license
 * MyFonts Webfont Build ID 3355025, 2017-03-06T16:09:11-0500
 * MyFonts Webfont Build ID 3355065, 2017-03-06T16:34:17-0500 (Christian)
 *
 * 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: Gordon-Black by Letterbox
 * URL: http://www.myfonts.com/fonts/letterbox/gordon/gordon-black/
 * Copyright: Copyright (c) 2011 by Letterbox. All rights reserved.
 *
 * Webfont: BrandonTextWeb-Black by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/black/
 * Copyright: Copyright (c) 2015 by Hannes von Doehren. All rights reserved.
 *
 * Webfont: BrandonTextWeb-Italic by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/italic/
 * Copyright: Copyright (c) 2015 by Hannes von Doehren. All rights reserved.
 *
 * Webfont: BrandonTextWeb-Regular by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/regular/
 * Copyright: Copyright (c) 2015 by Hannes von Doehren. All rights reserved.
 *
 * Webfont: BrandonTextWeb-Medium by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/medium/
 * Copyright: Copyright (c) 2015 by Hannes von Doehren. All rights reserved.
 *
 * Webfont: BrandonTextWeb-Bold by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/bold/
 * Copyright: Copyright (c) 2015 by Hannes von Doehren. All rights reserved.
 * Licensed pageviews: 100,000
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=3351813
 * Licensed pageviews: 100,000
 *
 * © 2017 MyFonts Inc
*/

/** Gordon Black */
/*@font-face {font-family:'GordonWeb';font-weight:900;src:url('/assets/fonts/333191_0_0.eot');src:url('/assets/fonts/333191_0_0.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/333191_0_0.woff2') format('woff2'),url('/assets/fonts/333191_0_0.woff') format('woff'),url('/assets/fonts/333191_0_0.ttf') format('truetype');}*/
/** Brandon Text Regular */
@font-face {font-family:'BrandonTextWeb';font-weight:400;src:url('/assets/fonts/333191_3_0.eot');src:url('/assets/fonts/333191_3_0.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/333191_3_0.woff2') format('woff2'),url('/assets/fonts/333191_3_0.woff') format('woff'),url('/assets/fonts/333191_3_0.ttf') format('truetype');}
/** Brandon Text Medium */
@font-face {font-family:'BrandonTextWeb';font-weight:500;src:url('/assets/fonts/333191_4_0.eot');src:url('/assets/fonts/333191_4_0.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/333191_4_0.woff2') format('woff2'),url('/assets/fonts/333191_4_0.woff') format('woff'),url('/assets/fonts/333191_4_0.ttf') format('truetype');}
/** Brandon Text Bold */
@font-face {font-family:'BrandonTextWeb';font-weight:700;src:url('/assets/fonts/3331B9_0_0.eot');src:url('/assets/fonts/3331B9_0_0.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/3331B9_0_0.woff2') format('woff2'),url('/assets/fonts/3331B9_0_0.woff') format('woff'),url('/assets/fonts/3331B9_0_0.ttf') format('truetype');}



/** --- BASE STYLES --- */
* {
  -webkit-box-sizing:inherit;
  box-sizing:inherit;
}
html {
  font-size:62.5%;
  line-height:1.33em;
}
html, body {
  margin:0;
  padding:0;
  font-family:BrandonTextWeb,Helvetica,Arial,sans-serif;
  font-weight:400;
}
div {
  display:block;
}


/** --- TEMPLATE & UTILS --- */
body {
  min-height:100vh;
  background-color:#FFEF12;
  background-image:url(/assets/images/backgrounds/clear-day.svg);
  background-position:center center;
  background-attachment:fixed;
  background-size:cover;
  background-repeat:no-repeat;
}
#container {
  min-height:100vh;
  overflow-x:hidden;
}
.nowrap {
  white-space:nowrap;
}



/** --- HEADER --- */
#header {
  padding:3rem 3rem;
  overflow:hidden;
}
#header h1 {
  margin:0;
  padding:0;
  font-size:3rem;
  line-height:1em;
}
#header h1 a {}
#header h1 a img {
  display:inline-block;
  width:auto;
  height:3rem;
  margin:0;
  padding:0;
}


/** --- CONTENT AREA --- */
#content {
  position:relative;
  display:block;
  min-height:100vh;
  min-height:calc(100vh - 9rem - 19.4rem - 27rem);
  margin:0;
  padding:3rem 0 24rem 0;
}
#letter {
  display:block;
  max-width:62.5rem;
  margin:0 auto;
}
#letter--sheet {
  min-height:33vh;
  margin:0 0 2rem 0;
  padding:4.2rem;
  transform:rotate(-1.2deg);
  transform-origin:center center;
  background-color:#FFFFFF;
  box-shadow:0 1rem 2rem rgba(0,0,0,.18);
}
#letter--sheet h3 {
  margin:0;
  padding:0.4rem 0 0.6rem;
  color:#F46B24;
  font-size:3.2rem;
  line-height:1.4em;
}
#letter--sheet p {
  margin:0;
  padding:0.4rem 0;
  font-size:1.8rem;
  line-height:1.6em;
}
#letter--sheet q {
  font-weight:600;
}
#letter--sheet a {
  font-weight:700;
  color:#F46B24;
  text-decoration:underline;
}
#letter--sheet a:hover, #letter--sheet a:focus {
  color:#F7925C;
}
#letter--sheet p#letter--signature {
  padding-top:2.8rem;
  padding-bottom:1.2rem;
}
#letter--sheet p#letter--signature img {
  display:block;
  width:auto;
  height:3.6rem;
  margin:0;
  padding:0 0 1rem 0;
}
#letter--email-signup {
  margin:1.6rem 0 0 2rem;
  padding:3.2rem 4.2rem;
  transform:rotate(0.8deg);
  transform-origin:center center;
  background-color:#FFFFFF;
  text-align:center;
  box-shadow:0 1rem 2rem rgba(0,0,0,.18);
}
#letter--email-signup .clear {
  display:inline;
}
#letter--email-signup label {
  display:block;
  margin:0;
  padding:0 0 1.4rem 0;
  color:#F46B24;
  font-size:1.8rem;
  line-height:1.4em;
  font-weight:600;
}
#letter--email-signup input[type=email] {
  display:inline-block;
  min-width:45%;
  margin:0;
  padding:1rem 1.2rem;
  border:0.1rem solid #D6D6D6;
  color:#323232;
  outline:none;
  font-family:BrandonTextWeb,Helvetica,Arial,sans-serif;
  font-size:1.4rem;
}
#letter--email-signup input[type=email]::placeholder {
  color:#A2A2A2;
}
input[type=submit] {
  display:inline-block;
  margin:0 0 0 -0.4rem;
  padding:1rem 2rem;
  border:0.1rem solid #F46B24;
  outline:none;
  font-family:BrandonTextWeb,Helvetica,Arial,sans-serif;
  font-size:1.4rem;
  font-weight:600;
  color:#FFF;
  background-color:#F46B24;
}
input[type=submit]:focus, input[type=submit]:hover {
  background-color:#F7925C;
}
.letter-sticker {
  position:absolute;
  z-index:2;
  display:block;
  pointer-events:none;
  transform-origin:center center;
}
#letter-sticker--icecream {
  bottom:16rem;
  right:75%;
  right:calc(50% + 33rem);
  width:auto;
  height:23.3rem;
}
#letter-sticker--pizza {
  top:12rem;
  right:75%;
  right:calc(50% + 35rem);
  width:auto;
  height:26.1rem;
  transform:rotate(-6deg);
}
#letter-sticker--school {
  top:28rem;
  left:75%;
  left:calc(50% + 33rem);
  width:auto;
  height:22.0rem;
  transform:rotate(-8deg);
}
#letter-sticker--yay {
  bottom:-2rem;
  left:60%;
  left:calc(50% + 10rem);
  width:auto;
  height:23.8rem;
}
#unsubscribe-form .buttons {
  padding-top:2rem;
}


/** --- FOOTER --- */
#footer {
  position:relative;
  z-index:5;
  background-color:#FFFFFF;
  padding:4rem 3rem;
}
#footer p {
  margin:0;
  padding:0;
  text-align:center;
  color:#9B9B9B;
  font-size:1.3rem;
  line-height:1.5em;
}
#footer p img {
  display:inline-block;
  width:auto;
  height:8.5rem;
  margin:0 0 0.5rem 0;
  padding:0;
}


/** --- MOBILE OVERRIDES --- */
@media (max-width:925px) {
  #letter-sticker--pizza {
    right:64%;
    right:calc(50% + 32rem);
  }
  #letter-sticker--school {
    left:64%;
    left:calc(50% + 30.5rem);
  }
}
@media (max-width:768px) {
  #header {
    padding:2rem 1.5rem;
  }
  #header h1 a img {
    height:2rem;
  }
  #content {
    position:relative;
    display:block;
    min-height:100vh;
    min-height:calc(100vh - 6rem - 19.4rem - 9rem);
    padding:1rem 1.5rem 8rem 1.5rem;
  }
  #letter {
    width:100%;
    max-width:100%;
  }
  #letter--sheet {
    padding:2.4rem;
    transform:rotate(-0.5deg);
  }
  #letter--sheet h3 {
    font-size:2.4rem;
  }
  #letter--sheet p {
    font-size:1.4rem;
    line-height:1.75em;
  }
  #letter--sheet p#letter--signature img {
    height:2.4rem;
  }
  #letter--email-signup {
    margin:4.2rem 0 0 0;
    padding:2.4rem;
    transform:rotate(0.3deg);
  }
  #letter-sticker--icecream {
    bottom:36.4rem;
    right:auto;
    left:-2.2rem;
    height:9rem;
    transform:rotate(5deg);
  }
  #letter-sticker--pizza {
    top:-6rem;
    right:4rem;
    height:11rem;
    transform:rotate(-6deg) rotateX(180deg) rotateZ(180deg);
  }
  #letter-sticker--school {
    top:28rem;
    left:auto;
    right:-2rem;
    height:7rem;
  }
  #letter-sticker--yay {
    bottom:21rem;
    left:auto;
    right:2.5rem;
    right:calc((100vw - 58vw) - 14.6rem);
    height:13rem;
    transform:rotate(4deg);
  }
}
