Difference between revisions of "Team:Central Calgary/"

 
(6 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
<html>
+
<html lang="ja">
 +
<!doctype html>  
  
−
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+
<head>
−
<html xmlns="http://www.w3.org/1999/xhtml">
+
<meta charset="utf-8">
 +
        <meta name="viewport" content="width=device-width, initial-scale=1.0">                                              
 +
<title>Central Memorial iGEM</title>
  
−
<head>
+
        <link href='https://fonts.googleapis.com/css?family=Ubuntu:500' rel='stylesheet' type='text/css'>
−
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
        <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
 +
    <link href="https://2015.igem.org/Team:Central_Calgary/header-footer?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
    <link href="https://2015.igem.org/Team:Central_Calgary/main-content?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
        <link href="https://2015.igem.org/Team:Central_Calgary/teampage?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
        <link href="https://2015.igem.org/Team:Central_Calgary/loader?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
<link href="https://2015.igem.org/Team:Central_Calgary/outreach?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
 +
 +
        </head>  
  
−
<title>Central_Calgary</title>
+
<body>
  
−
<!--CSS -->
+
      <div id="loader-wrapper">
 +
            <div id="loader"></div>
 +
            <div id="loader1"></div>
 +
       
 +
            <div class="loader-section section-top"></div>
 +
            <div class="loader-section section-bot"><h4>This website supports IE 11+, Microsoft Edge, Firefox 40+, Google Chrome 45+, Safari 8+, Opera 31+, iOS 8.4+, and Android Chrome. <br>The wiki will not load if you are not using a supported browser. </h4></div>
 +
        </div>
  
−
<link rel="stylesheet" href="https://2015.igem.org/Team:Central_Calgary/Template:CentraliGEM/CSS?action=raw&ctype=text/css" type="text/css"/>
+
    <div id="header">
−
    
+
            <div id="logoDiv"><img id="logo" src ="https://static.igem.org/mediawiki/2015/8/86/CentralLogo.png" alt="logo"></div>
−
    
+
            <div id="homeText"><h10> Central iGEM </h10></div>
−
<!--QUEER-->
+
<div id="headerLeft"></div>
 +
            <ul id="headerMenu">
 +
                <li class="headerMenuItem"><a class="menuItem" id="bPolicy"    href="#" data-target="policy1"    align="middle">Outreach</a></li>
 +
                <li class="headerMenuItem"><a class="menuItem" id="bLogbook"   href="#" data-target="logbook1"   align="middle">Logbook</a></li>
 +
        <li class="headerMenuItem"><a class="menuItem" id="bEthics"    href="#" data-target="ethics1"    align="middle">Ethics</a></li>
 +
                <li class="headerMenuItem"><a class="menuItem" id="bSafety"    href="#" data-target="safety1"    align="middle">Safety</a></li>
 +
        <li class="headerMenuItem"><a class="menuItem" id="bLab"  href="#" data-target="lab1"  align="middle">Lab</a></li>
 +
        <li class="headerMenuItem"><a class="menuItem" id="bProject"  href="#" data-target="project1"  align="middle">Project</a></li>
 +
      <li class="headerMenuItem"><a class="menuItem" id="bTeam"      href="#" data-target="team1"      align="middle">The Team</a></li>
 +
                <li class="headerMenuItem"><a class="menuItem" id="bHome"      href="#" data-target="home1"      align="middle">Home</a></li>
  
−
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>  
+
</ul>  
−
<!--REMOVE THIS WHEN THIS IS PLACED ON THE WIKI AND FIND WHERE THE JQUERY LIBRARY IS ON THE IGEM SERVERs-->
+
               
−
+
        </div>
 +
       
 +
        <div id="contentBg" style="width:110vw; height:100vh;"></div>
  
−
<!--Javascript-->
+
        <div id="content">
  
−
<link rel="stylesheet" href="https://2015.igem.org/Team:Central_Calgary/Template:CentraliGEM/Javascript?action=raw&ctype=text/javascript" type="text/javascript"/></script>
+
        <div id="home1" class="panel"> <h1>Home Page</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
  
  
−
</head>
+
            <div id="team1" class="panel"> <h1>Team Page Main</h1>  
−
<body>
+
           
 +
                <div style="position:relative; top:100px; left:100px;">
 +
  <div class="bJP rad"></div>
 +
    <div class="bJP line"></div>
 +
    <div class="bJP box"><img src="https://static.igem.org/mediawiki/2015/7/76/CentralCalgaryJaredPortrait.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Jared </h2> <p class="bioPara">Jared was once a no life, that is, until he joined IGEM -- of which then, he became a no life that does science. If he isn't in the lab, then in all likelihood, he would be attempting to learn idioms, reading papers, doing math, memorizing the quadratic formula, and eating cake.</p></div>
 +
</div>
 +
           
 +
                <div style="position:relative; top:100px; left:200px;">
 +
  <div class="bFR rad"></div>
 +
    <div class="bFR line"></div>
 +
    <div class="bFR box"><img src="https://static.igem.org/mediawiki/2015/3/38/CentralCalgaryJessica.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Jessica </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
  
−
<div class = "headerSticky-scroll">
+
Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
−
  <div id = "CENTER">
+
</div>    
−
  <div id = "menuText">
+
                       
−
    <div id = "homeText">
+
                <div style="position:relative; top:100px; left:300px;">
−
   
+
  <div class="bAG rad"></div>
−
        <div id="name">
+
    <div class="bAG line"></div>
−
                Central iGEM
+
    <div class="bAG box"><img src="https://static.igem.org/mediawiki/2015/b/b0/CentralCalgaryFrancis.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Francis </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
−
        </div>
+
 
−
        <img src="https://static.igem.org/mediawiki/2015/9/94/IGEMYTLOGO.png" alt="" style="width: ;height: 60px;">
+
Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
−
+
</div>
−
    </div>
+
               
−
        <div class = "parentMenu">
+
                <div style="position:relative; top:100px; left:400px;">
−
       
+
  <div class="bZC rad"></div>
−
        <div class="nav">
+
    <div class="bZC line"></div>
−
       
+
    <div class="bZC box"><img src="https://static.igem.org/mediawiki/2015/d/d8/CentralCalgaryNatalie.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Natalie </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
−
        <ul>
+
 
−
        <li>
+
Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
−
      <a href="products.html">Project <span class="caret"></span></a>
+
</div>
−
            <div>
+
             
−
                <ul>
+
              <div style="position:relative; top:100px; left:500px;">
−
                    <li><a href="#">Our Vision</a></li>
+
  <div class="bVT rad"></div>
−
                    <li><a href="#">Construct</a></li>
+
    <div class="bVT line"></div>
−
                    <li><a href="#">Accomplishments</a></li>
+
    <div class="bVT box"><img src="https://static.igem.org/mediawiki/2015/2/21/CentralCalgaryDanielle.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Danielle </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
−
                </ul>
+
 
−
            </div>
+
Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
−
        </li>
+
</div>
−
        <li><a href="#l">Our Team <span class="caret"></span></a>
+
                <div style="position:relative; top:100px; left:600px;">
−
        <div>
+
  <div class="bNA rad"></div>
−
                <ul>
+
    <div class="bNA line"></div>
−
                    <li><a href="#">Official Profile</a></li>
+
    <div class="bNA box"><img src="https://static.igem.org/mediawiki/2015/d/d3/CentralCalgaryAlexia.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Alexia </h2> <p class="bioPara">Alexia Gendron is a simple 12th grader who spends her spare time perfecting recipes and playing piano. She enjoys reading, volunteering, good soup, Italian, and having insightful conversations. Although born in Calgary, Alberta, she was brought up in French, and attended a francophone school until her 10th grade. This has given her exposure to French-Canadian culture and taught her where to find it even if she finds herself a few provinces away from its origin. For five years she took karate and developed quite a fondness for martial arts. Despite having had to stop karate this year, she plans on starting to practice judo as soon as possible. After discovering Ronda Rousey, she found the very first person ever to move her so strongly, and she considers Rousey to be an inspiration. Right now, Alexia is focusing on the present, and is trying to enjoy her final year of high school before she graduates. Although she plans on attending university next year, she has yet to figure out exactly what she wants to study. She has always loved to learn all there is to learn and do all there is to do; she hopes to travel the world someday, meet fantastical people, and have a great collection of jaw-dropping stories to tell.</p></div>
−
                    <li><a href="#">Team Members</a></li>
+
</div>
−
                    <li><a href="#">Contact Us</a></li>
+
                <div style="position:relative; top:100px; left:700px;">
−
                </ul>
+
  <div class="bNB rad"></div>
−
            </div>
+
    <div class="bNB line"></div>
−
                        <li><a href="index.html">Home</a></li>
+
    <div class="bNB box"><img src="https://static.igem.org/mediawiki/2015/f/f7/CentralCalgaryZenab.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Zenab </h2> <p class="bioPara">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem.
−
                           
+
 
−
        <li><a href="help.html">Notebook <span class="caret"></span></a>
+
Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer. </p></div>
−
        <div>
+
</div>
−
                <ul>
+
 
−
                    <li><a href="Protocols">Protocols</a></li>
+
<div style="position:relative; top:100px; left:800px;">
−
                    <li><a href="about.html#table">Lab Work</a></li>
+
  <div class="bNC rad"></div>
−
                    <li><a href="cooker.html">General</a></li>
+
    <div class="bNC line"></div>
−
                </ul>
+
    <div class="bNC box"><img src="https://static.igem.org/mediawiki/2015/2/21/ReplaceWithVlad.jpg" alt="Portrait" style="float:left; width:200px; padding:10px;"><h2> Vlad </h2> <p class="bioPara">Vladimir has been living in Calgary since day one. Growing up, he has experienced and explored everything from the bike paths in Fish Creek to the top of the Bow. At the age of eight, Vladimir developed a passion of photography and film­making, and carries it with him to this day. If he is not capturing photos, or studying, you can most likely find him zipping around from city to city on his bike. His passion for iGEM developed within the first weeks of grade ten, and carries into many aspects of his life. From lab work to media, Vladimir does it all.</p></div>
−
            </div>
+
</div>
−
        <li><a href="about.html">Policy & Practices <span class="caret"</span></a>
+
</div>
−
        <div>
+
−
            <ul>
+
−
                <li><a href="Protocols">Saftey</a></li>
+
−
                  <li><a href="about.html#table">Ethics</a></li>
+
−
                  <li><a href="cooker.html">General</a></li>
+
−
                </ul>
+
−
            </div>
+
 
              
 
              
  
−
    </ul>
+
            <div id="team2" class="panel"> <h1>Associates</h1> <p >Thank you for you generous sponsorship<img src="https://static.igem.org/mediawiki/2015/9/92/AlbertaInnovatesLogo.png" alt="Alberta Innovates" style="width:100px;"></p><p>For giving us an opportunity and something worth my spare time<img src="https://static.igem.org/mediawiki/2015/6/64/SchoolLogo.png" alt="Central Memorial Highschool" style="width:100px;"></p><p>Special Thanks to: David Lloyd, our mentor</p> <p>Iain George our other mentor</p><p>Ms.Wyshinski, who is not a biologist but kept us on track</p><p>Mr.Klemmer for his great support</p></div>
−
    </div>  
+
 
−
  </div>
+
            <div id="project1" class="panel"> <h1>The Project; The Dream 1</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
−
</div>  
+
</p></div>
−
</div>
+
  
 +
<div id="project2" class="panel"> <h1>The Project; The Dream 2</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
<div id="project3" class="panel"> <h1>The Project; The Dream 3</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
<div id="project4" class="panel"> <h1>The Project; The Dream 4</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
<div id="project5" class="panel"> <h1>The Project; The Dream 5</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
<div id="project6" class="panel"> <h1>The Project; The Dream 6</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
<div id="project7" class="panel"> <h1>The Project; The Dream 7 </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
  
−
</nav>
+
</p></div>
−
        </div>
+
−
</div>
+
−
</div>  
+
  
 +
<div id="lab1" class="panel"> <h1>Lab Protocol 1: Making LB Broth</h1> <p>
 +
This protocol is used to make LB Broth. This like every protocol has been adapted from the Synthetic Biology Guidebook for iGEM High School. Important note for all protocols: <i>Everything must be sterile, and kept as aseptic as possible, throughout all procedures.</i>
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>Tryptone</li>
 +
<li>Yeast Extract; Bacteriological</li>
 +
<li>NaCl (Molec Biol Grade)</li>
 +
<li>Distilled Water</li>
 +
<li>1L Beaker</li>
 +
<li>Micropipette + Tips</li>
 +
<li>Parafilm</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Weigh out, and add the following into the 1L container.
 +
      <ol class="materialList">
 +
<li>5g Tryptone</li>
 +
<li>2.5g Yeast Extract</li>
 +
<li>5g NaCl</li>
 +
      </ol>
 +
        </li>
 +
<li><p>Add 500ml of distilled water into the 1L container. The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.</p> </li>
 +
<li><p>Mix by swirling. Some powder may not dissolve. Make sure that none gets stuck to the sides.</p></li>
 +
<li><p>Cover the top with aluminum foil. Ensure the foil is loose enough to allow pressure to escape in the autoclave.</p></li>
 +
        <li><p>Place/stick a strip of autoclave tape on top.</p></li>
 +
<li><p>Autoclave at about 15psi for 20min.</p></li>
 +
<li><p>Remove from autoclave and cool.</p></li>
 +
<li><p>The autoclaved liquid is now to be stored at  4°C in a fridge.</p></li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 +
</div>
 +
 +
<div id="lab2" class="panel"> <h1>Lab Protocol 1.5: Making LB Plates </h1> <p>
 +
This protocol is used to make LB Plates. Note how this protocol makes 500ml of LB Agar for 20-25 plates. It can be scaled up and down as required.
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
      <ol class="materialList">
 +
<li>Tryptone</li>
 +
<li>Yeast Extract; Bacteriological</li>
 +
<li>Agar; Bacteriological</li>
 +
<li>NaCl (Molec Biol Grade)</li>
 +
<li>Distilled Water</li>
 +
<li>Sterile Antibiotic Stock Solution - If needed</li>
 +
<li>Autoclave + Autoclave Tape</li>
 +
<li>Scale</li>
 +
<li>1L Glass Bottle/Erlenmeyer Flask</li>
 +
<li>Sterile Petri Dishes</li>
 +
<li>Aluminium Foil</li>
 +
<li>Micropipette + Tips</li>
 +
<li>Parafilm</li>
 +
      </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Weigh out, and add the following into the 1L container.</li>
 +
<ol class="materialList">
 +
<li>5g Tryptone</li>
 +
<li>2.5g Yeast Extract</li>
 +
<li>5g NaCl</li>
 +
<li>7.5g Agar</li>
 +
</ol>
 +
<li>Add 500ml of distilled water into the 1L container. *The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.* </li>
 +
<li>Mix by swirling. *Some powder may not dissolve. Make sure that none gets stuck to the sides.*</li>
 +
<li>Cover the top with aluminum foil, loose enough so pressure can escape in the autoclave. Place/stick a strip of autoclave tape on top.</li>
 +
<li>Autoclave at about 15psi for 20min.</li>
 +
<li>Remove from autoclave and cool to 55°C.</li>
 +
<li>If you require antibiotic, swirl in a quantity of antibiotic in based upon the table below. The liquid must be cooled or else the hot liquid will degrade the antibiotic.
 +
<table>
 +
  <tr>
 +
    <th>Antibiotic</th>
 +
    <th>Concentration of Prepared Stock</th>
 +
    <th>Final Concentration in LB Agar</th>
 +
    <th>Dillution Factor</th>
 +
    <th>Volume Added to 500ml LB Agar</th>
 +
  </tr>
 +
  <tr>
 +
    <td>Ampicillin</td>
 +
    <td>100mg/ml</td>
 +
    <td>100µg/ml</td>
 +
    <td>1:1000</td>
 +
    <td>500µl</td>
 +
  </tr>
 +
  <tr>
 +
    <td>Kanamycin</td>
 +
    <td>50mg/ml</td>
 +
    <td>50µg/ml</td>
 +
    <td>1:1000</td>
 +
    <td>500µl</td>
 +
  </tr>
 +
  <tr>
 +
    <td>Chloramphenicol</td>
 +
    <td>50mg/ml</td>
 +
    <td>25µg/ml</td>
 +
    <td>1:2000</td>
 +
    <td>250µl</td>
 +
  </tr>
 +
</table>
 +
</li>
  
−
<div id="bodyContent">
+
<li>Label plates with date, plate number, and antibiotic used. </li>
−
<div class="content">
+
<li>Pour, or pipette, around 20ml LB Agar into each petri dish.This must be done aseptically. Pouring slowly, and steadily to avoid bubbles and lumps.</li>
−
<div id="homeOne">
+
<li>Cover with lid, and place to cool/harden. This should take 30min - 1hr.</li>
−
                <div id="homeonetext">
+
<li>Invert plates so agar is on top, to prevent from unnecessary moisture on the plates.</li>
−
                  <h1>Howdy Chocker!</h1>
+
<li>Seal edges with parafilm, and store in 4°C fridge.</li>
−
                  <hr id="homeoneline">
+
      </ol>
−
                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nec purus non eros dapibus pulvinar. Curabitur mollis augue ut congue tempus. Vestibulum ac lobortis sem. Suspendisse tempus, massa ut feugiat dapibus, dui sapien pellentesque risus, sit amet dignissim velit lectus non lectus. Vivamus sagittis sem ante, nec congue est ornare non. Aenean in nibh faucibus, posuere nibh quis, lacinia dolor. Nulla blandit rhoncus convallis. Mauris at massa id sapien suscipit suscipit vel sed dui. Cras euismod purus rutrum metus ullamcorper ullamcorper.</p>
+
    </td>
−
                  </div>
+
  </tr>
−
          <div id="homeoneimageleft">
+
</table>
−
          <img src="https://static.igem.org/mediawiki/2015/5/5b/CentralChocker.png" alt="Map Unavailable" style="width: ;height: 450px; margin-top: -68px;">  
+
</p>
−
</div>
+
</div>
−
        </div>
+
−
        <div id="homeTwo">
+
−
            <div id="hometwotext">
+
−
                  <h1>Bonjour Pete!</h1>
+
−
                    <hr id="hometwoline">
+
−
                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nec purus non eros dapibus pulvinar. Curabitur mollis augue ut congue tempus. Vestibulum ac lobortis sem. Suspendisse tempus, massa ut feugiat dapibus, dui sapien pellentesque risus, sit amet dignissim velit lectus non lectus. Vivamus sagittis sem ante, nec congue est ornare non. Aenean in nibh faucibus, posuere nibh quis, lacinia dolor. Nulla blandit rhoncus convallis. Mauris at massa id sapien suscipit suscipit vel sed dui. Cras euismod purus rutrum metus ullamcorper ullamcorper.</p>
+
−
                  </div>
+
−
          <div id="hometwoimage">
+
−
          <img src="https://static.igem.org/mediawiki/2015/8/8f/Centralpete.png" alt="Map Unavailable" style="width: ;height: 450px; margin-top: -90px; ">  
+
−
</div>
+
  
−
        </div>
+
<div id="lab3" class="panel"> <h1>Lab Protocol 2: Using the DNA Plate - Rehydrating </h1> <p>  
−
        <div id="homeThree">
+
<table class="tableClear" style="width:100%">
−
        <div id="homethreetext">
+
  <tr>
−
                  <h1>Greetings Jar!</h1>
+
    <th>Materials: </th>
−
                    <hr id="homethreeline">
+
    <th>Procedure: </th>
−
                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nec purus non eros dapibus pulvinar. Curabitur mollis augue ut congue tempus. Vestibulum ac lobortis sem. Suspendisse tempus, massa ut feugiat dapibus, dui sapien pellentesque risus, sit amet dignissim velit lectus non lectus. Vivamus sagittis sem ante, nec congue est ornare non. Aenean in nibh faucibus, posuere nibh quis, lacinia dolor. Nulla blandit rhoncus convallis. Mauris at massa id sapien suscipit suscipit vel sed dui. Cras euismod purus rutrum metus ullamcorper ullamcorper.</p>
+
  </tr>
−
                  </div>
+
  <tr>
−
          <div id="homethreeimage">
+
    <td style="vertical-align:top; width:30%;">
−
          <img src="https://static.igem.org/mediawiki/2015/1/10/CentralJAR.png" alt="Map Unavailable" style="width: ;height: 450px; margin-top: -90px; ">  
+
        <ol class="materialList">
−
</div>
+
<li>DNA Kit Plate</li>
−
        </div>
+
        <li>Sterile Distilled Water</li>
−
        <div id="homeFour">
+
        <li>Micropipette + Tips</li>
−
        <h1>Hey! This is our construct!</h1>
+
        </ol>
−
            <p>We have worked so hard on it!</p>
+
    </td>
−
        </div>
+
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Locate well (double, triple check, location).</li>
 +
<li>Draw 10µl of distilled water into pipette.</li>
 +
<li>Puncture foil and release water into the well. </li>
 +
<li>Wait for 10-15 minutes for DNA to rehydrate. </li>
 +
<li>Store the re-hydrated in the freezer (-20°C), leave it on the plate, or transfer into a separate tube. *As little as 1µl can be used to for a successful transformation* </li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 
</div>
 
</div>
  
 +
<div id="lab4" class="panel"> <h1>Lab Protocol 3: Making Competent Cells </h1> <p>
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>DH5alpha E. Coli Cells</li>
 +
<li>50mM CaCl2 Solution (filter sterile)</li>
 +
<li>LB Broth</li>
 +
<li>Incubator and Shaker set at 37°C</li>
 +
<li>Ice</li>
 +
<li>15ml Tubes</li>
 +
<li>Microcentrifuge</li>
 +
<li>Microcentrifuge Tubes</li>
 +
<li>Micropipettes + Tips</li>
 +
<li>Spectrophotometer (optional)</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Transfer 100µl overnight culture (E. Coli) into 10ml of LB Broth (inside 15ml tube).</li>
 +
<li>Grow at 37°C with shaking for at least 3 hours. Optimally until broth is cloudy,and has an OD600 (optical density) of 0.4-0.6.</li>
 +
<li>Transfer 500µl into microcentrifuge tubes, and spin down all four at 7000rpm for 2min. </li>
 +
<li>Discard supernatant, being very careful to not disturb the pellet.</li>
 +
<li>Resuspend the pellet in 500µl CaCl2 solution. </li>
 +
<li>Spin down again at 7000rpm for 2min and remove supernatant.</li>
 +
<li>Resuspend the pellet in 100µl of CaCl2 and place on ice. Cells are now ready for transformation.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 +
</div>
  
 +
<div id="lab5" class="panel"> <h1>Lab Protocol 4: Restriction Digestion </h1> <p>
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>Plasmid DNA</li>
 +
<li>10x Restriction Buffer</li>
 +
<li>Restriction Enzymes (ExoRI, SpeI, XbaI, PsI)</li>
 +
<li>Sterile Distilled Water</li>
 +
<li>Thermocycler</li>
 +
<li>Water Bath set at 37°C</li>
 +
<li>Sterile Microcentrifuge Tubes</li>
 +
<li>Microcentrifuge</li>
 +
<li>Micropipette + Tips</li>
 +
<li>Ice</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Thaw all solutions and buffers, flick (homogenize). *Restriction enzymes DO NOT need thawing and should be kept on ice at all times*</li>
 +
<li>Label a sterile tube clearly for use with the restriction enzyme. </li>
 +
<li>Pipette the following into the microcentrifuge tube in the order listed. </li>
 +
<ol class="inlineList">
 +
<li>10µl Plasmid DNA (500ng)</li>
 +
<li>1µl Restriction Enzyme #1</li>
 +
<li>1µl Restriction Enzyme #2</li>
 +
<li>5µl 10x Restriction Buffer</li>
 +
<li>Up to 50µl sterile distilled water</li>
 +
</ol>
 +
<li>Mix gently by pipetting up and down. *You can briefly spin in the centrifuge to bring contents to the bottom*</li>
 +
<li>Incubate at 37°C  in waterbath for 30min to an hour. </li>
 +
<li>Incubate (heat-shock) at 80°C for 20min.</li>
 +
<li>Store the restriction digest at 20°C or proceed immediately with ligation, or agarose gel electrophoresis.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 +
</div>
  
 +
<div id="lab6" class="panel"> <h1>Lab Protocol 5: Ligation</h1> <p>
 +
A few notes about the ligation: There should be a 3:1, insert DNA (the segment being added) to the vector DNA (the now linear plasmid backbone). Also, the amount of DNA in the ligation should be low, around 100ng.
 +
<br>
 +
The DNA concentration is assumed to be the same for both the insert and vector restriction digests, and it equals 25ng/µl, as set up by the previous protocol. Assuming the insert is about half the size of the vector, to get a molar ratio of 3 insert : 1 Vector, the volume ratio must 1.5 insert :1 vector.
 +
<br>
 +
Ligation buffers are usually 10 fold, (10x) more concentrated than needed. Therefore, they need to be diluted 10 times, i.e. 1µl in a total volume in 10µl.
 +
<br>
 +
*A general formula for determining the volume ratio of insert to vector.*
 +
<br>
 +
Vi / Vv = 3 x (Cv / Ci) x (Mi / Mv)
 +
<br>
 +
Vi = Volume Insert
 +
<br>
 +
Vv = Volume Vector
 +
<br>
 +
Cv = DNA conc. of vector restriction digest
 +
<br>
 +
Ci = DNA conc. of insert restriction digest
 +
<br>
 +
Mi = Molecular weight i.e. approximate size of insert
 +
<br>
 +
Mv = Molecular weight i.e. approximate size of vector
 +
<br>
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>nsert Restriction Digest Mix</li>
 +
<li>Vector Restriction Digest Mix</li>
 +
<li>10x Ligation Buffer</li>
 +
<li>T4 DNA Ligase</li>
 +
<li>Sterile Distilled Water </li>
 +
<li>Thermocycler</li>
 +
<li>Sterile Microcentrifuge Tubes</li>
 +
<li>Micropipette + Tips</li>
 +
<li>Ice</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Thaw all solutions and buffers, flick (homogenize). *Ligation enzymes DO NOT need thawing and should be kept on ice at all times*</li>
 +
<li>Label a sterile tube clearly for use with the ligation enzyme. </li>
 +
<li>Pipette the following in order (adding up to a total volume of 10µl).</li>
 +
<ol class="materialList">
 +
<li>3µl Sterile Distilled Water</li>
 +
<li>3µl Insert Restriction Digest</li>
 +
<li>2µl Vector Restriction Digest</li>
 +
<li>1µl 10x Ligation Buffer</li>
 +
</ol>
 +
<li>Pipette up and down to mix. Briefly centrifuge to collect all liquid at the the bottom of the tube.</li>
 +
<li>Incubate at room temperature for about an hour.</li>
 +
<li>Incubate at 80°C for 20 minutes, to denature the ligase (heat-shock).</li>
 +
<li>Store ligation mix at 20°C in a freezer, or proceed immediately with a transformation.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 +
</div>
  
−
<div id="footer">
+
<div id="lab7" class="panel"> <h1>Lab Protocol 6: Transformation</h1> <p>  
−
    <div id="map">
+
<table class="tableClear" style="width:100%">
−
    <img src="https://static.igem.org/mediawiki/2015/1/14/Centralmap.PNG" alt="Map Unavailable" style="width: 400;height: 300px;">
+
  <tr>
−
</div>
+
    <th>Materials: </th>
−
     <div id="footerWords"
+
    <th>Procedure: </th>
−
<p>Central iGEM, is a dedicated high school iGEM team based out of Calgary, Alberta, Canada.</p>
+
  </tr>
−
        <hr id="footerLine">
+
  <tr>
−
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nec purus non eros dapibus pulvinar. Curabitur mollis augue ut congue tempus. Vestibulum ac lobortis sem. Suspendisse tempus, massa ut feugiat dapibus, dui sapien pellentesque risus, sit amet dignissim velit lectus non lectus. Vivamus sagittis sem ante, nec congue est ornare non. Aenean in nibh faucibus, posuere nibh quis, lacinia dolor. Nulla blandit rhoncus convallis. Mauris at massa id sapien suscipit suscipit vel sed dui. Cras euismod purus rutrum metus ullamcorper ullamcorper. </p>
+
    <td style="vertical-align:top; width:30%;">
−
    </div>
+
        <ol class="materialList">
 +
<li>100µl Aliquots of Competent Cells (Protocol 1).</li>
 +
<li>DNA Ligation Mix</li>
 +
<li>Control Plasmid DNA</li>
 +
<li>LB Broth</li>
 +
<li>LB Agar Plates (with desired antibiotic)</li>
 +
<li>Water bath at 42°C</li>
 +
<li>Incubator at 37°C</li>
 +
<li>Spreader</li>
 +
<li>Bunsen Burner</li>
 +
<li>Ice</li>
 +
<li>Micropipettes + Tips</li>
 +
        </ol>  
 +
     </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Obtain fresh, or frozen, competent cells. Thaw and keep on ice.</li>
 +
<li>Label the tube.</li>
 +
<li>Pipette in 2-5µl of ligation mix into the competent cells. *The rest of the ligation mix can be stored in the freezer at -20°C*</li>
 +
<li>Incubate on ice for 30min.</li>
 +
<li>Incubate at 42°C for 60sec.</li>
 +
<li>Place on ice immediately for 5min.</li>
 +
<li>Add 200µl of LB Broth and mix gently.</li>
 +
<li>Incubate at 37°C for 2hrs.</li>
 +
<li>Warm up plates to room temperature, and label.</li>
 +
<li>Plate out 200µl and 20µl of transformed cells onto two separate plates, spreading the cells evenly onto the surface.</li>
 +
<li>Incubate cells at 37°C for 12-14hrs (overnight) or at room temp. for 24hrs.</li>
 +
<li>Plates with culture can be stored in fridge afterwards, and used for weeks.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 
</div>
 
</div>
  
−
<div id = 'footerTop'>
+
<div id="lab8" class="panel"> <h1>Lab Protocol: Miniprep</h1> <p>
−
<div id="footerText">"We want to open a new door in the field of pathology. Our goal is to find the next big thing, in cancer treatments; a cure."</div>
+
<table class="tableClear" style="width:100%">
−
</div>
+
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>DNA Mini Kit(Preferred Kit: E.Z.N.A Plasmid DNA Mini Kit) </li>
 +
<li>Microipette + Tips</li>
 +
<li>1.5ml Centrifuge Tubes.</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Grab and label 3 microcentrifuge tubes.</li>
 +
<li> Pipette 1.5mL (use a P1000 set at 750ul twice) of the corresponding culture in a glass tube into the corresponding microcentrifuge tube (e.g. The plac in the glass tube goes to the plac in the microcentrifuge tube).</li>
 +
<li>Spin at max speed (151*100g) for 1 minute.</li>
 +
<li>Discard the supernatant .</li>
 +
<li>Repeat steps 2-4 to gain a bigger pellet 6 times.</li>
 +
<li>Add 250ul of Solution 1 to each of the microcentrifuge tubes (stored in the fridge) and resuspend the pellet. Remember to put Solution 1 back in the fridge.</li>
 +
<li>Add 250ul of Solution 2 to each of the microcentrifuge tubes and gently invert several times, and let it sit for 2 minutes.</li>
 +
<li>Add 350ul of Solution 3 to each of the microcentrifuge tubes and immediately invert. A white flocculent protein should form.</li>
 +
<li>Centrifuge the tubes at max speed for 10min.</li>
 +
<li>Grab HiBind DNA mini columns and label them accordingly.</li>
 +
<li>Transfer the supernatant and do not disturb the pellet of the microcentrifuge tubes to the top of the of the corresponding HiBind DNA mini columns (e.g. the supernatant of plac should be transferred to the HiBind DNA mini column labelled plac.)</li>
 +
<li>Centrifuge at max speed for 1min.</li>
 +
<li>Discard the filtrate in the collection tube and reuse the collection tube. Pipette 500ul of HBC buffer to the top of the DNA HiBind mini column.</li>
 +
<li>Centrifuge at max speed for 1min.</li>
 +
<li>Discard the filtrate in the collection tube and reuse the collection tube. Pipette 700ul of DNA wash buffer to the top of the DNA HiBind mini column.</li>
 +
<li>Centrifuge at max speed for 1min. Discard the filtrate in the collection tube and reuse the collection tube.</li>
 +
<li>Centrifuge at max speed for 2min to dry the column.</li>
 +
<li>Label 3 microcentrifuge tubes accordingly.</li>
 +
<li>Transfer the top of the DNA HiBind mini column to the corresponding microcentrifuge tube (e.g. the plac DNA HiBind mini-column would be transferred to the “plac DNA date plasmid” microcentrifuge tube).</li>
 +
<li>Add 30ul of elution buffer to the DNA HiBind mini column. Ensure the elution buffer lands on the middle of the the DNA filter.</li>
 +
<li>Centrifuge at max speed for 1min.</li>
 +
<li>The DNA is now in the microcentrifuge tube. Store in the freezer.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 
</div>
 
</div>
  
−
<!-- bottom footer and connect with us!
+
<div id="lab9" class="panel"> <h1>Lab Protocol 8: Making 10X TAE Buffer</h1> <p>  
−
<div id='footerBottom'>
+
To prepare 10x TAE Buffer you must first prepare a solution of 0.5M EDTA (pH 8.0).
−
<div id="socialParent">
+
 
−
    <div id = 'socialText'>Connect with us!</div>
+
<table class="tableClear" style="width:100%">
−
       
+
  <tr>
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLink">
+
    <th>Materials: </th>
−
        <img src="twitter.png" style="width:64;height:64;" >  
+
    <th>Procedure: </th>
−
        </a>
+
  </tr>
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLink">
+
  <tr>
−
        <img src="you-tube.png" style="width:64;height:64;">  
+
    <td style="vertical-align:top; width:30%;">
−
         </a>
+
         <ol class="materialList">
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLink">
+
<li>EDTA Di-Sodium Salt</li>
−
        <img src="flickr.png" style="width:64;height:64;" >  
+
<li>Distilled Water</li>
−
        </a></br>
+
<li>NaOH sodium hydroxide (solid or concentrate)</li>
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLinkOne">
+
<li>Tris Base</li>
−
        <img src="google.png" style="width:64;height:64;">  
+
<li>Glacial Acetic Acid</li>
−
        </a>
+
<li>Weigh-boats</li>
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLinkOne">
+
<li>Scale</li>
−
        <img src="tumblr.png" style="width:64;height:64;">  
+
<li>Beakers</li>
−
        </a>
+
<li> Graduated Cylinders</li>
−
        <a href="http://www.twitter.com/vladimirtaikov" id="socialLinkOne">
+
<li>Stir Rod or Magnetic Stirrer</li>
−
        <img src="facebook.png" style="width:64;height:64;">  
+
<li>pH Meter or Paper</li>
−
        </a>
+
<li>Clean Bottles</li>
−
</div>
+
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Weigh out 93.05g EDTA di-sodium salt.</li>
 +
<li>Add the EDTA to a beaker containing 400ml of distilled water.</li>
 +
<li>Mix with stir-rod, or magnetic stirrer.</li>
 +
<li>Adjust the pH of the solution to 8.0 by adding NaOH. EDTA will completely dissolve at a pH of 8.</li>
 +
<li> Add distilled water to total 500ml and mix. </li>
 +
<li>Pour into a clean bottle and label “0.5M EDTA pH8”.</li>
 +
<li>Weigh out 48.5g Tris Base and add to a beaker containing 800ml of distilled water.</li>
 +
<li>Mix to dissolve. </li>
 +
<li>Measure out 11.4ml of glacial acetic acid and add it to the Tris solution.</li>
 +
<li>Measure out  20ml 0.5M EDTA (pH 8) and add to the Tris solution. </li>
 +
<li>Add distilled water to a total volume of 1L.</li>
 +
<li>Stir to mix.</li>
 +
<li>Pour into a clean bottle for long term storage, label “10x TAE”.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 
</div>
 
</div>
 +
 +
<div id="lab10" class="panel"> <h1>Lab Protocol: Agarose Gel Electrophoresis</h1> <p>
 +
<table class="tableClear" style="width:100%">
 +
  <tr>
 +
    <th>Materials: </th>
 +
    <th>Procedure: </th>
 +
  </tr>
 +
  <tr>
 +
    <td style="vertical-align:top; width:30%;">
 +
        <ol class="materialList">
 +
<li>10x TAE Buffer</li>
 +
<li>Distilled Water</li>
 +
<li>Agarose</li>
 +
<li>Syber Safe (DNA Stain)</li>
 +
<li>DNA Loading Buffer 6x</li>
 +
<li>DNA Restriction Digest</li>
 +
<li>DNA Ladder (Prefered = Invitrogen E-GEL 1 Kb Plus)</li>
 +
<li>Agarose Gel Electrophoresis Apparatus (Tank, Gel Tray, Comb, Power Supply, Etc.)</li>
 +
<li>Graduated Cylinder</li>
 +
<li>Stir Rod</li>
 +
<li>Erlenmeyer Flask</li>
 +
<li>Micropipettes + Tips</li>
 +
<li>Scale</li>
 +
<li>Microwave</li>
 +
<li>Tape</li>
 +
        </ol>
 +
    </td>
 +
    <td width="70%">
 +
      <ol class="procedureList">
 +
<li>Prepare 100ml 1x TAE Buffer by adding 10ml 10x TAE Buffer to a cylinder containing 90ml distilled water. </li>
 +
<li>Mix well with a clean stir rod.</li>
 +
<li>Pour the 100ml of 1x TAE into a beaker or flask, allotting space for bubbles, so it does not bubble over.</li>
 +
<li>Weigh out 1g of agarose poweder and add to the 100ml of 1x TAE.</li>
 +
<li>Place the beaker/flask into the microwave and set the time to 60sec carefully watching for it to start bubbling. Once bubbling open, take out of microwave, stir, place into microwave, and repeat until solids are completely dissolved.</li>
 +
<li>Cool gel until warm to touch.</li>
 +
<li>Assemble gel cassette by taping off ends, and inserting comb (thin side).</li>
 +
<li>Pour the agarose solution carefully, and slowly, into the gel cassette, to avoid air bubbles.</li>
 +
<li>Let gel cassette cool at room temperature for 30min.</li>
 +
<li>Wrap into ceran-wrap and move into 4°C fridge and let cool for 30min, it may sit in fridge for up to 3hrs prior to use.</li>
 +
<li>While waiting for gel to solidify, prepare the DNA samples by mixing the following into microcentrifuge tubes.</li>
 +
<ol class="materialList">
 +
<li>2µl 6x Loading Buffer</li>
 +
<li>4µl DNA Restriction Digest</li>
 +
<li>6µl Distilled Water</li>
 +
</ol>
 +
<li>Very carefully pull off tape and remove comb.</li>
 +
<li>Place cassette into tray making sure wells are on the negative end.</li>
 +
<li>Fill the tank with 1x TAE Buffer covering the gel with 3-5mm of TAE. If air bubbles are trapped inside wells, carefully remove them with a pipette.</li>
 +
<li>Load DNA samples into wells, starting with the ladder, on both end wells.</li>
 +
<li>Place cover over the gel box, making sure the attached wires are black on black, and red on red.</li>
 +
<li>Turn on gel box, at the 15V setting, and run for 30mins.</li>
 +
<li>After 30mins have surpassed switch to the 75V setting and run for 40mins.</li>
 +
<li>At the 40min mark, switch off, remove gel and place into solution of 10ul Cybersafe and 50ml 10x TAE.</li>
 +
<li>Stir, and move gel around in solution.</li>
 +
<li>Place on gel reader, and view outcomes. </li>
 +
<li>If colour is faint repeat soaking in CyberSafe solution, until desired color is availble.</li>
 +
      </ol>
 +
    </td>
 +
  </tr>
 +
</table>
 +
</p>
 
</div>
 
</div>
−
-->
 
  
−
</body>
+
<div id="safety1" class="panel"> <h1>Safety </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
 
 +
</p></div>
 +
 +
  <div id="ethics1" class="panel"> <h1>Ethics </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
</p></div>
 +
  <div id="logbook1" class="panel"> <h1>logbook </h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.
 +
 
 +
</p></div>
 +
 
 +
<div id="policy1" class="panel">
 +
      <h1> Outreach </h1>
 +
          <a class="o_Mega" id="inspirationStage" style="top:30px; left:10px;"><span>This is filler text for the inspiration stage! Please ignore this!</span></a>
 +
      </div>
 +
 
 +
 +
        </div>
 +
         
 +
      <div id="footerBar">
 +
            <div id="back"><a href="#" data-target="back">Back</div></a>
 +
            <div id="next"><a href="#" data-target="next">Next</div></a>
 +
            <div id="navBar">
 +
                    <ul id="home" class="disableFooter">
 +
<li class="footerButton activePage" id="fho1"><a data-target="home1" data-group="#home">Home</a></li>
 +
                </ul>
 +
                   
 +
    <ul id="team" class="disableFooter">
 +
<li class="footerButton" id="fte1"><a data-target="team1" data-group="#team">The Team</a></li>
 +
                        <li class="footerButton" id="fte2"><a data-target="team2" data-group="#team">Associates</a></li>
 +
                </ul>
 +
                   
 +
<ul id="project" class="disableFooter">
 +
<li class="footerButton" id="fpr1"><a href="#" data-target="project1" data-group="#project">Project1</a></li>
 +
                        <li class="footerButton" id="fpr2"><a href="#" data-target="project2" data-group="#project">Project2</a></li>
 +
                        <li class="footerButton" id="fpr3"><a href="#" data-target="project3" data-group="#project">Project3</a></li>
 +
                      <li class="footerButton" id="fpr4"><a href="#" data-target="project4" data-group="#project">Project4</a></li>
 +
                      <li class="footerButton" id="fpr5"><a href="#" data-target="project5" data-group="#project">Project5</a></li>
 +
                      <li class="footerButton" id="fpr6"><a href="#" data-target="project6" data-group="#project">Project6</a></li>
 +
                        <li class="footerButton" id="fpr7"><a href="#" data-target="project7" data-group="#project">Project7</a></li>
 +
                </ul>
 +
 
 +
<ul id="lab" class="disableFooter">
 +
<li class="footerButton" id="flb1"><a href="#" data-target="lab1" data-group="#lab">Protocol1</a></li>
 +
                        <li class="footerButton" id="flb2"><a href="#" data-target="lab2" data-group="#lab">Protocol1.5</a></li>
 +
                        <li class="footerButton" id="flb3"><a href="#" data-target="lab3" data-group="#lab">Protocol2</a></li>
 +
                      <li class="footerButton" id="flb4"><a href="#" data-target="lab4" data-group="#lab">Protocol3</a></li>
 +
                      <li class="footerButton" id="flb5"><a href="#" data-target="lab5" data-group="#lab">Protocol4</a></li>
 +
                      <li class="footerButton" id="flb6"><a href="#" data-target="lab6" data-group="#lab">Protocol5</a></li>
 +
                        <li class="footerButton" id="flb7"><a href="#" data-target="lab7" data-group="#lab">Protocol6</a></li>
 +
                        <li class="footerButton" id="flb8"><a href="#" data-target="lab8" data-group="#lab">Protocol7</a></li>
 +
                        <li class="footerButton" id="flb9"><a href="#" data-target="lab9" data-group="#lab">Protocol8</a></li>
 +
                        <li class="footerButton" id="flb10"><a href="#" data-target="lab10" data-group="#lab">Protocol9</a></li>
 +
                </ul>
 +
 
 +
</div>
 +
        </div>
 +
       
 +
       
 +
        <div id="canvas"></div>
 +
       
 +
       
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/js/jquery?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/js/mousewheel?action=raw&ctype=text/javascript"></script>     
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/js/teampagejs?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/three?action=raw&ctype=text/javascript"></script>
 +
<!--        <script src="https://2015.igem.org/Team:Central_Calgary/js/CanvasRenderer?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/js/Projector?action=raw&ctype=text/javascript"></script> -->
 +
 
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/EffectComposer?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/RenderPass?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/MaskPass?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2015.igem.org/Team:Central_Calgary/postprocessing/ShaderPass?action=raw&ctype=text/javascript"></script>
 +
     
 +
      <script src="https://2015.igem.org/Team:Central_Calgary/shaders/CopyShader?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/shaders/HorizontalBlurShader?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2015.igem.org/Team:Central_Calgary/shaders/RGBShiftShader?action=raw&ctype=text/javascript"></script>
 +
 
 +
        <script>
 +
var panels = new Array("#home1","#team1","#team2","#project1","#project2","#project3","#project4","#project5","#project6","#project7","#lab1","#lab2","#lab3","#lab4","#lab5","#lab6","#lab7","#lab8","#lab9","#lab10","#safety1","#ethics1","#logbook1","#policy1");
 +
var panelButtons = new Array("#fho1","#fte1","#fte2","#fpr1","#fpr2","#fpr3","#fpr4","#fpr5","#fpr6","#fpr7","#flb1","#flb2","#flb3","#flb4","#flb5","#flb6","#flb7","#flb8","#flb9","#flb10");
 +
 
 +
var buttons = new Array("#bHome","#bTeam","#bProject","#bLab","#bSafety","#bEthics","#bLogbook","#bPolicy","#bPractices");
 +
var footerMenus = new Array("#home", "#team","#project","#lab");
 +
var prevMenu = 0, activeMenu = 0;
 +
var currentPanel = 0;
 +
 
 +
function update() {
 +
 +
prevMenu = activeMenu;
 +
 +
for(var i = 0; i <= buttons.length; i++)
 +
{
 +
$(buttons[i]).attr("class","menuItem");
 +
 +
}
 +
 +
if(currentPanel === 0) {
 +
$("#bHome").attr("class","currentLink");
 +
$("#home").addClass("activeFooter");
 +
activeMenu = 0;
 +
 +
} else if(currentPanel === 1 || currentPanel === 2) {
 +
$("#bTeam").attr("class","currentLink");
 +
$("#team").addClass("activeFooter");
 +
activeMenu = 1;
 +
 +
} else if(currentPanel <= 9) {
 +
$("#bProject").attr("class","currentLink");
 +
$("#project").addClass("activeFooter");
 +
activeMenu = 2;
 +
 +
} else if(currentPanel <= 19) {
 +
$("#bLab").attr("class","currentLink");
 +
                                        $("#lab").addClass("activeFooter");
 +
activeMenu = 3;
 +
} else if(currentPanel === 11) {
 +
$("#bSafety").attr("class","currentLink");
 +
} else if(currentPanel === 12) {
 +
$("#bEthics").attr("class","currentLink");
 +
} else if(currentPanel === 13) {
 +
$("#bLogbook").attr("class","currentLink");
 +
} else if(currentPanel === 14) {
 +
$("#bPolicy").attr("class","currentLink");
 +
} else if(currentPanel === 15) {
 +
$("#bPractices").attr("class","currentLink");
 +
}
 +
 +
 +
for(var i = 0; i < panelButtons.length; i++)
 +
{
 +
$(panelButtons[i]).removeClass('activePage');
 +
}
 +
 +
$(panelButtons[currentPanel]).addClass('activePage');
 +
 
 +
 +
for(var i = 0; i<footerMenus.length; i++)
 +
{
 +
if(i === activeMenu)
 +
{
 +
if(prevMenu != activeMenu)
 +
{
 +
$(footerMenus[i]).fadeIn("fast","linear");
 +
}
 +
}
 +
else
 +
{
 +
$(footerMenus[i]).fadeOut("fast","linear");
 +
$(footerMenus[i]).addClass("disableFooter").removeClass("activeFooter");
 +
}
 +
}
 +
 +
 +
if(currentPanel===1)
 +
{
 +
$("#contentBg").fadeOut(0);
 +
$("#contentBg").css("background","url(img/teamPhoto.png)");
 +
$("#contentBg").stop().fadeIn(500);
 +
}
 +
else
 +
{
 +
$("#contentBg").stop().fadeOut(500);
 +
}
 +
 +
 +
 +
 +
}
 +
 +
 +
window.addEventListener("keydown", function(e) {
 +
  if([32, 37, 38, 39, 40].indexOf(e.keyCode) > -1) {
 +
      e.preventDefault();
 +
  }
 +
}, false);
 +
 +
(function($) {
 +
$('#header a').on('click', function(e) {
 +
e.preventDefault();
 +
var target = '#'+$(this).data('target');
 +
var left = $(target).position().left;
 +
 +
if(panels[currentPanel] != target)
 +
{
 +
for(var i = 0; i < panels.length; i++)
 +
{
 +
 +
if(panels[i] === target)
 +
{
 +
currentPanel=i;
 +
break;
 +
}
 +
}
 +
update();
 +
 +
$('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 1000);
 +
}
 +
});
 +
 +
$('#footerBar a').on('click', function(e) {
 +
e.preventDefault();
 +
 +
var target = '#'+$(this).data('target');
 +
 +
if(target == "#next")
 +
{
 +
if(currentPanel + 1 < panels.length)
 +
{
 +
currentPanel++;
 +
var left = $(panels[currentPanel]).position().left;
 +
update();
 +
$('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
 +
 +
 
 +
}
 +
} else if(target == "#back") {
 +
if(currentPanel - 1 >= 0)
 +
{
 +
currentPanel--;
 +
var left = $(panels[currentPanel]).position().left;
 +
update();
 +
$('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
 +
 +
 
 +
}
 +
} else {
 +
var left = $(target).position().left;
 +
 +
if($(this).data('group') == footerMenus[activeMenu])
 +
{
 +
if(panels[currentPanel] != target)
 +
{
 +
for(var i = 0; i < panels.length; i++)
 +
{
 +
if(panels[i] === target)
 +
{
 +
currentPanel=i;
 +
break;
 +
}
 +
}
 +
update();
 +
$('html, body').stop().animate({scrollLeft:left, scrollTop:"0px"}, 1000);
 +
}
 +
}
 +
}
 +
 +
 +
 +
});
 +
 +
/*$("body").mousewheel(function(event,delta) {
 +
 +
 +
event.preventDefault();
 +
 +
 +
if(currentPanel-delta < panels.length)
 +
{
 +
if(currentPanel-delta>=0)
 +
{
 +
currentPanel-=delta;
 +
var left = $(panels[currentPanel]).position().left;
 +
 +
$("html,body").stop().animate({scrollLeft:left, scrollTop:"0px"}, 500);
 +
event.preventDefault();
 +
}
 +
}
 +
update();
 +
 +
});*/
 +
 +
update();
 +
 +
 +
}(jQuery));
 +
 +
var camera, scene, renderer, mesh, loader, material,texture,composer;
 +
var container;
 +
var sFinal;
 +
var json;
 +
 +
$.ajaxSetup({ async: false });
 +
 +
sFinal = $.ajax({
 +
                url: "https://static.igem.org/mediawiki/2015/c/ce/Dna.txt",
 +
        }).responseText;
 +
 +
json = JSON.parse(sFinal);
 +
 +
container = document.getElementById('canvas');
 +
document.body.appendChild(container);
 +
 +
renderer = new THREE.WebGLRenderer();
 +
renderer.setSize(1920,1080);
 +
renderer.setClearColor( 0x90D8F0,0);
 +
container.appendChild(renderer.domElement);
 +
 +
scene = new THREE.Scene();
 +
var ambientLight = new THREE.AmbientLight(0x404040);
 +
scene.add(ambientLight);
 +
 +
var directionalLight = new THREE.DirectionalLight(0xFFFFFF,1);
 +
var directionalLight2 = new THREE.DirectionalLight(0xFFFFFF,1);
 +
directionalLight.position.set(10, 1, 3);
 +
directionalLight2.position.set(0, 3, 10);
 +
scene.add(directionalLight);
 +
scene.add(directionalLight2);
 +
 +
camera = new THREE.PerspectiveCamera( 75, 1920 / 1080, 1, 10000 );
 +
camera.position.x = 10;
 +
camera.position.y = 0;
 +
camera.position.z = 25;
 +
 +
composer = new THREE.EffectComposer( renderer );
 +
composer.addPass(new THREE.RenderPass(scene,camera));
 +
 +
var RGBShift = new THREE.ShaderPass(THREE.RGBShiftShader);
 +
RGBShift.uniforms[ 'amount' ].value = 0.0;
 +
composer.addPass (RGBShift);
 +
 +
var effect = new THREE.ShaderPass( THREE.HorizontalBlurShader );
 +
effect.renderToScreen = true;
 +
composer.addPass( effect );
 +
 +
// LOAD AND CREATE STRAND
 +
loader = new THREE.JSONLoader();
 +
 +
var strand = loader.parse(json, null);
 +
material = new THREE.MeshLambertMaterial( {color: 0x63D8FF });
 +
mesh = new THREE.Mesh( strand.geometry, material );
 +
mesh.rotation.y +=Math.PI / 2 + 0.3;
 +
mesh.rotation.x +=Math.PI / 6;
 +
mesh.position.x = 0;
 +
mesh.position.z = 3;
 +
mesh.position.y = 0;
 +
scene.add( mesh );
 +
 
 +
 +
var imgTexture = THREE.ImageUtils.loadTexture( "https://static.igem.org/mediawiki/2015/d/d7/Background0.jpg" );
 +
var imgMaterial = new THREE.MeshBasicMaterial( {
 +
map : imgTexture
 +
} );
 +
var geometry = new THREE.PlaneBufferGeometry(1920*2, 1080*2,1,1);
 +
var plane = new THREE.Mesh(geometry, imgMaterial);
 +
scene.add(plane);
 +
plane.position.x = 0;
 +
plane.position.y = 0;
 +
plane.position.z = -1000;
 +
 +
 +
window.addEventListener('resize', function() {
 +
  var WIDTH = window.innerWidth,
 +
  HEIGHT = window.innerHeight;
 +
  renderer.setSize(WIDTH, HEIGHT);
 +
  camera.aspect = WIDTH / HEIGHT;
 +
  camera.updateProjectionMatrix();
 +
});
 +
 
 +
function render() {
 +
 
 +
  mesh.rotation.z -= 0.001;
 +
   
 +
    composer.render();
 +
 
 +
}
 +
 
 +
(function animate() {
 +
 
 +
  requestAnimationFrame( animate );
 +
 
 +
    render();
 +
 
 +
})();
 +
 
 +
$(document).ready(function() {
 +
setTimeout(function(){
 +
$('body').addClass('loaded');
 +
}, 3000);
 +
});
 +
</script>
 +
</body>
 
</html>
 
</html>

Latest revision as of 21:10, 13 September 2015

Central Memorial iGEM

This website supports IE 11+, Microsoft Edge, Firefox 40+, Google Chrome 45+, Safari 8+, Opera 31+, iOS 8.4+, and Android Chrome.
The wiki will not load if you are not using a supported browser.

Home Page

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

Team Page Main

Portrait

Jared

Jared was once a no life, that is, until he joined IGEM -- of which then, he became a no life that does science. If he isn't in the lab, then in all likelihood, he would be attempting to learn idioms, reading papers, doing math, memorizing the quadratic formula, and eating cake.

Portrait

Jessica

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem. Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer.

Portrait

Francis

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem. Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer.

Portrait

Natalie

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem. Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer.

Portrait

Danielle

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem. Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer.

Portrait

Alexia

Alexia Gendron is a simple 12th grader who spends her spare time perfecting recipes and playing piano. She enjoys reading, volunteering, good soup, Italian, and having insightful conversations. Although born in Calgary, Alberta, she was brought up in French, and attended a francophone school until her 10th grade. This has given her exposure to French-Canadian culture and taught her where to find it even if she finds herself a few provinces away from its origin. For five years she took karate and developed quite a fondness for martial arts. Despite having had to stop karate this year, she plans on starting to practice judo as soon as possible. After discovering Ronda Rousey, she found the very first person ever to move her so strongly, and she considers Rousey to be an inspiration. Right now, Alexia is focusing on the present, and is trying to enjoy her final year of high school before she graduates. Although she plans on attending university next year, she has yet to figure out exactly what she wants to study. She has always loved to learn all there is to learn and do all there is to do; she hopes to travel the world someday, meet fantastical people, and have a great collection of jaw-dropping stories to tell.

Portrait

Zenab

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vestibulum magna eget nulla blandit, at faucibus enim fermentum. Sed malesuada, metus in lobortis rhoncus, nisi orci tempus leo, in finibus justo ligula ac lectus. Sed eu pharetra est. Vestibulum tincidunt nisl ex, placerat placerat dui sagittis at. Suspendisse vel neque non quam porttitor pharetra. Vivamus ac mauris id enim auctor bibendum. Vestibulum vel augue in risus faucibus luctus at ac libero. Sed et faucibus orci, sit amet tincidunt lacus. Pellentesque mattis quis lacus at fringilla. Curabitur ipsum nibh, fermentum at metus et, venenatis ullamcorper lorem. Pellentesque congue sit amet enim eu bibendum. Pellentesque tincidunt consequat magna. Ut eleifend arcu vel massa laoreet, at rutrum lacus dictum. Sed ut lorem ornare, sodales sem quis, imperdiet risus. Integer vitae eros vel dui dapibus gravida nec vel dui. Fusce at nisl interdum, dictum nisi sit amet, aliquam elit. Maecenas efficitur purus nunc, faucibus feugiat nulla vulputate et. Quisque a porttitor velit, nec dictum neque. Integer pretium egestas arcu, nec tempus ligula pharetra fermentum. Nam dapibus leo nec dui iaculis hendrerit. Sed in enim egestas, placerat felis vitae, luctus diam. Praesent non lobortis diam. Mauris pretium maximus enim, et ullamcorper eros suscipit sed. Integer.

Portrait

Vlad

Vladimir has been living in Calgary since day one. Growing up, he has experienced and explored everything from the bike paths in Fish Creek to the top of the Bow. At the age of eight, Vladimir developed a passion of photography and film­making, and carries it with him to this day. If he is not capturing photos, or studying, you can most likely find him zipping around from city to city on his bike. His passion for iGEM developed within the first weeks of grade ten, and carries into many aspects of his life. From lab work to media, Vladimir does it all.

Associates

Thank you for you generous sponsorshipAlberta Innovates

For giving us an opportunity and something worth my spare timeCentral Memorial Highschool

Special Thanks to: David Lloyd, our mentor

Iain George our other mentor

Ms.Wyshinski, who is not a biologist but kept us on track

Mr.Klemmer for his great support

The Project; The Dream 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

The Project; The Dream 7

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

Lab Protocol 1: Making LB Broth

This protocol is used to make LB Broth. This like every protocol has been adapted from the Synthetic Biology Guidebook for iGEM High School. Important note for all protocols: Everything must be sterile, and kept as aseptic as possible, throughout all procedures.

Materials: Procedure:
  1. Tryptone
  2. Yeast Extract; Bacteriological
  3. NaCl (Molec Biol Grade)
  4. Distilled Water
  5. 1L Beaker
  6. Micropipette + Tips
  7. Parafilm
  1. Weigh out, and add the following into the 1L container.
    1. 5g Tryptone
    2. 2.5g Yeast Extract
    3. 5g NaCl

  2. Add 500ml of distilled water into the 1L container. The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.

  3. Mix by swirling. Some powder may not dissolve. Make sure that none gets stuck to the sides.

  4. Cover the top with aluminum foil. Ensure the foil is loose enough to allow pressure to escape in the autoclave.

  5. Place/stick a strip of autoclave tape on top.

  6. Autoclave at about 15psi for 20min.

  7. Remove from autoclave and cool.

  8. The autoclaved liquid is now to be stored at 4°C in a fridge.

Lab Protocol 1.5: Making LB Plates

This protocol is used to make LB Plates. Note how this protocol makes 500ml of LB Agar for 20-25 plates. It can be scaled up and down as required.

Materials: Procedure:
  1. Tryptone
  2. Yeast Extract; Bacteriological
  3. Agar; Bacteriological
  4. NaCl (Molec Biol Grade)
  5. Distilled Water
  6. Sterile Antibiotic Stock Solution - If needed
  7. Autoclave + Autoclave Tape
  8. Scale
  9. 1L Glass Bottle/Erlenmeyer Flask
  10. Sterile Petri Dishes
  11. Aluminium Foil
  12. Micropipette + Tips
  13. Parafilm
  1. Weigh out, and add the following into the 1L container.
    1. 5g Tryptone
    2. 2.5g Yeast Extract
    3. 5g NaCl
    4. 7.5g Agar
  2. Add 500ml of distilled water into the 1L container. *The glass container must remain half empty to prevent the liquid from boiling over in the autoclave.*
  3. Mix by swirling. *Some powder may not dissolve. Make sure that none gets stuck to the sides.*
  4. Cover the top with aluminum foil, loose enough so pressure can escape in the autoclave. Place/stick a strip of autoclave tape on top.
  5. Autoclave at about 15psi for 20min.
  6. Remove from autoclave and cool to 55°C.
  7. If you require antibiotic, swirl in a quantity of antibiotic in based upon the table below. The liquid must be cooled or else the hot liquid will degrade the antibiotic.
    Antibiotic Concentration of Prepared Stock Final Concentration in LB Agar Dillution Factor Volume Added to 500ml LB Agar
    Ampicillin 100mg/ml 100µg/ml 1:1000 500µl
    Kanamycin 50mg/ml 50µg/ml 1:1000 500µl
    Chloramphenicol 50mg/ml 25µg/ml 1:2000 250µl
  8. Label plates with date, plate number, and antibiotic used.
  9. Pour, or pipette, around 20ml LB Agar into each petri dish.This must be done aseptically. Pouring slowly, and steadily to avoid bubbles and lumps.
  10. Cover with lid, and place to cool/harden. This should take 30min - 1hr.
  11. Invert plates so agar is on top, to prevent from unnecessary moisture on the plates.
  12. Seal edges with parafilm, and store in 4°C fridge.

Lab Protocol 2: Using the DNA Plate - Rehydrating

Materials: Procedure:
  1. DNA Kit Plate
  2. Sterile Distilled Water
  3. Micropipette + Tips
  1. Locate well (double, triple check, location).
  2. Draw 10µl of distilled water into pipette.
  3. Puncture foil and release water into the well.
  4. Wait for 10-15 minutes for DNA to rehydrate.
  5. Store the re-hydrated in the freezer (-20°C), leave it on the plate, or transfer into a separate tube. *As little as 1µl can be used to for a successful transformation*

Lab Protocol 3: Making Competent Cells

Materials: Procedure:
  1. DH5alpha E. Coli Cells
  2. 50mM CaCl2 Solution (filter sterile)
  3. LB Broth
  4. Incubator and Shaker set at 37°C
  5. Ice
  6. 15ml Tubes
  7. Microcentrifuge
  8. Microcentrifuge Tubes
  9. Micropipettes + Tips
  10. Spectrophotometer (optional)
  1. Transfer 100µl overnight culture (E. Coli) into 10ml of LB Broth (inside 15ml tube).
  2. Grow at 37°C with shaking for at least 3 hours. Optimally until broth is cloudy,and has an OD600 (optical density) of 0.4-0.6.
  3. Transfer 500µl into microcentrifuge tubes, and spin down all four at 7000rpm for 2min.
  4. Discard supernatant, being very careful to not disturb the pellet.
  5. Resuspend the pellet in 500µl CaCl2 solution.
  6. Spin down again at 7000rpm for 2min and remove supernatant.
  7. Resuspend the pellet in 100µl of CaCl2 and place on ice. Cells are now ready for transformation.

Lab Protocol 4: Restriction Digestion

Materials: Procedure:
  1. Plasmid DNA
  2. 10x Restriction Buffer
  3. Restriction Enzymes (ExoRI, SpeI, XbaI, PsI)
  4. Sterile Distilled Water
  5. Thermocycler
  6. Water Bath set at 37°C
  7. Sterile Microcentrifuge Tubes
  8. Microcentrifuge
  9. Micropipette + Tips
  10. Ice
  1. Thaw all solutions and buffers, flick (homogenize). *Restriction enzymes DO NOT need thawing and should be kept on ice at all times*
  2. Label a sterile tube clearly for use with the restriction enzyme.
  3. Pipette the following into the microcentrifuge tube in the order listed.
    1. 10µl Plasmid DNA (500ng)
    2. 1µl Restriction Enzyme #1
    3. 1µl Restriction Enzyme #2
    4. 5µl 10x Restriction Buffer
    5. Up to 50µl sterile distilled water
  4. Mix gently by pipetting up and down. *You can briefly spin in the centrifuge to bring contents to the bottom*
  5. Incubate at 37°C in waterbath for 30min to an hour.
  6. Incubate (heat-shock) at 80°C for 20min.
  7. Store the restriction digest at 20°C or proceed immediately with ligation, or agarose gel electrophoresis.

Lab Protocol 5: Ligation

A few notes about the ligation: There should be a 3:1, insert DNA (the segment being added) to the vector DNA (the now linear plasmid backbone). Also, the amount of DNA in the ligation should be low, around 100ng.
The DNA concentration is assumed to be the same for both the insert and vector restriction digests, and it equals 25ng/µl, as set up by the previous protocol. Assuming the insert is about half the size of the vector, to get a molar ratio of 3 insert : 1 Vector, the volume ratio must 1.5 insert :1 vector.
Ligation buffers are usually 10 fold, (10x) more concentrated than needed. Therefore, they need to be diluted 10 times, i.e. 1µl in a total volume in 10µl.
*A general formula for determining the volume ratio of insert to vector.*
Vi / Vv = 3 x (Cv / Ci) x (Mi / Mv)
Vi = Volume Insert
Vv = Volume Vector
Cv = DNA conc. of vector restriction digest
Ci = DNA conc. of insert restriction digest
Mi = Molecular weight i.e. approximate size of insert
Mv = Molecular weight i.e. approximate size of vector

Materials: Procedure:
  1. nsert Restriction Digest Mix
  2. Vector Restriction Digest Mix
  3. 10x Ligation Buffer
  4. T4 DNA Ligase
  5. Sterile Distilled Water
  6. Thermocycler
  7. Sterile Microcentrifuge Tubes
  8. Micropipette + Tips
  9. Ice
  1. Thaw all solutions and buffers, flick (homogenize). *Ligation enzymes DO NOT need thawing and should be kept on ice at all times*
  2. Label a sterile tube clearly for use with the ligation enzyme.
  3. Pipette the following in order (adding up to a total volume of 10µl).
    1. 3µl Sterile Distilled Water
    2. 3µl Insert Restriction Digest
    3. 2µl Vector Restriction Digest
    4. 1µl 10x Ligation Buffer
  4. Pipette up and down to mix. Briefly centrifuge to collect all liquid at the the bottom of the tube.
  5. Incubate at room temperature for about an hour.
  6. Incubate at 80°C for 20 minutes, to denature the ligase (heat-shock).
  7. Store ligation mix at 20°C in a freezer, or proceed immediately with a transformation.

Lab Protocol 6: Transformation

Materials: Procedure:
  1. 100µl Aliquots of Competent Cells (Protocol 1).
  2. DNA Ligation Mix
  3. Control Plasmid DNA
  4. LB Broth
  5. LB Agar Plates (with desired antibiotic)
  6. Water bath at 42°C
  7. Incubator at 37°C
  8. Spreader
  9. Bunsen Burner
  10. Ice
  11. Micropipettes + Tips
  1. Obtain fresh, or frozen, competent cells. Thaw and keep on ice.
  2. Label the tube.
  3. Pipette in 2-5µl of ligation mix into the competent cells. *The rest of the ligation mix can be stored in the freezer at -20°C*
  4. Incubate on ice for 30min.
  5. Incubate at 42°C for 60sec.
  6. Place on ice immediately for 5min.
  7. Add 200µl of LB Broth and mix gently.
  8. Incubate at 37°C for 2hrs.
  9. Warm up plates to room temperature, and label.
  10. Plate out 200µl and 20µl of transformed cells onto two separate plates, spreading the cells evenly onto the surface.
  11. Incubate cells at 37°C for 12-14hrs (overnight) or at room temp. for 24hrs.
  12. Plates with culture can be stored in fridge afterwards, and used for weeks.

Lab Protocol: Miniprep

Materials: Procedure:
  1. DNA Mini Kit(Preferred Kit: E.Z.N.A Plasmid DNA Mini Kit)
  2. Microipette + Tips
  3. 1.5ml Centrifuge Tubes.
  1. Grab and label 3 microcentrifuge tubes.
  2. Pipette 1.5mL (use a P1000 set at 750ul twice) of the corresponding culture in a glass tube into the corresponding microcentrifuge tube (e.g. The plac in the glass tube goes to the plac in the microcentrifuge tube).
  3. Spin at max speed (151*100g) for 1 minute.
  4. Discard the supernatant .
  5. Repeat steps 2-4 to gain a bigger pellet 6 times.
  6. Add 250ul of Solution 1 to each of the microcentrifuge tubes (stored in the fridge) and resuspend the pellet. Remember to put Solution 1 back in the fridge.
  7. Add 250ul of Solution 2 to each of the microcentrifuge tubes and gently invert several times, and let it sit for 2 minutes.
  8. Add 350ul of Solution 3 to each of the microcentrifuge tubes and immediately invert. A white flocculent protein should form.
  9. Centrifuge the tubes at max speed for 10min.
  10. Grab HiBind DNA mini columns and label them accordingly.
  11. Transfer the supernatant and do not disturb the pellet of the microcentrifuge tubes to the top of the of the corresponding HiBind DNA mini columns (e.g. the supernatant of plac should be transferred to the HiBind DNA mini column labelled plac.)
  12. Centrifuge at max speed for 1min.
  13. Discard the filtrate in the collection tube and reuse the collection tube. Pipette 500ul of HBC buffer to the top of the DNA HiBind mini column.
  14. Centrifuge at max speed for 1min.
  15. Discard the filtrate in the collection tube and reuse the collection tube. Pipette 700ul of DNA wash buffer to the top of the DNA HiBind mini column.
  16. Centrifuge at max speed for 1min. Discard the filtrate in the collection tube and reuse the collection tube.
  17. Centrifuge at max speed for 2min to dry the column.
  18. Label 3 microcentrifuge tubes accordingly.
  19. Transfer the top of the DNA HiBind mini column to the corresponding microcentrifuge tube (e.g. the plac DNA HiBind mini-column would be transferred to the “plac DNA date plasmid” microcentrifuge tube).
  20. Add 30ul of elution buffer to the DNA HiBind mini column. Ensure the elution buffer lands on the middle of the the DNA filter.
  21. Centrifuge at max speed for 1min.
  22. The DNA is now in the microcentrifuge tube. Store in the freezer.

Lab Protocol 8: Making 10X TAE Buffer

To prepare 10x TAE Buffer you must first prepare a solution of 0.5M EDTA (pH 8.0).

Materials: Procedure:
  1. EDTA Di-Sodium Salt
  2. Distilled Water
  3. NaOH sodium hydroxide (solid or concentrate)
  4. Tris Base
  5. Glacial Acetic Acid
  6. Weigh-boats
  7. Scale
  8. Beakers
  9. Graduated Cylinders
  10. Stir Rod or Magnetic Stirrer
  11. pH Meter or Paper
  12. Clean Bottles
  1. Weigh out 93.05g EDTA di-sodium salt.
  2. Add the EDTA to a beaker containing 400ml of distilled water.
  3. Mix with stir-rod, or magnetic stirrer.
  4. Adjust the pH of the solution to 8.0 by adding NaOH. EDTA will completely dissolve at a pH of 8.
  5. Add distilled water to total 500ml and mix.
  6. Pour into a clean bottle and label “0.5M EDTA pH8”.
  7. Weigh out 48.5g Tris Base and add to a beaker containing 800ml of distilled water.
  8. Mix to dissolve.
  9. Measure out 11.4ml of glacial acetic acid and add it to the Tris solution.
  10. Measure out 20ml 0.5M EDTA (pH 8) and add to the Tris solution.
  11. Add distilled water to a total volume of 1L.
  12. Stir to mix.
  13. Pour into a clean bottle for long term storage, label “10x TAE”.

Lab Protocol: Agarose Gel Electrophoresis

Materials: Procedure:
  1. 10x TAE Buffer
  2. Distilled Water
  3. Agarose
  4. Syber Safe (DNA Stain)
  5. DNA Loading Buffer 6x
  6. DNA Restriction Digest
  7. DNA Ladder (Prefered = Invitrogen E-GEL 1 Kb Plus)
  8. Agarose Gel Electrophoresis Apparatus (Tank, Gel Tray, Comb, Power Supply, Etc.)
  9. Graduated Cylinder
  10. Stir Rod
  11. Erlenmeyer Flask
  12. Micropipettes + Tips
  13. Scale
  14. Microwave
  15. Tape
  1. Prepare 100ml 1x TAE Buffer by adding 10ml 10x TAE Buffer to a cylinder containing 90ml distilled water.
  2. Mix well with a clean stir rod.
  3. Pour the 100ml of 1x TAE into a beaker or flask, allotting space for bubbles, so it does not bubble over.
  4. Weigh out 1g of agarose poweder and add to the 100ml of 1x TAE.
  5. Place the beaker/flask into the microwave and set the time to 60sec carefully watching for it to start bubbling. Once bubbling open, take out of microwave, stir, place into microwave, and repeat until solids are completely dissolved.
  6. Cool gel until warm to touch.
  7. Assemble gel cassette by taping off ends, and inserting comb (thin side).
  8. Pour the agarose solution carefully, and slowly, into the gel cassette, to avoid air bubbles.
  9. Let gel cassette cool at room temperature for 30min.
  10. Wrap into ceran-wrap and move into 4°C fridge and let cool for 30min, it may sit in fridge for up to 3hrs prior to use.
  11. While waiting for gel to solidify, prepare the DNA samples by mixing the following into microcentrifuge tubes.
    1. 2µl 6x Loading Buffer
    2. 4µl DNA Restriction Digest
    3. 6µl Distilled Water
  12. Very carefully pull off tape and remove comb.
  13. Place cassette into tray making sure wells are on the negative end.
  14. Fill the tank with 1x TAE Buffer covering the gel with 3-5mm of TAE. If air bubbles are trapped inside wells, carefully remove them with a pipette.
  15. Load DNA samples into wells, starting with the ladder, on both end wells.
  16. Place cover over the gel box, making sure the attached wires are black on black, and red on red.
  17. Turn on gel box, at the 15V setting, and run for 30mins.
  18. After 30mins have surpassed switch to the 75V setting and run for 40mins.
  19. At the 40min mark, switch off, remove gel and place into solution of 10ul Cybersafe and 50ml 10x TAE.
  20. Stir, and move gel around in solution.
  21. Place on gel reader, and view outcomes.
  22. If colour is faint repeat soaking in CyberSafe solution, until desired color is availble.

Safety

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

Ethics

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.

logbook

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec lacinia, mauris vel porta pellentesque, lectus mi aliquam erat, ut ultricies ex orci id massa. Cras ultrices lacinia libero sed porta. Pellentesque tempor vehicula leo, sit amet viverra dui posuere et. Vivamus gravida et felis ut interdum. Phasellus quis quam enim. Nullam suscipit viverra ex, sit amet bibendum massa scelerisque et. Nunc a lorem nisi. Integer ultricies metus sed mi pretium, vitae aliquet mi egestas. Duis gravida tellus quis sem scelerisque varius. Mauris erat lorem, congue sit amet erat eu, bibendum laoreet nisl. Morbi ac massa eu quam pulvinar lacinia lacinia et dui. Aliquam sed ex lobortis, lobortis tellus ut, pretium sem. Aenean id semper lacus. Sed sed mauris lobortis, tincidunt sapien vel, dictum ipsum. Nulla euismod dui at placerat pulvinar.