index.html 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  8. <!--
  9. ___ .oOOOo. o o o
  10. .-' `'. .O o O O O
  11. / \ o o o o
  12. | ; o O O o
  13. | | ___. -, o .oOo. .oOo. OoOo. .oOoO' o .oOo. .oOo. .oOo. .oOoO
  14. _.._ |0) ~ (0) | _.-~-'`__.-( (_. O OooO' O o o o O o O O o O o O o o O
  15. __.-~'`_.. '.__.\ '~-. \_.-' ,.~-'` `""` `o .o O o O o O o O o o O o O o O O o
  16. ( ,.~-'` ',__ /./; ;, '.__.'` __ `OoooO' `OoO' oOoO' O o `OoO'o Oo `OoO' oOoO' `OoO' `OoO'o
  17. _`) ) .- -.__.' / | |\ \__..~-"" """-~.,_ O O
  18. `-~-' .'.''-._.-'`_./ /\ '. \ _.-~~~````~~~-._`-.__.' o' o'
  19. | | .' _.-' | | \ \ '. `~-~-` .oOOOo. o
  20. \ \/ .' \ \ '. '-._) o o O o
  21. \/ / \ \ `=.__`~-. O. O o
  22. / /\ `) ) / / `"".`\ `OOoo. oOo o
  23. , _.-'.'\ \ / / ( ( / / `O o O o .oOoO O .oOo. .oOo
  24. `-~~` ) ) .-'.' '.'. | ( o O o O o O o O o `Ooo.
  25. (/` ( (` ) ) '-; O. .O o O o O o O o O O
  26. ` '-; (-' `oooO' `oO `OoO'o `OoO'o o' `OoO' `OoO'
  27. -->
  28. <title>Cephalopod Studios&trade;</title>
  29. <!-- Bootstrap -->
  30. <!-- Latest compiled and minified CSS -->
  31. <link rel="stylesheet"
  32. href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
  33. <style type="text/css">
  34. #header-logo {
  35. background: url("/images/cepha_header_logo_s.png");
  36. background-size: 307px 50px;
  37. background-repeat: no-repeat;
  38. width: 320px;
  39. height: 50px;
  40. }
  41. #bottom-bar {
  42. text-align: center;
  43. }
  44. #bottom-bar ul li {
  45. margin: 0;
  46. padding: 0;
  47. display: inline;
  48. }
  49. #bottom-bar .follow-us {
  50. width: 50px;
  51. }
  52. </style>
  53. </head>
  54. <body>
  55. <!-- Static navbar -->
  56. <nav class="navbar navbar-default">
  57. <div class="container-fluid">
  58. <div class="navbar-header">
  59. <button type="button" class="navbar-toggle collapsed"
  60. data-toggle="collapse" data-target="#navbar" aria-expanded="false"
  61. aria-controls="navbar">
  62. <span class="sr-only">Toggle navigation</span> <span
  63. class="icon-bar"></span> <span class="icon-bar"></span> <span
  64. class="icon-bar"></span>
  65. </button>
  66. <a id="header-logo" class="navbar-brand" href="/"></a>
  67. </div>
  68. <div id="navbar" class="navbar-collapse collapse">
  69. <ul class="nav navbar-nav">
  70. <li class="active"><a href="/">Home</a></li>
  71. <li class="dropdown"><a href="#" class="dropdown-toggle"
  72. data-toggle="dropdown" role="button" aria-expanded="false">Games <span
  73. class="caret"></span></a>
  74. <ul class="dropdown-menu" role="menu">
  75. <li class="dropdown-header">Magic Apps</li>
  76. <li><a href="/games/cardtrick">APPEAR! Cards</a></li>
  77. <li><a href="#">APPEAR! Zodiac</a></li>
  78. <li class="divider"></li>
  79. <li class="dropdown-header">Games</li>
  80. <li><a href="#">Project Strawberry</a></li>
  81. <li><a href="#">TBD</a></li>
  82. </ul></li>
  83. <li><a href="/process">Process</a></li>
  84. <li><a href="/contact-us">Contact</a></li>
  85. <li><a href="/jobs">Jobs</a></li>
  86. </ul>
  87. </div>
  88. <!--/.nav-collapse -->
  89. </div>
  90. <!--/.container-fluid -->
  91. </nav>
  92. <section id="content">
  93. <h1>APPEAR! Cards</h1>
  94. <h4>Cephalopod Studios&trade;</h4>
  95. <p>Amaze your friends and family with your ability to make any card APPEAR on your phone, just by gently rubbing the screen with your finger.</p>
  96. <p>The mentalist Jim Karol is recognized for his incredible memory and deep understanding of human attention and focus. He prefers to use "science" over "magic" when dazzling audiences. This simple card trick app can be used to both impress your friends and improve your memory recall ability.</p>
  97. <p>When you first start using the card trick, first go into the Training mode. Here, you will be instructed on how the trick works, and then given an opportunity to practice with feedback on your speed and accuracy. Once you are fast and confident in your abilities, perform the trick in front of the shocked faces of your friends or even complete strangers!</p>
  98. <p>Have questions or concerns? Please send all emails to: <a href="mailto:cardtrick@cephalopodstudios.com">CardTrick@CephalopodStudios.com</a>
  99. </section>
  100. <hr>
  101. <footer id="bottom-bar">
  102. <ul>
  103. <li><a href="mailto:info@cephalopodstudios.com"><img class="follow-us" src="/images/gmail.png" alt="gmail" /></a></li>
  104. <li><a href="http://twitter.com/cephastudios"><img class="follow-us" src="/images/twitter.png" alt="twitter" /></a></li>
  105. <li><a href="https://www.facebook.com/cephalopodstudios"><img class="follow-us" src="/images/facebook.png" alt="facebook" /></a></li>
  106. <li><a href="http://www.youtube.com/cephalopodstudios"><img class="follow-us" src="/images/youtube.png" alt="youtube" /></a></li>
  107. </ul>
  108. 2015 Cephalopod Studios&trade;
  109. </footer>
  110. <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  111. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  112. <!-- Include all compiled plugins (below), or include individual files as needed -->
  113. <!-- Latest compiled and minified JavaScript -->
  114. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
  115. <script>
  116. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  117. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  118. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  119. })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  120. ga('create', 'UA-52532707-1', 'auto');
  121. ga('send', 'pageview');
  122. </script>
  123. </body>
  124. </html>