@charset "UTF-8";
/*

Headings
========

    <h1>This is the primary headline</h1>
    <h2>This is the secondary headline</h2>
    <h3>This is the tertiary headline</h3>
    <h4>This is the average headline</h4>
    <h5>This is the small headline</h5>
    <h6>This is the micro headline</h6>

*/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-family: Georgia, Times, "Times New Roman", serif;
}

h1, .h1 {
  font-size: 2.1176rem;
  line-height: 1.2857;
}

@media all and (min-width: 48em) {
  h1, .h1 {
    font-size: 1.4736rem;
  }
}

.h1-alt {
  font-size: 1.4736rem;
  font-weight: normal;
}

h2, .h2 {
  font-size: 0.8823rem;
  line-height: 1.1333;
}

@media all and (min-width: 48em) {
  h2, .h2 {
    font-size: 1.1578rem;
  }
}

h5, .h5 {
  font-weight: normal;
}

.heading-special {
  font-size: 28px;
}

@media all and (min-width: 48em) {
  .heading-special {
    font-size: 57px;
  }
}

.h--reg {
  font-weight: normal;
}

.h--upper {
  text-transform: uppercase;
}

.h--italic {
  font-style: italic;
}

.h--spaced {
  letter-spacing: 3px;
}

@media all and (min-width: 48em) {
  .h--spaced {
    letter-spacing: 8px;
  }
}

.h--spaced-small {
  letter-spacing: 2px;
}

@media all and (min-width: 48em) {
  .h--spaced-small {
    letter-spacing: 4px;
  }
}

/*

Body Copy
========

    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ac ligula non felis fermentum tincidunt. Suspendisse sapien odio, vestibulum euismod metus at, aliquet dapibus purus. Suspendisse lacinia sit amet ante eget gravida.</p>

    <p class="lead">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ac ligula non felis fermentum tincidunt. Suspendisse sapien odio, vestibulum euismod metus at, aliquet dapibus purus. Suspendisse lacinia sit amet ante eget gravida.</p>

*/
/* --- used if wanting to style the first paragraph slightly differently --- */
.lead {
  font-size: 1.1176rem;
  line-height: 1.2631;
}

@media all and (min-width: 48em) {
  .lead {
    font-size: 1.1578rem;
    line-height: 1.2272;
  }
}

::-moz-selection {
  background: yellow;
}

::selection {
  background: yellow;
}

/*

Body Copy Classes
=================

    <p class="text-muted">faded out a little</p>
    <p class="text-primary">this really is something to look at</p>
    <p class="text-success">winner, winner. chicken dinner!</p>
    <p class="text-info">just a bit of info</p>
    <p class="text-warning">be careful now, take heed</p>
    <p class="text-danger">ooh, high voltage</p>

*/
.text-muted {
  color: #bbbbbb;
}

.text-subtle {
  color: #bbbbbb;
}

.text-primary {
  color: #e33e3c;
}

.text-success {
  color: #5CB85C;
}

.text-info {
  color: #5BC0DE;
}

.text-warning {
  color: #F0AD4E;
}

.text-danger {
  color: #D9534F;
}

.text-underlined {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.text-underlined:after {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  margin-top: 0.15em;
  background-color: #FFFFFF;
}

.text-underlined.h-center-text {
  margin-left: auto;
  margin-right: auto;
}

p.ah-form-error {
  text-align: center;
  color: #D9534F;
}

/*

Links
=====

	<a href="">this is a link</a>
	<a class="is-selected" href="">this link is selected</a>

*/
a {
  color: #d6d6d6;
}

a:visited {
  color: #bdbdbd;
}

a:hover {
  color: #fcfcfc;
}

a:focus {
  color: #000001;
}

a:active {
  color: #fcfcfc;
}


.unstyled-link {
  color: inherit;
  text-decoration: none;
}


.unstyled-link:visited {
  color: inherit;
}


.unstyled-link:hover {
  color: #fcfcfc;
}


.unstyled-link:focus {
  color: #000001;
}


.unstyled-link:active {
  color: #fcfcfc;
}

.unstyled-child-link a {
  color: inherit;
  text-decoration: none;
}

.unstyled-child-link a:visited {
  color: inherit;
}

.unstyled-child-link a:hover {
  color: #fcfcfc;
}

.unstyled-child-link a:focus {
  color: #000001;
}

.unstyled-child-link a:active {
  color: #fcfcfc;
}

.hover--underline {
  text-decoration: none;
}

.hover--underline:hover, .hover--underline:focus {
  text-decoration: underline;
}

a:not(.btn):focus {
  outline: 3px solid transparent;
  background-color: #4baefe;
  box-shadow: 0 -2px #4baefe, 0 4px #97d0ff;
  text-decoration: none;
  color: #000001;
}

a.link-inactive {
  color: #909090;
  text-decoration: none;
  cursor: default;
  outline: none;
}

a.link-inactive:hover, a.link-inactive:focus, a.link-inactive:active {
  color: #909090;
  text-decoration: none;
}

a.link-italic {
  text-decoration: none;
  font-style: italic;
}

.expander-header__link {
  display: block;
  text-decoration: none;
  color: #FFFFFF;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-right: auto;
  margin-left: auto;
  position: relative;
}

.expander-header__link:after {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  margin-top: 0.15em;
  background-color: #FFFFFF;
}

.expander-header__link:visited {
  color: #FFFFFF;
}

.expander-header__link:hover {
  color: #fcfcfc;
}

.expander-header__arrow:after {
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 15px 0 15px;
  border-color: #FFFFFF transparent transparent transparent;
  position: absolute;
  bottom: -21px;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*

Blockquotes
===========

    <blockquote>
        <p>You can put a cat in an oven, but that don't make it a biscuit.</p>
    </blockquote>

*/
blockquote:not(.testimonial__content),
.testimonial {
  background-color: #dddddd;
  border-left: 4px solid;
  border-color: #1897fe;
  color: inherit;
  margin-left: 0;
  margin-right: 0;
  padding: 1rem;
}

blockquote:not(.testimonial__content) > * + *,
.testimonial > * + * {
  margin-top: 1rem;
}

@media all and (min-width: 64em) {
  blockquote:not(.testimonial__content) > * + *,
  .testimonial > * + * {
    margin-top: 1.1875rem;
  }
}

.testimonial__content {
  font-style: italic;
  margin-bottom: 0;
  position: relative;
}

.testimonial__content > p:first-child {
  text-indent: 25px;
}

.testimonial__content:before {
  position: absolute;
  top: 2.5rem;
  left: -2.5rem;
  content: '“';
  font-size: 8rem;
  line-height: 0.1rem;
}

.testimonial__caption > .testimonial__item + .testimonial__item:before {
  content: " - ";
  display: inline-block;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

/*

Miscellaneous Typography
=======================

	<p><strong>rendered as bold text</strong></p>

	<p><em>rendered as italic text</em></p>

	<p><del>rendered as deleted text</del></p>

	<p><dfn>defines a definition term</dfn></p>

	<p><abbr title="extended abbr text should show when mouse over">&lt;abbr&gt; abbr - extended text when mouseover.</abbr></p>
	<p><acronym title="extended acronym text should show when mouse over">&lt;acronym&gt; acronym - extended text when mouseover.</acronym></p>

	<address>This would be rendered the address</address>

	<small>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</small>


*/
abbr[title],
dfn[title] {
  border-bottom: 1px dotted rgba(0, 0, 0, 0.3);
  cursor: help;
}


.small,
small {
  font-size: 16px;
}


.xsmall {
  font-size: 14px;
}

kbd {
  color: #666666;
  font-family: inherit;
  font-size: 87.5%;
  line-height: 90%;
  background-color: #f9f9f9;
  margin: 0 0.25rem;
  border: 1px solid #e9e9e9;
  border-radius: 4px;
  padding: 0.3334em 0.5em;
  box-shadow: inset 0 1px 0 white;
}

mark {
  background-color: #f0debc;
  line-height: 90%;
  padding: 0 0.125em;
}

/*------------------------------------*\
	$BEAUTONS.CSS
\*------------------------------------*/
/**
 * beautons is a beautifully simple button toolkit.
 *
 * LICENSE
 * 
 * Copyright 2013 Harry Roberts
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 * http://apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * 
 */
/*!*
 * 
 * @csswizardry -- csswizardry.com/beautons
 * 
 */
/*------------------------------------*\
	$BASE
\*------------------------------------*/
/**
* Base button styles.
*
*  1. Allow us to better style box model properties.
*  2. Line different sized buttons up a little nicer.
*  3. Stop buttons wrapping and looking broken.
*  4. Make buttons inherit font styles.
*  5. Force all elements using beautons to appear clickable.
*  6. Normalise box model styles.
*  7. If the button’s text is 1em, and the button is (3 * font-size) tall, then
*     there is 1em of space above and below that text. We therefore apply 1em
*     of space to the left and right, as padding, to keep consistent spacing.
*  8. Basic cosmetics for default buttons. Change or override at will.
*  9. Fixes odd inner spacing in IE7.
* 10. Don’t allow buttons to have underlines; it kinda ruins the illusion.
* 11. Prevents from inheriting default anchor styles.
*/
.wp-block-button__link,
.btn {
  display: inline-block;
  /* [1] */
  vertical-align: middle;
  /* [2] */
  white-space: nowrap;
  /* [3] */
  font-family: inherit;
  /* [4] */
  font-size: 100%;
  /* [4] */
  cursor: pointer;
  /* [5] */
  border: none;
  /* [6] */
  margin: 0;
  /* [6] */
  padding-top: 0;
  /* [6] */
  padding-bottom: 0;
  /* [6] */
  line-height: 2;
  /* [7] */
  height: 2em;
  /* [7] */
  padding-right: 1.5em;
  /* [7] */
  padding-left: 1.5em;
  /* [7] */
  background-color: #464646;
  /* [8] */
  border-radius: 4px;
  /* [8] */
  overflow: visible;
  /* [9] */
  text-decoration: none;
  /* [10] */
  color: #FFFFFF;
  transition: 200ms all ease-in-out;
  letter-spacing: 2px;
}

@media all and (min-width: 48em) {
  .wp-block-button__link,
  .btn {
    letter-spacing: 4px;
  }
}

.wp-block-button__link:hover, .wp-block-button__link:active, .wp-block-button__link:focus, .wp-block-button__link:visited,
.btn:hover,
.btn:active,
.btn:focus,
.btn:visited {
  text-decoration: none;
  /* [10] */
  color: #FFFFFF;
  /* [11] */
}

.wp-block-button__link:hover, .wp-block-button__link:focus, .wp-block-button__link:active,
.btn:hover,
.btn:focus,
.btn:active {
  background-color: #2d2d2d;
}

.wp-block-button__link:hover,
.btn:hover {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

.wp-block-button__link:active,
.btn:active {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) inset;
}

.wp-block-button__link:focus,
.btn:focus {
  outline: 2px solid #4baefe;
  outline-offset: 0;
}

.wp-block-button__link::-moz-focus-inner,
.btn::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/*------------------------------------*\
	$SIZES
\*------------------------------------*/
/**
 * Button size modifiers.
 *
 * These all follow the same sizing rules as above; text is 1em, space around it
 * remains uniform.
 */

.btn--small {
  padding-right: 0.5em;
  padding-left: 0.5em;
  line-height: 1.5;
  height: 1.5em;
}


.btn--large {
  padding-right: 2em;
  padding-left: 2em;
  line-height: 3;
  height: 3em;
}


.btn--huge {
  padding-right: 3em;
  padding-left: 3em;
  line-height: 4;
  height: 4em;
}

/**
 * These buttons will fill the entirety of their container.
 *
 * 1. Remove padding so that widths and paddings don’t conflict.
 */

.btn--full {
  width: 100%;
  padding-right: 0.5em;
  padding-left: 0.5em;
  text-align: center;
}

@media all and (max-width: 35.4375em) {
  
  .btn--full-until-small {
    width: 100%;
    padding-right: 0.5em;
    padding-left: 0.5em;
    text-align: center;
  }
}

@media all and (min-width: 35.5em) {
  
  .btn--half-right-from-small {
    width: 50%;
    margin-right: 0;
    margin-left: 50%;
  }
}

/*------------------------------------*\
	$FONT-SIZES
\*------------------------------------*/
/**
 * Button font-size modifiers.
 */

.btn--alpha {
  font-size: 2rem;
}


.btn--beta {
  font-size: 1.5rem;
}


.btn--gamma {
  font-size: 1rem;
}

/**
 * Make the button inherit sizing from its parent.
 */
.btn--natural {
  vertical-align: baseline;
  font-size: inherit;
  line-height: inherit;
  height: auto;
  padding-right: 0.5em;
  padding-left: 0.5em;
}

/*------------------------------------*\
	$FUNCTIONS
\*------------------------------------*/
/**
 * Button function modifiers.
 */

.btn--secondary {
  color: #FFFFFF;
  background-color: #e33e3c;
}


.btn--secondary:hover,
.btn--secondary:focus,
.btn--secondary:active {
  color: #FFFFFF;
  background-color: #ce201e;
}


.btn--secondary:focus {
  outline-color: #FFFFFF;
}


.btn--secondary:visited {
  color: #f2f2f2;
}


.btn--tertiary {
  color: #000001;
  background-color: #FFFFFF;
  border-color: #daf1fd;
}


.btn--tertiary:hover,
.btn--tertiary:focus,
.btn--tertiary:active {
  color: #000001;
  background-color: #daf1fd;
}


.btn--tertiary:visited {
  color: black;
}

/**
 * Positive actions; e.g. sign in, purchase, submit, etc.
 */
.btn--positive {
  background-color: #4A993E;
  color: #fff;
}

/**
 * Negative actions; e.g. close account, delete photo, remove friend, etc.
 */
.btn--negative {
  background-color: #691814;
  color: #fff;
}

/**
 * Inactive, disabled buttons.
 * 
 * 1. Make the button look like normal text when hovered.
 */
.btn--inactive,
.btn--inactive:hover,
.btn--inactive:active,
.btn--inactive:visited,
.btn--inactive:focus {
  background-color: #383838;
  color: #000001;
  cursor: default;
  /* [1] */
  box-shadow: none;
  outline: none;
}

/**
 * Fake button.
 */
.btn--fake,
.btn--fake:hover,
.btn--fake:active,
.btn--fake:visited,
.btn--fake:focus {
  background-color: transparent;
  color: #FFFFFF;
  cursor: default;
  /* [1] */
  box-shadow: none;
  outline: none;
  border: 2px solid #FFFFFF;
}

.btn--fake-bright,
.btn--fake-bright:hover,
.btn--fake-bright:active,
.btn--fake-bright:visited,
.btn--fake-bright:focus {
  background-color: transparent;
  color: #e33e3c;
  cursor: default;
  /* [1] */
  box-shadow: none;
  outline: none;
  border: 2px solid #e33e3c;
}

/*------------------------------------*\
	$STYLES
\*------------------------------------*/
/**
 * Button style modifiers.
 *
 * 1. Use an overly-large number to ensure completely rounded, pill-like ends.
 */
.btn--soft {
  border-radius: 200px;
  /* [1] */
}

.btn--hard {
  border-radius: 0;
}

.btn--upper {
  text-transform: uppercase;
}

/*------------------------------------*\
	$TOGGLE BUTTONS
\*------------------------------------*/
/**
 * Buttons with toggles states.
 *
 * 1. Use when you need to change the contents (text of a button)
 * EXAMPLE
 *<a href="#0" class="btn btn-toggle btn--full btn--tertiary">
  	<span class="btn-toggle__off">Watch</span>
  	<span class="btn-toggle__on">Watching</span>
 *</a>
 */
a.watch-toggle-switcher:focus {
  background-color: #ffffff36;
  box-shadow: none;
  border: 4px solid #ffffff00;
}

.editor-post-title__block .editor-post-title__input {
  font-family: Georgia, Times, "Times New Roman", serif;
}