Difference between revisions of "Team:elan vital korea"
| Line 1: | Line 1: | ||
<html lang=''> | <html lang=''> | ||
| + | <style> | ||
| + | #cssmenu { | ||
| + | padding: 0; | ||
| + | margin: 0; | ||
| + | border: 0; | ||
| + | width: auto; | ||
| + | } | ||
| + | #cssmenu ul, | ||
| + | #cssmenu li { | ||
| + | list-style: none; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | } | ||
| + | #cssmenu ul { | ||
| + | position: relative; | ||
| + | z-index: 597; | ||
| + | } | ||
| + | #cssmenu ul li { | ||
| + | float: left; | ||
| + | min-height: 1px; | ||
| + | vertical-align: middle; | ||
| + | } | ||
| + | #cssmenu ul li.hover, | ||
| + | #cssmenu ul li:hover { | ||
| + | position: relative; | ||
| + | z-index: 599; | ||
| + | cursor: default; | ||
| + | } | ||
| + | #cssmenu ul ul { | ||
| + | visibility: hidden; | ||
| + | position: absolute; | ||
| + | top: 100%; | ||
| + | left: 0; | ||
| + | z-index: 598; | ||
| + | width: 100%; | ||
| + | } | ||
| + | #cssmenu ul ul li { | ||
| + | float: none; | ||
| + | } | ||
| + | #cssmenu ul ul ul { | ||
| + | top: 0; | ||
| + | left: 190px; | ||
| + | width: 190px; | ||
| + | } | ||
| + | #cssmenu ul li:hover > ul { | ||
| + | visibility: visible; | ||
| + | } | ||
| + | #cssmenu ul ul { | ||
| + | bottom: 0; | ||
| + | left: 0; | ||
| + | } | ||
| + | #cssmenu ul ul { | ||
| + | margin-top: 0; | ||
| + | } | ||
| + | #cssmenu ul ul li { | ||
| + | font-weight: normal; | ||
| + | } | ||
| + | #cssmenu a { | ||
| + | display: block; | ||
| + | line-height: 1em; | ||
| + | text-decoration: none; | ||
| + | } | ||
| + | /* Custom CSS Styles */ | ||
| + | #cssmenu { | ||
| + | background: #333333; | ||
| + | border-bottom: 4px solid #1b9bff; | ||
| + | font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif; | ||
| + | font-size: 12px; | ||
| + | } | ||
| + | #cssmenu > ul { | ||
| + | *display: inline-block; | ||
| + | } | ||
| + | #cssmenu:after, | ||
| + | #cssmenu ul:after { | ||
| + | content: ''; | ||
| + | display: block; | ||
| + | clear: both; | ||
| + | } | ||
| + | #cssmenu ul { | ||
| + | text-transform: uppercase; | ||
| + | } | ||
| + | #cssmenu ul ul { | ||
| + | border-top: 4px solid #1b9bff; | ||
| + | text-transform: none; | ||
| + | min-width: 190px; | ||
| + | } | ||
| + | #cssmenu ul ul a { | ||
| + | background: #1b9bff; | ||
| + | color: #ffffff; | ||
| + | border: 1px solid #0082e7; | ||
| + | border-top: 0 none; | ||
| + | line-height: 150%; | ||
| + | padding: 16px 20px; | ||
| + | font-size: 12px; | ||
| + | } | ||
| + | #cssmenu ul ul ul { | ||
| + | border-top: 0 none; | ||
| + | } | ||
| + | #cssmenu ul ul li { | ||
| + | position: relative; | ||
| + | } | ||
| + | #cssmenu ul ul li:first-child > a { | ||
| + | border-top: 1px solid #0082e7; | ||
| + | } | ||
| + | #cssmenu ul ul li:hover > a { | ||
| + | background: #4eb1ff; | ||
| + | color: #ffffff; | ||
| + | } | ||
| + | #cssmenu ul ul li:last-child > a { | ||
| + | -moz-border-radius: 0 0 3px 3px; | ||
| + | -webkit-border-radius: 0 0 3px 3px; | ||
| + | border-radius: 0 0 3px 3px; | ||
| + | -moz-background-clip: padding; | ||
| + | -webkit-background-clip: padding-box; | ||
| + | background-clip: padding-box; | ||
| + | -moz-box-shadow: 0 1px 0 #1b9bff; | ||
| + | -webkit-box-shadow: 0 1px 0 #1b9bff; | ||
| + | box-shadow: 0 1px 0 #1b9bff; | ||
| + | } | ||
| + | #cssmenu ul ul li:last-child:hover > a { | ||
| + | -moz-border-radius: 0 0 0 3px; | ||
| + | -webkit-border-radius: 0 0 0 3px; | ||
| + | border-radius: 0 0 0 3px; | ||
| + | -moz-background-clip: padding; | ||
| + | -webkit-background-clip: padding-box; | ||
| + | background-clip: padding-box; | ||
| + | } | ||
| + | #cssmenu ul ul li.has-sub > a:after { | ||
| + | content: '+'; | ||
| + | position: absolute; | ||
| + | top: 50%; | ||
| + | right: 15px; | ||
| + | margin-top: -8px; | ||
| + | } | ||
| + | #cssmenu ul li:hover > a, | ||
| + | #cssmenu ul li.active > a { | ||
| + | background: #1b9bff; | ||
| + | color: #ffffff; | ||
| + | } | ||
| + | #cssmenu ul li.has-sub > a:after { | ||
| + | content: '+'; | ||
| + | margin-left: 5px; | ||
| + | } | ||
| + | #cssmenu ul li.last ul { | ||
| + | left: auto; | ||
| + | right: 0; | ||
| + | } | ||
| + | #cssmenu ul li.last ul ul { | ||
| + | left: auto; | ||
| + | right: 99.5%; | ||
| + | } | ||
| + | #cssmenu a { | ||
| + | background: #333333; | ||
| + | color: #CBCBCB; | ||
| + | padding: 0 20px; | ||
| + | } | ||
| + | #cssmenu > ul > li > a { | ||
| + | line-height: 48px; | ||
| + | font-size: 12px; | ||
| + | } | ||
| + | |||
| + | </style> | ||
<head> | <head> | ||
<meta charset='utf-8'> | <meta charset='utf-8'> | ||
| Line 12: | Line 174: | ||
<div id='cssmenu'> | <div id='cssmenu'> | ||
<ul> | <ul> | ||
| − | <li><a href='#'><span> | + | <li class='active has-sub'><a href='#'><span>Team</span></a> |
| − | + | <ul> | |
| − | + | <li class='has-sub'><a href='#'><span>Members</span></a> | |
| − | <li class='has-sub'><a href='#'><span> | + | <li class='has-sub'><a href='#'><span>Attribution</span></a> |
| − | + | </ul> | |
| − | + | <li class='active has-sub'><a href='#'><span>Projects</span></a> | |
| − | + | <ul> | |
| − | + | <li class='has-sub'><a href='#'><span>Project Overview</span></a> | |
| − | + | <li class='has-sub'><a href='#'><span>Background Information</span></a> | |
| − | <li class='has-sub'><a href='#'><span> | + | <li class='has-sub'><a href='#'><span>Method & Materials</span></a> |
<ul> | <ul> | ||
| − | <li><a href='#'><span> | + | <li><a href='#'><span>Plasma Design</span></a></li> |
| − | <li class='last'><a href='#'><span> | + | <li class='last'><a href='#'><span>Protocal</span></a></li> |
</ul> | </ul> | ||
| − | </li> | + | <li class='has-sub'><a href='#'><span>Result</span></a> |
| − | + | <li class='has-sub'><a href='#'><span>Future Plans</span></a> | |
| − | + | </ul> | |
| − | <li><a href='#'><span> | + | <li class='active has-sub'><a href='#'><span>Web Lab</span></a> |
| − | <li class=' | + | <ul> |
| + | <li class='has-sub'><a href='#'><span>Notebook</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Protocal</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Safety</span></a> | ||
| + | </ul> | ||
| + | <li class='active has-sub'><a href='#'><span>Human Practice</span></a> | ||
| + | <ul> | ||
| + | <li class='has-sub'><a href='#'><span>Focus</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Korea Youth Expo</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Education Public Awareness</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Policy Recommnedations</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Blog</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Interview</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Regional Meet-ups</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Articles</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Vdieo</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Presentations</span></a> | ||
| + | </ul> | ||
| + | <li class='active has-sub'><a href='#'><span>iGEM Resource</span></a> | ||
| + | <ul> | ||
| + | <li class='has-sub'><a href='#'><span>Medal Requirement</span></a> | ||
| + | <li class='has-sub'><a href='#'><span>Module Description</span></a> | ||
| + | </ul> | ||
</ul> | </ul> | ||
</div> | </div> | ||
Revision as of 18:15, 25 August 2015