"
Team:SYSU-Software/style.css
From 2012.igem.org
Nie1234567 (Talk | contribs) |
Nie1234567 (Talk | contribs) |
||
| Line 10: | Line 10: | ||
} | } | ||
body { | body { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/3/3e/Main-bg.jpg) no-repeat 50% 0 #0f0f0f; |
font-family:Arial, Helvetica, sans-serif; | font-family:Arial, Helvetica, sans-serif; | ||
font-size:100%; | font-size:100%; | ||
| Line 73: | Line 73: | ||
height:527px; | height:527px; | ||
overflow:hidden; | overflow:hidden; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/a/aa/Header-bg.jpg) no-repeat 0 0; |
} | } | ||
#content { | #content { | ||
| - | background:url( | + | background:url(https://2012.igem.org/File:Content-bg.jpg) no-repeat 0 0 #010101; |
padding:34px 57px 46px 59px; | padding:34px 57px 46px 59px; | ||
} | } | ||
| Line 88: | Line 88: | ||
/*---- tailings ----*/ | /*---- tailings ----*/ | ||
.tail-top { | .tail-top { | ||
| - | background:url(images/ | + | background:url(2012.igem.org/wiki/images/5/5b/Tail-top.gif) left top repeat-x; |
padding-top:25px; | padding-top:25px; | ||
} | } | ||
| Line 172: | Line 172: | ||
display:block; | display:block; | ||
float:left; | float:left; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/7/76/Link1-left-bg.gif) no-repeat left top #e2e2e2; |
color:#000; | color:#000; | ||
text-decoration:none; | text-decoration:none; | ||
| Line 180: | Line 180: | ||
.link1 b { | .link1 b { | ||
display:block; | display:block; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/6/6d/Link1-right-bg.gif) no-repeat right top; |
padding:0 19px 0 11px; | padding:0 19px 0 11px; | ||
font-weight:normal; font-style:normal; | font-weight:normal; font-style:normal; | ||
| Line 196: | Line 196: | ||
.line-ver, .line-ver1 { | .line-ver, .line-ver1 { | ||
| - | background-image:url( | + | background-image:url(https://static.igem.org/mediawiki/2012/b/b6/Line-ver.gif); |
background-repeat:repeat-y; | background-repeat:repeat-y; | ||
width:100%; | width:100%; | ||
| Line 212: | Line 212: | ||
} | } | ||
.box .left-bot-corner { | .box .left-bot-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/4/47/Left-bot-corner.gif) no-repeat left bottom; |
width:100%; | width:100%; | ||
} | } | ||
.box .right-bot-corner { | .box .right-bot-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/b/b9/Right-bot-corner.gif) no-repeat right bottom; |
} | } | ||
.box .inner { | .box .inner { | ||
| Line 229: | Line 229: | ||
.box .link1 { | .box .link1 { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/8/8d/Link1-left-alt.gif) no-repeat left top #e2e2e2; |
} | } | ||
.box .link1 b { | .box .link1 b { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/6/60/Link1-right-alt.gif) no-repeat right top; |
} | } | ||
.box .link1:hover { | .box .link1:hover { | ||
| Line 244: | Line 244: | ||
.box1 { | .box1 { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/3/3e/Box1-bg.gif) 0 0 repeat-x #fff; |
width:100%; | width:100%; | ||
} | } | ||
.box1 .left-top-corner { | .box1 .left-top-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/e/ef/Left-top-corner.gif) no-repeat 0 0; |
} | } | ||
.box1 .right-top-corner { | .box1 .right-top-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/b/bd/Right-top-corner.gif) no-repeat 100% 0; |
width:100%; | width:100%; | ||
} | } | ||
.box1 .right-bot-corner { | .box1 .right-bot-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/c/c1/Right-bot-corner-alt.gif) no-repeat 100% 100%; |
} | } | ||
.box1 .left-bot-corner { | .box1 .left-bot-corner { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/b/b8/Left-bot-corner-alt.gif) no-repeat 0 100%; |
width:100%; | width:100%; | ||
} | } | ||
| Line 305: | Line 305: | ||
padding:9px 0 8px 18px; | padding:9px 0 8px 18px; | ||
border-bottom:1px solid #4d4d4d; | border-bottom:1px solid #4d4d4d; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/d/da/Png-point.png) 0 0 no-repeat; |
} | } | ||
#header .nav li a span { | #header .nav li a span { | ||
| Line 315: | Line 315: | ||
#header .nav li a:hover, #header .nav li a.current { | #header .nav li a:hover, #header .nav li a.current { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/f/fb/Nav-bg.png); |
} | } | ||
| Line 335: | Line 335: | ||
left:218px; | left:218px; | ||
top:349px; | top:349px; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/7/72/Title-bg.png) no-repeat 0 0; |
width:298px; | width:298px; | ||
height:56px; | height:56px; | ||
| Line 366: | Line 366: | ||
} | } | ||
#faded ul.controls li a.prev { | #faded ul.controls li a.prev { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/f/fc/Controls.png) no-repeat 0 0; |
} | } | ||
#faded ul.controls li a.prev:hover { | #faded ul.controls li a.prev:hover { | ||
| Line 372: | Line 372: | ||
} | } | ||
#faded ul.controls li a.next { | #faded ul.controls li a.next { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/f/fc/Controls.png) no-repeat 0 -34px; |
} | } | ||
#faded ul.controls li a.next:hover { | #faded ul.controls li a.next:hover { | ||
| Line 380: | Line 380: | ||
#faded .button-alt { | #faded .button-alt { | ||
display:block; | display:block; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/7/7a/Button.gif) no-repeat 0 0; |
width:90px; | width:90px; | ||
height:28px; | height:28px; | ||
| Line 419: | Line 419: | ||
overflow: hidden; | overflow: hidden; | ||
position: relative; | position: relative; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/a/ae/Tab-bg1.gif) no-repeat 0 0; |
width:130px; | width:130px; | ||
height:44px; | height:44px; | ||
| Line 442: | Line 442: | ||
ul.tabs li:hover, html ul.tabs li.active { | ul.tabs li:hover, html ul.tabs li.active { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/e/ed/Tab-bg2.gif) no-repeat 0 0; |
margin-top:0; | margin-top:0; | ||
height:48px; | height:48px; | ||
| Line 471: | Line 471: | ||
} | } | ||
.list1 li { | .list1 li { | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/4/40/Arrow1.gif) no-repeat 6px 12px; |
padding:6px 0 5px 20px; | padding:6px 0 5px 20px; | ||
border-bottom:1px solid #dedede; | border-bottom:1px solid #dedede; | ||
| Line 516: | Line 516: | ||
.banners li { | .banners li { | ||
float:left; | float:left; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/1/14/Divider.gif) no-repeat 100% 0; |
padding:0 22px 0 22px; | padding:0 22px 0 22px; | ||
} | } | ||
| Line 557: | Line 557: | ||
right:57px; | right:57px; | ||
top:-2px; | top:-2px; | ||
| - | background:url( | + | background:url(https://static.igem.org/mediawiki/2012/f/ff/Search-bg.gif) no-repeat 0 0; |
} | } | ||
#search-form fieldset { | #search-form fieldset { | ||
Revision as of 14:37, 14 September 2012
- {
margin:0;
padding:0;
}
html, body {
height:100%;
}
html {
min-width:968px;
}
body {
background:url(
) no-repeat 50% 0 #0f0f0f;
font-family:Arial, Helvetica, sans-serif;
font-size:100%;
line-height:1.25em;
color:#4c4c4c;
}
img { border:0; vertical-align:top; text-align:left; } object { vertical-align:top; outline:none; } ul, ol { list-style:none; }
.fleft { float:left; } .fright { float:right; } .clear { clear:both; }
.col-1, .col-2, .col-3 { float:left; }
.alignright { text-align:right; } .aligncenter { text-align:center; }
.wrapper { width:100%; overflow:hidden; } .container { width:100%; }
/*==== GLOBAL =====*/
- main {
width:968px; margin:0 auto; font-size:.875em; position:relative; }
- header {
height:527px;
overflow:hidden;
background:url(
) no-repeat 0 0;
}
- content {
background:url(https://2012.igem.org/File:Content-bg.jpg) no-repeat 0 0 #010101; padding:34px 57px 46px 59px; }
- footer {
padding:10px 0 60px 75px; background:#010101; }
/*---- tailings ----*/ .tail-top { background:url(2012.igem.org/wiki/images/5/5b/Tail-top.gif) left top repeat-x; padding-top:25px; }
/*----- forms parameters -----*/
input, select, textarea { font-family:Arial, Helvetica, sans-serif; font-size:1em; vertical-align:middle; font-weight:normal; }
/*----- other -----*/
.img-indent {
margin:0 42px 0 0;
float:left;
}
.img-box {
width:100%;
overflow:hidden;
padding-bottom:20px;
}
.img-box img {
float:left;
margin:0 42px 0 0;
}
.extra-wrap { overflow:hidden; }
p {
margin-bottom:20px;
}
.p1 {
margin-bottom:10px;
}
.p2 {
margin-bottom:20px;
}
.p3 {
margin-bottom:30px;
}
/*----- txt, links, lines, titles -----*/ a { color:#4a4a4a; outline:none; } a:hover{ text-decoration:none; }
h1 { position:absolute; left:59px; top:36px; font-size:83px; line-height:1.2em; color:#fff; font-weight:normal; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; letter-spacing:-2px; } h1 a { color:#fff; text-decoration:none; } h2 { font-size:24px; line-height:1.2em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal; color:#000; margin-bottom:14px; padding-top:6px; }
.link1 {
display:block;
float:left;
background:url(
) no-repeat left top #e2e2e2;
color:#000;
text-decoration:none;
font-size:10px;
text-transform:uppercase;
}
.link1 b {
display:block;
background:url(
) no-repeat right top;
padding:0 19px 0 11px;
font-weight:normal; font-style:normal;
line-height:28px;
}
.link1:hover { background:url(images/link1-left-bg.gif) no-repeat left -28px #474747; color:#fff; } .link1:hover b { background-position:100% -28px; }
.line-ver, .line-ver1 {
background-image:url(
);
background-repeat:repeat-y;
width:100%;
}
/*==================boxes====================*/
.box {
background:#f7f7f7;
width:100%;
border-top:1px solid #e5e5e5;
font-size:13px;
line-height:18px;
color:#7e7e7e;
}
.box .left-bot-corner {
background:url(
) no-repeat left bottom;
width:100%;
}
.box .right-bot-corner {
background:url(
) no-repeat right bottom;
}
.box .inner {
padding:23px 28px 40px 35px;
}
.box p {
margin-bottom:18px;
}
.box strong {
color:#4a4a4a;
}
.box .link1 {
background:url(
) no-repeat left top #e2e2e2;
}
.box .link1 b {
background:url(
) no-repeat right top;
}
.box .link1:hover {
background:url(images/link1-left-alt.gif) no-repeat left -28px #474747;
}
.box .link1:hover b {
background-position:100% -28px;
}
.box1 {
background:url(
) 0 0 repeat-x #fff;
width:100%;
}
.box1 .left-top-corner {
background:url(
) no-repeat 0 0;
}
.box1 .right-top-corner {
background:url(
) no-repeat 100% 0;
width:100%;
}
.box1 .right-bot-corner {
background:url(
) no-repeat 100% 100%;
}
.box1 .left-bot-corner {
background:url(
) no-repeat 0 100%;
width:100%;
}
.box1 .inner {
padding:27px 28px 40px 35px;
}
.address { float:left; } .address dd { clear:both; text-align:right; } .address dd span { float:left; padding-right:20px; } .address dd a { color:#4a4a4a; }
/*===== header =====*/
- header .nav {
position:absolute;
left:59px;
top:176px;
width:268px;
border-top:1px solid #4d4d4d;
}
#header .nav li {
width:100%;
overflow:hidden;
vertical-align:top;
}
#header .nav li a {
display:block;
font-size:26px;
line-height:1.2em;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#fff;
text-decoration:none;
padding:9px 0 8px 18px;
border-bottom:1px solid #4d4d4d;
background:url(
) 0 0 no-repeat;
}
#header .nav li a span {
display:block;
color:#525252;
font-size:17px;
line-height:1.2em;
}
#header .nav li a:hover, #header .nav li a.current {
background:url(
);
}
/*--- faded slider ---*/
- faded {
width:566px; height:504px; position:absolute; left:379px; top:23px; overflow:hidden; }
- faded ul { list-style:none; padding:0; margin:0; }
#faded li strong {
display:block;
position:absolute;
left:218px;
top:349px;
background:url(
) no-repeat 0 0;
width:298px;
height:56px;
font-size:45px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#fff;
line-height:48px;
text-align:center;
font-weight:normal;
letter-spacing:-2px;
}
- faded ul.controls {
position:absolute;
right:34px;
top:153px;
width:46px;
height:68px;
}
#faded ul.controls li {
width:100%;
overflow:hidden;
vertical-align:top;
}
#faded ul.controls li a {
display:block;
width:46px;
height:34px;
overflow:hidden;
}
#faded ul.controls li a.prev {
background:url(
) no-repeat 0 0;
}
#faded ul.controls li a.prev:hover {
background-position:0 -68px;
}
#faded ul.controls li a.next {
background:url() no-repeat 0 -34px;
}
#faded ul.controls li a.next:hover {
background-position:0 -102px;
}
- faded .button-alt {
display:block;
background:url(
) no-repeat 0 0;
width:90px;
height:28px;
line-height:28px;
text-transform:uppercase;
color:#000;
text-align:center;
font-size:10px;
text-decoration:none;
text-indent:-7px;
position:absolute;
bottom:62px;
right:85px;
}
- faded .button-alt:hover {
text-decoration:underline; }
/*===== content =====*/
/*--- tabs ---*/
ul.tabs {
margin: 0;
padding: 0;
float: left;
list-style: none;
height: 48px; /*--Set height of tabs--*/
padding:0 0 0 0;
position:relative;
float:right;
}
ul.tabs li {
float: left;
border-left: none;
overflow: hidden;
position: relative;
background:url(
) no-repeat 0 0;
width:130px;
height:44px;
line-height:44px;
font-size:14px;
color:#fff;
text-align:center;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
margin:4px 0 0 4px;
}
ul.tabs li.first {
margin-left:0;
}
ul.tabs li a {
text-decoration: none;
color: #fff;
display: block;
}
html ul.tabs li.active a {
color:#000;
}
ul.tabs li:hover, html ul.tabs li.active {
background:url(
) no-repeat 0 0;
margin-top:0;
height:48px;
color:#000;
line-height:48px;
}
ul.tabs li:hover a {
color:#000;
}
.tab_container { overflow: hidden; clear: both; float: left; width: 100%; background: #fff; min-height:305px; height:auto !important; height:305px; } .tab_content { padding: 35px 30px 32px 35px; } /*--- tabs ---*/
.list1 {
padding-bottom:20px;
}
.list1 li {
background:url(
) no-repeat 6px 12px;
padding:6px 0 5px 20px;
border-bottom:1px solid #dedede;
font-size:13px !important;
}
.list1 li.last {
border-bottom:none;
}
.list1 li a {
color:#4a4a4a;
text-decoration:none;
}
.list1 li a:hover {
color:#000;
text-decoration:underline;
}
.products-list li {
width:100%;
overflow:hidden;
border-bottom:1px solid #dcdcdc;
padding:12px 0 12px 0;
color:#4a4a4a;
}
.products-list li.last {
border-bottom:none;
margin-bottom:0;
}
.products-list li img {
float:left;
margin-right:30px;
}
.products-list li p {
margin-bottom:12px;
}
.banners {
width:100%;
overflow:hidden;
padding:44px 0 0 0;
}
.banners li {
float:left;
background:url(
) no-repeat 100% 0;
padding:0 22px 0 22px;
}
.banners li.last {
background:none;
padding-right:0;
}
.testimonials li {
text-align:right;
padding-bottom:18px;
}
.testimonials li blockquote {
text-align:left;
}
/*===== footer =====*/
- footer {
font-size:10px; text-transform:uppercase; color:#4a4a4a; } #footer a { color:#fff; text-decoration:none; } #footer a:hover { text-decoration:underline; }
/*----- forms -----*/
- search-form {
position:absolute;
width:190px;
height:25px;
right:57px;
top:-2px;
background:url(
) no-repeat 0 0;
}
#search-form fieldset {
border:none;
}
#search-form input.text {
width:135px;
border:none;
background:none;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:13px;
color:#7f7f7f;
padding:0 0 6px 21px;
font-style:italic;
line-height:16px;
}
#search-form input.submit {
border:none;
background:none;
width:33px;
height:25px;
cursor:pointer;
}
- contacts-form fieldset {
border:none; } #contacts-form label { display:block; height:32px; overflow:hidden; } #contacts-form input { background:#fff; width:210px; padding:2px 5px 2px 6px; border:none; border:1px solid #e1e1e1; color:#7e7e7e; border-color:#303030 #cecece #e1e1e1 #585858; } #contacts-form textarea { width:210px; padding:2px 5px 2px 6px; height:104px; background:#fff; overflow:auto; border:1px solid #e1e1e1; border-color:#303030 #cecece #e1e1e1 #585858; color:#7e7e7e; margin-bottom:17px; } #contacts-form .link1 { float:right; margin-left:10px; }
/*==========================================*/
