|
|
Line 1: |
Line 1: |
- | <html>
| |
- | <head>
| |
- | <style type="text/css">
| |
- |
| |
- | .animatedtabs{
| |
- | border-bottom: 1px solid gray;
| |
- | overflow: visible;
| |
- | width: 100%;
| |
- | font-size: 14px; /*font of menu text*/
| |
- | }
| |
| | | |
- | .animatedtabs ul{
| |
- | list-style-type: none;
| |
- | margin: 0;
| |
- | margin-left: 10px; /*offset of first tab relative to page left edge*/
| |
- | padding: 0;
| |
- | }
| |
- |
| |
- | .animatedtabs li{
| |
- | float: left;
| |
- | margin: 0;
| |
- | padding: 0;
| |
- | }
| |
- |
| |
- | .animatedtabs a{
| |
- | float: left;
| |
- | position: relative;
| |
- | top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
| |
- | background: url(https://static.igem.org/mediawiki/2011/9/93/ICL_tab_left.jpg) no-repeat left top;
| |
- | margin: 0;
| |
- | margin-right: 3px; /*Spacing between each tab*/
| |
- | padding: 0 0 0 9px;
| |
- | text-decoration: none;
| |
- |
| |
- | }
| |
- |
| |
- | .animatedtabs a span{
| |
- | float: left;
| |
- | position: relative;
| |
- | display: block;
| |
- | background: url(https://static.igem.org/mediawiki/2011/5/53/ICL_tab_right.jpg) no-repeat right top;
| |
- | padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */
| |
- | font-weight: bold;
| |
- | color: #A35200;
| |
- | }
| |
- |
| |
- | /* Commented Backslash Hack hides rule from IE5-Mac \*/
| |
- | .animatedtabs a span {float:none;}
| |
- | /* End IE5-Mac hack */
| |
- |
| |
- |
| |
- | .animatedtabs .selected a{
| |
- | background-position: 0 -125px;
| |
- | top: 0;
| |
- | }
| |
- |
| |
- | .animatedtabs .selected a span{
| |
- | background-position: 100% -125px;
| |
- | color: #A35200;
| |
- | padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
| |
- | top: 0;
| |
- | }
| |
- |
| |
- | .animatedtabs a:hover{
| |
- | background-position: 0% -125px;
| |
- | top: 0;
| |
- | }
| |
- |
| |
- | .animatedtabs a:hover span{
| |
- | background-position: 100% -125px;
| |
- | padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
| |
- | top: 0;
| |
- | }
| |
- |
| |
- | </style>
| |
- | </head>
| |
- |
| |
- | <body>
| |
- | <h1>Brainstorming</h1>
| |
- | <p>This page contains a summary of the ideas we developed throughout our brainstorming sessions at the beginning of the project. These ideas can be classified into 4 main categories as shown below. Click on the tabs to find out more about the ideas in each category.<br /><br /></p>
| |
- |
| |
- | <div class="animatedtabs">
| |
- | <ul>
| |
- | <li class="selected"><a href="https://2011.igem.org/Team:Imperial_College_London/Extras/Brainstorming/Health"><span>Health & Medicine</span></a></li>
| |
- | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Extras/Brainstorming/Energy"><span>Energy & Environment</span></a></li>
| |
- | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Extras/Brainstorming/Energy/Bioremediation"><span>Bioremediation</span></a></li>
| |
- | <li><a href="https://2011.igem.org/Team:Imperial_College_London/Extras/Brainstorming/Energy/Others"><span>Others</span></a></li>
| |
- | </ul>
| |
- | </div>
| |
- | </body>
| |
- | </html>
| |