Difference between revisions of "Team:Bielefeld-CeBiTec/Sandbox"

Line 1: Line 1:
 
{{Bielefeld-CeBiTec/Header}}
 
{{Bielefeld-CeBiTec/Header}}
  
−
<html>
 
  
−
<body>
+
<html lang="en">
  
−
<div class="jumbotron" style="background-image: url(https://static.igem.org/mediawiki/2015/1/1a/Bielefeld-CeBiTec_jumbotron_startseite.jpeg)">
+
<head>
−
<!-- <h1>Welcome!</h1>     
+
−
  <p>This wiki is currently under construction.</p>-->
+
−
</div>
+
  
−
<div class="container">
+
    <meta charset="utf-8">
 +
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1">
 +
    <meta name="description" content="">
 +
    <meta name="author" content="">
  
 +
    <title>Creative - Start Bootstrap Theme</title>
  
 +
    <!-- Bootstrap Core CSS -->
 +
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
  
−
<div>
+
    <!-- Custom Fonts -->
−
<h2 align="center"> Cell-free Sticks - It works on paper. </h2>
+
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
 +
    <link href='http://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
 +
    <link rel="stylesheet" href="font-awesome/css/font-awesome.min.css" type="text/css">
  
−
        <div class="featurette">
+
    <!-- Plugin CSS -->
−
            <img class="featurette-image img-responsive pull-left" src="https://static.igem.org/mediawiki/2015/1/18/Bielefeld-CeBiTec_biosensor_overview.jpg" alt="survey result" width="500px" ">
+
    <link rel="stylesheet" href="css/animate.min.css" type="text/css">
−
            <p class="lead"><h3>Our project</h3>Our team decided to establish cell-free systems ("cell-free protein synthesis" and "plasmid repressor interaction assay"). For demonstrating the extensibility of our systems we worked with biosensors for heavy metals and we construct a new biosensor for date rape drugs. See what we are doing this year. </p>
+
−
        </div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-right" src="https://static.igem.org/mediawiki/2015/9/93/Bielefeld-CeBiTec_Result_Startseite.jpg" alt="survey result" width="300px" ">
+
−
            <p class="lead"><h3>Our results</h3>Our aim is to establish a universally usable and cell-free biosensor on paper. We could demonstrate that some of our biosensors can be detected on paper. Take a look how we achieved our goal successfully. </p>
+
−
        </div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-left" src="https://static.igem.org/mediawiki/2015/0/0b/Bielefeld-CeBiTec_PT-Teamfoto.jpg" alt="survey result" width="500px" ">
+
−
            <p class="lead"><h3>Our team</h3>We are ten master students studying molecular biotechnology, genome-based system biology and molecular cell biology. Curious who we are? Get to know us better!</p>
+
−
        </div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-right" src="https://static.igem.org/mediawiki/2015/b/b2/Bielefeld-Cebitec_Dual-use-logo-schmal.png" alt="survey result" width="500px">
+
−
            <p class="lead"><h3>Human practices projects</h3>A project is not only lab work. As scientists we need to take responsiblity of what we published and how we appear in public. Among other things we did a dual use essay as we want iGEM to be more aware of biosecurity. Read how iGEM can be a role model for dual use issues. </p>
+
−
        </div>
+
−
<div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-left" src="https://static.igem.org/mediawiki/2015/4/46/Bielefeld-CeBiTec_Modeling_Biosensor_large.png" alt="survey result" width="500px" ">
+
−
            <p class="lead"><h3>Modeling</h3></p>
+
−
        </div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-right" src="https://static.igem.org/mediawiki/2015/f/f9/Bielefeld-CeBiTec_Biosafety_jumbotron.jpg" width="500px" ">
+
−
            <p class="lead"><h3>Biosafety</h3>Our systems should be cell-free. We confirmed through experiments and experts that our systems contained no genetically modified organisms and are safe to use. Let's see what we've done.</p>
+
−
</div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-left" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="survey result" width="500px" ">
+
−
            <p class="lead"><h3>Notebook</h3>We documented everything we have done in the laboratory and lists protocols, organisms, buffers and primers. If you need more information, check this page.</p>
+
−
        </div>
+
−
        <div class="featurette">
+
−
            <img class="featurette-image img-responsive pull-right" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw=="survey result" width="500px" ">
+
−
            <p class="lead"><h3>Partners</h3>An important aspect of iGEM is collaboration. We collaborated with several iGEM teams and helped them for their project. Moreover, you can see who supports us financially. Take a look!</p>
+
−
        </div>
+
  
−
<h2> Achievements </h2>
+
    <!-- Custom CSS -->
−
<p>
+
    <link rel="stylesheet" href="css/creative.css" type="text/css">
−
<table style="background-color:transparent; cellspacing=3;">
+
−
<tr><td colspan="2">
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Development of a new cell-free assay named <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Project/PRIA" target="_blank">Plasmid Repressor Interaction Assay (PRIA)</a><td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Establishment of a <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Project/CFPSOverview" target="_blank">cell-free protein synthesis (CFPS) system</a> for the iGEM community</td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Demonstration of the biosensor system's extensibility through <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Project/HeavyMetals">several biosensors</a></td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Construction of a new biosensor for the detection of <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Project/DateRapeDrugs">date rape drugs</a></td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Construction of a new biosensor for <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Project/HeavyMetals">heavy metals (Copper) </a>. </td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Implementation of a <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Modeling">model</a> for CFPS.<td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>Taking up the <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Practices/DualUse">dual use issue</a> in connection with the topic "date rape drugs".</td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td><a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Collaborations" target="_blank">Help another team</a></td></td></tr>
+
−
<tr><td><img src="https://static.igem.org/mediawiki/2015/e/e7/Bielefeld-CeBiTec-Checkbox_red.png" class="check" width="40px"></td><td>We have a <a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Design" target="_blank">functional prototype</a>.</td></td></tr>
+
−
</table>
+
−
</p>
+
  
 +
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
 +
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 +
    <!--[if lt IE 9]>
 +
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
 +
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
 +
    <![endif]-->
  
 +
</head>
  
 +
<body id="page-top">
  
−
<!-- <h2> Welcome to iGEM 2015! </h2>
+
    <nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
−
<p>Your team has been approved and you are ready to start the iGEM season! </p>
+
        <div class="container-fluid">
 +
            <!-- Brand and toggle get grouped for better mobile display -->
 +
            <div class="navbar-header">
 +
                <button type="button" class="navbar-toggle collapsed" 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 page-scroll" href="#page-top">Start Bootstrap</a>
 +
            </div>
  
−
<h4>Before you start: </h4>
+
            <!-- Collect the nav links, forms, and other content for toggling -->
−
<p> Please read the following pages:</p>
+
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
−
<ul>
+
                <ul class="nav navbar-nav navbar-right">
−
<li> <a href="https://2015.igem.org/Requirements">Requirements page </a> </li>
+
                    <li>
−
<li> <a href="https://2015.igem.org/Wiki_How-To">Wiki Requirements page</a></li>
+
                        <a class="page-scroll" href="#about">About</a>
−
</ul>
+
                    </li>
 +
                    <li>
 +
                        <a class="page-scroll" href="#services">Services</a>
 +
                    </li>
 +
                    <li>
 +
                        <a class="page-scroll" href="#portfolio">Portfolio</a>
 +
                    </li>
 +
                    <li>
 +
                        <a class="page-scroll" href="#contact">Contact</a>
 +
                    </li>
 +
                </ul>
 +
            </div>
 +
            <!-- /.navbar-collapse -->
 +
        </div>
 +
        <!-- /.container-fluid -->
 +
    </nav>
  
−
<div class="highlightBox">
+
    <header>
−
<h4> Styling your wiki </h4>
+
        <div class="header-content">
−
<p>You may style this page as you like or you can simply leave the style as it is. You can easily keep the styling and edit the content of these default wiki pages with your project information and completely fulfill the requirement to document your project.</p>
+
            <div class="header-content-inner">
−
<p>While you may not win Best Wiki with this styling, your team is still eligible for all other awards. This default wiki meets the requirements, it improves navigability and ease of use for visitors, and you should not feel it is necessary to style beyond what has been provided.</p>  
+
                <h1>Your Favorite Source of Free Bootstrap Themes</h1>
−
</div>
+
                <hr>
 +
                <p>Start Bootstrap can help you build better websites using the Bootstrap CSS framework! Just download your template and start going, no strings attached!</p>
 +
                <a href="#about" class="btn btn-primary btn-xl page-scroll">Find Out More</a>
 +
            </div>
 +
        </div>
 +
    </header>
  
−
<h4> Editing your wiki </h4>
+
    <section class="bg-primary" id="about">
−
<p>On this page you can document your project, introduce your team members, document your progress and share your iGEM experience with the rest of the world! </p>  
+
        <div class="container">
−
<p> <a href="https://2015.igem.org/wiki/index.php?title=Team:Bielefeld-CeBiTec&action=edit"> Click here to edit this page! </a></p>
+
            <div class="row">
−
<p>See tips on how to edit your wiki on the <a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation</a> page.</p>  
+
                <div class="col-lg-8 col-lg-offset-2 text-center">
 +
                    <h2 class="section-heading">We've got what you need!</h2>
 +
                    <hr class="light">
 +
                    <p class="text-faded">Start Bootstrap has everything you need to get your new website up and running in no time! All of the templates and themes on Start Bootstrap are open source, free to download, and easy to use. No strings attached!</p>
 +
                    <a href="#" class="btn btn-default btn-xl">Get Started!</a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
 +
    <section id="services">
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-lg-12 text-center">
 +
                    <h2 class="section-heading">At Your Service</h2>
 +
                    <hr class="primary">
 +
                </div>
 +
            </div>
 +
        </div>
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-lg-3 col-md-6 text-center">
 +
                    <div class="service-box">
 +
                        <i class="fa fa-4x fa-diamond wow bounceIn text-primary"></i>
 +
                        <h3>Sturdy Templates</h3>
 +
                        <p class="text-muted">Our templates are updated regularly so they don't break.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-lg-3 col-md-6 text-center">
 +
                    <div class="service-box">
 +
                        <i class="fa fa-4x fa-paper-plane wow bounceIn text-primary" data-wow-delay=".1s"></i>
 +
                        <h3>Ready to Ship</h3>
 +
                        <p class="text-muted">You can use this theme as is, or you can make changes!</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-lg-3 col-md-6 text-center">
 +
                    <div class="service-box">
 +
                        <i class="fa fa-4x fa-newspaper-o wow bounceIn text-primary" data-wow-delay=".2s"></i>
 +
                        <h3>Up to Date</h3>
 +
                        <p class="text-muted">We update dependencies to keep things fresh.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-lg-3 col-md-6 text-center">
 +
                    <div class="service-box">
 +
                        <i class="fa fa-4x fa-heart wow bounceIn text-primary" data-wow-delay=".3s"></i>
 +
                        <h3>Made with Love</h3>
 +
                        <p class="text-muted">You have to make your websites with love these days!</p>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
−
<h4>Templates </h4>
+
    <section class="no-padding" id="portfolio">
−
<p> This year we have created templates for teams to use freely. More information on how to use and edit the templates can be found on the
+
        <div class="container-fluid">
−
<a href="https://2015.igem.org/TemplatesforTeams_Code_Documentation">Template Documentation </a> page.</p>  
+
            <div class="row no-gutter">
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/1.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/2.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/3.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/4.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/5.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
                <div class="col-lg-4 col-sm-6">
 +
                    <a href="#" class="portfolio-box">
 +
                        <img src="img/portfolio/6.jpg" class="img-responsive" alt="">
 +
                        <div class="portfolio-box-caption">
 +
                            <div class="portfolio-box-caption-content">
 +
                                <div class="project-category text-faded">
 +
                                    Category
 +
                                </div>
 +
                                <div class="project-name">
 +
                                    Project Name
 +
                                </div>
 +
                            </div>
 +
                        </div>
 +
                    </a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
 +
    <aside class="bg-dark">
 +
        <div class="container text-center">
 +
            <div class="call-to-action">
 +
                <h2>Free Download at Start Bootstrap!</h2>
 +
                <a href="#" class="btn btn-default btn-xl wow tada">Download Now!</a>
 +
            </div>
 +
        </div>
 +
    </aside>
  
−
<h4>Tips</h4>
+
    <section id="contact">
−
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
+
        <div class="container">
−
<ul>
+
            <div class="row">
−
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
+
                <div class="col-lg-8 col-lg-offset-2 text-center">
−
<li>Be clear about what you are doing and how you plan to do this.</li>
+
                    <h2 class="section-heading">Let's Get In Touch!</h2>
−
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+
                    <hr class="primary">
−
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
+
                    <p>Ready to start your next project with us? That's great! Give us a call or send us an email and we will get back to you as soon as possible!</p>
−
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
+
                </div>
−
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://2015.igem.org/Calendar_of_Events">iGEM 2015 calendar</a> </li>
+
                <div class="col-lg-4 col-lg-offset-2 text-center">
−
<li>Have lots of fun! </li>
+
                    <i class="fa fa-phone fa-3x wow bounceIn"></i>
−
</ul>  
+
                    <p>123-456-6789</p>
−
 
+
                </div>
−
 
+
                <div class="col-lg-4 text-center">
−
<h4>Inspiration</h4>
+
                    <i class="fa fa-envelope-o fa-3x wow bounceIn" data-wow-delay=".1s"></i>
−
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
+
                    <p><a href="mailto:your-email@your-domain.com">feedback@startbootstrap.com</a></p>
−
<ul>
+
                </div>
−
<li> <a href="https://2014.igem.org/Team:SDU-Denmark/"> 2014 SDU Denmark </a> </li>
+
            </div>
−
<li> <a href="https://2014.igem.org/Team:Aalto-Helsinki">2014 Aalto-Helsinki</a> </li>
+
        </div>
−
<li> <a href="https://2014.igem.org/Team:LMU-Munich">2014 LMU-Munich</a> </li>
+
    </section>
−
<li> <a href="https://2014.igem.org/Team:Michigan"> 2014 Michigan</a></li>
+
−
<li> <a href="https://2014.igem.org/Team:ITESM-Guadalajara">2014 ITESM-Guadalajara </a></li>
+
−
<li> <a href="https://2014.igem.org/Team:SCU-China"> 2014 SCU-China </a></li>
+
−
</ul>
+
−
 
+
−
<h4> Uploading pictures and files </h4>
+
−
<p> You can upload your pictures and files to the iGEM 2015 server. Remember to keep all your pictures and files within your team's namespace or at least include your team's name in the file name. <br />
+
−
When you upload, set the "Destination Filename" to <code>Team:YourOfficialTeamName/NameOfFile.jpg</code>. (If you don't do this, someone else might upload a different file with the same "Destination Filename", and your file would be erased!)</p>
+
−
 
+
−
<a href="https://2015.igem.org/Special:Upload">CLICK HERE TO UPLOAD FILES</a>
+
  
 +
    <!-- jQuery -->
 +
    <script src="js/jquery.js"></script>
  
 +
    <!-- Bootstrap Core JavaScript -->
 +
    <script src="js/bootstrap.min.js"></script>
  
−
</div></div>These are the closing tags for div id="mainContainer" and div id="contentContainer". The corresponding opening tags appear in the template that is {{included}} at the top of this page.
+
    <!-- Plugin JavaScript -->
 +
    <script src="js/jquery.easing.min.js"></script>
 +
    <script src="js/jquery.fittext.js"></script>
 +
    <script src="js/wow.min.js"></script>
  
−
</div>-->
+
    <!-- Custom Theme JavaScript -->
 +
    <script src="js/creative.js"></script>
  
 
</body>
 
</body>

Revision as of 19:41, 14 September 2015

iGEM Bielefeld 2015


Creative - Start Bootstrap Theme

Your Favorite Source of Free Bootstrap Themes

Start Bootstrap can help you build better websites using the Bootstrap CSS framework! Just download your template and start going, no strings attached!

Find Out More

We've got what you need!

Start Bootstrap has everything you need to get your new website up and running in no time! All of the templates and themes on Start Bootstrap are open source, free to download, and easy to use. No strings attached!

Get Started!

At Your Service

Sturdy Templates

Our templates are updated regularly so they don't break.

Ready to Ship

You can use this theme as is, or you can make changes!

Up to Date

We update dependencies to keep things fresh.

Made with Love

You have to make your websites with love these days!

Category
Project Name
Category
Project Name
Category
Project Name
Category
Project Name
Category
Project Name
Category
Project Name

Let's Get In Touch!

Ready to start your next project with us? That's great! Give us a call or send us an email and we will get back to you as soon as possible!

123-456-6789

feedback@startbootstrap.com