Template:Team:Bonn

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
        <html>
+
<html>
-
        <style type="text/css">
+
<style type="text/css">
-
        /* ********************** */
+
/* ********************** */
-
        /* basic settings */
+
/* basic settings */
-
        .firstHeading {                                                /* Kill the default iGEM picture*/
+
.firstHeading {                                                /* Kill the default iGEM picture*/
-
            height:0px;
+
    height:0px;
-
            visibility:hidden;
+
    visibility:hidden;
-
        }
+
}
-
        #top-section {
+
#top-section {
-
                background-position: center center;
+
        background-position: center center;
-
                background-repeat: no-repeat;
+
        background-repeat: no-repeat;
-
                background-color: #6c89c1;
+
        background-color: #6c89c1;
-
                border-with:0px;
+
        border-with:0px;
-
                height:0px;                        /* set top header height to zero, so we can show our logo */
+
        height:0px;                        /* set top header height to zero, so we can show our logo */
-
        }
+
}
-
        #p-logo{
+
#p-logo{
-
            visibility:hidden;
+
    visibility:hidden;
-
          height:0px;
+
height:0px;
-
        }
+
}
-
        #search-controls{
+
#search-controls{
-
            visibility:hidden;
+
    visibility:hidden;
-
          height:0px;
+
height:0px;
-
        }
+
}
-
        #footer-box{
+
#footer-box{
-
            display:none;
+
    display:none;
-
          height:0px;
+
height:0px;
-
        }
+
}
-
        #f-poweredbyico{
+
#f-poweredbyico{
-
          visibility:hidden;
+
visibility:hidden;
-
        }
+
}
-
        #catlinks{
+
#catlinks{
-
          visibility:hidden;
+
visibility:hidden;
-
          height:0px;
+
height:0px;
-
        }
+
}
-
        .print-footer{
+
.print-footer{
-
          visibility:hidden;
+
visibility:hidden;
-
          height:0px;
+
height:0px;
-
        }
+
}
-
        #content {
+
#content {
-
          border-width:0px;
+
border-width:0px;
-
        }
+
}
-
        #siteSub {
+
#siteSub {
-
            display:none;
+
    display:none;
-
        }
+
}
-
        .visualClear{
+
.visualClear{
-
          display:none;
+
display:none;
-
        }
+
}
-
        /* ********************** */
+
/* ********************** */
-
        .mw-headline{
+
.mw-headline{
-
          color:#ffffff;
+
color:#ffffff;
-
        }
+
}
-
        .editsection{
+
.editsection{
-
          color:#ffffff;
+
color:#ffffff;
-
        }
+
}
-
        body {
+
body {
-
          background-position:center;
+
background-position:center;
-
          background-repeat: repeat-y;
+
background-repeat: repeat-y;
-
          background-image: url('https://static.igem.org/mediawiki/2013/a/a8/Bonn_Backgrund-2.png');
+
background-image: url('https://static.igem.org/mediawiki/2013/5/50/Bonn_Backgrund-2.png');
-
        }
+
}
-
        #globalWrapper{
+
#globalWrapper{
-
          background-image: url('https://static.igem.org/mediawiki/2013/5/50/Bonn_background-1.jpg');
+
background-image: url('https://static.igem.org/mediawiki/2013/a/a8/Bonn_background-1.jpg');
-
          background-repeat: no-repeat;
+
background-repeat: no-repeat;
-
        }
+
}
-
        #content{
+
#content{
-
          background-color:transparent
+
background-color:transparent
-
        }
+
}
-
        #menu-top{
+
#menu-top{
-
          margin:0 auto;
+
margin:0 auto;
-
          padding: 0 20px 0 20px;
+
padding: 0 20px 0 20px;
-
          position:absolute;
+
position:absolute;
-
          left:50px; top:20px; width:900px; height:200px;
+
left:50px; top:20px; width:900px; height:200px;
-
          z-index:10;
+
z-index:10;
-
          opacity:0.95;
+
opacity:0.95;
-
          list-style: none;
+
  list-style: none;
-
          color:#000000;
+
color:#000000;
-
        }
+
}
-
        li{
+
li{
-
          float:left;
+
float:left;
-
        }
+
}
-
        .menu-head{
+
.menu-head{
-
          font-weight:bold;
+
font-weight:bold;
-
          font-size: 14px;
+
font-size: 14px;
-
          margin:0;
+
margin:0;
-
          padding:5px;
+
padding:5px;
-
        }
+
}
-
        .menu-head:hover {
+
.menu-head:hover {
-
          background-color:#aaaaaa;
+
  background-color:#aaaaaa;
-
          color:#ffffff;
+
  color:#ffffff;
-
        }
+
}
-
        .menu-column{
+
.menu-column{
-
          background-color: #cccccc;
+
background-color: #cccccc;
-
          font-size:14px;
+
font-size:14px;
-
          width:150px;
+
width:150px;
-
          margin-right:20px;
+
margin-right:20px;
-
          border-radius:2px;
+
border-radius:2px;
-
          border: 2px solid white;
+
border: 2px solid white;
-
          -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
+
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
-
          -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2));
+
-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2));
-
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
+
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
-
        }
+
}
-
        .menu-sub-ul{
+
.menu-sub-ul{
-
          display:none;
+
display:none;
-
          font-weight:bold;
+
font-weight:bold;
-
          margin-left:0px;
+
margin-left:0px;
-
          }
+
}
-
        .menu-sub-ul a{
+
.menu-sub-ul a{
-
          color:#000000;
+
color:#000000;
-
          }
+
}
-
        .menu-sub{
+
.menu-sub{
-
          clear:both;
+
clear:both;
-
          list-style: none;
+
list-style: none;
-
          padding:5px;
+
padding:5px;
-
          width:140px;
+
width:140px;
-
        }
+
}
-
        .menu-sub:hover {
+
.menu-sub:hover {
-
          background-color:#aaaaaa;
+
  background-color:#aaaaaa;
-
          color:#ffffff;
+
  color:#ffffff;
-
        }
+
}
-
        .menu-sub:hover a{
+
.menu-sub:hover a{
-
          background-color:#aaaaaa;
+
  background-color:#aaaaaa;
-
          color:#ffffff;
+
  color:#ffffff;
-
        }
+
}
-
        #page{
+
#page{
-
          border-radius:2px;
+
border-radius:2px;
-
          margin:40px 0 0 0;
+
margin:40px 0 0 0;
-
          padding:0;
+
padding:0;
-
          font-family: Cantarell;
+
font-family: Cantarell;
-
          background-color:none;
+
background-color:none;
-
          background-color: #ffffff;
+
background-color: #ffffff;
-
          -webkit-box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
+
-webkit-box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
-
          -moz-box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
+
-moz-box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
-
          box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
+
box-shadow: -5px 5px 5px rgba(0, 0, 0, 0.7), inset 0 0 50px rgba(0, 0, 0, 0.2);
-
        }
+
}
-
        .page-top{
+
.page-top{
-
          position:relative;
+
position:relative;
-
          width:900px;
+
width:900px;
-
          margin-left:auto;
+
margin-left:auto;
-
          margin-right:auto;
+
margin-right:auto;
-
          margin-top:50px;
+
margin-top:50px;
-
          margin-bottom:10px;
+
margin-bottom:10px;
-
          color:#ffffff;
+
color:#ffffff;
-
        }
+
}
-
        #page-top-slideshow{
+
#page-top-slideshow{
-
          width:900px;
+
width:900px;
-
          height:200px;
+
height:200px;
-
          padding:30px;
+
padding:30px;
-
          position:relative;
+
position:relative;
-
          color:#ffffff;
+
color:#ffffff;
-
          border-radius:4px;
+
border-radius:4px;
-
        }
+
}
-
        #page-top-nav {
+
#page-top-nav {
-
          position:absolute;
+
position:absolute;
-
          bottom:7px;
+
bottom:7px;
-
          right:3px;
+
right:3px;
-
          z-index:20;
+
z-index:20;
-
          opacity:0.7;
+
opacity:0.7;
-
        }
+
}
-
        #page-top-nav a {
+
#page-top-nav a {
-
          font-size:20px;
+
font-size:20px;
-
          padding: 2px 5px 2px 5px;
+
padding: 2px 5px 2px 5px;
-
          background-color:#cccccc;
+
background-color:#cccccc;
-
          color:#000000;
+
color:#000000;
-
          margin-right:10px;
+
margin-right:10px;
-
          border-radius:3px;
+
border-radius:3px;
-
        }
+
}
-
        #page-top-nav .activeSlide {
+
#page-top-nav .activeSlide {
-
          background-color:#aaaaaa;
+
background-color:#aaaaaa;
-
        }
+
}
-
        .page-top-slide{
+
.page-top-slide{
-
          width:840px;
+
width:840px;
-
          height:200px;
+
height:200px;
-
          font-size:16px;
+
font-size:16px;
-
          padding:30px;
+
padding:30px;
-
          text-align:justify;
+
text-align:justify;
-
          position:relative;
+
position:relative;
-
        }
+
}
-
        #page-top-pic{
+
#page-top-pic{
-
        }
+
}
-
        #page-top-pic img{
+
#page-top-pic img{
-
            position: absolute;
+
    position: absolute;
-
            margin: auto;
+
    margin: auto;
-
            top: 0;
+
    top: 0;
-
            left: 0;
+
    left: 0;
-
            right: 0;
+
    right: 0;
-
            bottom: 0;
+
    bottom: 0;
-
        }
+
}
-
        #page-middle {
+
#page-middle {
-
          padding: 30px 10px 10px 10px;
+
padding: 30px 10px 10px 10px;
-
        }
+
}
-
        #page-table{
+
#page-table{
-
          margin-left: auto;
+
  margin-left: auto;
-
          margin-right: auto;
+
  margin-right: auto;
-
          border-spacing: 10px;
+
  border-spacing: 10px;
-
          background-color:transparent;
+
  background-color:transparent;
-
        }
+
}
-
        .page-box{
+
.page-box{
-
          border: 1px solid black;
+
border: 1px solid black;
-
          background-color: #cccccc;
+
background-color: #cccccc;
-
          position:relative;
+
position:relative;
-
          border-radius:4px;
+
border-radius:4px;
-
          border: 3px solid white;
+
border: 3px solid white;
-
          -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
+
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
-
          -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2));
+
-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2));
-
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
+
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
-
        }
+
}
-
        #page-box1{
+
#page-box1{
-
          width:320px;
+
width:320px;
-
          height:515px;
+
height:515px;
-
        }
+
}
-
        #page-box2{
+
#page-box2{
-
          width:480px;
+
width:480px;
-
          height:250px;
+
height:250px;
-
        }
+
}
-
        #page-box3{
+
#page-box3{
-
          width:480px;
+
width:480px;
-
          height:250px;
+
height:250px;
-
        }
+
}
-
        #page-box4{
+
#page-box4{
-
          width:815px;
+
width:815px;
-
          height:200px;
+
height:200px;
-
        }
+
}
-
        .page-box-bottom {
+
.page-box-bottom {
-
          display:none;
+
display:none;
-
          width:100%;
+
width:100%;
-
          height:30%;
+
height:30%;
-
          position:absolute;
+
position:absolute;
-
          bottom:0;
+
bottom:0;
-
          left:0;
+
left:0;
-
          background-image: -webkit-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
+
background-image: -webkit-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
-
          background-image: -moz-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
+
background-image: -moz-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
-
          background-image: -o-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
+
background-image: -o-linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
-
          background-image: linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
+
background-image: linear-gradient(rgba(150,150,150,0.0) 0%, rgba(150,150,150,1.0) 90%);
-
          color:#cccccc;
+
color:#cccccc;
-
        }
+
}
-
        .page-bottom {
+
.page-bottom {
-
          margin-top:30px;
+
margin-top:30px;
-
          opacity:1;
+
opacity:1;
-
        }
+
}
-
        .page-bottom-sponsors{
+
.page-bottom-sponsors{
-
          background-color:rgba(255,255,255,0.35);
+
background-color:rgba(255,255,255,0.35);
-
          margin:0 40px 0 40px;
+
margin:0 40px 0 40px;
-
          border-radius:5px;
+
border-radius:5px;
-
        }
+
}
-
        .bottom-headline{
+
.bottom-headline{
-
          margin:10px 0 10px 0;
+
margin:10px 0 10px 0;
-
          text-align:center;
+
text-align:center;
-
          font-size:22px;
+
font-size:22px;
-
          font-weight:bold;
+
font-weight:bold;
-
        }
+
}
-
        .bottom-sponsor{
+
.bottom-sponsor{
-
          margin:10px;
+
margin:10px;
-
        }
+
}
-
        </style>
+
</style>
-
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
-
        <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
+
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
-
        <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
+
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/jquery.metadata.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/jquery.metadata.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/jquery.hoverIntent.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/jquery.hoverIntent.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/styleswitch.js"></script>
<script type="text/javascript" src="http://igem.uni-bonn.de/shared/jquery.mb.menu/inc/styleswitch.js"></script>
 +
<script>
 +
function dropdown(id) {
 +
  $('#'+id).hover( function()
 +
    {
 +
      $('#'+id+' > ul').stop().slideUp();
 +
      $('#'+id+' > ul').slideDown("1000");
-
        <script>
+
    });
-
        function dropdown(id) {
+
  $('#'+id).mouseleave(function()
-
          $('#'+id).hover( function()
+
    {
-
            {
+
      $('#'+id+' > ul').stop().slideDown();
-
              $('#'+id+' > ul').stop().slideUp();
+
      $('#'+id+' > ul').slideUp("1000");
-
              $('#'+id+' > ul').slideDown("1000");
+
    });
-
            });
+
}
-
          $('#'+id).mouseleave(function()
+
-
            {
+
-
              $('#'+id+' > ul').stop().slideDown();
+
-
              $('#'+id+' > ul').slideUp("1000");
+
-
            });
+
-
        }
+
function sidetextFade(id)
 +
{
 +
  $('#'+id).hover(
 +
  function() {
 +
    var hover;
 +
    hover = document.getElementById(id).childNodes;
 +
    for(var i=0, ii = hover.length; i < ii; i++) {
 +
      if(hover[i].nodeName == "DIV"){
 +
        if(hover[i].className == "page-box-bottom") {
 +
          $('#'+hover[i].id).stop().fadeOut();
 +
          $('#'+hover[i].id).fadeIn(1000);
 +
        }
 +
      }
 +
    }
 +
  });
 +
  $('#'+id).mouseleave(
 +
  function() {
 +
    var hover;
 +
    hover = document.getElementById(id).childNodes;
 +
    for(var i=0, ii = hover.length; i < ii; i++) {
 +
      if(hover[i].nodeName == "DIV"){
 +
        if(hover[i].className == "page-box-bottom") {
 +
          $('#'+hover[i].id).stop().fadeIn();
 +
          $('#'+hover[i].id).fadeOut(1000);
 +
        }
 +
      }
 +
    }
 +
  });
 +
}
-
        function sidetextFade(id)
+
</script>
-
        {
+
</html>
-
          $('#'+id).hover(
+
-
          function() {
+
-
            var hover;
+
-
            hover = document.getElementById(id).childNodes;
+
-
            for(var i=0, ii = hover.length; i < ii; i++) {
+
-
              if(hover[i].nodeName == "DIV"){
+
-
                if(hover[i].className == "page-box-bottom") {
+
-
                  $('#'+hover[i].id).stop().fadeOut();
+
-
                  $('#'+hover[i].id).fadeIn(1000);
+
-
                }
+
-
              }
+
-
            }
+
-
          });
+
-
          $('#'+id).mouseleave(
+
-
          function() {
+
-
            var hover;
+
-
            hover = document.getElementById(id).childNodes;
+
-
            for(var i=0, ii = hover.length; i < ii; i++) {
+
-
              if(hover[i].nodeName == "DIV"){
+
-
                if(hover[i].className == "page-box-bottom") {
+
-
                  $('#'+hover[i].id).stop().fadeIn();
+
-
                  $('#'+hover[i].id).fadeOut(1000);
+
-
                }
+
-
              }
+
-
            }
+
-
          });
+
-
        }
+
-
 
+
-
        </script>
+
-
        </html>
+

Revision as of 17:11, 28 April 2013