/*
Theme Name: Headers and Volleys
Author: Tom Williams
Author URI: https://www.barefaced.co
Description: Theme by Tom Williams.
*/
@import url("https://fonts.googleapis.com/css?family=Barlow:300,400,900");
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 {
  font-size: 100%;
  font: inherit;
  padding: 0;
  border: 0;
  margin: 0;
  vertical-align: baseline;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

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

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

.clear {
  clear: both;
}

@font-face {
  font-family: 'Apercu';
  src: url("fonts/apercu-regular.eot");
  /* IE9 Compat Modes */
  src: url("fonts/apercu-regular.woff2") format("woff2"), url("fonts/apercu-regular.woff") format("woff"), url("fonts/apercu-regular.ttf") format("truetype");
  /* Safari, Android, iOS */
}

b {
  font-weight: 600;
}

em {
  font-style: italic;
}

.none {
  width: 0px !important;
}

.rotate {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.hide {
  display: none !important;
}

.alignleft {
  float: left;
  padding: 0px 15px 15px 0px;
}

.alignright {
  float: right;
  padding: 0px 0px 15px 15px;
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.alignnone {
  padding: 15px;
}

.wp-caption-text {
  font-style: italic;
}

/*Structure*/
html, body {
  background-color: #f8f8f8 !important;
}

.container-fluid {
  max-width: 1400px !important;
}

.huge-title {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 3.2rem;
  line-height: 3.2rem;
  margin: 0px;
}

.huge-title p {
  margin-bottom: 0px;
}

.big-title {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 3rem;
  line-height: 3rem;
  margin: 0px;
}

.big-sub {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-size: 2rem;
}

.med-title {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 2rem;
  text-transform: uppercase;
}

.med-sub {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-size: 1.6rem;
  margin-top: -10px;
}

.sml-title {
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 1.6rem;
  text-transform: uppercase;
}

.sml-sub {
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  font-size: 1.4rem;
  margin-top: -10px;
}

.pest-btn {
  width: 180px;
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 1.4rem;
  text-transform: uppercase;
  text-decoration: none !important;
  color: #FFFFFF;
  text-align: center;
  padding: 15px 0px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 2px;
}

.pest-btn-pink {
  background-color: #FF5BE2;
  color: #FFFFFF !important;
}

.pest-btn-pink:hover {
  background-color: #414141;
}

.pest-btn-grey {
  background-color: #262B2E;
  color: #FFFFFF !important;
}

.pest-btn-grey:hover {
  background-color: #414141;
}

.author-tag, .category-tag {
  font-family: "Barlow", sans-serif !important;
}

/*Nav*/
nav {
  position: fixed;
  top: 0px;
  width: 100%;
  height: 100px;
  background-color: #FFFFFF;
  z-index: 9999;
}

nav #left-nav {
  margin-left: 5%;
  float: left;
}

nav #nav-title, nav #nav-sub {
  font-family: "Barlow", sans-serif;
  font-size: 1rem;
  line-height: 1rem;
  margin: 0px;
  margin-left: 3px;
}

nav #nav-title {
  font-weight: 900;
}

nav #home-logo {
  color: #262B2E !important;
  text-decoration: none !important;
}

nav #home-logo:hover {
  color: #FF5BE2 !important;
}

nav #home-logo img {
  height: 30px;
  width: auto;
  margin-top: 15px;
}

nav .pest-btn {
  font-size: 0.8rem;
  padding: 5px;
  width: 150px;
}

nav #middle-nav, nav #right-nav {
  float: right;
  margin-top: 15px;
}

nav #right-nav {
  margin: 0% 5%;
}

nav .nav-social a {
  margin-right: 15px;
  color: #262B2E;
  font-size: 1.4rem;
  float: right;
}

nav .nav-social a:hover {
  color: #FF5BE2;
}

nav #nav-toggle {
  font-size: 2rem;
  color: #FF5BE2;
  margin-top: 25px;
  display: block;
  width: 30px;
}

nav #nav-toggle:hover {
  color: #414141;
}

#nav-inner {
  position: fixed;
  right: 0px;
  top: 100px;
  width: 500px;
  height: -webkit-calc(100vh - 100px);
  height: calc(100vh - 100px);
  background-color: #FFFFFF;
  z-index: 999999;
  overflow: auto;
  -webkit-transition: width 0.35s;
          transition: width 0.35s;
}

#nav-inner ul {
  margin-top: 60px;
  font-size: 1.4rem;
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  text-align: center;
}

#nav-inner ul a {
  color: #262B2E;
}

#nav-inner ul a:hover {
  color: #FF5BE2;
}

#nav-inner #sub-nav {
  margin: 0px;
  height: 0px;
  overflow: hidden;
  -webkit-transition: height 0.4s;
          transition: height 0.4s;
}

#nav-inner #sub-nav .sub-nav-link {
  font-weight: 300;
  font-size: 1.2rem;
  text-decoration: none !important;
}

#nav-inner #sub-nav.active {
  height: 270px;
}

#mobile-social {
  text-align: center;
}

#mobile-social .nav-social {
  margin-bottom: 15px;
}

#mobile-social .nav-social i {
  margin-left: 5px;
  margin-right: 5px;
  font-size: 1.2rem;
  color: #FF5BE2 !important;
}

#mobile-social .pest-btn {
  width: 80%;
  margin-bottom: 15px;
  font-size: 1.1rem;
  padding: 5px;
}

/*Footer*/
footer {
  background-color: #414141;
  color: #FFFFFF;
  padding: 30px 0px 60px 0px;
}

footer .sml-sub {
  margin-top: 0px;
}

footer #home-logo {
  display: block;
  margin-bottom: 15px;
}

footer #home-logo img {
  height: 30px;
  width: auto;
  margin-top: 5px;
}

footer a {
  color: #FFFFFF !important;
}

footer a:hover {
  color: #FF5BE2 !important;
}

footer p {
  font-family: "Apercu", sans-serif;
}

footer #mail-link {
  font-weight: 900;
}

footer #wellcome-logo {
  width: 25%;
  margin-right: 30px;
}

footer .footer-logo {
  width: 40%;
  height: auto;
  display: inline-block;
}

.sign-up {
  background-color: #FFD700;
  padding: 60px 0px;
}

#mc_embed_signup {
  background-color: #FFFFFF;
  padding: 30px;
}

#mc_embed_signup .med-title {
  text-align: center;
}

#mc_embed_signup p {
  font-size: 1.2rem;
  font-family: "Barlow", sans-serif;
  font-weight: 300;
  text-align: center;
}

#mc_embed_signup #signup-bar {
  width: 60%;
  margin: 30px auto;
}

#mc_embed_signup .email {
  display: inline-block;
  vertical-align: middle;
  width: 70%;
  height: 50px;
  padding: 5px 5px 5px 15px;
  border: 2px solid #FF5BE2;
  border-right: none;
  font-family: "Apercu", sans-serif;
}

#mc_embed_signup #mc-embedded-subscribe {
  display: inline-block;
  vertical-align: middle;
  width: 30%;
  height: 50px;
  padding: 5px;
  border: 2px solid #FF5BE2;
  background-color: #FF5BE2;
  color: #FFFFFF;
  font-family: "Barlow", sans-serif;
  font-size: 1.4rem;
  font-weight: 900;
}

#mc_embed_signup #mc-embedded-subscribe:hover {
  background-color: #414141;
  border: #414141;
}

#mc_embed_signup #signup-buttons {
  margin: 60px 0px;
}

#mc_embed_signup #signup-buttons .pest-btn {
  font-size: 1.2rem;
  margin: 0px 15px 15px 15px;
}

#contact-link {
  display: block;
  position: relative;
  top: -150px;
  visibility: hidden;
}

#big-email-link {
  text-align: center;
  color: #262B2E;
  display: block;
  margin-bottom: 30px;
  text-decoration: none !important;
}

#big-email-link:hover {
  color: #FF5BE2;
}

/*Homepage*/
.landing {
  width: 100%;
  height: 100vh;
  position: relative;
  background-size: cover;
}

.landing .sml-sub {
  margin-top: 0px;
}

.landing .pest-btn {
  font-size: 1.2rem;
  width: 160px;
  padding: 5px;
}

video {
  position: absolute;
  right: 50%;
  top: 50%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  overflow: hidden;
  -webkit-transform: translate(50%, -50%);
      -ms-transform: translate(50%, -50%);
          transform: translate(50%, -50%);
}

#home-landing {
  background-image: url(https://www.pestival.org/wp-content/themes/pestival/img/bg.jpeg);
  background-size: cover;
  overflow: hidden;
}

.landing-box {
  background-color: #FFFFFF;
  position: absolute;
  max-width: 600px;
  width: 80%;
  height: auto;
  padding: 30px;
  left: 10%;
  top: 45%;
  -webkit-transform: translate(0%, -50%);
      -ms-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  border-radius: 2px;
}

.landing-box .big-sub {
  margin-bottom: 30px;
}

#basic-landing {
  background-image: url(https://www.pestival.org/wp-content/themes/pestival/img/bg.jpeg);
  background-size: cover;
  overflow: hidden;
}

.basic-box {
  background-color: #FFFFFF;
  position: absolute;
  max-width: 600px;
  width: 80%;
  height: 200px;
  padding: 30px;
  left: 10%;
  top: 45%;
  -webkit-transform: translate(0%, -50%);
      -ms-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  border-radius: 2px;
}

.basic-landing-box .big-sub {
  margin-bottom: 30px;
}

.basic {
  width: 100%;
  height: 100vh;
  position: relative;
  background-size: cover;
}

.basic .sml-sub {
  margin-top: 0px;
}


#featured-posts {
  padding: 40px 0px 60px 0px;
  background-color: #FFD700;
}

#news-posts, #projects-posts, #community-posts, #page-posts {
  margin: 40px 0px 60px 0px;
  background-color: #f8f8f8;
}

.hero-post {
  height: 70vh;
  display: block;
  color: #262B2E !important;
  text-decoration: none !important;
  margin-bottom: 30px;
}

.hero-post .hero-post-image, .hero-post .hero-post-box {
  float: left;
}

.hero-post .hero-post-image {
  width: 60%;
  height: 70vh;
  background-size: cover;
  background-position: center;
}

.hero-post .hero-post-box {
  width: 40%;
  padding: 30px;
  background-color: #FFFFFF;
}

.hero-post .hero-post-box p {
  font-family: "Apercu", sans-serif;
}

.hero-post-yellow .hero-post-box {
  background-color: #FFD700;
}

#page-posts .post {
  margin-bottom: 60px;
}

.post {
  display: block;
  color: #262B2E !important;
  text-decoration: none !important;
}

.post .post-image {
  height: 33vh;
  background-size: cover;
  background-position: center;
}

.post .hero-post-box {
  padding-top: 30px;
}

.post .hero-post-box p {
  font-family: "Apercu", sans-serif;
}

#community-posts .post-image {
  margin-bottom: 15px;
}

#community-posts .post {
  margin-bottom: 30px;
}

.carousel-container {
  margin-bottom: 60px;
}

#carousel-buttons {
  text-align: center;
}

.carousel {
  margin-bottom: 30px;
}

.carousel .pull-quote {
  margin: 60px 0px 100px 0px;
}

.carousel .carousel-indicators li {
  background-color: #FF5BE2;
  height: 16px;
  width: 16px;
  border-radius: 50%;
}

.pagination-links {
  margin-bottom: 60px;
  height: 63px;
}

.pagination-links .page-numbers {
  display: none;
}

.pagination-links .next {
  width: 180px;
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 1.4rem;
  text-transform: uppercase;
  text-decoration: none !important;
  color: #FFFFFF;
  text-align: center;
  padding: 15px 0px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 2px;
  background-color: #FF5BE2;
  float: right;
}

.pagination-links .prev {
  width: 180px;
  font-family: "Barlow", sans-serif;
  font-weight: 900;
  font-size: 1.4rem;
  text-transform: uppercase;
  text-decoration: none !important;
  color: #FFFFFF;
  text-align: center;
  padding: 15px 0px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 2px;
  background-color: #FF5BE2;
}

/*Article*/
#article-landing {
  height: 200px;
  background-position: center;
  background-size: cover;
}

.article-bar {
  background-color: #FFD700;
  padding: 30px 0px;
}

.article-bar p {
  margin-bottom: 0px;
  font-family: "Barlow", sans-serif;
}

.article {
  margin-top: 60px;
  margin-bottom: 60px;
}

.article .ssba-share-text {
  display: none;
}

.article p {
  font-family: "Apercu", sans-serif;
}

.article h3 {
  font-family: "Barlow", sans-serif;
  font-size: 2rem;
  margin-bottom: 1rem;
  font-weight: 900;
}

.article h4 {
  font-family: "Barlow", sans-serif;
  font-size: 1.6rem;
  margin-bottom: 1rem;
}

.article img {
  max-width: 100%;
  height: auto;
  margin: auto;
}

.article a {
  color: #262B2E;
  font-weight: 600;
  text-decoration: underline;
}

.article a:hover {
  color: #FF5BE2 !important;
}

.article ol, .article ul {
  list-style-position: inside !important;
  font-family: "Apercu", sans-serif;
}

.article ol {
  list-style: decimal;
}

.article ul {
  list-style: initial;
}

.pull-quote {
  margin: 60px 0px 0px 0px;
}

.pull-quote .med-title {
  text-transform: none;
  text-align: center;
}

.pull-quote p {
  text-align: center;
}

.fact-boxes {
  margin: 60px 0px 0px 0px;
}

.fact-boxes .fact-box {
  background-color: #FFD700;
  padding: 15px 0px;
  margin-bottom: 15px;
}

.fact-boxes .sml-title {
  font-family: "Barlow", sans-serif !important;
}

.fact-boxes .fact {
  font-family: "Barlow", sans-serif;
  font-size: 1.4rem;
  margin-bottom: 0px;
}

.fact-boxes p {
  text-align: center;
  margin-bottom: 0px;
}

/*Mobile*/
@media screen and (max-width: 768px) {
  .mobile-hide {
    display: none;
  }
  #myVideo {
    display: none !important;
  }
  .container-fluid {
    padding-left: 5% !important;
    padding-right: 5% !important;
  }
  .huge-title {
    font-family: "Barlow", sans-serif;
    font-weight: 900;
    font-size: 1.4rem;
    line-height: 1.4rem;
    margin: 0px;
    word-break: keep-all;
  }
  .big-title {
    font-family: "Barlow", sans-serif;
    font-weight: 900;
    font-size: 1.4rem;
    line-height: 1.4rem;
    margin: 0px;
  }
  .big-sub {
    font-family: "Barlow", sans-serif;
    font-weight: 300;
    font-size: 1.4rem;
  }
  .med-title {
    font-family: "Barlow", sans-serif;
    font-weight: 900;
    font-size: 1.3rem;
    text-transform: uppercase;
  }
  .med-sub {
    font-family: "Barlow", sans-serif;
    font-weight: 300;
    font-size: 1.25rem;
    margin-top: -10px;
  }
  .sml-title {
    font-family: "Barlow", sans-serif;
    font-weight: 900;
    font-size: 1.15rem;
    text-transform: uppercase;
  }
  .sml-sub {
    font-family: "Barlow", sans-serif;
    font-weight: 300;
    font-size: 1.1rem;
    margin-top: -10px;
  }
  .pest-btn {
    width: 160px;
  }
  .article h3 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    font-weight: 900;
  }
  .article h4 {
    font-size: 1.15rem;
    margin-bottom: 1rem;
  }
  .nav-link {
    padding: 0px 0px 5px 0px !important;
  }
  #nav-inner {
    width: 100%;
  }
  .landing-box {
    padding: 30px 15px;
  }
  .landing-box .pest-btn {
    font-size: 1rem;
    width: 94px;
  }
  .hero-post {
    height: auto;
    margin-bottom: 30px;
  }
  .hero-post .hero-post-image, .hero-post .hero-post-box {
    width: 100%;
    float: none;
  }
  .hero-post .hero-post-image {
    height: 40vh;
    background-position: center;
  }
  .post {
    margin-bottom: 30px;
  }
  #carousel-buttons .pest-btn {
    padding: 15px;
    font-size: 1.15rem;
    margin: 15px;
  }
  #mc_embed_signup #signup-bar {
    width: 100%;
  }
  #mc_embed_signup #mc-embedded-subscribe {
    font-size: 1.15rem;
  }
  #mc_embed_signup #signup-buttons .pest-btn {
    padding: 15px;
    font-size: 1.15rem;
    margin-bottom: 15px;
  }
  #mc_embed_signup #signup-buttons i {
    font-weight: 400;
  }
  footer .sml-sub {
    margin-bottom: 30px;
    display: block;
  }
  footer #wellcome-logo {
    width: 21%;
    margin-right: 30px;
  }
  footer .footer-logo {
    width: 28%;
    height: auto;
    display: inline-block;
    margin-bottom: 30px;
  }
}
