Team:Penn

From 2013.igem.org

(Difference between revisions)
 
(276 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
+
<html lang="en">
-
  <head>
+
<head>
-
    <title>Home</title>
+
-
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
-
    <!-- Bootstrap -->
+
-
    <link href="https://googledrive.com/host/0B4ZBZOYYKBzEeUFaR1lNWFZWMnc" rel="stylesheet" media="screen">
+
-
        <link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/>
+
-
        <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
+
-
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
+
 +
    <title>Penn iGEM</title>
 +
    <link href="https://googledrive.com/host/0B4ZBZOYYKBzEVHRaZEdUVGo5cjA" type="text/css" rel="stylesheet"/> <!--css-->
 +
 +
<script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script> <!--jquery-->
      
      
-
    <style>
+
<script>
-
         /*fonts/headings*/
+
         $(document).ready(function($) {
-
        h4 {
+
-
            text-align: left;
+
-
        }
+
-
h1 {
+
$('.nav_wrap').load('https://googledrive.com/host/0B4ZBZOYYKBzEclFHMmpZcVlydmc');
-
text-align: center;
+
  });
-
}
+
    </script>
 +
</head>
-
  /* CUSTOMIZE THE CAROUSEL
+
<body>
-
    -------------------------------------------------- */
+
<div id = "banner_wrap">
 +
<div class = "banner"></div>
 +
</div>
 +
<div id = "nav_holder">
 +
<div class = "nav_wrap"></div>
 +
</div>
 +
<div id="text">
 +
<div class="textwrap">
 +
<br>
 +
<br><center><a href = 'https://docs.google.com/forms/d/188iefj_j6gBvrHC0IS3rG2zBelaVuy-JddYNN7QF8_Y/viewform'>Interested in joining the team? Submit your application for Penn iGEM 2014 here. </a></center>
 +
<br>
 +
<br>
 +
<center><object width="900" height="506"><param name="movie" value="//www.youtube.com/v/YJQniNpnU9Q?version=3&amp;hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/YJQniNpnU9Q?version=3&amp;hl=en_US" type="application/x-shockwave-flash" width="800" height="506" allowscriptaccess="always" allowfullscreen="true"></embed></object></center>
 +
<center><TABLE  CELLSPACING="10" CELLPADDING="1">
 +
<TR>
-
    .carousel-control {
+
<TD ALIGN = "center" width='240'> <TABLE
-
      height: 80px;
+
style="border:10px inset #CF8035;">
-
      margin-top: 0;
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/MaGellinToolbox'><IMG SRC="http://farm6.staticflickr.com/5523/10529365546_355d2fe7fc.jpg" width="240" height="auto"></a></TD></TR>
-
      font-size: 75px;
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/MaGellinToolbox'>Constructed a toolbox for developing site-specific DNA methylases</a></TD>
-
      text-shadow: 0 1px 1px rgba(0,0,0,.4);
+
-
      background-color: transparent;
+
-
      border: 0;
+
-
      z-index: 10;
+
-
color: rgb(200,200,200);
+
-
    }
+
-
   
+
<TD ALIGN = "center" width='240'> <TABLE
-
    #main_area{
+
style="border:10px inset #099240;">
-
  width: 80%;
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/AssayOverview'><IMG SRC="http://farm3.staticflickr.com/2836/10529350575_dfb38e3538.jpg" width="240" height="auto"></a></TD></TR>
-
  margin: auto !important;
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/AssayOverview'>Created a standardized assay for site-specific methylases</a></TD>
-
 
+
-
     
+
-
    }
+
-
/*#myCarousel {
+
<TD ALIGN = "center" width='240'> <TABLE
-
  width: 80%;
+
style="border:10px inset #2D68B6;">
-
 
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/Software'><IMG SRC="http://farm4.staticflickr.com/3742/10529401844_cc5f713a48.jpg" width="240" height="auto"></a></TD></TR>
-
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/Software'>Developed software to automate analysis of our assay</a></TD>
-
}*/
+
-
   
+
-
.item {
+
</TR>
-
  overflow: hidden;
+
-
+
-
 
+
-
}
+
-
.span2 {
+
<TR>
-
  overflow: hidden;
+
-
  height: 80px;
+
-
 
+
-
 
+
-
}
+
-
.thumbnails {
+
<TD ALIGN = "center" width='240'> <TABLE
-
overflow: hidden
+
style="border:10px inset #1F135B;">
-
position: relative;
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/MethylaseOverview'><IMG SRC="http://farm6.staticflickr.com/5478/10529350195_2c54c496e5.jpg" width="240" height="auto"></a></TD></TR>
-
float: center;
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/MethylaseOverview'>Designed and characterized a novel TALE-methylase fusion protein</a> <br></TD>
-
}
+
-
.span4 {
+
<TD ALIGN = "center" width='240'> <TABLE
-
  float: right;
+
style="border:10px inset #F61F27;">
-
  text-align: right;
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/hpoverview'><IMG SRC="http://farm4.staticflickr.com/3670/10529586493_833c6216ee.jpg" width="240" height="auto"></a></TD></TR>
-
}
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/hpoverview'>Introduced synthetic biology to the community</a></TD>
 +
<TD ALIGN = "center" width='240'> <TABLE
 +
style="border:10px inset #ED115B;">
 +
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/Too_Soon_To_Treat'><IMG SRC="http://farm4.staticflickr.com/3815/10529365086_82d164e2b1.jpg" width="240" height="auto"></a></TD></TR>
 +
</TABLE><br><a href='https://2013.igem.org/Team:Penn/Too_Soon_To_Treat'>Published an article on the ethics of epigenetic engineering</a></TD>
-
.footer {
+
</TR>
-
width: 100%;
+
-
height: 15px;
+
-
padding: 5px;
+
-
margin-top: 100px;
+
-
text-align: left;
+
-
background-color: black;
+
-
color: #FFFFFF;
+
-
}
+
 +
<TR>
-
    </style>
+
<TD ALIGN = "center" width='240'> <TABLE
-
  </head>
+
style="border:10px inset #099240;">
-
  <body>
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/Team'><IMG SRC="http://farm6.staticflickr.com/5533/10529401504_677c4f296a.jpg" width="240" height="auto"></a></TD></TR>
-
    <div class="wrapper">
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/Team'>Our team</a> <br> <br> <br></TD>
-
   
+
-
  <div class="navbar-wrapper">
+
-
      <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
+
-
      <div class="container">
+
-
        <div class="navbar navbar-inverse navbar-fixed-top">
+
<TD ALIGN = "center" width='240'> <TABLE
-
          <div class="navbar-inner">
+
style="border:10px inset #2D68B6;">
-
            <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
+
<TR><TD ALIGN="center"><a href='https://2013.igem.org/Team:Penn/Achievements'><IMG SRC="http://farm4.staticflickr.com/3739/10529350025_2db22731e9.jpg" width="240" height="auto"></a></TD></TR>
-
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+
</TABLE><br><a href='https://2013.igem.org/Team:Penn/Achievements'>Grand Prize Winner, North America<br>Best Experimental Measurement Approach, North America</a></TD>
-
              <span class="icon-bar"></span>
+
-
              <span class="icon-bar"></span>
+
-
              <span class="icon-bar"></span>
+
-
            </button>
+
-
          <!-- <a class="brand" style="color: white; padding-left: 11%;" href="https://2013.igem.org/Team:Penn">Penn iGEM</a>-->
+
-
            <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
+
-
            <div class="nav-collapse collapse">
+
-
              <ul class="nav">
+
-
             
+
-
                <li class="active"><a href="https://2013.igem.org/Team:Penn">Penn iGEM</a></li>
+
-
                <li class="dropdown">
+
-
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Project <b class="caret"></b></a>
+
-
                  <ul class="dropdown-menu">
+
-
                 
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Project">Project</a></li>
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Parts">Parts</a></li>
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Modeling">Modeling</a></li>
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Safety">Safety</a></li>
+
-
                  </ul>
+
-
                </li>
+
-
                <li class="dropdown">
+
-
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">About <b class="caret"></b></a>
+
-
                  <ul class="dropdown-menu">
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Team">Team</a></li>
+
-
                    <li><a href="https://2013.igem.org/Team:Penn/Sponsors">Sponsors</a></li>
+
-
                    <li><a href="https://igem.org/Team.cgi?id=1128">Official Team Profile</a></li>
+
-
                    <!--<li class="divider"></li>
+
-
                    <li class="nav-header">Nav header</li>
+
-
                    <li><a href="#">Separated link</a></li>
+
-
                    <li><a href="#">One more separated link</a></li>-->
+
-
                  </ul>
+
-
                </li>
+
-
                <li><a href="https://2013.igem.org/Team:Penn/HumanPractices">Human Practices</a></li>
+
-
<li><a href="https://2013.igem.org/Team:Penn/Notebook">Notebook</a></li>
+
-
              </ul>
+
-
            </div><!--/.nav-collapse -->
+
-
          </div><!-- /.navbar-inner -->
+
-
        </div><!-- /.navbar -->
+
-
      </div> <!-- /.container -->
 
-
    </div><!-- /.navbar-wrapper -->
 
-
 
+
<TD ALIGN = "center" width='240'> <TABLE
-
<a href="2013.igem.org"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/eOFjfgJ2OQ/Logos/IGEM_basic_Logo_stylized.png?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" style="width: 100px; margin: 5px; display: inline-block;"/></a>
+
style="border:10px inset #CF8035;">
-
      <h1>Penn's iGEM Page is currently under construction</h1>
+
<TR><TD ALIGN="center"><a href='http://articles.philly.com/2013-11-27/news/44490110_1_synthetic-biology-research-project-international-genetically-engineered-machine'><IMG SRC="http://farm8.staticflickr.com/7397/10529350205_c12e2cd367.jpg" width="240" height="auto"></a></TD></TR>
-
<h1 style="font-size: 18px; margin-top: -10px;">See Our <a href="https://2013.igem.org/Team:Penn/Project">Project Description</a></h1>
+
</TABLE><br><a href='http://articles.philly.com/2013-11-27/news/44490110_1_synthetic-biology-research-project-international-genetically-engineered-machine'>Featured in a Philadelphia Inquirer article</a> <br> <br> <br></TD>
 +
</TR>
-
 
+
</TABLE></center>
-
<!--CAROUSEL-->
+
</div>
-
 
+
-
    <!-- Main Area -->
+
-
                <div id="main_area">
+
-
                        <!-- Slider -->
+
-
                        <div class="row">
+
-
                                <div class="span12" id="slider">
+
-
                                        <!-- Top part of the slider -->
+
-
                                        <div class="row">
+
-
                                                <div class="span8" id="carousel-bounding-box">
+
-
                                                        <div id="myCarousel" class="carousel slide">
+
-
                                                                <!-- Carousel items -->
+
-
                                                                <div class="carousel-inner">
+
-
                                                                        <div class="active item" data-slide-number="0"><img src="https://googledrive.com/host/0B4ZBZOYYKBzES3Jrc042WTlMR3c/" /></div>
+
-
                                                                        <div class="item" data-slide-number="1"><img src="https://googledrive.com/host/0B4ZBZOYYKBzEWHBpYXpOcFRBcGc/" /></div>
+
-
                                                                        <div class="item" data-slide-number="2"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/IJzMo_qodJ/Profile%20Photos/IMG_8336.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
-
                                                                        <div class="item" data-slide-number="3"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
-
                                                                        <!--<div class="item" data-slide-number="4"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/jtmF8YkJ_P/device%20photo.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
-
                                                                        <div class="item" data-slide-number="5"><img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/uN-wv6h07i/Unified%20Artwork%20Styles%20Here/science%21%21%21/20130513135201-0.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" /></div>
+
-
                                                                --></div>
+
-
                                                                <!-- Carousel nav -->
+
-
                                                                <a class="carousel-control left" href="#myCarousel" data-slide="prev" font-size: 20px; style="font-family: serif"> &#9001; </a>
+
-
                                                                <a class="carousel-control right" href="#myCarousel" data-slide="next"font-size: 18px; style="font-family: serif"> &#9002;</a>
+
-
                                                        </div>
+
-
                                                </div>
+
-
                                                <div class="span4" id="carousel-text"></div>
+
-
+
-
                                                <div style="display: none;" id="slide-content">
+
-
                                                        <div id="slide-content-0">
+
-
                                                                <h1>Hello and Welcome!</h1>
+
-
                                                      <p>Welcome to Penn's iGEM team wiki!  This wiki is currently under construction, but check
+
-
                                                    back with us soon to learn more about what we're up to!</p> <a id="team" class="btn" href="https://2013.igem.org/Team:Penn/Team">Meet the Team &raquo;</a>
+
-
                                                        </div>
+
-
                                                        <div id="slide-content-1">
+
-
                                                                <h1>Project</h1>
+
-
              <p>The code of life is much more than a sequence of A's, G's, C's and T's; a suite of epigenetic mechanisms, ranging from chromatin remodeling to non-coding RNAs, affect gene expression and cellular function.  In particular, DNA methylation has been shown to alter transcriptional activity in a powerful, heritable manner... </p>
+
-
              <a class="btn" href="https://2013.igem.org/Team:Penn/Project">Read More &raquo;</a>
+
-
                                                        </div>
+
-
                                                        <div id="slide-content-2">
+
-
                                                                <h1>Notebook</h1>
+
-
              <p>Keep up with our daily tasks and progress in our Notebook page.</p>
+
-
              <a class="btn" href="https://2013.igem.org/Team:Penn/Notebook">Notebook &raquo;</a>
+
-
                                                        </div>
+
-
                                                        <div id="slide-content-3">
+
-
                                                                <h1>Sponsors</h1>
+
-
                                                                <p>Nothing we're doing would be possible without our sponsors.</p>
+
-
                                                                <a class="btn" href="https://2013.igem.org/Team:Penn/HumanPractices">Sponsors &raquo;</a>
+
-
                                                        </div>
+
-
                                                      <!--<div id="slide-content-4">
+
-
                                                                <h2>Slider Five</h2>
+
-
                                                                <p>Lorem Ipsum Dolor</p>
+
-
                                                            <a class="btn" href="https://2013.igem.org/Team:Penn/Project">More &raquo;</a>
+
-
                                                        </div>
+
-
                                                        <div id="slide-content-5">
+
-
                                                                <h2>Slider Six</h2>
+
-
                                                                <p>Lorem Ipsum Dolor</p>
+
-
                                                                  <a class="btn" href="https://2013.igem.org/Team:Penn/">More &raquo;</a>
+
-
                                                        </div>-->
+
-
                                                </div>
+
-
                                        </div>
+
-
+
-
                                </div>
+
-
                        </div> <!--/Slider-->
+
-
  <div class="row hidden-phone" id="slider-thumbs">
+
-
                                <div class="span12">
+
-
                                        <!-- Bottom switcher of slider -->
+
-
                                        <ul class="thumbnails">
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-0">
+
-
                                                                <img src="https://googledrive.com/host/0B4ZBZOYYKBzES3Jrc042WTlMR3c/" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-1">
+
-
                                                                <img src="https://googledrive.com/host/0B4ZBZOYYKBzEWHBpYXpOcFRBcGc/" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-2">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/IJzMo_qodJ/Profile%20Photos/IMG_8336.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-3">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <!--<li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-4">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/jtmF8YkJ_P/device%20photo.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>
+
-
                                                <li class="span2">
+
-
                                                        <a class="thumbnail" id="carousel-selector-5">
+
-
                                                                <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/uN-wv6h07i/Unified%20Artwork%20Styles%20Here/science%21%21%21/20130513135201-0.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg" />
+
-
                                                        </a>
+
-
                                                </li>-->
+
-
                                        </ul>
+
-
                                </div>
+
-
                     
+
-
                        </div>
+
</div>
</div>
-
 
+
<div id ="pagefooter">
-
<!--FOOTER-->
+
<br>
-
<div class="footer">
+
<br>
-
<p>Photos: ?? | Website: Stefanie Alfonso</p>
+
<center><a href = "https://2013.igem.org/Team:Penn"> Home  </a> <a href = "https://static.igem.org/mediawiki/2013/e/e5/Spec_Sheet.pdf" >Spec Sheet</a> <a href = "https://2013.igem.org/Team:Penn/sitemap" >Sitemap</a>
 +
</center>
 +
<br>
 +
Penn iGem &copy; 2013
</div>
</div>
-
</div> <!--wrapper-->
+
</body>
-
<script>
+
-
  jQuery(document).ready(function($) {
+
-
+
-
        $('#myCarousel').carousel({
+
-
                interval: 5000
+
-
        });
+
-
+
-
        $('#carousel-text').html($('#slide-content-0').html());
+
-
+
-
        //Handles the carousel thumbnails
+
-
        $('[id^=carousel-selector-]').click( function(){
+
-
                var id_selector = $(this).attr("id");
+
-
                var id = id_selector.substr(id_selector.length -1);
+
-
                var id = parseInt(id);
+
-
                $('#myCarousel').carousel(id);
+
-
        });
+
-
+
-
+
-
        // When the carousel slides, auto update the text
+
-
        $('#myCarousel').on('slid', function (e) {
+
-
                var id = $('.item.active').data('slide-number');
+
-
                $('#carousel-text').html($('#slide-content-'+id).html());
+
-
        });
+
-
+
-
+
-
});
+
-
</script>
+
-
 
+
-
   
+
-
   
+
-
   
+
-
  </body>
 
</html>
</html>

Latest revision as of 16:42, 15 January 2014

Penn iGEM