Team:Bonn

{{Template:Team:Bonn}}
{{Template:Team:Bonn:Menu}}
{{Template:Team:Bonn:SlideshowJS}}
<html>
    <script>
        function showTile(id) {
           $("#page-box-"+id+"-content").stop().fadeOut();
           $("#page-box-"+id+"-content").stop().fadeIn();
           $("#page-box-"+id+"-content").fadeIn(50);
        }
        function hideTile(id) {
           $("#page-box-"+id+"-content").stop().fadeIn();
           $("#page-box-"+id+"-content").stop().fadeOut();
           $("#page-box-"+id+"-content").fadeOut(50);
        }
    </script>
<style type="text/css">
#page-top-slideshow { position: relative; overflow: auto; height: 268px; }
    #page-top-slideshow li { list-style: none; }
        #page-top-slideshow ul li { float: left; }
.kachelheading{font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:-2px; bottom:-11px;}
.kachelheadingani{font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:-2px; bottom:-11px;}
</style>

<div id="page-box1" style="margin: 20px auto 40px auto; width:800px;height:320px;">
<img width="800px" style="margin-top:-60px" src="https://static.igem.org/mediawiki/2013/6/6d/Bonn_Licht_ist_geil_weiß.png">
</div>
<!--<div id="page-box1" class="page-box-big" style="border:1px solid white;width:800px;height:260px;float:left; margin:20px 0 20px -115px; position:relative;"></div>-->
<div id="page-row1" class="page-row" style="width:800px;height:260px;margin:0 auto 0 auto;position:relative;">

<!-- PROJECT, keine Titelclass-->
<div id="page-box-2" onmouseover=showTile(2) onmouseout=hideTile(2) class="page-box-width" style="float:left;margin:0 15px 0 0;">
<img width="520px"; src="https://static.igem.org/mediawiki/2013/c/cd/Bonn_Project.png">
<p class="kachelheading">project</p>
    <div id="page-box-2-content" class="page-box-width" style="background-color:black;  float:left;opacity:0.9;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">project</p>
    </div>  

  </div>

<!-- SAFETY, keine Titelclass-->
  <div id="page-box-3" onmouseover=showTile(3) onmouseout=hideTile(3) class="page-box-small" style="float:right;">
<img width="260px"; src="https://static.igem.org/mediawiki/2013/a/a0/Bonn_Safety.png">
<p class="kachelheading">safety</p>
    <div id="page-box-3-content" class="page-box-small" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">safety</p>
    </div>  

  </div>

</div>

<!-- BACKGROUND, Titelclass-->
<div id="page-row2" class="page-row" style="width:800px;height:800px;position:relative;margin:20px auto 0 auto">
  <div id="page-box-4" onmouseover=showTile(4) onmouseout=hideTile(4) class="page-box-high" style="position:absolute;left:0px;top:0px;">
<img width="260px"; src="https://static.igem.org/mediawiki/2013/2/2c/Bonn_Background.png">
<p class="kachelheading">background</p>
    <div id="page-box-4-content" class="page-box-high" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-520px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">background</p>
    </div>  

  </div>

<!-- HUMAN PRACTICE, Titelclass-->
  <div id="page-box-5" onmouseover=showTile(5) onmouseout=hideTile(5) class="page-box-width" style="position:absolute;right:0px;top:0px;">
<img width="520px"; src="https://static.igem.org/mediawiki/2013/9/92/Bonn_HumanPractice.png">
<p class="kachelheading">Human Practice</p>
    <div id="page-box-5-content" class="page-box-width" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">Human Practice</p>
    </div>  

  </div>

<!--PICTURE GALLERY,keine  Titelclass im content-div-->
  <div id="page-box-6" onmouseover=showTile(6) onmouseout=hideTile(6)  class="page-box-small" style="position:absolute;width:242px;height:242px;top:278px;left:278px;">
<img width="242px"; src="https://static.igem.org/mediawiki/2013/f/fd/PictureGallaryNew.png">
<p class="kachelheading">picture gallery</p>
    <div id="page-box-6-content" class="page-box-small" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-242px;width:242px;height:242px">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">picture gallery</p>
    </div>

  </div>

<!-- GAME, Titelclass-->
  <div id="page-box-7" onmouseover=showTile(7) onmouseout=hideTile(7) class="page-box-width" style="position:absolute;left:0px;bottom:0px;">
<img width="520px"; src="https://static.igem.org/mediawiki/2013/1/17/Bonn_Game.png">
<p class="kachelheading">game</p>
    <div id="page-box-7-content" class="page-box-width" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheadingani">game</p>
    </div>

  </div>

<!-- COMIC, Titelclass-->
<div id="page-box-8" onmouseover=showTile(8) onmouseout=hideTile(8) class="page-box-high" style="position:absolute;right:0px;bottom:0px;">
<img width="260px"; src="https://static.igem.org/mediawiki/2013/f/f0/Bonn_Comic.png">
<p class="kachelheading">comic</p>
    <div id="page-box-8-content" class="page-box-high" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-520px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p class="kachelheading">comic</p>
    </div>
</div>
</div>

<div id="page-row3" class="page-row" style="width:800px;height:260px;margin:20px auto 0 auto ">

<!-- RESULTS, keine Titelclass-->
    <div id="page-box-9" onmouseover=showTile(9) onmouseout=hideTile(9) class="page-box-small" style="float:left;margin:0 15px 0 0;">
<img width="260px"; src="https://static.igem.org/mediawiki/2013/7/73/Bonn_Analysis.png">
    <p style="font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:0px; bottom:-7px;">results</p>
    <div id="page-box-9-content" class="page-box-small" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p style="font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:0px; bottom:-12px;">results</p>
    </div>
    </div>

<!-- TEAM, keine Titelclass-->
<div id="page-box-10" onmouseover=showTile(10) onmouseout=hideTile(10) class="page-box-width" style="float:right;">
<img width="520px"; src="https://static.igem.org/mediawiki/2013/f/f5/Bonn_Team.png">
<p style="font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:0px; bottom:-7px;">team</p>
    <div id="page-box-10-content" class="page-box-width" style="background-color:black;  opacity:0.9;float:left;margin:0 15px   0     0;display:none;position:absolute; margin-top:-260px;">
<p style="font-family:Century Gothic; padding:0px 8px 0 8px;font-size:16px;color:white;text-align:left;">Test</br>testtest</br>test</p><p style="font-family:Century Gothic;font-size:35px;font-weight:bold;color:white;text-align:center; position:absolute;margin:0px; bottom:-12px;">team</p>
    </div>  
</div>
</div>
<!--<hr noshade color=#FFFFFF" position="bottom" margin="0 0 -100 0" width="1920" size= "1" align="center">-->


            </div>
            </div> <!-- close page -->
            <!-- Ultra-crap-hack: Close two div containers which have been opened in an included template (apparently) -->
            <!-- TODO: Investigate what we are closing here, and if we can do better (if not, DOCUMENT THIS somewhere and make
                it known to everyone in our Web/PR/Etc. teams.
                  -- Matthias -->
        </div>
    </div>
    <script>
        for(var a,a=0;a<5;a++)
        {
          sidetextFade("page-box"+a);
        }
    </script>
<script>
        $(document).ready(function() {
          $('#page-top-slideshow').bjqs({
            height      : 268,
            width       : 900,
            responsive  : false
          });

        });
      </script>
</html>
{{Template:Team:Bonn:sponsors}}