Difference between revisions of "Team:Tokyo-NoKoGen"
(97 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
− | {{ | + | {{TeamTokyoNokogen}} |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | < | + | <html lang="ja"> |
− | < | + | <style> |
− | + | html, body{ | |
− | + | margin: 0; /* 余白の削除 */ | |
− | + | padding: 2.5%; /* 余白の削除 */ | |
− | + | position:absolute; | |
+ | top: -10px; | ||
+ | height: 100%; /* 縦の高さを100% */ | ||
+ | width: 100%; /* 横の幅を100% */ | ||
+ | } | ||
+ | div#wrap { | ||
+ | width:80%; | ||
+ | text-align:center; | ||
+ | position:relative; | ||
+ | min-height:100%; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | } | |
− | + | div#bannerContainer { | |
− | + | width:75%; | |
− | + | position:absolute; | |
+ | top:-10px; | ||
− | + | } | |
− | + | ||
− | + | ||
+ | div#box1 /*1段目の箱*/ { | ||
+ | width:900px; | ||
+ | height:330px; | ||
+ | margin-top:-10px; | ||
− | + | position:absolute; | |
− | + | top:260px | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | .overview { | ||
+ | width:600px; | ||
+ | height:300px; | ||
+ | margin-top:4px; | ||
+ | margin-left:10px; | ||
+ | background:#FFFFCC; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | |||
+ | .overview2{ | ||
+ | width:500px; | ||
+ | height:270px; | ||
+ | margin-top:10px; | ||
+ | margin-left:15px; | ||
+ | background:#ffffff; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor :pointer; | ||
+ | z-index:3; | ||
+ | } | ||
− | + | .team { | |
− | + | width:260px; | |
− | + | height:115px; | |
− | + | position:relative; | |
− | + | left:15px; | |
− | + | margin-top:10px; | |
− | + | margin-left:20px; | |
− | + | background:#CCFF99; | |
− | + | display: inline-block; _display: inline; | |
− | + | display: table-cell; /* ④ */ | |
+ | vertical-align: middle; | ||
+ | left:15px; | ||
+ | cursor:pointer; | ||
+ | } | ||
− | + | .notebook { | |
− | + | width:260px; | |
− | + | height:130px; | |
+ | position:relative; | ||
+ | margin-top:5px; | ||
+ | margin-left:15px; | ||
+ | margin-right:10px; | ||
+ | background:#91d176; | ||
+ | display: table-cell; | ||
+ | display: inline-block; _display: inline; | ||
+ | vertical-align: middle; | ||
+ | top:300px | ||
− | + | display: inline-block; _display: inline; | |
+ | cursor:pointer; | ||
+ | } | ||
+ | div#box2 /*2段目の箱*/ { | ||
+ | width:900px; | ||
+ | height:330px; | ||
+ | margin-top:-10px; | ||
+ | |||
+ | position:absolute; | ||
+ | top:340px; | ||
+ | left:0px; | ||
+ | } | ||
+ | .white{ | ||
+ | height:135px; | ||
+ | background:#ffffff; | ||
+ | } | ||
+ | |||
+ | |||
+ | .facebook { | ||
+ | width:200px; | ||
+ | height:135px; | ||
+ | position:relative; | ||
+ | left:15px; | ||
+ | margin-top:10px; | ||
+ | margin-left:20px; | ||
+ | background:#6b8bcd; | ||
+ | display: inline-block; _display: inline; | ||
+ | display: table-cell; /* ④ */ | ||
+ | vertical-align: middle; | ||
+ | position:absolute; | ||
+ | left:15px; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | .twitter { | ||
+ | width:200px; | ||
+ | height:140px; | ||
+ | position:relative; | ||
+ | left:15px; | ||
+ | margin-top:300px; | ||
+ | margin-left:20px; | ||
+ | background:#6b8bcd; | ||
+ | display: inline-block; _display: inline; | ||
+ | display: table-cell; | ||
+ | vertical-align: middle; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | |||
+ | |||
+ | .project { | ||
+ | width:650px; | ||
+ | height:260px; | ||
+ | margin-top:-290px; | ||
+ | margin-right:0px; | ||
+ | background: #79d480; | ||
+ | float:right; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | div#box3 /*3段目の箱*/ { | ||
+ | width:900px; | ||
+ | height:180px; | ||
+ | margin-top:-19px; | ||
+ | |||
+ | position:absolute; | ||
+ | top:350px | ||
+ | } | ||
+ | .Ache { | ||
+ | width:210px; | ||
+ | height:150px; | ||
+ | margin-top:10px; | ||
+ | margin-left:10px; | ||
+ | background:#71b4d0; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | .Human { | ||
+ | width:210px; | ||
+ | height:150px; | ||
+ | margin-top:10px; | ||
+ | margin-left:10px; | ||
+ | background:#6ecec7; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | .parts { | ||
+ | width:210px; | ||
+ | height:150px; | ||
+ | margin-top:10px; | ||
+ | margin-left:10px; | ||
+ | background:#7bd593; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor:pointer; | ||
+ | |||
+ | } | ||
+ | .safety { | ||
+ | width:210px; | ||
+ | height:150px; | ||
+ | margin-top:-5px; | ||
+ | margin-left:10px; | ||
+ | background:#7593d3; | ||
+ | display: inline-block; _display: inline; | ||
+ | float:left; | ||
+ | cursor:pointer; | ||
+ | } | ||
+ | |||
+ | |||
+ | p { | ||
+ | font-size:16px; | ||
+ | font-family:Georgia; | ||
+ | line-height:2; | ||
+ | } | ||
+ | h2{ | ||
+ | font-size:25px; | ||
+ | font-family:fantasy; | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | h1{ | ||
+ | font-size:14px; | ||
+ | font-family:fantasy; | ||
+ | text-decoration:none; | ||
+ | line-height: 120%; | ||
+ | } | ||
+ | |||
+ | h3{ | ||
+ | font-size:14px; | ||
+ | font-family:fantasy; | ||
+ | text-decoration:none; | ||
+ | line-height: 120%; | ||
+ | } | ||
+ | |||
+ | div#main { | ||
+ | width:1000px; | ||
+ | margin:0 auto; | ||
+ | background-color:#ffffff | ||
+ | text-align:center; | ||
+ | top:12px; | ||
+ | left:140px; | ||
+ | font-family:Georgia; | ||
+ | font-size:16px; | ||
+ | line-height:2; | ||
+ | } | ||
+ | |||
+ | |||
+ | div#nav { | ||
+ | width:100%; | ||
+ | margin:0 auto; | ||
+ | background-color:#E6FFE9 | ||
+ | text-align:center; | ||
+ | position:fixed; | ||
+ | z-index: 100; | ||
+ | top:18px; | ||
+ | } | ||
+ | |||
+ | div#nav td{ | ||
+ | width:300px;height:45px; | ||
+ | margin:0 auto; | ||
+ | text-align:center; | ||
+ | border:none; | ||
+ | font-family:fantasy; | ||
+ | font-size:18px; | ||
+ | } | ||
+ | |||
+ | #globalWrapper, #content { | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | border: 40px; | ||
+ | background-color: #E6FFE9; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | font-size: 100%; | ||
+ | } | ||
+ | html, body, .wrapper { | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: #E6FFE9; | ||
+ | |||
+ | .link_box{ | ||
+ | position:; | ||
+ | width:30%; | ||
+ | padding:5%; | ||
+ | border:solid 0px #CCC; | ||
+ | margin:0px auto 20px; | ||
+ | } | ||
+ | |||
+ | .link_box a{ | ||
+ | position:absolute; | ||
+ | top:0; | ||
+ | left:0; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | text-indent:-999px; | ||
+ | } | ||
+ | </style> | ||
+ | <div id="wrap"> | ||
+ | |||
+ | <div id="bannerContainer"/*バナー*/> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/8/82/Tokyo-NoKogen_banner.png" width="900" height="250"> | ||
+ | </div> | ||
+ | <div id="box1"/*見えない1段目のボックス*/> | ||
+ | |||
+ | <div class="overview"> | ||
+ | <div class="overview2"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px; "> <h2>Introduction</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/e/e6/NK-image1.jpeg" align=right width=150px; height=120px;> | ||
+ | <h3>What kind image do you have when you hear the word “termite”??<br><br> | ||
+ | Actually, this tiny insect has unimaginable voracity. <br> | ||
+ | They cause great damage for human life, but there is no way to exterminate terites completely and safely. <br><br> | ||
+ | To solve this problem, <br>Tokyo-NoKoGen “ExTermite Coli”, a new pesticides for Termites !!<br> | ||
+ | </h3> | ||
+ | |||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Overview" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor='#e7e7e7' ></a> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="team"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> <h2>Team</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/0/0f/NK-image23.jpeg" width=50px; height=50px;> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Team" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="notebook"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Protocol</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/5/5e/NK-image11.jpeg" width=50px; height=50px;> | ||
+ | <br> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Notebook" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | <div id="box2"/*見えない2段目のボックス*/> | ||
+ | <div class="facebook"> | ||
+ | <p style="position: relative;"> | ||
+ | <a href="https://www.facebook.com/tokyo.nokogen" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/c/cc/NK-image17.jpeg" style ="position:absolute; top:0px;left:20px;" width="150" height="100"><br/> | ||
+ | <span style="position: absolute; top: 0px; left: 5px; width: 10 px;"> | ||
+ | </span> | ||
+ | </a> | ||
+ | </p> | ||
+ | </div> | ||
+ | <div class="twitter"> | ||
+ | <div style="border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Twitter</h2> | ||
+ | <p style="position: relative;"> | ||
+ | <a href="https://twitter.com/iGEM_Nokogen" target="_blank"> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/8/80/NKtwitter.jpeg" style ="position:absolute;top:-70px;left:20px;" width="135" height="90"> | ||
+ | </a> | ||
+ | </p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="project"> | ||
+ | <div style="padding: 0px; border: none; background-color: #ffffff; margin: 4px;"> | ||
+ | <h2>project</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2015/2/23/NK-image7.jpeg" align=right width=130px; height=80px;> | ||
+ | |||
+ | <h3>The exterminateon of termites by ExTermite Coli involves three steps.<br> | ||
+ | We use “pseudo egg” to distribute the engineered E.coli. Using this unique tool, the engineered E.coli carried into the termite’s body. <br> | ||
+ | In the termite’s body, it produces toxic material to inhibit the metabolic pathway of the termites and exterminate termites. | ||
+ | After extermination of the termites, ExTermite Coli loses its function by light-induced lysis. <br> | ||
+ | On the project page, we explain about the details of our project, ExTermite Coli.</h3> | ||
+ | |||
+ | <span style="position: absolute; top: 5px; left: 5px; width: 10px;"></span> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Description" target="_blank"></a> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div id="box3"/*見えない3段目のボックス*/> | ||
+ | <div class="Ache"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Achievement</h2> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/achievement" target="_blank"></a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="Human"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Human practice</h2> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Practices" target="_blank"></a> | ||
+ | </div> | ||
+ | |||
+ | <div class="parts"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Parts</h2> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Parts" target="_blank"></a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | <div class="safety"> | ||
+ | <div style="padding: 5px; border: none; background-color: #ffffff; margin: 10px;"> | ||
+ | <h2>Safety</h2> | ||
+ | </div> | ||
+ | <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Safety" target="_blank"></a> | ||
+ | </div> | ||
+ | |||
+ | |||
+ | </div> | ||
+ | |||
+ | |||
+ | |||
+ | </div> | ||
+ | </div> | ||
+ | <script type="text/javascript"> | ||
+ | $(function(){ | ||
+ | $(".overview").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | |||
+ | $(function(){ | ||
+ | $(".team").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".facebook").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".twitter").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".notebook").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".project").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".Ache").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".Human").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".parts").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | $(function(){ | ||
+ | $(".safety").click(function(){ | ||
+ | window.location=$(this).find("a").attr("href"); | ||
+ | return false; | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | |||
+ | |||
+ | <!--footer--> | ||
+ | <style> | ||
+ | div#wrapper2 { | ||
+ | width:80%; | ||
+ | text-align:center; | ||
+ | position:relative; | ||
+ | min-height:100%; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | div#footer { | ||
+ | width:900px; | ||
+ | position:relative; | ||
+ | left:-12%; | ||
+ | bottom:-1200px; | ||
+ | background-color:#ffffff; | ||
+ | border-width: thick; | ||
+ | border-color: #ADFF2F; | ||
+ | border-style:inset; | ||
+ | } | ||
+ | div#footer img { | ||
+ | height:50px; | ||
+ | } | ||
+ | p { | ||
+ | font-size:16px; | ||
+ | font-family:Georgia; | ||
+ | line-height:2; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <body> | ||
+ | |||
+ | <div id="wrapper2"> | ||
+ | <div id="footer"> | ||
+ | <a href="http://www.asante.co.jp"><img src="https://static.igem.org/mediawiki/2015/a/a8/NK-image25.jpeg"></a> | ||
+ | <a href="http://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2014/5/5e/Noko14_IDT.png"></a> | ||
+ | <a href="http://www.ultizyme.jp/"><img src="https://static.igem.org/mediawiki/2014/c/ce/Noko14_Image91.jpg"></a><br> | ||
+ | <a href="http://www.cosmobio.co.jp/index_e.asp"><img src="https://static.igem.org/mediawiki/2014/e/e5/Noko14_Logo_e.jpg"></a> | ||
+ | <a href="http://www.mbl.co.jp/e/index.html"><img src="https://static.igem.org/mediawiki/2014/4/4f/Noko14_MBL.gif"></a> | ||
+ | <a href="http://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2014/a/ad/Noko14_li.png"></a> | ||
+ | <a href="http://www.tuat.ac.jp/en/index.html"><img src="https://static.igem.org/mediawiki/2014/3/39/Noko14_tuat.png"></a> | ||
+ | <a href="http://www.tuat.ac.jp/~tanpaku/"><img src="https://static.igem.org/mediawiki/2014/3/3c/Noko14_ike.jpg"></a> | ||
+ | <a href="http://www.tuat.ac.jp/~kakusan/index.html"><img src="https://static.igem.org/mediawiki/2014/7/77/Noko14_ikeken.jpg"></a> | ||
+ | </div> | ||
+ | </div> | ||
+ | </body> | ||
+ | <!--footer--> | ||
− | |||
</html> | </html> |
Latest revision as of 18:32, 23 November 2015