Team:NJU China/Team
From 2013.igem.org
(Difference between revisions)
Line 503: | Line 503: | ||
<h2 class="ss-subtitle">TEAM</h2> | <h2 class="ss-subtitle">TEAM</h2> | ||
<!--Start NavBar--> | <!--Start NavBar--> | ||
- | + | <ul id="nav"> | |
- | <li><a href=" | + | <li><a href="https://2013.igem.org/Team:NJU_China">Home</a></li> |
- | + | ||
- | <li><a href=" | + | <li><a href="https://2013.igem.org/Team:NJU_China/Team">Team</a></li> |
- | <li><a href=" | + | |
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Project">Project</a> | |
- | + | <ul> | |
- | + | <li><a href="http://https://2013.igem.org/Team:NJU_China/Project#Overview">Overview</a></li> | |
- | + | <li><a https://2013.igem.org/Team:NJU_China/Project#Chassis">Chassis</a></li> | |
- | + | <li><a https://2013.igem.org/Team:NJU_China/Project#Targeting Module">Targeting Module</a></li> | |
+ | <li><a https://2013.igem.org/Team:NJU_China/Project#The_Experiments">The_Experiments</a></li> | ||
+ | <li><a https://2013.igem.org/Team:NJU_China/Project#Killing Module">Killing Module</a></li> | ||
+ | <li><a https://2013.igem.org/Team:NJU_China/Project#Achievement">Achievement</a></li> | ||
+ | </ul> | ||
</li> | </li> | ||
- | <li><a href=" | + | |
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Parts">Parts</a></li> | |
- | + | ||
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Modeling">Modeling</a></li> | |
- | <li><a href=" | + | |
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Notebook">Notebook</a></li> | |
- | + | ||
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Safety">Safety</a></li> | |
- | + | ||
- | + | <li><a href="https://2013.igem.org/Team:NJU_China/Attributions">Attributions</a></li> | |
- | + | ||
- | + | </ul> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | <li><a href=" | + | |
- | + | ||
- | + | ||
- | + | ||
- | <li><a href=" | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | <li><a href=" | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
<!--End NavBar--> | <!--End NavBar--> | ||
<div id="ss-container" class="ss-container"> | <div id="ss-container" class="ss-container"> | ||
Line 788: | Line 754: | ||
<link rel="stylesheet" type="text/css" href="http://cs.wellesley.edu/~hcilab/iGEM2012/css/Team.css"> | <link rel="stylesheet" type="text/css" href="http://cs.wellesley.edu/~hcilab/iGEM2012/css/Team.css"> | ||
<STYLE type="text/css"> | <STYLE type="text/css"> | ||
- | + | /* MAIN STYLE DEFINITIONS */ | |
- | + | a{ | |
- | + | color:#870203; | |
- | + | -webkit-transition-duration:0.3s; | |
- | + | -moz-transition-duration:0.3s; | |
- | + | -o-transition-duration:0.3s; | |
- | + | } | |
- | + | ||
- | # | + | a:hover { |
- | + | color:#3d3f3c; | |
- | + | } | |
- | + | ||
- | + | a:visited{ | |
- | + | color:#870203; | |
- | + | } | |
- | + | ||
- | + | td | |
- | + | { | |
- | + | font-family: Helvetica; | |
- | + | font-size: 10pt; | |
- | + | vertical-align: top; | |
- | + | text-align: left; | |
- | + | padding-right: 10px; | |
- | + | } | |
- | + | ||
- | + | tr | |
- | + | { | |
- | + | vertical-align: top; | |
- | + | } | |
- | + | ||
- | + | H1 { | |
- | + | font-family: Helvetica; | |
- | + | text-transform: uppercase; | |
- | + | color: #3d3f3c; | |
- | + | text-align: left; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | H4 { | |
- | + | font-family: Helvetica; | |
- | + | text-transform: uppercase; | |
- | + | color: #3d3f3c; | |
- | + | text-align: left; | |
- | + | } | |
- | + | ||
- | + | /* CONTENT HEADING STYLES - overrides some main.css styling */ | |
- | + | ||
- | + | H6 { | |
- | + | font-family:'Caviar Dreams'; | |
- | + | font-size:30px; | |
- | + | font-weight:500; | |
- | + | text-align:left; | |
- | + | text-transform:uppercase; | |
- | + | color: #3d3f3c; | |
- | + | border-bottom:1px solid orangered; | |
- | + | padding-bottom:10px; | |
- | + | margin:15px 0; | |
- | + | } | |
- | + | ||
- | + | H1, H3 { | |
- | + | font-family:'Source Sans Pro'; | |
+ | font-weight:600; | ||
+ | text-transform:uppercase; | ||
+ | } | ||
+ | |||
+ | H1 { | ||
+ | font-size:20px; | ||
+ | border:none; | ||
+ | } | ||
+ | |||
+ | img.headshot { | ||
+ | width: 100px; | ||
+ | height: auto; | ||
+ | vertical-align: text-top; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | body { | ||
+ | background:#fff; | ||
+ | font-family: Helvetica; | ||
+ | } | ||
+ | |||
+ | content { | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | #tracking_nav | ||
+ | { | ||
+ | margin: 0px 0px 0px 950px; | ||
+ | position: fixed; | ||
+ | color:#bababa; | ||
+ | border: 1px solid #3d3f3c; | ||
+ | background:#3d3f3c; | ||
+ | font-size: 16pt; | ||
+ | padding: 5px; | ||
+ | line-height: 120%; | ||
+ | } | ||
+ | |||
+ | #tracking_nav a { color:#ffffff; text-transform: lowercase;font-size: 16pt;} | ||
+ | #tracking_nav a:hover {background:#bababa;} | ||
+ | |||
+ | #parts_table | ||
+ | { | ||
+ | border: 1px solid #870203; | ||
+ | border-collapse: collapse; | ||
+ | width: 70%; | ||
+ | margin: auto; | ||
+ | } | ||
+ | |||
+ | #parts_table td | ||
+ | { | ||
+ | text-align: center; | ||
+ | margin: 5px; | ||
+ | border: 1px solid #870203; | ||
+ | |||
+ | } | ||
+ | |||
+ | #parts_table th | ||
+ | { | ||
+ | background-color: #bababa; | ||
+ | border: 1px solid #870203; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | .table_part | ||
+ | { | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | /* HEADER STYLES: banner, navbar, etc. */ | ||
+ | #banner { width:300px; display:block; float:left; } | ||
+ | #banner img { width:100%; } | ||
+ | |||
+ | ul#nav { | ||
+ | width:1800px; | ||
+ | margin:30px 0 0 325px; | ||
+ | position:relative; | ||
+ | } | ||
+ | |||
+ | #nav li { | ||
+ | color: #bbb; | ||
+ | background-color:none; | ||
+ | margin: 0 50px 0 0; | ||
+ | float: left; | ||
+ | position: relative; | ||
+ | list-style: none; | ||
+ | text-transform:uppercase; | ||
+ | } | ||
+ | #nav li:last-child { margin:0; } | ||
+ | |||
+ | /* main level link */ | ||
+ | #nav a { | ||
+ | font-family:'Source Sans Pro', sans-serif; | ||
+ | font-size:10pt; | ||
+ | font-weight:500; | ||
+ | line-height:110%; | ||
+ | color: inherit; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | padding: 0 0 0 5px; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | ul#nav > li > a { | ||
+ | line-height:12px; | ||
+ | border-left:solid 2px #bbb; | ||
+ | padding:0 0 0 3px; | ||
+ | } | ||
+ | |||
+ | #nav a:hover { | ||
+ | /*background-color: #870203; | ||
+ | color: #ffffff;*/ | ||
+ | } | ||
+ | |||
+ | /* main level link hover */ | ||
+ | #nav .current a, #nav li:hover > a { | ||
+ | color: #000; | ||
+ | border-color:orangered; | ||
+ | } | ||
+ | |||
+ | /* sub levels link hover */ | ||
+ | #nav ul li:hover a, #nav li:hover li a { | ||
+ | border: none; | ||
+ | /*background-color: #FA9D1C;*/ | ||
+ | color:#000; | ||
+ | } | ||
+ | |||
+ | #nav ul a:hover { | ||
+ | color: orangered !important; | ||
+ | /*background: #fff url(img/gradient.png) repeat-x 0 -100px !important; | ||
+ | text-shadow: 0 1px 1px rgba(0,0,0, .1);*/ | ||
+ | } | ||
+ | |||
+ | |||
+ | /* dropdown */ | ||
+ | #nav li:hover > ul { | ||
+ | /*display: block;*/ | ||
+ | opacity:1; | ||
+ | margin:0; | ||
+ | background-color: none; | ||
+ | z-index:0; | ||
+ | } | ||
+ | |||
+ | /* level 2 list */ | ||
+ | #nav ul { | ||
+ | /*display: none;*/ | ||
+ | opacity:0; | ||
+ | margin: 20px 0 0 0; | ||
+ | padding: 7px 0 0 0; | ||
+ | width: 205px; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | z-index:-1; | ||
+ | -webkit-transition-duration:0.5s; | ||
+ | -moz-transition-duration:0.5s; | ||
+ | -o-transition-duration:0.5s; | ||
+ | } | ||
+ | #nav ul li { | ||
+ | float: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | #nav ul a { | ||
+ | font-weight: normal; | ||
+ | /*text-shadow: 0 1px 0 #fff;*/ | ||
+ | } | ||
+ | |||
+ | /* clearfix */ | ||
+ | #nav:after { | ||
+ | content: "."; | ||
+ | display: block; | ||
+ | clear: both; | ||
+ | visibility: hidden; | ||
+ | line-height: 0; | ||
+ | height: 0; | ||
+ | } | ||
+ | #nav { | ||
+ | display: inline-block; | ||
+ | } | ||
+ | html[xmlns] #nav { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | * html #nav { | ||
+ | height: 1%; | ||
+ | } | ||
+ | |||
+ | /* pinterest like photo grid for social page*/ | ||
+ | |||
+ | /* | ||
+ | body { | ||
+ | background: url(http://subtlepatterns.com/patterns/scribble_light.png) ; | ||
+ | } | ||
+ | */ | ||
+ | |||
+ | #wrapper { | ||
+ | width: 90%; | ||
+ | max-width: 1100px; | ||
+ | min-width: 800px; | ||
+ | margin: 50px auto; | ||
+ | } | ||
+ | |||
+ | #columns { | ||
+ | -webkit-column-count: 3; | ||
+ | -webkit-column-gap: 10px; | ||
+ | -webkit-column-fill: auto; | ||
+ | -moz-column-count: 3; | ||
+ | -moz-column-gap: 10px; | ||
+ | -moz-column-fill: auto; | ||
+ | column-count: 3; | ||
+ | column-gap: 15px; | ||
+ | column-fill: auto; | ||
+ | } | ||
+ | |||
+ | .pin { | ||
+ | display: inline-block; | ||
+ | background: #FEFEFE; | ||
+ | border: 2px solid #FAFAFA; | ||
+ | box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4); | ||
+ | margin: 0 2px 15px; | ||
+ | -webkit-column-break-inside: avoid; | ||
+ | -moz-column-break-inside: avoid; | ||
+ | column-break-inside: avoid; | ||
+ | padding: 15px; | ||
+ | padding-bottom: 5px; | ||
+ | background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9); | ||
+ | opacity: 1; | ||
+ | |||
+ | -webkit-transition: all .2s ease; | ||
+ | -moz-transition: all .2s ease; | ||
+ | -o-transition: all .2s ease; | ||
+ | transition: all .2s ease; | ||
+ | } | ||
+ | |||
+ | .pin img { | ||
+ | width: 100%; | ||
+ | border-bottom: 1px solid #ccc; | ||
+ | padding-bottom: 15px; | ||
+ | margin-bottom: 5px; | ||
+ | } | ||
+ | |||
+ | .pin p { | ||
+ | font: 12px/18px Arial, sans-serif; | ||
+ | color: #333; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | @media (min-width: 960px) { | ||
+ | #columns { | ||
+ | -webkit-column-count: 4; | ||
+ | -moz-column-count: 4; | ||
+ | column-count: 4; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media (min-width: 1100px) { | ||
+ | #columns { | ||
+ | -webkit-column-count: 5; | ||
+ | -moz-column-count: 5; | ||
+ | column-count: 5; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #columns:hover .pin:not(:hover) { | ||
+ | opacity: 0.4; | ||
+ | } | ||
</STYLE> | </STYLE> | ||
Revision as of 12:26, 27 September 2013