aboutus.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <meta charset="utf-8">
   5     <meta name=viewport content="width=device-width, initial-scale=1">
   6     <link rel="stylesheet" href="/css/main.css" type="text/css">
   7     <title>About Us ~ Yukkuri Games</title>
   8     <style>
   9       h2 {
  10           max-width: 20em;
  11           margin: auto;
  12           display: inline-block;
  13           padding-left: 2em;
  14           padding-right: 2em;
  15       }
  16
  17       main {
  18           text-align: center;
  19       }
  20
  21       .mlp {
  22           max-width: 20em;
  23           margin: auto;
  24           text-align: center;
  25           list-style-type: none;
  26           margin-bottom: 2em;
  27           margin-top: 1em;
  28       }
  29
  30       .entity {
  31           display: inline-block;
  32           width: 13em;
  33           margin: 1em;
  34           vertical-align: top;
  35       }
  36
  37       .entity h4 {
  38           font-size: 1.25em;
  39       }
  40
  41       .entity p {
  42           font-weight: 300;
  43           font-size: 0.875em;
  44       }
  45
  46       .entity img {
  47           border: solid rgb(206, 132, 242) 2px;
  48           border-radius: 50%;
  49           width: 9em;
  50           height: 9em;
  51           transition: border-radius 0.3s, border-color 0.3s;
  52       }
  53
  54       .entity img:hover {
  55           border-radius: 10%;
  56           border-color: rgb(244, 126, 126);
  57       }
  58     </style>
  59   </head>
  60   <body>
  61     <header>
  62       <a href="/">
  63         <img src="/logotype_horizontal_1.png" class=logo alt="(◕ ヮ ◕)">
  64         <img src="/logotype_horizontal_2.png" class=optional
  65              alt="Yukkuri Games">
  66       </a>
  67       <h1>About Us</h1>
  68     </header>
  69     <main>
  70       <div style="text-align: center">
  71         <div class=entity>
  72           <h4><a href="https://korewanetadesu.com/">Joe</a></h4>
  73           <img src=joe.jpg>
  74           <p>
  75             Unexpectedly sentient code that escaped from Silicon
  76             Valley before shit got real bad.
  77           </p>
  78         </div>
  79         <div class=entity>
  80           <h4><a href="https://twitter.com/JessicatzF">Jess</a></h4>
  81           <img src=jess.jpg>
  82           <p>
  83             Last survivor in a line of witches sworn to destroy games
  84             in order to save them.
  85           </p>
  86         </div>
  87         <div class=entity>
  88           <h4>Sid</h4>
  89           <img src="sid.jpg">
  90           <p>
  91             By day, just a cat. By night, the loudest cat.
  92           </p>
  93         </div>
  94       </div>
  95       <p style='text-align: center'>
  96         We make games and game-like things and other things.
  97       </p>
  98       <p style='text-align: center'>
  99         Manifestos are boring so here are some things we like that you
 100         should check out. They intersect with our views but also
 101         they're consistently great.
 102       </p>
 103       <h2>Games</h2>
 104       <ul class=mlp>
 105         <li><a href="http://borderhouseblog.com/">The Border House</a></li>
 106         <li><a href="http://www.critical-distance.com/">Critical Distance</a></li>
 107         <li><a href="http://forestambassador.com/">forest ambassador</a></li>
 108         <li><a href="http://itch.io/">itch.io</a></li>
 109         <li><a href="http://odditie-s.tumblr.com/">Oddities</a></li>
 110         <li><a href="http://www.indiebound.org/book/9781609803728">Rise of the Videogame Zinesters</a></li>
 111         <li><a href="http://www.feministfrequency.com/tag/tropes-vs-women-in-video-games/">Tropes vs. Women in Videogames</a></li>
 112         <li><a href="http://warpdoor.com/">Warp Door</a></li>
 113       </ul>
 114       <h2>Not Games</h2>
 115       <ul class=mlp>
 116         <li><a href="http://adainitiative.org/">The Ada Initiative</a></li>
 117         <li><a href="http://www.apex-magazine.com/">Apex Magazine</a></li>
 118         <li><a href="http://futurefire.net/">The Future Fire</a></li>
 119         <li><a href="http://geekfeminism.org/">Geek Feminism</a></li>
 120         <li><a href="http://modelviewculture.com/">Model View Culture</a></li>
 121         <li><a href="http://www.racialicious.com/">Racialicious</a></li>
 122         <li><a href="http://www.scarleteen.com/">Scarleteen</a></li>
 123       </ul>
 124       <p>
 125         You can contact us by emailing
 126         <a href="mailto:yuuSPAM@MAPSyukkurigames.com"
 127          rel="nofollow"
 128          onclick="this.href=this.href.replace(/[A-Z]/g, '')">emailing
 129           yuu at yukkurigames.com</a>.
 130       </p>
 131     </main>
 132   </body>
 133 </html>