Team:Arizona State/Template:Header

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
<html lang="en">
-
<br>
+
<!-- Made by Abhi & Jordan with help from the "https://2011.igem.org/Team:Imperial_College_London" page -->
-
<head>
+
<head>
-
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-
  <style type="text/css">
+
<style type="text/css">
-
 
+
   #top-section {
   #top-section {
   width: 975px;
   width: 975px;
Line 12: Line 11:
   }
   }
-
   #p-logo {
+
   #p-logo { display: none; }
-
  display: none;}
+
   #search-controls { display: none; }
-
 
+
   .firstHeading { display: none; }
-
   #search-controls {
+
  body { background-color:#E9EEE9; }
-
   display: none;}
+
  #contentSub { margin: 0 0 0 0; }
-
 
+
  iframe { padding: 10px 20px 10px 20px; }
 +
 
   .right-menu li a, .right-menu li a:hover {
   .right-menu li a, .right-menu li a:hover {
   color: #3c6b27;
   color: #3c6b27;
Line 23: Line 23:
   }
   }
-
   .firstHeading {
+
   #iGEMLogo {
-
    display: none;}
+
  position:absolute;
 +
  top:30px;
 +
  left:30px;
 +
  }
-
   #AsuLogo {
+
   #ProjectTitle {
   position: relative;
   position: relative;
   text-align:center;
   text-align:center;
   }
   }
-
   #iGEMLogo {
+
   #ASULogo {
-
   position:absolute;
+
   position: absolute;
   top:30px;
   top:30px;
-
   left:30px;
+
   right:30px;
-
  }
+
-
 
+
-
 
+
-
  body {
+
-
  background-color:#E9EEE9;
+
   }
   }
Line 61: Line 59:
   line-height: 1.5em;
   line-height: 1.5em;
   z-index: 2;
   z-index: 2;
-
  }
 
-
 
-
  #contentSub {
 
-
  margin: 0 0 0 0;
 
   }
   }
Line 164: Line 158:
   .newouterbox {
   .newouterbox {
-
   background-color:#FF944D;border:1px solid #CCCCCC;margin:20px;padding-bottom:0px;
+
   background-color:#FF944D;
 +
  border:1px solid #CCCCCC;
 +
  margin:20px;
 +
  padding-bottom:0px;
   }
   }
   .newinnerbox {
   .newinnerbox {
-
   border:1px solid #CCCCCC;margin:10px 20px 20px 20px;padding-top:0px;padding-bottom:13px;background-color:#ffffff;
+
   border:1px solid #CCCCCC;
 +
  margin:10px 20px 20px 20px;
 +
  padding-top:0px;
 +
  padding-bottom:13px;
 +
  background-color:#ffffff;
   }
   }
   .newtext {
   .newtext {
-
   text-align:center;background-color:#FF944D;color:#000000;
+
   text-align:center;
 +
  background-color:#FF944D;
 +
  color:#000000;
   }
   }
Line 200: Line 203:
   text-align: justify;
   text-align: justify;
   padding: 5px 20px 0px 20px;
   padding: 5px 20px 0px 20px;
-
  }
 
-
 
-
  iframe {
 
-
  padding: 10px 20px 10px 20px;
 
   }
   }
Line 218: Line 217:
   }
   }
-
  </style>
+
/*** Start of Styling for menu bar ***/
-
  </head>
+
-
 
+
-
<body>
+
-
<a name="top"></a>
+
-
<div id='AsuLogo'>
+
-
  <a href='https://2012.igem.org/Team:Arizona_State'>
+
-
    <img src="https://static.igem.org/mediawiki/2012/d/db/2012_Project_logo.png" style="width:550px;" />
+
-
  </a>
+
-
</div>
+
-
<div id='iGEMLogo'>
+
-
  <a href='https://2012.igem.org/Main_Page'>
+
-
    <img src="https://static.igem.org/mediawiki/2012/d/d6/IGEM_official_logo.png" style="width:120px;" />
+
-
  </a>
+
-
</div>
+
-
 
+
-
 
+
-
<div id="BackToTop">
+
-
<a href="#top">
+
-
<img src="https://static.igem.org/mediawiki/2012/2/2d/ArrowColorChanged.png" width="50px" />
+
-
</a>
+
-
</div>
+
-
 
+
-
<div id="Sitemap">
+
-
<a href='https://2012.igem.org/Team:Arizona_State/Sitemap'>
+
-
<img src="https://static.igem.org/mediawiki/2012/3/30/SiteMapColorChange.png" width="100px" />
+
-
</a>
+
-
</div>
+
-
 
+
-
</body>
+
-
</html>
+
-
 
+
-
 
+
-
<html lang="en">
+
-
 
+
-
<!-- Made by Jordan with help from the "https://2011.igem.org/Team:Imperial_College_London" page -->
+
-
 
+
-
<head>
+
-
<meta http-equiv="content-type" content="text/html;charset=utf-8">
+
-
    <style type="text/css">
+
/*** ESSENTIAL STYLES ***/
/*** ESSENTIAL STYLES ***/
-
a.collapseLink {
+
  a.collapseLink {
-
font-weight:bold;
+
  font-weight:bold;
-
font-size:1em;
+
  font-size:1em;
-
color:#225323;
+
  color:#225323;
-
}
+
  }
-
.sf-menu, .sf-menu * {
+
  .sf-menu, .sf-menu * {
-
margin: 0;
+
  margin: 0;
-
padding: 0;
+
  padding: 0;
-
list-style: none;
+
  list-style: none;
-
}
+
  }
-
.sf-menu {
+
  .sf-menu {
-
line-height: 1.0;
+
  line-height: 1.0;
-
}
+
  }
-
.sf-menu ul {
+
  .sf-menu ul {
-
position: absolute;
+
  position: absolute;
-
top: -999em;
+
  top: -999em;
-
width: 195px; /* left offset of submenus need to match (see below) */
+
  width: 195px; /* left offset of submenus need to match (see below) */
-
}
+
  }
-
.sf-menu ul li {
+
  .sf-menu ul li {
-
width: 100%;
+
  width: 100%;
-
}
+
  }
-
.sf-menu li:hover {
+
  .sf-menu li:hover {
-
visibility: inherit; /* fixes IE7 'sticky bug' */
+
  visibility: inherit; /* fixes IE7 'sticky bug' */
-
}
+
  }
-
.sf-menu li {
+
  .sf-menu li {
-
float: left;
+
  float: left;
-
position: relative;
+
  position: relative;
-
        width:                 195px;
+
  width:       195px;
-
}
+
  }
-
.sf-menu a {
+
  .sf-menu a {
-
display: block;
+
  display: block;
-
position: relative;
+
  position: relative;
-
}
+
  }
-
.sf-menu li:hover ul,
+
  .sf-menu li:hover ul, .sf-menu li.sfHover ul {
-
.sf-menu li.sfHover ul {
+
  left: 0;
-
left: 0;
+
  top: 2.5em; /* match top ul list item height */
-
top: 2.5em; /* match top ul list item height */
+
  z-index: 99;
-
z-index: 99;
+
  }
-
}
+
  ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
-
ul.sf-menu li:hover li ul,
+
  top: -999em;
-
ul.sf-menu li.sfHover li ul {
+
  }
-
top: -999em;
+
  ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
-
}
+
  left: 15.3em; /* match ul width */
-
ul.sf-menu li li:hover ul,
+
  top: 0;
-
ul.sf-menu li li.sfHover ul {
+
  }
-
left: 15.3em; /* match ul width */
+
  ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
-
top: 0;
+
  top: -999em;
-
}
+
  }
-
ul.sf-menu li li:hover li ul,
+
  ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
-
ul.sf-menu li li.sfHover li ul {
+
  left: 10em; /* match ul width */
-
top: -999em;
+
  top: 0;
-
}
+
  }
-
ul.sf-menu li li li:hover ul,
+
-
ul.sf-menu li li li.sfHover ul {
+
-
left: 10em; /* match ul width */
+
-
top: 0;
+
-
}
+
/*** DEMO SKIN ***/
/*** DEMO SKIN ***/
-
.sf-menu {
+
.sf-menu {
-
float: left;
+
float: left;
-
margin-bottom: 1em;
+
margin-bottom: 1em;
-
}
+
}
-
.sf-menu a {
+
.sf-menu a {
-
border-left: 1px solid #fff;
+
border-left: 1px solid #fff;
-
border-top: 1px solid #826554;
+
border-top: 1px solid #826554;
-
padding: 0.37em 1em 0.37em 1em;
+
padding: 0.37em 1em 0.37em 1em;
-
text-decoration:none;
+
text-decoration:none;
         font-family: 'helveticaneue', sans-serif;
         font-family: 'helveticaneue', sans-serif;
         font-size:1.3em;
         font-size:1.3em;
-
}
+
}
-
 
+
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
-
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
+
color: #efefef;
-
color: #efefef;
+
}
-
}
+
.sf-menu li, .sf-menu li li, .sf-menu li li li {
-
.sf-menu li {
+
background: #990000;
-
background: #990000;
+
}
-
 
+
.sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
-
}
+
background: #b30000;
-
.sf-menu li li {
+
outline: 0;
-
background: #990000;
+
}
-
}
+
-
.sf-menu li li li {
+
-
background: #990000;
+
-
}
+
-
.sf-menu li:hover, .sf-menu li.sfHover,
+
-
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
+
-
background: #b30000;
+
-
outline: 0;
+
-
}
+
/*** arrows **/
/*** arrows **/
-
.sf-menu a.sf-with-ul {
+
.sf-menu a.sf-with-ul {
-
cursor: default;  
+
cursor: default;  
-
padding-right: 2.25em;
+
padding-right: 2.25em;
-
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
+
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
-
}
+
}
-
.sf-sub-indicator {
+
.sf-sub-indicator {
-
position: absolute;
+
position: absolute;
-
display: block;
+
display: block;
-
right: .75em;
+
right: .75em;
-
top: 1.05em; /* IE6 only */
+
top: 1.05em; /* IE6 only */
-
width: 10px;
+
width: 10px;
-
height: 10px;
+
height: 10px;
-
text-indent: -999em;
+
text-indent: -999em;
-
overflow: hidden;
+
overflow: hidden;
-
background: url('https://static.igem.org/mediawiki/2011/2/2f/ICL_MenuArrow.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
+
background: url('https://static.igem.org/mediawiki/2011/2/2f/ICL_MenuArrow.png') no-repeat -10px -100px;
-
}
+
/* 8-bit indexed alpha png. IE6 gets solid image only */
-
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
+
}
-
top: .8em;
+
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
-
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
+
top: .8em;
-
}
+
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
 +
}
/* apply hovers to modern browsers */
/* apply hovers to modern browsers */
-
a:focus > .sf-sub-indicator,
+
a:focus > .sf-sub-indicator,
-
a:hover > .sf-sub-indicator,
+
a:hover > .sf-sub-indicator,
-
a:active > .sf-sub-indicator,
+
a:active > .sf-sub-indicator,
-
li:hover > a > .sf-sub-indicator,
+
li:hover > a > .sf-sub-indicator,
-
li.sfHover > a > .sf-sub-indicator {
+
li.sfHover > a > .sf-sub-indicator {
-
background-position: -10px -100px; /* arrow hovers for modern browsers*/
+
background-position: -10px -100px; /* arrow hovers for modern browsers*/
-
}
+
}
/* point right for anchors in subs */
/* point right for anchors in subs */
-
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
+
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
-
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
+
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
/* apply hovers to modern browsers */
-
.sf-menu ul a:focus > .sf-sub-indicator,
+
.sf-menu ul a:focus > .sf-sub-indicator,
-
.sf-menu ul a:hover > .sf-sub-indicator,
+
.sf-menu ul a:hover > .sf-sub-indicator,
-
.sf-menu ul a:active > .sf-sub-indicator,
+
.sf-menu ul a:active > .sf-sub-indicator,
-
.sf-menu ul li:hover > a > .sf-sub-indicator,
+
.sf-menu ul li:hover > a > .sf-sub-indicator,
-
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
+
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
-
background-position: -10px 0; /* arrow hovers for modern browsers*/
+
background-position: -10px 0; /* arrow hovers for modern browsers*/
-
}
+
}
/*** shadows for all but IE6 ***/
/*** shadows for all but IE6 ***/
-
.sf-shadow ul {
+
.sf-shadow ul {
-
background: url('https://static.igem.org/mediawiki/2011/9/9f/ICL_Shadow.png') no-repeat bottom right;
+
background: url('https://static.igem.org/mediawiki/2011/9/9f/ICL_Shadow.png') no-repeat bottom right;
-
padding: 0 8px 9px 0;
+
padding: 0 8px 9px 0;
-
-moz-border-radius-bottomleft: 17px;
+
-moz-border-radius-bottomleft: 17px;
-
-moz-border-radius-topright: 17px;
+
-moz-border-radius-topright: 17px;
-
-webkit-border-top-right-radius: 17px;
+
-webkit-border-top-right-radius: 17px;
-
-webkit-border-bottom-left-radius: 17px;
+
-webkit-border-bottom-left-radius: 17px;
-
}
+
}
-
.sf-shadow ul.sf-shadow-off {
+
.sf-shadow ul.sf-shadow-off {
-
background: transparent;
+
background: transparent;
-
}
+
}
-
</style>
+
</style>
-
   
+
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
+
-
    </script>
+
-
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/hoverIntent?action=raw&ctype=text/js">
+
-
    </script>
+
-
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/superfishjs?action=raw&ctype=text/js">
+
-
    </script>
+
-
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/magnifier?action=raw&ctype=text/js">
+
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
 +
</script>
 +
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/hoverIntent?action=raw&ctype=text/js">
 +
</script>
 +
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/superfishjs?action=raw&ctype=text/js">
 +
</script>
 +
<script type="text/javascript" src="https://2011.igem.org/Team:Imperial_College_London/magnifier?action=raw&ctype=text/js">
/***********************************************
/***********************************************
* jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* jQuery Image Magnify- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
Line 419: Line 365:
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
***********************************************/
 +
</script>
<script type="text/javascript">
<script type="text/javascript">
Line 450: Line 397:
});
});
</script>
</script>
-
</head>  
+
</head>
<body>
<body>
 +
<a name="top"></a>
 +
<div id='iGEMLogo'>
 +
  <a href='https://2012.igem.org/Main_Page'>
 +
    <img src="https://static.igem.org/mediawiki/2012/d/d6/IGEM_official_logo.png" style="width:120px;" />
 +
  </a>
 +
</div>
 +
 +
<div id='ProjectTitle'>
 +
  <a href='https://2012.igem.org/Team:Arizona_State'>
 +
    <img src="https://static.igem.org/mediawiki/2012/d/db/2012_Project_logo.png" style="width:550px;" />
 +
  </a>
 +
</div>
 +
 +
<div id='ASULogo'>
 +
<img src="https://www.asu.edu/asuthemes/3.0/images/asu_logo.png" />
 +
</div>
 +
 +
<div id="BackToTop">
 +
<a href="#top">
 +
<img src="https://static.igem.org/mediawiki/2012/2/2d/ArrowColorChanged.png" width="50px" />
 +
</a>
 +
</div>
 +
 +
<div id="Sitemap">
 +
<a href='https://2012.igem.org/Team:Arizona_State/Sitemap'>
 +
<img src="https://static.igem.org/mediawiki/2012/3/30/SiteMapColorChange.png" width="100px" />
 +
</a>
 +
</div>
 +
<div id='menucontainer'>
<div id='menucontainer'>
<ul class="sf-menu sf-navbar">
<ul class="sf-menu sf-navbar">
-
<li>  
+
<li><a class="sf-with-ul" href="#">Project<span class="sf-sub-indicator"> &#187;</span></a>
-
<a class="sf-with-ul" href="#">Project<span class="sf-sub-indicator"> &#187;</span></a>  
+
        <ul>
-
<ul>  
+
<li><a href="https://2012.igem.org/Team:Arizona_State">Home</a> </li>  
-
                <li><a href="https://2012.igem.org/Team:Arizona_State">Home</a> </li>  
+
<li><a href="https://2012.igem.org/Team:Arizona_State/Problem">Problem</a> </li>  
<li><a href="https://2012.igem.org/Team:Arizona_State/Problem">Problem</a> </li>  
<li><a href="https://2012.igem.org/Team:Arizona_State/Overview">Overview</a> </li>  
<li><a href="https://2012.igem.org/Team:Arizona_State/Overview">Overview</a> </li>  
Line 466: Line 441:
</ul>  
</ul>  
</li>  
</li>  
-
<li>  
+
-
      <a href="https://2012.igem.org/Team:Arizona_State/Team">Team</a>  
+
    <li><a href="https://2012.igem.org/Team:Arizona_State/Team">Team</a>
-
+
    </li>
-
</li>
+
-
<li>  
+
<li><a class="sf-with-ul" href="#">Results<span class="sf-sub-indicator"> &#187;</span></a>  
-
<a class="sf-with-ul" href="#">Results<span class="sf-sub-indicator"> &#187;</span></a>  
+
<ul>  
<ul>  
<li><a href="https://2012.igem.org/Team:Arizona_State/Data">Data</a> </li>  
<li><a href="https://2012.igem.org/Team:Arizona_State/Data">Data</a> </li>  
Line 480: Line 453:
</ul>  
</ul>  
</li>
</li>
-
<li>  
+
<li><a class="sf-with-ul" href="#">Human Practices<span class="sf-sub-indicator"> &#187;</span></a>  
-
<a class="sf-with-ul" href="#">Human Practices<span class="sf-sub-indicator"> &#187;</span></a>  
+
<ul>
<ul>
<li><a href="https://2012.igem.org/Team:Arizona_State/University">University</a> </li>  
<li><a href="https://2012.igem.org/Team:Arizona_State/University">University</a> </li>  
Line 489: Line 461:
</li>  
</li>  
-
<li>  
+
<li><a class="sf-with-ul" href="#">Extras<span class="sf-sub-indicator"> &#187;</span></a>  
-
<a class="sf-with-ul" href="#">Extras<span class="sf-sub-indicator"> &#187;</span></a>  
+
<ul>
-
<ul>  
+
-
 
+
</ul>  
</ul>  
</li>  
</li>  
Line 498: Line 468:
</div>
</div>
</body>
</body>
-
 
</html>
</html>

Revision as of 19:27, 23 July 2012