<style scoped>
  .signal-banner {
  background-image:url('https://cdn.bulbagarden.net/upload/8/8c/Bellchime_Trail_HGSS.png');
  background-position:center 20%;
  background-size:cover;
  font-family:"Source Sans Pro","Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  overflow: hidden !important;
  }
  .signal-banner ul.team {
  margin:0;
  padding: 0;
  list-style: none;
  }
  .signal-banner ul li, .signal-banner ul li a {
  color: #7289da;
  }
  .signal-banner ul.team li {
  font-style: italic;
  display: inline-block;
  }
  .signal-banner ul.team li[loa] {
  font-style: normal;
  text-decoration: line-through;
  }
  .signal-banner ul.team li[senior] {
  font-weight: bold;
  }
  .signal-banner ul.team li:not(:last-child):after {
  content: ", ";
  }
  .signal-banner .feature {
  display:block;
  padding:2px 2px;
  background:rgba(255, 255, 255, 0.95);
  margin:10px;
  color:black;
  }
  .signal-banner .feature-1 {
  height: 225px;
  }
  .signal-banner .feature-2 {
  height: 50px;
  margin-left: 20px;
  margin-right: 20px;
  text-align: center;
  }
  .signal-banner .feature h1 {
  font-size: 25pt;
  margin-top: 0;
  }
  .signal-banner .feature h1 img {
  height: 100%;
  width: auto;
  float: right;
  }
  .signal-banner .feature h3 {
  font-weight:bold;
  letter-spacing:1px;
  font-size:80%;
  margin-top: 5px;
  margin-bottom: 0;
  }
  .signal-banner .border-1 {
  border:1px solid black;
  border-bottom-width:2px;
  padding:1px;
  border-radius:5px;
  }
  .signal-banner .border-2 {
  border:1px solid black;
  border-top-width:2px;
  border-radius:3px;
  padding:10px;
  }
  .signal-banner .feature-1 .border-1 {
  height: 225px;
  }
  .signal-banner .feature-1 .border-2 {
  height: 220px;
  }
  .signal-banner .feature-2 .border-1 {
  height: 50px;
  }
  .signal-banner .feature-2 .border-2 {
  height: 45px;
  }
  .signal-banner .scroll {
    height: 225px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 2em;
    text-shadow: 2px 2px 2px black;
  }
  @media screen and (max-width: 992px) {
    .mob-hide-col {
      display: none;
    }
  }
</style>
<script>
const signalBannerGetVisible = () => {
  return $('.signal-banner .feature-wrapper:not(.mob-hide-col)');
}

jQuery(() => {
  $('.signal-banner .scroll.prev-scroll').click(() => {
    let $visible = signalBannerGetVisible();

    let $toShow = $visible.prev('.feature-wrapper');
    if (!$toShow.length) {
      $toShow = $visible.siblings('.feature-wrapper').last();
    }

    $visible.addClass('mob-hide-col');
    $toShow.removeClass('mob-hide-col');
  });

  $('.signal-banner .scroll.next-scroll').click(() => {
    let $visible = signalBannerGetVisible();

    let $toShow = $visible.next('.feature-wrapper');
    if (!$toShow.length) {
      $toShow = $visible.siblings('.feature-wrapper').first();
    }

    $visible.addClass('mob-hide-col');
    $toShow.removeClass('mob-hide-col');
  });
});
</script>
<div class="signal-banner splash-transition omnibar-padding padding-0px">
  <div class="container-fluid">
    <div class="row">
      <div class="scroll prev-scroll col-xs-1 hidden-md hidden-lg">
        <i class="fa fa-arrow-circle-left"></i>
      </div>
      <div class="feature-wrapper col-md-4 col-xs-10">
        <div class="feature feature-1 feature-left" href="forumdisplay.php?f=356">
          <div class="border-1">
            <div class="border-2">
              <h1>
                Resources
                <img src="https://i.imgur.com/ovX1uA4.png" />
              </h1>
              <div class="block-content">
                <ul>
                  <li><a href="https://www.pokecommunity.com/showthread.php?t=391810">Guidelines</a></li>
                  <li><a href="https://www.pokecommunity.com/showthread.php?t=391747">Warning List</a></li>
                  <li><a href="https://www.pokecommunity.com/showthread.php?t=406939">Ban List</a></li>
                  <li><a href="https://www.pokecommunity.com/showthread.php?t=414087">Tapu Boto Commands</a></li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="feature-wrapper col-md-4 col-xs-10 mob-hide-col">
        <div class="feature feature-1 feature-center" href="forumdisplay.php?f=356">
          <div class="border-1">
            <div class="border-2">
              <h1>
                Team List
                <img src="https://i.imgur.com/9Ln5CU0.png" />
              </h1>
              <div class="block-content">
                <h3>Discord Leaders</h3>
                <ul class="team">
                  <li senior>adventure</li>
                  <li senior>dayvan cowboy</li>
                  <li senior>erik destler</li>
                </ul>
                <h3>Discord Team</h3>
                <ul class="team">
                  <li>bobandbill, Cowrie, Laslow, Logan, Pigbeetle, Rabinov, Spirit Shackle</li>
                </ul>
                <h3>BotBoi</h3>
                <ul class="team">
                  <li>Marin</li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="feature-wrapper col-md-4 col-xs-10 mob-hide-col">
        <div class="feature feature-1 feature-right" href="forumdisplay.php?f=356">
          <div class="border-1">
            <div class="border-2">
              <h1>
                New!
                <img src="https://i.imgur.com/JuLpnTs.png" />
              </h1>
              <div class="block-content">
                <h3>New Threads</h3>
                <p class="caption">
                <li><a href="https://www.pokecommunity.com/showthread.php?t=416119">Server feedback?</a></li>
                <li><a href="https://www.pokecommunity.com/showthread.php?t=416614">Staff voice chat?</a></li>
                <li><a href="https://www.pokecommunity.com/showthread.php?t=416830">HeroLinik on #pokemon</a></li>
                <li><a href="https://www.pokecommunity.com/showthread.php?t=416877">Activity-based ranking </a></li>
                <li><a href="https://www.pokecommunity.com/showthread.php?t=416878">AceTrainerTimothy Appeal #2</a></li>
                </ul>
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>


      <div class="scroll next-scroll col-xs-1 hidden-md hidden-lg">
        <i class="fa fa-arrow-circle-right"></i>
      </div>
    </div>
  </div>
</div>
</div>
</div>