Team:SYSU-Software/style.css

From 2012.igem.org

(Difference between revisions)
Line 10: Line 10:
}
}
body {  
body {  
-
background:url(images/main-bg.jpg) no-repeat 50% 0 #0f0f0f;  
+
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(images/header-bg.jpg) no-repeat 0 0;
+
background:url(https://static.igem.org/mediawiki/2012/a/aa/Header-bg.jpg) no-repeat 0 0;
}
}
#content {
#content {
-
background:url(images/content-bg.jpg) no-repeat 0 0 #010101;
+
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/tail-top.gif) left top repeat-x;
+
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(images/link1-left-bg.gif) no-repeat left top #e2e2e2;
+
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(images/link1-right-bg.gif) no-repeat right top;  
+
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(images/line-ver.gif);  
+
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(images/left-bot-corner.gif) no-repeat left bottom;
+
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(images/right-bot-corner.gif) no-repeat right bottom;
+
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(images/link1-left-alt.gif) no-repeat left top #e2e2e2;
+
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(images/link1-right-alt.gif) no-repeat right top;
+
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(images/box1-bg.gif) 0 0 repeat-x #fff;
+
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(images/left-top-corner.gif) no-repeat 0 0;
+
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(images/right-top-corner.gif) no-repeat 100% 0;
+
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(images/right-bot-corner-alt.gif) no-repeat 100% 100%;
+
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(images/left-bot-corner-alt.gif) no-repeat 0 100%;
+
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(images/png-point.png) 0 0 no-repeat;
+
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(images/nav-bg.png);
+
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(images/title-bg.png) no-repeat 0 0;
+
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(images/controls.png) no-repeat 0 0;
+
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(images/controls.png) no-repeat 0 -34px;
+
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(images/button.gif) no-repeat 0 0;
+
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(images/tab-bg1.gif) no-repeat 0 0;
+
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(images/tab-bg2.gif) no-repeat 0 0;
+
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(images/arrow1.gif) no-repeat 6px 12px;
+
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(images/divider.gif) no-repeat 100% 0;
+
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(images/search-bg.gif) no-repeat 0 0;
+
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(Main-bg.jpg) 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 =====*/

  1. main {

width:968px; margin:0 auto; font-size:.875em; position:relative; }

  1. header {

height:527px; overflow:hidden; background:url(Header-bg.jpg) no-repeat 0 0; }

  1. content {

background:url(https://2012.igem.org/File:Content-bg.jpg) no-repeat 0 0 #010101; padding:34px 57px 46px 59px; }

  1. 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(Link1-left-bg.gif) no-repeat left top #e2e2e2; color:#000; text-decoration:none; font-size:10px; text-transform:uppercase; } .link1 b { display:block; background:url(Link1-right-bg.gif) 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(Line-ver.gif); 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(Left-bot-corner.gif) no-repeat left bottom; width:100%; } .box .right-bot-corner { background:url(Right-bot-corner.gif) no-repeat right bottom; } .box .inner { padding:23px 28px 40px 35px; } .box p { margin-bottom:18px; } .box strong { color:#4a4a4a; }

.box .link1 { background:url(Link1-left-alt.gif) no-repeat left top #e2e2e2; } .box .link1 b { background:url(Link1-right-alt.gif) 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(Box1-bg.gif) 0 0 repeat-x #fff; width:100%; } .box1 .left-top-corner { background:url(Left-top-corner.gif) no-repeat 0 0; } .box1 .right-top-corner { background:url(Right-top-corner.gif) no-repeat 100% 0; width:100%; } .box1 .right-bot-corner { background:url(Right-bot-corner-alt.gif) no-repeat 100% 100%; } .box1 .left-bot-corner { background:url(Left-bot-corner-alt.gif) 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 =====*/

  1. 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(Png-point.png) 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(Nav-bg.png); }

/*--- faded slider ---*/

  1. faded {

width:566px; height:504px; position:absolute; left:379px; top:23px; overflow:hidden; }

  1. faded ul { list-style:none; padding:0; margin:0; }

#faded li strong { display:block; position:absolute; left:218px; top:349px; background:url(Title-bg.png) 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; }

  1. 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(Controls.png) no-repeat 0 0; } #faded ul.controls li a.prev:hover { background-position:0 -68px; } #faded ul.controls li a.next { background:url(Controls.png) no-repeat 0 -34px; } #faded ul.controls li a.next:hover { background-position:0 -102px; }

  1. faded .button-alt {

display:block; background:url(Button.gif) 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; }

  1. 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(Tab-bg1.gif) 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(Tab-bg2.gif) 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(Arrow1.gif) 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(Divider.gif) 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 =====*/

  1. footer {

font-size:10px; text-transform:uppercase; color:#4a4a4a; } #footer a { color:#fff; text-decoration:none; } #footer a:hover { text-decoration:underline; }


/*----- forms -----*/

  1. search-form {

position:absolute; width:190px; height:25px; right:57px; top:-2px; background:url(Search-bg.gif) 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; }

  1. 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; }

/*==========================================*/