Team:UCSF UCB/CSS
From 2014.igem.org
(Difference between revisions)
(14 intermediate revisions not shown) | |||
Line 417: | Line 417: | ||
========================================================================== */ | ========================================================================== */ | ||
.landing-container { | .landing-container { | ||
- | background: # | + | background: #3d4c53; |
width: 1026px; | width: 1026px; | ||
-webkit-animation: zoom-dark, 12s, 0, linear, infinite; | -webkit-animation: zoom-dark, 12s, 0, linear, infinite; | ||
Line 429: | Line 429: | ||
@-webkit-keyframes zoom-dark { | @-webkit-keyframes zoom-dark { | ||
0% { | 0% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
10% { | 10% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
20% { | 20% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
90% { | 90% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
100% { | 100% { | ||
- | background: # | + | background: #3d4c53; } } |
@-moz-keyframes zoom-dark { | @-moz-keyframes zoom-dark { | ||
0% { | 0% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
10% { | 10% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
20% { | 20% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
90% { | 90% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
100% { | 100% { | ||
- | background: # | + | background: #3d4c53; } } |
@keyframes zoom-dark { | @keyframes zoom-dark { | ||
0% { | 0% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
10% { | 10% { | ||
- | background: # | + | background: #3d4c53; } |
+ | |||
20% { | 20% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
90% { | 90% { | ||
background: #4e5d64; } | background: #4e5d64; } | ||
+ | |||
100% { | 100% { | ||
- | background: # | + | background: #3d4c53; } } |
@-webkit-keyframes zoom { | @-webkit-keyframes zoom { | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
50% { | 50% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
60% { | 60% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 474: | Line 490: | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
50% { | 50% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
60% { | 60% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 485: | Line 505: | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
50% { | 50% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
60% { | 60% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.05; } | opacity: 0.05; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 496: | Line 520: | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
10% { | 10% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
20% { | 20% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 507: | Line 535: | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
10% { | 10% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
20% { | 20% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 518: | Line 550: | ||
0% { | 0% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
10% { | 10% { | ||
opacity: 0.4; } | opacity: 0.4; } | ||
+ | |||
20% { | 20% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
90% { | 90% { | ||
opacity: 0.1; } | opacity: 0.1; } | ||
+ | |||
100% { | 100% { | ||
opacity: 0.4; } } | opacity: 0.4; } } | ||
Line 663: | Line 699: | ||
.landing #Title h1 { | .landing #Title h1 { | ||
font-size: 2.5em; | font-size: 2.5em; | ||
- | line-height: 1em; } | + | line-height: 1em; |
+ | color: white; } | ||
+ | |||
+ | #bodyContent .landing #Title h1 { | ||
+ | font-size: 2.5em; | ||
+ | line-height: 1em; | ||
+ | color: white; } | ||
.notebooks-container .home { | .notebooks-container .home { | ||
color: black; } | color: black; } | ||
.notebooks-container .home .call { | .notebooks-container .home .call { | ||
+ | color: black; | ||
+ | border: 1px black solid; } | ||
+ | |||
+ | #bodyContent .notebooks-container .home { | ||
+ | color: black; } | ||
+ | #bodyContent .notebooks-container .home .call { | ||
color: black; | color: black; | ||
border: 1px black solid; } | border: 1px black solid; } | ||
Line 678: | Line 726: | ||
width: 500px; } | width: 500px; } | ||
#bodyContent .home article h1 { | #bodyContent .home article h1 { | ||
- | font-size: 2.5em; } | + | font-size: 2.5em; |
+ | color: white; } | ||
#bodyContent .home svg { | #bodyContent .home svg { | ||
float: left; } | float: left; } | ||
Line 706: | Line 755: | ||
.landing a.call:hover, .home a.call:hover { | .landing a.call:hover, .home a.call:hover { | ||
background: white; | background: white; | ||
- | color: # | + | color: #3d4c53; } |
.landing a.call:active, .home a.call:active { | .landing a.call:active, .home a.call:active { | ||
top: 1; } | top: 1; } | ||
.notebooks-container { | .notebooks-container { | ||
- | background: # | + | background: #ffe11a; |
width: 1026px; | width: 1026px; | ||
position: relative; } | position: relative; } | ||
Line 722: | Line 771: | ||
#bodyContent .notebooks-container .menu a:hover h2 { | #bodyContent .notebooks-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #ffe11a solid; } |
.notebooks-container .menu a h2 { | .notebooks-container .menu a h2 { | ||
Line 728: | Line 777: | ||
.notebooks-container .menu a:hover h2 { | .notebooks-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #ffe11a solid; } |
.notebooks-container h1, .notebooks-container h2 { | .notebooks-container h1, .notebooks-container h2 { | ||
Line 769: | Line 818: | ||
.multi-container ul li .active { | .multi-container ul li .active { | ||
- | background: # | + | background: #ffe11a; |
font-weight: 500; } | font-weight: 500; } | ||
Line 791: | Line 840: | ||
.multi-container aside li a:hover { | .multi-container aside li a:hover { | ||
- | background: # | + | background: #ffe11a; } |
.multi-container #member-select header { | .multi-container #member-select header { | ||
Line 891: | Line 940: | ||
.team-container { | .team-container { | ||
- | background: # | + | background: #0cdbe8; |
width: 1026px; } | width: 1026px; } | ||
.team-container .menu a:hover h2 { | .team-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #0cdbe8 solid; } |
#bodyContent .team-container .menu a:hover h2 { | #bodyContent .team-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #0cdbe8 solid; } |
#attributions article, #team-members .member, #advisors .member { | #attributions article, #team-members .member, #advisors .member { | ||
Line 930: | Line 979: | ||
padding: 5px; | padding: 5px; | ||
margin: 0 0 0 5px; | margin: 0 0 0 5px; | ||
- | border: 1px solid # | + | border: 1px solid #3d4c53; } |
.project-container { | .project-container { | ||
- | background: # | + | background: #3d4c53; |
width: 1024px; } | width: 1024px; } | ||
.project-container .menu a:hover h2 { | .project-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #3d4c53 solid; } |
#bodyContent .project-container .menu a:hover h2 { | #bodyContent .project-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #3d4c53 solid; } |
#project table { | #project table { | ||
Line 951: | Line 1,000: | ||
padding: 0; } | padding: 0; } | ||
#project table tr .active { | #project table tr .active { | ||
- | background: # | + | background: #ea2e49; |
text-decoration: none; | text-decoration: none; | ||
text-align: center; } | text-align: center; } | ||
#project table tr .active a { | #project table tr .active a { | ||
color: white; } | color: white; } | ||
+ | #project #biobricks table a { | ||
+ | text-decoration: underline; } | ||
#project table tr:nth-child(2n) { | #project table tr:nth-child(2n) { | ||
background-color: #f8f8f8; } | background-color: #f8f8f8; } | ||
Line 963: | Line 1,014: | ||
text-align: left; | text-align: left; | ||
font-weight: bold; | font-weight: bold; | ||
- | padding: | + | padding: 0px 13px; } |
#project table tr td { | #project table tr td { | ||
border: 1px solid #cccccc; | border: 1px solid #cccccc; | ||
margin: 0; | margin: 0; | ||
- | padding: | + | padding: 0px 13px; |
font-size: 0.9em; } | font-size: 0.9em; } | ||
#project table tr th :first-child, #project table tr td :first-child { | #project table tr th :first-child, #project table tr td :first-child { | ||
Line 974: | Line 1,025: | ||
margin-bottom: 0; } | margin-bottom: 0; } | ||
#project table a { | #project table a { | ||
- | color: # | + | color: #3d4c53; } |
#project .graph { | #project .graph { | ||
float: right; | float: right; | ||
Line 983: | Line 1,034: | ||
text-align: center; | text-align: center; | ||
font-family: "Helvetica Neue", Arial, sans-serif; | font-family: "Helvetica Neue", Arial, sans-serif; | ||
- | margin: 0; } | + | margin: 0; |
+ | padding: 0; } | ||
+ | #project #future .direction { | ||
+ | overflow: hidden; | ||
+ | padding: 10px; | ||
+ | margin: 10px 10px 0 0; | ||
+ | float: left; | ||
+ | border: 1px solid #ccc; | ||
+ | width: 280px; } | ||
+ | #project #future .direction h3 { | ||
+ | margin: 5px; | ||
+ | padding: 0; } | ||
+ | #project #results { | ||
+ | background: #eee; | ||
+ | padding: 10px 0; } | ||
+ | #project #results h2 { | ||
+ | padding-top: 10px; | ||
+ | background: white; } | ||
+ | #project #results .graph-description { | ||
+ | width: 300px; | ||
+ | margin: 50px 0; | ||
+ | padding: 10px 10px; | ||
+ | float: left; | ||
+ | border-left: 1px #888 solid; } | ||
+ | #project #results .result-graph { | ||
+ | float: left; } | ||
+ | #project #results .result-graph svg { | ||
+ | margin-right: 20px; } | ||
+ | #project #results .result-graph h3 { | ||
+ | padding-top: 30px; | ||
+ | text-align: center; | ||
+ | margin-bottom: 0; } | ||
+ | #project #model img { | ||
+ | float: right; | ||
+ | border: 1px #ccc solid; | ||
+ | margin: 20px; | ||
+ | padding: 10px; } | ||
+ | #project #model img.formula { | ||
+ | float: none; | ||
+ | display: block; | ||
+ | margin: 0 auto; | ||
+ | clear: both; | ||
+ | border: none; } | ||
#project #design #project-circuit table { | #project #design #project-circuit table { | ||
float: left; | float: left; | ||
Line 1,008: | Line 1,101: | ||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAMAAAC67D+PAAAABlBMVEXW2N7x8fFtFbdeAAAAKUlEQVR42jXKAQoAAAjCQPf/T8egCaEcbcxgA8MkjhcvsVmapBqJgb4PC6kAOLAu0ikAAAAASUVORK5CYII=); } | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAMAAAC67D+PAAAABlBMVEXW2N7x8fFtFbdeAAAAKUlEQVR42jXKAQoAAAjCQPf/T8egCaEcbcxgA8MkjhcvsVmapBqJgb4PC6kAOLAu0ikAAAAASUVORK5CYII=); } | ||
#project #design #project-circuit article .slide-controls a { | #project #design #project-circuit article .slide-controls a { | ||
- | color: # | + | color: #3d4c53; |
float: right; | float: right; | ||
margin: 0 15px 0 0; | margin: 0 15px 0 0; | ||
Line 1,018: | Line 1,111: | ||
#project #design #project-circuit article .slide-controls a:hover { | #project #design #project-circuit article .slide-controls a:hover { | ||
color: white; | color: white; | ||
- | background: # | + | background: #ea2e49; } |
#project #design #project-circuit article .slide-controls a:active { | #project #design #project-circuit article .slide-controls a:active { | ||
color: #000; } | color: #000; } | ||
Line 1,075: | Line 1,168: | ||
stroke: rgba(255, 225, 26, 0.8); } | stroke: rgba(255, 225, 26, 0.8); } | ||
#project #pTEF1 #pTEF1graph-pTEF1, #project #pTEF1_m3 #pTEF1graph-m3, #project #pTEF1_m6 #pTEF1graph-m6, #project #pTEF1_m7 #pTEF1graph-m7, #project #pTEF1_m10 #pTEF1graph-m10 { | #project #pTEF1 #pTEF1graph-pTEF1, #project #pTEF1_m3 #pTEF1graph-m3, #project #pTEF1_m6 #pTEF1graph-m6, #project #pTEF1_m7 #pTEF1graph-m7, #project #pTEF1_m10 #pTEF1graph-m10 { | ||
- | fill: # | + | fill: #98c000; } |
#project #biobricks { | #project #biobricks { | ||
margin-bottom: 20px; } | margin-bottom: 20px; } | ||
Line 1,096: | Line 1,189: | ||
padding: 0 25px; } | padding: 0 25px; } | ||
#project #biobricks article .biobrick-tidbit { | #project #biobricks article .biobrick-tidbit { | ||
- | width: | + | width: 240px; |
padding: 10px 10px; | padding: 10px 10px; | ||
border: 1px #ddd solid; | border: 1px #ddd solid; | ||
Line 1,106: | Line 1,199: | ||
.hp-container { | .hp-container { | ||
- | background: # | + | background: #ea2e49; |
width: 1024px; } | width: 1024px; } | ||
.hp-container .menu a:hover h2 { | .hp-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #ea2e49 solid; } |
#bodyContent .hp-container .menu a:hover h2 { | #bodyContent .hp-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #ea2e49 solid; } |
- | #hp # | + | #hp #super_science { |
position: relative; } | position: relative; } | ||
- | #hp # | + | #hp #super_science img { |
border: 1px solid #ccc; | border: 1px solid #ccc; | ||
padding: 10px; | padding: 10px; | ||
float: right; | float: right; | ||
margin: 10px; } | margin: 10px; } | ||
- | #hp # | + | #hp #super_science ul { |
list-style-position: inside; } | list-style-position: inside; } | ||
- | #hp # | + | #hp #super_science ul li { |
padding: 5px 0; } | padding: 5px 0; } | ||
- | #hp # | + | #hp #super_science #dna-man { |
float: left; | float: left; | ||
shape-outside: polygon(nonzero, 0px 2px, 309px 8px, 359px 38px, 340px 91px, 343px 156px, 318px 212px, 436px 265px, 458px 378px, 454px 475px, 469px 533px, 455px 600px, 462px 674px, 3px 674px); | shape-outside: polygon(nonzero, 0px 2px, 309px 8px, 359px 38px, 340px 91px, 343px 156px, 318px 212px, 436px 265px, 458px 378px, 454px 475px, 469px 533px, 455px 600px, 462px 674px, 3px 674px); | ||
Line 1,141: | Line 1,234: | ||
.judging-container { | .judging-container { | ||
- | background: # | + | background: #98c000; |
width: 1024px; } | width: 1024px; } | ||
.judging-container .menu a:hover h2 { | .judging-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #98c000 solid; } |
#bodyContent .judging-container .menu a:hover h2 { | #bodyContent .judging-container .menu a:hover h2 { | ||
- | border: 1px # | + | border: 1px #98c000 solid; } |
+ | |||
+ | #medal article { | ||
+ | margin: 1em 0; } | ||
+ | #medal article svg { | ||
+ | float: left; } | ||
+ | #medal article ol { | ||
+ | float: left; | ||
+ | width: 750px; } | ||
+ | #medal article ol p { | ||
+ | margin: .2em; } | ||
+ | #medal article ol p.requirement { | ||
+ | border-top: 1px #ccc solid; | ||
+ | font-weight: normal; } | ||
+ | |||
+ | #implications img { | ||
+ | float: right; | ||
+ | padding: 5px; | ||
+ | border: 1px solid #ccc; | ||
+ | margin: 10px; } | ||
h1, h2, h3, h4, h5, h6 { | h1, h2, h3, h4, h5, h6 { | ||
Line 1,216: | Line 1,328: | ||
nav .project a:hover, nav .project .on-page { | nav .project a:hover, nav .project .on-page { | ||
- | background: # | + | background: #3d4c53; } |
nav .judging a:hover, nav .judging .on-page { | nav .judging a:hover, nav .judging .on-page { | ||
- | background: # | + | background: #98c000; } |
nav .hp a:hover, nav .hp .on-page { | nav .hp a:hover, nav .hp .on-page { | ||
- | background: # | + | background: #ea2e49; } |
nav .notebooks a:hover, nav .notebooks .on-page { | nav .notebooks a:hover, nav .notebooks .on-page { | ||
- | background: # | + | background: #ffe11a; } |
nav .team a:hover, nav .team .on-page { | nav .team a:hover, nav .team .on-page { | ||
- | background: # | + | background: #0cdbe8; } |
nav .igem a { | nav .igem a { | ||
Line 1,234: | Line 1,346: | ||
nav .igem a:hover .cogs { | nav .igem a:hover .cogs { | ||
- | fill: # | + | fill: #98c000; |
stroke: none; } | stroke: none; } | ||
Line 1,430: | Line 1,542: | ||
.footer-container { | .footer-container { | ||
- | background: # | + | background: #3d4c53; } |
footer { | footer { | ||
color: white; | color: white; | ||
- | background: # | + | background: #3d4c53; } |
footer h3 { | footer h3 { |
Latest revision as of 07:19, 17 October 2014