/* Horror Microsite styles */


:root {
  --red: #bf1600;
  --gray: #e1e1e1;
  --darkgray: #252525;
  --black: #282425;
}

body,
.content-inner-main {
  background-color: var(--darkgray);
}

.microsite-outer-wrapper {
  background-image: url(../png/red_splatter_texture.png);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 0% 0%;
}

.microsite-header-wrapper img {
  margin: 0 auto;
}

.main-content.microsite.yikesgeist h1,
.content-related-wrap h1,
footer, footer a,
footer .copyright,
footer .side-newsletter-wrap .newsletter-subheading,
.social .share-text,
.breadcrumb,
.content-now-next-section.now-title-small h1,
.welcome-heading,
.checkbox-wrapper a,
.checkbox-wrapper p,
aside footer .contact-form-newsletter-signup,
aside footer .side-newsletter-wrap .side-newsletter-subheading {
  color: white !important;
}

.main-content p {
  color: white;
}

.side-newsletter-wrap #side_newsletter_email {
  background-color: #ebebeb;
  color: #000;
}

#quiz-wrap label span,
.microsite .section-filter form
.result-percent,
.content-inner-main .quiz-modal-content p,
.content-wrap h2,
.side-newsletter-wrap input::placeholder,
.side-newsletter-wrap input[type="checkbox"]:checked::before,
aside .side-newsletter-wrap input[type="checkbox"]:checked::before,
.side-newsletter-wrap i.fa-chevron-right,
.side-newsletter-wrap .side-newsletter-subheading {
  color: #000;
}

aside footer .side-newsletter-wrap input[type="checkbox"] {
  border: 2px solid white;
}

aside footer .side-newsletter-wrap input[type="checkbox"]:checked::before {
  color: #fff;
}

input[type=radio] + label:hover {
  background-color: #d1d1d1;
}

.microsite .section-filter form,
.microsite .section-filter form i {
  border-color: white;
  color: white;
}

.content-inner-main p a {
  color: #ff1e01;
}

.content-inner-main #story_body h2 {
  margin-bottom: 1.5rem;
}

.content-related-inner .primary-tags {
  background-color: var(--darkgray);
  border: 1px solid;
}

.content-related-inner .primary-tags:hover {
  background-color: white;
  color: var(--darkgray);
}

footer a:hover {
  color: var(--red);
}

.main-content.microsite .content-grid-item .content-grid-item-desc,
.side-content .content-grid-item-desc {
  border-radius: 15px;
}

.microsite-content-callout .content-posted {
  color: black;
}

.story-wrapper-outer {
  background-color: var(--gray);
  padding: 2rem;
  border-radius: 15px;
}

.story-wrapper-outer h2,
.story-wrapper-outer .content-inner p,
.story-wrapper-outer .story-author {
  color: #000;
}

.story-wrapper-outer .content-inner-main {
  background: var(--gray);
  padding-bottom: 0;
}

.content-related-wrap {
  margin-top: 3rem;
}

#wcs-comments-wrapper {
  display: none;
}

#wcs-main-wrapper h2,
.wcs-comments-filter > a {
  color: #000;
}

.collectors-header-nav.yikesgeist,
.collectors-header-nav.yikesgeist .microsite-search-bar.open {
  background-color: var(--red);
}

.microsite-search-bar.yikesgeist .search-form button i:hover,
.microsite-search-bar .search-form button:hover i {
  color: var(--red);
}

.collectors-header-nav.yikesgeist ul li a {
  border-color: black;
  font-weight: 500;
}

.collectors-header-nav.yikesgeist ul li a:hover,
.collection-icons i:hover {
  color: black;
}

.yikesgeist .microsite-section-heading h1 {
  color: white;
  text-transform: capitalize;
}

.microsite-content-description,
.content-grid-item-desc {
  background-color: var(--gray);
}

.content-grid-item-desc {
  border-radius: 0 0 15px 15px;
}

.microsite-content-description p {
  color: var(--red);
}

.main-content.microsite .inline-buttons a {
  background-color: var(--red);
  border: 2px solid var(--red);
  transition: background-color 0.3s;
}

.main-content.microsite .inline-buttons a:hover {
  background-color: white;
  color: var(--red);
}

.tabbed-container .tab label,
.tabbed-container .store-product-item {
  color: black;
}

.tabbed-container .store-product-title:hover {
  color: var(--red);
}

.tabbed-container .tab.active label,
.tabbed-container .tab label:hover,
.tabbed-container section {
  background-color: var(--gray);
  color: black;
}

.tabbed-container .tab label {
  background-color: #878787;
  color: white;
}

.owl-carousel.owl-theme.featured-mall-products .owl-nav button.owl-prev i,
.owl-carousel.owl-theme.featured-mall-products .owl-nav button.owl-next i  {
  background: black;
  color: white;
  border-color: white;
}

.owl-carousel.owl-theme.featured-mall-products .owl-nav button.owl-prev i:hover,
.owl-carousel.owl-theme.featured-mall-products .owl-nav button.owl-next i:hover {
  background: white;
  color: black;
  border-color: black;
}

.yikesgeist .content-grid-item-main .content-grid-item-desc {
  border-radius: 15px;
}

.breadcrumb a {
  color: white;
}

.content-tags > a {
  background-color: var(--red);
}

.content-tags a:hover {
  background-color: #000;
  color: #fff;
}

.yikesgeist .sidebar-content-callout.game-ad {
  background-color: var(--red);
  padding-bottom: 3rem;
}

.yikesgeist .sidebar-content-callout .container-inner {
  padding: 0 2rem 2.5rem;
  text-align: center;
}

.yikesgeist .sidebar-content-callout img {
  width: 100%;
}

.yikesgeist .button-square .btn-primary.white {
  background: white;
  border-radius: 0;
  color: black;
  border: 2px solid white;
}

.yikesgeist .button-square .btn-primary.white:hover {
  border: 2px solid black;
  background: black;
  color: white;
}

.yikesgeist .sven-poster {
  overflow:hidden;
}

.yikesgeist .sidebar-content-callout h2 {
  font-family: 'Work Sans', sans-serif;
  font-size: 3.4rem;
  font-weight: bold;
  margin: 2rem 0 0.5rem;
  text-transform: none;
  color: white;
}

.yikesgeist .sidebar-content-callout .container-inner p {
  font-family: 'Work Sans', sans-serif;
  font-size: 2rem;
  line-height: 2.6rem;
  color: #fff;
  margin-bottom: 3.5rem;
}

.yikesgeist .sidebar-content-callout.sven-preview {
  background-color: #e1e1e1;
}

.yikesgeist .sidebar-content-callout.sven-preview h2,
.yikesgeist .sidebar-content-callout.sven-preview p {
  font-size: 2.6rem;
  line-height: 3.2rem;
  color: black;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: -1px;
}

.yikesgeist .sidebar-content-callout.sven-preview p {
  font-size: 2.8rem;
  font-weight: 600;
  margin: 1.2rem 0 1.8rem;
}

.yikesgeist .sidebar-content-callout.sven-preview .name {
  color: var(--red);
  font-weight: 600;
}

.yikesgeist .sidebar-content-callout.sven-preview #show-time-hours {
  font-size: 2.2rem;
}

.yikesgeist .sidebar-content-callout.sven-preview .movie-time {
  display: flex;
  align-items: center;
  justify-content: center;
}

.yikesgeist .sidebar-content-callout.sven-preview .movie-time img {
  width: 90px;
  margin: 0.3rem 0 0 1rem;
}

.yikesgeist .sidebar-content-callout.sven-preview .button-inline {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
}

.yikesgeist .btn-primary.red, 
.yikesgeist .btn-small.red {
  background-color: var(--red);
  color: white;
  border: 3px solid var(--red);
  padding: 1.3rem 1.5rem;
  border-radius: 50px;
  font-size: 1.8rem;
}

.yikesgeist .btn-primary.red:hover, 
.yikesgeist .btn-small.red:hover {
  background-color: white;
  color: var(--red);
  border: 3px solid var(--red);
}

.yikesgeist .btn-primary, 
.yikesgeist .btn-small {
  font-family: Work Sans, sans-serif;
  font-weight: 600;
  text-transform: none;
  text-align: center;
}

.yikesgeist .side-newsletter-wrap {
  background-color: white;
}

.button-top-page {
  color: black;
}

.three-col-flex-container {
    display: flex;
    background-color: var(--gray);
    gap: 25px;
    padding: 3rem 2.5rem 1.5rem;
    border-radius: 10px;
}

.three-col-flex-container .three-col-grid-item {
  padding: 20px;
  text-align: center;
}

.main-content.microsite .three-col-flex-container .inline-buttons {
  margin: 0 0 1rem;
}

.main-content.microsite .three-col-flex-container .inline-buttons a {
  background-color: var(--black);
  color: white;
  border: 2px solid black
}

.main-content.microsite .three-col-flex-container .inline-buttons a:hover {
  background-color: white;
  color: black;
  border-color: black;
}

.photo-grid.three-col-flex-container img {
  max-height: 500px;
}

.photos-content-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.photos-content-container {
  margin-top: 5rem;
}

.horror-newsletter {
  background-color: var(--red);
  padding: 3rem 3rem;
  border-radius: 20px;
  text-align: center;
  color: white;
  margin: 5rem 0 5rem;
}

.horror-newsletter .title {
  color: white;
  font-size: 4rem;
  line-height: 4.6rem;
  font-weight: bold;
  border-bottom: 2px solid white;
  padding-bottom: 3rem;
  margin-bottom: 2rem;
}

.horror-newsletter p {
  font-size: 1.8rem;
  padding-bottom: 2rem;
  margin-bottom: 2.5rem;
  border-bottom: 2px solid white;
}

.horror-newsletter h2 {
  color: white;
}

.horror-newsletter .newsletter-signup-input-wrap {
  position: relative;
  width: 80%;
  margin: 0 auto;
}

.horror-newsletter .newsletter-signup-input-wrap input {
  background-color: transparent;
  box-shadow: none;
  outline: none;
  border: none;
  background: white;
  color: black;
  border-radius: 50px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  width: 100%;
}

.horror-newsletter .newsletter-signup-input-wrap button {
  color: black;
  font-size: 2.2rem;
  position: absolute;
  top: 1.2rem;
  right: 1.5rem;
  width: 30px;
  padding: 0;
  background: none;
  border: none;
}

.horror-newsletter .newsletter-terms a {
  color: white;
  font-weight: bold;
}
.horror-newsletter a.clickhere{
    color: white;
}

.flex-center {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 900px), handheld and (max-device-width: 900px){
  .collectors-header-nav.yikesgeist ul li a {
    border: none;
  }

  .yikesgeist .sven-poster {
    height: 500px;  
  }

  .yikesgeist .sven-poster img {
    margin-top: -3rem;
  }

}


@media screen and (max-width: 500px), handheld and (max-device-width: 500px){

  .microsite-outer-wrapper {
    background-image: url('../png/red_splatter_yikes_mobile.png');
  }

  .three-col-flex-container {
    flex-direction: column;
  }


  .photos-content-container {
    grid-template-colummns: repeat(1, 1fr);
  }

  .yikesgeist .sven-poster {
    height: 225px; 
  }

  .yikesgeist .sven-poster img {
    margin-top: 0;
  }

}
