Difference between revisions of "Team:Tokyo Tech"

 
(38 intermediate revisions by 8 users not shown)
Line 1: Line 1:
−
 
+
{{Tokyo_Tech}}
  
 
<html>
 
<html>
Line 7: Line 7:
  
 
<script type="text/javascript">
 
<script type="text/javascript">
−
function slideSwitch() {
 
−
  var $active = $('#slideshow img.active');
 
  
−
  if ( $active.length == 0 ) $active = $('#slideshow img:last');
+
</script>
  
−
  var $next = $active.next().length ? $active.next()
+
<style type="text/css">
−
      : $('#slideshow img:first');
+
<!--
  
−
  $active.addClass('last-active');
+
p.resizeimage {
−
 
+
position: relative;
−
   $next.css({opacity: 0.0})
+
width: 90%;
−
      .addClass('active')
+
   max-width: 1100px;
−
      .animate({opacity: 1.0}, 1000, function() {
+
  min-width: 240px;
−
          $active.removeClass('active last-active');
+
  margin: 0 auto;
−
      });
+
 
}
 
}
−
 
−
$(function() {
 
−
  setInterval( "slideSwitch()", 3000 );
 
−
});
 
−
</script>
 
−
 
−
 
−
</script>
 
−
 
−
<style type="text/css"><!--
 
−
 
 
p.resizeimage img { width: 100%; }
 
p.resizeimage img { width: 100%; }
−
 
−
#slideshow img {
 
−
  position: absolute;
 
−
  top: 150;
 
−
  left:0;
 
−
  z-index: 8;
 
−
  opacity: 0.0;
 
−
}
 
−
#slideshow img.active {
 
−
  z-index: 10;
 
−
  opacity: 1.0;
 
−
}
 
−
#slideshow img.last-active {
 
−
  z-index: 9;
 
−
}
 
  
  
Line 73: Line 44:
  
  
−
/*#logo{
 
−
width: 90%;
 
−
min-width: 880px;
 
−
max-width: 1100px;
 
−
color: #ffffff;
 
−
// position: absolute;
 
−
margin: 0 auto;
 
−
padding: 2px;
 
−
border: 3px solid #583612;
 
−
    border-radius: 5px;        /* CSS3 */ 
 
−
  /* -webkit-border-radius: 5px;    /* for Safari,Google Chrome */ 
 
−
  /* -moz-border-radius: 5px;  /* for Firefox */ 
 
  
−
/*}
+
 
−
#inner_logo{
+
/****************** this page setting ********************/
−
margin: 0;
+
p#home_sponsors{
−
padding: 0;
+
    text-align: center;
−
border: 9px solid #583612;
+
−
background-color:rgba(255,255,255,0.5)
+
−
}*/
+
−
#under_logo{
+
−
width: 880px;
+
−
// midth: 90%;
+
−
// min-width: 880px;
+
−
// max-width: 1100px;
+
−
margin: 5px auto 0;
+
 
}
 
}
−
#under_logo img{
+
p#home_sponsors img{
−
float: left;
+
    height: 150px;
 
}
 
}
−
p#logo_sentence{
+
p#main_contents p.normal_text{
−
font-family: "Times New Roman";
+
font-size: 18px;
−
font-size: 30px;
+
text-indent: 18px;
 
text-align: center;
 
text-align: center;
−
font-style: italic;
+
// padding: 18px;
−
color: #583612;
+
    font-family: 'Century', serif;
−
float: left;
+
 
−
margin-left: 100px;
+
−
margin-right: 100px;
+
 
}
 
}
−
p#logo_image_space1{
+
 
−
width: 30px;
+
/*body{
−
float: left;
+
    background-image: url("https://static.igem.org/mediawiki/2016/8/83/Tokyo_Tech_Background.png");
 +
    background-repeat: no-repeat;
 +
    background-position: center center;
 +
    background-size: cover;
 +
    background-attachment: fixed;
 
}
 
}
−
p#logo_image_space2{
+
#globalWrapper, #content{
−
width: 40px;
+
    background: transparent;
−
float: left;
+
 
}
 
}
−
 
+
#content{
−
 
+
//   background-image: url("https://static.igem.org/mediawiki/2016/8/83/Tokyo_Tech_Background.png");
−
/****************************** About Menu ************************************/
+
−
 
+
−
#menu_list_division{
+
−
width: 90%;
+
−
min-width: 880px;
+
−
max-width: 1100px;
+
 
     margin: 0 auto;
 
     margin: 0 auto;
−
     margin-bottom: 40px;
+
}*/
 +
/**********************************************************************/
 +
#main_contents{
 +
     margin: 0 auto;
 +
    width: 90%;
 +
    min-width: 880px;
 +
    max-width: 1100px;
 
}
 
}
−
#menu_list_divison ul.menu_list_class{
+
.container{
−
*zoom: 1;
+
    margin: 5px auto;
−
list-style: none;
+
    background: #ffffff;
−
width: 100%;
+
    border: 1px solid #583612;
−
min-width: 880px;
+
−
max-width: 1100px;
+
−
margin: 5px auto 30px;
+
−
padding: 0 auto;
+
−
display: table;
+
−
box-sizing: border-box;
+
 
}
 
}
−
.menu_list_class:before, .menu_list_class:after{
+
.container_top h1{
−
content: "";
+
margin-top: 1px;
−
display: table;
+
font-size: 36px;
 
}
 
}
−
.menu_list_class:after{
+
.container_header{
−
clear: both;
+
    background: #ffffff;
 +
    text-align: center;
 
}
 
}
−
.menu_list_class li{
+
.container_header span{
−
display: table-cell;
+
    border-bottom: 2px solid #583612;
−
position: relative;
+
−
margin: 0 5%;
+
−
padding: 0 1%;
+
−
text-align: center;
+
 
}
 
}
−
 
+
.container_contents{
−
#menu_list_class li:nth-child(5n+1){
+
line-height: 1.5em;
−
margin: 0 1% 0 0;
+
width: 800px;
 +
margin: 0 auto;
 +
padding-bottom: 10px;
 
}
 
}
−
.menu_list1 li:nth-child(5n){
+
#main_contents p.normal_text{
−
margin: 0 0 0 1%;
+
−
}
+
−
.menu_list2 li:nth-child(4n){
+
−
margin: 0 0 0 1%;
+
−
}
+
−
.menu_list_class li a{
+
−
display: block;
+
−
box-sizing: border-box;
+
−
height: 48px;
+
−
margin: 0;
+
−
padding: 15px 30px 11px;
+
−
color: #583612;
+
 
font-size: 18px;
 
font-size: 18px;
−
font-family: "Imprint MT Shadow";
+
text-indent: 18px;
−
line-height: 1;
+
text-align: justify;
−
text-decoration: none;
+
// padding: 18px;
−
border: 3px double #583612;
+
    font-family: 'Century', serif;
−
background-color:rgba(255,255,255,0.5)
+
−
}
+
−
.menu_list_class li a:hover{
+
−
background: #583612;
+
−
color: #ffffff;
+
−
}
+
−
.menu_list_class li:hover ul li{
+
−
overflow: visible;
+
−
height: 48px;
+
−
// background: #583612;
+
 
}
 
}
  
−
 
+
/************************* Show/Hide setting ***************************/
−
#menu_list_division ul.drop_menu{
+
.on{
−
list-style: none;
+
−
// left: -100%;
+
−
left: 0;
+
−
z-index: 9999;
+
−
// top: 95%;
+
−
top: 100%;
+
−
margin: 0;
+
−
padding: 0;
+
−
}
+
−
.drop_menu li{
+
 
display: block;
 
display: block;
−
width: 100%;
+
-webkit-transiton: all 0.6s ease;
−
overflow: hidden;
+
transition: all 0.6s ease;
−
height: 0px;
+
−
transition: .5s;
+
−
margin: 0;
+
−
padding: 0;
+
 
}
 
}
−
.drop_menu li a{
+
.off{
−
display: block;
+
display: none;
−
box-sizing: border-box;
+
-webkit-transiton: all 0.6s ease;
−
margin: 0;
+
transition: all 0.6s ease;
−
width: 100%;
+
−
padding: 5px 15px;
+
−
// padding: 0 15px;
+
−
height: 48px;
+
−
border-top: 1px solid #583612;
+
−
text-align: left;
+
 
}
 
}
−
.drop_menu li:hover > a{
 
−
// background: #0d4f78;
 
−
}
 
−
.drop_menu li a:hover{
 
−
background: #583612;
 
−
color: #ffffff;
 
−
}
 
−
 
−
.drop_menu li:hover ul li{
 
−
overflow: visible;
 
−
height: 48px;
 
−
// background: #186b91;
 
−
}
 
−
#menu_list_division ul.second_level_menu{
 
−
list-style: none;
 
−
position: absolute;
 
−
top: 0;
 
−
/* top: -8%; // for igem page */
 
−
left: 100%;
 
−
/* left: 90%; // for igem page */
 
−
right: 80%;
 
−
margin: 0;
 
−
padding: 0;
 
−
// background: #0d4f78;
 
−
-webkit-transition: all .5s ease;
 
−
transition: all .5s ease;
 
−
}
 
−
.second_level_menu li{
 
−
display: inline-block;
 
−
position: relative;
 
−
transition: .2s;
 
−
margin: 0;
 
−
padding: 0;
 
−
}
 
−
.second_level_menu li a{
 
−
display: inline-block;
 
−
box-sizing: border-box;
 
−
// width: 100%;
 
−
margin: 0;
 
−
padding: 5px 15px;
 
−
height: 48px;
 
−
border-top: 1px solid #583612;
 
−
// background: #0d4f78;
 
−
text-align: left;
 
−
text-decoration: none;
 
−
}
 
−
 
−
.menu_list_class li:hover ul li ul{
 
−
overflow: hidden;
 
−
width: 0%;
 
−
}
 
−
.menu_list_class li ul li:hover ul{
 
−
overflow: visible;
 
−
width: 100%;
 
−
}
 
−
.menu_list_class li ul li:hover ul li{
 
−
overflow: visible;
 
−
width: 100%;
 
−
height: 48px;
 
−
// background: #186b91;
 
−
 
−
}
 
−
#menu_list1{
 
−
margin: 5px auto 30px;
 
−
}
 
−
#menu_list2{
 
−
margin: 5px auto 5px;
 
−
}
 
−
#experiment_list{
 
−
width: 60%;
 
−
}
 
−
#menu_list_division ul#promoter_list{
 
−
position: absolute;
 
−
top: -100%;
 
−
}
 
−
 
−
body{
 
−
 
−
  background-image: url(https://static.igem.org/mediawiki/2016/e/eb/T--Tokyo_Tech--Background.png);
 
  
−
  background-position: center center;
+
/************************* This page setting ******************************/
  
−
  background-repeat: no-repeat;
 
  
−
  background-attachment: fixed;
 
  
−
  background-size: cover;
 
−
 
 
−
  background-color: #464646;
 
 
}
 
}
  
 
--></style>
 
--></style>
−
 
 
</head>
 
</head>
 
<body>
 
<body>
  
−
<div id="logo">
 
−
<div id="inner_logo" align="center">
 
−
<img src="https://static.igem.org/mediawiki/2016/7/7c/T--Tokyo_Tech--Topnew.png" height="300px" />
 
−
</div><!-- /inner_logo -->
 
−
</div><!-- /logo -->
 
  
−
<div class="clear"></div><!-- /clear -->
+
−
<div id="menu_list_division">
+
−
<ul id="menu_list1" class="menu_list_class">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech"><span>Home</span></a></li>
+
<br>
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Project">Project</a></li>
+
<br> 　　　　
−
<li><a href="javascript:void(0);">Experiment</a>
+
                <div id="ID" class="container">
−
<ul id="experiment_list" class="drop_menu">
+
        <div id="ID_header" class="container_header">
−
<li><a>1. Toxin Assay</a>
+
<h2><span>Our story</span></h2>
−
<ul id="toxin_list" class="second_level_menu assay_menu">
+
</div><!-- /_header -->
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Toxin_Assay/Overview" >1.0. Overview</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Toxin_Assay/Adjustment_of_Expression_of_MazF" style="font-size: 14px">1.1. Adjustment of Expression of MazF</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Toxin_Assay/mazEF_System_Assay">1.2. <span style="font-style : italic">mazEF</span> System Assay</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Toxin_Assay/Queens_Capricious">1.3. Queen's Capricious</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Toxin_Assay/Queens_capricious">1.4. <span style="font-style : italic">yafNO</span> System Assay</a></li>
+
−
</ul><!-- /toxin_list -->
+
−
</li>
+
−
<li><a>2. AHL Assay</a>
+
−
<ul id="ahl_list" class="second_level_menu assay_menu">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/AHL_Assay/AHL_Reporter_Assay">2.1. AHL Reporter Assay</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/AHL_Assay/Only_Assay">2.2. Only Assay</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/AHL_Assay/Rhl_System_Assay">2.3. Rhl System Assay</a></li>
+
−
</ul><!-- /ahl_list -->
+
−
</li>
+
−
<li><a>3. AmiE Assay</a>
+
−
<ul id="AmiE_list" class="second_level_menu assay_men">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/AmiE_Assay">3. AmiE</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a style="font-size: 14px; height: 60px;">4. Temperature Dependent Promoter Assay</a>
+
−
<ul id="promoter_list" class="second_level_menu assay_men">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Promoter_Assay/Pcold">4.1. Pcold</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Promoter_Assay/Pheat">4.2. Pheat</a></li>
+
−
</ul><!-- /promoter_list -->
+
−
</li>
+
−
</ul><!-- /experiment_list -->
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Model">Model</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Parts">Parts</a>
+
−
<ul id="parts_list" class="drop_menu">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Parts_Overview">Overview</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Basic_Part">Basic Parts</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Composite_Part">Composite Parts</a></li>
+
−
</ul><!-- /parts_list -->
+
−
</li>
+
−
</ul><!-- /menu_list1 -->
+
−
<ul id="menu_list2" class="menu_list_class">
+
−
<li><a href="javascipt:void(0);">Achievements</a>
+
−
<ul id="achivements_list" class="drop_menu">
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Medal">Medal Requirements</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Processing">Best Information Processing</a></li>
+
−
</ul><!-- /achivements_list -->
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices">Human Practices</a>
+
−
<ul id="human_practices_list" class="drop_menu">
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#overview">Human Practices Overview</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#3E">HP 3E</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Policy_and_Practices">HP Policy and Practices</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices#Snow_White_Varieties">HP Snow White Varieties</a></li>
+
−
</ul><!-- /human_practices_list -->
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Tokyo_Tech/Collaborations">Collaborations</a>
+
−
</li>
+
−
<li><a href="javascript:void(0);">About us</a>
+
−
<ul id="about_ts_list" class="drop_menu">
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Description">Description</a></li>
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Team">Team</a></li>
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Attributions">Attribution and Contribution</a></li>
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Safety">Safety</a></li>
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/HomecomingDay">Homecoming Day</a></li>
+
−
<li class="drop_list"><a href="https://2016.igem.org/Team:Tokyo_Tech/Sponsors">Sponsors</a></li>
+
−
<li class="drop_list"><a href="https://igem.org/Team.cgi?team_id=1949">Official Team Page</a></li>
+
−
</ul><!-- /about_us_list -->
+
−
</li>
+
−
</ul><!-- /menu_list2 -->
+
−
</div><!-- /menu_list_division -->
+
  
 +
<div id="ID_contents" class="container_contents">
 +
        <p class="normal_text">In this iGEM competition, iGEM 2016 team Tokyo_Tech planned to tell the public about synthetic biology, <span style="font-style : italic">Escherichia coli</span>
 +
, and bacterial Toxin &#8208; Antitoxin system (TA system), as well as enjoyed our activity for iGEM. We participated in the school festival (a poster session), gave classes to high school students, and collected feedback from the public as Human Practices. As a consequence of these activities, we noticed that, through the familiar story in everyone’s childhood, the public more easily gets interested in unfamiliar things such as TA system. Therefore, we decided to employ Snow White as the topic of our project this year.<span style="font-style : italic">E.coli</span> was used to recreate the Snow White story, and based on the simulation, the Snow White story with the prospective of the real beauty was also evaluated. Moreover, in order to respond further to the feedback that we received, the software was developed which enables selective protein production. <p class="caption" style="font-size: 16px;"><a href ="https://2016.igem.org/Team:Tokyo_Tech/Human_Practices" align="center"> (See the Human Practices page) </a>
 +
</p></div>
  
 +
<br><br>
 +
        </p>
  
−
<p id="slideshow" class="resizeimage">
+
        <div id="ID_header" class="container_header">
−
    <img src="https://static.igem.org/mediawiki/2016/1/14/T--Tokyo_Tech--slide1.png" alt="" class="active" />
+
<h2><span>Sponsors</span></h2>
−
    <img src="https://static.igem.org/mediawiki/2016/7/72/T--Tokyo_Tech--slide2.png" alt="" />
+
</div><!-- /_header -->
−
    <img src="https://static.igem.org/mediawiki/2016/5/5a/T--Tokyo_Tech--slide3.png" alt="" />
+
−
    <img src="https://static.igem.org/mediawiki/2016/9/95/T--Tokyo_Tech--slide4.png" alt="" />
+
−
    <img src="https://static.igem.org/mediawiki/2016/a/ad/T--Tokyo_Tech--slide5.png" alt="" />
+
−
    <img src="https://static.igem.org/mediawiki/2016/5/52/T--Tokyo_Tech--slide6.png" alt="" />
+
−
    <img src="https://static.igem.org/mediawiki/2016/f/ff/T--Tokyo_Tech--slide7.png" alt="" />
+
−
    <img src="https://static.igem.org/mediawiki/2016/c/c9/T--Tokyo_Tech--slide8.png" alt="" />
+
−
</p>
+
  
  
  
−
<p align="center" class="logo_sponsors"><img src="https://static.igem.org/mediawiki/2016/c/c7/Tokyo_Tech_kurame_logo.gif" height="150"><img src="https://static.igem.org/mediawiki/2016/c/c2/Tokyo_Tech_Saitama.JPG
+
<p align="center" class="" id="home_sponsors"><img src="https://static.igem.org/mediawiki/2016/c/c7/Tokyo_Tech_kurame_logo.gif" ><img src="https://static.igem.org/mediawiki/2016/c/c2/Tokyo_Tech_Saitama.JPG
−
" height="150"><img src="https://static.igem.org/mediawiki/2016/9/93/Tokyo_Tech_Fund.jpg" height="150"><img src="https://static.igem.org/mediawiki/2016/4/47/Tokyo_Tech_JASSO.gif
+
"> <br /><img src="https://static.igem.org/mediawiki/2016/9/93/Tokyo_Tech_Fund.jpg" ><img src="https://static.igem.org/mediawiki/2016/4/47/Tokyo_Tech_JASSO.gif
−
" height="150"><img src="https://static.igem.org/mediawiki/2016/0/07/Tokyo_Tech_Promega.jpg
+
"> <br /><img src="https://static.igem.org/mediawiki/2016/0/07/Tokyo_Tech_Promega.jpg
−
" height="150"><img src="https://static.igem.org/mediawiki/2016/f/f6/Tokyo_Tech_cosmo_bio.png
+
"><img src="https://static.igem.org/mediawiki/2016/f/f6/Tokyo_Tech_cosmo_bio.png
−
" height="150"></p>
+
"><br /><img src="https://static.igem.org/mediawiki/2016/a/a2/Tokyo_Tech_IDT.png" /></p><!-- /home_sponsors -->
 +
 
 +
</div>
 +
</div></div>
  
  
Line 427: Line 175:
 
var width = document.body.clientWidth;
 
var width = document.body.clientWidth;
  
−
var menu = document.getElementById('logo_sponsors');
+
var menu = document.getElementsByClassName('logo_sponsors')[0];
  
−
var menuMarginTop = width * 3 / 5;
+
var menuMarginTop = width * 3 / 5 + 150;
  
−
console.log (width);
 
  
−
menu.style.marginTop = menuMarginTop;
+
menu.style.marginTop = menuMarginTop + 'px';
  
 +
}
  
−
/*var menu = document.getElementById('menu_list_division');
 
−
var slide = document.getElementById('slideshow');
 
−
var images = slide.children;
 
−
 
−
var margin = menu.offsetHeight;
 
−
 
−
console.log(margin);
 
−
 
−
for(var img in images){
 
−
 
−
img.style.top = margin;
 
−
}
 
−
}*/
 
 
</script>
 
</script>
 
</body>
 
</body>
 
</html>
 
</html>
 +
{{Team:Tokyo_Tech/template2016}}
 +
{{Tokyo_Tech/Footer}}

Latest revision as of 05:47, 30 November 2016



　　　　

Our story

In this iGEM competition, iGEM 2016 team Tokyo_Tech planned to tell the public about synthetic biology, Escherichia coli , and bacterial Toxin ‐ Antitoxin system (TA system), as well as enjoyed our activity for iGEM. We participated in the school festival (a poster session), gave classes to high school students, and collected feedback from the public as Human Practices. As a consequence of these activities, we noticed that, through the familiar story in everyone’s childhood, the public more easily gets interested in unfamiliar things such as TA system. Therefore, we decided to employ Snow White as the topic of our project this year.E.coli was used to recreate the Snow White story, and based on the simulation, the Snow White story with the prospective of the real beauty was also evaluated. Moreover, in order to respond further to the feedback that we received, the software was developed which enables selective protein production.

(See the Human Practices page)



Sponsors