Difference between revisions of "Template:IONIS Paris-test"
(37 intermediate revisions by the same user not shown) | |||
Line 11: | Line 11: | ||
<!-- font awesome --> | <!-- font awesome --> | ||
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> | <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<!-- favicon --> | <!-- favicon --> | ||
Line 30: | Line 22: | ||
<div class="topbar animated fadeInLeftBig"></div> | <div class="topbar animated fadeInLeftBig"></div> | ||
− | <!-- | + | <!-- Banner --> |
− | + | ||
− | + | ||
− | + | ||
<div class="banner row" id="banner"> | <div class="banner row" id="banner"> | ||
− | <div class="parallax text-center" style="background-image: url(https://static.igem.org/mediawiki/2015/2/2f/TEST.jpg);"> | + | <div class="parallax text-center" style="background-image: url(https://static.igem.org/mediawiki/2015/2/2f/TEST.jpg);width:100%;"> |
<div class="parallax-pattern-overlay" style="background: rgb(200,200,200,0.6);background-size: cover; color:#fff; "> | <div class="parallax-pattern-overlay" style="background: rgb(200,200,200,0.6);background-size: cover; color:#fff; "> | ||
<div class="container text-center" style="height:580px;padding-top:20px;"> | <div class="container text-center" style="height:580px;padding-top:20px;"> | ||
<h2 class="intro wow zoomIn" wow-data-delay="0.4s" wow-data-duration="0.9s" style="padding-top:75px;">IONIS Paris iGEM</h2> | <h2 class="intro wow zoomIn" wow-data-delay="0.4s" wow-data-duration="0.9s" style="padding-top:75px;">IONIS Paris iGEM</h2> | ||
− | <a href="#"><img id="site-title" class=" wow fadeInDown" wow-data-delay="0.0s" wow-data-duration="0.9s" src="https://static.igem.org/mediawiki/2015/ | + | <a href="#"><img id="site-title" class=" wow fadeInDown" wow-data-delay="0.0s" wow-data-duration="0.9s" src="https://static.igem.org/mediawiki/2015/d/d8/Logo-Blanc-sans_fond.png" width="500" height=auto alt="logo"/></a> |
+ | <!-- https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png --> | ||
</div> | </div> | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | </div> | |
− | + | ||
− | + | ||
− | + | <!--img src="https://static.igem.org/mediawiki/2015/0/07/Fond_IONIS.jpg" alt="banner"--> | |
− | + | <!-- Introduction --> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | <!-- | + | |
<div id="about" class="container spacer about"> | <div id="about" class="container spacer about"> | ||
− | + | <h2 class="text-center wowload fadeInUp" style="color:#ff0000"> <big>Popularization of Synthetic Biology</big></h2> | |
− | + | <h3 class="text-center wowload fadeInUp">BACT'Man: The hero of the Bio-Console!</h3> | |
− | + | <div class="row"> | |
− | + | <div class="col-sm-6 wowload fadeInLeft"> | |
− | + | <h4><i class="fa fa-gamepad"style="color:#b22222" ></i> The Bio-Console: allow BACT'Man to survive as long as possible </h4> | |
− | + | <p align="justify">Most video games are inspired by reality to create a <font style="color:#66cdaa">VIRTUAL WORLD</font>, in order to make them more realistic. When do we expect to do the opposite? Virtual draw to play with the living to revisit and perceive the gaming world in a new way and thus to have new sensations with the game. Imagine a bacterium, that you can view on your computer screen and that you can control using your joystick. </p> | |
− | + | <p>The Bio-Console: the first game console, where the games will not be so virtual!</p> | |
− | + | </div> | |
− | + | ||
− | + | <div class="col-sm-6 wowload fadeInRight"> | |
− | + | <h4><i class="fa fa-mobile" style="color:#b22222"></i> The mobile application: Biology, Synthetic Biology & Safety! </h4> | |
− | + | <p align="justify"> Follow <b>BACT’Man </b>: from the human's bowels to the iGEM laboratory. He evolves to become a super bacterium and bring the world all the innovations of synthetic biology ! To succeed, you will need to be ingenious and to discover the workings of biology. Progress, explore and help Bact’man along his trip and overcome the challenges on your way.</p> | |
− | + | <p> Races, puzzles, speed games : biology and being a bacteria have never been so funny! </p> | |
− | + | </div> | |
− | + | </div> | |
</div> | </div> | ||
+ | |||
+ | <!-- Circle --> | ||
<div class="services container"> | <div class="services container"> | ||
<h3 class="text-center wowload fadeInUp"> A Multidisciplinary Project</h3> | <h3 class="text-center wowload fadeInUp"> A Multidisciplinary Project</h3> | ||
Line 98: | Line 81: | ||
</li> | </li> | ||
</ul> | </ul> | ||
− | |||
</div> | </div> | ||
<!-- #Cirlce Ends --> | <!-- #Cirlce Ends --> | ||
+ | |||
+ | <!--div boxes --> | ||
+ | </div> | ||
− | + | <!-- BOXES --> | |
− | <!-- | + | |
<div id="works" class=" clearfix grid"> | <div id="works" class=" clearfix grid"> | ||
− | <figure class="effect-oscar wowload fadeInUp"> | + | |
+ | <figure class="effect-oscar wowload fadeInUp" > | ||
<img src="https://static.igem.org/mediawiki/2015/3/34/Wii.jpg" alt="img01"/> | <img src="https://static.igem.org/mediawiki/2015/3/34/Wii.jpg" alt="img01"/> | ||
− | |||
<figcaption> | <figcaption> | ||
<h2>BIO-CONSOLE</h2> | <h2>BIO-CONSOLE</h2> | ||
Line 114: | Line 98: | ||
</figcaption> | </figcaption> | ||
</figure> | </figure> | ||
+ | |||
− | + | ||
− | + | <figure class="effect-oscar wowload fadeInUp"> | |
− | <img src="https://static.igem.org/mediawiki/2015/8/ | + | <img src="https://static.igem.org/mediawiki/2015/8/83/Mobile.jpg" alt="img01"/> |
+ | |||
<figcaption> | <figcaption> | ||
<h2>APPLICATION</h2> | <h2>APPLICATION</h2> | ||
Line 127: | Line 113: | ||
<!--https://static.igem.org/mediawiki/2015/c/c2/Schema1_IONIS.png--> | <!--https://static.igem.org/mediawiki/2015/c/c2/Schema1_IONIS.png--> | ||
− | |||
− | |||
− | |||
<figure class="effect-oscar wowload fadeInUp"> | <figure class="effect-oscar wowload fadeInUp"> | ||
<img style="width:auto"; src="https://static.igem.org/mediawiki/2015/1/19/NOTE.jpg" alt="img01"/> | <img style="width:auto"; src="https://static.igem.org/mediawiki/2015/1/19/NOTE.jpg" alt="img01"/> | ||
Line 139: | Line 122: | ||
</figure> | </figure> | ||
<!--https://static.igem.org/mediawiki/2015/thumb/9/93/Notebook.jpg/600px-Notebook.jpg--> | <!--https://static.igem.org/mediawiki/2015/thumb/9/93/Notebook.jpg/600px-Notebook.jpg--> | ||
+ | |||
<figure class="effect-oscar wowload fadeInUp"> | <figure class="effect-oscar wowload fadeInUp"> | ||
<img src="https://static.igem.org/mediawiki/2015/thumb/1/18/Brick-wall.png/800px-Brick-wall.png" alt="team"/> | <img src="https://static.igem.org/mediawiki/2015/thumb/1/18/Brick-wall.png/800px-Brick-wall.png" alt="team"/> | ||
Line 147: | Line 131: | ||
</figcaption> | </figcaption> | ||
</figure> | </figure> | ||
− | |||
− | |||
<figure class="effect-oscar wowload fadeInUp"> | <figure class="effect-oscar wowload fadeInUp"> | ||
Line 158: | Line 140: | ||
</figcaption> | </figcaption> | ||
</figure> | </figure> | ||
− | |||
<figure class="effect-oscar wowload fadeInUp"> | <figure class="effect-oscar wowload fadeInUp"> | ||
Line 169: | Line 150: | ||
</figure> | </figure> | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | <!-- | + | <!-- END BOXES --> |
− | + | ||
</br> | </br> | ||
</br> | </br> | ||
− | + | <!-- HIGHLIGHT INFO --> | |
− | + | ||
− | + | ||
− | + | ||
− | <!-- | + | |
<div class="highlight-info"> | <div class="highlight-info"> | ||
<div class="overlay spacer"> | <div class="overlay spacer"> | ||
<div class="container" > | <div class="container" > | ||
− | + | <div class="row text-center wowload fadeInDownBig"> | |
− | + | <CENTER> | |
− | + | <div class="col-sm-3 col-xs-6"> | |
− | + | <i class="fa fa-smile-o fa-5x"></i><h4>13 Members</h4> | |
− | + | </div> | |
− | + | <div class="col-sm-3 col-xs-6"> | |
− | + | <i class="fa fa-map-marker fa-5x"></i><h4>4 Schools</h4> | |
− | + | </div> | |
− | + | ||
− | + | <div class="col-sm-3 col-xs-6"> | |
− | + | <i class="fa fa-gamepad fa-5x"></i><h4>1 Bio-Console</h4> | |
− | + | </div> | |
− | + | ||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <i class="fa fa-tablet fa-5x"></i><h4>1 Mobile Application</h4> | ||
+ | </div> | ||
+ | </CENTER> | ||
</div> | </div> | ||
− | |||
− | |||
</div> | </div> | ||
</div> | </div> | ||
Line 235: | Line 186: | ||
<!-- VIDEO --> | <!-- VIDEO --> | ||
− | <div id="contact" class="spacer"> | + | <div id="contact" class="spacer"> |
− | + | <div class="container"> | |
− | <div class="container"> | + | <h2 class="text-center wowload fadeInUp">What is iGEM ?</h2> |
− | <h2 class="text-center wowload fadeInUp">What is iGEM ?</h2> | + | <CENTER> |
− | + | <video width="500" height="281.25" poster="https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png" controls> | |
− | + | <source src="https://static.igem.org/mediawiki/2015/7/73/Video-1438606819.mp4.mp4" type='video/mp4'/> | |
− | + | <source src="https://static.igem.org/mediawiki/2015/9/90/Video-1438606819.mp4.ogg" type='video/ogg; codecs="theora, vorbis"'/> | |
− | + | <source src="https://static.igem.org/mediawiki/2015/f/fb/Video-1438606819.mp4.webm" type='video/webm; codecs="vp8, vorbis"'/> | |
− | + | <a href="https://www.youtube.com/watch?v=DWUxy4g_p7w"><img border="0" src="https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png" alt="Click to view on Youtube" width="500" height="281.25"></a> | |
− | + | <p style="font-style:italic;color:red;border-style:solid;border-width:2px;border-color:red">Your browser either does not support HTML5 or cannot handle MediaWiki open video formats. Please consider upgrading your browser, installing the appropriate plugin or switching to a Firefox or Chrome install.</p> | |
− | + | </video> | |
− | + | </CENTER> | |
− | <video width="500" height="281.25" poster="https://static.igem.org/mediawiki/2015/8/83/Logo_IONIS.png" controls> | + | </div> |
− | <source src="https://static.igem.org/mediawiki/2015/7/73/Video-1438606819.mp4.mp4" type='video/mp4'/> | + | </div> |
− | <source src="https://static.igem.org/mediawiki/2015/9/90/Video-1438606819.mp4.ogg" type='video/ogg; codecs="theora, vorbis"'/> | + | |
− | <source src="https://static.igem.org/mediawiki/2015/f/fb/Video-1438606819.mp4.webm" type='video/webm; codecs="vp8, vorbis"'/> | + | |
− | + | <!--SPONSORS--> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | <!-- | + | |
<div class="sponsors"> | <div class="sponsors"> | ||
− | + | <div id="contact" class="overlay spacer" > | |
− | + | <div class="container contactform center"> | |
− | + | <h2 class="text-center wowload fadeInUp" style="color:#fff">Our sponsors</h2> | |
− | + | <br> | |
− | + | <CENTER> | |
− | + | <div class="col-sm-3 col-xs-6"> | |
− | + | <a href="http://www.supbiotech.fr/en/index.aspx"> | |
− | + | <img src="https://static.igem.org/mediawiki/2015/3/30/LOGO-SUPBIOTECH-2015-QUADRI.png" alt="partners" width="150" height=auto> | |
− | + | </a> | |
− | + | </div> | |
− | + | <div class="col-sm-3 col-xs-6"> | |
+ | <a href="http://www.e-artsup.net/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/9/98/Logo-e-artsup.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="http://www.epita.fr/international/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/9/9b/Logo-epita-hd.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="http://ionis-group.com/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/2/2e/Logo_ionis.jpg" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | </CENTER> | ||
</div> | </div> | ||
− | <div class="col-sm-3 col-xs-6"> | + | <br> |
− | + | ||
− | <img src="https://static.igem.org/mediawiki/2015/ | + | <div class="container contactform center"> |
− | + | <br> | |
+ | <CENTER> | ||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="http://www.fluigent.com/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/c/c1/Fluigent-basic.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="https://www.qiagen.com"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/a/a0/Qiagen_logo.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="https://www.neb.com/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/e/e1/NEB.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="https://www.uni-freiburg.de/start-en.html?set_language=en"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/5/59/Uni_Logo.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | </CENTER> | ||
</div> | </div> | ||
− | <div class="col-sm-3 col-xs-6"> | + | <br> |
− | + | <div class="container contactform center"> | |
− | <img src="https://static.igem.org/mediawiki/2015/ | + | <CENTER> |
− | + | <div class="col-sm-3 col-xs-6"> | |
+ | <a href="https://www.exzellenz.uni-freiburg.de/einrichtungen-en/bioss-en/bioss-en?set_language=en"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/4/41/Bioss-4.jpg" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="https://www.kickstarter.com/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/thumb/2/26/Kickstarter-logo-light.png/800px-Kickstarter-logo-light.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="http://fr.ambafrance-us.org/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/b/b8/Logo_Embassy-of-France_OS%26T_300_dpi.jpg" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | |||
+ | <div class="col-sm-3 col-xs-6"> | ||
+ | <a href="https://communicationmicrofactory.wordpress.com/nous/"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/0/01/Microfactory.png" alt="partners" width="150" height=auto> | ||
+ | </a> | ||
+ | </div> | ||
+ | </CENTER> | ||
</div> | </div> | ||
− | + | ||
− | + | ||
− | + | </div> | |
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
Line 360: | Line 312: | ||
− | <!-- | + | <!-- UP TOP --> |
<a href="#banner" class="gototop "><i class="fa fa-chevron-circle-up fa-3x"></i></a> | <a href="#banner" class="gototop "><i class="fa fa-chevron-circle-up fa-3x"></i></a> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</body> | </body> | ||
</html> | </html> |
Latest revision as of 10:33, 26 August 2015
Popularization of Synthetic Biology
BACT'Man: The hero of the Bio-Console!
The Bio-Console: allow BACT'Man to survive as long as possible
Most video games are inspired by reality to create a VIRTUAL WORLD, in order to make them more realistic. When do we expect to do the opposite? Virtual draw to play with the living to revisit and perceive the gaming world in a new way and thus to have new sensations with the game. Imagine a bacterium, that you can view on your computer screen and that you can control using your joystick.
The Bio-Console: the first game console, where the games will not be so virtual!
The mobile application: Biology, Synthetic Biology & Safety!
Follow BACT’Man : from the human's bowels to the iGEM laboratory. He evolves to become a super bacterium and bring the world all the innovations of synthetic biology ! To succeed, you will need to be ingenious and to discover the workings of biology. Progress, explore and help Bact’man along his trip and overcome the challenges on your way.
Races, puzzles, speed games : biology and being a bacteria have never been so funny!
A Multidisciplinary Project
- Playful
- Engineering
- Microfluidics
- Computer Sciences
- Safety issues