Difference between revisions of "Team:Potsdam/Team"

 
(52 intermediate revisions by 5 users not shown)
Line 1: Line 1:
{{Template:Team:Potsdam/CSS}}
+
{{Template:Team:Potsdam/Header}}
{{Template:Team:Potsdam/AssetsCSSMain}}
+
<html>
{{Template:Team:Potsdam/AssetsCSSNoScript}}
+
  
  
 +
    <!-- Main -->
 +
    <div class="wrapper style2">
 +
        <div class="title">
 +
            Our team
 +
        </div>
 +
        <div id="main" class="container">
 +
            <div id="content">
 +
                <!-- Content -->
  
  
<!--
+
<div class="slideshow-container">
Dimension by HTML5 UP
+
html5up.net | @ajlkn
+
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+
-->
+
<html>
+
<head>
+
<title>Dimension by HTML5 UP</title>
+
<meta charset="utf-8" />
+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
+
<link rel="stylesheet" href="assets/css/main.css" />
+
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
+
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
+
</head>
+
<body>
+
  
<!-- Wrapper -->
+
<div class="mySlides fade">
<div id="wrapper">
+
  <div class="numbertext">1 / 4</div>
 +
  <img src="https://static.igem.org/mediawiki/2017/6/66/T--Potsdam--Team--mpi1.jpg" style="width:100%">
 +
  <div class="text"><span style="background-color: #D1D1D1;">&nbsp;&nbsp;Greetings from Potsdam!&nbsp;&nbsp;</span></div>
 +
</div>
  
<!-- Header -->
 
<header id="header">
 
<div class="logo">
 
<span class="icon fa-diamond"></span>
 
</div>
 
<div class="content">
 
<div class="inner">
 
<h1>Dimension</h1>
 
<p><!--[-->A fully responsive site template designed by <a href="https://html5up.net">HTML5 UP</a> and released<!--]--><br />
 
<!--[-->for free under the <a href="https://html5up.net/license">Creative Commons</a> license.<!--]--></p>
 
</div>
 
</div>
 
<nav>
 
<ul>
 
<li><a href="#intro">Intro</a></li>
 
<li><a href="#work">Work</a></li>
 
<li><a href="#about">About</a></li>
 
<li><a href="#contact">Contact</a></li>
 
<!--<li><a href="#elements">Elements</a></li>-->
 
</ul>
 
</nav>
 
</header>
 
  
<!-- Main -->
 
<div id="main">
 
  
<!-- Intro -->
+
<div class="mySlides fade">
<article id="intro">
+
  <div class="numbertext">2 / 4</div>
<h2 class="major">Intro</h2>
+
  <img src="https://static.igem.org/mediawiki/2017/2/21/T--Potsdam--crowdfunding.jpg" style="width:100%">
<span class="image main"><img src="images/pic01.jpg" alt="" /></span>
+
  <div class="text"><span style="background-color: #D1D1D1;">&nbsp;&nbsp;Greetings from Potsdam!&nbsp;&nbsp;</span></div>
<p>Aenean ornare velit lacus, ac varius enim ullamcorper eu. Proin aliquam facilisis ante interdum congue. Integer mollis, nisl amet convallis, porttitor magna ullamcorper, amet egestas mauris. Ut magna finibus nisi nec lacinia. Nam maximus erat id euismod egestas. By the way, check out my <a href="#work">awesome work</a>.</p>
+
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis dapibus rutrum facilisis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam tristique libero eu nibh porttitor fermentum. Nullam venenatis erat id vehicula viverra. Nunc ultrices eros ut ultricies condimentum. Mauris risus lacus, blandit sit amet venenatis non, bibendum vitae dolor. Nunc lorem mauris, fringilla in aliquam at, euismod in lectus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In non lorem sit amet elit placerat maximus. Pellentesque aliquam maximus risus, vel sed vehicula.</p>
+
</article>
+
  
<!-- Work -->
+
<div class="mySlides fade">
<article id="work">
+
  <div class="numbertext">3 / 4</div>
<h2 class="major">Work</h2>
+
  <img src="https://static.igem.org/mediawiki/2017/5/58/T--potsdam--teambild.jpeg" style="width:100%">
<span class="image main"><img src="images/pic02.jpg" alt="" /></span>
+
  <div class="text"><span style="background-color: #D1D1D1;">&nbsp;&nbsp;Greetings from Potsdam!&nbsp;&nbsp;</span></div>
<p>Adipiscing magna sed dolor elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac. Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin mauris nec lorem luctus ultrices.</p>
+
</div>
<p>Nullam et orci eu lorem consequat tincidunt vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus pharetra. Pellentesque condimentum sem. In efficitur ligula tate urna. Maecenas laoreet massa vel lacinia pellentesque lorem ipsum dolor. Nullam et orci eu lorem consequat tincidunt. Vivamus et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus amet feugiat tempus.</p>
+
</article>
+
  
<!-- About -->
+
<div class="mySlides fade">
<article id="about">
+
  <div class="numbertext">4 / 4</div>
<h2 class="major">About</h2>
+
  <img src="https://static.igem.org/mediawiki/2017/9/90/T--Potsdam--team--bild4.jpg" style="width:100%">
<span class="image main"><img src="images/pic03.jpg" alt="" /></span>
+
  <div class="text"><span style="background-color: #D1D1D1;">&nbsp;&nbsp;Greetings from Potsdam!&nbsp;&nbsp;</span></div>
<p>Lorem ipsum dolor sit amet, consectetur et adipiscing elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac. Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin mauris nec lorem luctus ultrices. Aliquam libero et malesuada fames ac ante ipsum primis in faucibus. Cras viverra ligula sit amet ex mollis mattis lorem ipsum dolor sit amet.</p>
+
</div>
</article>
+
  
<!-- Contact -->
 
<article id="contact">
 
<h2 class="major">Contact</h2>
 
<form method="post" action="#">
 
<div class="field half first">
 
<label for="name">Name</label>
 
<input type="text" name="name" id="name" />
 
</div>
 
<div class="field half">
 
<label for="email">Email</label>
 
<input type="text" name="email" id="email" />
 
</div>
 
<div class="field">
 
<label for="message">Message</label>
 
<textarea name="message" id="message" rows="4"></textarea>
 
</div>
 
<ul class="actions">
 
<li><input type="submit" value="Send Message" class="special" /></li>
 
<li><input type="reset" value="Reset" /></li>
 
</ul>
 
</form>
 
<ul class="icons">
 
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
 
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
 
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
 
<li><a href="#" class="icon fa-github"><span class="label">GitHub</span></a></li>
 
</ul>
 
</article>
 
  
<!-- Elements -->
 
<article id="elements">
 
<h2 class="major">Elements</h2>
 
  
<section>
+
</div>
<h3 class="major">Text</h3>
+
<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
+
This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
+
This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>. Finally, <a href="#">this is a link</a>.</p>
+
<hr />
+
<h2>Heading Level 2</h2>
+
<h3>Heading Level 3</h3>
+
<h4>Heading Level 4</h4>
+
<h5>Heading Level 5</h5>
+
<h6>Heading Level 6</h6>
+
<hr />
+
<h4>Blockquote</h4>
+
<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus lorem ipsum dolor sit amet nullam adipiscing eu felis.</blockquote>
+
<h4>Preformatted</h4>
+
<pre><code>i = 0;
+
  
while (!deck.isInOrder()) {
+
<br>
    print 'Iteration ' + i;
+
    deck.shuffle();
+
    i++;
+
}
+
  
print 'It took ' + i + ' iterations to sort the deck.';</code></pre>
+
<div style="text-align:center">
</section>
+
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>  
 +
</div>
  
<section>
+
<script>
<h3 class="major">Lists</h3>
+
var slideIndex = 0;
 +
showSlides();
  
<h4>Unordered</h4>
+
function showSlides() {
<ul>
+
    var i;
<li>Dolor pulvinar etiam.</li>
+
    var slides = document.getElementsByClassName("mySlides");
<li>Sagittis adipiscing.</li>
+
    var dots = document.getElementsByClassName("dot");
<li>Felis enim feugiat.</li>
+
    for (i = 0; i < slides.length; i++) {
</ul>
+
      slides[i].style.display = "none"; 
 +
    }
 +
    slideIndex++;
 +
    if (slideIndex > slides.length) {slideIndex = 1}   
 +
    for (i = 0; i < dots.length; i++) {
 +
        dots[i].className = dots[i].className.replace(" active", "");
 +
    }
 +
    slides[slideIndex-1].style.display = "block"; 
 +
    dots[slideIndex-1].className += " active";
 +
    setTimeout(showSlides, 6000); // Change image every 6 seconds
 +
}
 +
</script>
  
<h4>Alternate</h4>
 
<ul class="alt">
 
<li>Dolor pulvinar etiam.</li>
 
<li>Sagittis adipiscing.</li>
 
<li>Felis enim feugiat.</li>
 
</ul>
 
  
<h4>Ordered</h4>
+
            </div>
<ol>
+
        </div>
<li>Dolor pulvinar etiam.</li>
+
    </div>
<li>Etiam vel felis viverra.</li>
+
<li>Felis enim feugiat.</li>
+
<li>Dolor pulvinar etiam.</li>
+
<li>Etiam vel felis lorem.</li>
+
<li>Felis enim et feugiat.</li>
+
</ol>
+
<h4>Icons</h4>
+
<ul class="icons">
+
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
+
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
+
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
+
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
+
</ul>
+
  
<h4>Actions</h4>
 
<ul class="actions">
 
<li><a href="#" class="button special">Default</a></li>
 
<li><a href="#" class="button">Default</a></li>
 
</ul>
 
<ul class="actions vertical">
 
<li><a href="#" class="button special">Default</a></li>
 
<li><a href="#" class="button">Default</a></li>
 
</ul>
 
</section>
 
  
<section>
+
    <div class="wrapper style3">
<h3 class="major">Table</h3>
+
        <div class="title">
<h4>Default</h4>
+
            Who we are:
<div class="table-wrapper">
+
        </div>
<table>
+
        <div id="main" class="container">
<thead>
+
            <div id="content">
<tr>
+
<p align="justify">
<th>Name</th>
+
We are 12 student team members supervised by Prof. Dr. Bernd Müller-Röber (AG Molecular Biology, University of Potsdam) and Prof. Dr. Salim Seyfried (AG Zoophysiology, University of Potsdam), together with the five instructors Dr. Joachim Forner, Dr. Paulina Fuentes, Lena Hochrein, Dr. Roland Knorr, Dr. Joachim Kopka and Dr. Fabian Machens.
<th>Description</th>
+
<br> <br>
<th>Price</th>
+
<img src="https://static.igem.org/mediawiki/2017/8/85/T--Potsdam--home--enzyme.png" width="30%" style="float:right">
</tr>
+
</thead>
+
<tbody>
+
<tr>
+
<td>Item One</td>
+
<td>Ante turpis integer aliquet porttitor.</td>
+
<td>29.99</td>
+
</tr>
+
<tr>
+
<td>Item Two</td>
+
<td>Vis ac commodo adipiscing arcu aliquet.</td>
+
<td>19.99</td>
+
</tr>
+
<tr>
+
<td>Item Three</td>
+
<td> Morbi faucibus arcu accumsan lorem.</td>
+
<td>29.99</td>
+
</tr>
+
<tr>
+
<td>Item Four</td>
+
<td>Vitae integer tempus condimentum.</td>
+
<td>19.99</td>
+
</tr>
+
<tr>
+
<td>Item Five</td>
+
<td>Ante turpis integer aliquet porttitor.</td>
+
<td>29.99</td>
+
</tr>
+
</tbody>
+
<tfoot>
+
<tr>
+
<td colspan="2"></td>
+
<td>100.00</td>
+
</tr>
+
</tfoot>
+
</table>
+
</div>
+
  
<h4>Alternate</h4>
+
Also we could count on the active assistance and knowledge from Max (who directed and edited our crowfunding video), Niek (who got not tired to explain us everything we wanted to now about designing websites and helped us a lot to create this Wiki) and Sina (who brought our enzymes to life with her drawing skills)- thanks a lot. <br> <br>
<div class="table-wrapper">
+
<table class="alt">
+
<thead>
+
<tr>
+
<th>Name</th>
+
<th>Description</th>
+
<th>Price</th>
+
</tr>
+
</thead>
+
<tbody>
+
<tr>
+
<td>Item One</td>
+
<td>Ante turpis integer aliquet porttitor.</td>
+
<td>29.99</td>
+
</tr>
+
<tr>
+
<td>Item Two</td>
+
<td>Vis ac commodo adipiscing arcu aliquet.</td>
+
<td>19.99</td>
+
</tr>
+
<tr>
+
<td>Item Three</td>
+
<td> Morbi faucibus arcu accumsan lorem.</td>
+
<td>29.99</td>
+
</tr>
+
<tr>
+
<td>Item Four</td>
+
<td>Vitae integer tempus condimentum.</td>
+
<td>19.99</td>
+
</tr>
+
<tr>
+
<td>Item Five</td>
+
<td>Ante turpis integer aliquet porttitor.</td>
+
<td>29.99</td>
+
</tr>
+
</tbody>
+
<tfoot>
+
<tr>
+
<td colspan="2"></td>
+
<td>100.00</td>
+
</tr>
+
</tfoot>
+
</table>
+
</div>
+
</section>
+
  
<section>
+
Do you want to get more information of each team member? Want to know, what we would like to have invented? Just folllow the link: <a href="https://2017.igem.org/wiki/index.php?title=2017.igem.org%2FWeIntroduceOurselves">We introduce ourselves</a> and check us out! :)
<h3 class="major">Buttons</h3>
+
</p>
<ul class="actions">
+
<li><a href="#" class="button special">Special</a></li>
+
<li><a href="#" class="button">Default</a></li>
+
</ul>
+
<ul class="actions">
+
<li><a href="#" class="button">Default</a></li>
+
<li><a href="#" class="button small">Small</a></li>
+
</ul>
+
<ul class="actions">
+
<li><a href="#" class="button special icon fa-download">Icon</a></li>
+
<li><a href="#" class="button icon fa-download">Icon</a></li>
+
</ul>
+
<ul class="actions">
+
<li><span class="button special disabled">Disabled</span></li>
+
<li><span class="button disabled">Disabled</span></li>
+
</ul>
+
</section>
+
  
<section>
 
<h3 class="major">Form</h3>
 
<form method="post" action="#">
 
<div class="field half first">
 
<label for="demo-name">Name</label>
 
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Jane Doe" />
 
</div>
 
<div class="field half">
 
<label for="demo-email">Email</label>
 
<input type="email" name="demo-email" id="demo-email" value="" placeholder="jane@untitled.tld" />
 
</div>
 
<div class="field">
 
<label for="demo-category">Category</label>
 
<div class="select-wrapper">
 
<select name="demo-category" id="demo-category">
 
<option value="">-</option>
 
<option value="1">Manufacturing</option>
 
<option value="1">Shipping</option>
 
<option value="1">Administration</option>
 
<option value="1">Human Resources</option>
 
</select>
 
</div>
 
</div>
 
<div class="field half first">
 
<input type="radio" id="demo-priority-low" name="demo-priority" checked>
 
<label for="demo-priority-low">Low</label>
 
</div>
 
<div class="field half">
 
<input type="radio" id="demo-priority-high" name="demo-priority">
 
<label for="demo-priority-high">High</label>
 
</div>
 
<div class="field half first">
 
<input type="checkbox" id="demo-copy" name="demo-copy">
 
<label for="demo-copy">Email me a copy</label>
 
</div>
 
<div class="field half">
 
<input type="checkbox" id="demo-human" name="demo-human" checked>
 
<label for="demo-human">Not a robot</label>
 
</div>
 
<div class="field">
 
<label for="demo-message">Message</label>
 
<textarea name="demo-message" id="demo-message" placeholder="Enter your message" rows="6"></textarea>
 
</div>
 
<ul class="actions">
 
<li><input type="submit" value="Send Message" class="special" /></li>
 
<li><input type="reset" value="Reset" /></li>
 
</ul>
 
</form>
 
</section>
 
  
</article>
+
            </div>
 +
        </div>
 +
    </div>
 +
 
 +
<div id="footer-wrapper" class="wrapper">
 +
        <div class="title">
 +
            Did you see this?
 +
        </div>
 +
        <div class="boxWrapper">
 +
            <div class="leftBox">
 +
                <div class="topBox">
 +
                    <a href="https://2017.igem.org/Http://2017.igem.org/2017.igem.org/Team:Potsdam/Abstract">
 +
                        <img src="https://static.igem.org/mediawiki/2017/archive/0/01/20171003140936%21T--Potsdam--Abstract--MC-Drawing.jpeg" alt="" />
 +
                        <p><font color="black">Abstract</font></p>
 +
                    </a>
 +
                </div>
 +
                <div class="bottomBox">
 +
                    <a  href="https://2017.igem.org/wiki/index.php?title=Team%3APotsdam%2FResults"">
 +
                        <img src="https://static.igem.org/mediawiki/2017/5/50/T--Potsdam--resuslts--main.png" alt="" />
 +
                        <p><font color="black">What we've achieved</font> </p>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
            <div class="centerBox">
 +
                <div class="topBox">
 +
                    <a href="https://2017.igem.org/Team:Potsdam/iGem-goes-green">
 +
                        <img src="https://static.igem.org/mediawiki/2017/1/12/T--Potsdam--goesgreen.png" alt="" />
 +
                        <p><font color="black">iGEM Goes Green</font></p>
 +
                    </a>
 +
                </div>
 +
                <div class="bottomBox">
 +
                    <a href="https://2017.igem.org/Team:Potsdam/Homepage">
 +
                        <img src="https://static.igem.org/mediawiki/2017/9/9f/T--Potsdam--home--logo.png" alt="" />
 +
                        <p> <font color="black"> Home</font> </p>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
            <div class="rightBox">
 +
                <div class="topBox">
 +
                    <a href="https://2017.igem.org/wiki/index.php?title=Team%3APotsdam%2FBackground">
 +
                        <img src="https://static.igem.org/mediawiki/2017/a/a6/T--Potsdam--infografik.png" alt="" />
 +
                        <p><font color="black">Background information</font></p>
 +
                    </a>
 +
                </div>
 +
                <div class="bottomBox">
 +
                    <a href="https://2017.igem.org/wiki/index.php?title=Team%3APotsdam%2Fcrowdfunding">
 +
                        <img src="https://static.igem.org/mediawiki/2017/a/a5/T--Potsdam--main--startnext.png" alt="" />
 +
                        <p><font color="black">Crowdfunding</font></p>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </div>
 +
</div>
  
</div>
 
  
<!-- Footer -->
 
<footer id="footer">
 
<p class="copyright">&copy; Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</p>
 
</footer>
 
  
</div>
 
  
<!-- BG -->
 
<div id="bg"></div>
 
  
<!-- Scripts -->
+
<div id="sponsor-wrapper" class="wrapper">
<script src="assets/js/jquery.min.js"></script>
+
<p> <font color="black"> Main sponsors: </font> </p>
<script src="assets/js/skel.min.js"></script>
+
    <img src="https://static.igem.org/mediawiki/2017/f/fd/T--Potsdam--sponors--up_unten.png" width="24%">
<script src="assets/js/util.js"></script>
+
    <img src="https://static.igem.org/mediawiki/2017/8/8d/T--potsdam--sponsors--maxsynbio_unten.png" width="24%">
<script src="assets/js/main.js"></script>
+
    <img src="https://static.igem.org/mediawiki/2017/8/8f/T--Potsdam--sponsors--promega_unten.png" width="24%">
 +
    <img src="https://static.igem.org/mediawiki/2017/b/b2/T--Potsdam--sponsors--eppendorf.png" width="24%">
 +
</div>
  
</body>
+
</div>
 +
</body>
 
</html>
 
</html>
 +
{{Template:Team:Potsdam/LessCSSExtension}}

Latest revision as of 20:03, 1 November 2017

No Sidebar - Escape Velocity by HTML5 UP

Our team
1 / 4
  Greetings from Potsdam!  
2 / 4
  Greetings from Potsdam!  
3 / 4
  Greetings from Potsdam!  
4 / 4
  Greetings from Potsdam!  

Who we are:

We are 12 student team members supervised by Prof. Dr. Bernd Müller-Röber (AG Molecular Biology, University of Potsdam) and Prof. Dr. Salim Seyfried (AG Zoophysiology, University of Potsdam), together with the five instructors Dr. Joachim Forner, Dr. Paulina Fuentes, Lena Hochrein, Dr. Roland Knorr, Dr. Joachim Kopka and Dr. Fabian Machens.

Also we could count on the active assistance and knowledge from Max (who directed and edited our crowfunding video), Niek (who got not tired to explain us everything we wanted to now about designing websites and helped us a lot to create this Wiki) and Sina (who brought our enzymes to life with her drawing skills)- thanks a lot.

Do you want to get more information of each team member? Want to know, what we would like to have invented? Just folllow the link: We introduce ourselves and check us out! :)