Template:Team:OU-Norman OK

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head>
-
<!--put stuff here-->
+
  <!--put stuff here-->
-
<style>
+
  <style type="text/css">
-
ul{
+
  ul{
-
margin:0;
+
    margin:0;
-
padding:0;
+
padding:0;
 +
}
 +
 
 +
li{
 +
  display:inline;
 +
  list-type:none;
 +
}
 +
 
 +
a.glidebutton{
 +
    display: inline-block;
 +
  position: relative;
 +
  color: #4A4A4A; /* default color */
 +
    background: #ececec; /* default bg color */
 +
      text-decoration: none;
 +
    font: bold 14px Arial; /* font settings */
 +
    letter-spacing: 2px; /* font settings */
 +
    overflow: hidden;
 +
    height: 30px; /* height of each button */
 +
    text-align: center;
 +
      border-radius: 5px; /* border radius */
 +
    -moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
 +
    -webkit-transition: all 0.3s ease-in-out;
 +
    -o-transition: all 0.3s ease-in-out;
 +
    -ms-transition: all 0.3s ease-in-out;
 +
    transition: all 0.3s ease-in-out;
 +
  }
 +
 
 +
a.glidebutton > span:first-child{ /* first span inside button */
 +
  position: relative;
 +
  display: block;
 +
  height: 100%;
 +
  padding: 6px; /* padding of button */
 +
  -moz-box-sizing: border-box;
 +
  box-sizing: border-box;
 +
  -moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
 +
  -webkit-transition: all 0.3s ease-in-out;
 +
  -o-transition: all 0.3s ease-in-out;
 +
  -ms-transition: all 0.3s ease-in-out;
 +
  transition: all 0.3s ease-in-out;
 +
  }
 +
 
 +
a.glidebutton > span:first-child:after{ /* CSS generated content */
 +
  content: attr(data-text); /* Duplicate text of span markup */
 +
  display: block;
 +
  width: 100%;
 +
  height: 100%;
 +
  -moz-box-sizing: border-box;
 +
  box-sizing: border-box;
 +
  padding: inherit;
 +
  position: absolute;
 +
  top:100%;
 +
  left:0;
 +
  }
 +
 
 +
a.glidebutton:hover{
 +
color: black; /* color of button on hover */
 +
background: #72cb47; /* bg color of button on hover */
 +
box-shadow: 0 0 4px green inset;
 +
}
 +
 
 +
a.glidebutton:hover > span:first-child{
 +
-moz-transform: translateY(-100%);
 +
-webkit-transform: translateY(-100%);
 +
-ms-transform: translateY(-100%);
 +
-o-transform: translateY(-100%);
 +
transform: translateY(-100%);
 +
}
 +
div#navigation{
 +
/* Old browsers */
 +
border-radius: 0px;
 +
padding:90px 0 0 0;
}
}
 +
#navigation ul, #navigation li{ list-style:none; padding:0; margin:0; display:inline; }
 +
#navigation ul li{
 +
        float:left;
 +
        position:relative;
-
li{
 
-
display:inline;
 
-
list-type:none;
 
}
}
-
a.glidebutton{
+
#navigation ul li a{  
-
display: inline-block;
+
 
-
position: relative;
+
display:block;
-
color: #4A4A4A; /* default color */
+
padding:7px 12px;  
-
background: #ececec; /* default bg color */
+
margin-left:auto;
-
text-decoration: none;
+
        margin-right:auto;
-
font: bold 14px Arial; /* font settings */
+
font-size:18px;  
-
letter-spacing: 2px; /* font settings */
+
white-space:nowrap;  
-
overflow: hidden;
+
border-radius:1px;
-
height: 30px; /* height of each button */
+
 
-
text-align: center;
+
-
border-radius: 5px; /* border radius */
+
-
-moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
+
-
-webkit-transition: all 0.3s ease-in-out;
+
-
-o-transition: all 0.3s ease-in-out;
+
-
-ms-transition: all 0.3s ease-in-out;
+
-
transition: all 0.3s ease-in-out;
+
}
}
 +
#navigation ul li a:hover{}
 +
#navigation ul li ul li a{
 +
width: 150px ;
 +
}
 +
#navigation ul ul li a:hover{
 +
        background:#063257;
 +
background-repeat:repeat-x;
 +
        color:#fff080;
 +
background-size:200%;
 +
}
 +
#navigation ul ul{
 +
position:absolute;
 +
height:-99999px;
 +
margin-left:auto;
 +
        margin-right:auto;
 +
opacity: 0; /* Hide sub level */
 +
-webkit-transition: opacity .5s ease-in-out;
 +
-moz-transition: opacity .5s ease-in-out;
 +
-o-transition: opacity .5s ease-in-out;
 +
z-index:497;
 +
background:#fff080;
 +
padding: 0px;
 +
border:1px solid #063257;
 +
border-top:1px solid #063257;
 +
box-shadow:#111 0 3px 4px;
 +
border-bottom-left-radius:2px;
 +
border-bottom-right-radius:2px;
-
a.glidebutton > span:first-child{ /* first span inside button */
 
-
position: relative;
 
-
display: block;
 
-
height: 100%;
 
-
padding: 6px; /* padding of button */
 
-
-moz-box-sizing: border-box;
 
-
box-sizing: border-box;
 
-
-moz-transition: all 0.3s ease-in-out; /* Enable CSS transition between property changes */
 
-
-webkit-transition: all 0.3s ease-in-out;
 
-
-o-transition: all 0.3s ease-in-out;
 
-
-ms-transition: all 0.3s ease-in-out;
 
-
transition: all 0.3s ease-in-out;
 
}
}
 +
#navigation ul ul ul {
 +
margin-left:auto;
 +
        margin-right:auto;
-
a.glidebutton > span:first-child:after{ /* CSS generated content */
+
 
-
content: attr(data-text); /* Duplicate text of span markup */
+
opacity: 0;
-
display: block;
+
-webkit-transition: opacity .5s ease-in-out; /* Hide sub levels */
-
width: 100%;
+
-moz-transition: opacity .5s ease-in-out;
-
height: 100%;
+
-o-transition: opacity .5s ease-in-out;
-
-moz-box-sizing: border-box;
+
border-radius:6px;
-
box-sizing: border-box;
+
border:1px solid #444;
-
padding: inherit;
+
-
position: absolute;
+
-
top:100%;
+
-
left:0;
+
}
}
 +
#navigation ul li:hover>ul{ opacity: 1; position:absolute; top:100%; left:0; }
 +
#navigation ul ul li:hover>ul{ position:absolute; top:0; left:100%; opacity: 1; z-index:497;}
-
a.glidebutton:hover{
+
 
-
color: black; /* color of button on hover */
+
 
-
background: #72cb47; /* bg color of button on hover */
+
.slideshow img { position:absolute; left:10; top:10; }
-
box-shadow: 0 0 4px green inset;
+
 
 +
.slideshow {  
 +
    margin: -375px 0px 0px 400px;  
 +
    position: absolute;  
 +
    width: 520px;
 +
    height: 350px;
 +
    padding: 10px;
 +
    box-shadow: 0 0 10px rgba(0,0,0,0.4);  
}
}
-
a.glidebutton:hover > span:first-child{
+
 
-
-moz-transform: translateY(-100%);
+
.side {  
-
-webkit-transform: translateY(-100%);
+
    margin: -500px 0px 0px 500px;  
-
-ms-transform: translateY(-100%);
+
    position: absolute;  
-
-o-transform: translateY(-100%);
+
    width: 520px;  
-
transform: translateY(-100%);
+
    height: 350px;  
 +
    padding: 10px;  
 +
 
}
}
-
</style>
+
 
 +
#footer-box {
 +
    width:100%;
 +
    border:none;
 +
    padding:5px 0;
 +
    opacity:0.6;
 +
    filter:alpha(opacity=60); /* For IE8 and earlier */
 +
}
 +
 
 +
 
 +
#top-section {
 +
    height: 0px; }
 +
#p-logo {
 +
    height:0px; overflow:hidden; display:none;}
 +
#search-controls {
 +
    display:none;}
 +
 
 +
#top-section {
 +
    height:14px;
 +
    width: 100%;
 +
    border: 0;
 +
    background: rgba(51,51,51,1)}
 +
.left-menu a {
 +
    color: white; }
 +
.left-menu:hover {
 +
    color: white;
 +
    background: transparent; }
 +
.left-menu:hover a {
 +
    color: white; }
 +
.right-menu li a {
 +
    background-color: transparent;
 +
    color: white;}
 +
#content {
 +
    width:100%;
 +
    border:none;
 +
    padding:0;
 +
}
 +
#content #top, #content #siteSub, #content #contentSub {
 +
  display:none;
 +
  margin:0;
 +
  padding:0;
 +
}
 +
/* Hides default page title beneath banner */
 +
.firstHeading {
 +
  height:0px;
 +
  visibility:hidden;
 +
}
 +
 
 +
/*------------------------- Layout styles ------------------------*/
 +
body{
 +
 
 +
margin:0 auto;
 +
        width: 962px;
 +
        height: 0 auto;
 +
background:url(https://static.igem.org/mediawiki/2012/0/0e/Michigan_DNA_Background.png) no-repeat center top;
 +
        background-attachment: fixed;
 +
background-size:cover;
 +
}
 +
.page{
 +
        margin: -23px 0 0px 0;
 +
        width:962px;
 +
        height: 0 auto;
 +
background:url(https://static.igem.org/mediawiki/2012/4/49/Michigan_Invisible_Header.png) no-repeat center top;
 +
}
 +
 
 +
/*------------------------- Font ------------------------*/
 +
@font-face {
 +
p.sansserif{font-family:Century Gothic,sans-serif;}
 +
    font-weight: normal;
 +
    font-style: normal;
 +
}
 +
 
 +
/*------------------------- Header ------------------------*/
 +
.header{
 +
background:url(https://static.igem.org/mediawiki/2012/f/fe/Michigan_Blue_Divider.png) no-repeat center 124px;
 +
width:962px;
 +
margin:0 auto ;
 +
height:124px;
 +
padding:0px 0px 0;
 +
}
 +
.header a#logo{
 +
display:block;
 +
float:left;
 +
outline:none;
 +
        margin:17px 0 0 15px;
 +
}
 +
.header a#logo img{
 +
border:0;
 +
}
 +
.header a#name{
 +
        display:block;
 +
        float:left;
 +
        outline:none;
 +
        margin:17px 0 0 0;
 +
}
 +
.header a#name img{
 +
        border:0;
 +
}
 +
.header ul{
 +
margin:0 15px 0 0;
 +
list-style:none;
 +
padding:0px 0 0;
 +
float:right;
 +
}
 +
.header ul li{
 +
float:left;
 +
margin:0 0 0 36px;
 +
}
 +
.header ul li.selected a,.header ul li a:hover{
 +
color:#063257;
 +
}
 +
.header ul li a{
 +
font-size:16px;
 +
text-decoration:none;
 +
color:#063257;
 +
 
 +
outline:none;
 +
}
 +
 
 +
/*------------------------- Body ------------------------*/
 +
 
 +
/*.body{
 +
/*background:url(https://static.igem.org/mediawiki/2012/8/89/Michigan_body.png);*/
 +
width:962px;
 +
margin: 0px auto;
 +
padding:0 0 0px 0px;
 +
overflow:hidden;
 +
}*/
 +
.body div#featured{
 +
background:url(https://static.igem.org/mediawiki/2012/e/eb/Random_Michigan_1.png) no-repeat right top;
 +
height:0px;
 +
padding:50px 0px 17px 0px;
 +
        margin: -30px 0 0 0;
 +
}
 +
.body div#featured h3{
 +
        line-height:110%;
 +
color:#063257;
 +
font-size:24px;
 +
margin:0 0 30px;
 +
width:362px;
 +
padding:50px 16px 0;
 +
font-weight:bold;
 +
        font-style:italic;
 +
}
 +
.body div#featured p{
 +
width:362px;
 +
color:#063257;
 +
font-size:16px;
 +
line-height:22px;
 +
text-shadow: 0 1px 0 #fcfcfc;
 +
text-align:justify;
 +
margin:0;
 +
        padding: 0px 16px 50px;
 +
}
 +
.body div#basic{
 +
height:0px auto;
 +
padding:50px 50px 50px 50px;
 +
        margin: -30px 0 0 0;
 +
}
 +
.body div#basic h3{
 +
        line-height:110%;
 +
color:#063257;
 +
font-size:24px;
 +
margin:0 0 0px;
 +
 
 +
padding:0px 0px 0;
 +
font-weight:bold;
 +
        font-style:italic;
 +
}
 +
.body div#basic h2{
 +
color:#063257;
 +
}
 +
.body div#basic h1{
 +
color:#063257;
 +
}
 +
.body div#basic h4{
 +
        line-height:110%;
 +
color:#063257;
 +
font-size:18px;
 +
margin:0 0 0px;
 +
width:362px;
 +
padding:0px 0px 0;
 +
font-weight:bold;
 +
        font-style:italic;
 +
}
 +
.body div#basic p{
 +
width:0px auto;
 +
color:#063257;
 +
font-size:16px;
 +
line-height:22px;
 +
text-shadow: 0 1px 0 #fcfcfc;
 +
text-align:justify;
 +
margin:0;
 +
        padding: 10px 10px 10px;
 +
}
 +
.body div#simple{
 +
height:0px auto;
 +
padding:0px 0px 0px 30px;
 +
        margin: 0px 0 0 0;
 +
}
 +
.body div#simple h3{
 +
        line-height:110%;
 +
color:#063257;
 +
font-size:24px;
 +
margin:0 0 0px;
 +
width:362px;
 +
padding:0px 0px 0;
 +
font-weight:bold;
 +
        font-style:italic;
 +
}
 +
 
 +
.body div#simple p{
 +
width:0px auto;
 +
color:#063257;
 +
font-size:16px;
 +
line-height:22px;
 +
text-shadow: 0 1px 0 #fcfcfc;
 +
text-align:justify;
 +
margin:0;
 +
        padding: 10px 10px 10px;
 +
}
 +
 
 +
</style>
 +
<style type="text/javascript">
 +
  .page{
 +
        margin: -23px 0 0px 0;
 +
        width:962px;
 +
height: 0 auto;
 +
background:url(https://static.igem.org/mediawiki/2013/) no-repeat center top;
 +
}
 +
</style>
Line 79: Line 398:
<body>
<body>
<!-- put more stuff here too -->
<!-- put more stuff here too -->
-
<ul id="verticalmenu" class="glossymenu">
+
<div class = "page">
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK"><span data-text="Home">Home</a></li>
+
<div class = "header">
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team" ><span data-text="Team">Team</a>
+
  <ul id="verticalmenu" class="glossymenu">
-
<ul>
+
  <li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK"><span data-text="Home">Home</a></li>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Undergraduates">Undergraduates</a></li>
+
  <li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK/Team" ><span data-text="Team">Team</a>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Graduate_Students">Graduate Students</a></li>
+
  <ul>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Advisors">Advisors</a></li>
+
      <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Undergraduates">Undergraduates</a></li>
-
    </ul></li>
+
        <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Graduate_Students">Graduate Students</a></li>
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project"><span data-text="Project">Project</a>
+
        <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Team/Advisors">Advisors</a></li>
-
<ul>
+
  </ul>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Overview">Overview</a></li>
+
</li>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Notebook">Notebook</a></li>
+
<li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK/Project"><span data-text="Project">Project</a>
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Submitted_Parts">Submitted Parts</a></li>
+
<ul>
-
</ul>
+
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Overview">Overview</a></li>
-
</li>
+
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Notebook">Notebook</a></li>
-
 
+
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Project/Submitted_Parts">Submitted Parts</a></li>
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK/Safety" ><span data-text="Safety">Safety</a></li>
+
</ul>
 +
</li>
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK/Commmunity" ><span data-text="Community Outreach">Community Outreach</a>
+
<li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK/Safety" ><span data-text="Safety">Safety</a></li>
-
<ul>
+
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Community/Teaching">Teaching</a></li>
+
-
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Community/Videos">Online</a></li>
+
-
</ul>
+
-
</li>
+
-
<li><a href="https://2013.igem.org/Team:OU-Norman_OK/Attributions"><span data-text="Attributions">Attributions</a></li>
+
 +
<li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK/Commmunity" ><span data-text="Community Outreach">Community Outreach</a>
 +
<ul>
 +
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Community/Teaching">Teaching</a></li>
 +
    <li><a href="https://2013.igem.org/Team:OU-Norman_OK/Community/Videos">Online</a></li>
 +
</ul>
 +
</li>
 +
<li><a class="glidebutton" href="https://2013.igem.org/Team:OU-Norman_OK/Attributions"><span data-text="Attributions">Attributions</a></li>
 +
</div>
 +
</div>
</body>
</body>
</html>
</html>

Revision as of 19:49, 14 June 2013

Retrieved from "http://2013.igem.org/Template:Team:OU-Norman_OK"