capsule.html

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://use.typekit.net/nxb0yjw.css">

<style>

.body {
  margin: 0;
}

/* start grid style */

.grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background-color: #000000;
}

.grid-item {
  text-align: center;
}

/* start overlay style */

.container {
  position: relative;
  width: 100%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #d94b4e;
}

.container:hover .overlay {
  opacity: .9;
}

.text {
  color: white;
  font-size: 1.5vw;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  font-family: loos-wide,sans-serif;
  font-style: normal;
}

@media screen and (max-width: 900px) {
  .grid-container {
    grid-template-columns: repeat(1, 1fr);
  }
  .text {
    font-size: 4vw;
  }
  .overlay {
    background-color: transparent;
    opacity: .9;
  }
}

</style>

<div class="grid-container">

  <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/N44Y2SIAIVBT3EXNFQTWLUZCPM.png" alt="2d digital illustration of a purple person with headphones in front of a waveform." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/podcasting-as-the-gen-z-medium/" class="overlay">
    <div class="text">Podcasting as the Gen-Z medium</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/W5FYLKP6EJGRFNTNU5J5LHEXMA.jpeg" alt="Scan of a poloroid photo of a young person in a Bugs Bunny tshirt." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/the-cans-in-the-grass/" class="overlay">
    <div class="text">The cans in the grass</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/4RSLESRVLNHPZDN5D43ZJWYKJQ.png" alt="Digital line drawing of two arms hugging a heart." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/policing-to-protect-exploring-the-effects-of-colonialism-on-black-family-dynamics/" class="overlay">
    <div class="text">Policing to protect: Exploring the effects of colonialism on Black family dynamics</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/2P67CXZPWBEKZIAZFNV3YL6MWQ.jpg" alt="Portrait of Queen Elizabeth II with a bar over her eyes with the text Lizzy's in a Box. Original photo by Laura1822 and ChasLitster" class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/love-her-or-hate-her-what-caused-the-mixed-reactions-to-the-queens-death/" class="overlay">
    <div class="text">Love her or hate her: What’s causing the mixed reactions to the Queen’s death?</div>
  </a>
</div>
  </div>

    <div class="grid-item">
      <iframe style="min-width: 200%; max-height: 800px; min-height: 100%; position:relative; margin: -3% 0% 0% -51%; scrolling: no; border: none; z-index: 5;" src="https://rive.app/s/tLdm5-BQD0mV3h6xkbbU8g/embed" allowfullscreen></iframe>
</div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/I3TKETMC6FE23GXZ4GUG3MAPG4.jpg" alt="Art of a woman with a flower." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/what-color-is-the-orchid-today/" class="overlay">
    <div class="text">What color is the orchid today?</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/RMJYK6L3ERCILCTRFWKH7EYG5Y.jpg" alt="Digital illustration of a hacker in a puffy jacket using a laptop. Art courtesy of delcarmat." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/battling-hate-raids-on-twitch/" class="overlay">
    <div class="text">Battling hate raids on Twitch: the Black streamer experience</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/VVBWIHMVRRGULIL3PBV45BFYLA.jpg" alt="Photo of a woman doing her makeup pretending to use a hamburger as a mirror." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/growing-up-chinese-in-middle-america/" class="overlay">
    <div class="text">Growing up Chinese in Middle America</div>
  </a>
</div>
  </div>

    <div class="grid-item">
    <div class="container">
  <img src="https://cloudfront-us-east-1.images.arcpublishing.com/uscannenberg/PI43UHWELNH37KDSF72VPKILGI.png" alt="Graphic of text on a black and white photo." class="image">
  <a href="https://www.uscannenbergmedia.com/2023/01/11/reverberations-of-revolution/" class="overlay">
    <div class="text">Reverberations of Revolution</div>
</a>
</div>
  </div>


</div>

<!--end of grid-->

<div style="padding: 5%; background-color:white;">
<p>
 We store the important things in capsules to last far beyond our own lives. Stories are no different. Whether through oral or written tradition, stories endure generations and epochs, regimes and upheavals. The literature which persists through the sands of time persists for good reason; we draw from it, again and again, to reveal something about ourselves. And we too, create these lasting stories. We write to capture moments and ideas and fleeting thoughts, yearning to immortalize an essence of ourselves, our loved ones and the things that matter to us.
</p>
<br><p>
In creating Capsule, we wanted to provide both a platform to showcase USC writers’ work and foster a supportive community for their literary ambitions. As journalism students ourselves, we stepped foot on campus with our own idealized concepts of quality journalism and storytelling, and embarked on writing those stories. The years since have been a learning process for us; our goals were buoyed and amplified by the abundance of resources and brilliant faculty at this private institution, but also softened by the rigidity of curriculum and discouraged by the rapaciousness of industry demands. What was once a simple, naïve mission to explore and create the stories which mattered to us has since been saddled with considerations for wage, revenue, optimization and readability, among other myopic concerns. We created Capsule to carve out space for writers to devote total mind space –– or as much as possible in the life of a student –– toward their writing, without the extras. We're grateful that USC Annenberg Media has supported Capsule’s vision, and for providing the support and freedom that has allowed our writers, and their stories, to flourish.
</p>
<br><p>
In this inaugural issue of Capsule, you will find eight personal essays, longform reported pieces and perspective editorials, all crafted by the writers in a complete process that involved pitching, writing and multiple rounds of edits. These stories are about, but not limited to, revolution, identity, assimilation, family, politics, colonialism and loss. In an early meeting with our writers, we asked them to think and write critically; they responded by spending months experimenting with style, sharpening their voice and perfecting their work. We hope you find their stories as compelling as we did.
</p>
<br><p>
From the Editors In Chief,
</p>
<br><p>
Amina Niasse & Eddie Sun
</p>
</div>


</div>
</div>
<hr>