Team:SYSU-Software/style.css
From 2012.igem.org
body{background: none repeat scroll 0% 0% rgb(249, 247, 245); color: rgb(68, 68, 68);}
- logopic{top: 14px; left: 40px; width:800px;position: absolute ; margin: auto ;}
.aligncenter {
display: block; margin-left: auto; margin-right: auto; }
.alignleft { float: left; } .alignright { float: right; }
/*
*/
.sysu-title { background-color:#545454; background-image:url('https://static.igem.org/mediawiki/2012/b/b6/Header_v8.png' ) ; background-position:0 20px; background-repeat:no-repeat; display:block; padding-top:100px; }
.reminderfox-mascot { display:block; float:right; margin-right:26px; margin-top:-135px; }
.uniblue-ad { -moz-border-radius:10px 10px 10px 10px; background:none repeat scroll 0 0 #D3D3D3; border-color:#CCCCCC; border-style:solid; border-width:1px 3px 3px 1px; padding-left:10px; width:279px; color:#000000; font:140%/1.6em Arial,Helvetica,Sans-serif; padding: 10px; margin-bottom: 10px; margin-top: 10px; }
- doctitle {
border-bottom:1px solid #BBBBBB !important; font-weight:bold; padding-bottom:0.4em; }
.doc-toc { border:1px solid #AAAAAA; font-size:95%; margin:10px 0; border-collapse:collapse; border-spacing:0; }
.doc-toc td {
padding:8px;
}
.doc-toc #toctitle { margin:3px 0 8px;
}
.doc-toc ul { list-style-image:none; list-style-type:none; margin-left:0; padding-left:0; text-align:left; }
.doc-toc li { font-size:13px; font-weight:normal; line-height:1.5 !important; margin:0.5em 0 !important; }
.doc-toc a { text-decoration:underline; }
- doc-nav {
-moz-border-radius:0.5em 0.5em 0.5em 0.5em; border:1px solid #CCCCCC; padding:5px 15px 15px; }
- doc-nav h5 {
background:none repeat scroll 0 0 #E3E0D5; color:#192839; font-size:1.2em; font-weight:bold; margin:2em 0 0.4em; padding:0.3em 10px; text-transform:uppercase; }
- doc-nav ul {
list-style:none outside none; margin:0; }
- doc-nav li {
margin:0; padding:0; }
- doc-nav li a {
border-bottom:1px solid #EEEEEE; display:block; font-size:1.2em; line-height:1.4; margin:0; padding:0.2em 10px; position:relative; text-decoration:none; }
- doc-contents ul li {
background:none repeat scroll 0 0 transparent; }
- toc-ul li {
background:none repeat scroll 0 0 transparent; padding:0; }
- toc-ul a {
font-weight: normal; }
- toctitle h2 {
padding: 0; }
- doc-main-page ul li {
background: url("/images/bullet.gif") no-repeat scroll 0 0.3em transparent }
- little-boy{
display: block; float: right; margin-right: 5px; margin-top: -135px;} }
- blank{ height: 10px ; top: 10px ;}
body {
font: 62.5% Arial,Helvetica,Sans-serif; color: #444; line-height: 2.2em; background: #F9F7F5; min-width: 960px; text-align: center;
} a:visited { color: #4265A7; } a:link { color: #4265A7; } .entry a:visited { font-weight: bold; } .entry a:link { font-weight: bold; } a:hover { color: #993333; }
/*Basic Structure
*/
.wrapper{
width: 960px; margin: 10px auto; text-align: left;
}
- content{
float: left; width: 648px; padding: 0 0 30px 0; margin: 20px 0 0 0
} .content-background { background: url(../images/content-background.gif) repeat-x top left;
}
- sidebar {
float: right; padding-bottom: 30px; width: 266px;
}
- footer {
clear: both; padding-top: 5px; border-top: 1px solid #ddd;
} li.comment:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;} div.skip-content { display: none; }
/*Header
*/
- header {
width: 100%; border-bottom: 1px solid #EDE7E0; background: #443B31 url(../images/nav-background.gif) repeat-x bottom left;
}
- follow {
background: #2F2922; padding: 5px 0;
}
- follow dl {
float: right; font-size: 1.3em;
}
- follow dl dd { float: left; }
- follow dl dt { float: left; }
- follow dt {
font-weight: bold; color: #AD9B83;
}
- follow dd { margin-left: 20px; }
- follow dd a {
display: block; color: #cfc4b6;
}
- follow dd a.rss { padding-left: 20px; background: url(../images/feed-icon.png) no-repeat 0 .2em; }
- follow dd a.email { padding-left: 22px; background: url(../images/email-icon.png) no-repeat 0 .35em; }
- follow dd a.twitter { padding-left: 19px; background: url(../images/twitter-icon.png) no-repeat 0 .15em; }
div#title {
float: left; padding: 30px 0; font-size: 3em; font-weight: bold; line-height: 50px;
} h1#title {
float: left; padding: 30px 0; font-size: 3em; font-weight: bold; line-height: 50px;
} div#title a:visited { color: #E9E5E0; } div#title a:link { color: #E9E5E0; } h1#title a:visited { color: #E9E5E0; } h1#title a:link { color: #E9E5E0; } div#title a:hover { text-decoration: none; }
h1#title a:hover { text-decoration: none; }
/*Description
*/
- description {
margin: 35px 0 0 40px; float: left; color: #796957; font-size: 1.4em; font-weight: bold; line-height: 50px;
}
/*Nav
*/
- nav {
width:100%; font-size: 1.3em;
}
- nav ul {
float: left; line-height: 40px; padding: 0; margin: 0; width: 100%;
}
- nav {
float: left; line-height: 40px; padding: 0; margin: 0; width: 100%;
}
/*Notice
*/
div.notice {
display: block; padding: 20px 0; font-size: 1.6em;
} div.notice strong { color: #2F2922; } div.notice div {
margin: 10px 0; padding: 20px; background: #F0EBE6 url(../images/notice-background.gif) repeat-x top left;
} div.notice div h2 {
font-size: 1.3em; margin-bottom: 10px;
}
/*Page/Post Styling
*/
.post { margin-bottom: 30px;} /*Post Header
*/
.post-header {
border-top: 1px solid #EFEAE4; margin: 0 0 15px 0; padding-top: 20px;
} .post-header h2 {
font-size: 2em; line-height: 1.1em; margin-left: 131px;
} div.post-header div.date {
float: left; width: 114px; color: #beaa99; font-size: 1.5em; text-transform: uppercase; font-weight: bold; padding: 0 0 0 17px; background: url(../images/icon-calendar.png) no-repeat 0 .3em;
} .date span { color: #E0C9B5; } .author {
margin: 3px 0 0 131px; color: #C0B2A5; font-size: 1.2em;
} /*Post Body
*/
.entry {
margin: 0 0 0 131px; width: 497px; font-size: 1.3em;
} .entry p { margin-bottom: 10px; } .entry h4 {
font-size: 1.3em; padding: 15px 0 5px 0;
} .entry h3 {
font-size: 1.3em; padding: 15px 0 5px 0;
} .entry h2 {
font-size: 1.3em; padding: 15px 0 5px 0;
} .entry h3 {
padding-top: 10px; font-size: 1em;
} .entry h6 {
padding-top: 10px; font-size: .9em;
} .entry h5 {
padding-top: 10px; font-size: .9em;
} .entry h4 {
padding-top: 10px; font-size: .9em;
} pre {
margin: 10px 0; padding: 1em 10px; overflow: auto; background-color: #E9EBD9; color: #000;
} code {
padding: 2px 3px; font: 1.1em Consolas, Courier New, sans-serif; background-color: #E9EBD9; color: #000;
} pre code { font-size: 1.3em; } blockquote {
display: block; margin: 20px 0 20px 20px; padding: 0 0 0 20px; border-left: 3px solid #CBCAC8; color: #666; font-style: italic; line-height: 1.5em;
} .c-body ul { margin: 0 0 10px 10px; } .entry ul { margin: 0 0 10px 10px; } .c-body ul li {
display: block; margin: 5px 0; padding: 0 0 0 17px; background: url(../images/list-item.gif) no-repeat 0 .3em;
} .entry ul li {
display: block; margin: 5px 0; padding: 0 0 0 17px; background: url(../images/list-item.gif) no-repeat 0 .3em;
} .c-body ol {
list-style-type: decimal; list-style-position: inside; margin: 5px 0 5px 10px;
} .entry ol {
list-style-type: decimal; list-style-position: inside; margin: 5px 0 5px 10px;
} .c-body ol li ol li { list-style-type: lower-roman; } .entry ol li ol li { list-style-type: lower-roman; } .c-body ol li { margin: 5px 0; } .entry ol li { margin: 5px 0; } .navigation {
padding: 10px 0; font-size: 1.3em;
} .index { padding: 0; } /*Post Footer
*/
.post-footer { margin-left: 131px; } .comments a {
display: block; padding: 0 0 0 17px; color: #B79F87; font-size: 1.2em; background: url(../images/icon-comments.png) no-repeat 0 .4em;
} .comments a:hover {
color: #453729; text-decoration: none;
} .comments span {
font-size: 1.3em; font-style: italic;
} /*Single
*/
.tags {
float: left; width: 104px;
} .tags span {
display: block; font-size: 1.5em; font-weight: bold; text-transform: uppercase; color: #beaa99; padding: 0 0 10px 28px; background: url(../images/icon-tags.png) no-repeat 0 .3em;
} .tags p {
font-size: 1.2em; line-height: 1.4em; color: #beaa99;
} .tags a {
color: #beaa99; }
.post-header h1 {
margin-left: 131px; padding-bottom: 4px; font-size: 2.2em; }
.meta {
border-top: 1px solid #EFEAE4; margin-top: 10px; padding-top: 5px; font-size: 1.2em; text-align: right; color: #666;
} /*Comments
*/
/*Top
*/
.comment-number {
display: block; padding: 30px 0 5px 0; font-weight: bold;
} .comment-number span {
font-size: 1.3em; color: #777;
} .none { border-bottom: 1px solid #EFEAE4; } a#leavecomment {
font-size: 1.6em; padding-left: 2px;
} /*Body
*/
li.comment {
padding-top: 20px; border-top: 1px solid #EFEAE4;
} li.comment.depth-2 { margin-bottom: 10px; }
- comments ul.children {
margin: 10px 0 0 131px; clear: both;
} div.c-grav {
float: left; width: 40px; margin: 0; text-align: right;
} div.c-grav img {
padding: 4px; border: 1px solid #E6E1DB; border-right-color: #D6D1CC; border-bottom-color: #D6D1CC; background: #fff;
} div.c-body {
margin-left: 131px; width: 497px; font-size: 1.3em;
} ul.children div.c-body { margin-left: 70px; width: 427px; } div.c-body p { margin-bottom: 10px; } div.c-head {
margin: 0 0 10px 0; font-weight: bold;
} .c-permalink a:visited {
color: #777; font-size: .7em;
} .c-permalink a:link {
color: #777; font-size: .7em;
} div.reply { padding-bottom: 10px; } div.reply a:visited { color: #beaa99; } div.reply a:link { color: #beaa99; } /*Form
*/
form#commentform { margin: 0 0 20px 131px; }
- respond { font-size: 1.3em; }
h4#postcomment {
margin: 20px 0; padding: 5px 0 0 0; color: #555; border-top: 1px solid #EFEAE4;
} form#commentform label.comment-field {
display: block; margin: 10px 0 3px 0; font-size: 1.1em;
} form#commentform textarea {
padding: 7px 3px; background: #fff; font-family: inherit; border: 1px solid #E6E1DB; border-right-color: #D6D1CC; border-bottom-color: #D6D1CC; width: 477px;
} input.text-input {
padding: 7px 3px; background: #fff; font-family: inherit; border: 1px solid #E6E1DB; border-right-color: #D6D1CC; border-bottom-color: #D6D1CC; width: 477px;
} input#url { width: 300px; } input#email { width: 300px; } input#author { width: 300px; } form#commentform textarea:focus { background: #fff; } form#commentform input:focus { background: #fff; } form#commentform input#submit {
padding: 5px; width: 150px;
} form#commentform p.guidelines {
margin: 10px 0; color: #555;
} p.comments-rss{ margin: 0 0 10px 0; } p.subscribe-to-comments{ margin: 0 0 10px 0; } p.comments-rss a {
font-size: 1.1em; padding: 0 0 0 19px; background: url(../images/feed-icon.png) no-repeat 0 .1em;
} fieldset { border: none; } /*Note
*/
p.note {
font-style: italic; font-size: 1.3em;
} /*Pingbacks/Trackbacks
*/
h3.pinghead {
font-size: 1.3em; color: #444444;
} ol.pinglist {
list-style-type: decimal; list-style-position: inside; margin: 0 0 10px 10px; font-size: 1.3em;
}
/*Pages
*/
- content .entry.page {
margin: 0; width: 628px;
} h2.pagetitle {
border-top: 1px solid #EFEAE4; margin: 0 0 15px 0; padding-top: 20px; font-size: 2.2em;
} h1.pagetitle {
border-top: 1px solid #EFEAE4; margin: 0 0 15px 0; padding-top: 20px; font-size: 2.2em;
} /*Archives List
*/
.entries ul {
font-size: 1.3em;
} .entries ul li {
line-height: 2.5em; border-bottom: 1px dashed #DFDAD5;
} .entries span {
margin-right: 20px; color: #777;
} /*Sidebar
*/
- sidebox { font-size: 1.2em; }
- sidebox p {
margin-bottom: 15px; line-height: 1.6em;
}
- sidebox img {
padding: 14px; border: 1px solid #E6E1DC; background: #F0EBE6;
} h2.widgettitle {
margin: 25px 0 10px 0; padding-bottom: 3px; font-size: 1.4em; border-bottom: 1px solid #DFDAD5; color: #555;
} ul li.widget ul { font-size: 1.2em; } ul li.widget ul li ul {
margin-left: 5px; font-size: 1em;
} ul li.widget ul li { padding: 1px 0; } ul li.widget ul li ul li { padding: 1px 0 0 0; }
/*Adbox
*/
- adbox {
margin: 20px 0; padding: 3px; border: 1px solid #E6E1DC; background: #F0EBE6;
}
- adbox img { border: 1px solid #E6E1DC; }
/*Footer
*/
- footer {
padding: 30px 0; border-top: 10px solid #ded6d4; background: #e7e1de; color: #555;
}
- footer a:visited { color: #444; }
- footer a:link { color: #444; }
- footer a:hover { text-decoration: underline; }
/*Footer Columns
*/
.footer-column {
float: left; margin-right: 30px; padding-bottom: 20px; color: #413f3e;
}
- footer-about.footer-column { width: 337px; }
- footer-flickr.footer-column { width: 281px; }
- footer-search.footer-column {
margin: 0;
float: right;
width: 266px;
} .footer-column h2 {
font-size: 1.6em; border-bottom: 2px solid #dbd3d0; padding-bottom: 2px;
} .footer-column p {
margin: 15px 0; font-size: 1.2em; line-height: 1.5em;
} /*Flickr
*/
.flickr_badge_image {
float: left; margin: 0 0 0 10px; padding: 0; line-height: 0;
}
- flickr_badge_image3.flickr_badge_image { margin: 15px 0 10px 10px; }
- flickr_badge_image2.flickr_badge_image { margin: 15px 0 10px 10px; }
- flickr_badge_image1.flickr_badge_image { margin: 15px 0 10px 10px; }
- flickr_badge_image4.flickr_badge_image { margin-left: 0; }
- flickr_badge_image1.flickr_badge_image { margin-left: 0; }
.flickr_badge_image img {
margin: 0; padding: 5px; border: 1px solid #ccc; background: #F7F7F7; line-height: 0;
}
- footer h2.widgettitle { margin-top: 0; }
/*Search
*/
- search_form input.search {
margin: 15px 0 0 0; padding: 5px 2px; width: 180px; border: 1px solid #DED8D5; background: #F3F3F3; color: #555;
}
- search_form input.search:focus { background: #fff; }
- search_form input#searchsubmit { margin: 0 0 0 5px; }
/*Copyright
*/
- copyright {
display: block; clear: both; padding-top: 1px; font-size: 1.1em; border-top: 2px solid #dbd3d0;
}
- copyright a:visited {
border-bottom: 1px dotted; text-decoration: none;
}
- copyright a:link {
border-bottom: 1px dotted; text-decoration: none;
}
- copyright a:hover {
border-bottom: 1px solid; text-decoration: none;
} /*Miscellaneous
*/
img.border {
padding: 14px; border: 1px solid #E6E1DC; background: #F0EBE6;
} .entry .alignright { margin: 0 0 10px 15px; } .entry .alignleft { margin: 0 15px 10px 0; }
/*menu*/
- menu {margin:0px auto; display:block; width:1000px; ;}
- nav {display:block;}
- nav .mainlevel {float:left; background:#545454; text-align:center; display:block;}
- nav .mainlevel a {color:#fff; text-decoration:none; line-height:40px; height:40px; text-align:center; padding:0 8px; display:block; _width:48px;}
- nav .mainlevel a:hover {color:#3f240e; text-decoration:none; background:#678900 url() 0 0 repeat-x;}
- nav .mainlevel ul {position:absolute; display:none; *width:2000px;/*IE is great need, width>=li.length*/}
- nav .mainlevel li {float:left; background:#545454;}
- nav .mainlevel li a {padding:0 12px; line-height:24px; height:35px; display:block; _padding-bottom:6px;/*IE6 only*/}
- nav .mainlevel li a:hover {color:#3f240e; text-decoration:none; background:#678900 url() 0 0 repeat-x;}
- nav li a em/*input an em tag as a space*/ {padding:0 3px;}
.note {color:#3f240e; border-right:1px solid #fff; background:#678900 url() 0 0 repeat-x; display:block; line-height:34px; padding:0 3em;} .Triangle_con {height:9px; background:url() 36px 0 no-repeat; display:block; _margin-bottom:-6px;/*IE6 only*/} .log {margin:100px auto; width:1000px; text-transform:capitalize; line-height:200%;}
.clear {clear:both; *display:inline;/*IE only*/}