Team:Virtus-Parva Mexico/Project

From 2014.igem.org

(Difference between revisions)
(added writing under section, "the making")
 
(134 intermediate revisions not shown)
Line 1: Line 1:
-
{{Team:VirtusParva/MainCss}}
 
{{CSS/Main}}
{{CSS/Main}}
 +
<html>
-
<html>
+
<!-- this section changes the default wiki template to a
 +
white full width background -->
 +
 
<style>
<style>
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/
</style>
</style>
 +
<!--  here ends the section that changes the default wiki
 +
template to a white full width background -->
-
<!--  here ends the section that changes the default wiki template to a white full width background -->
+
</html>
-
<html lang="en">
+
{{Team:VirtusParva/MainCss}}
-
<head>
+
-
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+
-
    <meta charset="utf-8">
+
 +
<html>
 +
<!-- beginning of your page -->
 +
<body>
 +
    <!-- Begin Cover -->
 +
    <div class="site-wrapper">
-
    <title>Our Project - Virtus Parva</title>
+
<!-- menu -->
-
    <meta name="generator" content="Bootply" />
+
<table id="menu" width="100%" height="5px" border="0">
-
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+
<table align="center">
-
    <link href="css/bootstrap.min.css" rel="stylesheet">
+
       
 +
  <tr height="50px">
 +
      <td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>
 +
    <a href="https://2014.igem.org/Team:Virtus-Parva_Mexico" ><img  src="https://static.igem.org/mediawiki/2014/d/de/Virtus_Parva_L-t1.jpg"></img></a></td>
 +
<td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>
 +
<a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Project"> <img  src="https://static.igem.org/mediawiki/2014/5/59/Virtus_Parva_P-t1.jpg" </img></a></td>
 +
<td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>
 +
<a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Team"> <img  src="https://static.igem.org/mediawiki/2014/c/c0/Virtus_Parva_T-t1.jpg" </img></a></td>
 +
<td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>
 +
<a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Notebook"> <img  src="https://static.igem.org/mediawiki/2014/e/e1/Virtus_Parva_W-t1.jpg" </img></a></td>
-
    <!--[if lt IE 9]>
+
<td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>  
-
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
+
<a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Parts"> <img  src="https://static.igem.org/mediawiki/2014/b/ba/Virtus_Parva_H-t1.jpg" </img></a></td> 
-
<![endif]-->
+
 
-
    <link href="css/styles.css" rel="stylesheet">
+
<td width="162px" align="center" onMouseOver="this.bgColor='#BCD630'" onMouseOut="this.bgColor='#FFFFFF'" bgColor=#FFFFFF>
 +
<a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Attributions"><img  src="https://static.igem.org/mediawiki/2014/b/bb/Virtus_Parva_A-t1.jpg" </img></a></td>
 +
<td align="center" width="162px"><a href="https://igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a></td>
 +
</tr>
 +
</table>
 +
</table>
</head>
</head>
-
<body>
+
<!-- end of menu -->
-
    <nav class="navbar navbar-default navbar-fixed-top" role="banner">
+
-
        <div class="container">
+
-
            <div class="navbar-header">
+
-
                <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
+
-
                    <span class="sr-only">Toggle navigation</span>
+
-
                    <span class="icon-bar"></span>
+
-
                    <span class="icon-bar"></span>
+
-
                    <span class="icon-bar"></span>
+
-
                </button>
+
-
                <a href="https://2014.igem.org/Team:Virtus-Parva_Mexico" class="navbar-brand">Virtus Parva Home</a>
+
-
            </div>
+
-
            <nav class="collapse navbar-collapse" role="navigation">
+
-
                <ul class="nav navbar-nav">
+
-
                    <li>
+
-
                        <a href="#sec">Project</a>
+
-
                    </li>
+
-
                    <li>
+
-
                        <a href="#sec">Outcomes</a>
+
-
                    </li>
+
-
                    <li>
+
-
                        <a href="#sec">Our Team</a>
+
-
                    </li>
+
-
                    <li>
+
-
                        <a href="#sec1">Safety</a>
+
-
                    </li>
+
-
                    <li>
+
-
                        <a href="#sec">Human Practices</a>
+
-
                    </li>
+
-
                </ul>
+
-
            </nav>
+
-
        </div>
+
-
    </nav>
+
 +
 +
<td>
 +
                        <center>
 +
<video width=60% height="auto" controls="controls">
 +
                        <source src="https://static.igem.org/mediawiki/2014/d/de/Virtus_Parva_Pared_Project_stop_motion.mov">
 +
                                    </video></center>
 +
</p>
 +
</td>
 +
<br>
 +
<br>
 +
<table border="0" cellspacing="0">
 +
<tr><td width="162px"></td><td>
     <div id="masthead">
     <div id="masthead">
         <div class="container">
         <div class="container">
             <div class="row">
             <div class="row">
                 <div class="col-md-7">
                 <div class="col-md-7">
-
                     <h1>The Bio-NEMS drill
+
                     <h1><center> <font size=7><font color="#666666">The Bio-NEMS drill</font></font></center>
            
            
-
                         <p class="lead"><i>The Next Generation in Molecular Machinery</i>  
+
                         <p class="lead"><center><i><font size= 5><font color="#000000">The Next Generation in Molecular Machinery</font></i> </font> </center>
</p>
</p>
                     </h1>
                     </h1>
Line 84: Line 84:
     </div>
     </div>
     <!--/masthead-->
     <!--/masthead-->
 +
</td></tr></table>
     <!--main-->
     <!--main-->
 +
<table tyle="width:100%" border="0" cellspacing="0">
 +
<tr><td width="162px"></td><td>
     <div class="container">
     <div class="container">
         <div class="row">
         <div class="row">
Line 94: Line 97:
                     <li><a href="#sec2">The Idea</a></li>
                     <li><a href="#sec2">The Idea</a></li>
                     <li><a href="#sec3">The Making</a></li>
                     <li><a href="#sec3">The Making</a></li>
 +
                    <li><a href="#sec4">The Math</a></li>
 +
<br>
 +
<center><a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Outcomes"><img src="https://static.igem.org/mediawiki/2014/0/0e/Virtus_Parva-O.jpg"/></img></a></center>
 +
<br>
 +
                 </ul>
                 </ul>
             </div>
             </div>
Line 99: Line 107:
             <!--right-->
             <!--right-->
-
             <div class="col-md-9">
+
             <div class="col-md-9"></td></tr></table>
 +
<br>
 +
<br>
                 <!-- Inicia Seccion 1 -->
                 <!-- Inicia Seccion 1 -->
-
                 <h2 id="sec1">What is it that we do?</h2>
+
 
 +
<table style="width:100%" border="0" cellspacing="0">
 +
<tr><td width="162px" bgColor="#355079"></td><td bgColor="#355079">
 +
<br>
 +
<br>
 +
                 <h1 id="sec1"><font size= 6>What is it that we do?</h1></font>
                 <div class="well">
                 <div class="well">
-
                   <p>The Bio-NEMS drill is a</p>  
+
                   <p align="justify"><font size=5 color="#ffffff">
-
                 </div>
+
The Bio-NEMS drill is the project that we, a group of nanotechnologists have <br><br>
 +
been working on for almost a year. What started as an idea, became a big part <br><br>
 +
of our everyday lives and we have done our best to nurture it and watch it grown.<br><br>
 +
We have prepared different aspects of the project through hard work and it is <br><br>
 +
our hope that our legacy may continue.
 +
 
 +
</font>  </p>  
 +
                  
 +
</div>
                 <div class="row">
                 <div class="row">
                     <!-- Inicia Subseccion 1 -->
                     <!-- Inicia Subseccion 1 -->
Line 111: Line 134:
                         <div class="panel panel-default">
                         <div class="panel panel-default">
                             <div class="panel-heading">
                             <div class="panel-heading">
-
                                 <h3>Project Overview</h3>
+
<br>
 +
<br>
 +
                                  
 +
<h1><font color="#ffffff" size= 6>Project Overview</h1></font>
                             </div>
                             </div>
                             <div class="panel-body">
                             <div class="panel-body">
-
                                 Virtus-Parva is a team of Nanotechnology students who aim to create a better world through love,sympathy and endearment… and through the design and development of a novel technology based on micrometric “drills” to attack pathogen agents.  
+
                                 <p align="justify"><font size= 4 color="FFFFFF">
 +
Virtus-Parva is a team of Nanotechnology students who aim to create a better world through love,sympathy and endearment… and through the design and development of a novel technology based on micrometric “drills” that can penetrate diverse organisms.
 +
<br>
 +
<br>
 +
First and foremost, we studied different procedures in order to synthesize the strongest and smallest nanoparticles we could make. Magnetite is a molecule that derives from iron, and has observable magnetic properties. Because we wanted to put together magnetite and DNA, we had to make them compatible,thrpugh deifferent chemical procedures to allow the binding of this DNa into the particle. At the same time, our biology team was busy extracting, purifying and transforming <i>E. coli</i> DNA to work with. We achieved coiling DNA to nanoparticles. The “Magnetic-DNA” complex we created mimics the nucleosome in DNA supercoiling process. This allows us to have a DNA “chromatin-like” with a magnetic core.
<br>
<br>
<br>
<br>
-
First and foremost, we studied different procedures in order to synthesize the strongest and smallest magnetite particles we could make. Magnetite is a molecule that derives from iron, and has observable magnetic properties. Because we wanted to put together magnetite and DNA, we had to make them compatible, task we accomplished by functionalizing it with amino groups, that would allow it to form peptide bonds with our protein, HU. At the same time, our biology team was busy extracting, purifying and transforming E. Coli DNA to work with. This protein, HU, is a histone-like protein normally aids DNA into supercoiling around histones; the “Magnetic-Protein” complex we created mimics the nucleosome in DNA supercoiling process. This allows us to have a DNA “chromatin” with a magnetic core.
+
Combining magnetite, and DNA, we are building magnetic-core machines, which can be controlled through external electrical impulses. Because of the shape of our system, it is possible for it to have linear movement depending on the frequency applied to it, which has several potential applications. The main one was to make it a resonator which was our module one. Yet, the project did not stop there. We built a DNA carrier, therefore we started a process to enhance <font size=4 GENETIC TRANSFORMATION!</font>
<br>
<br>
<br>
<br>
-
Combining magnetite, DNA and HU protein, we are building magnetic-core machines, which can be controlled through external electrical impulses. Because of the shape of our system, it is possible for it to have linear movement depending on the frequency applied to it, which has the potential to be incorporated into the medical sector as a pathogen-targeted therapy. This was our original idea and module one of our project.  
+
As we were transforming our <i>E. coli</i> cells, we noticed it wasn’t as fast and efficient as we had hoped, which is how we came up with module two of the project. Quite simply, we wanted to take advantage of the shape of our system and its mobility thanks to magnetism in order to make a more efficient transformation. We were able to verify our method was more efficient by making cells express GFP and RFP, which can then be quantified with optic instruments.</font>
<br>
<br>
<br>
<br>
-
As we were transforming our E. coli cells, we noticed it wasn’t as fast and efficient as we had hoped, which is how we came up with module two of the project. Quite simply, we wanted to take advantage of the shape of our system and its mobility thanks to magnetism in order to make a more efficient transformation. We were able to verify our method was more efficient by making cells express GFP and RFP, which can then be quantified with optic instruments.
+
<br></p>
                             </div>
                             </div>
Line 130: Line 160:
                     <!-- Fin Subseccion 1 -->
                     <!-- Fin Subseccion 1 -->
-
                     </div>
+
                     </div></td><td width="162px" bgColor="#355079"></td></tr>
-
                 <hr>
+
                  
                 <!-- Fin Seccion 1 -->
                 <!-- Fin Seccion 1 -->
                 <!-- Inicia Seccion 2 -->
                 <!-- Inicia Seccion 2 -->
-
                 <h2 id="sec2">The Idea</h2>
+
                 <tr><td width="162px"></td><td>
-
                 <p>
+
 
-
                     The basis for these “drills” will be NEMS, nano electro-mechanical systems, technology.<br> We took a survey to fellow iGEMers and external people in order to find out how many people knew about the existence of NEMS and if they knew how they worked. Turns out only 36% of survey takers had heard of the term before and of those, only 28% knew what it was!<br><br> Given these statistics, it became part of our project to teach newer generations about our subject.  
+
<br>
 +
<br>
 +
<h1 id="sec2"><font size= 6><font color="#000000">The Idea</font></h1></font>
 +
 
 +
                 <p align="justify"> <font size=4>
 +
                     The basis for these “drills” will be NEMS, nano electro-mechanical systems, technology.<br> We took a survey to fellow iGEMers and external people in order to find out how many people knew about the existence of NEMS and if they knew how they worked. Turns out only 36% of survey takers had heard of the term before and of those, only 28% knew what it was!<br><br> Given these statistics, it became part of our project to teach newer generations about our subject. </font>
                 </p>
                 </p>
Line 146: Line 181:
                         <div class="panel panel-default">
                         <div class="panel panel-default">
                             <div class="panel-heading">
                             <div class="panel-heading">
-
                                 <h3>NEMS</h3>
+
                                 <h3><font size=4><font color="#000000"> NEMS</font> </font></h3>
                             </div>
                             </div>
                             <div class="panel-body">
                             <div class="panel-body">
-
                                NEMS are nanometric electromechanical systems. In this case we take as basis the structure of a resonator which are engineered to make a conversión between energy, such as electric, magnetic, or vibrational into mechanical response.
+
                              <p align="justify"> <font size=4> NEMS are nanometric electromechanical systems. In this case we take as basis the structure of a resonator which are engineered to make a conversión between energy, such as electric, magnetic, or vibrational into mechanical response.
<br>
<br>
<br>
<br>
Line 155: Line 190:
<br>
<br>
<br>
<br>
-
Well, by combining an inorganically synthesized nanoparticle, called magnetite and DNA into what we call BioNEMS drill.  
+
Well, by combining an inorganically synthesized nanoparticle, called magnetite and DNA into what we call BioNEMS drill. </font></p>
                             </div>
                             </div>
                         </div>
                         </div>
Line 162: Line 197:
                         <div class="panel panel-default">
                         <div class="panel panel-default">
                             <div class="panel-heading">
                             <div class="panel-heading">
-
                                 <h3>DNA Coiling into Chromosomes</h3>
+
                                 <h3><font size=4><font color="#000000">DNA Coiling</font></font></font></h3>
                             </div>
                             </div>
                             <div class="panel-body">
                             <div class="panel-body">
-
                                 Contenido subtitulo 2
+
<p align="justify"><font size=4>
 +
                                 Naturally, and as part of the process of transcription DNA is wrapped around protein molecules called histones. The combined loop of DNA and protein is called nucleosome, and this nucleosome is going to be packed into a thread. Our objective was to insert magnetite into this system, in order to convert it into a NEMS and be able to control DNA’s movement using an external stimuli.
 +
<br>
 +
<br>
 +
<br>
 +
<br></p></font>
                             </div>
                             </div>
                         </div>
                         </div>
Line 171: Line 211:
                 </div>
                 </div>
-
                 <hr>
+
                 </td><td width="162px"></tr>
                 <!-- Fin Seccion 2 -->
                 <!-- Fin Seccion 2 -->
                 <!-- Inicia Seccion 3 -->
                 <!-- Inicia Seccion 3 -->
-
                 <h2 id="sec3">The Making</h2>
+
                 <tr><td width="162px" bgColor="#8AAA3D"></td><td bgColor="#8AAA3D">
-
                 <p>
+
 
-
                     Descripcion general de Seccion 3
+
<br>
 +
<br>
 +
<h1 id="sec3"><font size= 6>The Making</h1></font>
 +
                 <p align="justify"><font size=4>
 +
 
 +
                     <font color="#ffffff">The most important part of our project was the time that we dedicated to seeing results in our lab. Admittedly, it was tough, for we had to do everything in our own time and we had only occasional help from our instructors, for the most part we did everything on our own. Despite all of the size of the challenge, our team rose up to the occasion and in the end all those hours we dedicated in the lab were worth it. Here you can see a short description of what all the things we did in our lab, for a more detailed description check our notebook section. </font>
                 </p>
                 </p>
                 <div class="row">
                 <div class="row">
Line 183: Line 228:
                         <div class="panel panel-default">
                         <div class="panel panel-default">
                             <div class="panel-heading">
                             <div class="panel-heading">
-
                                 <h3>Inorganic Section</h3>
+
                                 <h2>Inorganic Section</h2>
                             </div>
                             </div>
-
                             <div class="panel-body">
+
                             <div class="panel-body"><p align="justify"><font size=4>
-
                                 The first part of the synthesis of our magnetite was trying out different methods and characterizing them, to note which method had given us the smallest size nanoparticles. Our first method was synthesis by coprecipitation, of which we prepared nine samples with different concentrations of iron(II) chloride and ammonium hydroxide; from this method we consistently obtained nanoparticles rounding 0.9 to 1nm. Our following method was very similar, but included water in the synthesis: the size of our particles would vary greatly, from 3.89 micrometers to 171 nanometers in size.  
+
                                 <font color="#ffffff">The first part of the synthesis of our magnetite was trying out different methods and characterizing them, to note which method had given us the smallest size nanoparticles. Our first method was synthesis by coprecipitation, of which we prepared nine samples with different concentrations of iron(II) chloride and ammonium hydroxide; from this method we consistently obtained nanoparticles rounding 0.9 to 1nm. Our following method was very similar, but included water in the synthesis: the size of our particles would vary greatly, from 3.89 micrometers to 171 nanometers in size.  
<br>
<br>
<br>
<br>
Line 192: Line 237:
<br>
<br>
<br>
<br>
-
Our results were then characterized by DLS (dynamic light scattering), for which we observed a peak at 39 nm, once coated with TEOS, the peak was moved toward 60 and 80 nm. We also ran our two samples in the IR, comparing the spectra of the pure magnetite and silanized magnetite, we were able to distinguish a peak at 990.2 cm^-1 corresponding to a Si-O bond, confirming the correct silanization of the magnetite.   
+
Our results were then characterized by DLS (dynamic light scattering), for which we observed a peak at 39 nm, once coated with TEOS, the peak was moved toward 60 and 80 nm. We also ran our two samples in the IR, comparing the spectra of the pure magnetite and silanized magnetite, we were able to distinguish a peak at 990.2 cm<sup>-1</sup> corresponding to a Si-O bond, confirming the correct silanization of the magnetite.  </font></p>
 +
 
 +
<br>
 +
<br>
                             </div>
                             </div>
                         </div>
                         </div>
Line 199: Line 247:
                         <div class="panel panel-default">
                         <div class="panel panel-default">
                             <div class="panel-heading">
                             <div class="panel-heading">
-
                                 <h3>Subtitulo 2</h3>
+
                                 <h2>Biological Section</h2>
                             </div>
                             </div>
                             <div class="panel-body">
                             <div class="panel-body">
-
                                 Contenido subtitulo 2
+
<p align="justify"><font size=4>
 +
                                 <font color="#ffffff">Having done this, we then prepped our protein by resuspending it in a mix of Tris/acetate and EDTA in order to be able to combine it with our DNA. Then we dispersed our magnetite in anhydric toluene and we added the resuspended protein and we added as well some glutaraldehyde as a coupling agent. We also made some batches without any glutaraldehyde, to compare the comparable strength of their bonds.
 +
<br>
 +
<br>
 +
We then needed to grow and then extract from E. Coli the DNA we were to use for the rest of our project. We tested two different methods: one of which was the well-known mini prep and the other was very similar but without using an enzyme. Using the DNA we have extracted, we then needed to transform these cells to make competent cells.
 +
<br>
 +
<br>
 +
These cells we had transformed, we then had to purify, by precipitating in presence of ethanol and centrifugation to eliminate supernatant. We did different dilutions of DNA and combined them with our protein, HU. These as well were divided again in gluteraldehyde and no gluteraldehyde and subsecuently in DNA and not DNA. We did some UV characterization for all samples. We discovered that the solutions with glutaraldehyde had stronger bonds between DNA and HU. We prepared some samples: one with glutaraldehyde and DNA-Hu, another just with glutaraldehyde and DNA, the third one just with DNA-HU and the last one just with DNA and prepared them with nanoparticles and ran them through UV.
 +
<br>
 +
<br>
 +
<br>
 +
<br></font></p>
                             </div>
                             </div>
                         </div>
                         </div>
Line 208: Line 267:
                 </div>
                 </div>
-
                 <hr>
+
                 </td><td width="162px" bgColor="#8AAA3D"></p></td></tr></table>
                 <!-- Fin Seccion 3 -->
                 <!-- Fin Seccion 3 -->
-
            </div>
 
-
            <!--/right-->
 
-
        </div>
 
-
        <!--/row-->
 
-
    </div>
 
-
    <!--/container-->
 
 +
<!-- Inicia Seccion 4 -->
 +
<table style="width:100%" border="0" cellspacing="0">
 +
<tr><td width="162px" bgColor="#ffbc67"></td><td bgColor="#ffbc67">
 +
<br>
 +
<br>
-
    <!-- script references -->
+
               
-
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
+
<h1 id="sec4"><font size= 6>The Math behind</h1></font>
 +
                <div class="well">
 +
                  <p align="justify"><font size=4 color="#ffffff">  The first approach to the project in order for it to become feasible was the mathematical model: the number that told us how right or wrong our ideas were.
-
    <script lang="JavaScript">
+
We invite you to visit our modelling page, and find out a lot more about the Bio-NEMS drill and its behaviour. </font>
-
        if ("undefined" == typeof jQuery) throw new Error("Bootstrap's JavaScript requires jQuery"); +function (a) { "use strict"; function b() { var a = document.createElement("bootstrap"), b = { WebkitTransition: "webkitTransitionEnd", MozTransition: "transitionend", OTransition: "oTransitionEnd otransitionend", transition: "transitionend" }; for (var c in b) if (void 0 !== a.style[c]) return { end: b[c] }; return !1 } a.fn.emulateTransitionEnd = function (b) { var c = !1, d = this; a(this).one(a.support.transition.end, function () { c = !0 }); var e = function () { c || a(d).trigger(a.support.transition.end) }; return setTimeout(e, b), this }, a(function () { a.support.transition = b() }) }(jQuery), +function (a) { "use strict"; var b = '[data-dismiss="alert"]', c = function (c) { a(c).on("click", b, this.close) }; c.prototype.close = function (b) { function c() { f.trigger("closed.bs.alert").remove() } var d = a(this), e = d.attr("data-target"); e || (e = d.attr("href"), e = e && e.replace(/.*(?=#[^\s]*$)/, "")); var f = a(e); b && b.preventDefault(), f.length || (f = d.hasClass("alert") ? d : d.parent()), f.trigger(b = a.Event("close.bs.alert")), b.isDefaultPrevented() || (f.removeClass("in"), a.support.transition && f.hasClass("fade") ? f.one(a.support.transition.end, c).emulateTransitionEnd(150) : c()) }; var d = a.fn.alert; a.fn.alert = function (b) { return this.each(function () { var d = a(this), e = d.data("bs.alert"); e || d.data("bs.alert", e = new c(this)), "string" == typeof b && e[b].call(d) }) }, a.fn.alert.Constructor = c, a.fn.alert.noConflict = function () { return a.fn.alert = d, this }, a(document).on("click.bs.alert.data-api", b, c.prototype.close) }(jQuery), +function (a) { "use strict"; var b = function (c, d) { this.$element = a(c), this.options = a.extend({}, b.DEFAULTS, d), this.isLoading = !1 }; b.DEFAULTS = { loadingText: "loading..." }, b.prototype.setState = function (b) { var c = "disabled", d = this.$element, e = d.is("input") ? "val" : "html", f = d.data(); b += "Text", f.resetText || d.data("resetText", d[e]()), d[e](f[b] || this.options[b]), setTimeout(a.proxy(function () { "loadingText" == b ? (this.isLoading = !0, d.addClass(c).attr(c, c)) : this.isLoading && (this.isLoading = !1, d.removeClass(c).removeAttr(c)) }, this), 0) }, b.prototype.toggle = function () { var a = !0, b = this.$element.closest('[data-toggle="buttons"]'); if (b.length) { var c = this.$element.find("input"); "radio" == c.prop("type") && (c.prop("checked") && this.$element.hasClass("active") ? a = !1 : b.find(".active").removeClass("active")), a && c.prop("checked", !this.$element.hasClass("active")).trigger("change") } a && this.$element.toggleClass("active") }; var c = a.fn.button; a.fn.button = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.button"), f = "object" == typeof c && c; e || d.data("bs.button", e = new b(this, f)), "toggle" == c ? e.toggle() : c && e.setState(c) }) }, a.fn.button.Constructor = b, a.fn.button.noConflict = function () { return a.fn.button = c, this }, a(document).on("click.bs.button.data-api", "[data-toggle^=button]", function (b) { var c = a(b.target); c.hasClass("btn") || (c = c.closest(".btn")), c.button("toggle"), b.preventDefault() }) }(jQuery), +function (a) { "use strict"; var b = function (b, c) { this.$element = a(b), this.$indicators = this.$element.find(".carousel-indicators"), this.options = c, this.paused = this.sliding = this.interval = this.$active = this.$items = null, "hover" == this.options.pause && this.$element.on("mouseenter", a.proxy(this.pause, this)).on("mouseleave", a.proxy(this.cycle, this)) }; b.DEFAULTS = { interval: 5e3, pause: "hover", wrap: !0 }, b.prototype.cycle = function (b) { return b || (this.paused = !1), this.interval && clearInterval(this.interval), this.options.interval && !this.paused && (this.interval = setInterval(a.proxy(this.next, this), this.options.interval)), this }, b.prototype.getActiveIndex = function () { return this.$active = this.$element.find(".item.active"), this.$items = this.$active.parent().children(), this.$items.index(this.$active) }, b.prototype.to = function (b) { var c = this, d = this.getActiveIndex(); return b > this.$items.length - 1 || 0 > b ? void 0 : this.sliding ? this.$element.one("slid.bs.carousel", function () { c.to(b) }) : d == b ? this.pause().cycle() : this.slide(b > d ? "next" : "prev", a(this.$items[b])) }, b.prototype.pause = function (b) { return b || (this.paused = !0), this.$element.find(".next, .prev").length && a.support.transition && (this.$element.trigger(a.support.transition.end), this.cycle(!0)), this.interval = clearInterval(this.interval), this }, b.prototype.next = function () { return this.sliding ? void 0 : this.slide("next") }, b.prototype.prev = function () { return this.sliding ? void 0 : this.slide("prev") }, b.prototype.slide = function (b, c) { var d = this.$element.find(".item.active"), e = c || d[b](), f = this.interval, g = "next" == b ? "left" : "right", h = "next" == b ? "first" : "last", i = this; if (!e.length) { if (!this.options.wrap) return; e = this.$element.find(".item")[h]() } if (e.hasClass("active")) return this.sliding = !1; var j = a.Event("slide.bs.carousel", { relatedTarget: e[0], direction: g }); return this.$element.trigger(j), j.isDefaultPrevented() ? void 0 : (this.sliding = !0, f && this.pause(), this.$indicators.length && (this.$indicators.find(".active").removeClass("active"), this.$element.one("slid.bs.carousel", function () { var b = a(i.$indicators.children()[i.getActiveIndex()]); b && b.addClass("active") })), a.support.transition && this.$element.hasClass("slide") ? (e.addClass(b), e[0].offsetWidth, d.addClass(g), e.addClass(g), d.one(a.support.transition.end, function () { e.removeClass([b, g].join(" ")).addClass("active"), d.removeClass(["active", g].join(" ")), i.sliding = !1, setTimeout(function () { i.$element.trigger("slid.bs.carousel") }, 0) }).emulateTransitionEnd(1e3 * d.css("transition-duration").slice(0, -1))) : (d.removeClass("active"), e.addClass("active"), this.sliding = !1, this.$element.trigger("slid.bs.carousel")), f && this.cycle(), this) }; var c = a.fn.carousel; a.fn.carousel = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.carousel"), f = a.extend({}, b.DEFAULTS, d.data(), "object" == typeof c && c), g = "string" == typeof c ? c : f.slide; e || d.data("bs.carousel", e = new b(this, f)), "number" == typeof c ? e.to(c) : g ? e[g]() : f.interval && e.pause().cycle() }) }, a.fn.carousel.Constructor = b, a.fn.carousel.noConflict = function () { return a.fn.carousel = c, this }, a(document).on("click.bs.carousel.data-api", "[data-slide], [data-slide-to]", function (b) { var c, d = a(this), e = a(d.attr("data-target") || (c = d.attr("href")) && c.replace(/.*(?=#[^\s]+$)/, "")), f = a.extend({}, e.data(), d.data()), g = d.attr("data-slide-to"); g && (f.interval = !1), e.carousel(f), (g = d.attr("data-slide-to")) && e.data("bs.carousel").to(g), b.preventDefault() }), a(window).on("load", function () { a('[data-ride="carousel"]').each(function () { var b = a(this); b.carousel(b.data()) }) }) }(jQuery), +function (a) { "use strict"; var b = function (c, d) { this.$element = a(c), this.options = a.extend({}, b.DEFAULTS, d), this.transitioning = null, this.options.parent && (this.$parent = a(this.options.parent)), this.options.toggle && this.toggle() }; b.DEFAULTS = { toggle: !0 }, b.prototype.dimension = function () { var a = this.$element.hasClass("width"); return a ? "width" : "height" }, b.prototype.show = function () { if (!this.transitioning && !this.$element.hasClass("in")) { var b = a.Event("show.bs.collapse"); if (this.$element.trigger(b), !b.isDefaultPrevented()) { var c = this.$parent && this.$parent.find("> .panel > .in"); if (c && c.length) { var d = c.data("bs.collapse"); if (d && d.transitioning) return; c.collapse("hide"), d || c.data("bs.collapse", null) } var e = this.dimension(); this.$element.removeClass("collapse").addClass("collapsing")[e](0), this.transitioning = 1; var f = function () { this.$element.removeClass("collapsing").addClass("collapse in")[e]("auto"), this.transitioning = 0, this.$element.trigger("shown.bs.collapse") }; if (!a.support.transition) return f.call(this); var g = a.camelCase(["scroll", e].join("-")); this.$element.one(a.support.transition.end, a.proxy(f, this)).emulateTransitionEnd(350)[e](this.$element[0][g]) } } }, b.prototype.hide = function () { if (!this.transitioning && this.$element.hasClass("in")) { var b = a.Event("hide.bs.collapse"); if (this.$element.trigger(b), !b.isDefaultPrevented()) { var c = this.dimension(); this.$element[c](this.$element[c]())[0].offsetHeight, this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"), this.transitioning = 1; var d = function () { this.transitioning = 0, this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse") }; return a.support.transition ? void this.$element[c](0).one(a.support.transition.end, a.proxy(d, this)).emulateTransitionEnd(350) : d.call(this) } } }, b.prototype.toggle = function () { this[this.$element.hasClass("in") ? "hide" : "show"]() }; var c = a.fn.collapse; a.fn.collapse = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.collapse"), f = a.extend({}, b.DEFAULTS, d.data(), "object" == typeof c && c); !e && f.toggle && "show" == c && (c = !c), e || d.data("bs.collapse", e = new b(this, f)), "string" == typeof c && e[c]() }) }, a.fn.collapse.Constructor = b, a.fn.collapse.noConflict = function () { return a.fn.collapse = c, this }, a(document).on("click.bs.collapse.data-api", "[data-toggle=collapse]", function (b) { var c, d = a(this), e = d.attr("data-target") || b.preventDefault() || (c = d.attr("href")) && c.replace(/.*(?=#[^\s]+$)/, ""), f = a(e), g = f.data("bs.collapse"), h = g ? "toggle" : d.data(), i = d.attr("data-parent"), j = i && a(i); g && g.transitioning || (j && j.find('[data-toggle=collapse][data-parent="' + i + '"]').not(d).addClass("collapsed"), d[f.hasClass("in") ? "addClass" : "removeClass"]("collapsed")), f.collapse(h) }) }(jQuery), +function (a) { "use strict"; function b(b) { a(d).remove(), a(e).each(function () { var d = c(a(this)), e = { relatedTarget: this }; d.hasClass("open") && (d.trigger(b = a.Event("hide.bs.dropdown", e)), b.isDefaultPrevented() || d.removeClass("open").trigger("hidden.bs.dropdown", e)) }) } function c(b) { var c = b.attr("data-target"); c || (c = b.attr("href"), c = c && /#[A-Za-z]/.test(c) && c.replace(/.*(?=#[^\s]*$)/, "")); var d = c && a(c); return d && d.length ? d : b.parent() } var d = ".dropdown-backdrop", e = "[data-toggle=dropdown]", f = function (b) { a(b).on("click.bs.dropdown", this.toggle) }; f.prototype.toggle = function (d) { var e = a(this); if (!e.is(".disabled, :disabled")) { var f = c(e), g = f.hasClass("open"); if (b(), !g) { "ontouchstart" in document.documentElement && !f.closest(".navbar-nav").length && a('<div class="dropdown-backdrop"/>').insertAfter(a(this)).on("click", b); var h = { relatedTarget: this }; if (f.trigger(d = a.Event("show.bs.dropdown", h)), d.isDefaultPrevented()) return; f.toggleClass("open").trigger("shown.bs.dropdown", h), e.focus() } return !1 } }, f.prototype.keydown = function (b) { if (/(38|40|27)/.test(b.keyCode)) { var d = a(this); if (b.preventDefault(), b.stopPropagation(), !d.is(".disabled, :disabled")) { var f = c(d), g = f.hasClass("open"); if (!g || g && 27 == b.keyCode) return 27 == b.which && f.find(e).focus(), d.click(); var h = " li:not(.divider):visible a", i = f.find("[role=menu]" + h + ", [role=listbox]" + h); if (i.length) { var j = i.index(i.filter(":focus")); 38 == b.keyCode && j > 0 && j--, 40 == b.keyCode && j < i.length - 1 && j++, ~j || (j = 0), i.eq(j).focus() } } } }; var g = a.fn.dropdown; a.fn.dropdown = function (b) { return this.each(function () { var c = a(this), d = c.data("bs.dropdown"); d || c.data("bs.dropdown", d = new f(this)), "string" == typeof b && d[b].call(c) }) }, a.fn.dropdown.Constructor = f, a.fn.dropdown.noConflict = function () { return a.fn.dropdown = g, this }, a(document).on("click.bs.dropdown.data-api", b).on("click.bs.dropdown.data-api", ".dropdown form", function (a) { a.stopPropagation() }).on("click.bs.dropdown.data-api", e, f.prototype.toggle).on("keydown.bs.dropdown.data-api", e + ", [role=menu], [role=listbox]", f.prototype.keydown) }(jQuery), +function (a) { "use strict"; var b = function (b, c) { this.options = c, this.$element = a(b), this.$backdrop = this.isShown = null, this.options.remote && this.$element.find(".modal-content").load(this.options.remote, a.proxy(function () { this.$element.trigger("loaded.bs.modal") }, this)) }; b.DEFAULTS = { backdrop: !0, keyboard: !0, show: !0 }, b.prototype.toggle = function (a) { return this[this.isShown ? "hide" : "show"](a) }, b.prototype.show = function (b) { var c = this, d = a.Event("show.bs.modal", { relatedTarget: b }); this.$element.trigger(d), this.isShown || d.isDefaultPrevented() || (this.isShown = !0, this.escape(), this.$element.on("click.dismiss.bs.modal", '[data-dismiss="modal"]', a.proxy(this.hide, this)), this.backdrop(function () { var d = a.support.transition && c.$element.hasClass("fade"); c.$element.parent().length || c.$element.appendTo(document.body), c.$element.show().scrollTop(0), d && c.$element[0].offsetWidth, c.$element.addClass("in").attr("aria-hidden", !1), c.enforceFocus(); var e = a.Event("shown.bs.modal", { relatedTarget: b }); d ? c.$element.find(".modal-dialog").one(a.support.transition.end, function () { c.$element.focus().trigger(e) }).emulateTransitionEnd(300) : c.$element.focus().trigger(e) })) }, b.prototype.hide = function (b) { b && b.preventDefault(), b = a.Event("hide.bs.modal"), this.$element.trigger(b), this.isShown && !b.isDefaultPrevented() && (this.isShown = !1, this.escape(), a(document).off("focusin.bs.modal"), this.$element.removeClass("in").attr("aria-hidden", !0).off("click.dismiss.bs.modal"), a.support.transition && this.$element.hasClass("fade") ? this.$element.one(a.support.transition.end, a.proxy(this.hideModal, this)).emulateTransitionEnd(300) : this.hideModal()) }, b.prototype.enforceFocus = function () { a(document).off("focusin.bs.modal").on("focusin.bs.modal", a.proxy(function (a) { this.$element[0] === a.target || this.$element.has(a.target).length || this.$element.focus() }, this)) }, b.prototype.escape = function () { this.isShown && this.options.keyboard ? this.$element.on("keyup.dismiss.bs.modal", a.proxy(function (a) { 27 == a.which && this.hide() }, this)) : this.isShown || this.$element.off("keyup.dismiss.bs.modal") }, b.prototype.hideModal = function () { var a = this; this.$element.hide(), this.backdrop(function () { a.removeBackdrop(), a.$element.trigger("hidden.bs.modal") }) }, b.prototype.removeBackdrop = function () { this.$backdrop && this.$backdrop.remove(), this.$backdrop = null }, b.prototype.backdrop = function (b) { var c = this.$element.hasClass("fade") ? "fade" : ""; if (this.isShown && this.options.backdrop) { var d = a.support.transition && c; if (this.$backdrop = a('<div class="modal-backdrop ' + c + '" />').appendTo(document.body), this.$element.on("click.dismiss.bs.modal", a.proxy(function (a) { a.target === a.currentTarget && ("static" == this.options.backdrop ? this.$element[0].focus.call(this.$element[0]) : this.hide.call(this)) }, this)), d && this.$backdrop[0].offsetWidth, this.$backdrop.addClass("in"), !b) return; d ? this.$backdrop.one(a.support.transition.end, b).emulateTransitionEnd(150) : b() } else !this.isShown && this.$backdrop ? (this.$backdrop.removeClass("in"), a.support.transition && this.$element.hasClass("fade") ? this.$backdrop.one(a.support.transition.end, b).emulateTransitionEnd(150) : b()) : b && b() }; var c = a.fn.modal; a.fn.modal = function (c, d) { return this.each(function () { var e = a(this), f = e.data("bs.modal"), g = a.extend({}, b.DEFAULTS, e.data(), "object" == typeof c && c); f || e.data("bs.modal", f = new b(this, g)), "string" == typeof c ? f[c](d) : g.show && f.show(d) }) }, a.fn.modal.Constructor = b, a.fn.modal.noConflict = function () { return a.fn.modal = c, this }, a(document).on("click.bs.modal.data-api", '[data-toggle="modal"]', function (b) { var c = a(this), d = c.attr("href"), e = a(c.attr("data-target") || d && d.replace(/.*(?=#[^\s]+$)/, "")), f = e.data("bs.modal") ? "toggle" : a.extend({ remote: !/#/.test(d) && d }, e.data(), c.data()); c.is("a") && b.preventDefault(), e.modal(f, this).one("hide", function () { c.is(":visible") && c.focus() }) }), a(document).on("show.bs.modal", ".modal", function () { a(document.body).addClass("modal-open") }).on("hidden.bs.modal", ".modal", function () { a(document.body).removeClass("modal-open") }) }(jQuery), +function (a) { "use strict"; var b = function (a, b) { this.type = this.options = this.enabled = this.timeout = this.hoverState = this.$element = null, this.init("tooltip", a, b) }; b.DEFAULTS = { animation: !0, placement: "top", selector: !1, template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>', trigger: "hover focus", title: "", delay: 0, html: !1, container: !1 }, b.prototype.init = function (b, c, d) { this.enabled = !0, this.type = b, this.$element = a(c), this.options = this.getOptions(d); for (var e = this.options.trigger.split(" "), f = e.length; f--;) { var g = e[f]; if ("click" == g) this.$element.on("click." + this.type, this.options.selector, a.proxy(this.toggle, this)); else if ("manual" != g) { var h = "hover" == g ? "mouseenter" : "focusin", i = "hover" == g ? "mouseleave" : "focusout"; this.$element.on(h + "." + this.type, this.options.selector, a.proxy(this.enter, this)), this.$element.on(i + "." + this.type, this.options.selector, a.proxy(this.leave, this)) } } this.options.selector ? this._options = a.extend({}, this.options, { trigger: "manual", selector: "" }) : this.fixTitle() }, b.prototype.getDefaults = function () { return b.DEFAULTS }, b.prototype.getOptions = function (b) { return b = a.extend({}, this.getDefaults(), this.$element.data(), b), b.delay && "number" == typeof b.delay && (b.delay = { show: b.delay, hide: b.delay }), b }, b.prototype.getDelegateOptions = function () { var b = {}, c = this.getDefaults(); return this._options && a.each(this._options, function (a, d) { c[a] != d && (b[a] = d) }), b }, b.prototype.enter = function (b) { var c = b instanceof this.constructor ? b : a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs." + this.type); return clearTimeout(c.timeout), c.hoverState = "in", c.options.delay && c.options.delay.show ? void (c.timeout = setTimeout(function () { "in" == c.hoverState && c.show() }, c.options.delay.show)) : c.show() }, b.prototype.leave = function (b) { var c = b instanceof this.constructor ? b : a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs." + this.type); return clearTimeout(c.timeout), c.hoverState = "out", c.options.delay && c.options.delay.hide ? void (c.timeout = setTimeout(function () { "out" == c.hoverState && c.hide() }, c.options.delay.hide)) : c.hide() }, b.prototype.show = function () { var b = a.Event("show.bs." + this.type); if (this.hasContent() && this.enabled) { if (this.$element.trigger(b), b.isDefaultPrevented()) return; var c = this, d = this.tip(); this.setContent(), this.options.animation && d.addClass("fade"); var e = "function" == typeof this.options.placement ? this.options.placement.call(this, d[0], this.$element[0]) : this.options.placement, f = /\s?auto?\s?/i, g = f.test(e); g && (e = e.replace(f, "") || "top"), d.detach().css({ top: 0, left: 0, display: "block" }).addClass(e), this.options.container ? d.appendTo(this.options.container) : d.insertAfter(this.$element); var h = this.getPosition(), i = d[0].offsetWidth, j = d[0].offsetHeight; if (g) { var k = this.$element.parent(), l = e, m = document.documentElement.scrollTop || document.body.scrollTop, n = "body" == this.options.container ? window.innerWidth : k.outerWidth(), o = "body" == this.options.container ? window.innerHeight : k.outerHeight(), p = "body" == this.options.container ? 0 : k.offset().left; e = "bottom" == e && h.top + h.height + j - m > o ? "top" : "top" == e && h.top - m - j < 0 ? "bottom" : "right" == e && h.right + i > n ? "left" : "left" == e && h.left - i < p ? "right" : e, d.removeClass(l).addClass(e) } var q = this.getCalculatedOffset(e, h, i, j); this.applyPlacement(q, e), this.hoverState = null; var r = function () { c.$element.trigger("shown.bs." + c.type) }; a.support.transition && this.$tip.hasClass("fade") ? d.one(a.support.transition.end, r).emulateTransitionEnd(150) : r() } }, b.prototype.applyPlacement = function (b, c) { var d, e = this.tip(), f = e[0].offsetWidth, g = e[0].offsetHeight, h = parseInt(e.css("margin-top"), 10), i = parseInt(e.css("margin-left"), 10); isNaN(h) && (h = 0), isNaN(i) && (i = 0), b.top = b.top + h, b.left = b.left + i, a.offset.setOffset(e[0], a.extend({ using: function (a) { e.css({ top: Math.round(a.top), left: Math.round(a.left) }) } }, b), 0), e.addClass("in"); var j = e[0].offsetWidth, k = e[0].offsetHeight; if ("top" == c && k != g && (d = !0, b.top = b.top + g - k), /bottom|top/.test(c)) { var l = 0; b.left < 0 && (l = -2 * b.left, b.left = 0, e.offset(b), j = e[0].offsetWidth, k = e[0].offsetHeight), this.replaceArrow(l - f + j, j, "left") } else this.replaceArrow(k - g, k, "top"); d && e.offset(b) }, b.prototype.replaceArrow = function (a, b, c) { this.arrow().css(c, a ? 50 * (1 - a / b) + "%" : "") }, b.prototype.setContent = function () { var a = this.tip(), b = this.getTitle(); a.find(".tooltip-inner")[this.options.html ? "html" : "text"](b), a.removeClass("fade in top bottom left right") }, b.prototype.hide = function () { function b() { "in" != c.hoverState && d.detach(), c.$element.trigger("hidden.bs." + c.type) } var c = this, d = this.tip(), e = a.Event("hide.bs." + this.type); return this.$element.trigger(e), e.isDefaultPrevented() ? void 0 : (d.removeClass("in"), a.support.transition && this.$tip.hasClass("fade") ? d.one(a.support.transition.end, b).emulateTransitionEnd(150) : b(), this.hoverState = null, this) }, b.prototype.fixTitle = function () { var a = this.$element; (a.attr("title") || "string" != typeof a.attr("data-original-title")) && a.attr("data-original-title", a.attr("title") || "").attr("title", "") }, b.prototype.hasContent = function () { return this.getTitle() }, b.prototype.getPosition = function () { var b = this.$element[0]; return a.extend({}, "function" == typeof b.getBoundingClientRect ? b.getBoundingClientRect() : { width: b.offsetWidth, height: b.offsetHeight }, this.$element.offset()) }, b.prototype.getCalculatedOffset = function (a, b, c, d) { return "bottom" == a ? { top: b.top + b.height, left: b.left + b.width / 2 - c / 2 } : "top" == a ? { top: b.top - d, left: b.left + b.width / 2 - c / 2 } : "left" == a ? { top: b.top + b.height / 2 - d / 2, left: b.left - c } : { top: b.top + b.height / 2 - d / 2, left: b.left + b.width } }, b.prototype.getTitle = function () { var a, b = this.$element, c = this.options; return a = b.attr("data-original-title") || ("function" == typeof c.title ? c.title.call(b[0]) : c.title) }, b.prototype.tip = function () { return this.$tip = this.$tip || a(this.options.template) }, b.prototype.arrow = function () { return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow") }, b.prototype.validate = function () { this.$element[0].parentNode || (this.hide(), this.$element = null, this.options = null) }, b.prototype.enable = function () { this.enabled = !0 }, b.prototype.disable = function () { this.enabled = !1 }, b.prototype.toggleEnabled = function () { this.enabled = !this.enabled }, b.prototype.toggle = function (b) { var c = b ? a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs." + this.type) : this; c.tip().hasClass("in") ? c.leave(c) : c.enter(c) }, b.prototype.destroy = function () { clearTimeout(this.timeout), this.hide().$element.off("." + this.type).removeData("bs." + this.type) }; var c = a.fn.tooltip; a.fn.tooltip = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.tooltip"), f = "object" == typeof c && c; (e || "destroy" != c) && (e || d.data("bs.tooltip", e = new b(this, f)), "string" == typeof c && e[c]()) }) }, a.fn.tooltip.Constructor = b, a.fn.tooltip.noConflict = function () { return a.fn.tooltip = c, this } }(jQuery), +function (a) { "use strict"; var b = function (a, b) { this.init("popover", a, b) }; if (!a.fn.tooltip) throw new Error("Popover requires tooltip.js"); b.DEFAULTS = a.extend({}, a.fn.tooltip.Constructor.DEFAULTS, { placement: "right", trigger: "click", content: "", template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>' }), b.prototype = a.extend({}, a.fn.tooltip.Constructor.prototype), b.prototype.constructor = b, b.prototype.getDefaults = function () { return b.DEFAULTS }, b.prototype.setContent = function () { var a = this.tip(), b = this.getTitle(), c = this.getContent(); a.find(".popover-title")[this.options.html ? "html" : "text"](b), a.find(".popover-content")[this.options.html ? "string" == typeof c ? "html" : "append" : "text"](c), a.removeClass("fade top bottom left right in"), a.find(".popover-title").html() || a.find(".popover-title").hide() }, b.prototype.hasContent = function () { return this.getTitle() || this.getContent() }, b.prototype.getContent = function () { var a = this.$element, b = this.options; return a.attr("data-content") || ("function" == typeof b.content ? b.content.call(a[0]) : b.content) }, b.prototype.arrow = function () { return this.$arrow = this.$arrow || this.tip().find(".arrow") }, b.prototype.tip = function () { return this.$tip || (this.$tip = a(this.options.template)), this.$tip }; var c = a.fn.popover; a.fn.popover = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.popover"), f = "object" == typeof c && c; (e || "destroy" != c) && (e || d.data("bs.popover", e = new b(this, f)), "string" == typeof c && e[c]()) }) }, a.fn.popover.Constructor = b, a.fn.popover.noConflict = function () { return a.fn.popover = c, this } }(jQuery), +function (a) { "use strict"; function b(c, d) { var e, f = a.proxy(this.process, this); this.$element = a(a(c).is("body") ? window : c), this.$body = a("body"), this.$scrollElement = this.$element.on("scroll.bs.scroll-spy.data-api", f), this.options = a.extend({}, b.DEFAULTS, d), this.selector = (this.options.target || (e = a(c).attr("href")) && e.replace(/.*(?=#[^\s]+$)/, "") || "") + " .nav li > a", this.offsets = a([]), this.targets = a([]), this.activeTarget = null, this.refresh(), this.process() } b.DEFAULTS = { offset: 10 }, b.prototype.refresh = function () { var b = this.$element[0] == window ? "offset" : "position"; this.offsets = a([]), this.targets = a([]); { var c = this; this.$body.find(this.selector).map(function () { var d = a(this), e = d.data("target") || d.attr("href"), f = /^#./.test(e) && a(e); return f && f.length && f.is(":visible") && [[f[b]().top + (!a.isWindow(c.$scrollElement.get(0)) && c.$scrollElement.scrollTop()), e]] || null }).sort(function (a, b) { return a[0] - b[0] }).each(function () { c.offsets.push(this[0]), c.targets.push(this[1]) }) } }, b.prototype.process = function () { var a, b = this.$scrollElement.scrollTop() + this.options.offset, c = this.$scrollElement[0].scrollHeight || this.$body[0].scrollHeight, d = c - this.$scrollElement.height(), e = this.offsets, f = this.targets, g = this.activeTarget; if (b >= d) return g != (a = f.last()[0]) && this.activate(a); if (g && b <= e[0]) return g != (a = f[0]) && this.activate(a); for (a = e.length; a--;) g != f[a] && b >= e[a] && (!e[a + 1] || b <= e[a + 1]) && this.activate(f[a]) }, b.prototype.activate = function (b) { this.activeTarget = b, a(this.selector).parentsUntil(this.options.target, ".active").removeClass("active"); var c = this.selector + '[data-target="' + b + '"],' + this.selector + '[href="' + b + '"]', d = a(c).parents("li").addClass("active"); d.parent(".dropdown-menu").length && (d = d.closest("li.dropdown").addClass("active")), d.trigger("activate.bs.scrollspy") }; var c = a.fn.scrollspy; a.fn.scrollspy = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.scrollspy"), f = "object" == typeof c && c; e || d.data("bs.scrollspy", e = new b(this, f)), "string" == typeof c && e[c]() }) }, a.fn.scrollspy.Constructor = b, a.fn.scrollspy.noConflict = function () { return a.fn.scrollspy = c, this }, a(window).on("load", function () { a('[data-spy="scroll"]').each(function () { var b = a(this); b.scrollspy(b.data()) }) }) }(jQuery), +function (a) { "use strict"; var b = function (b) { this.element = a(b) }; b.prototype.show = function () { var b = this.element, c = b.closest("ul:not(.dropdown-menu)"), d = b.data("target"); if (d || (d = b.attr("href"), d = d && d.replace(/.*(?=#[^\s]*$)/, "")), !b.parent("li").hasClass("active")) { var e = c.find(".active:last a")[0], f = a.Event("show.bs.tab", { relatedTarget: e }); if (b.trigger(f), !f.isDefaultPrevented()) { var g = a(d); this.activate(b.parent("li"), c), this.activate(g, g.parent(), function () { b.trigger({ type: "shown.bs.tab", relatedTarget: e }) }) } } }, b.prototype.activate = function (b, c, d) { function e() { f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"), b.addClass("active"), g ? (b[0].offsetWidth, b.addClass("in")) : b.removeClass("fade"), b.parent(".dropdown-menu") && b.closest("li.dropdown").addClass("active"), d && d() } var f = c.find("> .active"), g = d && a.support.transition && f.hasClass("fade"); g ? f.one(a.support.transition.end, e).emulateTransitionEnd(150) : e(), f.removeClass("in") }; var c = a.fn.tab; a.fn.tab = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.tab"); e || d.data("bs.tab", e = new b(this)), "string" == typeof c && e[c]() }) }, a.fn.tab.Constructor = b, a.fn.tab.noConflict = function () { return a.fn.tab = c, this }, a(document).on("click.bs.tab.data-api", '[data-toggle="tab"], [data-toggle="pill"]', function (b) { b.preventDefault(), a(this).tab("show") }) }(jQuery), +function (a) { "use strict"; var b = function (c, d) { this.options = a.extend({}, b.DEFAULTS, d), this.$window = a(window).on("scroll.bs.affix.data-api", a.proxy(this.checkPosition, this)).on("click.bs.affix.data-api", a.proxy(this.checkPositionWithEventLoop, this)), this.$element = a(c), this.affixed = this.unpin = this.pinnedOffset = null, this.checkPosition() }; b.RESET = "affix affix-top affix-bottom", b.DEFAULTS = { offset: 0 }, b.prototype.getPinnedOffset = function () { if (this.pinnedOffset) return this.pinnedOffset; this.$element.removeClass(b.RESET).addClass("affix"); var a = this.$window.scrollTop(), c = this.$element.offset(); return this.pinnedOffset = c.top - a }, b.prototype.checkPositionWithEventLoop = function () { setTimeout(a.proxy(this.checkPosition, this), 1) }, b.prototype.checkPosition = function () { if (this.$element.is(":visible")) { var c = a(document).height(), d = this.$window.scrollTop(), e = this.$element.offset(), f = this.options.offset, g = f.top, h = f.bottom; "top" == this.affixed && (e.top += d), "object" != typeof f && (h = g = f), "function" == typeof g && (g = f.top(this.$element)), "function" == typeof h && (h = f.bottom(this.$element)); var i = null != this.unpin && d + this.unpin <= e.top ? !1 : null != h && e.top + this.$element.height() >= c - h ? "bottom" : null != g && g >= d ? "top" : !1; if (this.affixed !== i) { this.unpin && this.$element.css("top", ""); var j = "affix" + (i ? "-" + i : ""), k = a.Event(j + ".bs.affix"); this.$element.trigger(k), k.isDefaultPrevented() || (this.affixed = i, this.unpin = "bottom" == i ? this.getPinnedOffset() : null, this.$element.removeClass(b.RESET).addClass(j).trigger(a.Event(j.replace("affix", "affixed"))), "bottom" == i && this.$element.offset({ top: c - h - this.$element.height() })) } } }; var c = a.fn.affix; a.fn.affix = function (c) { return this.each(function () { var d = a(this), e = d.data("bs.affix"), f = "object" == typeof c && c; e || d.data("bs.affix", e = new b(this, f)), "string" == typeof c && e[c]() }) }, a.fn.affix.Constructor = b, a.fn.affix.noConflict = function () { return a.fn.affix = c, this }, a(window).on("load", function () { a('[data-spy="affix"]').each(function () { var b = a(this), c = b.data(); c.offset = c.offset || {}, c.offsetBottom && (c.offset.bottom = c.offsetBottom), c.offsetTop && (c.offset.top = c.offsetTop), b.affix(c) }) }) }(jQuery);
+
<font size=4 color=##686572> Click on the picture to learn more about this.</p> </font>
-
    </script>
+
-
    <script lang="JavaScript">
+
-
        $(document).ready(function () {/* activate sidebar */
+
<center><a href="https://2014.igem.org/Team:Virtus-Parva_Mexico/Modeling"><img src= https://static.igem.org/mediawiki/2014/1/17/Virtus_Parva_Alejos_Diego_Modelado.jpg size width=700px ></a> </center>
-
            $('#sidebar').affix({
+
                 </div>
-
                offset: {
+
-
                    top: 235
+
-
                 }
+
-
            });
+
-
            /* activate scrollspy menu */
+
                    </div></td><td width="162px" bgColor="#ffbc67"></td></tr>
-
            var $body = $(document.body);
+
-
            var navHeight = $('.navbar').outerHeight(true) + 10;
+
-
            $body.scrollspy({
 
-
                target: '#leftCol',
 
-
                offset: navHeight
 
-
            });
 
-
            /* smooth scrolling sections */
+
 
-
            $('a[href*=#]:not([href=#])').click(function () {
+
 
-
                if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
+
 
-
                    var target = $(this.hash);
+
<!--  Block of content 3 -->
-
                    target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
+
<table width="100%"  cellspacing="0" height="100px" border="0">
-
                    if (target.length) {
+
<tr>
-
                        $('html,body').animate({
+
<td  bgColor="#FFFFFF"></td>
-
                            scrollTop: target.offset().top - 50
+
<td width="975px" align="center" bgColor="#FFFFFF" >
-
                        }, 1000);
+
 
-
                        return false;
+
<table  width="975px"  cellspacing="0" height="100px" border="0">
-
                    }
+
<tr>
-
                }
+
<td width="95%" bgColor="#FFFFFF"  rowspan="3" align="center">
-
             });
+
<a href="http://www.luisartphotography.com/"><img src="https://static.igem.org/mediawiki/2014/e/e4/Virtus_Parva-P1.jpg"/></img></a>
-
         });
+
<a href="https://www.facebook.com/pages/Mesa-Directiva-de-Ciencias-Qu%C3%ADmico-Biol%C3%B3gicas-UDLAP/560508417305601?ref=ts&fref=ts"><img src="https://static.igem.org/mediawiki/2014/e/ef/Virtus_Parva-P2.jpg"/></img></a>
-
     </script>
+
<a href="http://www.concytep.puebla.gob.mx/"><img src="https://static.igem.org/mediawiki/2014/4/45/Virtus_Parva-P3.jpg"/></img></a>
 +
<a href="http://www.udlap.mx/home.aspx"><img src="https://static.igem.org/mediawiki/2014/7/7e/Virtus_Parva-P4.jpg"/></img></a>
 +
</td> 
 +
 
 +
 
 +
<!-- This is the back to top section -->
 +
<td bgColor=#FFFFFF></td>
 +
<tr><td bgColor=FFFFFF></td></tr>
 +
<tr><td  height="22px" width="48px" align="center"></td></tr>
 +
</table>
 +
 
 +
</td>
 +
<td></td>
 +
</table>
 +
<!-- end of Block-->
 +
 
 +
</div>
 +
             <!--/right-->
 +
         </div>
 +
        <!--/row-->
 +
     </div>
 +
    <!--/container-->
 +
 
</body>
</body>
</html>
</html>

Latest revision as of 03:27, 18 October 2014



The Bio-NEMS drill

The Next Generation in Molecular Machinery





What is it that we do?

The Bio-NEMS drill is the project that we, a group of nanotechnologists have

been working on for almost a year. What started as an idea, became a big part

of our everyday lives and we have done our best to nurture it and watch it grown.

We have prepared different aspects of the project through hard work and it is

our hope that our legacy may continue.



Project Overview

Virtus-Parva is a team of Nanotechnology students who aim to create a better world through love,sympathy and endearment… and through the design and development of a novel technology based on micrometric “drills” that can penetrate diverse organisms.

First and foremost, we studied different procedures in order to synthesize the strongest and smallest nanoparticles we could make. Magnetite is a molecule that derives from iron, and has observable magnetic properties. Because we wanted to put together magnetite and DNA, we had to make them compatible,thrpugh deifferent chemical procedures to allow the binding of this DNa into the particle. At the same time, our biology team was busy extracting, purifying and transforming E. coli DNA to work with. We achieved coiling DNA to nanoparticles. The “Magnetic-DNA” complex we created mimics the nucleosome in DNA supercoiling process. This allows us to have a DNA “chromatin-like” with a magnetic core.

Combining magnetite, and DNA, we are building magnetic-core machines, which can be controlled through external electrical impulses. Because of the shape of our system, it is possible for it to have linear movement depending on the frequency applied to it, which has several potential applications. The main one was to make it a resonator which was our module one. Yet, the project did not stop there. We built a DNA carrier, therefore we started a process to enhance

As we were transforming our E. coli cells, we noticed it wasn’t as fast and efficient as we had hoped, which is how we came up with module two of the project. Quite simply, we wanted to take advantage of the shape of our system and its mobility thanks to magnetism in order to make a more efficient transformation. We were able to verify our method was more efficient by making cells express GFP and RFP, which can then be quantified with optic instruments.




The Idea

The basis for these “drills” will be NEMS, nano electro-mechanical systems, technology.
We took a survey to fellow iGEMers and external people in order to find out how many people knew about the existence of NEMS and if they knew how they worked. Turns out only 36% of survey takers had heard of the term before and of those, only 28% knew what it was!

Given these statistics, it became part of our project to teach newer generations about our subject.

NEMS

NEMS are nanometric electromechanical systems. In this case we take as basis the structure of a resonator which are engineered to make a conversión between energy, such as electric, magnetic, or vibrational into mechanical response.

How exactly do NEMS come into play in our project?

Well, by combining an inorganically synthesized nanoparticle, called magnetite and DNA into what we call BioNEMS drill.

DNA Coiling

Naturally, and as part of the process of transcription DNA is wrapped around protein molecules called histones. The combined loop of DNA and protein is called nucleosome, and this nucleosome is going to be packed into a thread. Our objective was to insert magnetite into this system, in order to convert it into a NEMS and be able to control DNA’s movement using an external stimuli.





The Making

The most important part of our project was the time that we dedicated to seeing results in our lab. Admittedly, it was tough, for we had to do everything in our own time and we had only occasional help from our instructors, for the most part we did everything on our own. Despite all of the size of the challenge, our team rose up to the occasion and in the end all those hours we dedicated in the lab were worth it. Here you can see a short description of what all the things we did in our lab, for a more detailed description check our notebook section.

Inorganic Section

The first part of the synthesis of our magnetite was trying out different methods and characterizing them, to note which method had given us the smallest size nanoparticles. Our first method was synthesis by coprecipitation, of which we prepared nine samples with different concentrations of iron(II) chloride and ammonium hydroxide; from this method we consistently obtained nanoparticles rounding 0.9 to 1nm. Our following method was very similar, but included water in the synthesis: the size of our particles would vary greatly, from 3.89 micrometers to 171 nanometers in size.

After choosing the best method possible, it was time to silanize our magnetite in order for it to be biocompatible with DNA and be able to tie them together. In order for the silanization to take place, we used a solution of TEOS (tetraethoxysilane) dispersed in a medium of water and propanol and dripped this mix slowly onto our magnetite. Just like when we synthesized our particles, we tested different concentrations of TEOS and magnetite, as well as different addition rates in order to observe which combination would give us the smallest possible nanoparticles.

Our results were then characterized by DLS (dynamic light scattering), for which we observed a peak at 39 nm, once coated with TEOS, the peak was moved toward 60 and 80 nm. We also ran our two samples in the IR, comparing the spectra of the pure magnetite and silanized magnetite, we were able to distinguish a peak at 990.2 cm-1 corresponding to a Si-O bond, confirming the correct silanization of the magnetite.



Biological Section

Having done this, we then prepped our protein by resuspending it in a mix of Tris/acetate and EDTA in order to be able to combine it with our DNA. Then we dispersed our magnetite in anhydric toluene and we added the resuspended protein and we added as well some glutaraldehyde as a coupling agent. We also made some batches without any glutaraldehyde, to compare the comparable strength of their bonds.

We then needed to grow and then extract from E. Coli the DNA we were to use for the rest of our project. We tested two different methods: one of which was the well-known mini prep and the other was very similar but without using an enzyme. Using the DNA we have extracted, we then needed to transform these cells to make competent cells.

These cells we had transformed, we then had to purify, by precipitating in presence of ethanol and centrifugation to eliminate supernatant. We did different dilutions of DNA and combined them with our protein, HU. These as well were divided again in gluteraldehyde and no gluteraldehyde and subsecuently in DNA and not DNA. We did some UV characterization for all samples. We discovered that the solutions with glutaraldehyde had stronger bonds between DNA and HU. We prepared some samples: one with glutaraldehyde and DNA-Hu, another just with glutaraldehyde and DNA, the third one just with DNA-HU and the last one just with DNA and prepared them with nanoparticles and ran them through UV.





The Math behind

The first approach to the project in order for it to become feasible was the mathematical model: the number that told us how right or wrong our ideas were. We invite you to visit our modelling page, and find out a lot more about the Bio-NEMS drill and its behaviour. Click on the picture to learn more about this.

Retrieved from "http://2014.igem.org/Team:Virtus-Parva_Mexico/Project"