Biomod/2012/Tianjin/Team: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
Line 6: Line 6:
     position: relative;
     position: relative;
     width: 600px;
     width: 600px;
     height: 120px;
     height: 150px;
     float: left;
     float: left;
     margin: 10px;
     margin: 10px;

Revision as of 18:44, 27 October 2012

<html> <style> /* Back to top css */ .back-to {

   position: fixed;
   bottom: 35px;
   *bottom: 50px;
   _bottom: 35px;
   right: 10px;
   z-index: 999;
   width: 50px;
   zoom: 1
   }
  • html .back-to {
   /* 不能用 _position 这种写法,因为它在IE7+也会执行expression。。。 */
   position: expression(function(ele){ele.runtimeStyle.position='absolute';Expressions.style.position.fixed(ele);}(this))
   }

.back-to {

   float: right;
   display: block;
   width: 50px;
   height: 50px;
   background: url(http://a.xnimg.cn/imgpro/button/back-home.png) no-repeat 0 0;
   outline: 0 none;
   text-indent: -9999em;
   }

.back-to:hover {

   background-position: -50px 0
   }

.back-to .back-top {

   float: right;
   display: block;
   width: 50px;
   height: 50px;
   background: url(http://a.xnimg.cn/imgpro/button/back-top.png) no-repeat 0 0;
   margin-left: 10px;
   outline: 0 none;
   text-indent: -9999em
   }

.back-to .backtotop {

   float: left;
   display: block;
   width: 50px;
   height: 50px;
   background: #666 url(http://a.xnimg.cn/imgpro/arrow/btt.png) 8px -57px no-repeat;
   margin-bottom: 15px;
   outline: 0 none;
   text-indent: -9999em;
   -moz-border-radius: 4px;
   -khtml-border-radius: 4px;
   -webkit-border-radius: 4px;
   border-radius: 4px;
   position: relative
  -moz-box-shadow:  0px 0px 15px #ccc;
  -webkit-box-shadow:  0px 0px 15px #ccc;
  box-shadow:  0px 0px 15px #ccc;
   }

.back-to .backtotop:hover {

   background-color: #333;
   background-position: 8px 13px
   }

.back-to .backtotop .back-tip {

   position: absolute;
   visibility: hidden;
   top: -31px;
   left: -10px
   }

.back-to .backtotop:hover .back-tip {

   visibility: visible
   }

.back-to .back-top:hover {

   background-position: -50px 0
   }

/* changed default background */

.container{background-color: #ffffff; margin-top:0px}

  1. column-content {width: 0px; float: left; margin: 0 0 0 0;padding: 0;}

.firstHeading {display:none; width:0px;}

  1. column-one {display:none; width:0px;background-color: #ffffff;}
  1. globalWrapper{width: 970px; background-color: #ffffff; margin-left: auto; margin-right: auto;

-moz-box-shadow: 0px 0px 15px #ccc; -webkit-box-shadow: 0px 0px 15px #ccc; box-shadow: 0px 0px 15px #ccc;}

  1. content{ margin: 0 0 0 0; align: center; padding: 12px 12px 12px 12px; width: 940px;background-color: #ffffff; border: 0;}
  2. bodyContent{ width: 940px; align: center; background-color: #ffffff;}
  3. column-content{width: 970px;background-color: #ffffff;}

body { background: url(http://openwetware.org/images/1/13/TJU2012-Bg.gif) repeat-x #F9F9F7; }


/* basic link rules */


a:link { color: #4F6DDC; } a:visited { color: #4F6DDC; } a:hover { color: #4F6DDC; text-decoration: none; }


/* -- navigator css -- */

  1. navDiv ul { margin: 0; padding: 0;}
  2. navDiv li { margin: 0; padding: 0;}
  3. navDiv a { margin: 0; padding: 0;}
  4. navDiv ul {list-style: none; z-index:999;}
  5. navDiv a {text-decoration: none;}
  6. navDiv

{ position: relative; height: 40px; width:970px; left: -12px; top: 0px; background-color: #111; background-repeat: repeat-x; box-shadow: 0px 5px 8px rgba(0,0,0,0.4); margin-bottom:20px; }


  1. navDiv > ul > li {
   float: left;
   margin-left: 38px;
   position: relative;

}

  1. navDiv > ul > li > a {
   color: #aaa;
   font-family: Verdana, 'Lucida Grande';
   font-size: 15px;
   line-height: 40px;
   padding: 11px 20px;

-webkit-transition: color .15s;

  -moz-transition: color .15s;
    -o-transition: color .15s;
       transition: color .15s;

}

  1. navDiv > ul > li > a:hover {color: #333333; background-color: #FFFFFF;}


  1. navDiv > ul > li > ul

{

   opacity: 0;
   visibility: hidden;
   padding: 16px 0 20px 0;
   background-color: rgb(250,250,250);
   text-align: left;
   position: absolute;
   top: 30px;
   left: 50%;
   margin-left: -90px;
   width: 180px;

-webkit-transition: all .3s .1s;

  -moz-transition: all .3s .1s;
    -o-transition: all .3s .1s;
       transition: all .3s .1s;

-webkit-border-radius: 5px;

  -moz-border-radius: 5px;
       border-radius: 5px;

-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

  -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
       box-shadow: 0px 1px 3px rgba(0,0,0,.4);

}

  1. navDiv > ul > li:hover > ul

{

   opacity: 1;
   top: 40px;
   visibility: visible;

}

  1. navDiv > ul > li > ul:before

{

   content: '';
   display: block;
   border-color: transparent transparent rgb(250,250,250) transparent;
   border-style: solid;
   border-width: 10px;
   position: absolute;
   top: -20px;
   left: 50%;
   margin-left: -10px;

}

  1. navDiv > ul ul > li { position: relative;}
  1. navDiv ul ul a

{

   color: rgb(50,50,50);
   font-family: Verdana, 'Lucida Grande';
   font-size: 13px;
   background-color: rgb(250,250,250);
   padding: 5px 8px 7px 16px;
   display: block;

-webkit-transition: background-color .1s;

  -moz-transition: background-color .1s;
    -o-transition: background-color .1s;
       transition: background-color .1s;

}

  1. navDiv ul ul a:hover {background-color: rgb(240,240,240);}


  1. navDiv ul ul ul

{

   visibility: hidden;
   opacity: 0;
   position: absolute;
   top: -16px;
   left: 206px;
   padding: 16px 0 20px 0;
   background-color: rgb(250,250,250);
   text-align: left;
   width: 160px;

-webkit-transition: all .3s;

  -moz-transition: all .3s;
    -o-transition: all .3s;
       transition: all .3s;

-webkit-border-radius: 5px;

  -moz-border-radius: 5px;
       border-radius: 5px;

-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);

  -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
       box-shadow: 0px 1px 3px rgba(0,0,0,.4);

}


  1. navDiv ul ul > li:hover > ul { opacity: 1; left: 196px; visibility: visible;}


  1. navDiv ul ul a:hover

{

   background-color: #777777;
   color: rgb(240,240,240);

}


/* Abstract in pages css */

  1. tianjin-right-content {

float: right; width: 280px; margin-left: 20px; font-family:"Calibri"; font-size:120%; }

  1. tianjin-right-content ul {

margin: 0; padding: 0 1em; }

  1. tianjin-right-content ul li {

list-style: none; margin: 0 0 1em 0; } .tianjin-description { font-size: small; color: #8A8A8A; }

/* Text content css*/

  1. text-content {

width:620px; font-family:"Calibri"; font-size:120%; padding: 10px 10px 10px 10px; }

/* footer in the middle */

  1. footer{position: center; width: 970px;}

</style>

<!--header starts here-->

<div id="header"> <div class="title" style="height: 180px;"> <a href="http://openwetware.org/wiki/Biomod/2012/Tianjin"><img src ="http://openwetware.org/images/7/79/TJU2012-Header.png"></a> <div style="float:right;"><img src="http://openwetware.org/images/c/cd/TJU2012-logo.png"></div> <div class="topsearch" style="position:absolute;top:175px;right:90px;"> <form method="GET" action="http://www.google.com/search"> <input type="hidden" name="hl" value="en"> <input type="hidden" name="sitesearch" value="openwetware.org"> <input type="hidden" name="domains" value="openwetware.org"> <input type="hidden" name="as_epq" value="Tianjin"> <input type="text" name="q" class="frm"><input type="submit" class="btn" value="Search"> </form> </div> </div> </div>

<!--navigator starts here-->

<div id="navDiv">

<ul>

  	    <li class='active '><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin'><span>Home</span></a></li>
  	    <li class='active '><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Team'><span>Team</span></a>
       </li>
  	    <li class='has-sub'><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Project/Background'><span>Designs</span></a>
  	        <ul>
  	            <li><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Project/Background'><span>Background</span></a></li>
               <li><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Project/LogicGate'><span>The Logic Gate</span></a></li>
               <li><a href="http://openwetware.org/wiki/Biomod/2012/Tianjin/Project/YDNA"><span>Y-DNA</span></a></li>
               <li><a href="http://openwetware.org/wiki/Biomod/2012/Tianjin/Project/Origami"><span>The Origami Amplifier</span></a></li>
 	        </ul>   

</li>

<li class='has-sub'><a href='#'><span>Experiments and Results</span></a>

  	        <ul>
  	            <li><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Result/LogicGate'><span>The Logic Gate</span></a></li>
               <li><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Result/YDNA'><span>Y-DNA</span></a></li>
               <li><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Result/Origami'><span>The Origami Amplifier</span></a></li>

</ul>

       </li>   	
  	    <li class='active'><a href="http://openwetware.org/wiki/Biomod/2012/Tianjin/Protocol"><span>Protocol</span></a> 

</li>

           <li class='active'><a href='http://openwetware.org/wiki/Biomod/2012/Tianjin/Attributions'><span>Attributions</span></a></li>

</ul> </div>

<div id="toolBackTo" class="back-to" style="left: 1175px; "> <a stats="site_footer_back_to_top" class="backtotop" href="#top" onclick="if(Sizzle('#sidebar2 .ready-to-fix')[0]) Sizzle('#sidebar2 .ready-to-fix')[0].style.position = 'static';window.scrollTo(0,0);if(Sizzle('#sidebar2 .ready-to-fix')[0]) Sizzle('#sidebar2 .ready-to-fix')[0].style.position = '';return false;">Back to top <img stats="site_footer_back_to_top" src="http://openwetware.org/images/a/a7/TJU2012-Back-tip.png" class="back-tip"> </a> </div>


</html> <html>

<style type="text/css"> .team-tab {

   position: relative;
   width: 600px;
   height: 150px;
   float: left;
   margin: 10px;
   padding: 20px;
   border: 1px double #e4e4e4;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   background: #f7f7f7;
   color: #ababab;
   overflow: hidden;

} .team-tab:hover { background:#fff;

  -moz-box-shadow:  0px 0px 15px #ccc;
  -webkit-box-shadow:  0px 0px 15px #ccc;
  box-shadow:  0px 0px 15px #ccc;

} .team-tab:hover, .team-tab:hover h3{

  color:#3d3d3d;

} .team-tab h3{

  color:#ababab;

} .team-tab a{

  color:#ababab;
  text-decoration:none;

}

.team-tab a:hover{

  text-decoration:none;

}

.team-tab p{

  text-indent: 0;

} .team-tab h3:before {

   content: "";
   position: absolute;
   display: block;
   width: 66px;
   height: 100px;
   border: 1px solid #dedede;
   background: url(http://openwetware.org/images/6/67/TJU2012-Team-Sum.png) no-repeat;

} .team-tab h3:before {

   left: 20px;

} .team-tab h3, .team-tab p {

   margin-left: 90px;

}


  1. team-tab-cheng h3:before {background-position: 0 0;}
  2. team-tab-cheng:hover h3:before {background-position: -66px 0;}
  3. team-tab-gong h3:before {background-position: 0 -100px;}
  4. team-tab-gong:hover h3:before {background-position: -66px -100px;}
  5. team-tab-jia h3:before { background-position: 0 -200px;}
  6. team-tab-jia:hover h3:before {background-position: -66px -200px;}
  7. team-tab-liu h3:before {background-position: 0px -300px;}
  8. team-tab-liu:hover h3:before {background-position: -66px -300px;}
  9. team-tab-wu h3:before {background-position: 0 -400px;}
  10. team-tab-wu:hover h3:before {background-position: -66px -400px;}
  11. team-tab-li h3:before {background-position: 0 -500px;}
  12. team-tab-li:hover h3:before {background-position: -66px -500px;}
  13. team-tab-ni h3:before {background-position: 0 -600px;}
  14. team-tab-ni:hover h3:before {background-position: -66px -600px;}
  15. team-tab-qin h3:before {background-position: 0 -700px;}
  16. team-tab-qin:hover h3:before {background-position: -66px -700px;}
  17. team-tab-ren h3:before {background-position: 0 -800px;}
  18. team-tab-ren:hover h3:before {background-position: -66px -800px;}
  19. team-tab-shao h3:before {background-position: 0 -900px;}
  20. team-tab-shao:hover h3:before {background-position: -66px -900px;}
  21. team-tab-song h3:before {background-position: 0 -1000px;}
  22. team-tab-song:hover h3:before {background-position: -66px -1000px;}
  23. team-tab-su h3:before {background-position: 0 -1100px;}
  24. team-tab-su:hover h3:before {background-position: -66px -1100px;}
  25. team-tab-wz h3:before {background-position: 0 -1200px;}
  26. team-tab-wz:hover h3:before {background-position: -66px -1200px;}
  27. team-tab-zhang h3:before {background-position: 0 -1300px;}
  28. team-tab-zhang:hover h3:before {background-position: -66px -1300px;}
  29. team-tab-wei h3:before {background-position: 0 -1400px;}
  30. team-tab-wei:hover h3:before {background-position: -66px -1400px;}

</style> <div> <ul>

       <li id="team-tab-ren" class="team-tab">
           <a><h3>Hengqian REN</h3></a>
           <p>
               Major: Chemical Engineering;School: Chemical;Year: Fourth Year Student;Home: Tianjin.<br>
               <i>I really appreciate my experience in the BIOMOD Tianjin Team. Because this is not only a valuable opportunity to learn about synthetic biology, but also an unforgettable period to meet many friends with the same interest. I'm Ren Hengqian, and this summer is fancination and exciting for me.</i>
           </p>
       </li>
       <li id="team-tab-li" class="team-tab" style="float:right">
           <a><h3>Yang LI</h3></a>
           <p>
               Major: Pharmaceutical Engineering;School: Chemical Engineering;Year: Third Year Student;Home: Jinzhou, Liaoning.<br>
               <i>I'm really gratefulforthe chance to join the BIOMOD Team. Synbio triggersmy curiosity and drives meto enjoy every moment I spent in the lab. I am Li Yang. Ijust love my team and my mates :)!</i>
           </p>
       </li>
       <li id="team-tab-song" class="team-tab">
           <a><h3>Linlin SONG</h3></a>
           <p>
               Major: Pharmaceutical Engineering; School: Chemical Engineering; Year: Third Year Student; Home: Handan, Hebei.<br>
               <i>Joining this team is the best choice I have ever made. In this term, I have learned what teamwork is and how to build innovation ability. There are so many excellent people in our team, and I can learn from every one of them. I am Song Linlin. I think a wonderful future is waiting for me.</i>
           </p>
       </li>
       <li id="team-tab-gong" class="team-tab" style="float:right">
           <a><h3>Shu GONG</h3></a>
           <p>
               Major: Pharmaceutical Engineering; School: Chemical Engineering; Year: Third Year Student; Home: Deyang, Sichuan.<br>
               <i>I regard the time in BIOMOD as one of the most important moments in my life. I enjoyed the wonderful world of cells and also the wonderful time with my Teammates. I am Gong Shu, "In me the tiger sniffs the rose"</i>
           </p>
       </li>
       <li id="team-tab-jia" class="team-tab">
           <a><h3>Bin JIA</h3></a>
           <p>
               Major: Bioengineering. School: Chemical Engineering. Year: Graduate Student. Home: Qinshui, Shanxi<br>
               <i>As an BIOMOD veteran, I devoted countless energy and love to this competition. There has been victory and doldrums. But "a strong man will struggle with the storms of fate". I'm Jia Bin, and I believe in the best of our team.</i>
           </p>
       </li>
       <li id="team-tab-wu" class="team-tab" style="float:right">
           <a><h3>Qinfeng WU</h3></a>
           <p>
               Major: Chemical Engineering; School: Chemical Engineering; Year: Fourth Year Student; Home: Chongqing.<br>
               <i>Can you believe it! I found the perfect girlfriend in BIOMOD! We really enjoyed the hot summer:)!Because we have been focusing on the project too! I am Wu Qinfeng.</i>
           </p>
       </li>
       <li id="team-tab-liu" class="team-tab">
           <a><h3>Jiaquan LIU</h3></a>
           <p>
               Major: Applied Chemistry; School: Chemical Engineering; Year: Third Year Student; Home: Shenyang, Liaoning.<br>
               <i>The most wonderful thing that happened to me is that I found my boyfriend in the BIOMOD team! We have been enjoying everything so much together this summer along with BIOMOD! I am Liu Jiaquan.</i>
           </p>
       </li>
       <li id="team-tab-cheng" class="team-tab" style="float:right">
           <a><h3>Xiaonan CHENG</h3></a>
           <p>
               Major: Chemical Engineering; School: Chemical Engineering; Year: Fourth Year Student; Home: Yantai, Shandong.<br>
               <i>Life in BIOMOD is a mystery you can never imagine. Together in all these memories, I see the smile of the whole team. Here is Chen Xiaonan, who believes Geeks and Bio-tech can save the world. Art can save the Soul. Love art, love logic and love biology.</i>
           </p>
       </li>
       <li id="team-tab-wz" class="team-tab">
           <a><h3>Andi WANGZHOU</h3></a>
           <p>
               Major: Bioengineering; School: Chemical Engineering; Year: Fourth Year Student; Home: Beijing.<br>
               <i>These two years with BIOMOD is totally fantastic! I believe this year BIOMOD Team Tianjin will be the best! I am Wangzhou Andy. "What the world is like depends on how you feel it." Color my team, color BIOMOD, color the world.</i>
           </p>
       </li>
       <li id="team-tab-zhang" class="team-tab" style="float:right">
           <a><h3>Jinlai Zhang</h3></a>
           <p>
               Major: Bioengineering; School: Chemical Engineering; Year: Fourth Year Student; Home: Tianjin<br>
               <i>Everything I have done during these months in BIOMOD has become an indelible memory in my whole life! I am Zhang Jinlai.</i>
           </p>
       </li>
       <li id="team-tab-qin" class="team-tab">
           <a><h3>Dongchang QIN</h3></a>
           <p>
               Major: Bioengineering; School: Chemical Engineering; Year: Fourth Year Student; Home: Xinxiang, Henan.<br>
               <i>I am glad to be one part of the BIOMOD Team Tianjin. During the process, we enjoyed the Happy and Tired life. In the future, I want to make more new friends from all over the world through the platform of BIOMOD.</i>
           </p>
       </li>
       <li id="team-tab-su" class="team-tab" style="float:right">
           <a><h3>Yapeng SU</h3></a>
           <p>
               Major: Chemical Engineering; School: Chemical Engineering;Year: Fourth Year Student;Home: Xingtai, Hebei.<br>
               <i>BIOMOD for me is an un forgettable experience on my life track. It is really amazing to applied my math skill into the field of biology. Despite the surprising adventure in interdiscipline subject, I also reaped friendship with all BIOMOD members. I am Yapeng Su, I am a long distance runner in my life.</i>
           </p>
       </li>
       <li id="team-tab-wei" class="team-tab">
           <a><h3>Yufei WEI</h3></a>
           <p>
               Major: Chemical Engineering;School: Chemical Engineering;Year: Third Year Student;Home: Handan, Hebei.<br>
               <i>This is my first year in BIOMOD. BIOMOD is a fascinating group, a wonderful place. To be an BIOMODer is one of my most meaningful experiences. Those happy days bring me friends, interest and knowledge. I'm Wei Yufei. I will continue devoting my Energy and love to it.</i>
           </p>
       </li>
       <li id="team-tab-shao" class="team-tab" style="float:right">
           <a><h3>Yifeng SHAO</h3></a>
           <p>
               Major: Chemical Engineering;School: Chemical Engineering;Year: Third Year Student;Home: Lanzhou, Gansu.<br>
               <i>For me, dancing is my lover while painting is my close friend. I am girl who is addicted to beautiful things. BIOMOD is really a great chance for me, and bring me a lot of new things. It has become my lifelong memeory.</i>
           </p>
       </li>
       <li id="team-tab-ni" class="team-tab">
           <a><h3>Lingli NI</h3></a>
           <p>
               Major: Chemical Engineering;School: Chemical Engineering;Year: Third Year Student;Home: Fuzhou, Fujian.<br>
               <i>BIOMOD is a gift for me in this summer. I find so many amazing things in the world of synthetic biology. I'm Ni Lingli. Life is like a bar of chocolate. You'll never know what you are gonna get but I just try my best to do what I wanna do.</i>
           </p>
       </li>
   </ul>

</div> </html>