anthony-gordon-shopify
6/24/2019 - 2:20 AM

Make mobile slideshow look like desktop slideshow on Brooklyn

/* Added by Anthony Gordon at Shopify June 24 2019 */

@include at-query($max, $small) {
  .announcement-bar__message {
    font-size: 0.7em; 
  }

  .site-header .wrapper .grid--full.grid--table {
    margin-top: -20px; 
  }

  .hero__adapt-text-wrap.wrapper {
    display: none !important;
  }

  .hero__text-align.wrapper {
    display: table;
  }

  .hero__slide .hero__title, .hero--adapt .hero__title {
    font-size: 1em;
  }
  .hero__slide .hero__subtitle, .hero--adapt .hero__subtitle {
    font-size: 0.7em;
  }

  .hero__slide a.hero__cta, .hero--adapt a.hero__cta {
    font-size: 0.5em;
  }

  .hero__title.h1, .hero__subtitle {
    margin-bottom: 0.4em; 
  }

  .hero__slide .hero__subtitle, .hero--adapt .hero__subtitle {
    margin-bottom: 0.4em; 
    margin-top: 1.5em;
  }


}

@include at-query($max, $x-small) {
  .announcement-bar__message {
    padding-top: 0.2em;
    padding-bottom: 0.2em;
  }

  .hero__slide .hero__subtitle, .hero--adapt .hero__subtitle {
    margin-top: 2.5em;
    font-size: 0.6em;
  }

  .hero__title.h1, .hero__subtitle {
    font-size: 0.8em;
  }

  .btn.hero__cta {
    padding-top: 6px;
    padding-bottom: 6px;
  }
}