|
|
(278 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&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&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"> 〈 </a>
| + | |
- | <a class="carousel-control right" href="#myCarousel" data-slide="next"font-size: 18px; style="font-family: serif"> 〉</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 »</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 »</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 »</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 »</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 »</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 »</a>
| + | |
- | </div>-->
| + | |
- | </div>
| + | |
- | </div>
| + | |
- |
| + | |
- | </div>
| + | |
- | </div> <!--/Slider-->
| + | |
- |
| + | |
- |
| + | |
- | </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 © 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> |