Difference between revisions of "Team:Imperial College"

Line 1: Line 1:
−
<html>
+
<!DOCTYPE html>
 +
<html lang="en">
 +
 
 
<head>
 
<head>
  
Line 11: Line 13:
  
 
     <!-- Bootstrap Core CSS -->
 
     <!-- Bootstrap Core CSS -->
−
     <link rel="stylesheet" href="https://2016.igem.org/Team:Imperial_College/Resources/CSS:bootstrap.min.css?action=raw&ctype=text/css" type="text/css" />
+
     <link href="css/bootstrap.min.css" rel="stylesheet">
  
 
     <!-- Custom CSS -->
 
     <!-- Custom CSS -->
−
     <link href="https://2016.igem.org/Team:Imperial_College/Resources/CSS:landing-page.css?action=raw&ctype=text/css" rel="text/css">
+
     <link href="css/landing-page.css" rel="stylesheet">
  
 
     <!-- Custom Fonts -->
 
     <!-- Custom Fonts -->
−
     <link href="https://2016.igem.org/Team:Imperial_College/Resources/Font-Awesome:font-awesome.min.css?action=raw&ctype=text/css" rel="stylesheet" type="text/css">
+
     <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
 
     <link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
 
     <link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
  
Line 33: Line 35:
 
     <!-- Navigation -->
 
     <!-- Navigation -->
 
     <nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
 
     <nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
−
         <div class="container topnav style="border-top:18px solid #000;">
+
         <div class="container topnav">
 
             <!-- Brand and toggle get grouped for better mobile display -->
 
             <!-- Brand and toggle get grouped for better mobile display -->
 
             <div class="navbar-header">
 
             <div class="navbar-header">
Line 68: Line 70:
 
         <!-- /.container -->
 
         <!-- /.container -->
 
     </nav>
 
     </nav>
 +
 +
 +
    <!-- Header -->
 +
    <a name="about"></a>
 +
    <div class="intro-header">
 +
        <div class="container">
 +
 +
            <div class="row">
 +
                <div class="col-lg-12">
 +
                    <div class="intro-message">
 +
                        <h1>Imperial iGEM 2016</h1>
 +
                        <h3>Co-Culture</h3>
 +
                        <hr class="intro-divider">
 +
                        <ul class="list-inline intro-social-buttons">
 +
                            <li>
 +
                                <a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
 +
                            </li>
 +
                            <li>
 +
                                <a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
 +
                            </li>
 +
                            <li>
 +
                                <a href="#" class="btn btn-default btn-lg"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
 +
                            </li>
 +
                        </ul>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
 +
        </div>
 +
        <!-- /.container -->
 +
 +
    </div>
 +
    <!-- /.intro-header -->
 +
 +
    <!-- Page Content -->
 +
 +
<a  name="services"></a>
 +
    <div class="content-section-a">
 +
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-lg-5 col-sm-6">
 +
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">Brainstorming Process</h2>
 +
                    <p class="lead">
 +
                      We began our brainstorming process in late June by identifying key challenges facing the world today, such as climate change and antimicrobial resistance. We then came up with interesting aspects of biology and thought about how they might be used to solve these challenges. In order develop these ideas further, we formed smaller sub-groups tasked with researching them in more detail, before pitching them to PhDs, post-docs, and PIs from Centre for Synthetic Biology at Imperial College. We also collaborated with students from the Royal College of Art, who challenged us to be more speculative in our brainstorming and consider the real-world implications of our ideas.
 +
<p class ="lead">
 +
  The feedback we received during these sessions was very useful in refining our ideas. This generally involved deconstructing ideas into their basic components; identifying those that interested us the most, and eliminating the rest. Ideas we presented during this time included: bacterial associative learning, biosilica production, cell-free antimicrobial peptide production, genetic Turing machines, and sonogenetics. We found that some of the ideas we were most interested in relied on complex genetic circuits that would be impractical to construct in a single chassis.</p>
 +
                </div>
 +
                <div class="col-lg-5 col-lg-offset-2 col-sm-6">
 +
                    <img class="img-responsive" src="img/brainstorm.jpg" alt="">
 +
                </div>
 +
            </div>
 +
 +
        </div>
 +
        <!-- /.container -->
 +
 +
    </div>
 +
    <!-- /.content-section-a -->
 +
 +
    <div class="content-section-b">
 +
 +
        <div class="container">
 +
 +
            <div class="row">
 +
                <div class="col-lg-5 col-lg-offset-1 col-sm-push-6  col-sm-6">
 +
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">3D Device Mockups<br>by PSDCovers</h2>
 +
                    <p class="lead">Turn your 2D designs into high quality, 3D product shots in seconds using free Photoshop actions by <a target="_blank" href="http://www.psdcovers.com/">PSDCovers</a>! Visit their website to download some of their awesome, free photoshop actions!</p>
 +
                </div>
 +
                <div class="col-lg-5 col-sm-pull-6  col-sm-6">
 +
                    <img class="img-responsive" src="img/dog.png" alt="">
 +
                </div>
 +
            </div>
 +
 +
        </div>
 +
        <!-- /.container -->
 +
 +
    </div>
 +
    <!-- /.content-section-b -->
 +
 +
    <div class="content-section-a">
 +
 +
        <div class="container">
 +
 +
            <div class="row">
 +
                <div class="col-lg-5 col-sm-6">
 +
                    <hr class="section-heading-spacer">
 +
                    <div class="clearfix"></div>
 +
                    <h2 class="section-heading">Google Web Fonts and<br>Font Awesome Icons</h2>
 +
                    <p class="lead">This template features the 'Lato' font, part of the <a target="_blank" href="http://www.google.com/fonts">Google Web Font library</a>, as well as <a target="_blank" href="http://fontawesome.io">icons from Font Awesome</a>.</p>
 +
                </div>
 +
                <div class="col-lg-5 col-lg-offset-2 col-sm-6">
 +
                    <img class="img-responsive" src="img/phones.png" alt="">
 +
                </div>
 +
            </div>
 +
 +
        </div>
 +
        <!-- /.container -->
 +
 +
    </div>
 +
    <!-- /.content-section-a -->
 +
 +
<a  name="contact"></a>
 +
    <div class="banner">
 +
 +
        <div class="container">
 +
 +
            <div class="row">
 +
                <div class="col-lg-6">
 +
                    <h2>Connect to Imperial iGEM:</h2>
 +
                </div>
 +
                <div class="col-lg-6">
 +
                    <ul class="list-inline banner-social-buttons">
 +
                        <li>
 +
                            <a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a>
 +
                        </li>
 +
                        <li>
 +
                            <a href="#" class="btn btn-default btn-lg"><i class="fa fa-linkedin fa-fw"></i> <span class="network-name">Linkedin</span></a>
 +
                        </li>
 +
                    </ul>
 +
                </div>
 +
            </div>
 +
 +
        </div>
 +
        <!-- /.container -->
 +
 +
    </div>
 +
    <!-- /.banner -->
 +
 +
    <!-- Footer -->
 +
    <footer>
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-lg-12">
 +
                    <ul class="list-inline">
 +
                      <li>
 +
                          <a href="#about">Project</a>
 +
                      </li>
 +
                      <li>
 +
                          <a href="#services">Parts</a>
 +
                      </li>
 +
                      <li>
 +
                          <a href="#contact">Notebook</a>
 +
                      </li>
 +
                      <li>
 +
                          <a href="#contact">Human Practices</a>
 +
                      </li>
 +
                      <li>
 +
                          <a href="#contact">Team</a>
 +
                      </li>
 +
                    </ul>
 +
                    <p class="copyright text-muted small">Copyright &copy; Imperial College London 2016. All Rights Reserved</p>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </footer>
 +
 +
    <!-- jQuery -->
 +
    <script src="js/jquery.js"></script>
 +
 +
    <!-- Bootstrap Core JavaScript -->
 +
    <script src="js/bootstrap.min.js"></script>
  
 
</body>
 
</body>
 +
 
</html>
 
</html>

Revision as of 09:56, 22 July 2016

<!DOCTYPE html> Landing Page - Start Bootstrap Theme

Imperial iGEM 2016

Co-Culture

Brainstorming Process

We began our brainstorming process in late June by identifying key challenges facing the world today, such as climate change and antimicrobial resistance. We then came up with interesting aspects of biology and thought about how they might be used to solve these challenges. In order develop these ideas further, we formed smaller sub-groups tasked with researching them in more detail, before pitching them to PhDs, post-docs, and PIs from Centre for Synthetic Biology at Imperial College. We also collaborated with students from the Royal College of Art, who challenged us to be more speculative in our brainstorming and consider the real-world implications of our ideas.

The feedback we received during these sessions was very useful in refining our ideas. This generally involved deconstructing ideas into their basic components; identifying those that interested us the most, and eliminating the rest. Ideas we presented during this time included: bacterial associative learning, biosilica production, cell-free antimicrobial peptide production, genetic Turing machines, and sonogenetics. We found that some of the ideas we were most interested in relied on complex genetic circuits that would be impractical to construct in a single chassis.

3D Device Mockups
by PSDCovers

Turn your 2D designs into high quality, 3D product shots in seconds using free Photoshop actions by PSDCovers! Visit their website to download some of their awesome, free photoshop actions!

Google Web Fonts and
Font Awesome Icons

This template features the 'Lato' font, part of the Google Web Font library, as well as icons from Font Awesome.