Difference between revisions of "Team:Munich"

(Undo revision 16095 by Sven klumpe (talk))
 
(106 intermediate revisions by 5 users not shown)
Line 1: Line 1:
{{Munich}}
+
<!-- #919191 Grau1 -->
 +
<!-- #787878 Grau2 -->
 +
<!-- #51A7f9 Blau1 -->
 +
<!-- #3c7cb9 Blau2 -->
 +
<!-- #ffffff weiss -->
 
<html>
 
<html>
 
 
<head>
 
<head>
<link type="text/css" rel="stylesheet" href="css/lightslider.css" />                
+
<link rel="stylesheet" type="text/css"  
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
+
href="https://2017.igem.org/Template:Munich/CSS?action=raw&ctype=text/css" />
<script src="js/lightslider.js"></script>
+
<link rel="stylesheet" type="text/css"
 +
href="https://2017.igem.org/Template:Munich/Header?action=raw&ctype=text/css" />
 +
<style>
 +
body {line-height: initial;}
 +
h1, h2,h3 {
 +
color: #51a7f9 !important;
 +
text-align: center !important;
 +
}
  
</head>
+
/*Time for the CSS*/
 +
* {margin: 0; padding: 0;}
  
<img src="https://static.igem.org/mediawiki/2017/thumb/c/cd/Groupphoto_170504.jpeg/800px-Groupphoto_170504.jpeg">
+
.slider{
<div class="column full_size" >
+
width: 900px; /*Same as width of the large image*/
<h3> Welcome to our wiki! </h3>
+
position: relative;
<p>Our wiki is under construction but you can follow us on the social media!</p>
+
/*Instead of height we will use padding*/
<p>
+
padding-top: 600px; /*That helps bring the labels down*/
<a href="https://www.facebook.com/Munich.iGEM">Facebook</a>
+
<a href="https://www.instagram.com/igem.munich.2017 ">Instagram</a></p>
+
/*Lets add a shadow*/
 +
}
  
 +
 +
/*Last thing remaining is to add transitions*/
 +
.slider>img{
 +
position: absolute;
 +
left: 0; top: 0;
 +
transition: all 0.5s;
 +
}
 +
 +
.slider input[name='slide_switch'] {
 +
display: none;
 +
}
 +
 +
.slider label {
 +
/*Lets add some spacing for the thumbnails*/
 +
margin: 30px 0 0 18px;
 +
 +
float: left;
 +
cursor: pointer;
 +
transition: all 0.5s;
 +
 +
/*Default style = low opacity*/
 +
opacity: 0.6;
 +
 +
        z-index: 99;
 +
}
 +
 +
.slider label img{
 +
display: block;
 +
}
 +
 +
/*Time to add the click effects*/
 +
.slider input[name='slide_switch']:checked+label {
 +
border-color: #666;
 +
opacity: 1;
 +
}
 +
/*Clicking any thumbnail now should change its opacity(style)*/
 +
/*Time to work on the main images*/
 +
.slider input[name='slide_switch'] ~ img {
 +
opacity: 0;
 +
transform: scale(1.1);
 +
}
 +
/*That hides all main images at a 110% size
 +
On click the images will be displayed at normal size to complete the effect
 +
*/
 +
.slider input[name='slide_switch']:checked+label+img {
 +
opacity: 1;
 +
transform: scale(1);
 +
}
 +
/*Clicking on any thumbnail now should activate the image related to it*/
 +
 +
/*We are done :)*/
 +
</style>
 +
</head></html>
 +
{{Munich/Menu}}
 +
<html>
 +
<body>
 +
<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>
 +
<!-- Content -->
 +
<tr><td width="100%" colspan=3>
 +
<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>
 +
<tr>
 +
<td width="40%">
 +
</td>
 +
<td id="myContent" width="20%" valign=top align=center>
 
<br>
 
<br>
<p>Please contact us per email for collaboration and more: </p>
+
<!-- Head End -->
<p><a href="mailto:igem.munich%40gmail.com">igem.munich@gmail.com</a></p>
+
<!-- Content Begin -->
</div>  
+
<video width="980" autoplay="autoplay" controls>
 +
<source src="https://static.igem.org/mediawiki/2017/4/44/T--Munich--FrontPageVideo.mp4" type="video/mp4">
 +
Your browser does not support the video tag.
 +
</video>
 +
<table width="900" border=0 cellspacing=0 cellpadding=10>
 +
<tr>
 +
<td width=160></td>
 +
<td width=160></td>
 +
<td width=160></td>
 +
<td width=160></td>
 +
<td width=160></td>
 +
<td width=160></td>
 +
</tr>
 +
<tr><td colspan=6 align=left valign=center>
 +
<font size=7 ><b style="color: #51a7f9">Abstract</b></font>
 +
</td></tr>
 +
<tr><td align=center valign=center colspan=6>
 +
<p style="text-align:justify">
 +
<font size=3 color=#444444>
 +
The ongoing crisis of increasing antibiotic resistance demands innovative preventive strategies. Recently, the RNA-targeting protein CRISPR-Cas13a has been used for highly sensitive DNA and RNA detection, promising diverse applications in point-of-care diagnostics. We integrated Cas13a in the detection unit of CascAID, our GMO-free diagnostic platform. CascAID combines an automated microfluidic device for rapid lysis and extraction of nucleic acids with a paper-based readout system. We demonstrated the performance of our device by targeting the 16S rRNA from <i>E. coli</i>. We improved the detection limit of our platform, using simulations to optimize our amplification scheme and the final readout.
 +
</font>
 +
</p>
 +
<p style="text-align:justify; margin-bottom: 50px">
 +
<font size=3 color=#444444>
 +
Conceived as a distributable platform for rapid point-of-care diagnostics, CascAID can be used to distinguish between bacterial and viral infections, thus minimizing the widespread use of antibiotics.
 +
Furthermore, Cas13a allows the fast design of target sequences, making our system adaptive to the emergence of new viral outbreaks or fast mutating pathogens.
 +
</font>
 +
</p>
 +
</td></tr>
 +
<tr><td colspan=6 align=middle valign=center>
 +
<font size=10 ><b style="color: #51a7f9; font-size: 60px; margin-top: 20px">Awards & Achievements</b></font>
 +
</td></tr>
 +
<tr>
 +
<td colspan=6>
 +
<img src="https://static.igem.org/mediawiki/2017/e/e5/T--Munich--Banner_Awards.jpg" width=900>
 +
</td>
 +
</tr>
 +
<tr>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h1>First Runner-up</h1>
 +
</div>
 +
</td>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h1>Best Diagnostics Project</h1>
 +
</div>
 +
</td>
 +
</tr>
 +
 
 +
<tr>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h2>Best Model</h2>
 +
</div>
 +
</td>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h2>Best Applied Design</h2>
 +
</div>
 +
</td>
 +
</tr>
 +
 
 +
<tr>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h2>Best Hardware</h2>
 +
</div>
 +
</td>
 +
<td align=center valign=center colspan=3>
 +
<div class="captionPicture">
 +
<h2>Best Software</h2>
 +
</div>
 +
</td>
 +
</tr>
 +
 
 +
 
 +
<tr>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Wiki</h3>
 +
</td>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Presentation</h3>
 +
</td>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Poster</h3>
 +
</td>
 +
</tr>
 +
 
 +
<tr>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Integrated Human Practices</h3>
 +
</td>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Education & Public Engagement</h3>
 +
</td>
 +
<td align=center valign=center colspan=2>
 +
<h3>Nominated for Best Measurement</h3>
 +
</td>
 +
</tr>
 +
 
 +
 
 +
<tr>
 +
<td align=center valign=center colspan=1></td>
 +
<td align=center valign=center colspan=2>
 +
<h3 style="margin-bottom: 50px">Nominated for Best Composite Part</h3>
 +
</td>
 +
<td align=center valign=center colspan=2>
 +
<h3 style="margin-bottom: 50px">Nominated for Best Part Collection</h3>
 +
</td>
 +
<td align=center valign=center colspan=1></td>
 +
</tr>
 +
 
 +
<tr><td colspan=6 align=middle valign=center>
 +
<font size=10 ><b style="color: #51a7f9; font-size: 60px; margin-top: 20px">Gallery</b></font>
 +
</td></tr>
 +
 
 +
<tr> <td colspan=6 align=middle valing=center>
 +
<!--
 +
We will make a slider with stylized thumbnails using CSS3
 +
The markup is very simple:
 +
Radio Inputs
 +
Labels with thumbnails to detect click event
 +
Main Image
 +
-->
 +
<div class="slider">
 +
 +
<input type="radio" name="slide_switch" id="id3" checked="checked"/>
 +
<label for="id3">
 +
<img src="https://static.igem.org/mediawiki/2017/9/99/T--Munich--Review2017_77.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/9/99/T--Munich--Review2017_77.jpeg" width=900/>
 +
<!--Lets show the second image by default on page load-->
 +
<input type="radio" name="slide_switch" id="id2" />
 +
<label for="id2">
 +
<img src="https://static.igem.org/mediawiki/2017/d/dd/T--Munich--Review2017_14.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/d/dd/T--Munich--Review2017_14.jpeg" width=900/>
 +
 
 +
<input type="radio" name="slide_switch" id="id1"/>
 +
<label for="id1">
 +
<img src="https://static.igem.org/mediawiki/2017/b/b8/T--Munich--Review2017_5.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/b/b8/T--Munich--Review2017_5.jpeg" width= 900/>
 +
 +
 +
<input type="radio" name="slide_switch" id="id4"/>
 +
<label for="id4">
 +
<img src="https://static.igem.org/mediawiki/2017/f/f0/T--Munich--Review2017_21.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/f/f0/T--Munich--Review2017_21.jpeg" width=900/>
 +
 +
<input type="radio" name="slide_switch" id="id5"/>
 +
<label for="id5">
 +
<img src="https://static.igem.org/mediawiki/2017/0/09/T--Munich--Review2017_4.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/0/09/T--Munich--Review2017_4.jpeg" width=900/>
 +
 
 +
<input type="radio" name="slide_switch" id="id6"/>
 +
<label for="id6">
 +
<img src="https://static.igem.org/mediawiki/2017/f/f9/T--Munich--Review2017_13.jpeg" width="100"/>
 +
</label>
 +
 
 +
<img src="https://static.igem.org/mediawiki/2017/f/f9/T--Munich--Review2017_13.jpeg" width=900/>
 +
<input type="radio" name="slide_switch" id="id7"/>
 +
<label for="id7">
 +
<img src="https://static.igem.org/mediawiki/2017/6/60/T--Munich--Review2017_17.jpeg" width="100"/>
 +
</label>
 +
<img src="https://static.igem.org/mediawiki/2017/6/60/T--Munich--Review2017_17.jpeg" width=900/>
  
  
<div class=" single_footer" style="float: right;">
 
<a  href="https://www.facebook.com/Munich.iGEM/" style="padding-left: 0.8cm;" title="facebook"><i class="fa fa-facebook-square fa-3x "></i></a>&#160;&#160;&#160;&#160;
 
<a href="https://www.instagram.com/igem.munich.2017/"  title="Instgram"><i class="fa fa-instagram fa-3x"></i> </a>&#160;&#160;&#160;&#160;
 
 
</div>
 
</div>
 +
</td>
 +
</tr>
  
<ul id="lightSlider">
+
<tr>
  <li>
+
<td colspan=6>
      <h3>First Slide</h3>
+
<h3> <a style="color: #51a7f9 !important" href="/Team:Munich/Gallery">See the rest of our gallery...</a></h3>
      <p>Lorem ipsum Cupidatat quis pariatur anim.</p>
+
</td>
  </li>
+
</tr>
  <li>
+
      <h3>Second Slide</h3>
+
      <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
+
  </li>
+
  ...
+
</ul>
+
  
 +
<tr><td class="no-padding" colspan=6 align=right valign=center height=10>
 +
<br><br><br><center><hr></center>
 +
</td></tr>
 +
</table>
 +
<!-- Content End -->
 
</html>
 
</html>
 +
{{Munich/Footer}}

Latest revision as of 20:49, 15 December 2017


Abstract

The ongoing crisis of increasing antibiotic resistance demands innovative preventive strategies. Recently, the RNA-targeting protein CRISPR-Cas13a has been used for highly sensitive DNA and RNA detection, promising diverse applications in point-of-care diagnostics. We integrated Cas13a in the detection unit of CascAID, our GMO-free diagnostic platform. CascAID combines an automated microfluidic device for rapid lysis and extraction of nucleic acids with a paper-based readout system. We demonstrated the performance of our device by targeting the 16S rRNA from E. coli. We improved the detection limit of our platform, using simulations to optimize our amplification scheme and the final readout.

Conceived as a distributable platform for rapid point-of-care diagnostics, CascAID can be used to distinguish between bacterial and viral infections, thus minimizing the widespread use of antibiotics. Furthermore, Cas13a allows the fast design of target sequences, making our system adaptive to the emergence of new viral outbreaks or fast mutating pathogens.

Awards & Achievements

First Runner-up

Best Diagnostics Project

Best Model

Best Applied Design

Best Hardware

Best Software

Nominated for Best Wiki

Nominated for Best Presentation

Nominated for Best Poster

Nominated for Best Integrated Human Practices

Nominated for Best Education & Public Engagement

Nominated for Best Measurement

Nominated for Best Composite Part

Nominated for Best Part Collection

Gallery

See the rest of our gallery...