Difference between revisions of "Team:Pasteur Paris/Experiments"

 
(144 intermediate revisions by 5 users not shown)
Line 1: Line 1:
−
{{Pasteur_Paris}}
+
{{Pasteur_Paris/MenuBlock}}
−
<html>´
+
{{Pasteur_Paris/Vignettes}}
−
<head>
+
<html>
−
     <style>
+
     <style type="text/css">
−
         .vignette_container{   /*element that contains the vignettes*/
+
         #runningchip {
−
            position:relative;
+
             left: 605px;
−
             height: 30em;
+
 
         }
 
         }
−
         .vignette_for {     /*foreground part of the vignettes, gets transparent*/
+
         #labwork_small {
−
             position:absolute;
+
             background-color: #292929;
−
            width: 20em;
+
}
−
            height: 15em;
+
#bannerchanged{
−
            z-index: 2;
+
    width: 100%;
−
            border: 1px solid #333;
+
    overflow: hidden;
−
            border-radius: 20px;
+
    margin: 0 auto;
−
            padding: 50px 12px;
+
}
−
            background-image: url("https://static.igem.org/mediawiki/2018/c/cd/T--Pasteur_Paris--Logo-Neuronarch_gradient.jpg");
+
@media screen and (max-width: 760px) {
−
            background-size:100%;
+
/*#wrapper {
−
            margin: 35px;
+
    width: 100%;
−
            pointer-events:none;
+
    overflow: hidden;
−
            -webkit-transition: opacity 0.7s;
+
}
−
            -moz-transition: opacity 0.7s;
+
#container {
−
            -o-transition: opacity 0.7s;
+
  width: 100%;
−
            transition: opacity 0.7s;
+
    margin: 0 auto;
 +
}*/
 +
.banner-img {
 +
    width: 100%;
 +
}
 +
}
  
−
        }
+
</style>
  
 +
<div id="bannerchanged">
 +
                <img class="banner-img" src="https://static.igem.org/mediawiki/2018/3/3e/T--Pasteur_Paris--Banner_Protocols.jpg">
 +
        </div>
 +
<h1></h1>
 +
</div>
  
 +
    <div id="GeneralContent">
 +
        <div id="MainContent">
  
−
       
+
<a href="https://2018.igem.org/Team:Pasteur_Paris/Protocols/CellBio">
−
        .vignette_back {          /*background part of the vignettes, picture*/
+
<div class="block onglet">
−
            position:absolute;
+
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/c/c1/T--Pasteur_Paris--Logo-Big-Vignette-Cellular-Biology.png);">
−
            width: 20em;
+
</div>
−
            height: 15em;
+
<div class= "textOnglet" style="background-color: #dedede;">
−
            z-index: 1;
+
<h1>Microbiology</h1>
−
            border: 1px solid #333;
+
</div>
−
            border-radius: 20px;
+
</div>
−
            padding: 50px 12px;
+
</a>
−
            background-image:url("https://static.igem.org/mediawiki/2018/0/03/T--Pasteur_Paris--PDMS_prep.jpg");
+
<a href="https://2018.igem.org/Team:Pasteur_Paris/Experiments/Microflu">
−
            background-size:100%;
+
<div class="block onglet">
−
            margin: 35px;
+
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/1/13/T--Pasteur_Paris--Logo-Big-Vignette-Microfluidics.png);">
−
            pointer-events:none;
+
</div>
−
        }
+
<div class= "textOnglet" style="background-color: #dedede;">
−
        .vignette_text {            /*small panel that slides down on the vignettes*/
+
<h1>Microfluidics</h1>
−
            position:relative;
+
</div>
−
            top:7em;
+
</div>
−
            width: 20em;
+
</a>
−
            height: 1em;
+
<a href="https://2018.igem.org/Team:Pasteur_Paris/Protocols/CellBio2">
−
            z-index: 4;
+
<div class="block onglet">
−
            border: 1px solid #333;
+
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/3/3c/T--Pasteur_Paris--Logo-Big-Vignette-Molecular-Biology.png);">
−
            background-color:white;
+
</div>
−
            box-shadow: 2px 2px 3px grey;
+
<div class= "textOnglet" style="background-color: #dedede;">
−
            padding: 20px 24px;
+
<h1>Cellular Biology</h1>
−
            margin: 23px;
+
</div>
−
            opacity: 0.9;
+
                        </a>
−
            pointer-events:none;
+
</div>
−
            -webkit-transition: top 0.7s, opacity 0.7s;
+
−
            -moz-transition: top 0.7s, opacity 0.7s;
+
−
            -o-transition: top 0.7s, opacity 0.7s;
+
−
            transition: top 0.7s, opacity 0.7s;
+
−
        }
+
−
       
+
  
−
       
 
−
        .accordion {
 
−
            background-color: transparent;
 
−
            position:relative;
 
−
            width: 21.5em;
 
−
            height:23em;
 
−
            bottom:5em;
 
−
            left:2.3em;
 
−
            cursor: pointer;
 
−
            border: none;
 
−
            outline: none;
 
−
        }
 
−
       
 
−
        .panel {
 
−
            padding: 0px 18px;
 
−
            background-color: white;
 
−
            max-height: 0;
 
−
            overflow: hidden;
 
−
            -webkit-transition: max-height 0.7s;
 
−
            -moz-transition: max-height 0.7s ;
 
−
            -o-transition: max-height 0.7s ;
 
−
            transition: max-height 0.7s ;
 
−
            border: 10px solid transparent;
 
−
            -moz-border-image: -moz-linear-gradient(left, #C6234A 0%, #3C519F 100%);
 
−
            -webkit-border-image: -webkit-linear-gradient(left, #C6234A 0%, #3C519F 100%);
 
−
            border-image: linear-gradient(to right, #C6234A 0%, #3C519F 100%);
 
−
            border-image-slice: 1;
 
−
        }
 
  
−
    </style>
+
<a href="https://2018.igem.org/Team:Pasteur_Paris/Technicals">
−
</head>
+
<div class="block onglet">
 +
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/e/ed/T--Pasteur_Paris--Big-Vignette-Design.png);">
 +
</div>
 +
<div class= "textOnglet" style="background-color: #dedede;">
 +
<h1>Design*</h1>
 +
</div>
 +
                        </a>
 +
</div>
  
−
<body>
 
  
−
<div class="column two_thirds_size">
+
            <p> (*) There are not really protocols in design, but rather methodologies. You will be redirected to Product Design - Methodology. </p>
−
    <h3>What should this page contain?</h3>
+
−
    <ul>
+
−
    <li> Protocols </li>
+
−
    <li> Experiments </li>
+
−
    <li> Documentation of the development of your project </li>
+
−
    </ul>
+
  
−
</div>
 
  
−
<div class="column third_size">
 
−
<div class="highlight decoration_A_full">
 
−
<h3>Inspiration</h3>
 
−
<ul>
 
−
<li><a href="https://2014.igem.org/Team:Colombia/Protocols">2014 Colombia </a></li>
 
−
<li><a href="https://2014.igem.org/Team:Imperial/Protocols">2014 Imperial </a></li>
 
−
<li><a href="https://2014.igem.org/Team:Caltech/Project/Experiments">2014 Caltech </a></li>
 
−
</ul>
 
−
</div>
 
−
</div>
 
−
 
−
 
−
<div class="column full_size">
 
−
 
−
    <h1>Experiments</h1>
 
−
 
−
 
−
    <p>Describe the research, experiments, and protocols you used in your iGEM project. These should be detailed
 
−
    enough for another team to repeat your experiments.</p>
 
−
 
−
    <p>
 
−
    Please remember to put all characterization and measurement data for your parts on the corresponding Registry
 
−
    part pages.
 
−
    </p>
 
−
 
−
 
−
 
−
 
−
 
−
 
−
 
−
 
−
 
−
 
−
    <div class="vignette_container">
 
−
        <h2 style="text-align: left;">Microfluidics</h2>
 
−
 
−
        <p>PDMS (Polydimethylsiloxane) is a widely used polymer in microfluidics, for its biocompatibility and transparence, among other qualities. Here we show how to prepare PDMS for
 
−
        microfluidic chips, as well as how to demold them, bond them to other surfaces and treat them for neuron growth.</p>
 
−
       
 
−
        <div class="vignette_for">
 
 
         </div>
 
         </div>
−
       
 
−
        <div class="vignette_back">
 
−
        </div>
 
−
       
 
−
        <div class="vignette_text">
 
−
            <p style="position: relative; bottom:15px; text-align:center;font-weight:bold;">PDMS Preparation</p>
 
−
        </div>
 
−
 
−
        <button class="accordion" id="button1">Section 1</button>
 
−
        <div class="panel">
 
−
            <h3>Materials</h3>
 
−
            <ul>
 
−
                <li> PDMS and curing agent (Sigma-aldrich, Sylgard 184, 761036-5EA)  </li>
 
−
                <li> Mold (we recommend a mold made of epoxyy resin for chips with microfluidic circuits, although aluminium is fine for simpler molds)  </li>
 
−
                <li> Isopropanol (liquid)  </li>
 
−
                <li> Scale </li>
 
−
                <li> Beaker</li>
 
−
                <li> Vacuum machine </li>
 
−
                <li> Spatula</li>
 
−
                <li> Oven</li>
 
−
 
−
 
−
            </ul>
 
−
            <h3>Protocol</h3>
 
−
            <p>Pour PDMS into a beaker (80 g should be enough for most applications). Pour curing agent into the same beaker (9 :1 proportion : if you used 80 g PDMS, you need 8 g curing     
 
−
            agent) and  mix with the spatula for 30 seconds. Spatula can be cleaned afterwards with some paper dipped in isopropanol. Put beaker in vacuum machine in order to extract the
 
−
            air bubbles from the mixture (at least 10 minutes vacuum, look out for overflowings). Pour mixture onto mold. Put mold+mixture in oven at 70 degrees Celsius for 3 hours at
 
−
            least. We do not recommend letting the mold with the mixture more than 2 days in the oven, otherwise there is a chance you'll break the chip when demolding it.
 
−
            </p>
 
−
 
−
        </div>
 
−
 
−
        <script>
 
−
           
 
−
 
−
           
 
−
            var acc = document.getElementsByClassName("accordion");
 
−
            var vignForLis = document.getElementsByClassName("vignette_for") ;
 
−
            var vignTextLis = document.getElementsByClassName("vignette_text") ;
 
−
            var i;
 
−
 
−
 
−
            for (i = 0; i < acc.length; i++) {
 
−
                var vignFor = vignForLis[i];
 
−
                var vignText = vignTextLis[i];
 
−
                acc[i].addEventListener("click", function() {
 
−
 
−
                    this.classList.toggle("active");
 
−
                    var panel = this.nextElementSibling;
 
−
                   
 
−
                    if (panel.style.maxHeight){
 
−
                        panel.style.maxHeight = null;
 
−
                        vignFor.style.opacity = 1;
 
−
                        vignText.style.opacity = 0.8;
 
−
                        vignText.style.top = "7em";
 
−
                        } else {
 
−
                        panel.style.maxHeight = panel.scrollHeight + "px";
 
−
                        vignFor.style.opacity = 0;
 
−
                        vignText.style.opacity = 1;
 
−
                        vignText.style.top = "23em";
 
−
                        }
 
−
                });
 
−
            }
 
−
        </script>
 
−
 
−
 
−
    <br>
 
−
    <br>
 
−
    <br>
 
−
    <h2 style="text-align: left;">Cell culture and what not</h2>
 
−
 
−
 
−
 
 
     </div>
 
     </div>
  
  
−
<br>
+
    <footer>
−
<br>
+
    </footer>
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
<br>
+
−
 
+
−
 
+
−
</div>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<div class="clear"></div>
+
  
−
</body>
 
  
  
 
</html>
 
</html>

Latest revision as of 03:48, 18 October 2018

""

Microbiology

Microfluidics

Cellular Biology

Design*

(*) There are not really protocols in design, but rather methodologies. You will be redirected to Product Design - Methodology.