"
Team:NCTU Formosa/css/style
From 2013.igem.org
| Line 20: | Line 20: | ||
} | } | ||
#toc { | #toc { | ||
| - | |||
position: fixed; | position: fixed; | ||
} | } | ||
| - | #toc | + | #toc { |
| - | + | border: 0!important; | |
| - | + | background: none!important; | |
} | } | ||
| + | #toctitle, .toclevel-1>a { | ||
| + | display:none; | ||
| + | } | ||
| + | #toc ul ul ul, .toc ul ul ul, #toc ul ul ul ul, .toc ul ul ul ul { | ||
| + | margin: 0px 0px 0px 5px!important; | ||
| + | } | ||
| + | #toc ul ul, .toc ul ul { | ||
| + | margin: 0!important; | ||
| + | } | ||
| + | td>ul { | ||
| + | position:relative; | ||
| + | background:#fff; | ||
| + | width:250px; | ||
| + | margin:auto; | ||
| + | padding:0; | ||
| + | list-style: none; | ||
| + | overflow:hidden; | ||
| + | |||
| + | -webkit-border-radius: 5px; | ||
| + | -moz-border-radius: 5px; | ||
| + | border-radius: 5px; | ||
| + | |||
| + | -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); | ||
| + | -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); | ||
| + | box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); | ||
| + | } | ||
| + | |||
| + | td ul li a { | ||
| + | width:225px; | ||
| + | padding-left:20px; | ||
| + | height:50px; | ||
| + | line-height:50px; | ||
| + | display:block; | ||
| + | overflow:hidden; | ||
| + | position:relative; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | font-size:14px; | ||
| + | color:#686868!important; | ||
| + | font-family:Quicksand; | ||
| + | font-weight:700; | ||
| + | -webkit-transition:all 0.2s linear; | ||
| + | -moz-transition:all 0.2s linear; | ||
| + | -o-transition:all 0.2s linear; | ||
| + | transition:all 0.2s linear; | ||
| + | } | ||
| + | .tocnumber { | ||
| + | margin-right:10px; | ||
| + | } | ||
| + | td ul li a:hover { | ||
| + | background:#efefef; | ||
| + | text-decoration:none; | ||
| + | } | ||
| + | |||
| + | td ul li:nth-child(4n+1) a { | ||
| + | border-left:5px solid #008747; | ||
| + | } | ||
| + | |||
| + | td ul li:nth-child(4n+2) a { | ||
| + | border-left:5px solid #fecf54; | ||
| + | } | ||
| + | |||
| + | td ul li:nth-child(4n+3) a { | ||
| + | border-left:5px solid #cf2130; | ||
| + | } | ||
| + | |||
| + | td ul li:nth-child(4n) a { | ||
| + | border-left:5px solid #dde2d5; | ||
| + | } | ||
| + | |||
| + | td ul li.selected a { | ||
| + | background:#efefef; | ||
| + | } | ||
* { | * { | ||
margin:0; | margin:0; | ||
Revision as of 17:53, 29 August 2013
/* ---Calvin Hue
- /
- p-logo, #search-controls, #top-section, #contentSub, #footer-box, .firstHeading, #catlinks {
display: none; }
- content {
background: transparent; padding: 0; width: 100%; border: 0px; line-height:normal!important; }
- globalWrapper {
font-size:100%!important; padding:0!important; } p { margin: 0px!important; }
- toc {
position: fixed; }
- toc {
border: 0!important; background: none!important; }
- toctitle, .toclevel-1>a {
display:none; }
- toc ul ul ul, .toc ul ul ul, #toc ul ul ul ul, .toc ul ul ul ul {
margin: 0px 0px 0px 5px!important;
}
- toc ul ul, .toc ul ul {
margin: 0!important;
} td>ul { position:relative; background:#fff; width:250px; margin:auto; padding:0; list-style: none; overflow:hidden;
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
-webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1); }
td ul li a { width:225px; padding-left:20px; height:50px; line-height:50px; display:block; overflow:hidden; position:relative; text-decoration:none; text-transform:uppercase; font-size:14px; color:#686868!important; font-family:Quicksand; font-weight:700; -webkit-transition:all 0.2s linear; -moz-transition:all 0.2s linear; -o-transition:all 0.2s linear; transition:all 0.2s linear; } .tocnumber { margin-right:10px; } td ul li a:hover { background:#efefef; text-decoration:none; }
td ul li:nth-child(4n+1) a { border-left:5px solid #008747; }
td ul li:nth-child(4n+2) a { border-left:5px solid #fecf54; }
td ul li:nth-child(4n+3) a { border-left:5px solid #cf2130; }
td ul li:nth-child(4n) a { border-left:5px solid #dde2d5; }
td ul li.selected a { background:#efefef; }
- {
margin:0; padding:0; } .clear { clear: both; } html, body { height:100%; margin:0; padding:0; } body { background:#f0f0f0; color:#3c3c3c; font:14px helvetica, arial, Sans-serif; overflow-x:hidden; } a { text-decoration:none; } a img { border: none; } ul, li { margin:0; padding:0; }
- header-wrapper {
position: fixed;
z-index:9;
top:0px;
width:100%;
height:56px;
background:url(
) transparent repeat-x;
margin:0;
padding:0 0 0 0;
-moz-box-shadow:0px 0px 15px 4px rgba(20%,20%,40%,0.7);
-webkit-box-shadow:0px 0px 15px 4px rgba(20%,20%,40%,0.7);
box-shadow:0px 0px 15px 4px rgba(20%,20%,40%,0.7);
overflow: visible;
}
- header{
width:100%; max-width:1200px; height:56px; margin:0 auto; overflow: visible; }
- title {
width:192px; height:56px; text-indent:-9999px; margin-left: 30px; }
- title a {
display:block;
background:url(
) transparent top left no-repeat;
width:192px;
height:56px;
text-indent:-9999px;
opacity: 0.85;
-webkit-transition: .7s;
-moz-transition: .7s;
-o-transition: .7s;
-ms-transition: .7s;
transition: .7s;
}
- title a:hover {
opacity:1; } h3 span.mw-headline { padding-top: 70px; }
- main-wrapper {
float:left; width:100%; min-height:100%; margin:0 auto; margin-top: -12px; padding:0 0 0 0; background:#e4e4e4; border-bottom:1px solid #888888; -moz-box-shadow:0px 0px 12px 2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:0px 0px 12px 2px rgba(20%,20%,40%,0.5); box-shadow:0px 0px 12px 2px rgba(20%,20%,40%,0.5); }
- main {
float:left; width: 100%; height:100%; padding: 0px; margin:0 auto; }
- footer-wrapper {
width:100%; margin:0 auto; }
- footer {
padding-right:50px; }
- footer-text {
margin-top: 10px; margin-bottom: 20px; text-align: right; font-size:9px; } .author { display:none; }
- cover {
height: 100%; min-width: 800px; height: 500px; background-size: cover!important; margin:auto 0;
-moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000;
position:relative; }
- coverbox {
position:absolute; bottom:0; margin-left:50px; margin-right:50px; }
- cover h2 {
color:white; font-family: Lobster Two; font-size: 60px; font-weight: bold; }
- cover p {
color:white; font-family: Open Sans; font-size: 20px; margin-top: 20px!important; margin-bottom: 20px!important; }
- content-wrapper {
width: 100%; margin:0; padding:0; }
- realcontent {
padding-left:50px; padding-right:50px; margin:auto 0; }
- crw{
float: left; width:100%; }
- cr{
margin-left: 300px; min-width: 300px; }
- cl{
float: left; width: 300px; margin-left:-100%; } ul.side { width: 300px; height: 100%; float: left; padding: 0; } ul.side li { width: 280px; float: left; list-style: none; padding: 10px; } div.cont { z-index:2; width: 100%; height: 100%; float: right; padding: 0; } div.cont .li { width: 100%; float: left; list-style: none; padding: 10px; } div.card { background: #fff; position: relative; padding: 15px; box-shadow: 0px 3px rgba( 0, 0, 0, 0.1 ); font-family: Open Sans; color: #444; font-size: 14px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } ul.side div.card { width: 250px; } div.card p { margin: 0 0 15px 0!important; } div.card h3 { font-size: 28px; } div.card span.url { border-top: 1px solid #e5e5e5; background-image: url('https://static.igem.org/mediawiki/2013/9/91/Nctu-url.png'); background-repeat: no-repeat; padding: 6px 0 0 30px; height: 30px; display: block; margin-bottom: -10px!important; } div.card span.url a { color: #38c04b; text-decoration: none; top: 4px; width: 250px; display: block; position: relative; } div.card img { width: 100%; }
