Difference between revisions of "Team:Cologne-Duesseldorf/Test"

Line 2: Line 2:
 
{{Template:Cologne-Duesseldorf/header}}
 
{{Template:Cologne-Duesseldorf/header}}
 
<html>
 
<html>
−
<body>
+
<body>
−
 
+
<div id="overlay"></div>
−
 
+
<div id="container">
−
<div id="overlay"></div>
+
<div id="paper">
−
<div id="container">
+
<section id="header">
−
<div id="paper">
+
<img src="https://static.igem.org/mediawiki/2017/0/0d/T--Cologne-Duesseldorf--artico-logo-cities.svg">
−
<section id="header">
+
</section>
−
<img src="https://static.igem.org/mediawiki/2017/0/0d/T--Cologne-Duesseldorf--artico-logo-cities.svg">
+
<section id="article">
−
</section>
+
<h3>Designing a Customizable Synthetic Cell Compartment Toolbox</h3>
−
<section id="article">
+
<hr>
−
<h3>Designing a Customizable Synthetic Cell Compartment Toolbox</h3>
+
<p>
−
<hr>
+
Synthetic organisms provide a wide range of applications with the potential to tackle
−
<p>
+
the biggest challenges humanity faces. Their creation is therefore one of the major
−
Synthetic organisms provide a wide range of applications with the potential to tackle
+
goals in synthetic biology. Many breakthroughs have been achieved in the last
−
the biggest challenges humanity faces. Their creation is therefore one of the major
+
decade, however, the <strong>creation of a fully synthetic cell is yet a milestone to reach for.</strong>
−
goals in synthetic biology. Many breakthroughs have been achieved in the last
+
<br>
−
decade, however, the <strong>creation of a fully synthetic cell is yet a milestone to reach for.</strong>
+
A common approach tries to build up artificial cells from scratch, whereas we want to
−
<br>
+
start by engineering artificial compartments through orthogonalization. For designing
−
A common approach tries to build up artificial cells from scratch, whereas we want to
+
these new compartments we plan to establish an open source toolbox accessible to
−
start by engineering artificial compartments through orthogonalization. For designing
+
the community at large. This will make it possible to boot up a compartment perfectly
−
these new compartments we plan to establish an open source toolbox accessible to
+
tailored for a specific application, which will enable cheaper and more efficient
−
the community at large. This will make it possible to boot up a compartment perfectly
+
production of biofuels, pharmaceuticals, or high value chemicals.  
−
tailored for a specific application, which will enable cheaper and more efficient
+
<br>
−
production of biofuels, pharmaceuticals, or high value chemicals.  
+
By integrating enzymes or biosynthetic pathways into semi-permeable organelles we
−
<br>
+
gain higher concentrations of enzymes and metabolites and provide a basis for the
−
By integrating enzymes or biosynthetic pathways into semi-permeable organelles we
+
ideal operation of specialized enzymes. Furthermore, toxic or unstable intermediates
−
gain higher concentrations of enzymes and metabolites and provide a basis for the
+
can be sustained and naturally incompatible reactions can take place
−
ideal operation of specialized enzymes. Furthermore, toxic or unstable intermediates
+
simultaneously.
−
can be sustained and naturally incompatible reactions can take place
+
<br>
−
simultaneously.
+
We have chosen <span class="label">yeast peroxisomes</span> as our chassis for designing this synthetic organelle, which are very resistant, have a useful import mechanism and are expendable under optimal conditions.
−
<br>
+
</p>
−
We have chosen <span class="label">yeast peroxisomes</span> as our chassis for designing this synthetic organelle, which are very resistant, have a useful import mechanism and are expendable under optimal conditions.
+
</section>
−
</p>
+
<section id="accordion">
−
</section>
+
<h2>Accordion</h2>
−
<section id="accordion">
+
<hr>
−
<h2>Accordion</h2>
+
<button class="accordion">Section 1</button>
−
<hr>
+
<div class="panel">
−
<button class="accordion">Section 1</button>
+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
−
<div class="panel">
+
</div>
−
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<button class="accordion">Section 2</button>
−
</div>
+
<div class="panel">
−
 
+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
−
<button class="accordion">Section 2</button>
+
</div>
−
<div class="panel">
+
<button class="accordion">Section 3</button>
−
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<div class="panel">
−
</div>
+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
−
 
+
</div>
−
<button class="accordion">Section 3</button>
+
</section>
−
<div class="panel">
+
<div class="callout">
−
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<h3>Callout</h3>
−
</div>
+
<hr>
−
</section>
+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
−
+
−
<div class="callout">
+
−
<h3>Callout</h3>
+
−
<hr>
+
−
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
−
</div>
+
−
+
−
<div>
+
−
<h1>Tables</h1>
+
−
<hr>
+
−
<table class="hover">
+
−
<thead>
+
−
<tr>
+
−
<th>Table Header</th>
+
−
<th>Table Header</th>
+
−
<th>Table Header</th>
+
−
<th>Table Header</th>
+
−
</tr>
+
−
</thead>
+
−
<tbody>
+
−
<tr>
+
−
<td>Content Goes Here</td>
+
−
<td>This is longer content Donec id elit non mi porta gravida at eget metus.</td>
+
−
<td>Content Goes Here</td>
+
−
<td>Content Goes Here</td>
+
−
</tr>
+
−
<tr>
+
−
<td>Content Goes Here</td>
+
−
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
+
−
<td>Content Goes Here</td>
+
−
<td>Content Goes Here</td>
+
−
</tr>
+
−
<tr>
+
−
<td>Content Goes Here</td>
+
−
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
+
−
<td>Content Goes Here</td>
+
−
<td>Content Goes Here</td>
+
−
</tr>
+
−
</tbody>
+
−
</table>
+
−
</div>
+
−
+
−
<div>
+
−
<h1>Cards</h1>
+
−
<hr>
+
−
<div class="row">
+
−
<div class="card">
+
−
<div class="card-divider">
+
−
<h4>I'm featured</h4>
+
 
</div>
 
</div>
−
<div class="card-section">
+
<div>
−
<img src="http://placehold.it/350x150">
+
<h1>Tables</h1>
−
<p>It has an easy to override visual style, and is appropriately subdued.</p>
+
<hr>
 +
<table class="hover">
 +
<thead>
 +
<tr>
 +
<th>Table Header</th>
 +
<th>Table Header</th>
 +
<th>Table Header</th>
 +
<th>Table Header</th>
 +
</tr>
 +
</thead>
 +
<tbody>
 +
<tr>
 +
<td>Content Goes Here</td>
 +
<td>This is longer content Donec id elit non mi porta gravida at eget metus.</td>
 +
<td>Content Goes Here</td>
 +
<td>Content Goes Here</td>
 +
</tr>
 +
<tr>
 +
<td>Content Goes Here</td>
 +
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
 +
<td>Content Goes Here</td>
 +
<td>Content Goes Here</td>
 +
</tr>
 +
<tr>
 +
<td>Content Goes Here</td>
 +
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
 +
<td>Content Goes Here</td>
 +
<td>Content Goes Here</td>
 +
</tr>
 +
</tbody>
 +
</table>
 
</div>
 
</div>
−
</div>
+
<div>
−
<div class="card">
+
<h1>Cards</h1>
−
<div class="card-divider">
+
<hr>
−
<h4>I'm featured</h4>
+
<div class="row">
 +
<div class="card">
 +
<div class="card-divider">
 +
<h4>I'm featured</h4>
 +
</div>
 +
<div class="card-section">
 +
<img src="http://placehold.it/350x150">
 +
<p>It has an easy to override visual style, and is appropriately subdued.</p>
 +
</div>
 +
</div>
 +
<div class="card">
 +
<div class="card-divider">
 +
<h4>I'm featured</h4>
 +
</div>
 +
<div class="card-section">
 +
<img src="http://placehold.it/350x150">
 +
<p>It has an easy to override visual style, and is appropriately subdued.</p>
 +
</div>
 +
</div>
 +
<div class="card">
 +
<div class="card-divider">
 +
<h4>I'm featured</h4>
 +
</div>
 +
<div class="card-section">
 +
<img src="http://placehold.it/350x150">
 +
<p>It has an easy to override visual style, and is appropriately subdued.</p>
 +
</div>
 +
</div>
 +
<div class="card">
 +
<div class="card-divider">
 +
<h4>I'm featured</h4>
 +
</div>
 +
<div class="card-section">
 +
<img src="http://placehold.it/350x150">
 +
<p>It has an easy to override visual style, and is appropriately subdued.</p>
 +
</div>
 +
</div>
 +
</div>
 
</div>
 
</div>
−
<div class="card-section">
+
<!-- Large Menu -->
−
<img src="http://placehold.it/350x150">
+
<h1>Large Menu</h1>
−
<p>It has an easy to override visual style, and is appropriately subdued.</p>
+
<hr>
 +
<div class="row" id="mega-menu">
 +
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Description"><i class="fa fa-cog" aria-hidden="true"></i></a>
 +
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Team"><i class="fa fa-users" aria-hidden="true"></i></a>
 +
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/HP/Gold_Integrated"><i class="fa fa-user-plus" aria-hidden="true"></i></a>
 +
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Part_Collection"><i class="fa fa-cogs" aria-hidden="true"></i></a>
 
</div>
 
</div>
−
</div>
+
<!--Tabs -->
−
<div class="card">
+
<!-- End Article-->
−
<div class="card-divider">
+
</div>
−
<h4>I'm featured</h4>
+
<!-- End Container -->
−
</div>
+
−
<div class="card-section">
+
−
<img src="http://placehold.it/350x150">
+
−
<p>It has an easy to override visual style, and is appropriately subdued.</p>
+
−
</div>
+
−
</div>
+
−
<div class="card">
+
−
<div class="card-divider">
+
−
<h4>I'm featured</h4>
+
−
</div>
+
−
<div class="card-section">
+
−
<img src="http://placehold.it/350x150">
+
−
<p>It has an easy to override visual style, and is appropriately subdued.</p>
+
−
</div>
+
−
</div>
+
−
</div>
+
−
</div>
+
−
+
−
<!-- Large Menu -->
+
−
<h1>Large Menu</h1>
+
−
<hr>
+
−
<div class="row" id="mega-menu">
+
−
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Description"><i class="fa fa-cog" aria-hidden="true"></i></a>
+
−
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Team"><i class="fa fa-users" aria-hidden="true"></i></a>
+
−
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/HP/Gold_Integrated"><i class="fa fa-user-plus" aria-hidden="true"></i></a>
+
−
<a href="https://2017.igem.org/Team:Cologne-Duesseldorf/Part_Collection"><i class="fa fa-cogs" aria-hidden="true"></i></a>
+
−
</div>
+
−
+
−
+
−
<!--Tabs -->
+
−
 
+
−
+
−
+
−
+
−
<!-- End Article-->
+
−
</div>
+
−
<!-- End Container -->
+
 
</div>
 
</div>
−
<!-- Footer -->
+
</body>
−
+
−
<section id="footer">
+
−
<a href="https://twitter.com/igem17dus_cgn"><i class="fa fa-twitter" aria-hidden="true"></i></a>
+
−
<a href="https://www.facebook.com/igemduscgn/"><i class="fa fa-facebook" aria-hidden="true"></i></a>
+
−
<a href="https://www.instagram.com/igem2017dus_cgn/"><i class="fa fa-instagram" aria-hidden="true"></i></a>
+
−
<a href="mailto:iGEM_DUS_CGN@hhu.de"><i class="fa fa-envelope" aria-hidden="true"></i></a>
+
−
<a href="http://www.igem.hhu.de/"><i class="fa fa-university" aria-hidden="true"></i><a>
+
−
</section>
+
−
</body>
+
 
</html>
 
</html>
 +
{{Template:Cologne-Duesseldorf/footer}}
 
{{Template:Cologne-Duesseldorf/js}}
 
{{Template:Cologne-Duesseldorf/js}}

Revision as of 15:54, 6 May 2017

Designing a Customizable Synthetic Cell Compartment Toolbox

Synthetic organisms provide a wide range of applications with the potential to tackle the biggest challenges humanity faces. Their creation is therefore one of the major goals in synthetic biology. Many breakthroughs have been achieved in the last decade, however, the creation of a fully synthetic cell is yet a milestone to reach for.
A common approach tries to build up artificial cells from scratch, whereas we want to start by engineering artificial compartments through orthogonalization. For designing these new compartments we plan to establish an open source toolbox accessible to the community at large. This will make it possible to boot up a compartment perfectly tailored for a specific application, which will enable cheaper and more efficient production of biofuels, pharmaceuticals, or high value chemicals.
By integrating enzymes or biosynthetic pathways into semi-permeable organelles we gain higher concentrations of enzymes and metabolites and provide a basis for the ideal operation of specialized enzymes. Furthermore, toxic or unstable intermediates can be sustained and naturally incompatible reactions can take place simultaneously.
We have chosen yeast peroxisomes as our chassis for designing this synthetic organelle, which are very resistant, have a useful import mechanism and are expendable under optimal conditions.

Accordion

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Callout

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Tables

Table Header Table Header Table Header Table Header
Content Goes Here This is longer content Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here
Content Goes Here This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here
Content Goes Here This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here

Cards

I'm featured

It has an easy to override visual style, and is appropriately subdued.

I'm featured

It has an easy to override visual style, and is appropriately subdued.

I'm featured

It has an easy to override visual style, and is appropriately subdued.

I'm featured

It has an easy to override visual style, and is appropriately subdued.

Large Menu