(19 intermediate revisions by 4 users not shown) | |||
Line 79: | Line 79: | ||
} | } | ||
a.anchor { | a.anchor { | ||
− | + | display: block; | |
− | + | position: relative; | |
− | + | top: -100px; | |
} | } | ||
body { | body { | ||
− | background-image: url("https://static.igem.org/mediawiki/2017/c/ | + | background-image: url("https://static.igem.org/mediawiki/2017/c/c7/T--BostonU--SaiPipetting2.jpg"); |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-attachment: fixed; | background-attachment: fixed; | ||
Line 109: | Line 109: | ||
#backgroundimage1 p { | #backgroundimage1 p { | ||
top: 40%; | top: 40%; | ||
− | color: # | + | color: #FEFEFE; |
position: relative; | position: relative; | ||
} | } | ||
Line 140: | Line 140: | ||
width: 100%; | width: 100%; | ||
color: #1d1d1d; | color: #1d1d1d; | ||
+ | z-index: 1; | ||
} | } | ||
#backgroundimage2 { | #backgroundimage2 { | ||
Line 166: | Line 167: | ||
padding: 40px; | padding: 40px; | ||
} | } | ||
+ | .link-slideup { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | } | ||
+ | .link-slideup a { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | outline: none; | ||
+ | color: #D45B5C; | ||
+ | vertical-align: bottom; | ||
+ | text-decoration: none; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | .link-slideup a::before, .link-slideup a::after { | ||
+ | pointer-events: none; | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | } | ||
+ | .link-slideup a { | ||
+ | overflow: hidden; | ||
+ | font-weight: 500; | ||
+ | } | ||
+ | .link-slideup a::before { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: -1; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: #A9A9A9; | ||
+ | opacity: 1; | ||
+ | content: ''; | ||
+ | -webkit-transition: -webkit-transform 0.2s; | ||
+ | transition: transform 0.2s; | ||
+ | -webkit-transform: translateY(95%); | ||
+ | transform: translateY(95%); | ||
+ | opacity: 0.3; | ||
+ | } | ||
+ | .link-slideup a:hover::before, .link-slideup a:focus::before { | ||
+ | -webkit-transform: translateY(0); | ||
+ | transform: translateY(0); | ||
+ | } | ||
+ | /* --- Carousel --- */ | ||
+ | .carousel { | ||
+ | position: relative; | ||
+ | width: 600px; | ||
+ | height: 400px; | ||
+ | overflow: hidden; | ||
+ | margin: 0 auto; | ||
+ | box-sizing: border-box; | ||
+ | } | ||
+ | .carousel:hover .slide:after, | ||
+ | .carousel:hover .counter, | ||
+ | .carousel:hover .slide:before { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .slide { | ||
+ | float: right; | ||
+ | position: absolute; | ||
+ | z-index: 1; | ||
+ | width: 600px; | ||
+ | height: 400px; | ||
+ | background-color: #eee; | ||
+ | text-align: center; | ||
+ | transition: opacity 0.4s; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .slide:before { | ||
+ | content: attr(annot); | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | left: 20px; | ||
+ | bottom: 20px; | ||
+ | color: rgba(255,255,255,0.9); | ||
+ | font-size: 14px; | ||
+ | font-weight: 300; | ||
+ | z-index: 12; | ||
+ | opacity: 0; | ||
+ | transition: opacity 0.3s; | ||
+ | text-shadow: 0 0 1px #000; | ||
+ | } | ||
+ | .slide:after { | ||
+ | content: attr(slide); | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | transition: opacity 0.3s; | ||
+ | width: 100%; | ||
+ | height: 80px; | ||
+ | opacity: 0; | ||
+ | background-image: linear-gradient(transparent, rgba(0,0,0,0.5)); | ||
+ | text-align: left; | ||
+ | text-indent: 549px; | ||
+ | line-height: 101px; | ||
+ | font-size: 13px; | ||
+ | color: rgba(255,255,255,0.9); | ||
+ | text-shadow: 0 0 1px #000; | ||
+ | } | ||
+ | .counter { | ||
+ | position: absolute; | ||
+ | bottom: 20px; | ||
+ | right: 1px; | ||
+ | height: 20px; | ||
+ | width: 60px; | ||
+ | z-index: 2; | ||
+ | text-align: center; | ||
+ | color: #fff; | ||
+ | line-height: 21px; | ||
+ | font-size: 13px; | ||
+ | opacity: 0; | ||
+ | transition: opacity 0.3s; | ||
+ | } | ||
+ | .faux-ui-facia { | ||
+ | top: 0; | ||
+ | right: 0; | ||
+ | float: right; | ||
+ | position: absolute; | ||
+ | margin-top: 0; | ||
+ | z-index: 9; | ||
+ | height: 100%; | ||
+ | width: 100%; | ||
+ | opacity: 0; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .faux-ui-facia:checked { | ||
+ | z-index: 8; | ||
+ | } | ||
+ | .faux-ui-facia:checked + .slide { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | .faux-ui-facia:checked:nth-child(1):checked { | ||
+ | z-index: 9; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked { | ||
+ | float: left; | ||
+ | z-index: 9; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked + .slide { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked ~ .faux-ui-facia { | ||
+ | float: left; | ||
+ | z-index: 8; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked ~ .faux-ui-facia + .slide { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked ~ .faux-ui-facia:checked { | ||
+ | z-index: 9; | ||
+ | } | ||
+ | .faux-ui-facia:nth-child(1):checked ~ .faux-ui-facia:checked + .slide { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | /* --- END of Carousel --- */ | ||
</style> | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
− | <div id="backgroundimage1"><div class="background-gradient-down"><p class="wide-heading-type mainwrap align-center"> | + | <div id="backgroundimage1"><div class="background-gradient-down"><p class="wide-heading-type mainwrap align-center">PROTOCOLS</p></div></div> |
− | <div id="panel1"> | + | <div id="panel1"class="link-slideup"> |
− | < | + | <p class="body-type mainwrap"><strong>Below is an interactive list of the laboratory techniques employed by the team. Click to navigate to that protocol.</strong></p> |
− | + | <p class="mainwrap body-type"> | |
− | + | <a href="#KODPCR">KOD PCR</a>, | |
− | + | <a href="#ColonyPCR">Colony PCR</a>, | |
− | + | <a href="#OEPCR">Overlap Extention PCR</a>, | |
− | + | <a href="#1AGel">Making a 1% Agarose Gel</a>, | |
− | + | <a href="#Electrophoresis">Agarose Gel Electrophoresis</a>, | |
− | + | <a href="#CellStock">Cell Stock</a>, | |
− | + | <a href="#Miniprep">Miniprep</a>, | |
− | + | <a href="#GelExtraction">Gel Extraction</a>, | |
− | + | <a href="#PCRCleanup">PCR Cleanup</a>, | |
− | + | <a href="#Digestion">Digestion</a>, | |
− | + | <a href="#Ligation">Ligation</a>, | |
− | + | <a href="#Transformation">Transformation</a>, | |
− | + | <a href="#LiquidCultures">Liquid Cultures</a>, | |
− | + | <a href="#TestCuts">Test Cuts</a>, | |
− | + | <a href="#Gibson">Gibson</a>, | |
− | + | <a href="#Recombination">Recombination Reaction</a>, | |
− | + | <a href="#CellFree">Cell-Free Reaction</a> | |
− | + | </p> | |
− | + | ||
<div id="protocol-accordion"class="mainwrap"> | <div id="protocol-accordion"class="mainwrap"> | ||
<a class="anchor" name="KODPCR"></a> | <a class="anchor" name="KODPCR"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">KOD PCR</h3> | <h3 class="inline-heading-type">KOD PCR</h3> | ||
<div> | <div> | ||
Line 215: | Line 372: | ||
<li>Add 1.5 µl of both the requisite Forward and Reverse Primers to PCR tube</li> | <li>Add 1.5 µl of both the requisite Forward and Reverse Primers to PCR tube</li> | ||
<li>Add 1 ul of DNA template</li> | <li>Add 1 ul of DNA template</li> | ||
− | <li>Add 27.5 µl of KOD Hot | + | <li>Add 27.5 µl of KOD Hot Start Master Mix to PCR tube</li> |
<li>Centrifuge for 10 seconds to remove air bubbles</li> | <li>Centrifuge for 10 seconds to remove air bubbles</li> | ||
<li>Place in Thermocycler</li> | <li>Place in Thermocycler</li> | ||
Line 238: | Line 395: | ||
</div> | </div> | ||
<a class="anchor" name="ColonyPCR"></a> | <a class="anchor" name="ColonyPCR"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Colony PCR</h3> | <h3 class="inline-heading-type">Colony PCR</h3> | ||
<div> | <div> | ||
Line 283: | Line 441: | ||
</div> | </div> | ||
<a class="anchor" name="OEPCR"></a> | <a class="anchor" name="OEPCR"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Overlap Extension PCR</h3> | <h3 class="inline-heading-type">Overlap Extension PCR</h3> | ||
<div> | <div> | ||
Line 326: | Line 485: | ||
</div> | </div> | ||
<a class="anchor" name="1AGel"></a> | <a class="anchor" name="1AGel"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Making a 1% Agarose Gel</h3> | <h3 class="inline-heading-type">Making a 1% Agarose Gel</h3> | ||
<div> | <div> | ||
Line 349: | Line 509: | ||
</div> | </div> | ||
<a class="anchor" name="Electrophoresis"></a> | <a class="anchor" name="Electrophoresis"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Agarose Gel Electrophoresis</h3> | <h3 class="inline-heading-type">Agarose Gel Electrophoresis</h3> | ||
<div> | <div> | ||
Line 373: | Line 534: | ||
</div> | </div> | ||
<a class="anchor" name="CellStock"></a> | <a class="anchor" name="CellStock"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Cell Stock</h3> | <h3 class="inline-heading-type">Cell Stock</h3> | ||
<div> | <div> | ||
Line 394: | Line 556: | ||
</div> | </div> | ||
<a class="anchor" name="Miniprep"></a> | <a class="anchor" name="Miniprep"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Miniprep</h3> | <h3 class="inline-heading-type">Miniprep</h3> | ||
<div> | <div> | ||
Line 435: | Line 598: | ||
</div> | </div> | ||
<a class="anchor" name="GelExtraction"></a> | <a class="anchor" name="GelExtraction"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Gel Extraction</h3> | <h3 class="inline-heading-type">Gel Extraction</h3> | ||
<div> | <div> | ||
Line 469: | Line 633: | ||
</div> | </div> | ||
<a class="anchor" name="PCRCleanup"></a> | <a class="anchor" name="PCRCleanup"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">PCR Cleanup</h3> | <h3 class="inline-heading-type">PCR Cleanup</h3> | ||
<div> | <div> | ||
Line 502: | Line 667: | ||
</div> | </div> | ||
<a class="anchor" name="Digestion"></a> | <a class="anchor" name="Digestion"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Digestion</h3> | <h3 class="inline-heading-type">Digestion</h3> | ||
<div> | <div> | ||
Line 527: | Line 693: | ||
</div> | </div> | ||
<a class="anchor" name="Ligation"></a> | <a class="anchor" name="Ligation"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Ligation</h3> | <h3 class="inline-heading-type">Ligation</h3> | ||
<div> | <div> | ||
Line 552: | Line 719: | ||
</div> | </div> | ||
<a class="anchor" name="Transformation"></a> | <a class="anchor" name="Transformation"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Transformation</h3> | <h3 class="inline-heading-type">Transformation</h3> | ||
<div> | <div> | ||
Line 575: | Line 743: | ||
</div> | </div> | ||
<a class="anchor" name="LiquidCultures"></a> | <a class="anchor" name="LiquidCultures"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Liquid Cultures</h3> | <h3 class="inline-heading-type">Liquid Cultures</h3> | ||
<div> | <div> | ||
Line 594: | Line 763: | ||
</div> | </div> | ||
<a class="anchor" name="TestCuts"></a> | <a class="anchor" name="TestCuts"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Test Cuts</h3> | <h3 class="inline-heading-type">Test Cuts</h3> | ||
<div> | <div> | ||
Line 618: | Line 788: | ||
</div> | </div> | ||
<a class="anchor" name="Gibson"></a> | <a class="anchor" name="Gibson"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Gibson</h3> | <h3 class="inline-heading-type">Gibson</h3> | ||
<div> | <div> | ||
Line 624: | Line 795: | ||
</p> | </p> | ||
<ul class="body-type"> | <ul class="body-type"> | ||
− | <li></li> | + | <li>DNA insert</li> |
− | <li></li> | + | <li>DNA backbone</li> |
− | <li></li> | + | <li>Deionized Water</li> |
− | <li></li> | + | <li>Gibson Master Mix</li> |
− | <li></li> | + | <li>PCR tubes</li> |
</ul> | </ul> | ||
<p class="body-type"> | <p class="body-type"> | ||
Line 634: | Line 805: | ||
</p> | </p> | ||
<ol class="body-type" type="1"> | <ol class="body-type" type="1"> | ||
− | <li></li> | + | <li>Add equimolar concentrations of DNA insert and DNA backbone to PCR tube</li> |
− | <li></li> | + | <li>Add deionized water to a total volume of 10ul</li> |
− | <li></li> | + | <li>Add 10ul of Gibson Master Mix</li> |
− | <li> | + | <li>Place in thermocycler</li> |
− | + | ||
− | + | ||
</ol> | </ol> | ||
</div> | </div> | ||
<a class="anchor" name="Recombination"></a> | <a class="anchor" name="Recombination"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Recombination Reaction</h3> | <h3 class="inline-heading-type">Recombination Reaction</h3> | ||
<div> | <div> | ||
Line 649: | Line 819: | ||
</p> | </p> | ||
<ul class="body-type"> | <ul class="body-type"> | ||
− | <li></li> | + | <li>250ng of DNA</li> |
− | <li></li> | + | <li>10X of Recombinase Buffer</li> |
− | <li></li> | + | <li>Recombinase</li> |
− | <li></li> | + | <li>Deionized Water</li> |
− | <li></li> | + | <li>PCR Tubes</li> |
</ul> | </ul> | ||
<p class="body-type"> | <p class="body-type"> | ||
Line 659: | Line 829: | ||
</p> | </p> | ||
<ol class="body-type" type="1"> | <ol class="body-type" type="1"> | ||
− | <li></li> | + | <li>Add 250ng of DNA</li> |
− | <li></li> | + | <li>Add 5ul of 10X Recombinase Buffer</li> |
− | <li></li> | + | <li>Add 1ul of Recombinase</li> |
− | <li></li> | + | <li>Add deionized water to total volume of 50ul</li> |
− | <li></li> | + | <li>Incubate reaction at 37°C for 30 minutes</li> |
− | <li></li> | + | <li> Hit Shock at 70°C for 10 minutes</li> |
</ol> | </ol> | ||
</div> | </div> | ||
<a class="anchor" name="CellFree"></a> | <a class="anchor" name="CellFree"></a> | ||
+ | <h3 class="inline-heading-type"> </h3> | ||
<h3 class="inline-heading-type">Cell-Free Reaction</h3> | <h3 class="inline-heading-type">Cell-Free Reaction</h3> | ||
<div> | <div> | ||
Line 674: | Line 845: | ||
</p> | </p> | ||
<ul class="body-type"> | <ul class="body-type"> | ||
− | <li></li> | + | <li>Cell Free Crude Cell Extract Master Mix</li> |
− | <li></li> | + | <li>Autoclaved Water</li> |
− | <li></li> | + | <li>DNA</li> |
− | <li></li> | + | <li>384 Well Plates</li> |
− | <li></li> | + | <li>PCR Tubes</li> |
+ | <li>Plate Reader </li> | ||
+ | <li>Ice</li> | ||
</ul> | </ul> | ||
<p class="body-type"> | <p class="body-type"> | ||
Line 684: | Line 857: | ||
</p> | </p> | ||
<ol class="body-type" type="1"> | <ol class="body-type" type="1"> | ||
− | <li></li> | + | <li>Add 4nM of DNA to each PCR tube</li> |
− | <li></li> | + | <li>Add 16.5ul of Cell Free Crude Cell Extract Master Mix to PCR tube</li> |
− | <li></li> | + | <li>Add autoclaved water to total volume of 20ul</li> |
− | <li></li> | + | <li> Centrifuge PCR tubes</li> |
− | <li></li> | + | <li> Transfer reactions from PCR tubes to a 384 Well Plates</li> |
− | <li></li> | + | <li>Take initial fluorescence reading using a plate reader with wavelengths at 485nm and 525nm</li> |
+ | <li>Incubate plate at 30°C</li> | ||
+ | <li> Measure fluorescence every hour, we found that fluorescence levels out at 6 hours</li> | ||
</ol> | </ol> | ||
</div> | </div> | ||
<a class="anchor" name="MakingCF"></a> | <a class="anchor" name="MakingCF"></a> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</div> | </div> | ||
<div id="backgroundimage2"><div class="background-gradient-up"> | <div id="backgroundimage2"><div class="background-gradient-up"> |
Latest revision as of 20:00, 1 November 2017
PROTOCOLS