Difference between revisions of "Team:Dundee/home19"

 
(148 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
{{:Team:Dundee/style.css}}
 
−
{{Team:Dundee/bs.css}}
 
−
 
 
<html>
 
<html>
−
  <head>
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
−
    <title>Dundee iGEM 2015</title>
+
 
−
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
 
−
    <!-- CSS and JS -->
+
−
    <link href="css/bootstrap.css" rel="stylesheet">
+
−
    <link href="css/style.css" rel="stylesheet">
+
−
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
+
−
    <link href="css/bootstrap-lightbox.css" rel="stylesheet" type="text/css"/>
+
−
    <script src="js/jquery.js"></script>
+
  
−
  </head>
 
−
  <body>
 
−
  <div id="page-wrap">
 
 
     <header>
 
     <header>
 
     <a class="anchor" id="top"></a>
 
     <a class="anchor" id="top"></a>
−
      <div class="container">
 
 
         <center>
 
         <center>
−
             <h1><img src="img/csi-dundee.png" alt="CSI:Dundee"</h1>
+
             <h1><highlight class="highlight">CSI: DUNDEE</highlight></h1>
−
             <h3><img src="img/the-forensic-toolkit.png" alt="The Forensic Toolkit"</h3>
+
             <h3><highlight class="highlight">The Forensic Toolkit</highlight></h3>
−
          <div style="margin-top:30px;">
+
            <a href="https://2015.igem.org/Team:Dundee/intro_video" class="btn btn-primary btn-lg">Watch Our Introduction Video</a>
−
 
+
−
<!---
+
−
                  <a href="#" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#videoModal" data-theVideo="video/Episode 1.mp4" >Watch Our Introduction Video</a>
+
−
 
+
−
<div class="modal fade" id="videoModal" tabindex="-1" role="dialog" aria-labelledby="videoModal" aria-hidden="true">
+
−
  <div class="modal-dialog">
+
−
    <div class="modal-content">
+
−
      <div class="modal-body">
+
−
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+
−
        <div>
+
−
          <iframe width="100%" height="350" src=""></iframe>
+
−
        </div>
+
−
      </div>
+
−
    </div>
+
−
  </div>
+
−
</div>
+
−
 
+
−
-->
+
−
 
+
 
         </center>
 
         </center>
−
       </div>
+
       </header>
−
    </header>
+
−
 
+
−
    <div id="nav">
+
−
    <nav class="navbar navbar-default navbar-static affix-top" role="navigation">
+
−
      <!-- Brand and toggle get grouped for better mobile display -->
+
−
      <div class="container">
+
−
      <div class="navbar-header">
+
−
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+
−
          <span class="sr-only">Toggle navigation</span>
+
−
          <span class="icon-bar"></span>
+
−
          <span class="icon-bar"></span>
+
−
          <span class="icon-bar"></span>
+
−
        </button>
+
−
          <a class="navbar-brand" href="#"><img src="img/uod_crest.png" style="width:auto; height:20px;"> University of Dundee</a>
+
−
      </div>
+
−
 
+
−
 
+
−
      <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
−
        <ul class="nav navbar-nav">
+
−
        </ul>
+
−
        <ul class="nav navbar-nav navbar-right">
+
−
          <li><a href="index.html">Home</a></li>
+
−
          <!-- Team -->
+
−
          <li class="dropdown">
+
−
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Team</a>
+
−
            <ul class="dropdown-menu" style="left:0">
+
−
              <li><a href="#">Action</a></li>
+
−
              <li><a href="#">Another action</a></li>
+
−
              <li><a href="#">Something else</a></li>
+
−
              <li class="divider"></li>
+
−
              <li><a href="#">Separated link</a></li>
+
−
            </ul>
+
−
          </li>
+
−
          <!--- Project-->
+
−
          <!--<li><a href="project.html">Project</a></li>-->
+
−
          <li class="dropdown">
+
−
            <a href="project.html" class="dropdown-toggle" data-toggle="dropdown">Project</a>
+
−
            <ul class="dropdown-menu" style="left:0">
+
−
              <li><a href="#">Abstract</a></li>
+
−
              <li><a href="#">Data</a></li>
+
−
              <li><a href="#">Lab Book</a></li>
+
−
              <li><a href="#">Parts</a></li>
+
−
              <li class="divider"></li>
+
−
              <li><a href="#">Future Work</a></li>
+
−
            </ul>
+
−
          </li>
+
−
          <!-- wetlab -->
+
−
          <li class="dropdown">
+
−
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Wetlab</a>
+
−
            <ul class="dropdown-menu" style="left:0">
+
−
              <li><a href="#">Action</a></li>
+
−
              <li><a href="#">Another action</a></li>
+
−
              <li><a href="#">Something else</a></li>
+
−
              <li class="divider"></li>
+
−
              <li><a href="#">Separated link</a></li>
+
−
            </ul>
+
−
          </li>
+
−
          <!--- modelling -->
+
−
          <li class="dropdown">
+
−
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Modelling</a>
+
−
            <ul class="dropdown-menu" style="left:0">
+
−
              <li><a href="#">Action</a></li>
+
−
              <li><a href="#">Another action</a></li>
+
−
              <li><a href="#">Something else</a></li>
+
−
              <li class="divider"></li>
+
−
              <li><a href="#">Separated link</a></li>
+
−
            </ul>
+
−
          </li>
+
−
          <!-- outreach -->
+
−
          <li class="dropdown">
+
−
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Outreach</a>
+
−
            <ul class="dropdown-menu" style="left:0">
+
−
              <li><a href="#">Action</a></li>
+
−
              <li><a href="#">Another action</a></li>
+
−
              <li><a href="#">Something else</a></li>
+
−
              <li class="divider"></li>
+
−
              <li><a href="#">Separated link</a></li>
+
−
            </ul>
+
−
          </li>
+
−
        </ul>
+
−
      </div><!-- /.navbar-collapse -->
+
−
    </div>
+
−
    </nav>
+
−
  </div>
+
−
 
+
  
 +
<div class="ribbon">
 +
 
<!-- button navigation -->
 
<!-- button navigation -->
 
<a class="anchor" id="selection"></a>
 
<a class="anchor" id="selection"></a>
−
     <section id="about" class="container">
+
     <section id="about" class="row1">    
 
       <div class="row">
 
       <div class="row">
−
         <div class="col-md-3">
+
         <div class="col-lg-4">
−
           <a href="#section1" class="scroll"><span class="glyphicon glyphicon-briefcase"></span></a> <br>
+
           <a href="#section1" class="scroll"><span class="glyphicon glyphicon-briefcase"></span></a>  
 
           <h3>Forensic Toolkit</h3>
 
           <h3>Forensic Toolkit</h3>
−
           <p class="about-content">A collection of synthetically produced compounds to detect various compounds found at a crime scene.</p>
+
           <p class="about-content">Our forensic toolkit, most importantly, puts science first. Through the use of synthetic biology technologies, our project has aimed to lay the foundations for the development of a set of new and improved forensic methods.</p>
 
         </div>
 
         </div>
−
         <div class="col-md-3">
+
         <div class="col-lg-4">
−
           <a href="#section2"><span class="glyphicon glyphicon-search" type="button" ></span></a> <br>
+
           <a href="#section2"><span class="glyphicon glyphicon-search" type="button"></span></a>
−
           <h3>This bit</h3>
+
           <h3>Outreach</h3>
−
           <p class="about-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur a tincidunt elit. Aliquam porta nibh at enim luctus, auctor consequat dolor vehicula.</p>
+
           <p class="about-content">In order to gain a deeper insight into the field of forensics, we liaised with a diverse mix of professionals, from criminal lawyers to crime writers, who kindly shared with us their advice and expertise.</p>
 
         </div>
 
         </div>
−
         <div class="col-md-3">
+
         <div class="col-lg-4">
−
           <a href="#section3"><span class="glyphicon glyphicon-eye-open"></span></a> <br>
+
           <a href="#section3"><span class="glyphicon glyphicon-eye-open"></span></a>  
−
           <h3>Another bit</h3>
+
           <h3>About Us</h3>
−
           <p class="about-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur a tincidunt elit. Aliquam porta nibh at enim luctus, auctor consequat dolor vehicula.</p>
+
           <p class="about-content">We are an enthusiastic group of Dundee University students who are studying a mix of subjects. We are all united by our shared passion for scientific research and the chance to create something that could really make a difference!</p>
−
        </div>
+
−
        <div class="col-md-3">
+
−
          <a href="#section4"><span class="glyphicon glyphicon-user"></span></a> <br>
+
−
          <h3>Find the bad guy</h3>
+
−
          <p class="about-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur a tincidunt elit. Aliquam porta nibh at enim luctus, auctor consequat dolor vehicula.</p>
+
 
         </div>
 
         </div>
 
       </div>
 
       </div>
Line 160: Line 40:
 
<a class="anchor" id="section1"></a>
 
<a class="anchor" id="section1"></a>
 
     <section id="about3">
 
     <section id="about3">
−
       <div class="container">
+
       <div class="row2">
 
         <div class="row">
 
         <div class="row">
 
           <div class="col-md-6">
 
           <div class="col-md-6">
Line 171: Line 51:
 
               </div>
 
               </div>
 
               <div class="col-md-10">
 
               <div class="col-md-10">
−
                 <h4>What it does</h4>
+
                 <h4>BIOSPRAY</h4>
−
                 Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.
+
                 Distinction between different body fluids at a crime scene currently requires the use of numerous time consuming methods. Our BioSpray aims to provide an efficient, all in one solution that can be used to detect and distinguish between body fluids based on fluorescent nanobead technology in combination with synthetic biology.
 
               </div>
 
               </div>
 
             </div>
 
             </div>
Line 180: Line 60:
 
               </div>
 
               </div>
 
               <div class="col-md-10">
 
               <div class="col-md-10">
−
                 <h4>How it does this</h4>
+
                 <h4>FINGERPRINT AGING</h4>
−
                 Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.
+
                 One of the biggest challenges currently facing forensic scientists is the ability to determine the age of fingerprints left at crime scenes. This is due to the extensive range of factors which affect fingerprint composition therefore, through the use of complex mathematical modelling, we hope to identify a potential target within fingerprints that could be reliably targeted using synthetic biology and correlated to an appropriate time scale.
 
               </div>
 
               </div>
 
             </div>
 
             </div>
Line 189: Line 69:
 
               </div>
 
               </div>
 
               <div class="col-md-10">
 
               <div class="col-md-10">
−
                 <h4>Uses</h4>
+
                 <h4>CHROMATE SENSOR</h4>
−
                 Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.
+
                 Crime cases which involve cut marks being left on bones are, at present, examined solely by visual methods such as microscopy. Although these methods provide powerful evidence, there is no chemical test currently in place which is used to detect residue deposited on bone by implements used during a crime. Such information may prove useful in establishing the nature of the weapon used as well as locating fine cuts that may go unnoticed during post mortem examination.
 
               </div>
 
               </div>
 
             </div>
 
             </div>
Line 196: Line 76:
 
           </div>
 
           </div>
 
         </div>
 
         </div>
−
         <a style="margin-top:0px" href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
+
         <a href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
 
       </div>
 
       </div>
 
     </section>
 
     </section>
  
−
    <!--
 
−
   
 
  
 
<a class="anchor" id="section2"></a>
 
<a class="anchor" id="section2"></a>
 
     <section id="about3">
 
     <section id="about3">
−
       <div class="container">
+
       <div class="row3">
 
         <div class="row">
 
         <div class="row">
 
           <div class="">
 
           <div class="">
Line 212: Line 90:
 
           <div class="col-md-6 feature" style="">
 
           <div class="col-md-6 feature" style="">
 
             <div class="row">
 
             <div class="row">
−
                 <h4>What it does</h4>
+
                 <h4>WHO DID WE MEET?</h4>
−
                 <p>Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis. </p>
+
                 <p>We have been lucky enough to have held several fantastic interviews throughout the summer with a range of professionals who helped give invaluable insight into the field of forensic science in many different contexts.</p>
−
                 <h4> How it does this </h4>
+
                 <h4>WHAT DID WE LEARN?</h4>
−
                 <p>Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.</p>
+
                 <p>It became apparent from our early meetings that Forensic Science is a field which is largely founded on the basis of expert interpretation rather being subject to robust scientific scrutiny. Our science first approach offers an exciting alternative in terms of how investigative forensic tools are developed. Our hope is that this can help to improve the efficiency of existing techniques as well as lead to the production of brand new methods.</p>
 
               </div>             
 
               </div>             
 
               <a href="" class="btn btn-primary btn-lg pull-right" role="button">Learn more</a>
 
               <a href="" class="btn btn-primary btn-lg pull-right" role="button">Learn more</a>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
−
             <a style="margin-top:0px" href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
+
             <a href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
 
       </div>
 
       </div>
 
     </section>
 
     </section>
Line 227: Line 105:
 
<a class="anchor" id="section3"></a>
 
<a class="anchor" id="section3"></a>
 
  <section id="about3">
 
  <section id="about3">
−
       <div class="container">
+
       <div class="row4">
 
         <div class="row">
 
         <div class="row">
 
           <div class="col-md-6">
 
           <div class="col-md-6">
Line 235: Line 113:
 
             <div class="row">
 
             <div class="row">
 
               <div class="col-md-12">
 
               <div class="col-md-12">
−
                 <h4>What it does</h4>
+
                 <h4>WHO ARE WE?</h4>
−
                 Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.Praesent gravida justo quis faucibus vulputate.
+
                 We are a mix of third and fourth year undergraduate students with backgrounds in Life Sciences, Physics and Mathematics. To find out more about us individually, visit our Team page.
−
                <br>
+
−
                <br>
+
−
                <h4>blalglglglgl</h4>
+
−
                Cras hendrerit varius dui, a molestie ligula imperdiet quis.Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.
+
 
               </div>
 
               </div>
 
             </div>
 
             </div>
Line 246: Line 120:
 
           </div>
 
           </div>
 
         </div>
 
         </div>
−
         <a style="margin-top:0px" href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
+
         <a href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
 
       </div>
 
       </div>
 
     </section>
 
     </section>
  
−
<a class="anchor" id="section4"></a>
+
</div>
−
    <section id="about3">
+
−
      <div class="container">
+
−
        <div class="row">
+
−
          <div class="">
+
−
              <img src="img/igem-sponsor.png" align="right" width="50%" height="auto" class="img-mockup">
+
−
              </div>
+
−
          <div class="col-md-6 feature" style="">
+
−
            <div class="row">
+
−
                <h4>What it does</h4>
+
−
                <p>Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis. </p>
+
−
                <h4> How it does this </h4>
+
−
                <p>Praesent gravida justo quis faucibus vulputate. Cras hendrerit varius dui, a molestie ligula imperdiet quis.</p>
+
−
              </div>           
+
−
              <a href="" class="btn btn-primary btn-lg pull-right" role="button">Learn more</a>
+
−
              </div>
+
−
            </div>
+
−
            <a style="margin-top:0px" href="#selection" class="btn btn-info btn-md pull-right" role="button">&uarr;</a>
+
−
      </div>
+
−
    </section>
+
  
−
    -->
 
  
−
  <section id="sponsor">
+
<script type="text/javascript">
−
    <div class="container">
+
  $(document).ready(function(){
−
      <div class="row">
+
  $('a[href^="#"]').on('click',function (e) {
−
        <div class="col-md-3">
+
       e.preventDefault();
−
          <img class="igem-sponsor" src="./img/igem-sponsor.png">
+
−
        </div>
+
−
        <div class="col-md-3">
+
−
          <img src="#">
+
−
        </div>
+
−
        <div class="col-md-3">
+
−
          <img src="#">
+
−
        </div>
+
−
        <div class="col-md-3">
+
−
          <img src="#">
+
−
        </div>
+
−
      </div>
+
−
      <h3>Donec sed sapien</h3>
+
−
      Morbi felis lectus, ultricies nec tellus eu, faucibus eleifend lectus. In molestie augue leo, id imperdiet ante imperdiet at. Quisque ultrices neque sit amet felis tincidunt tristique at sed nisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut suscipit ut massa in ultricies. Nunc nec tincidunt nunc, ut consectetur lorem. Sed non justo nisl.
+
−
       <div style="margin-top:40px;">
+
−
        <a href="#" class="btn btn-primary btn-lg" role="button">Watch Our Introduction Video</a>
+
−
        <a href="#top" class="btn btn-info btn-md" role="button">Back to the top</a>
+
−
      </div>
+
−
    </div>
+
−
  </section>
+
  
−
  <footer>
+
       var target = this.hash,
−
    <div class="container">
+
      $target = $(target);
−
       <div class="row">
+
−
        <div class="col-md-3">
+
−
          <h4>Dundee University</h4>
+
−
          <p>Duis viverra suscipit vehicula. Aenean eu massa leo. Sed ullamcorper pretium risus eu scelerisque. Mauris venenatis consequat ultrices. Quisque fringilla sed lacus eu volutpat.</p>
+
−
        </div>
+
−
        <div class="col-md-3">
+
−
          <h4>Social Media</h4>
+
−
          <div class="row">
+
−
            <div class="col-md-1"><span class="fa fa-youtube-play"></span></div>
+
−
            <div class="col-md-10"><a href="http://www.youtube.com/blahblah">youtube.com/blahblah</a></div>
+
−
          </div><br>
+
−
          <div class="row">
+
−
            <div class="col-md-1"><span class="fa fa-facebook-square"></span></div>
+
−
            <div class="col-md-10"><a href="http://www.facebook.com/igemdundee2015">facebook.com/igemdundee2015</a></div>
+
−
          </div><br>
+
−
          <div class="row">
+
−
            <div class="col-md-1"><span class="fa fa-twitter"></span></div>
+
−
            <div class="col-md-10"><a href="http://www.twitter.com/dundeeigemteam">twitter.com/dundeeigemteam</a></div>
+
−
      </div>
+
−
    </div>
+
−
  </footer> 
+
  
−
  <footer id="copyright">
+
       $('html, body').stop().animate({
−
    <p>Dundee University</p>
+
           'scrollTop': $target.offset().top
−
  </footer>
+
      }, 900, 'swing', function () {
−
 
+
          window.location.hash = target;
−
    <script src="js/jquery.js"></script>
+
       });
−
    <script src="js/bootstrap.min.js"></script>
+
−
    <script>
+
−
 
+
−
 
+
−
       $(function() {
+
−
  $('a[href*=#]:not([href=#])').click(function() {
+
−
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
+
−
      var target = $(this.hash);
+
−
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
+
−
      if (target.length) {
+
−
        $('html,body').animate({
+
−
           scrollTop: target.offset().top
+
−
        }, 1000);
+
−
        return false;
+
−
       }
+
−
    }
+
 
   });
 
   });
 
});
 
});
−
 
+
</script>
−
      $(function() {
+
−
  //navbar affix
+
−
  $('#nav').affix({
+
−
    offset: {
+
−
      top: $('header').height()
+
−
    }
+
−
  });
+
−
});
+
−
 
+
−
      $('#nav .navbar-nav li>a').click(function(){
+
−
  var link = $(this).attr('href');
+
−
  var posi = $(link).offset().top+20;
+
−
  $('body,html').animate({scrollTop:posi},700);
+
−
})
+
−
    </script>
+
−
 
+
−
  </div>
+
 
   </body>
 
   </body>
 
</html>
 
</html>
 +
{{:Team:Dundee/navbar}}
 +
{{:Team:Dundee/footer}}

Latest revision as of 13:20, 31 July 2015

CSI: DUNDEE

The Forensic Toolkit

Watch Our Introduction Video

Forensic Toolkit

Our forensic toolkit, most importantly, puts science first. Through the use of synthetic biology technologies, our project has aimed to lay the foundations for the development of a set of new and improved forensic methods.

Outreach

In order to gain a deeper insight into the field of forensics, we liaised with a diverse mix of professionals, from criminal lawyers to crime writers, who kindly shared with us their advice and expertise.

About Us

We are an enthusiastic group of Dundee University students who are studying a mix of subjects. We are all united by our shared passion for scientific research and the chance to create something that could really make a difference!

BIOSPRAY

Distinction between different body fluids at a crime scene currently requires the use of numerous time consuming methods. Our BioSpray aims to provide an efficient, all in one solution that can be used to detect and distinguish between body fluids based on fluorescent nanobead technology in combination with synthetic biology.

FINGERPRINT AGING

One of the biggest challenges currently facing forensic scientists is the ability to determine the age of fingerprints left at crime scenes. This is due to the extensive range of factors which affect fingerprint composition therefore, through the use of complex mathematical modelling, we hope to identify a potential target within fingerprints that could be reliably targeted using synthetic biology and correlated to an appropriate time scale.

CHROMATE SENSOR

Crime cases which involve cut marks being left on bones are, at present, examined solely by visual methods such as microscopy. Although these methods provide powerful evidence, there is no chemical test currently in place which is used to detect residue deposited on bone by implements used during a crime. Such information may prove useful in establishing the nature of the weapon used as well as locating fine cuts that may go unnoticed during post mortem examination.
Learn more
↑

WHO DID WE MEET?

We have been lucky enough to have held several fantastic interviews throughout the summer with a range of professionals who helped give invaluable insight into the field of forensic science in many different contexts.

WHAT DID WE LEARN?

It became apparent from our early meetings that Forensic Science is a field which is largely founded on the basis of expert interpretation rather being subject to robust scientific scrutiny. Our science first approach offers an exciting alternative in terms of how investigative forensic tools are developed. Our hope is that this can help to improve the efficiency of existing techniques as well as lead to the production of brand new methods.

Learn more
↑

WHO ARE WE?

We are a mix of third and fourth year undergraduate students with backgrounds in Life Sciences, Physics and Mathematics. To find out more about us individually, visit our Team page.
Learn more
↑