Team:Penn/HumanPractices

From 2013.igem.org

(Difference between revisions)
 
(28 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
+
<html lang="en">
-
  <head>
+
<head>
-
     <title></title>
+
     <title>Team</title>
-
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
      <link href="https://googledrive.com/host/0B4ZBZOYYKBzEVHRaZEdUVGo5cjA" type="text/css" rel="stylesheet"/>
-
    <!-- Bootstrap and mainstyle css -->
+
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
-
    <link href="https://googledrive.com/host/0B4ZBZOYYKBzEeUFaR1lNWFZWMnc" rel="stylesheet" media="screen">
+
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ" type="text/javascript"></script>
-
    <link href="https://googledrive.com/host/0B4ZBZOYYKBzEYUtsRS1ZWHM2bTQ" type="text/css" rel="stylesheet"/>
+
<script src="https://googledrive.com/host/0B4ZBZOYYKBzEblVWdXkta245Y0k//" type="text/javascript"> </script> <!--javascript-->
-
  <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
+
<script>
-
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
+
        $(document).ready(function($) {
-
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEOFVQV0ZLWEZqN2M"></script>
+
-
   
+
-
    <script>
+
-
        jQuery(document).ready(function($) {
+
-
       
+
-
        $('body').scrollspy({ target: '#nav-circles' });
+
-
$("#one").click(function() {
+
-
        $('html, body').animate({
+
-
        scrollTop: $("#top").offset().top,
+
-
    }, '2400');
+
-
});
+
-
   
+
-
      $("#two").click(function() {
+
-
        $('html, body').animate({
+
-
        scrollTop: $("#first-section").offset().top,
+
-
    }, '2400');
+
-
});
+
-
     
+
-
          $("#three, #team").click(function() {
+
-
        $('html, body').animate({
+
-
        scrollTop: $("#second-section").offset().top,
+
-
    }, '2400');
+
-
});
+
-
      $("#four").click(function() {
+
/*load in the sidebar*/
-
        $('html, body').animate({
+
$('.left_wrap').load('https://googledrive.com/host/0B4ZBZOYYKBzEclFHMmpZcVlydmc');
-
        scrollTop: $("#third-section").offset().top,
+
 
-
    }, '2400');
+
          });
-
});
+
-
       
+
-
        });
+
     </script>
     </script>
     <style>
     <style>
-
        /*hero unit positioning*/
+
                 
-
        #text {
+
-
            margin-left: 20px;
+
-
            padding: 50px;
+
-
           
+
-
        }
+
          
          
-
        /*navigation circles*/
+
      
-
        #nav-circles {
+
-
            position: fixed;
+
-
            top: 100px;
+
-
            right: 20px;
+
-
            z-index: 9999;
+
-
        }
+
-
       
+
-
        #nav-circles li {
+
-
            display: block;
+
-
            height: 30px;
+
-
            width: 30px;
+
-
            border-radius: 100%;
+
-
            margin:10px;
+
-
 
+
-
            top: 100px;
+
-
            right: 100px;
+
-
            background-color: gray;
+
-
        }
+
-
       
+
-
        /*Sections*/
+
-
        .section {
+
-
            min-height: 700px;
+
-
            min-width: 500px;
+
-
        }
+
-
       
+
-
        /*rows with images*/
+
-
        .row{
+
-
            width: 100%;
+
-
            margin-top: 100px;
+
-
            margin-left: 5px;
+
-
        }
+
-
       
+
-
      .span4 {
+
-
            height: 150px;
+
-
            width: 150px;
+
-
            position: relative;
+
-
              -moz-border-radius: 100%;
+
-
     -webkit-border-radius: 100%;
+
-
    -khtml-border-radius: 100%;
+
-
            border-radius: 100%;
+
-
            overflow: hidden;
+
-
            background-size: 300px;
+
-
            background-position: -70px -20px;
+
-
            opacity: .7;
+
-
            margin: 50px;
+
-
            display: inline-block;
+
-
           
+
-
        }
+
-
       
+
-
        .span4 img {
+
-
            height: 150px;
+
-
         
+
-
            position: relative;
+
-
        }
+
-
       
+
-
                .span4:hover {
+
-
            opacity: 1;
+
-
        }
+
-
       
+
-
        .img-span {
+
-
    overflow: hidden;
+
-
    height: 100px;
+
-
    width: 100%;
+
-
    margin: auto;
+
-
    background-image: url("https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/APrj2Se2i-/Lynch%20Labs%20PGFI/BE_LynchLabGroup_DSC2811.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg");
+
-
    background-attachment: fixed;
+
-
    background-size: 100%;
+
-
    background-repeat: no-repeat;
+
-
}
+
-
 
+
-
.hero-unit{
+
-
    margin-top:10px;
+
-
}
+
          
          
     </style>
     </style>
-
  </head>
+
</head>
 +
<body>
 +
<img src="http://upload.wikimedia.org/wikipedia/en/d/d6/IGEM_official_logo.png" id="igem"/><!--igem logo-->
 +
<img src="http://collegediabetesnetwork.org/wp-content/uploads/2012/07/UPenn_logo1.png" id="penn"/> <!--penn logo-->
 +
  <div class="left_wrap">
 +
 
    
    
-
    <body data-spy="scroll" data-target="#nav-circles">
 
-
      <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">
 
-
          <div class="navbar-inner" style="padding-left: 50px;">
 
-
            <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
 
-
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
 
-
              <span class="icon-bar"></span>
 
-
              <span class="icon-bar"></span>
 
-
              <span class="icon-bar"></span>
 
-
            </button>
 
-
            <a class="brand" href="https://2013.igem.org/Team:Penn">Penn's iGEM Team</a>
 
-
            <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
 
-
            <div class="nav-collapse collapse">
 
-
              <ul class="nav">
 
-
             
 
-
                <!-- Read about Bootstrap dropdowns at http://twitter.github.com/bootstrap/javascript.html#dropdowns -->
 
-
                <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 class="active"><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>
 
-
                <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>
 
-
              </ul>
 
-
            </div><!--/.nav-collapse -->
 
-
          </div><!-- /.navbar-inner -->
 
-
        </div><!-- /.navbar -->
 
-
 
-
      </div> <!-- /.container -->
 
-
    </div><!-- /.navbar-wrapper -->
 
-
   
 
-
    <!--link circles-->
 
-
<div id="nav-circles">
 
-
<ul class="nav">
 
-
       
 
-
<a href=".#top"><li></li></a>
 
-
<a href="#first-section"><li></li></a>
 
-
<a href="#second-section"><li></li></a>
 
-
<a href="#third-section"><li></li></a>
 
-
</ul>
 
-
    </div>
 
-
<div id="top">
 
-
    <!--Giant Image At the Top-->
 
-
    <div class="jumbotron masthead">
 
-
  <div class="container">
 
-
  <!--<div class="hero-unit" id="text">
 
-
      <p>Human Practices<p>
 
-
    </div>-->
 
-
    <h1>Human Practices</h1>
 
-
    <p>Lorem ipsum dolor sit amet.</p>
 
-
    <p>
 
-
  </div>
 
-
</div></div>
 
      
      
-
<div class="img-span">
 
-
</div>
 
-
 
-
    <!--First section-->
 
-
    <div class="section" id="first-section">
 
-
       
 
-
    <div class="row">
 
-
      <div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/9E2cXZezHT/Discovery%20Day%20Clark%20Park/IMG_2055.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg'); left: 5%;">
 
-
        </div><!-- /.span4 -->
 
-
    <div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/7LfqJB0eR9/Discovery%20Day%20Clark%20Park/IMG_2038.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg'); left: 15%;">
 
-
          <!--<img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>-->
 
-
        </div><!-- /.span4 -->
 
-
 
-
<div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/MeiwwAmxBW/Discovery%20Day%20Clark%20Park/IMG_2057.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg');left: 30%;">
 
-
          <!--<img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/APrj2Se2i-/Lynch%20Labs%20PGFI/BE_LynchLabGroup_DSC2811.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>-->
 
-
        </div><!-- /.span4 --></div>
 
-
 
-
     
 
-
     
 
-
 
-
    <!--first hero unit-->
 
-
    <div class="hero-unit" id="text">
 
-
        <h4>First Section</h4>
 
-
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 
-
  incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
 
-
  exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
 
-
  in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
 
-
  sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
 
-
    </div>
 
-
</div>
 
-
 
-
      </div>
 
      
      
-
<div class="img-span">
+
-
</div>
+
                  <a href="https://2013.igem.org/Team:Penn/HumanPractices"><li class="active" style="background-color: rgb(200,200,215);">human practices</li></a>
-
   
+
<a href="https://2013.igem.org/Team:Penn/Notebook"><li>notebook</li></a>
-
    <div class="section" id="second-section">
+
        </ul>
-
       
+
  <div class="section-title">human practices</div>
-
           
+
    </div>  
-
    <div class="row">
+
-
      <div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/9E2cXZezHT/Discovery%20Day%20Clark%20Park/IMG_2055.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg'); left: 5%;">
+
-
        </div><!-- /.span4 -->
+
-
    <div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/7LfqJB0eR9/Discovery%20Day%20Clark%20Park/IMG_2038.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg'); left: 15%;">
+
-
          <!--<img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/WTlON78GgW/IMG_0264.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>-->
+
-
        </div><!-- /.span4 -->
+
-
<div class="span4" style="background-image: url('https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/MeiwwAmxBW/Discovery%20Day%20Clark%20Park/IMG_2057.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg');left: 30%;">
 
-
          <!--<img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/APrj2Se2i-/Lynch%20Labs%20PGFI/BE_LynchLabGroup_DSC2811.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>-->
 
-
        </div><!-- /.span4 --></div>
 
-
     
+
     <div class="section1" style="background-position: top;">
-
    <!--first hero unit-->
+
         <div class="text">
-
     <div class="hero-unit" id="text">
+
            Is Epigenetic Engineering Safe? <br><br>
-
         <h4>Second Section</h4>
+
Read our thoughts on the matter, in our editorial(link) in the Penn Bioethics Journal, the premiere expert-reviewed undergraduate bioethics journal (publication forthcoming) <br>
-
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
+
We spread the word about synthetic biology and iGEM at numerous outreach events! <br>
-
  incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
+
        </div>
-
  exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
+
-
  in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
+
-
  sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
+
     </div>
     </div>
      
      
-
    </div> <!--endsection-->
 
-
   
 
-
        </div>
 
-
   
 
-
   
 
-
<div class="img-span">
 
-
</div>
 
-
   
 
-
    <div class="section" id="third-section">
 
-
       
 
-
        <div class="row">
 
-
        <div class="span4">
 
-
          <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/9E2cXZezHT/Discovery%20Day%20Clark%20Park/IMG_2055.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>
 
-
        </div><!-- /.span4 -->
 
-
   
 
-
        <div class="span4">
 
-
          <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/7LfqJB0eR9/Discovery%20Day%20Clark%20Park/IMG_2038.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>
 
-
        </div><!-- /.span4 -->
 
-
            <div class="span4">
 
-
          <img src="https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/MeiwwAmxBW/Discovery%20Day%20Clark%20Park/IMG_2057.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg"/>
 
-
        </div><!-- /.span4 -->     
 
-
        </div>
 
-
   
 
-
    <!--first hero unit-->
 
-
    <div class="hero-unit" id="text">
 
-
        <h4>Third Section</h4>
 
-
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
 
-
  incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
 
-
  exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
 
-
  in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
 
-
  sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
 
-
    </div>
 
-
   
 
-
    </div> <!--endsection-->     
 
-
       
 
-
    </body>
 
-
 
 
-
 
 
    
    
 +
</body>
 +
<script>
 +
     
 +
    </script>
</html>
</html>

Latest revision as of 20:11, 23 September 2013

Team

  • human practices
    •
  • notebook
    •
    human practices
    Is Epigenetic Engineering Safe?

    Read our thoughts on the matter, in our editorial(link) in the Penn Bioethics Journal, the premiere expert-reviewed undergraduate bioethics journal (publication forthcoming)
    We spread the word about synthetic biology and iGEM at numerous outreach events!

    Retrieved from "http://2013.igem.org/Team:Penn/HumanPractices"