Difference between revisions of "Team:Technion Israel/Lab Notebook/Protocols"

 
(19 intermediate revisions by 3 users not shown)
Line 10: Line 10:
 
background-color: rgb(202, 174, 244);
 
background-color: rgb(202, 174, 244);
 
}
 
}
header{background-image: url("https://static.igem.org/mediawiki/2015/e/e3/Technion_Israel_2015_protocols_header.png"); background-size: 100%; background-repeat: no-repeat; width: 100%; height: 300px;}
+
header{background-image: url("https://static.igem.org/mediawiki/2015/2/28/Technion_Israel_2015_protocols.jpg"); background-size: 100%; background-repeat: no-repeat; width: 100%; height: 400px; margin-bottom: 0px;}
header h1{color: rgb(202,174,244); font-size: 70px;}
+
.title h1{ color: rgb(202, 174, 244); font-weight: bold; font-size: 100px; text-align: center; background: rgba(0, 0, 0, 0.8); font-family: sans-serif; font-style: Arial; height: 100px; text-shadow: black 6px 6px 6px; line-height: 80px;}
 +
#bodyContent h1{margin-bottom: 0em;}
 +
.mini-title{background-image: url("https://static.igem.org/mediawiki/2015/9/96/Technion_Israel_2015_dna.jpg"); background-size: 100%;  background-repeat: no-repeat; width: 100%; height: 200px; margin-bottom: 0px;}
 +
.content{padding: 20px; margin-top: 0px; font-size: 16px;}
 +
.mini-title2{background-image: url("https://static.igem.org/mediawiki/2015/b/b6/Technion_Israel_2015_proofof.jpg"); background-size: 100%;  background-repeat: no-repeat; width: 100%; height: 200px; margin-bottom: 0px;}
 +
  
#label{ font-style: bold; font-family: sans-serif; font-style: Arial; font-size: 50px; text-shadow:4px 4px purple; height: 300px; line-height: 80px; width: 100%; text-align: center; vertical-align: center;}
+
.doubleColumns{
+
   display:table;
.slides {height: 560px;
+
   border-spacing:12px;
width: 700px;
+
   min-height:200px;
float: left;
+
        padding: 20px;
+
margin: auto;}
+
 
+
.cloning_left{margin-left: 20px; float: left; width: 330px;}
+
.cloning_left h2{font-size: 16px;}
+
.cloning_left h3{font-size: 12px;}
+
+
.cloning_right{float: left; width: 340px;}
+
.cloning_right h2{font-size: 16px;}
+
.cloning_right h3{font-size: 12px;}
+
+
+
.sp-slideshow {
+
   position: relative;
+
   margin: 0px auto;
+
  width: 800px;
+
  max-width: 1000px;
+
   min-width: 260px;
+
  height: 560px;
+
  border: 10px solid #ddd;
+
  border: 10px solid rgba(255,255,255,0.9);
+
  box-shadow: 0 2px 6px rgba(0,0,0,0.4);
+
}
+
 
+
.sp-content {
+
  position: relative;
+
 
   width: 100%;
 
   width: 100%;
   height: 100%;
+
   margin: auto;
  overflow: hidden;
+
 
}
 
}
  
.sp-parallax-bg {
+
.doubleColumn{
  position: absolute;
+
   display:table-cell;
   top: 0;
+
   width:48%; padding-left: 150px;
  left: 0;
+
  background-size: cover;
+
   width: 100%;
+
  height: 100%;
+
  overflow: hidden;
+
 
}
 
}
  
.sp-slideshow input {
+
.DNA{display: block; width: 100%;}
  position: absolute;
+
.up_button img { width: 130px;}
  bottom: 15px;
+
  left: 50%;
+
  width: 9px;
+
  height: 9px;
+
  z-index: 1001;
+
  cursor: pointer;
+
  opacity: 0;
+
}
+
 
+
.sp-slideshow input + label {
+
  position: absolute;
+
  bottom: 15px;
+
  left: 50%;
+
  width: 6px;
+
  height: 6px;
+
  display: block;
+
  z-index: 1000;
+
  border: 3px solid white;
+
  border: 3px solid navy;
+
  border-radius: 50%;
+
  transition: background-color linear 0.1s;
+
}
+
 
+
.sp-slideshow input:checked + label {
+
  background-color: white;
+
  background-color: navy;
+
}
+
 
+
.sp-selector-1, .button-label-1 {
+
  margin-left: -36px;
+
}
+
 
+
.sp-selector-2, .button-label-2 {
+
  margin-left: -18px;
+
}
+
.sp-selector-3, .button-label-3 {
+
  margin-left: 0px;
+
}
+
 
+
 
+
.sp-arrow {
+
    position:absolute;
+
    top:50%;
+
    width:26px;
+
    height:33px;
+
    margin-top:-35px;
+
    display:none;
+
    opacity:0.8;
+
    cursor:pointer;
+
    z-index:1000;
+
    background: url(http://i.imgur.com/L6FjFzo.png) no-repeat;
+
    -webkit-transition:opacity linear 0.3s;
+
    -moz-transition:opacity linear 0.3s;
+
    -o-transition:opacity linear 0.3s;
+
    -ms-transition:opacity linear 0.3s;
+
    transition:opacity linear 0.3s; }
+
   
+
.sp-arrow:hover {
+
    opacity:1; }
+
 
+
.sp-arrow:active {
+
    margin-top:-35px; }
+
+
.sp-selector-1:checked ~ .sp-arrow.sp-a2,
+
.sp-selector-2:checked ~ .sp-arrow.sp-a3 {
+
  right: 15px;
+
  display: block;
+
  background-position: top right;
+
}
+
.sp-selector-2:checked ~ .sp-arrow.sp-a1,
+
.sp-selector-3:checked ~ .sp-arrow.sp-a2 {
+
  left: 15px;
+
  display: block;
+
  background-position: top left;
+
}
+
 
+
.sp-slideshow input:checked ~ .sp-content {
+
  transition: background-position linear 0.6s, background-color linear 0.8s;
+
}
+
 
+
.sp-slideshow input:checked ~ .sp-content .sp-parallax-bg {
+
  transition: background-position linear 0.7s;
+
}
+
 
+
input.sp-selector-1:checked ~ .sp-content {
+
  background-position: 0 0;
+
  background-color: white;
+
}
+
 
+
input.sp-selector-2:checked ~ .sp-content {
+
  background-position: 0 0;
+
  background-color: white;
+
}
+
 
+
input.sp-selector-3:checked ~ .sp-content {
+
  background-position: 0 0;
+
  background-color: white;
+
}
+
 
+
input.sp-selector-4:checked ~ .sp-content {
+
  background-position: 0 0;
+
  background-color: white;
+
}
+
 
+
 
+
input.sp-selector-1:checked ~ .sp-content .sp-parallax-bg {
+
    background-position: 0 0;
+
}
+
+
input.sp-selector-2:checked ~ .sp-content .sp-parallax-bg {
+
    background-position: 0 0;
+
}
+
+
input.sp-selector-3:checked ~ .sp-content .sp-parallax-bg {
+
    background-position: 0 0;
+
}
+
+
 
+
.sp-slider {
+
  position: relative;
+
  left: 0;
+
  width: 500%;
+
  height: 100%;
+
  list-style: none;
+
  margin: 0;
+
  padding: 0;
+
  transition: left ease-in 0.8s;
+
}
+
 
+
.sp-slider > li {
+
  color: purple;
+
  width: 20%;
+
  box-sizing: border-box;
+
  height: 100%;
+
  padding: 0 0px;
+
  float: left;
+
  opacity: 1;
+
  transition: opactiy ease-in 0.4s 0.8s;
+
}
+
 
+
.sp-slider > li a{
+
  color: purple;
+
font-size: 16px;}
+
.sp-slider > li img {
+
  box-sizing: border-box;
+
  display: block;
+
  margin: 0 auto;
+
  padding: 40px 0 50px 0;
+
  max-height: 100%;
+
  max-width: 100%;
+
}
+
 
+
input.sp-selector-1:checked ~ .sp-content .sp-slider {
+
    left: 0;
+
}
+
+
input.sp-selector-2:checked ~ .sp-content .sp-slider {
+
    left: -100%;
+
}
+
+
input.sp-selector-3:checked ~ .sp-content .sp-slider {
+
    left: -200%;
+
}
+
 
+
+
 
+
input.sp-selector-1:checked ~ .sp-content .sp-slider > li:first-child,
+
input.sp-selector-2:checked ~ .sp-content .sp-slider > li:nth-child(2),
+
input.sp-selector-3:checked ~ .sp-content .sp-slider > li:nth-child(3){
+
    opacity: 1;
+
}
+
 
+
 
+
  
 
</style>
 
</style>
<title>Team: Technion 2015</title>
+
<title>Team: Technion 2015</title>  
 
</head>
 
</head>
 
<body>
 
<body>
Line 243: Line 42:
 
<div class="nav_menu">
 
<div class="nav_menu">
  
<a href="https://2015.igem.org/Team:Technion_Israel">
+
<a href="https://2015.igem.org/Team:Technion_Israel" style="position:fixed; width: 170px; display:inline-block; text-decoration: none;" class="nav_home_link">
<img src="https://static.igem.org/mediawiki/2015/c/c1/Team_Technion_Navbar_Home.png" alt="Home" id="nav_home" /></a>
+
<img src="https://static.igem.org/mediawiki/2015/c/c1/Team_Technion_Navbar_Home.png" alt="Home" id="nav_home" /><div class="home_text">Home</div></a>
  
 
<div class="main_buttons">
 
<div class="main_buttons">
Line 255: Line 54:
 
<nav>
 
<nav>
 
<div id="Team_Links" class="main_links">
 
<div id="Team_Links" class="main_links">
<a href="https://2015.igem.org/Team:Technion_Israel/Team/About_Us">About&nbsp;Us</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Team/About_Us" id="Team_Links_About_Us">About&nbsp;Us</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Attributions">Attributions</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Attributions" id="Team_Links_Attributions">Attributions</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Team/Sponsors">Sponsors</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Team/Sponsors" id="Team_Links_Sponsors">Sponsors</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Team/gallery">Gallery</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Team/gallery" id="Team_Links_gallery">Gallery</a>
 
</div>
 
</div>
 
<div id="Judging_Criteria_Links" class="main_links">
 
<div id="Judging_Criteria_Links" class="main_links">
<a href="https://2015.igem.org/Team:Technion_Israel/Parts">Parts</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Parts" id="Judging_Criteria_Links_Parts">Parts</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Judging_Criteria/Achievements">Achievements</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Judging_Criteria/Achievements" id="Judging_Criteria_Links_Achievements">Achievements</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Collaborations">Collaborations</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Collaborations" id="Judging_Criteria_Links_Collaborations">Collaborations</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Design">Design</a>
+
 
</div>
 
</div>
 
<div id="Human_Practices_Links" class="main_links">
 
<div id="Human_Practices_Links" class="main_links">
Line 276: Line 74:
 
<div id="project_Links" class="main_links">
 
<div id="project_Links" class="main_links">
 
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Overview">Overview</a>
 
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Overview">Overview</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Bacillus">Bacillus</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Secretion">Secretion</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Project/E_Coli">E.Coli</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Expression">Expression</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Project/NADPH">NADPH</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Cofactor">Cofactor</a>
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Comb">Comb</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Design">Comb</a>
 
<a href="https://2015.igem.org/Team:Technion_Israel/Modeling">Modeling</a>
 
<a href="https://2015.igem.org/Team:Technion_Israel/Modeling">Modeling</a>
 +
<a href="https://2015.igem.org/Team:Technion_Israel/Project/Results">Results</a>
 
</div>
 
</div>
 
</nav>
 
</nav>
Line 286: Line 85:
 
<!-------------------------------------nav-bar-end------------------------------------------>
 
<!-------------------------------------nav-bar-end------------------------------------------>
  
<div class= "content">
+
<!-------------------------------------up-button-------------------------------------------->
<header>
+
<div class="up_button" style="text-decoration: none;">
<div id="label"><br><h1>Protocols</h1></div>
+
<a href="#" class="up_link" style="text-decoration: none;">
 +
    <div class="up_button_text" style="text-decoration: none;">UP</div>
 +
    <img src="https://static.igem.org/mediawiki/2015/7/7a/Technion_2015_Up_hippie.png" alt="Scroll to top" />
 +
</a>
 +
</div>
 +
<!-------------------------------------up-button-end---------------------------------------->
 +
<header>
 
</header>
 
</header>
<div class="container">
+
<div class="title">
 +
<h1><b>Protocols</b></h1>
 +
</div>
  
<div class="sp-slideshow">
+
<div class= "content">
 
+
<div class="DNA">
  <input type="radio" id="button-1" name="radio-set" class="sp-selector-1" checked="checked" />
+
<div class="mini-title">
  <label for="button-1" class="button-label-1"></label>
+
</div>
 
+
<hr></hr>
  <input type="radio" id="button-2" name="radio-set" class="sp-selector-2" />
+
<div class="doubleColumns">
  <label for="button-2" class="button-label-2"></label>
+
  <div class="doubleColumn">
    
+
    <a href="https://static.igem.org/mediawiki/2015/b/b8/Techion_Israel_2015_protocols_gelpreparation.pdf" target="_blank">Gel Preparation</a></br></br>
   <input type="radio" id="button-3" name="radio-set" class="sp-selector-3" />
+
<a href="https://static.igem.org/mediawiki/2015/b/ba/Technion_Israel_2015_protocols_miniprep.pdf" target="_blank">Sigma-Aldrich Miniprep</a></br></br>
  <label for="button-3" class="button-label-3"></label>
+
<a href="https://static.igem.org/mediawiki/2015/b/bb/Technion_iGEM_2015_Primer_dilution_protocol.pdf" target="_blank">Primer Dilution</a></br></br>
 +
<a href="https://static.igem.org/mediawiki/2015/c/cb/Technion_Israel_2015_protocols_CIP.pdf" target="_blank">CIP</a></br></br>
 +
<a href="https://static.igem.org/mediawiki/2015/2/26/Technion_Israel_2015_protocols_gibson.pdf" target="_blank">Gibson Assembly</a></br></br>
 +
<a href="https://static.igem.org/mediawiki/2015/2/23/Technion_Israel_2015_protocols_restriction.pdf" target="_blank">Restriction</a></br></br>
 +
<a href="https://static.igem.org/mediawiki/2015/1/1d/Technion_Israel_2015_protocols_UVviewing.pdf" target="_blank">UV Gel Viewing</a></br></br>
 +
 +
   </div>
 +
   <div class="doubleColumn">
 +
<a href="https://static.igem.org/mediawiki/2015/c/c0/Technion_Israel_2015_protocols_gelextraction.pdf" target="_blank">Gel Extraction</a></br></br>
 +
 
 +
<p>Transformation</br>
 +
<ol><li>
 +
<a href="https://static.igem.org/mediawiki/2015/9/91/Technion_Israel_2015_protocols_transformation.pdf" target="_blank"><i>E.coli</i></a>
 +
</li>
 +
<li>
 +
<a href="https://static.igem.org/mediawiki/2015/e/ef/Technion_iGEM_2015_B.Subtilis_Transformation.pdf" target="_blank"><i>B.subtilis</i></a></li>
 +
</ol></p>
  
+
<p>Colony PCR</br>
 
+
<ol><li><a href="https://static.igem.org/mediawiki/2015/7/7c/Technion_Israel_2015_protocols_colonyPCR.pdf" target="_blank"><i>E. coli</i></a></li>
  <label for="button-1" class="sp-arrow sp-a1"></label>
+
<li><a href="https://static.igem.org/mediawiki/2015/b/bf/Technion_Israel_2015_Colony_PCR_for_B.Subtilis_.pdf" target="_blank"><i>B. subtilis</i></a></li></ol></p>
  <label for="button-2" class="sp-arrow sp-a2"></label>
+
<a href="https://static.igem.org/mediawiki/2015/c/c8/Technion_Israel_2015_protocols_ligation.pdf" target="_blank">Ligation</a></br></br>
  <label for="button-3" class="sp-arrow sp-a3"></label>
+
<a href="https://static.igem.org/mediawiki/2015/a/ab/Technion_Israel_2015_protocols_nanoview.pdf" target="_blank">Nanodrop Use</a></br></br>
    
+
   </div>
 +
</div>
  
    <div class="sp-content">
 
    <div class="sp-parallax-bg"></div>
 
    <ul class="sp-slider clearfix">
 
<li>
 
<div class="slides">
 
<div class="four_columns">
 
<div id="pic_cloning">
 
<img src="https://static.igem.org/mediawiki/2015/4/47/DNA.png" alt="DNA and Cloning" width="900px" height="100px">
 
 
</div>
 
</div>
<div class="wrapper">
+
<div class="DNA">
<div class="cloning_left">
+
<div class="mini-title2">
<ul>
+
<li style="list-style-type: none;">
+
<h2>Gel Extraction</h2>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Sigma-Aldrich Miniprep</h2>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Phusion PCR</h2>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Electroporation</h2>
+
<ol>
+
<h3><i>E.coli</i></h3>
+
</ol>
+
<ol>
+
<a href="https://static.igem.org/mediawiki/2015/e/ef/Technion_iGEM_2015_B.Subtilis_Transformation.pdf"><h3><i>B.Subtilis</i></h3></a>
+
</ol>
+
</li>
+
</ul>
+
</div>
+
<div class="cloning_right">
+
<ul>
+
<li style="list-style-type: none;">
+
<h2>Transformation</h2>
+
<ol>
+
<h3><i>E.coli</i></h3>
+
</ol>
+
<ol>
+
<h3><i>B.Subtilis</i></h3>
+
</ol>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Colony PCR</h2>
+
<ol><a href="https://static.igem.org/mediawiki/2015/b/bf/Technion_Israel_2015_Colony_PCR_for_B.Subtilis_.pdf"><h3><i>B. Subtilis</i></h3></a>
+
</ol>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Preparing Competent <i>E.coli</i></h2>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>DNA Gel Electrophoresis</h2>
+
</li>
+
<li style="list-style-type: none;">
+
<h2>Preparation of DNA for Sequencing</h2>
+
</li>
+
</ul>
+
</div>
+
</div>
+
</div>
+
 
</div>
 
</div>
</li>
+
<hr></hr>
<li>
+
<div class="doubleColumns">
<div class="slides">
+
  <div class="doubleColumn">
<div class="four_columns">
+
<a href="https://static.igem.org/mediawiki/2015/e/e2/Technion_Israel_2015_protocols_B.subtilis-mCherry-secretion.pdf" target="_blank"><i>Bacillus</i> Secretion Verification</a>
<div id="pic_proof">
+
</br></br><a href="https://static.igem.org/mediawiki/2015/7/7e/Technion_Israel_2015_protocols_3aHSDactivity.pdf" target="_blank">3ɑ-HSD Activity Verification Protocol</a>
<img style="border-top: 5px solid black; border-bottom: 5px solid black" src="https://static.igem.org/mediawiki/2015/6/66/Technion_Israel_2015_Protocols_Proof.jpg" alt="Proof of Concept" width="800px" height="100px">
+
</br></br><a href="https://static.igem.org/mediawiki/2015/2/22/Technion_Israel_2015_protocol_NADPHfluorescence.pdf" target="_blank">Extracellular NADPH Estimation</a></br></br>
</div>
+
<a href="https://static.igem.org/mediawiki/2015/4/47/Technion_Israel_2015_newLysisMethodComparison.pdf" target="_blank">Comparison of Lysis Procedures for NADPH Measurement</a>
<div class="wrapper">
+
</br></br><a href="https://static.igem.org/mediawiki/2015/1/14/Technion_Israel_2015_protocols_shelf-life.pdf" target="_blank">Shelf-life and Storage Conditions Estimation</a>
<div class="cloning_left">
+
  </div>
<a href="https://static.igem.org/mediawiki/2015/4/4b/Technion_Israel_2015_LysisMethodComparison.pdf" target="_blank"><h2>Comparison of Lysis Procedures</h2></a>
+
 
<a href="https://static.igem.org/mediawiki/2015/e/e2/Technion_Israel_2015_protocols_B.subtilis-mCherry-secretion.pdf" target="_blank"><h2>Bacillus Secretion Verification</h2></a>
+
</div>
+
 
</div>
 
</div>
 
</div>
 
</div>
 
</div>
 
</div>
</li>
+
 
<li>
+
<div class="slides">
+
<div class="four_columns">
+
<div id="pic_misc">
+
<img style="border-top: 5px solid black; border-bottom: 5px solid black" src="https://static.igem.org/mediawiki/2015/7/7c/Technion_Israel_2015_Protocols_Misc.jpg" alt="Miscellaneous" width="900px" height="100px"></a>
+
</div>
+
<div class="cloning_left">
+
<a href="https://static.igem.org/mediawiki/2015/b/bb/Technion_iGEM_2015_Primer_dilution_protocol.pdf" target="_blank"><h2>Primer Dilution</h2></a>
+
</div>
+
<div class="cloning_right"></div>
+
</div>
+
</div>
+
</li>
+
    </ul>
+
  </div><!-- sp-content -->
+
   
+
 
+
</div> <!-- sp-slideshow -->
+
<!-------end of slider------->
+
</div>
+
 
<footer>
 
<footer>
 
<div class="team_name">
 
<div class="team_name">
Line 423: Line 167:
 
</nav>
 
</nav>
 
</footer>
 
</footer>
</div>
 
  
 
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/navbar/javascript?
 
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/navbar/javascript?
 +
action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/Javascript?
 
action=raw&ctype=text/javascript"></script>
 
action=raw&ctype=text/javascript"></script>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 12:24, 18 September 2015

Team: Technion 2015

Protocols

Contact Us