Team:UCSF/Home1

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
{{Team:HokkaidoU_Japan/Index/Slideshow}}
 +
{{Team:HokkaidoU_Japan/header}}
<html>
<html>
-
 
+
<script type="text/javascript">
-
 
+
    $(document).ready(function () {
-
 
+
        var buttons = {
-
<!--
+
            previous: $('#lofslidercontent45 .lof-previous'),
-
* Markup for jQuery Orbit Plugin 1.2.3
+
            next: $('#lofslidercontent45 .lof-next')
-
* www.ZURB.com/playground
+
        };
-
* Copyright 2010, ZURB
+
        $obj = $('#lofslidecontent45').lofJSidernews({
-
* Free to use under the MIT license.
+
            interval: 5000,
-
* http://www.opensource.org/licenses/mit-license.php
+
            direction: 'opacitys',
-
-->
+
            easing: 'easeInOutExpo',
-
+
            duration: 1200,
-
+
            auto: true,
-
+
            maxItemDisplay: 7,
-
<head>
+
            startItem: 0,
-
<meta charset="utf-8" />
+
            navPosition: 'horizontal', // horizontal
-
<title>UCSF iGEM</title>
+
            navigatorHeight: 32,
-
+
            navigatorWidth: 80,
-
<!-- Attach our CSS -->
+
            mainWidth: 780,
-
  <!-- <link rel="stylesheet" href="../orbit-1.2.3.css">
+
            buttons: buttons
-
  <link rel="stylesheet" href="demo-style.css">
+
         });
-
  -->
+
-
<!-- Attach necessary JS --><!--
+
-
<script type="text/javascript" src="../jquery-1.5.1.min.js"></script>
+
-
<script type="text/javascript" src="../jquery.orbit-1.2.3.min.js"></script>
+
-
-->
+
-
 
+
-
<!-- Attach our CSS -->
+
-
  <link rel="stylesheet" href="http://www.stanford.edu/~sryoung/cgi-bin/igem/orbit-1.2.3.css">
+
-
  <link rel="stylesheet" href="http://www.stanford.edu/~sryoung/cgi-bin/igem/demo/demo-style.css">
+
-
 
+
-
<!-- Attach necessary JS -->
+
-
<script type="text/javascript" src="http://www.stanford.edu/~sryoung/cgi-bin/igem/jquery-1.5.1.min.js"></script>
+
-
<script type="text/javascript" src="http://www.stanford.edu/~sryoung/cgi-bin/igem/jquery.orbit-1.2.3.min.js"></script>
+
-
+
-
+
-
<!--[if IE]>
+
-
    <style type="text/css">
+
-
        .timer { display: none !important; }
+
-
        div.caption { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; }
+
-
    </style>
+
-
<![endif]-->
+
-
+
-
<!-- Run the plugin -->
+
-
<script type="text/javascript">
+
-
    $(window).load(function () {
+
-
        $('#featured').orbit();
+
-
    });
+
-
</script>
+
-
 
+
-
 
+
-
 
+
-
<!-- Stuff from Calgary -->
+
-
 
+
-
<link rel='stylesheet' type='text/css' href="https://2012.igem.org/Team:Calgary/static/basicpageglobal.css?action=raw&ctype=text/css" />
+
-
 
+
-
<style>
+
-
/*======
+
-
Desktop Styling
+
-
======*/
+
-
+
-
/***Body styling***/
+
-
h1{
+
-
font-size: 2.5em;
+
-
}
+
-
h2{
+
-
font-size: 1.8em;
+
-
}
+
-
 
+
-
#box1{
+
-
width: 968px;
+
-
margin-top: -8px;
+
-
background: threedface;
+
-
float: left;
+
-
padding-bottom: 20px;
+
-
margin-bottom: 13px;
+
-
}
+
-
#box1 h2{
+
-
padding: 20px 20px 20px 20px;
+
-
}
+
-
#box1 p{
+
-
padding: 0px 20px 0px 20px;
+
-
font-size: 1.1em;
+
-
}
+
-
 
+
-
#FredOscarFlag{
+
-
display: block;
+
-
float: left;
+
-
width: 250px;
+
-
height: 274px;
+
-
background: url('https://static.igem.org/mediawiki/2012/0/0b/UCalgary2012_FRED_and_OSCAR_Main_Page.png');
+
-
background-position: top;
+
-
margin: 15px;
+
-
}
+
-
#FredOscarFlag:hover{
+
-
background-position: bottom;
+
-
}
+
-
+
-
 
+
-
#box2{
+
-
width: 968px;
+
-
background: #C68DD8;
+
-
float: left;
+
-
margin-bottom: 13px;
+
-
}
+
-
#box2 h2{
+
-
padding: 20px 20px 20px 20px;
+
-
color: white;
+
-
}
+
-
#box2 p{
+
-
padding: 0px 20px 0px 20px;
+
-
font-size: 1.1em;
+
-
color: white;
+
-
}
+
-
#box2 img{
+
-
float: left;
+
-
margin: 15px;
+
-
height: 110px;
+
-
}
+
-
#box2:hover{
+
-
background: #D79EE9;
+
-
}
+
-
+
-
/***positioning of elements in ZE EPIC BOX***/
+
-
#epicbox{
+
-
margin-top: 4px;
+
-
}
+
-
 
+
-
#boximgcontainer{
+
-
float: left;
+
-
width: 644px;
+
-
height: 655px;
+
-
}
+
-
#boximgcontainer div{
+
-
float: left;
+
-
position: relative;
+
-
}
+
-
#orangebox{
+
-
margin-bottom: 4px;
+
-
}
+
-
#orangebox .imgbox{
+
-
width: 644px;
+
-
height: 215px;
+
-
top: 108px;
+
-
// background: #F6A82D;
+
-
//background: #33CC33;
+
-
background: #555555;
+
-
margin-bottom: 4px;
+
-
}
+
-
.oblank{
+
-
width: 644px;
+
-
height: 104px;
+
-
//background: #FFE485;
+
-
//background: #33EE33;
+
-
background: #888888;
+
-
position: relative;
+
-
top: -219px;
+
-
}
+
-
#orangebox:hover .oblank, .oblank:hover{
+
-
display: none;
+
-
}
+
-
#orangebox .iconcontainer{
+
-
position: relative;
+
-
display: none;
+
-
left: auto;
+
-
top: -219px;
+
-
}
+
-
.iconbox div, .iconbox{
+
-
width: 104px;
+
-
height: 104px;
+
-
margin-right: 4px;
+
-
}
+
-
a.obox1 div{
+
-
background: #BBBBBB;
+
-
}
+
-
a.obox2 div{
+
-
background: #AAAAAA;
+
-
}
+
-
a.obox3 div{
+
-
background: #999999;
+
-
}
+
-
a.obox4 div{
+
-
background: #888888;
+
-
}
+
-
a.obox5 div{
+
-
background: #777777;
+
-
}
+
-
a.obox6 div{
+
-
background: #666666;
+
-
margin-right: 0;
+
-
}
+
-
#orangebox div:hover, #orangebox div.iconbox:hover div{
+
-
background: #DDDDDD;
+
-
}
+
-
#orangebox:hover .iconcontainer{
+
-
display: block;
+
-
background: transparent;
+
-
}
+
-
+
-
+
-
#greenbox .imgbox{
+
-
width: 320px;
+
-
height: 215px;
+
-
//background: #58CD45;
+
-
//background: #888888;
+
-
//background: #33CC33;
+
-
background: #663399;
+
-
}
+
-
.gblank{
+
-
width: 320px;
+
-
height: 104px;
+
-
//background: #B6FFA3;
+
-
//background: #BBBBBB;
+
-
//background: #33EE33;
+
-
background: #9933FF;
+
-
position: relative;
+
-
top: 219px;
+
-
left: -320px;
+
-
}
+
-
#greenbox .iconcontainer{
+
-
position: relative;
+
-
margin-top: 4px;
+
-
left: -999em;
+
-
z-index: 1;
+
-
}
+
-
a.gbox1 div{
+
-
background: #9933FF;
+
-
}
+
-
a.gbox2 div{
+
-
background: #9900FF;
+
-
}
+
-
a.gbox3 div{
+
-
background: #660099;
+
-
}
+
-
a.gbox4 div{
+
-
background: #663399;
+
-
}
+
-
#greenbox div:hover, #greenbox div.iconbox:hover div{
+
-
//background: #94FF7D;
+
-
background: #9933FF;
+
-
z-index: 99; /*hovers are not overridden by OSCAR boxes*/
+
-
}
+
-
#greenbox:hover .gblank, .gblank:hover{
+
-
display: none;
+
-
}
+
-
#greenbox:hover .iconcontainer{
+
-
left: auto;
+
-
background: transparent;
+
-
}
+
-
+
-
#bluebox{
+
-
position: relative;
+
-
top: -323px;
+
-
left: 320px;
+
-
}
+
-
#bluebox .imgbox{
+
-
width: 320px;
+
-
height: 215px;
+
-
//background: #5BB5E8;
+
-
background: #660000;
+
-
margin-left: 4px;
+
-
}
+
-
.bblank{
+
-
width: 320px;
+
-
height: 104px;
+
-
//background: #C5F0F0;
+
-
background: #996666;
+
-
position: relative;
+
-
top: 219px;
+
-
left: -320px;
+
-
z-index: 0;
+
-
}
+
-
#bluebox .iconcontainer{
+
-
position: relative;
+
-
margin-top: 4px;
+
-
left: -999em;
+
-
z-index: 0;
+
-
}
+
-
a.bbox1 div{
+
-
background: #993333;
+
-
}
+
-
a.bbox2 div{
+
-
background: #993300;
+
-
}
+
-
a.bbox3 div{
+
-
background: #990033;
+
-
}
+
-
a.bbox4 div{
+
-
background: #990000;
+
-
}
+
-
a.bbox5 div{
+
-
background: #990066;
+
-
}
+
-
a.bbox6 div{
+
-
background: #993366;
+
-
margin: 0;
+
-
}
+
-
#bluebox div:hover, #bluebox .iconbox:hover div{
+
-
//background: #7DD7FF;
+
-
background: #993333;
+
-
z-index: 99; /*hovers are not overridden by FRED boxes*/
+
-
}
+
-
#bluebox:hover .bblank, .bblank:hover{
+
-
display: none;
+
-
}
+
-
#bluebox:hover .iconcontainer{
+
-
left: -212px;
+
-
background: transparent;
+
-
}
+
-
+
-
#boxinfo{
+
-
float: right;
+
-
position: relative;
+
-
width: 320px;
+
-
left: 3px;
+
-
// background: #555555;
+
-
background: #33CC33;
+
-
height: 650px;
+
-
margin-bottom: 12px;
+
-
}
+
-
#boxinfo h2{
+
-
color: white;
+
-
padding: 20px 20px 0px;
+
-
}
+
-
#boxinfo p{
+
-
color: white;
+
-
padding: 10px 20px 20px;
+
-
font-size: 1.2em;
+
-
}
+
-
/*initial boxinfo appearance settings*/
+
-
#boxinfo div.orangebox, #boxinfo div.obox1, #boxinfo div.obox2, #boxinfo div.obox3, #boxinfo div.obox4, #boxinfo div.obox5, #boxinfo div.obox6{
+
-
display: none;
+
-
}
+
-
#boxinfo div.greenbox, #boxinfo div.gbox1, #boxinfo div.gbox2, #boxinfo div.gbox3, #boxinfo div.gbox4,
+
-
#boxinfo div.bluebox, #boxinfo div.bbox1, #boxinfo div.bbox2, #boxinfo div.bbox3, #boxinfo div.bbox4, #boxinfo div.bbox5{
+
-
position: relative;
+
-
padding-top: 320px;
+
-
display: none;
+
-
}
+
-
/*bold colours for FRED and OSCAR*/
+
-
#boxinfo div.greenbox b{
+
-
color: #72E85B;
+
-
}
+
-
#boxinfo div.bluebox b{
+
-
color: #5EB7F0;
+
-
}
+
-
.threeboxes{
+
-
clear: both;
+
-
position: relative;
+
-
width: 968px;
+
-
margin-bottom: 12px;
+
-
}
+
-
.threeboxes a, .threeboxes a div{
+
-
width: 320px;
+
-
height: 155px;
+
-
float: left;
+
-
margin-bottom: 12px;
+
-
}
+
-
.threeboxes div h2{
+
-
padding: 20px 20px 0px;
+
-
position: relative;
+
-
top: -155px;
+
-
}
+
-
.threeboxes div p{
+
-
padding: 0px 20px;
+
-
position: relative;
+
-
top: -155px;
+
-
}
+
-
#greybox1, #greybox6{
+
-
margin-right: 4px;
+
-
//background: #58CD45;
+
-
                        background: #3399FF;
+
-
}
+
-
#greybox1:hover, #greybox6:hover{
+
-
background: #94FF7D;
+
-
}
+
-
#greybox2, #greybox5{
+
-
margin-right: 4px;
+
-
background: #5BB5E8;
+
-
                     
+
-
}
+
-
#greybox2:hover, #greybox5:hover{
+
-
background: #7DD7FF;
+
-
}
+
-
#greybox3, #greybox4{
+
-
margin: 0;
+
-
//background: #F6A82D;
+
-
                        background: #00CCFF;
+
-
}
+
-
#greybox3:hover, #greybox4:hover{
+
-
background: #FFE44F;
+
-
}
+
-
 
+
-
#greybox4 {
+
-
background: #CCFFFF;
+
-
}
+
-
#greybox5 {
+
-
background: #CCFFFF;
+
-
}
+
-
#greybox6 {
+
-
background: #CCFFFF;
+
-
}
+
-
#greybox1:hover, #greybox2:hover, #greybox3:hover {
+
-
background: #00CC00;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
#greybox4:hover, #greybox5:hover, #greybox6:hover {
+
-
background: #66FFFF;
+
-
}
+
-
 
+
-
#greybox1 {
+
-
background: #CCFF99;
+
-
}
+
-
#greybox2 {
+
-
background: #CCFF99;
+
-
}
+
-
#greybox3 {
+
-
background: #CCFF99;
+
-
}
+
-
+
-
#sponsorsbox{
+
-
clear: both;
+
-
position: relative;
+
-
width: 968px;
+
-
margin: 4px 0px;
+
-
background: #EEEEEE;
+
-
}
+
-
#sponsorsbox h2{
+
-
padding: 20px 20px 0px 20px;
+
-
}
+
-
#sponsorsbox p{
+
-
padding: 0px 20px;
+
-
}
+
-
#sponsorsbox table{
+
-
width: 950px;
+
-
margin-left: auto;
+
-
margin-right: auto;
+
-
background: #EEEEEE;
+
-
}
+
-
#sponsorsbox td{
+
-
padding: 15px 0px;
+
-
width: 300px;
+
-
}
+
-
#sponsorsbox img{
+
-
display: block;
+
-
margin-right: auto;
+
-
margin-left: auto;
+
-
}
+
-
 
+
-
</style>
+
-
 
+
-
<script>
+
-
    jQuery(document).ready(function ($) {
+
-
 
+
-
         //eliminate jsnotice
+
-
        $('#jsnotice').hide();
+
-
 
+
-
 
+
-
        /*epic box info functionality*/
+
-
        //small icons
+
-
        $('#boximgcontainer .iconbox').hover(
+
-
function () {
+
-
    var className = $(this).attr('class').split(" ");
+
-
    var box = className[0];
+
-
    clearinfo();
+
-
    $('#boxinfo div.' + box).show();
+
-
},
+
-
function () {
+
-
    clearinfo();
+
-
    $('#boxinfo_default').show();
+
-
});
+
-
        //large icons
+
-
        $('.imgbox').hover(
+
-
function () {
+
-
    var id = $(this).parent().parent().attr('id');
+
-
    clearinfo();
+
-
    $('#boxinfo div.' + id).show();
+
-
},
+
-
function () {
+
-
    clearinfo();
+
-
    $('#boxinfo_default').show();
+
-
});
+
-
 
+
-
        /*epic box FRED/OSCAR blank box disappearance*/
+
-
        $('#bluebox').hover(
+
-
function () {
+
-
    $('.gblank').hide();
+
-
    $('.bblank').hide();
+
-
},
+
-
function () {
+
-
    $('.gblank').show();
+
-
    $('.bblank').show();
+
-
});
+
-
 
+
-
        $('#greenbox').hover(
+
-
function () {
+
-
    $('.gblank').hide();
+
-
    $('.bblank').hide();
+
-
},
+
-
function () {
+
-
    $('.gblank').show();
+
-
    $('.bblank').show();
+
-
});
+
-
 
+
     });
     });
-
 
-
    function clearinfo() {
 
-
        $('#boxinfo div').hide();
 
-
    }
 
</script>
</script>
-
 
+
<div id="hokkaidou-left-content">
-
<!-- End stuff from Calgary -->
+
    <ul id="hokkaidou-index-menu">
-
 
+
        <li id="hokkaidou-index-team"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Team">Team
-
 
+
            <span class="hokkaidou-description">
-
 
+
                The HokkaidoU_Japan is formed by 16 students and 3 instructors
-
 
+
            </span>
-
 
+
        </a>
-
 
+
        </li>
-
 
+
        <li id="hokkaidou-index-project"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Project">Project
-
 
+
            <span class="hokkaidou-description">
-
 
+
                We tried to further develop E. coli-based protein injection system which we started working on during iGEM 2010
-
 
+
            </span>
-
 
+
        </a>
-
 
+
        </li>
-
+
        <li id="hokkaidou-index-parts"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Parts">Parts
-
</head>
+
            <span class="hokkaidou-description">
-
<body>
+
                Ready-to-inject backbone and Bsa I cloning system
-
 
+
            </span>
-
<h1>UCSF iGEM </h1>
+
        </a>
-
+
        </li>
-
<!-- =======================================
+
        <li id="hokkaidou-index-protocol"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Protocols">Protocol
-
 
+
            <span class="hokkaidou-description">
-
THE ACTUAL ORBIT SLIDER CONTENT
+
                General protocols, Primers and methods of infection assay
-
 
+
            </span>
-
======================================= -->
+
        </a>
-
<div id="featured">  
+
        </li>
-
<div class="content" style="">
+
        <li id="hokkaidou-index-notebook"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Notebook">Notebook
-
<h1>Orbit does content now.</h1>
+
            <span class="hokkaidou-description">
-
<h3>Highlight me...I'm text.</h3>
+
                The record of our many failures and a bit of achievement
-
</div>
+
            </span>
-
<a href=""><img src="http://www.stanford.edu/~sryoung/cgi-bin/igem/demo/dummy-images/overflow.jpg" /></a>
+
        </a>
-
<img src="http://www.stanford.edu/~sryoung/cgi-bin/igem/demo/dummy-images/captions.jpg" data-caption="#htmlCaption" />
+
        </li>
-
<img src="http://www.stanford.edu/~sryoung/cgi-bin/igem/demo/dummy-images/features.jpg" />
+
        <li id="hokkaidou-index-safety"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/Safety">Safety
-
</div>
+
            <span class="hokkaidou-description">
-
<!-- Captions for Orbit -->
+
                Addressing safety concerns
-
<span class="orbit-caption" id="htmlCaption"><strong>I'm A Badass Caption:</strong> I can haz <a href="#">links</a>, <em>style</em> or anything that is valid markup :)</span>
+
            </span>
-
+
        </a>
-
+
        </li>
-
 
+
        <li id="hokkaidou-index-humanpractice"><a href="https://2011.igem.org/Team:HokkaidoU_Japan/HumanPractice">Human Practice
-
 
+
            <span class="hokkaidou-description">
-
 
+
                Science art gallery "BIO ART"
-
+
            </span>
-
<!-- <div class="container"> -->
+
        </a>
-
<!-- <h4>ZURB's Orbit Slider</h4>
+
        </li>
-
<a href="http://www.zurb.com/playground/orbit-jquery-image-slider">View Docs + Playground for Orbit</a> -->
+
    </ul>
-
 
+
    <div id="hokkaidou-official-team-logo">
-
<br />
+
        <img src="http://igemhokkaidou.files.wordpress.com/2011/04/igem-hokkaidou-logo-transparent.png?w=240&h=240#038;h=240" width="240" height="240" />
-
<br />
+
        <span class="hokkaidou-description">iGEM HokkaidoU_Japan Official Team Logo</span>
-
 
+
    </div>
-
<div class="threeboxes">
+
    <div id="hokkaidou-links">
-
<a id="greybox4" href="http://www.youtube.com/watch?v=KHhswxo6xow" style="margin-right:4px;">
+
        <ul>
-
<div>
+
            <li id="hokkaidou-links-email"><a href="mailto:igemhokkaidou@gmail.com">Email</a></li>
-
<img src="https://static.igem.org/mediawiki/2012/0/02/UCalgary2012_ThreeBoxMusic.png-"></img>
+
            <li id="hokkaidou-links-facebook"><a href="http://www.facebook.com/iGEMHokkaidoU">Facebook</a></li>
-
<h2>Project #1</h2>
+
            <li id="hokkaidou-links-twitter"><a href="http://twitter.com/iGEM_HokkaidoU">Twitter</a></li>
-
<p>Description</p>
+
            <li id="hokkaidou-links-wordpress"><a href="http://igemhokkaidou.com">WordPress</a></li>
-
</div>
+
            <li id="hokkaidou-links-youtube"><a href="http://www.youtube.com/user/iGEMHokkaidoU">YouTube</a></li>
-
</a>
+
        </ul>
-
<a id="greybox5" href="https://2012.igem.org/Team:Calgary/Project/Synergy-">
+
    </div>
-
<div>
+
</html>
-
<img src="https://static.igem.org/mediawiki/2012/2/20/UCalgary2012_ThreeBoxSynergy.png-"></img>
+
{{Team:HokkaidoU_Japan/SocialButtons}}
-
<h2>Project #2</h2>
+
<html>
-
<p>Description</p>
+
-
</div>
+
-
</a>
+
-
<a id="greybox6" href="http://www.youtube.com/watch?v=vluDpf4ao6c" style="margin:0;">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/b/b1/UCalgary2012_ThreeBoxFilm.png-"></img>
+
-
<h2>Project #3</h2>
+
-
<p>Description</p>
+
-
</div>
+
-
</a>
+
-
+
</div>
</div>
-
<div class="threeboxes">
+
<div id="hokkaidou-right-content">
-
<a id="greybox1" href="https://2012.igem.org/Team:Calgary/Team">
+
    <div id="lofslidecontent45" class="lof-slidecontent">
-
<div>
+
        <div style="display: none;" class="preload"><div></div></div>
-
<img src="https://static.igem.org/mediawiki/2012/b/b8/UCalgary2012_ThreeBoxTeam.png-"></img>
+
            <div class="lof-main-outer" style="width:900px; height:340px;">
-
<h2>Team</h2>
+
            <ul style="left: -4200px; width: 6300px;" class="lof-main-wapper">
-
<p>Who are we?</p>
+
                <li>
-
</div>
+
                    <img src="https://static.igem.org/mediawiki/2011/6/64/IGEM_HokkaidoU_Index_Slideshow_7.jpg">          
-
</a>
+
                    <div class="lof-main-item-desc">
-
<a id="greybox2" href="https://2012.igem.org/Team:Calgary/Project/DataPage">
+
                        <h2>HokkaidoU_Japan 2011</h2>
-
<div>
+
                    </div>
-
<img src="https://static.igem.org/mediawiki/2012/9/92/UCalgary2012_ThreeBoxData.png-"></img>
+
                </li>
-
<h2>Data Page</h2>
+
                <li>
-
<p>Click here to see a summary of all our data collected so far!</p>
+
                    <img src="https://static.igem.org/mediawiki/2011/8/8a/IGEM_HokkaidoU_Index_Slideshow_1.jpg">         
-
</div>
+
                    <div class="lof-main-item-desc">
-
</a>
+
                        <h2>Welcome to the BIOxART Gallery!!</h2>
-
<a id="greybox3" href="https://2012.igem.org/Team:Calgary/Notebook">
+
                    </div>
-
<div>
+
                </li>
-
<img src="https://static.igem.org/mediawiki/2012/1/1b/UCalgary2012_ThreeBoxNotebook.png-"></img>
+
                <li>
-
<h2>Notebook</h2>
+
                    <img src="https://static.igem.org/mediawiki/2011/b/b5/IGEM_HokkaidoU_Index_Slideshow_2.jpg">          
-
<p>Here is a record of our summer's work. We also want to thank everybody who helped us along the way!</p>
+
                    <div class="lof-main-item-desc">
-
</div>
+
                        <h2>Be careful not to contaminate...</h2>
-
</a>
+
                    </div>
-
</div>
+
                </li>  
 +
                <li>
 +
                    <img src="https://static.igem.org/mediawiki/2011/0/01/IGEM_HokkaidoU_Index_Slideshow_3.jpg">          
 +
                    <div class="lof-main-item-desc">
 +
                        <h2>Meeting, meeting and MEETING!</h2>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <img src="https://static.igem.org/mediawiki/2011/d/d1/IGEM_HokkaidoU_Index_Slideshow_4.jpg">          
 +
                    <div class="lof-main-item-desc">
 +
                        <h2>Dr. <i>E. coli</i> get ready for the job</h2>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <img src="https://static.igem.org/mediawiki/2011/0/06/IGEM_HokkaidoU_Index_Slideshow_5.jpg">           
 +
                    <div class="lof-main-item-desc">
 +
                        <h2>BIOxART, please feel free to look around</h2>
 +
                    </div>
 +
                </li>
 +
                <li>
 +
                    <img src="https://static.igem.org/mediawiki/2011/7/74/IGEM_HokkaidoU_Index_Slideshow_6.jpg">          
 +
                    <div class="lof-main-item-desc">
 +
                        <h2>Experiment, experiment and EXPERIMENT!</h2>
 +
                    </div>
 +
                </li>  
 +
            </ul>   
 +
        </div>
 +
        <div class="lof-navigator-wapper">
 +
            <div style="width: 320px; height: 32px;" class="lof-navigator-outer">
 +
                <ul style="width: 54px; left: -160px;" class="lof-navigator">
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/8/81/IGEM_HokkaidoU_Index_Slideshow_Thumb_7.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/f/f3/IGEM_HokkaidoU_Index_Slideshow_Thumb_1.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/a/aa/IGEM_HokkaidoU_Index_Slideshow_Thumb_2.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/f/fb/IGEM_HokkaidoU_Index_Slideshow_Thumb_3.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/e/e2/IGEM_HokkaidoU_Index_Slideshow_Thumb_4.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/9/93/IGEM_HokkaidoU_Index_Slideshow_Thumb_5.jpg"></li>
 +
                    <li class="" style="height: 32px; width: 80px;"><img src="https://static.igem.org/mediawiki/2011/2/21/IGEM_HokkaidoU_Index_Slideshow_Thumb_6.jpg"></li>
 +
                </ul>
 +
            </div>
 +
        </div>
 +
    </div>
 +
    <h2>Abstract</h2>
 +
    <p>We further developed "Dr. E. coli": our project of iGEM 2010. Last year, we showed that Type 3 Secretion System (T3SS) works in E. coli by injecting GFP into RK13 cells. T3SS is a syringe like organelle found in bacterium such as Salmonella which uses it to inject virulence effector proteins into a target eukaryotic cell. We think this system can be applied to direct reprogramming of somatic cells among many other things.</p>
 +
    <p>We tested T3SS performance and tried to make it more convenient. For this purpose we designed a plasmid backbone which can instantly produce ready-to-inject fusion proteins from ordinary biobrick part. Using it, we tried to further characterize this system by injecting a library of protein domains.</p>
 +
    <p>In Science Gallery we exhibited awesome photographs related with biotechnology in public. We tried to catch the pedestrians’ interest in current synthetic biology and explore their thoughts.</p>
 +
    <h2>BioArt</h2>
 +
    <iframe id="hokkaidou-bioart-youtube" width="680" height="360" src="http://www.youtube.com/embed/nOP0YIUSj-s" frameborder="0" allowfullscreen></iframe>
 +
    <style type="text/css">
 +
        iframe#hokkaidou-bioart-youtube{ margin-bottom: 30px; }
 +
    </style>
 +
    <p>We held the new type science art gallery "Bio Art" at the center of Sapporo city.</p>
 +
    <p>This gallery is not only for our team.You can also enjoy Bio Art on this Web page.
 +
    You can watch more detail in <a href="https://2011.igem.org/Team:HokkaidoU_Japan/HumanPractice">Human Practice</a> page.</p>
 +
 +
</html>
 +
==Acknowledgements==
 +
===Laboratory and Personnel===
 +
* Environmental Molecular Biology, Graduate School of Environmental Earth Science, Hokkaido University
 +
:: Ken-ichi Yamazaki and Members of Yamazaki Lab
 +
* Molecular Biology, Institute for Genetic Medicine, Hokkaido University
 +
:: Hisatoshi Shida
 +
* Nikon Imaging Center
 +
:: Takeharu Nagai, Kenta Saito, Masahiro Nakano, Kentarou Kobayashi, Hiroshi Nishino
 +
* Laboratory of Molecular and Cellular Biophysics, Hokkaido University
 +
:: Tomomi Nemoto, Terumasa Hibi, Ryosuke Kawakami
 +
* Muroran Marine Station Field Science Center for Northern Biosphere, Hokkaido University
 +
:: Taizo Motomura
 +
* Laboratory of X-ray structural biology, Department of Advanced Transdisciplinary Science, faculty of Advanced Life Science
 +
::Isao Tanaka
 +
* Research Institute for Electronic Science, Hokkaido University
 +
===Academic Institutions===
 +
* Salmonella Genetic Stock Center/University of Calgary
 +
* Graduate School of Environmental Earth Science
 +
* Department of biological science/School of Sciense
 +
* Institute for Genetic Medicine
-
<div id="epicbox">
+
===Companies===
-
<div id="boximgcontainer">
+
* Primary Cell Co., Ltd.
-
<div id="orangebox">
+
* ECONiXE Co., Ltd.
-
<a href="https://2012.igem.org/Team:Calgary/Project/HumanPractices">
+
* Hokuto Kohki Engineering Co,. Ltd.
-
<div class="imgbox">
+
* COSMO BIO Co., Ltd.
-
<img src="https://static.igem.org/mediawiki/2012/9/9e/UCalgary2012_EpicBoxHP_-_Blank.png-"></img>
+
* AMINO UP CHEMICAL Co., Ltd.
-
</div>
+
* Mendel Workshop Co., Ltd.
-
+
-
<div class="oblank">
+
-
</div>
+
-
+
-
<div class="iconcontainer">
+
-
<a class="obox1 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Collaborations">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/1/1b/UCalgary2012_IconHP8.png-"></img>
+
-
</div>
+
-
</a>
+
-
<a class="obox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Interviews">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/d/d6/UCalgary2012_IconHP3.png-"></img>
+
-
</div>
+
-
</a>
+
-
<a class="obox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Design">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/1/1c/UCalgary2012_IconHP4.png-"></img>
+
-
</div>
+
-
</a>
+
-
<a class="obox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/HumanPractices/Killswitch">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/6/65/UCalgary2012_IconHP2.png-"></img>
+
-
</div>
+
-
</a>
+
-
<a class="obox5 iconbox" href="https://2012.igem.org/Team:Calgary/Safety">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/c/c9/UCalgary2012_IconHP5.png-"></img>
+
-
</div>
+
-
</a>
+
-
<a class="obox6 iconbox" href="https://2012.igem.org/Team:Calgary/Outreach">
+
-
<div>
+
-
<img src="https://static.igem.org/mediawiki/2012/0/0e/UCalgary2012_IconHP6.png-"></img>
+
-
</div>
+
-
</a>
+
-
</div>
+
-
 
-
</a>
 
-
</div>
 
-
 
-
<div id="greenbox">
 
-
<a href="https://2012.igem.org/Team:Calgary/Project/FRED">
 
-
<div class="imgbox">
 
-
<img src="https://static.igem.org/mediawiki/2012/4/47/UCalgary2012_EpicBoxFRED_-_Blank.png-"></img>
 
-
</div>
 
-
 
-
<div class="gblank">
 
-
</div>
 
-
 
-
<div class="iconcontainer">
 
-
<a class="gbox1 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Detecting">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/0/0a/UCalgary2012_IconFRED1.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="gbox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Reporting">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/8/8d/UCalgary2012_IconFRED2.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="gbox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Modelling">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/c/c0/UCalgary2012_IconFRED3.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="gbox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/FRED/Prototype">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/a/a7/UCalgary2012_IconFRED4.png-"></img>
 
-
</div>
 
-
</a>
 
-
</div>
 
-
</a>
 
-
</div>
 
-
 
-
<div id="bluebox">
 
-
<a href="https://2012.igem.org/Team:Calgary/Project/OSCAR">
 
-
<div class="imgbox">
 
-
<img src="https://static.igem.org/mediawiki/2012/9/94/UCalgary2012_EpicBoxOSCAR_-_Blank.png-"></img>
 
-
</div>
 
-
 
-
<div class="bblank">
 
-
</div>
 
-
 
-
<div class="iconcontainer">
 
-
<a class="bbox1 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Decarboxylation">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/f/f1/UCalgary2012_IconOSCAR1.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="bbox2 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/CatecholDegradation">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/0/0c/UCalgary2012_IconOSCAR4.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="bbox3 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/FluxAnalysis">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/4/40/UCalgary2012_IconOSCAR6.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="bbox4 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Bioreactor">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/3/3e/UCalgary2012_IconOSCAR5.png-"></img>
 
-
</div>
 
-
</a>
 
-
<a class="bbox5 iconbox" href="https://2012.igem.org/Team:Calgary/Project/OSCAR/Upgrading">
 
-
<div>
 
-
<img src="https://static.igem.org/mediawiki/2012/4/44/UCalgary2012_IconOSCAR7.png-"></img>
 
-
</div>
 
-
</a>
 
-
</div>
 
-
</a>
 
-
</div>
 
-
</div>
 
-
<div id="boxinfo">
 
-
<div id="boxinfo_default">
 
-
<h2>The Concept</h2>
 
-
<p>The concept</p>
 
-
</div>
 
-
<div class="orangebox">
 
-
<h2>Human Practices</h2>
 
-
<p>Human Practices</p>
 
-
</div>
 
-
<div class="obox1">
 
-
<h2>Initiative</h2>
 
-
<p>Initiative</p>
 
-
</div>
 
-
<div class="obox2">
 
-
<h2>Interviews</h2>
 
-
<p>Interviews</p>
 
-
</div>
 
-
<div class="obox3">
 
-
<h2>Design Considerations</h2>
 
-
<p>Design Considerations</p>
 
-
</div>
 
-
<div class="obox4">
 
-
<h2>Killswitch</h2>
 
-
<p>Kill Switch</p>
 
-
</div>
 
-
<div class="obox5">
 
-
<h2>Safety</h2>
 
-
<p>Safety</p>
 
-
</div>
 
-
<div class="obox6">
 
-
<h2>Community Outreach</h2>
 
-
<p>Community Outreach</p>
 
-
</div>
 
-
<div class="greenbox">
 
-
<h2>Project #1</h2>
 
-
<p>Project #1</p>
 
-
</div>
 
-
<div class="gbox1">
 
-
<h2>Detecting</h2>
 
-
<p>Project #1 Detection</p>
 
-
</div>
 
-
<div class="gbox2">
 
-
<h2>Reporting</h2>
 
-
<p>Project #1 Reporting</p>
 
-
</div>
 
-
<div class="gbox3">
 
-
<h2>Modelling</h2>
 
-
<p>Modelling for Project #1</p>
 
-
</div>
 
-
<div class="gbox4">
 
-
<h2>Prototyping</h2>
 
-
<p>Prototyping for Project #1</p>
 
-
</div>
 
-
<div class="bluebox">
 
-
<h2>Project #2</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
<div class="bbox1">
 
-
<h2>Decarboxylation</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
<div class="bbox2">
 
-
<h2>Catechol Degradation</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
<div class="bbox3">
 
-
<h2>Flux-Variability Analysis</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
<div class="bbox4">
 
-
<h2>Bioreactor</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
<div class="bbox5">
 
-
<h2>Upgrading</h2>
 
-
<p>Project #2</p>
 
-
</div>
 
-
</div>
 
</div>
</div>
-
 
+
{{Team:HokkaidoU_Japan/footer}}
-
 
+
-
 
+
-
 
+
-
+
-
<!-- </div> -->
+
-
</body>
+
-
</html>
+

Revision as of 08:14, 8 August 2013

Template:Team:HokkaidoU Japan/Index/Slideshow

HOKKAIDO U

Maestro E.coli

Motivation

Template:Team:HokkaidoU Japan/SocialButtons

  • HokkaidoU_Japan 2011

  • Welcome to the BIOxART Gallery!!

  • Be careful not to contaminate...

  • Meeting, meeting and MEETING!

  • Dr. E. coli get ready for the job

  • BIOxART, please feel free to look around

  • Experiment, experiment and EXPERIMENT!

Abstract

We further developed "Dr. E. coli": our project of iGEM 2010. Last year, we showed that Type 3 Secretion System (T3SS) works in E. coli by injecting GFP into RK13 cells. T3SS is a syringe like organelle found in bacterium such as Salmonella which uses it to inject virulence effector proteins into a target eukaryotic cell. We think this system can be applied to direct reprogramming of somatic cells among many other things.

We tested T3SS performance and tried to make it more convenient. For this purpose we designed a plasmid backbone which can instantly produce ready-to-inject fusion proteins from ordinary biobrick part. Using it, we tried to further characterize this system by injecting a library of protein domains.

In Science Gallery we exhibited awesome photographs related with biotechnology in public. We tried to catch the pedestrians’ interest in current synthetic biology and explore their thoughts.

BioArt

We held the new type science art gallery "Bio Art" at the center of Sapporo city.

This gallery is not only for our team.You can also enjoy Bio Art on this Web page. You can watch more detail in Human Practice page.

Contents

Acknowledgements

Laboratory and Personnel

  • Environmental Molecular Biology, Graduate School of Environmental Earth Science, Hokkaido University
Ken-ichi Yamazaki and Members of Yamazaki Lab
  • Molecular Biology, Institute for Genetic Medicine, Hokkaido University
Hisatoshi Shida
  • Nikon Imaging Center
Takeharu Nagai, Kenta Saito, Masahiro Nakano, Kentarou Kobayashi, Hiroshi Nishino
  • Laboratory of Molecular and Cellular Biophysics, Hokkaido University
Tomomi Nemoto, Terumasa Hibi, Ryosuke Kawakami
  • Muroran Marine Station Field Science Center for Northern Biosphere, Hokkaido University
Taizo Motomura
  • Laboratory of X-ray structural biology, Department of Advanced Transdisciplinary Science, faculty of Advanced Life Science
Isao Tanaka
  • Research Institute for Electronic Science, Hokkaido University

Academic Institutions

  • Salmonella Genetic Stock Center/University of Calgary
  • Graduate School of Environmental Earth Science
  • Department of biological science/School of Sciense
  • Institute for Genetic Medicine

Companies

  • Primary Cell Co., Ltd.
  • ECONiXE Co., Ltd.
  • Hokuto Kohki Engineering Co,. Ltd.
  • COSMO BIO Co., Ltd.
  • AMINO UP CHEMICAL Co., Ltd.
  • Mendel Workshop Co., Ltd.

</div>

Retrieved from "http://2013.igem.org/Team:UCSF/Home1"