Template:Team:TPHS/Main

From 2014hs.igem.org

(Difference between revisions)
Line 26: Line 26:
<!-- CSS -->
<!-- CSS -->
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/Reset?action=raw&ctype=text/css" rel="stylesheet">
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/Reset?action=raw&ctype=text/css" rel="stylesheet">
-
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/Navigation?action=raw&ctype=text/css" rel="stylesheet">
+
<style>
 +
#TopBar {
 +
background: #231F20;
 +
width: 100%;
 +
min-width: 766px;
 +
height: 89px;
 +
z-index: 10;
 +
position: fixed;
 +
text-align: center;
 +
top: 25px;
 +
}
 +
 
 +
#TopBar #TopLvlNavLink {
 +
display: none;
 +
}
 +
 
 +
#TopBar ul {
 +
background: #231F20;
 +
list-style: none;
 +
position: relative;
 +
display: inline-table;
 +
padding: 0;
 +
margin: 0;
 +
}
 +
 
 +
#TopBar ul:after {
 +
content: "";
 +
clear: both;
 +
display: block;
 +
}
 +
 
 +
#TopBar li {
 +
float: left;
 +
width: 124px;
 +
text-align: center;
 +
}
 +
 
 +
#TopBar li:hover > a {
 +
text-decoration: underline;
 +
}
 +
 
 +
#TopBar a {
 +
display: block;
 +
width: 100%;
 +
height: 100%;
 +
padding: 15px 0;
 +
color: #FFFFFF;
 +
text-decoration: none;
 +
font: 24px Raleway, Arial, san-serif;
 +
}
 +
 
 +
#TopBar > #TopLvlNav  > li > a {
 +
padding: 29px 0;
 +
}
 +
 
 +
#TopBar ul ul {
 +
display: none;
 +
background: #231F20;
 +
padding: 0 10px;
 +
position: absolute;
 +
top: 95%;
 +
z-index: 10;
 +
margin-left: -10px;
 +
}
 +
 
 +
#TopBar ul li:hover > ul {
 +
display: block;
 +
}
 +
 
 +
#TopBar ul ul li {
 +
float: none;
 +
position: relative;
 +
}
 +
 
 +
#TopBar ul ul a {
 +
font-size: 18px;
 +
}
 +
 
 +
#TopBar ul ul ul {
 +
position: absolute;
 +
left: 100%;
 +
top: 0;
 +
margin: 0;
 +
}
 +
 
 +
@keyframes rotate {
 +
  from {
 +
    transform: rotate(0deg);
 +
    -ms-transform: rotate(0deg);
 +
  }
 +
  to {
 +
    transform: rotate(59deg);
 +
    -ms-transform: rotate(59deg);
 +
  }
 +
}
 +
 
 +
@-webkit-keyframes rotate {
 +
  from {
 +
    -webkit-transform: rotate(0deg);
 +
  }
 +
  to {
 +
    -webkit-transform: rotate(59deg);
 +
  }
 +
}
 +
 
 +
@-moz-keyframes rotate {
 +
  from {
 +
    transform: rotate(0deg);
 +
  }
 +
  to {
 +
    transform: rotate(59deg);
 +
  }
 +
}
 +
 
 +
@-o-keyframes rotate {
 +
  from {
 +
    transform: rotate(0deg);
 +
  }
 +
  to {
 +
    transform: rotate(59deg);
 +
  }
 +
}
 +
 
 +
#TopBar #LogoItem:hover > img {
 +
    -webkit-animation-name:            rotate;
 +
    -webkit-animation-duration:        .5s;
 +
    -webkit-animation-iteration-count:  infinite;
 +
    -webkit-animation-timing-function: linear;
 +
}
 +
 
 +
#TopBar #LogoItem {
 +
padding: 8px 0;
 +
}
 +
 
 +
#TopBarCollapse {
 +
position: fixed;
 +
width: 120px;
 +
height: 60px;
 +
top: 25px;
 +
background: orange;
 +
z-index: 10;
 +
}
 +
 
 +
#TopBarCollapse #TopLvlNavLink {
 +
display: block;
 +
width: 100%;
 +
height: 100%;
 +
}
 +
 
 +
#TopBarCollapse:after {
 +
content: "";
 +
clear: both;
 +
display: block;
 +
}
 +
 
 +
#TopBarCollapse ul {
 +
display: none;
 +
list-style: none;
 +
padding: 0;
 +
}
 +
 
 +
#TopBarCollapse ul:after {
 +
content: "";
 +
clear: both;
 +
display: block;
 +
}
 +
 
 +
#TopBarCollapse li {
 +
float: left;
 +
display: block;
 +
clear: both;
 +
width: 120px;
 +
padding: 0;
 +
background: green;
 +
}
 +
 
 +
#TopBarCollapse li:hover {
 +
background: pink;
 +
}
 +
 
 +
#TopBarCollapse a {
 +
color: #FFFFFF;
 +
display: block;
 +
text-decoration: none;
 +
padding: 10px 15px;
 +
}
 +
 
 +
#TopBarCollapse #LogoItem {
 +
display: none !important;
 +
}</style>
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/Content?action=raw&ctype=text/css" rel="stylesheet">
<link href="https://2013.igem.org/Team:Calgary/StyleSheets/Content?action=raw&ctype=text/css" rel="stylesheet">

Revision as of 22:51, 1 March 2014