html {
  box-sizing: border-box; }

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

@font-face {
  font-family: 'ProximaNova';
  src: url("/fonts/ProximaNova/ProximaNova-Light.ttf"); }
@font-face {
  font-family: 'ProximaNova';
  src: url("/fonts/ProximaNova/ProximaNova-Bold.ttf");
  font-weight: bold; }
@font-face {
  font-family: 'Alegreya';
  src: url("/fonts/Alegreya/Alegreya-Regular.ttf"); }
@font-face {
  font-family: 'Alegreya-Bold';
  src: url("/fonts/Alegreya/Alegreya-Bold.ttf"); }
@font-face {
  font-family: 'Alegreya-Italic';
  src: url("/fonts/Alegreya/Alegreya-Italic.ttf"); }
@font-face {
  font-family: 'Roehampton';
  src: url("/fonts/roehampton/roehampton-ttf/Roehampton-Avenue.ttf"); }
body {
  background-color: #FFF; }

a {
  text-decoration: none; }

.header {
  background-color: #222328;
  color: #FFF;
  min-height: 150px;
  margin: 0;
  padding: 0;
  position: relative;
  width: 100%; }
  @media (min-width: 769px) {
    .header {
      padding: 0 60px; } }
  @media (min-width: 1025px) {
    .header {
      padding: 0 105px; } }
  @media (min-width: 769px) {
    .header.instruction-header {
      padding: 0 45px; } }
  @media (min-width: 1025px) {
    .header.instruction-header {
      padding: 0 60px; } }
  .header .header-content {
    margin: auto;
    width: 100%; }
    @media (min-width: 769px) {
      .header .header-content {
        max-width: 700px; } }
    @media (min-width: 1025px) {
      .header .header-content {
        max-width: 800px; } }
    @media (min-width: 1280px) {
      .header .header-content {
        max-width: 1050px; } }
  .header .title-container {
    text-align: center; }
    @media (min-width: 769px) {
      .header .title-container {
        float: left;
        text-align: left; } }
    .header .title-container .game-title {
      color: #FFF;
      font-family: "Roehampton";
      font-size: 96px;
      font-weight: normal;
      letter-spacing: 3px;
      margin: 0; }
      .header .title-container .game-title a {
        text-decoration: none;
        color: #FFF; }
  .header .header-byline {
    font-style: italic;
    margin-top: -10px; }
  .header .social {
    padding-top: 15px;
    display: none; }
    @media (min-width: 769px) {
      .header .social {
        display: block;
        text-align: right; } }

.header-menu {
  margin-top: 22.5px;
  text-align: center; }
  @media (min-width: 769px) {
    .header-menu {
      display: block;
      text-align: right; } }
  .header-menu .link-text {
    display: block;
    font-size: 20px;
    font-family: "Alegreya-Italic";
    padding: 15px; }
    @media (min-width: 769px) {
      .header-menu .link-text {
        display: inline-block;
        font-size: 32px;
        margin-left: 11.25px;
        padding: 0; } }
  .header-menu .link {
    color: #FFF; }
    @media (min-width: 769px) {
      .header-menu .link {
        font-size: 32px; }
        .header-menu .link:after {
          content: '/';
          display: inline-block;
          padding-left: 11.25px; }
          .header-menu .link:after:hover {
            cursor: normal; }
        .header-menu .link:last-child:after {
          content: '';
          padding-left: 0; }
        .header-menu .link:last-child {
          margin-right: 0; } }
    .header-menu .link:nth-child(1) .link-text {
      background-color: #e4ac23; }
      @media (min-width: 769px) {
        .header-menu .link:nth-child(1) .link-text {
          background-color: transparent; } }
    .header-menu .link:nth-child(2) .link-text {
      background-color: #2d9073; }
      @media (min-width: 769px) {
        .header-menu .link:nth-child(2) .link-text {
          background-color: transparent; } }
    .header-menu .link:nth-child(3) .link-text {
      background-color: #266b99; }
      @media (min-width: 769px) {
        .header-menu .link:nth-child(3) .link-text {
          background-color: transparent; } }
    .header-menu .link:nth-child(4) .link-text {
      background-color: #b44f2a; }
      @media (min-width: 769px) {
        .header-menu .link:nth-child(4) .link-text {
          background-color: transparent; } }

.header-rainbow {
  display: none; }
  @media (min-width: 769px) {
    .header-rainbow {
      display: block; } }
  .header-rainbow .band {
    height: 12.75px; }
  .header-rainbow .color-1 {
    background-color: #e4ac23; }
  .header-rainbow .color-2 {
    background-color: #2d9073; }
  .header-rainbow .color-3 {
    background-color: #266b99; }
  .header-rainbow .color-4 {
    background-color: #b44f2a; }

.social .link-container {
  margin-right: 7.5px; }
  .social .link-container:last-child {
    margin-right: 0; }
.social .link {
  background-color: #e4ac23;
  border-radius: 50%;
  color: #222328;
  line-height: 30px;
  text-align: center;
  height: 30px;
  width: 30px; }

.main-section.footer {
  background-color: #222328;
  color: #FFF;
  font-style: italic; }
  .main-section.footer .copyright {
    font-weight: bold; }
  .main-section.footer .designed-in-atx {
    margin-top: 3.75px; }
  .main-section.footer .social {
    margin-top: 15px; }

.subtitle {
  color: #989898;
  font-size: 20px;
  font-family: "ProximaNova";
  font-weight: bold;
  margin-bottom: 30px;
  text-transform: uppercase; }

.main-section {
  background-color: #FFF;
  padding: 30px 15px;
  text-align: center; }
  @media (min-width: 769px) {
    .main-section {
      padding: 30px 0; } }
  @media (min-width: 1025px) {
    .main-section {
      padding: 45px 0; } }
  .main-section .main-section-content {
    margin: auto;
    width: 100%;
    padding: 0; }
    @media (min-width: 769px) {
      .main-section .main-section-content {
        max-width: 700px; } }
    @media (min-width: 1025px) {
      .main-section .main-section-content {
        max-width: 800px; } }
    @media (min-width: 1280px) {
      .main-section .main-section-content {
        max-width: 1050px; } }
  .main-section .title {
    font-size: 24px;
    margin-top: 0; }
  .main-section .sheepshead {
    font-style: italic; }

.title-section {
  margin: auto;
  width: 100%;
  padding-bottom: 0;
  padding-left: 15px;
  padding-right: 15px;
  text-align: center; }
  @media (min-width: 769px) {
    .title-section {
      max-width: 700px; } }
  @media (min-width: 1025px) {
    .title-section {
      max-width: 800px; } }
  @media (min-width: 1280px) {
    .title-section {
      max-width: 1050px; } }
  @media (min-width: 769px) {
    .title-section {
      padding-left: 0;
      padding-right: 0; } }
  .title-section .section-content {
    border-bottom: 1px solid #e4ac23;
    padding-bottom: 30px; }
  .title-section .hero-description {
    font-size: 32px; }
    .title-section .hero-description p {
      margin: 0; }

.home .what-is-boon.main-section {
  background: url("http://res.cloudinary.com/riso-entertainment/image/upload/v1447980155/hero-box_hxuc5l.jpg");
  background-color: #FFF;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100% auto;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
  position: relative;
  text-align: left;
  width: 100%; }
  .home .what-is-boon.main-section .hero-text {
    font-size: 24px;
    font-family: "ProximaNova";
    height: 345px;
    text-align: center;
    width: 100%; }
    .home .what-is-boon.main-section .hero-text p {
      margin: 0;
      padding: 0 15px; }
      @media (min-width: 497px) {
        .home .what-is-boon.main-section .hero-text p {
          padding: 0; } }
    .home .what-is-boon.main-section .hero-text .button {
      background-color: #266b99;
      display: block;
      margin: auto;
      margin-top: 30px;
      text-align: center; }
      @media (min-width: 497px) {
        .home .what-is-boon.main-section .hero-text .button {
          margin: 30px 0; } }
      @media (min-width: 769px) {
        .home .what-is-boon.main-section .hero-text .button {
          font-size: 24px;
          width: 300px; } }
  @media (min-width: 497px) {
    .home .what-is-boon.main-section {
      background-position: center top;
      background-size: auto 350px;
      height: 350px; }
      .home .what-is-boon.main-section .hero-text {
        font-size: 32px;
        margin-left: 45px;
        text-align: left;
        width: 250px; } }
  @media (min-width: 769px) {
    .home .what-is-boon.main-section {
      background-size: auto 450px;
      font-size: 40px;
      height: 450px;
      padding-bottom: 45px;
      padding-top: 45px; }
      .home .what-is-boon.main-section .hero-text {
        font-size: 48px;
        margin-left: 0;
        width: 450px; } }
  @media (min-width: 1025px) {
    .home .what-is-boon.main-section {
      background-size: auto 550px;
      height: 550px; }
      .home .what-is-boon.main-section .hero-text {
        font-size: 48px;
        width: 400px; } }
  @media (min-width: 1280px) {
    .home .what-is-boon.main-section {
      background-size: 100% auto;
      height: 550px; }
      .home .what-is-boon.main-section .hero-text {
        font-size: 56px;
        width: 550px; } }
  @media (min-width: 1500px) {
    .home .what-is-boon.main-section {
      background-size: 100% auto;
      height: 650px; }
      .home .what-is-boon.main-section .hero-text {
        font-size: 72px;
        width: 550px; } }
.home .intro.main-section {
  font-size: 20px; }
  .home .intro.main-section:after {
    content: "";
    display: table;
    clear: both; }
  @media (min-width: 769px) {
    .home .intro.main-section {
      font-size: 24px; } }
  .home .intro.main-section p {
    margin: 0; }
  .home .intro.main-section p:first-child {
    margin-bottom: 15px; }
    @media (min-width: 769px) {
      .home .intro.main-section p:first-child {
        margin-bottom: 30px; } }
  .home .intro.main-section .intro-container {
    text-align: center; }
  .home .intro.main-section .intro-paragraph {
    text-align: left; }
  .home .intro.main-section .tell-me-more {
    display: inline-block;
    background-color: #2d9073;
    margin-top: 30px; }
.home .gameplay.main-section {
  padding-bottom: 0;
  padding-top: 0; }
  .home .gameplay.main-section .details {
    max-width: em(1088);
    margin-left: auto;
    margin-right: auto;
    border-top: 1px solid #e4ac23;
    padding: 30px 0; }
    .home .gameplay.main-section .details:after {
      content: "";
      display: table;
      clear: both; }
    @media (min-width: 1025px) {
      .home .gameplay.main-section .details {
        padding: 45px 0; } }
  .home .gameplay.main-section .detail {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%;
    text-align: center; }
    .home .gameplay.main-section .detail:last-child {
      margin-right: 0; }
    .home .gameplay.main-section .detail .desc {
      font-size: 16px;
      margin: 3.75px; }
    .home .gameplay.main-section .detail:last-child {
      border: 0; }
    .home .gameplay.main-section .detail .fa {
      font-size: 32px;
      height: 37.5px; }
    @media (min-width: 769px) {
      .home .gameplay.main-section .detail .desc {
        font-size: 20px; } }
.home .boon-love.main-section {
  background-color: #D8D8D8;
  font-size: 20px;
  text-align: left; }
  @media (min-width: 769px) {
    .home .boon-love.main-section {
      font-size: 32px; } }
.home .classic-game.main-section {
  padding-top: 0; }
  .home .classic-game.main-section .title {
    font-family: "ProximaNova";
    font-size: 32px; }
    @media (min-width: 769px) {
      .home .classic-game.main-section .title {
        font-size: 40px; } }
  .home .classic-game.main-section .subtitle {
    font-weight: normal;
    font-size: 16px; }
    @media (min-width: 769px) {
      .home .classic-game.main-section .subtitle {
        font-size: 20px; } }
  .home .classic-game.main-section .the-card-advantage {
    display: none; }
  .home .classic-game.main-section .button {
    background-color: #b44f2a;
    display: inline-block;
    font-family: "ProximaNova";
    margin-top: 15px; }
  .home .classic-game.main-section p {
    font-size: 20px;
    text-align: left; }
    @media (min-width: 769px) {
      .home .classic-game.main-section p {
        font-size: 24px; } }
.home .sample-card {
  border: 1px solid #8E8E8E;
  border-radius: 10px;
  width: 100px;
  margin: 7.5px; }
  @media (min-width: 769px) {
    .home .sample-card {
      margin: 15px;
      width: 125px; } }
  @media (min-width: 1025px) {
    .home .sample-card {
      margin: 15px;
      width: 150px; } }
.home .hero-image.promo-image-2 {
  background: url("http://res.cloudinary.com/riso-entertainment/image/upload/v1447980155/designed-in-atx_wednlp.jpg");
  background-color: #FFF;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  min-height: 100px;
  width: 100%; }
  @media (min-width: 497px) {
    .home .hero-image.promo-image-2 {
      min-height: 200px; } }
  @media (min-width: 1025px) {
    .home .hero-image.promo-image-2 {
      min-height: 300px; } }
.home .how-to-play.main-section .prompt {
  font-size: 20px;
  margin: 0; }
  @media (min-width: 769px) {
    .home .how-to-play.main-section .prompt {
      font-size: 32px; } }
.home .how-to-play.main-section .button {
  background-color: #b44f2a;
  display: inline-block;
  font-family: "ProximaNova";
  margin-top: 30px; }
.home .button {
  background-color: #e4ac23;
  border-radius: 5px;
  color: white;
  font-family: "ProximaNova";
  font-size: 16px;
  font-weight: bold;
  padding: 15px 0;
  text-transform: uppercase;
  width: 200px; }
  @media (min-width: 769px) {
    .home .button {
      width: 250px; } }

.strategy-body {
  margin: auto;
  width: 100%;
  background-color: #FFF; }
  @media (min-width: 769px) {
    .strategy-body {
      max-width: 700px; } }
  @media (min-width: 1025px) {
    .strategy-body {
      max-width: 800px; } }
  @media (min-width: 1280px) {
    .strategy-body {
      max-width: 1050px; } }
  .strategy-body .strategy-content {
    text-align: left; }
  .strategy-body .tip-container {
    margin-bottom: 75px; }
  .strategy-body .tip-title {
    color: #2d9073;
    font-family: "ProximaNova";
    font-size: 24px;
    font-style: italic;
    font-weight: bold;
    margin-bottom: 30px;
    margin-bottom: 7.5px; }
  .strategy-body .tip-content {
    font-size: 24px; }
  .strategy-body .emphasis {
    font-style: italic; }
  .strategy-body .picking-cards .card-container,
  .strategy-body .high-value-cards .card-container {
    text-align: center; }
    .strategy-body .picking-cards .card-container .picking-card,
    .strategy-body .picking-cards .card-container .high-value-card,
    .strategy-body .high-value-cards .card-container .picking-card,
    .strategy-body .high-value-cards .card-container .high-value-card {
      border: 1px solid #8E8E8E;
      border-radius: 10px;
      width: 50px;
      margin: 7.5px; }
      @media (min-width: 769px) {
        .strategy-body .picking-cards .card-container .picking-card,
        .strategy-body .picking-cards .card-container .high-value-card,
        .strategy-body .high-value-cards .card-container .picking-card,
        .strategy-body .high-value-cards .card-container .high-value-card {
          margin: 15px;
          width: 100px; } }

.about {
  margin: auto;
  width: 100%;
  font-family: "Alegreya"; }
  @media (min-width: 769px) {
    .about {
      max-width: 700px; } }
  @media (min-width: 1025px) {
    .about {
      max-width: 800px; } }
  @media (min-width: 1280px) {
    .about {
      max-width: 1050px; } }
  .about .long-description {
    padding-left: 15px;
    padding-right: 15px; }
    .about .long-description:after {
      content: "";
      display: table;
      clear: both; }
    @media (min-width: 769px) {
      .about .long-description {
        padding-left: 0;
        padding-right: 0; } }
    .about .long-description .sheepshead-label {
      font-style: italic; }
    .about .long-description .story {
      font-size: 24px;
      text-align: left;
      width: 100%; }
      @media (min-width: 769px) {
        .about .long-description .story {
          float: left;
          width: 50%; } }
      .about .long-description .story p:first-child {
        margin-top: 0; }
    .about .long-description .wi-tx-map {
      background: url("http://res.cloudinary.com/riso-entertainment/image/upload/v1447980155/wisconsin-texas_lcdl0d.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: 300px 575px;
      height: 575px;
      text-align: center; }
      @media (min-width: 769px) {
        .about .long-description .wi-tx-map {
          float: right;
          width: 50%; } }

.guide-section.boon-downsides ul {
  -webkit-padding-start: 15px;
  margin: 0;
  padding-left: 0; }
.guide-section.boon-downsides .cons {
  text-align: left; }
  .guide-section.boon-downsides .cons li {
    list-style-type: none;
    margin: 15px; }
  .guide-section.boon-downsides .cons .fa-thumbs-down {
    margin-right: 7.5px; }
  .guide-section.boon-downsides .cons .subtitle {
    text-align: center; }
.guide-section.boon-downsides .one-v-many {
  font-size: 24px;
  margin-top: 7.5px;
  text-align: center; }
.guide-section.boon-downsides .fa-user {
  margin-right: 5px; }

.guide-section.enter-players-names {
  text-align: center; }
  .guide-section.enter-players-names .title {
    font-size: 24px; }
  .guide-section.enter-players-names .names-form {
    text-align: left; }
  .guide-section.enter-players-names .names-form {
    margin: auto;
    width: 100%; }
    @media (min-width: 497px) {
      .guide-section.enter-players-names .names-form {
        width: 75%; } }
  .guide-section.enter-players-names .player-label {
    margin-top: 22.5px; }
  .guide-section.enter-players-names .player-input {
    width: 100%; }
  .guide-section.enter-players-names .order-prompt {
    font-size: 12px; }

.guide-section.number-of-players {
  text-align: center;
  max-width: 320px; }
  .guide-section.number-of-players .intro-paragraph,
  .guide-section.number-of-players .players-paragraph {
    font-size: 24px; }
  .guide-section.number-of-players .players-paragraph {
    margin-top: 22.5px; }
  .guide-section.number-of-players .button {
    background-color: #266b99;
    border-radius: 5px;
    color: white;
    display: block;
    font-family: "ProximaNova";
    font-size: 24px;
    font-weight: bold;
    margin: auto;
    margin-top: 30px;
    padding: 15px 0;
    width: 275px; }
    @media (min-width: 497px) {
      .guide-section.number-of-players .button {
        font-size: 32px;
        margin-top: 45px;
        width: 320px; } }
    @media (min-width: 769px) {
      .guide-section.number-of-players .button {
        margin-top: 60px;
        width: 320px; } }

.guide-section.shuffling .removed-cards {
  margin-top: 15px;
  text-align: center; }
  .guide-section.shuffling .removed-cards .card {
    width: 60px; }
.guide-section.shuffling .shuffle-directions {
  font-size: 16px; }
.guide-section.shuffling .three-player-shuffle {
  margin-top: 15px; }
.guide-section.shuffling .arrow-icon {
  font-size: 16px; }
.guide-section.shuffling .user-icon {
  font-size: 16px; }
.guide-section.shuffling .dealt-card {
  border-radius: 5px;
  margin: 0;
  width: 20px; }
.guide-section.shuffling .card-distribution-row {
  margin-top: 15px;
  text-align: left; }
.guide-section.shuffling .card-distribution-row > * {
  vertical-align: middle; }
.guide-section.shuffling .shuffle-recipient {
  display: inline-block;
  text-align: center; }
.guide-section.shuffling .shuffle-recipient-name {
  font-size: 12px;
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 50px; }
.guide-section.shuffling .the-boon-label {
  display: inline-block;
  font-size: 12px;
  text-align: center;
  width: 50px; }

.guide-section.start-a-round {
  font-size: 24px;
  line-height: 450px;
  text-align: center; }
  @media (min-width: 497px) {
    .guide-section.start-a-round {
      font-size: 32px;
      line-height: 450px; } }

.guide-section.take-the-boon-prompt .prompt {
  font-size: 20px;
  text-align: center; }
.guide-section.take-the-boon-prompt .reminder {
  margin-top: 22.5px;
  text-align: center; }
.guide-section.take-the-boon-prompt .pros-cons-summary {
  margin-top: 30px; }
.guide-section.take-the-boon-prompt .bullet-point:first-child {
  margin-top: 7.5px; }
.guide-section.take-the-boon-prompt .fa-thumbs-down,
.guide-section.take-the-boon-prompt .fa-thumbs-up {
  margin-right: 7.5px; }
.guide-section.take-the-boon-prompt .subtitle {
  text-align: center; }

.guide-section.taking-the-boon .pros {
  margin-top: 15px;
  text-align: left; }
  .guide-section.taking-the-boon .pros .fa-thumbs-up {
    margin-right: 7.5px; }
  .guide-section.taking-the-boon .pros .subtitle {
    text-align: center; }
.guide-section.taking-the-boon .callout {
  margin-top: 7.5px; }
.guide-section.taking-the-boon .question-mark-container {
  margin: 15px;
  text-align: center; }
  .guide-section.taking-the-boon .question-mark-container .fa-question-circle {
    font-size: 48px; }

.guide-section.victory-cards {
  text-align: left; }
  .guide-section.victory-cards .victory-cards-directions {
    font-size: 16px; }
  .guide-section.victory-cards .three-player-shuffle {
    margin-top: 15px; }
  .guide-section.victory-cards .arrow-icon {
    font-size: 16px; }
  .guide-section.victory-cards .user-icon {
    font-size: 28px; }
  .guide-section.victory-cards .card {
    border-radius: 5px;
    margin: 0;
    width: 40px; }
  .guide-section.victory-cards .card-distribution-row {
    margin-top: 15px;
    text-align: left; }
  .guide-section.victory-cards .card-distribution-row > * {
    vertical-align: middle; }
  .guide-section.victory-cards .shuffle-recipient {
    display: inline-block;
    text-align: center; }
  .guide-section.victory-cards .shuffle-recipient-name {
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 50px; }
  .guide-section.victory-cards .victory-card-glamour {
    margin-top: 15px;
    text-align: center; }
    .guide-section.victory-cards .victory-card-glamour .fa-trophy {
      color: #e4ac23;
      font-size: 52px;
      vertical-align: top; }

.guide-section.when-to-take-the-boon {
  text-align: left; }
  .guide-section.when-to-take-the-boon .protip {
    margin-top: 7.5px; }
  .guide-section.when-to-take-the-boon .card-container {
    text-align: center; }
  .guide-section.when-to-take-the-boon .bad-hand {
    display: none; }
  .guide-section.when-to-take-the-boon .picking-card {
    margin: 0;
    width: 70px; }

.guide-section.declined-boon .decision_maker_prompt {
  margin-top: 22.5px; }
.guide-section.declined-boon .reminder {
  margin-top: 22.5px;
  text-align: center; }
.guide-section.declined-boon .pros-cons-summary {
  margin-top: 30px; }
.guide-section.declined-boon .bullet-point:first-child {
  margin-top: 7.5px; }
.guide-section.declined-boon .fa-thumbs-down,
.guide-section.declined-boon .fa-thumbs-up {
  margin-right: 7.5px; }
.guide-section.declined-boon .subtitle {
  text-align: center; }

.guide-section.starting-leaster .subtitle {
  text-align: center; }

.guide-section.how-to-take-the-boon .dealt-card {
  border-radius: 5px;
  margin: 0;
  width: 20px; }
.guide-section.how-to-take-the-boon .card-counts {
  text-align: center; }
.guide-section.how-to-take-the-boon .subtitle {
  text-align: center; }
.guide-section.how-to-take-the-boon .example-hand,
.guide-section.how-to-take-the-boon .example-hand-labeled {
  text-align: center; }
.guide-section.how-to-take-the-boon .example-card {
  margin: 3px;
  width: 65px; }
.guide-section.how-to-take-the-boon .labeled-card-container {
  text-align: center; }
  .guide-section.how-to-take-the-boon .labeled-card-container .card {
    width: 150px; }
.guide-section.how-to-take-the-boon .example-hand-labeled .card {
  width: 65px; }
.guide-section.how-to-take-the-boon .highlighted-card-container {
  display: inline-block;
  height: 100px;
  width: 77px; }
.guide-section.how-to-take-the-boon .highlighted-card-container.buried {
  border: 3px solid black;
  border-radius: 15px; }
.guide-section.how-to-take-the-boon .buried-card-callout-container {
  text-align: center; }
.guide-section.how-to-take-the-boon .buried-card-callout {
  margin: 3px;
  width: 85px; }
.guide-section.how-to-take-the-boon .step-6 .remaining-hand-container,
.guide-section.how-to-take-the-boon .step-6 .done-burying-container {
  text-align: center; }
.guide-section.how-to-take-the-boon .step-6 .remaining-card,
.guide-section.how-to-take-the-boon .step-6 .done-burying-card {
  margin: 0 11.25px;
  width: 55px; }

.guide-section.round-objectives .one-v-many {
  font-size: 24px;
  margin-top: 7.5px;
  text-align: center; }
.guide-section.round-objectives .fa-user {
  margin-right: 5px; }
.guide-section.round-objectives .objective {
  margin-top: 15px; }

.guide-section.first-trick .what-color-card,
.guide-section.first-trick .prompt-to-play,
.guide-section.first-trick .protip {
  margin-top: 15px; }
.guide-section.first-trick .what-color-card {
  text-align: center; }
.guide-section.first-trick .card {
  color: #FFF;
  display: inline-block;
  line-height: 95px;
  height: 95px;
  width: 70px;
  text-align: center; }
.guide-section.first-trick .card-red {
  background-color: #b44f2a; }
.guide-section.first-trick .card-green {
  background-color: #2d9073; }
.guide-section.first-trick .card-blue {
  background-color: #266b99; }
.guide-section.first-trick .card-gold {
  background-color: #e4ac23; }

.guide-section.rest-of-trick .following-suit-rule {
  margin-top: 7.5px; }
.guide-section.rest-of-trick .trick-is-finished,
.guide-section.rest-of-trick .protip {
  margin-top: 15px; }

.guide-section.winning-a-trick .protip,
.guide-section.winning-a-trick .cards-played-intro,
.guide-section.winning-a-trick .trump-cards-present,
.guide-section.winning-a-trick .winning-condition {
  margin-top: 15px; }
.guide-section.winning-a-trick .cards-played {
  text-align: center; }
  .guide-section.winning-a-trick .cards-played .card {
    width: 75px; }

.interactive-guide .next-button.hidden {
  display: none; }

.guide-section.trick-winner-instructions {
  text-align: center; }
  .guide-section.trick-winner-instructions .all-players,
  .guide-section.trick-winner-instructions .who-won-prompt {
    font-size: 20px; }
  .guide-section.trick-winner-instructions .guide-link-container {
    margin-top: 32px;
    font-size: 16px; }
  .guide-section.trick-winner-instructions .button {
    background-color: #266b99;
    border-radius: 5px;
    color: white;
    display: block;
    font-family: "ProximaNova";
    font-size: 24px;
    font-weight: bold;
    margin: auto;
    margin-top: 30px;
    padding: 15px 0;
    width: 275px; }
    @media (min-width: 497px) {
      .guide-section.trick-winner-instructions .button {
        font-size: 32px;
        margin-top: 45px;
        width: 320px; } }
    @media (min-width: 769px) {
      .guide-section.trick-winner-instructions .button {
        margin-top: 60px;
        width: 320px; } }

.guide-section.collecting-the-trick .protip,
.guide-section.collecting-the-trick .cards-example {
  margin-top: 15px; }
.guide-section.collecting-the-trick .cards-played {
  margin-top: 15px;
  text-align: center; }
.guide-section.collecting-the-trick .card {
  width: 75px; }

.guide-section.starting-another-trick .bullet-point:first-child {
  margin-top: 7.5px; }

.guide-section.tallying-scores .step-2 .defensive-player-points-container {
  margin-bottom: 15px;
  margin-top: 15px;
  text-align: center; }
.guide-section.tallying-scores .step-2 .defensive-player-points {
  display: inline-block;
  position: relative;
  width: 40%; }
.guide-section.tallying-scores .step-2 .fa-user.user-icon {
  font-size: 32px; }
.guide-section.tallying-scores .step-2 .fa-plus.plus-icon {
  font-size: 25px;
  position: absolute;
  bottom: -75px;
  right: -11px; }
.guide-section.tallying-scores .step-2 .defensive-player-pile {
  margin: auto;
  width: 50%; }
.guide-section.tallying-scores .step-2 .defensive-player-pile .card {
  margin: 0;
  position: absolute;
  width: 50px; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(1) {
    left: 10%;
    top: 90px;
    z-index: 1; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(2) {
    left: 50%;
    margin-left: -25px;
    top: 80px;
    z-index: 2; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(3) {
    right: 10%;
    top: 70px;
    z-index: 3; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(4) {
    left: 10%;
    top: 120px;
    z-index: 4; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(5) {
    left: 50%;
    margin-left: -25px;
    top: 110px;
    z-index: 5; }
  .guide-section.tallying-scores .step-2 .defensive-player-pile .card:nth-child(6) {
    right: 10%;
    top: 100px;
    z-index: 6; }
.guide-section.tallying-scores .step-3 .points-explanation {
  text-align: center; }
.guide-section.tallying-scores .step-3 .hero-points-container {
  text-align: center; }
.guide-section.tallying-scores .step-3 .hero-points {
  font-size: 80px;
  height: 95px; }
.guide-section.tallying-scores .card-with-labels-container {
  text-align: center;
  padding: 15px; }
.guide-section.tallying-scores .card-with-labels {
  margin: auto;
  width: 150px; }
.guide-section.tallying-scores .score-section {
  color: #FFF;
  border: 2px solid #2f2f2f;
  padding: 7.5px; }
  .guide-section.tallying-scores .score-section:nth-child(n + 2) {
    border-top: 0; }
.guide-section.tallying-scores .point-header {
  font-size: 20px;
  text-align: center; }
.guide-section.tallying-scores .extra-loss {
  background-color: #b44f2a; }
.guide-section.tallying-scores .loss {
  background-color: #d2663f; }
.guide-section.tallying-scores .win {
  background-color: #3088c2; }
.guide-section.tallying-scores .extra-win {
  background-color: #266b99; }
.guide-section.tallying-scores .button {
  background-color: #266b99;
  border-radius: 5px;
  color: white;
  display: block;
  font-family: "ProximaNova";
  font-size: 24px;
  font-weight: bold;
  margin: auto;
  margin-top: 30px;
  padding: 15px 0;
  width: 275px; }
  @media (min-width: 497px) {
    .guide-section.tallying-scores .button {
      font-size: 32px;
      margin-top: 45px;
      width: 400px; } }
  @media (min-width: 769px) {
    .guide-section.tallying-scores .button {
      margin-top: 60px;
      width: 500px; } }

.guide-section.tallying-scores-leaster .score-section {
  color: #FFF;
  border: 2px solid #2f2f2f;
  padding: 7.5px; }
  .guide-section.tallying-scores-leaster .score-section:nth-child(n + 2) {
    border-top: 0; }
.guide-section.tallying-scores-leaster .point-header {
  font-size: 20px;
  text-align: center; }
.guide-section.tallying-scores-leaster .extra-loss {
  background-color: #b44f2a; }
.guide-section.tallying-scores-leaster .loss {
  background-color: #d2663f; }
.guide-section.tallying-scores-leaster .win {
  background-color: #3088c2; }
.guide-section.tallying-scores-leaster .extra-win {
  background-color: #266b99; }
.guide-section.tallying-scores-leaster .button {
  background-color: #266b99;
  border-radius: 5px;
  color: white;
  display: block;
  font-family: "ProximaNova";
  font-size: 24px;
  font-weight: bold;
  margin: auto;
  margin-top: 30px;
  padding: 15px 0;
  width: 275px; }
  @media (min-width: 497px) {
    .guide-section.tallying-scores-leaster .button {
      font-size: 32px;
      margin-top: 45px;
      width: 400px; } }
  @media (min-width: 769px) {
    .guide-section.tallying-scores-leaster .button {
      margin-top: 60px;
      width: 500px; } }

.guide-section.the-end {
  text-align: center; }
  .guide-section.the-end .outro-header {
    font-size: 20px;
    border-bottom: 1px solid #e4ac23;
    padding-bottom: 15px; }
  .guide-section.the-end .thats-it {
    margin-bottom: 15px; }
  .guide-section.the-end .email-prompt {
    margin-top: 30px; }
  .guide-section.the-end .tutorial-link {
    margin-top: 15px; }

.interactive-guide {
  margin: 15px; }
  .interactive-guide .guide-body {
    min-height: 450px; }
  .interactive-guide .next-button {
    background-color: #2d9073;
    border-radius: 5px;
    color: white;
    display: block;
    font-family: "ProximaNova";
    font-size: 16px;
    font-weight: bold;
    margin: auto;
    margin-top: 30px;
    padding: 15px 0;
    text-align: center;
    width: 100%; }
    @media (min-width: 497px) {
      .interactive-guide .next-button {
        width: 325px; } }

.next-button.hidden-next-button,
.next-button.final-button {
  display: none; }

.guide-section {
  margin: auto;
  max-width: 320px; }
  @media (min-width: 497px) {
    .guide-section {
      max-width: 325px; } }
  .guide-section .card {
    border-radius: 10px;
    border: 1px solid #8E8E8E;
    margin: 7.5px;
    width: 50px; }
    @media (min-width: 769px) {
      .guide-section .card {
        margin: 15px;
        width: 100px; } }
  .guide-section .emphasis {
    font-style: italic; }
  .guide-section .highlighted {
    font-style: italic;
    font-weight: bold; }
  .guide-section .protip {
    border-left: 7.5px solid #E2E2E2;
    padding: 3.75px;
    padding-left: 15px; }
    .guide-section .protip .title {
      font-family: "ProximaNova";
      font-weight: bold; }
  .guide-section .protip-list .tip {
    border-bottom: 1px solid #b44f2a;
    padding: 15px 0; }
    .guide-section .protip-list .tip:last-child {
      border-bottom: 0; }
  .guide-section .button {
    border-radius: 5px;
    color: white;
    display: block;
    font-family: "ProximaNova";
    font-size: 24px;
    font-weight: bold;
    margin: auto;
    margin-top: 30px;
    padding: 15px 0;
    text-align: center;
    width: 100%; }
    @media (min-width: 497px) {
      .guide-section .button {
        font-size: 32px;
        margin-top: 45px;
        width: 325px; } }
    @media (min-width: 769px) {
      .guide-section .button {
        margin-top: 60px;
        width: 320px; } }
  .guide-section .yes-button {
    background-color: #2d9073; }
  .guide-section .no-button {
    background-color: #b44f2a; }
  .guide-section .guide-link {
    color: #2d9073;
    text-decoration: underline; }
  .guide-section .hidden {
    display: none; }
  .guide-section .step-2,
  .guide-section .step-3,
  .guide-section .step-4,
  .guide-section .step-5,
  .guide-section .step-6,
  .guide-section .step-7,
  .guide-section .step-8,
  .guide-section .step-9,
  .guide-section .step-10 {
    display: none; }
  .guide-section .paragraph {
    margin-top: 15px; }
  .guide-section .bold {
    font-family: "Alegreya-Bold"; }
  .guide-section .bullet-point {
    margin: 15px 0; }
  .guide-section .callout {
    background-color: #266b99;
    color: #FFF;
    padding: 15px;
    text-align: center; }
  .guide-section .subtitle {
    color: #b44f2a;
    font-weight: normal;
    font-size: 20px;
    margin-bottom: 0; }

.instructions-menu {
  background-color: #FFF;
  padding: 30px 15px;
  padding-bottom: 0;
  position: relative;
  text-align: center; }
  .instructions-menu .instruction-menu-items {
    list-style-type: decimal;
    padding-left: 0;
    width: 100%;
    z-index: 2; }
    .instructions-menu .instruction-menu-items li {
      color: #1d5682;
      display: inline-block;
      font-family: "ProximaNova";
      font-size: 12px;
      position: relative;
      text-transform: uppercase;
      vertical-align: top;
      z-index: 2; }
      .instructions-menu .instruction-menu-items li a {
        color: #1d5682; }
      .instructions-menu .instruction-menu-items li.selected .bullet {
        background-color: #1d5682;
        color: #FFF; }
      .instructions-menu .instruction-menu-items li.selected .title {
        font-weight: bold; }
      .instructions-menu .instruction-menu-items li .bullet {
        background-color: #FFF;
        border: 2px solid #1d5682;
        border-radius: 50%;
        display: block;
        font-size: 32px;
        height: 50px;
        height: 50px;
        line-height: 50px;
        margin: auto;
        margin-bottom: 15px;
        width: 50px; }
        .instructions-menu .instruction-menu-items li .bullet:after {
          border: 1px solid #1d5682;
          content: ' ';
          position: absolute;
          top: 24px;
          right: -16px;
          width: 30px; }
      .instructions-menu .instruction-menu-items li .fa-play {
        font-size: 16px;
        left: 50%;
        margin-left: -5px;
        position: absolute;
        top: 17px; }
      .instructions-menu .instruction-menu-items li:last-child .bullet:after {
        border: none; }
      .instructions-menu .instruction-menu-items li .title {
        width: 75px; }

.instruction-video.instruction-body .title {
  font-size: 28px;
  margin-bottom: 30px;
  margin-top: 30px;
  text-align: center; }
  @media (min-width: 497px) {
    .instruction-video.instruction-body .title {
      font-size: 32px;
      margin: 30px;
      margin-top: 0; } }
.instruction-video.instruction-body .ways-to-learn {
  text-align: left; }
  .instruction-video.instruction-body .ways-to-learn .tip {
    font-size: 24px;
    margin-bottom: 30px; }
  @media (min-width: 497px) {
    .instruction-video.instruction-body .ways-to-learn .tip {
      font-size: 24px;
      margin-bottom: 30px; } }
  @media (min-width: 769px) {
    .instruction-video.instruction-body .ways-to-learn {
      margin: auto;
      text-align: left;
      width: 500px; }
      .instruction-video.instruction-body .ways-to-learn .tip {
        font-size: 24px;
        margin-bottom: 30px; } }
.instruction-video.instruction-body .video-container {
  text-align: center; }
  .instruction-video.instruction-body .video-container .iframe-desktop {
    display: none; }
  @media (min-width: 497px) {
    .instruction-video.instruction-body .video-container .embedded-video {
      height: 500px;
      width: 100%; }
    .instruction-video.instruction-body .video-container .iframe-mobile {
      display: none; }
    .instruction-video.instruction-body .video-container .iframe-desktop {
      display: block; } }
.instruction-video.instruction-body .instruction-link {
  color: #2d9073;
  text-decoration: underline; }

.game-setup.instruction-body .player-mode .title {
  font-weight: bold;
  font-style: italic;
  margin-bottom: 0;
  margin-top: 30px; }
.game-setup.instruction-body .player-mode .content {
  margin-left: 15px; }
.game-setup.instruction-body .sample-cards {
  margin-top: 15px;
  text-align: center; }
.game-setup.instruction-body .sample-card {
  width: 50px;
  margin: 7.5px; }
  @media (min-width: 769px) {
    .game-setup.instruction-body .sample-card {
      margin: 15px;
      width: 100px; } }
.game-setup.instruction-body .rank-point-descriptions,
.game-setup.instruction-body .victory-card-container {
  margin-top: 15px;
  text-align: center; }
  .game-setup.instruction-body .rank-point-descriptions .card,
  .game-setup.instruction-body .victory-card-container .card {
    width: 200px; }
.game-setup.instruction-body .sample-card,
.game-setup.instruction-body .card {
  border: 1px solid #8E8E8E;
  border-radius: 10px; }

.the-boon.instruction-body .leaster-mode {
  background-color: #266b99; }

.playing-a-trick.instruction-body .emphasis {
  font-weight: bold;
  font-style: italic; }
.playing-a-trick.instruction-body .description {
  padding-bottom: 0; }
  .playing-a-trick.instruction-body .description ul {
    margin-bottom: 0; }

.winning-a-round.instruction-body .description ul {
  margin-bottom: 0; }

.winning-the-game.instruction-body .emphasis {
  font-weight: bold;
  font-style: italic; }

.five-player-mode.instruction-body .partner-card-container {
  margin-top: 15px;
  text-align: center; }
  .five-player-mode.instruction-body .partner-card-container .card {
    border-radius: 10px;
    border: 1px solid #8E8E8E;
    width: 200px; }
.five-player-mode.instruction-body .strategy-tip {
  margin-bottom: 30px;
  margin-top: 30px; }
.five-player-mode.instruction-body .defensive-tip {
  background-color: #b44f2a; }

.instructions-section {
  background-color: #FFF;
  font-size: 24px;
  padding: 15px 15px;
  padding-bottom: 30px; }
  @media (min-width: 769px) {
    .instructions-section {
      padding: 30px 0; } }
  @media (min-width: 1025px) {
    .instructions-section {
      padding: 30px 0; } }

.instruction-body {
  margin: auto;
  width: 100%;
  background-color: #FFF;
  text-align: left; }
  @media (min-width: 769px) {
    .instruction-body {
      max-width: 700px; } }
  @media (min-width: 1025px) {
    .instruction-body {
      max-width: 800px; } }
  @media (min-width: 1280px) {
    .instruction-body {
      max-width: 1050px; } }
  .instruction-body p {
    margin: 0;
    margin-bottom: 15px; }
  .instruction-body p:last-child {
    margin-bottom: 0; }
  .instruction-body p.padded {
    margin-top: 15px; }
  .instruction-body .subtitle {
    color: #b44f2a;
    font-weight: normal;
    font-size: 24px;
    margin-bottom: 7.5px; }
  .instruction-body .emphasis {
    font-style: italic; }
  .instruction-body .protip {
    border-left: 7.5px solid #E2E2E2;
    margin-top: 30px;
    padding: 15px; }
    .instruction-body .protip .title {
      font-family: "ProximaNova";
      font-weight: bold; }

.next-step {
  padding: 15px;
  padding-top: 60px;
  text-align: center; }
  .next-step .button {
    background-color: #b44f2a;
    border-radius: 5px;
    color: white;
    display: inline-block;
    font-family: "ProximaNova";
    font-size: 20px;
    padding: 15px;
    text-transform: uppercase;
    min-width: 275px; }
  .next-step .prefix {
    display: none; }
  .next-step .suffix {
    display: inline-block; }
  @media (min-width: 769px) {
    .next-step {
      padding: 75px; }
      .next-step .prefix {
        display: inline-block; }
      .next-step .suffix {
        display: none; }
      .next-step .button {
        font-size: 24px; } }

.strategy-tip {
  background-color: #2d9073;
  color: #FFF;
  font-family: "ProximaNova";
  margin: auto;
  padding: 15px;
  text-align: left;
  width: 100%; }
  @media (min-width: 769px) {
    .strategy-tip {
      padding: 30px;
      text-align: center;
      width: 55%; } }
  .strategy-tip .title {
    font-weight: bold;
    padding-bottom: 15px;
    text-transform: uppercase; }

body {
  color: #3D3D3D;
  font-family: "Alegreya";
  font-weight: 300;
  margin: 0;
  padding: 0; }

/*# sourceMappingURL=style.css.map */