Team:Penn

From 2012.igem.org

(Difference between revisions)
 
(438 intermediate revisions not shown)
Line 1: Line 1:
 +
{{:Team:Penn/Template/Site}}
<html>
<html>
-
<head>
 
-
<link rel="stylesheet" href='/Team:Penn/css/navigation?action=raw&amp;ctype=text/css' />
 
-
<link rel="stylesheet" href='/Team:Penn/css/layerslider?action=raw&amp;ctype=text/css' />
 
-
<link rel="stylesheet" href='/Team:Penn/css/style2?action=raw&amp;ctype=text/css' />
 
-
<link rel="stylesheet" href='/Team:Penn/css/columns?action=raw&amp;ctype=text/css' />
 
-
<link rel="stylesheet" href='/Team:Penn/css/igemcss?action=raw&amp;ctype=text/css' />
 
 +
<!----------------------------------------------------------------------------------------------------->
-
<title>Penn 2012 iGEM Wiki</title>
+
<table width="1000px" height="335px" style="background:#01256e; margin-bottom:20px;">
 +
<tr style="text-align:center;" valign="top">
 +
<td style="width:750px;padding-top:20px;">
-
<style type="text/css">
+
            <div class="rotator">
-
.classname {
+
                <ul id="rotmenu">
-
-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
+
<li>
-
-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
+
                        <a href="rot1" style="font-size:12px;"><b>Regional Winners!</b></a>
-
box-shadow:inset 0px 1px 0px 0px #bee2f9;
+
                        <div style="display:none;">
-
background-color:#63b8ee;
+
                            <div class="info_image">2/2c/Regional-Winners-Slider.jpg</div>
-
-moz-border-radius:6px;
+
                            <div class="info_heading"></div>
-
-webkit-border-radius:6px;
+
                            <div class="info_description">
-
border-radius:6px;
+
                                Penn iGEM placed first in the Americas East Regional Jamboree and advanced to the World Championships!
-
border:1px solid #3866a3;
+
                                <a href="https://igem.org/Results?year=2012&division=igem&region=Americas_East" class="more">Read more</a>
-
display:inline-block;
+
                            </div>
-
color:#14396a;
+
                        </div>
-
font-family:arial;
+
                    </li>
-
font-size:15px;
+
                    <li>
-
font-weight:bold;
+
                        <a href="rot2" style="font-size:12px;"><p><b>Light Induced</b></p><p><b>Lysis</b></p></a>
-
padding:6px 24px;
+
                        <div style="display:none;">
-
text-decoration:none;
+
                            <div class="info_image">4/4f/Light-Induced-Lysis-Slider.jpg</div>
-
text-shadow:1px 1px 0px #7cacde;
+
                            <div class="info_heading">pDAWN ClYA construct</div>
-
}.classname:hover {
+
                           
-
background-color:#468ccf;
+
<div class="info_description">We have developed light-activated cell lysis using the YF1/FixJ Blue Light sensor and the ClyA protein.
-
}.classname:active {
+
<br>
-
position:relative;
+
<a href="https://2012.igem.org/Team:Penn/DrugDeliveryResults" class="more">Read more</a>
-
top:1px;
+
                            </div>
-
}
+
                        </div>
 +
                    </li>
 +
                    <li>
 +
                        <a href="rot3" style="font-size:12px;"><p><b>Novel Surface</b></p><p><b>Display</b></p></a>
 +
                        <div style="display:none;">
 +
                            <div class="info_image">4/46/Novel-Surface-Display-Slider.jpg</div>
 +
                            <div class="info_heading">Display of ANTi-her2 DARPin</div>
 +
                            <div class="info_description">
 +
Our team is the first to use the INPNC protein to display the DARPin Anti-HER2 binding protein on the surface of bacteria <br>
 +
                                <a href="https://2012.igem.org/Team:Penn/DrugDeliveryResults" class="more">Read more</a>
 +
                            </div>
 +
                        </div>
 +
                    </li>
 +
                    <li>
 +
                        <a href="rot4" style="font-size:12px;"><b>Outreach</b></a>
 +
                        <div style="display:none;">
 +
                            <div class="info_image">5/53/Outreach-Slider-Reverse.jpg</div>
 +
                            <div class="info_heading">Clark Park Science Fair</div>
 +
                            <div class="info_description">
 +
Learn more about our education outreach with high schoolers and West Philadelphia residents!
 +
<br>
 +
                                <a href="https://2012.igem.org/Team:Penn/Outreach" class="more">Read more</a>
 +
                            </div>
 +
                        </div>
 +
                    </li>
 +
                    <li>
 +
                        <a href="rot5" style="font-size:12px;"><b>Lab Work</b></a>
 +
                        <div style="display:none;">
 +
                            <div class="info_image">3/36/Lab-Work-Slider2.jpg</div>
 +
                            <div class="info_heading"></div>
 +
                            <div class="info_description">
 +
Learn about cool experiments the team performed this summer!
 +
<br>
 +
                                <a href="https://2012.igem.org/Team:Penn/Notebook" class="more">Read more</a>
 +
                            </div>
 +
                        </div>
 +
                    </li>
 +
                 
 +
                </ul>
 +
                <div id="rot1">
 +
                    <img src="" width="720" height="300" class="bg" alt=""/>
-
</style>
+
                    <div class="description">
 +
                        <p></p>
-
 
+
                    </div>   
-
</head>
+
                </div>
-
 
+
            </div>
-
<body>
+
     
-
 
+
              <!-- The JavaScript -->
-
<div style="margin-bottom:0px; padding-bottom:0px;">
+
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
-
<a href="https://2012.igem.org/Team:Penn" style="padding:0px; margin:0px;">
+
<script type="text/javascript" src='http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js?action=raw&amp;ctype=text/javascript'></script>
-
<img src="https://static.igem.org/mediawiki/2012/e/e5/Bluelogo.jpg" /></a>
+
   
-
</div>
+
        <script type="text/javascript">
-
 
+
            $(function() {
-
<ul class="nav">
+
                var current = 1;
-
<li class="dropdown">
+
               
-
+
                var iterate = function(){
-
    <a href="#">Drug Delivery</a>
+
                    var i = parseInt(current+1);
-
+
                    var lis = $('#rotmenu').children('li').size();
-
<ul>
+
                    if(i>lis) i = 1;
-
        <li><a href='/Team:Penn/DrugDeliveryOverview'>Overview</a></li>
+
                    display($('#rotmenu li:nth-child('+i+')'));
-
<li><a href='/Team:Penn/DrugDeliverySystem'>System</a></li>
+
                }
-
<li><a href='/Team:Penn/DrugDeliveryResults.html'>Results</a></li>
+
                display($('#rotmenu li:first'));
-
<li><a href='/Team:Penn/DrugDeliveryParts.html'>Parts</a></li>
+
                var slidetime = setInterval(iterate,3800);
-
</ul>
+
-
</li>
+
                $('#rotmenu li').bind('click',function(e){
-
+
                    clearTimeout(slidetime);
-
<li class="dropdown">
+
                    display($(this));
-
+
                    e.preventDefault();
-
    <a href="#">Biofilms</a>
+
                });
-
+
-
<ul>
+
-
              <li><a href='/Team:Penn/BiofilmsOverview'>Overview</a></li>
+
-
<li><a href='/Team:Penn/BioflmsSystem'>System</a></li>
+
-
<li><a href='/Team:Penn/BiofilmsResults'>Results</a></li>
+
-
<li><a href='/Team:Penn/BiofilmsParts'>Parts</a></li>
+
-
</ul>
+
-
</li>
+
-
 
+
-
<li class="dropdown">
+
-
+
-
<a href="#">Lab Work</a>
+
-
+
-
<ul>
+
-
                                <li><a href='/Team:Penn/Notebook'>Notebook</a></li>
+
                function display(elem){
-
<li><a href='/Team:Penn/Safety'>Safety</a></li>
+
                    var $this = elem;
-
<li><a href='/Team:Penn/Protocols'>Protocols</a></li>
+
                    var repeat = false;
 +
                    if(current == parseInt($this.index() + 1))
 +
                        repeat = true;
-
</ul>
+
                    if(!repeat)
 +
                        $this.parent().find('li:nth-child('+current+') a').stop(true,true).animate({'marginRight':'-20px'},300,function(){
 +
                            $(this).animate({'opacity':'0.7'},700);
 +
                        });
-
        </li>
+
                    current = parseInt($this.index() + 1);
-
+
-
<li class="dropdown">
+
-
+
-
<a href="#">Human Practices</a>
+
-
+
-
<ul>
+
-
<li><a href='/Team:Penn/Education'>Education</a></li>
+
                    var elem = $('a',$this);
-
<li><a href='/Team:Penn/Regulations'>Regulations</a></li>
+
                   
-
<li><a href='/Team:Penn/Registry'>The Registry</a></li>
+
                        elem.stop(true,true).animate({'marginRight':'0px','opacity':'1.0'},300);
-
</ul>
+
-
+
-
</li>
+
-
+
-
<li class="dropdown">
+
-
+
-
<a href="#">About Us</a>
+
-
+
-
<ul>
+
-
<li><a href='/Team:Penn/Team'>Team</a></li>
+
                    var info_elem = elem.next();
-
<li><a href='/Team:Penn/Advisors'>Advisors</a></li>
+
-
<li><a href='/Team:Penn/Sponsors'>Sponsors</a></li>
+
-
</ul>
+
-
</li>
+
-
+
-
<div class="arrow"></div>
+
-
+
-
</ul>
+
-
<!----------------------------------------------------------------------------------------------------->
 
-
<table width="1000px" height="300px" style="background:#95001a; margin-bottom:0px;">
+
 +
                    $('#rot1 .description').animate({'bottom':'-270px'},500,'easeOutCirc',function(){
 +
                        $('p',$(this)).html(info_elem.find('.info_description').html());
 +
                        $(this).animate({'bottom':'0px'},400,'easeInOutQuad');
 +
                    })
 +
                    $('#rot1').prepend(
 +
                    $('<img/>',{
 +
                        style : 'opacity:0',
 +
                        className : 'bg'
 +
                    }).load(
 +
                    function(){
 +
                        $(this).animate({'opacity':'1'},600);
 +
                        $('#rot1 img:first').next().animate({'opacity':'0'},700,function(){
 +
                            $(this).remove();
 +
                        });
 +
                    }
 +
                ).attr('src','https://static.igem.org/mediawiki/2012/'+info_elem.find('.info_image').html()).attr('width','720').attr('height','300')
 +
                );
 +
                }
 +
            });
 +
        </script>
 +
<!----------------------------------------  END slider ------------------------------------------------------------>
 +
 
 +
</td>
 +
<td style="width:250px;">
 +
<table class="box" style="margin-top:20px;height:305px;width:220px;margin-left:10px;margin-right:10px;">
<tr style="text-align:center;" valign="top">
<tr style="text-align:center;" valign="top">
-
<td style="width:720px;">
+
<td>
-
<p style="font-color:#fff; font-size:40px;padding-left:20px;">WIKI UNDER CONSTRUCTION</p>
+
    <div style="font-size:20px;height:200px;width:220px;">
-
<!--
+
        <div>
-
<div id="dim">
+
        <h2><b>Welcome to the Penn Wiki!</b></h2>
-
<div id="layerslider">
+
 +
<p style="text-align:center; font-size: 12px; font-weight:bold; font-color: white; padding-left:5px; padding-right:5px;">
 +
With the help of our sponsors, the Penn iGEM Team is excited to compete for its second year! </p>
-
<div class="ls-layer" rel="slidedelay: 1000;">
+
<p style="text-align:center; font-size: 12px; font-weight:bold; font-color: white; padding-left:5px; padding-right:5px;">
-
<div class="ls-s0">
+
We have been working hard all summer and are proud of what we have accomplished.
-
+
</p>
-
<iframe width="750" height="500" src="http://www.youtube.com/embed/rD5uNAMbDaQ" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowfullscreen></iframe>
+
-
+
-
</div>
+
-
<div class="ls-s2" style="padding: 20px; background: #ff9933; width: 440px; left: 420px; top: 20px; border-radius: 5px; moz-border-radius: 5px; webkit-border-radius: 5px; color: white; text-shadow: none; font-size: 20px; font-weight: bold; line-height: auto; box-shadow: 0px 0px 20px -5px black">
+
-
Learn more about our projects!
+
-
</div>
+
-
</div>
+
-
+
<p style="text-align:center; font-size: 12px; font-weight:bold; font-color: white; padding-left:5px; padding-right:5px;">
-
</div>
+
Please, take a look around!
-
</div>
+
</p>
 +
<p style="text-align:center; font-size: 14px; font-weight:bold; font-color: white;"><u>Quick Links</u></p>
-
+
 
 +
<p style="text-align:center; font-size: 14px; font-weight:bold; font-color: white;"><a href="https://2012.igem.org/Team:Penn/ProjectResults" class="white">Project Overview</a></p>
 +
-
<script src="http://code.jquery.com/jquery-1.6.2.js" type="text/javascript"></script>
+
<p style="text-align:center; font-size: 14px; font-weight:bold; font-color: white;"><a href="https://2012.igem.org/Team:Penn/Parts" class="white">Parts Submitted</a></p>
-
<script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js" type="text/javascript"></script>
+
-
<script src="https://2012.igem.org/Team:Penn/js/layersliderkreatura" type="text/javascript"></script>
+
-
<script type="text/javascript">
+
-
$(document).ready(function(){
+
-
$('#layerslider').layerSlider({
+
-
+
-
skinsPath : '../layerslider/skins/',
+
-
skin : 'defaultskin'
+
-
+
-
});
+
-
});
+
-
</script>
+
-
-->
+
-
</td>
+
-
<td>
+
-
<table class="box" style="margin-top:5px; margin-left:25px;" width="250px" align="center">
+
<p style="text-align:center; font-size: 14px; font-weight:bold; font-color: white;"><a href="https://2012.igem.org/Team:Penn/Team" class="white">About the Team</a></p>
-
<tr style="text-align:center;" valign="top">
+
        </div>
-
<td>
+
-
    <div class="box" style="height:320px;">
+
-
<div>
+
-
<h2>Welcome!</h2>
+
-
<p style="text-align:center">With the generous support of our sponsors and various departments within the University we are proud to compete for the second consecutive year.
+
-
We have been working hard all summer long, and are proud of all that we’ve accomplished in such a short amount of time.
+
-
<!--<br><br>Please, take a look around!--></p>
+
-
</div>
+
     </div>
     </div>
Line 175: Line 181:
</tr>
</tr>
</table>
</table>
-
<table align="center" style="margin-top:5px;background:#95001a">
+
 
-
<tr style="text-align:center;" valign="top">
+
-
<td>
+
-
<div id="right1">
+
-
<p style="text-align:center; font-size: 20px; font-weight:bold; font-color: white;">Quick Links</p>
+
-
             
+
-
<a href='/Team:Penn/AtAGlance' class="button1">At A Glance</a>
+
-
<br>
+
-
<a href="#" class="button1">Results</a>
+
-
<br>
+
-
<a href="#" class="button1">Parts Submitted</a>
+
-
               
+
-
</div>
+
</td>
</td>
</tr>
</tr>
Line 197: Line 191:
-
<table width="1000px" height="400px" style="background:#95001a; margin-top: 0px;">
 
-
<tr style="text-align:center;" valign="top">
 
-
<td style="width:500px;">
 
-
<div class="box" style="width:400px; height: 350px; margin-top: 0px; margin-left:50px;">
 
-
<div>
 
-
<p style="text-align:center; font-weight:bold; font-size: 17px;padding-top:13px;">Light Activated Cytotoxic Drug Delivery</p>
 
-
<a href="#"><img src="https://static.igem.org/mediawiki/2012/8/84/Animation1.jpg" width="350" height="280" alt=""/></a>
 
-
</div>
 
-
<!--
+
<div style="background-color:#01256e;" align="center">
-
onmouseover="this.src='images/cancercell2.jpg'"
+
<img src="https://static.igem.org/mediawiki/2012/7/7c/Accomplishments-Banner.gif" usemap="#banner" />
-
onmouseout="this.src='images/cancercell1.jpg'"
+
<map id="banner">
-
              -->
+
<area shape="rect" coords="51,4,293,295" href="https://2012.igem.org/Team:Penn/LightActivatedLysis" alt="" title=""    />
-
</div>
+
<area shape="rect" coords="380,4,622,295" href="https://2012.igem.org/Team:Penn/SurfaceDisplay" alt="" title=""    />
-
</td>
+
<area shape="rect" coords="707,4,949,295" href="https://2012.igem.org/Team:Penn/SurfaceDisplayBBa" alt="" title=""    />
-
<td>
+
<area shape="rect" coords="998,298,1000,300" href="http://www.image-maps.com/index.php?aff=mapped_users_4201210260637497" alt="Image Map" title="Image Map" />
-
        <div class="box" style="height: 350px; width:400px; margin-top:0px;float:right; margin-right:50px;">
+
</map>
-
<div>
+
</div>
-
<p style="text-align:center; font-weight:bold; font-size: 17px;padding-top: 13px;">Engineered Microbial Biofilms</p>
+
<br>
-
<a href="#"><img src="https://static.igem.org/mediawiki/2012/8/84/Animation1.jpg" width="350" height="280" alt=""/></a>  
+
-
                </div>
+
-
<!--
+
-
<p style="text-align:center; font-weight:bold; font-size: 20px;">Engineered Microbial Biofilms</p>
+
-
<a href="#"><img src="images/cancercell1.jpg" onmouseover="this.src='images/cancercell2.jpg'" onmouseout="this.src='images/cancercell1.jpg'" width="480" height="300" alt=""/></a>
+
-
-->
+
-
</div>
+
-
</td>
+
-
</tr>
+
-
</table>
+
-
   
+
-
<!-- color is 2538C -->
+
-
<table width="1000px" height="220px" style="background-image:url("https://static.igem.org/mediawiki/2012/0/02/Brushed-silver-metallic-background-pic.jpg");margin-bottom:0px; margin-top:0px;">
+
-
<tr style="text-align:center;" valign="top">
+
-
<div style="padding-top:10px; padding-bottom:20px;">
+
-
<td style="width:325px; padding-left:20px;">
+
<div style="background-color:#01256e;" align="center">
-
<div style="padding-left:50px;"><a href="https://2012.igem.org/Team:Penn/Sponsors" class="classname">Our Sponsors</a></div>
+
<iframe width="700" height="393" style="margin-left:10px;padding:10px; background-color:#000000;"src="http://www.youtube.com/embed/vadTEaV9Sk4" frameborder="1" allowfullscreen></iframe>
-
<br><br>
+
-
<a href="http://www.upenn.edu"><img style="max-width:75%; max-height:40%;border:2.5px solid black" src="https://static.igem.org/mediawiki/2012/9/99/Penn_fulllogo.gif" /></a></div>
+
</div>
</div>
-
<br><br>
 
-
<a href="http://www.seas.upenn.edu"><img style="max-width:75%; max-height:40%;border:2.5px solid black" src="https://static.igem.org/mediawiki/2012/2/2d/Penn-seas_logo.jpg" /></a>
 
-
<br><br>
 
-
<a href="http://www.idtdna.com/site"><img style="max-width:75%; max-height:50%;border:2.5px solid black" src="https://static.igem.org/mediawiki/2012/d/d8/IDT-Logo-Sept-2010-jpg-300x81.jpg" /></a>
 
-
</td>
 
-
<td style="width:325px;padding-left:20px;padding-top:65px;">
+
 
-
<a href="http://www.neb.com/nebecomm/default.asp"><img style="max-width:75%; max-height:40%;border:2.5px solid black" src="https://static.igem.org/mediawiki/2012/e/ea/Neb_logo.gif" /></a>
+
<table width="1000px" height="375px" style="margin-bottom:0px; margin-top:0px; padding-botttm:0px; background-color:#01256F;" >
-
<br><br>
+
<tr style="text-align:center;" valign="top">
-
<a href="http://www.upenn.edu/fisher/"><img style="max-width:75%; max-height:40%;border:2.5px solid black" src="https://static.igem.org/mediawiki/2012/1/1e/MT.jpg" /></a>
+
<td style="width:650px; ">
 +
<map id="sponsormap" name="sponsormap">
 +
  <area shape="rect" coords="106,81,304,153" href="http://www.upenn.edu">
 +
<area shape="rect" coords="107,182,321,234" href="http://www.corning.com/lifesciences">
 +
<area shape="rect" coords="108,272,265,328" href="http://www.genewiz.com/">
 +
<area shape="rect" coords="284,260,387,337" href="http://www.upenn.edu/fisher/">
 +
<area shape="rect" coords="354,78,573,166" href="http://www.seas.upenn.edu/">
 +
<area shape="rect" coords="352,177,576,250" href="http://www.idtdna.com/site">
 +
<area shape="rect" coords="412,265,561,339" href="http://www.neb.com/nebecomm/default.asp">
 +
</map>
 +
<img src="https://static.igem.org/mediawiki/2012/1/1d/NewSpons.jpg" width="650" height="400" usemap="#sponsormap">
</td>
</td>
-
<td style="width:350px;">
+
<td style="width:350px">
-
 
+
  <div style="margin-left:55px; padding-top:55px; padding-bottom:5px;">
-
<div style="margin-left:50px; padding-top:40px; padding-bottom:10px;">
+
 
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
-
<script>
+
  <script>
new TWTR.Widget({
new TWTR.Widget({
   version: 2,
   version: 2,
Line 259: Line 233:
   rpp: 3,
   rpp: 3,
   interval: 30000,
   interval: 30000,
-
   width: 230,
+
   width: 235,
-
   height: 180,
+
   height: 185,
   theme: {
   theme: {
     shell: {
     shell: {
Line 268: Line 242:
     tweets: {
     tweets: {
       background: '#ffffff',
       background: '#ffffff',
 +
       color: '#000000',
       color: '#000000',
       links: '#01256e'
       links: '#01256e'
Line 280: Line 255:
}).render().setUser('PenniGEM').start();
}).render().setUser('PenniGEM').start();
</script>
</script>
-
</div>
+
 
 +
  </div>
</td>
</td>
</tr>
</tr>
-
</table>
+
</table><br>
-
 
+
-
 
+
-
</body>
+
</html>
</html>

Latest revision as of 19:22, 24 August 2013

Penn 2012 iGEM Wiki

Image Map
  • Regional Winners!
    2/2c/Regional-Winners-Slider.jpg
    Penn iGEM placed first in the Americas East Regional Jamboree and advanced to the World Championships! Read more
  • Light Induced

    Lysis

    4/4f/Light-Induced-Lysis-Slider.jpg
    pDAWN ClYA construct
    We have developed light-activated cell lysis using the YF1/FixJ Blue Light sensor and the ClyA protein.
    Read more
  • Novel Surface

    Display

    4/46/Novel-Surface-Display-Slider.jpg
    Display of ANTi-her2 DARPin
    Our team is the first to use the INPNC protein to display the DARPin Anti-HER2 binding protein on the surface of bacteria
    Read more
  • Outreach
    5/53/Outreach-Slider-Reverse.jpg
    Clark Park Science Fair
    Learn more about our education outreach with high schoolers and West Philadelphia residents!
    Read more
  • Lab Work
    3/36/Lab-Work-Slider2.jpg
    Learn about cool experiments the team performed this summer!
    Read more

Welcome to the Penn Wiki!

With the help of our sponsors, the Penn iGEM Team is excited to compete for its second year!

We have been working hard all summer and are proud of what we have accomplished.

Please, take a look around!

Quick Links

Project Overview

Parts Submitted

About the Team