(47 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
− | {{ | + | {{TU_Dresden/Header}} |
− | + | ||
<html> | <html> | ||
− | + | <!-- THIS PUTS THE TITLE PICTURE AND SLOGAN ON THE PAGE --> | |
− | + | ||
− | + | <div id="pagebanner" style="background-image: url(https://static.igem.org/mediawiki/2017/0/02/T--TU_Dresden--earth.png);"> | |
− | + | <div id="bannerspace"> | |
− | + | <div id="bannerquote">Entering A Whole New Universe Of Applications!</div> | |
+ | </div> | ||
+ | <main> | ||
+ | |||
+ | <!-- HERE YOUR CONTENT STARTS --> | ||
+ | |||
+ | <!-- EACH PAGE SECTION GETS SURROUNDED BY <div class="contentbox"> .... </div> AND GETS ITS SECTION TITLE AS A H1 TITLE ENCLOSED IN <h1 class="box-heading"> ... </h1> --> | ||
+ | |||
+ | <div class="contentbox"> | ||
+ | |||
+ | <h1 class="box-heading">Section title</h1> | ||
+ | |||
+ | <!-- YOU CAN HAVE CAPTION FOR SUBSECTIONS USING <h2> ... </h2> OR EVEN <h3> ... </h3> --> | ||
+ | |||
+ | <h2>Subsection title</h2> | ||
+ | |||
+ | <h3> This is an even smaller heading </h3> | ||
+ | |||
+ | <!-- YOUR TEXT SHOULD BE STRUCTURED IN PARAGRAPHS WHICH NEED <p> ... </p> AROUND THEM --> | ||
+ | |||
+ | <p>This is example text. I copied the abstract here to fill some space: Synthetic biology wants to go beyond the pure biological by integrating concepts from chemistry or physics into the living world. At this interphase, our project wants to introduce Peptidosomes as a new fundamental approach for generating and applying encapsulated bacteria. </p> | ||
+ | <p>These spheres possess advantageous properties like stability in different media and a mesh-like structure that allows for the selective exchange of compounds via diffusion. Therefore, we are able to benefit from the entrapped cells' abilities, while ensuring that they are not released into their surroundings.</p> | ||
+ | <p>Using the powerful genetics of <i>Bacillus subtilis</i> and its secretory capabilities we demonstrate communication and cooperation between separately encapsulated bacterial populations as well as the environment. Peptidosomes can be further enhanced by incorporating magnetic or biological beads - which can be functionalized with proteins - into their peptide-based shell.</p> | ||
+ | <p>With this unique setup, we provide a whole new universe of applications to the iGEM community.</p> | ||
+ | |||
+ | <!-- BULLET POINT LISTS --> | ||
+ | <ul> | ||
+ | <li> First Item </li> | ||
+ | <li> Secont Item </li> | ||
+ | <li> Third Item </li> | ||
+ | </ul> | ||
+ | |||
+ | <ul class="leaf"> | ||
+ | <li> First Item </li> | ||
+ | <li> Secont Item </li> | ||
+ | <li> Third Item </li> | ||
+ | </ul> | ||
+ | |||
+ | |||
+ | <!-- INCLUDING PDFs --> | ||
+ | <a class="pdf-resources" href="https://static.igem.org/mediawiki/2017/9/9b/T--TU_Dresden--M_Primerlist_Signalpeptides.pdf">Primerlist</a> | ||
+ | <a class="pdf-resources" href="https://static.igem.org/mediawiki/2017/9/9b/T--TU_Dresden--M_Primerlist_Signalpeptides.pdf">Primerlist</a> | ||
+ | |||
+ | |||
+ | <a class="read-more" href="#"></a> | ||
+ | </div> | ||
+ | |||
+ | <!-- HERE STARTS ANOTHER SECTION --> | ||
+ | |||
+ | <div class="contentbox"> | ||
+ | |||
+ | <h1 class="box-heading">EncaBcillus - It's a trap! </h1> | ||
+ | |||
+ | <!-- ADD A PICTURE WITH A CAPTION LIKE THIS: --> | ||
+ | |||
+ | <figure> | ||
+ | |||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="zoom"> | ||
+ | <figcaption><b>Figure 1: Example.</b> This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture End of the figures caption is here.</figcaption> | ||
+ | |||
+ | </figure> | ||
+ | |||
+ | |||
+ | <!-- PLACE AN IMAGE NEXT TO A PARAGRAPH LIKE THIS (YOU CAN CHOOSE HOW WIDE THE SPACE FOR THE PICTURE SHOULD BE AND WHETHER THE PICTURE GOES LEFT OR RIGHT, MAKE SURE TO INCLUDE THE "class="makeresponsive" SO THAT TEXT AND PICTURE WILL MOVE BELOW EACH OTHER ON VERY SMALL SCREENS): --> | ||
+ | |||
+ | <figure> | ||
+ | <figure class="makeresponsive floatright" style="width: 50%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="zoom"> | ||
+ | <figcaption><b>Figure 1: Example.</b> This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture End of the figures caption is here.</figcaption> | ||
+ | </figure> | ||
+ | |||
+ | Synthetic biology wants to go beyond the pure biological by integrating concepts from chemistry or physics into the living world. At this interphase, our project wants to introduce Peptidosomes as a new fundamental approach for generating and applying encapsulated bacteria. | ||
+ | These spheres possess advantageous properties like stability in different media and a mesh-like structure that allows for the selective exchange of compounds via diffusion. Therefore, we are able to benefit from the entrapped cells' abilities, while ensuring that they are not released into their surroundings. | ||
+ | Using the powerful genetics of <i>Bacillus subtilis</i> and its secretory capabilities we demonstrate communication and cooperation between separately encapsulated bacterial populations as well as the environment. Peptidosomes can be further enhanced by incorporating magnetic or biological beads - which can be functionalized with proteins - into their peptide-based shell. | ||
+ | With this unique setup, we provide a whole new universe of applications to the iGEM community. | ||
+ | </figure> | ||
+ | |||
+ | <figure> | ||
+ | <figure class="makeresponsive floatleft" style="width: 50%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="zoom"> | ||
+ | <figcaption><b>Figure 1: Example.</b> This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture This is an example picture End of the figures caption is here.</figcaption> | ||
+ | </figure> | ||
+ | Synthetic biology wants to go beyond the pure biological by integrating concepts from chemistry or physics into the living world. At this interphase, our project wants to introduce Peptidosomes as a new fundamental approach for generating and applying encapsulated bacteria. | ||
+ | These spheres possess advantageous properties like stability in different media and a mesh-like structure that allows for the selective exchange of compounds via diffusion. Therefore, we are able to benefit from the entrapped cells' abilities, while ensuring that they are not released into their surroundings. | ||
+ | Using the powerful genetics of <i>Bacillus subtilis</i> and its secretory capabilities we demonstrate communication and cooperation between separately encapsulated bacterial populations as well as the environment. Peptidosomes can be further enhanced by incorporating magnetic or biological beads - which can be functionalized with proteins - into their peptide-based shell. | ||
+ | With this unique setup, we provide a whole new universe of applications to the iGEM community. | ||
+ | </figure> | ||
+ | |||
+ | <!-- STYLING TEXT --> | ||
+ | <p>You can make text <b>bold</b>, tief<sub>gestellt</sub>, <i>italic</i> and so on. Ask google or me for the right tags if you want to do something more fancy. :)</p> | ||
+ | |||
+ | <!-- INCLUDE SEVERAL PICTURES NEXT TO EACH OTHER LIKE THIS --> | ||
+ | |||
+ | <figure> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | style="width: 32%;" | ||
+ | class="makeresponsive"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | style="width: 32%;" | ||
+ | class="makeresponsive"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | style="width: 32%;" | ||
+ | class="makeresponsive"> | ||
+ | <figcaption>This is an example picture</figcaption> | ||
+ | </figure> | ||
+ | |||
+ | <figure> | ||
+ | <figure style="width: 32%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="makeresponsive zoom"> | ||
+ | <figcaption>This is example picture 1</figcaption> | ||
+ | </figure> | ||
+ | <figure style="width: 32%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="makeresponsive"> | ||
+ | <figcaption>This is example picture 2</figcaption> | ||
+ | </figure> | ||
+ | <figure style="width: 32%;"> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="makeresponsive zoom"> | ||
+ | <figcaption>This is example picture 3</figcaption> | ||
+ | </figure> | ||
+ | <figcaption> Caption for all three figures </figcaption> | ||
+ | </figure> | ||
+ | </div> | ||
+ | |||
+ | <!-- PICTURES CAN ALSO BE OUTSIDE A SECTION DIV, IF YOU NEED A CAPTION FOR ONE OF THESE, TELL ME PLEASE! --> | ||
+ | |||
+ | <figure> | ||
+ | <img src="https://static.igem.org/mediawiki/2017/f/f4/TU_Dresden_Meetup_10.jpg" | ||
+ | alt="An example picture to show how to include them." | ||
+ | class="zoom"> | ||
+ | </figure> | ||
+ | |||
+ | <!-- ANOTHER DIV FOR GOOD MEASURE --> | ||
+ | |||
+ | <div class="contentbox"> | ||
+ | |||
+ | <h1 class="box-heading">EncaBcillus - It's a trap! </h1> | ||
+ | |||
+ | |||
+ | <p>Synthetic biology wants to go beyond the pure biological by integrating concepts from chemistry or physics into the living world. At this interphase, our project wants to introduce Peptidosomes as a new fundamental approach for generating and applying encapsulated bacteria. | ||
+ | These spheres possess advantageous properties like stability in different media and a mesh-like structure that allows for the selective exchange of compounds via diffusion. Therefore, we are able to benefit from the entrapped cells' abilities, while ensuring that they are not released into their surroundings. | ||
+ | Using the powerful genetics of <i>Bacillus subtilis</i> and its secretory capabilities we demonstrate communication and cooperation between separately encapsulated bacterial populations as well as the environment. Peptidosomes can be further enhanced by incorporating magnetic or biological beads - which can be functionalized with proteins - into their peptide-based shell. | ||
+ | With this unique setup, we provide a whole new universe of applications to the iGEM community.</p> | ||
+ | </div> | ||
+ | <div id="pagebanner" style="background-image: url("https://static.igem.org/mediawiki/2017/0/04/Tu-dresden-teamphotoforaboutus.jpeg");padding-top: 0;"> | ||
+ | <div id="bannerspace" style="margin-bottom: 210px;"> | ||
+ | <svg viewBox="0 0 2200 1000" width="100%" onload="init(evt)"> | ||
+ | <script type="text/ecmascript"> | ||
+ | <![CDATA[ | ||
− | + | function init(evt) | |
− | + | { | |
− | + | if ( window.svgDocument == null ) | |
− | + | { | |
− | + | svgDocument = evt.target.ownerDocument; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | linkinfo = svgDocument.getElementById('linkinfo'); | |
− | + | linkinfo_bg = svgDocument.getElementById('linkinfo_bg'); | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | } | |
− | + | // Find your root SVG element | |
+ | var svg = document.querySelector('svg'); | ||
− | + | // Create an SVGPoint for future math | |
+ | var pt = svg.createSVGPoint(); | ||
− | + | // Get point in global SVG space | |
+ | function cursorPoint(evt){ | ||
+ | pt.x = evt.clientX; pt.y = evt.clientY; | ||
+ | return pt.matrixTransform(svg.getScreenCTM().inverse()); | ||
+ | } | ||
− | + | function ShowLinkinfo(evt, mouseovertext) | |
− | + | { | |
− | + | var loc = cursorPoint(evt); | |
− | + | ||
− | + | ||
− | + | linkinfo.setAttributeNS(null,"x",loc.x+5); | |
+ | linkinfo.setAttributeNS(null,"y",loc.y+65); | ||
+ | linkinfo.firstChild.data = mouseovertext; | ||
+ | linkinfo.setAttributeNS(null,"visibility","visible"); | ||
− | + | length = linkinfo.getComputedTextLength(); | |
+ | linkinfo_bg.setAttributeNS(null,"width",length+6); | ||
+ | linkinfo_bg.setAttributeNS(null,"x",loc.x+2); | ||
+ | linkinfo_bg.setAttributeNS(null,"y",loc.y+8); | ||
+ | linkinfo_bg.setAttributeNS(null,"visibility","visibile"); | ||
+ | } | ||
− | + | function HideLinkinfo(evt) | |
− | + | { | |
− | + | linkinfo.setAttributeNS(null,"visibility","hidden"); | |
− | + | linkinfo_bg.setAttributeNS(null,"visibility","hidden"); | |
− | + | } | |
− | + | ]]> | |
+ | </script> | ||
+ | <defs> | ||
+ | <style> | ||
+ | circle { | ||
+ | opacity:0; | ||
+ | } | ||
+ | circle:hover { | ||
+ | opacity:0; | ||
+ | } | ||
− | + | .linkinfo{ | |
+ | text-shadow: 0 0 3px var(--logo-dark-blue); | ||
+ | font-family: Orbitron, sans-serif; | ||
+ | font-size: 50px; | ||
+ | } | ||
+ | .linkinfo_bg{ | ||
+ | fill: white; | ||
+ | opacity: 0.85; | ||
+ | } | ||
+ | </style> | ||
+ | </defs> | ||
+ | <text | ||
+ | style="font-weight:bold;font-stretch:normal;font-size:95px;line-height:1.25;font-family:'Orbitron';text-align:center;letter-spacing:0px;word-spacing:0px;text-anchor:middle;opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.28015012" | ||
+ | x="1040" | ||
+ | y="200">EncaBcillus</text> | ||
+ | <text | ||
+ | style="font-weight:bold;font-stretch:normal;font-size:60px;line-height:1.25;font-family:'Orbitron';text-align:center;letter-spacing:0px;word-spacing:0px;text-anchor:middle;opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0.28015012" | ||
+ | x="1305" | ||
+ | y="280">It´s a trap!</text> | ||
− | + | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Description"> | |
− | + | <circle cx="976" cy="720" r="185" | |
− | + | onmousemove="ShowLinkinfo(evt, 'Project')" | |
− | + | onmouseout="HideLinkinfo(evt)"/> | |
− | + | </a> | |
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Description"> | ||
+ | <circle cx="780" cy="854" r="40" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Project')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Description"> | ||
+ | <circle cx="755" cy="670" r="70" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Project')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Description"> | ||
+ | <circle cx="1195" cy="605" r="40" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Project')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Description"> | ||
+ | <circle cx="1230" cy="790" r="60" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Project')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Results"> | ||
+ | <circle cx="140" cy="15" r="455" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Results')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Lab_Work"> | ||
+ | <circle cx="1840" cy="210" r="100" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Lab Work')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Human_Practices"> | ||
+ | <circle cx="345" cy="815" r="100" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Human Practices')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/iGEM-goes-green"> | ||
+ | <circle cx="1565" cy="525" r="115" | ||
+ | onmousemove="ShowLinkinfo(evt, 'iGEM goes green')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Judging"> | ||
+ | <circle cx="471" cy="906" r="21" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Judging')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Judging"> | ||
+ | <circle cx="490" cy="870" r="18" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Judging')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Judging"> | ||
+ | <circle cx="505" cy="834" r="15" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Judging')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Judging"> | ||
+ | <circle cx="513" cy="805" r="11" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Judging')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/Judging"> | ||
+ | <circle cx="517" cy="783" r="9" | ||
+ | onmousemove="ShowLinkinfo(evt, 'Judging')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/About_Us"> | ||
+ | <circle cx="1920" cy="700" r="90" | ||
+ | onmousemove="ShowLinkinfo(evt, 'About Us')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/About_Us"> | ||
+ | <circle cx="1990" cy="610" r="80" | ||
+ | onmousemove="ShowLinkinfo(evt, 'About Us')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
+ | <a xlink:href="https://2017.igem.org/Team:TU_Dresden/About_Us"> | ||
+ | <circle cx="1840" cy="750" r="90" | ||
+ | onmousemove="ShowLinkinfo(evt, 'About Us')" | ||
+ | onmouseout="HideLinkinfo(evt)"/> | ||
+ | </a> | ||
− | |||
− | + | <rect class="linkinfo_bg" id="linkinfo_bg" | |
− | + | x="0" y="0" rx="4" ry="4" | |
− | + | width="55" height="80" visibility="hidden"/> | |
− | + | <text class="linkinfo" id="linkinfo" | |
− | + | x="0" y="0" visibility="hidden">Tooltip</text> | |
− | + | </svg> | |
− | + | </div> | |
− | + | </main> | |
− | + | </div> | |
− | + | ||
− | + | ||
</html> | </html> | ||
+ | {{TU_Dresden/Footer}} |
Latest revision as of 22:36, 1 November 2017