Template:Team:BNU-China/CSS/main

From 2014.igem.org

(Difference between revisions)
Line 3: Line 3:
<style>
<style>
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
 +
font-family:Verdana, Geneva, sans-serif;
margin:0;
margin:0;
padding:0;
padding:0;
Line 84: Line 85:
outline : none;
outline : none;
}
}
-
 
body {
body {
background: #1a1a1a;
background: #1a1a1a;
Line 143: Line 143:
}
}
ul li {
ul li {
-
background: transparent url(style/images/bullet.png) center left no-repeat;
+
background: transparent url([[File:bullet.png]]) center left no-repeat;
padding-left: 15px;
padding-left: 15px;
}
}
Line 170: Line 170:
line-height: 25px;
line-height: 25px;
padding-left: 30px;
padding-left: 30px;
-
background: transparent url(style/images/quote.png) no-repeat left 7px;
+
background: transparent url([[File:quote.png]]) no-repeat left 7px;
}
}
.hr2 {
.hr2 {
Line 211: Line 211:
}
}
a.button {
a.button {
-
background: #5499c3 url(style/images/button.png) repeat-x;
+
background: #5499c3 url([[File:button.png]]) repeat-x;
border: none;
border: none;
height: 15px;
height: 15px;
Line 227: Line 227:
-moz-transition:all 200ms ease-in;
-moz-transition:all 200ms ease-in;
}
}
-
/* Webkit Fix */
 
@media screen and (-webkit-min-device-pixel-ratio:0) {  
@media screen and (-webkit-min-device-pixel-ratio:0) {  
a.button {padding: 5px 15px 7px 15px;}
a.button {padding: 5px 15px 7px 15px;}
}
}
-
 
-
/* Opera Fix */
 
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
a.button {padding: 5px 15px 7px 15px;}
a.button {padding: 5px 15px 7px 15px;}
-
 
}
}
-
 
a.button.blue {
a.button.blue {
background-color: #5499c3;
background-color: #5499c3;
Line 245: Line 240:
background-color: #4dab96;
background-color: #4dab96;
}
}
-
 
a.button.lime {
a.button.lime {
background-color: #92ab4d;
background-color: #92ab4d;
}
}
-
 
a.button.red {
a.button.red {
background-color: #ab4d63;
background-color: #ab4d63;
}
}
-
 
a.button.purple {
a.button.purple {
background-color: #8d4dab;
background-color: #8d4dab;
}
}
-
 
a.button.blue:hover {
a.button.blue:hover {
color: #fff;
color: #fff;
background-color: #ab4d63;
background-color: #ab4d63;
}
}
-
 
a.button.green:hover {
a.button.green:hover {
color: #fff;
color: #fff;
Line 272: Line 262:
background-color: #ab4d63;
background-color: #ab4d63;
}
}
-
 
a.button.red:hover {
a.button.red:hover {
color: #fff;
color: #fff;
background-color: #4d87ab;
background-color: #4d87ab;
}
}
-
 
a.button.purple:hover {
a.button.purple:hover {
color: #fff;
color: #fff;
background-color: #4dab96;
background-color: #4dab96;
}
}
-
 
.dropcap {
.dropcap {
display:block;
display:block;
Line 297: Line 284:
display: block;
display: block;
clear: both;
clear: both;
-
background: url(style/images/codebg.jpg) repeat;
+
background: url([[File:codebg.jpg]]) repeat;
line-height: 20px;
line-height: 20px;
font-size: 12px;
font-size: 12px;
Line 329: Line 316:
color:#9e660d;
color:#9e660d;
}
}
-
 
-
 
#wrapper {
#wrapper {
width: 960px;
width: 960px;
Line 459: Line 444:
padding: 0;
padding: 0;
}
}
-
 
.menu {
.menu {
font-family: 'Museo500';
font-family: 'Museo500';
Line 496: Line 480:
font-size: 14px;
font-size: 14px;
}
}
-
 
/* Webkit Fix */
/* Webkit Fix */
@media screen and (-webkit-min-device-pixel-ratio:0) {  
@media screen and (-webkit-min-device-pixel-ratio:0) {  
.menu ul li a {padding: 21px 30px 19px;}
.menu ul li a {padding: 21px 30px 19px;}
}
}
-
 
* html .menu ul li a {
* html .menu ul li a {
display: inline-block;
display: inline-block;
Line 524: Line 506:
display: none;
display: none;
visibility: hidden;
visibility: hidden;
-
width: 180px;
+
width: 170px;
padding: 0;
padding: 0;
 +
border-radius:0 0 0.5em 0.5em;
 +
background-color: #fff;
}
}
.menu ul li ul li {
.menu ul li ul li {
Line 531: Line 515:
float: none;
float: none;
padding: 0 17px;
padding: 0 17px;
-
background-color: #fff;
 
}
}
.menu ul li ul li:first-child a {
.menu ul li ul li:first-child a {
Line 556: Line 539:
}
}
.quote blockquote {
.quote blockquote {
-
background: #FFF url(style/images/quote.png) no-repeat 15px 15px;
+
background: #FFF url([[File:quote.png]]) no-repeat 15px 15px;
padding: 15px 15px 15px 40px;
padding: 15px 15px 15px 40px;
-webkit-border-radius: 5px;
-webkit-border-radius: 5px;
Line 580: Line 563:
height: 470px; /* Same as showcase javascript option */
height: 470px; /* Same as showcase javascript option */
overflow: hidden;
overflow: hidden;
-
}
 
-
 
-
.showcase-onepage {
 
-
/**/
 
}
}
.showcase {
.showcase {
Line 597: Line 576:
top: 50%;
top: 50%;
margin-top: -9px;
margin-top: -9px;
-
background: url('style/images/arrows.png');
+
background: url('[[File:arrows.png]]');
width: 25px;
width: 25px;
height: 25px;
height: 25px;
Line 626: Line 605:
}
}
.showcase-plus-anchor {
.showcase-plus-anchor {
-
background-image: url('style/images/plus.png');
+
background-image: url('[[File:plus.png]]');
background-repeat: no-repeat;
background-repeat: no-repeat;
}
}
Line 637: Line 616:
text-align: left;
text-align: left;
padding: 5px 8px;
padding: 5px 8px;
-
background-image: url(style/images/white-opacity-80.png);
+
background-image: url([[File:white-opacity-80.png]]);
}
}
.showcase-caption {
.showcase-caption {
Line 648: Line 627:
display: none;
display: none;
width: auto;
width: auto;
-
background-image: url(style/images/white-opacity-80.png);
+
background-image: url([[File:white-opacity-80.png]]);
}
}
.showcase-onepage .showcase-content {
.showcase-onepage .showcase-content {
Line 667: Line 646:
text-indent: -99999px;
text-indent: -99999px;
display: inline-block;
display: inline-block;
-
background: url('style/images/navs.png');
+
background: url('[[File:navs.png]]');
}
}
.showcase-button-wrapper span:hover, .showcase-button-wrapper span.active {
.showcase-button-wrapper span:hover, .showcase-button-wrapper span.active {
Line 697: Line 676:
}
}
.showcase-thumbnail-cover {
.showcase-thumbnail-cover {
-
background-image: url(style/images/black-opacity-40.png);
+
background-image: url([[File:black-opacity-40.png]]);
position: absolute;
position: absolute;
top: 0;
top: 0;
Line 738: Line 717:
}
}
.showcase-thumbnail-button-backward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-horizontal, .showcase-thumbnail-button-backward .showcase-thumbnail-horizontal {
.showcase-thumbnail-button-backward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-vertical, .showcase-thumbnail-button-forward .showcase-thumbnail-horizontal, .showcase-thumbnail-button-backward .showcase-thumbnail-horizontal {
-
background-image: url(style/images/arrows-small.png);
+
background-image: url([[File:arrows-small.png]]);
background-repeat: no-repeat;
background-repeat: no-repeat;
display: block;
display: block;
Line 774: Line 753:
background-position: -17px 0;
background-position: -17px 0;
}
}
-
/* Hide button text */
 
.showcase-thumbnail-button-forward span span, .showcase-thumbnail-button-backward span span {
.showcase-thumbnail-button-forward span span, .showcase-thumbnail-button-backward span span {
display: none;
display: none;
}
}
-
 
.one-half {
.one-half {
width:48%;
width:48%;
Line 890: Line 867:
background-position: bottom right;
background-position: bottom right;
}
}
 +
.form-container {
.form-container {
position: relative;
position: relative;
Line 983: Line 961:
}
}
.forms fieldset .btn-submit {
.forms fieldset .btn-submit {
-
background: #5499c3 url(style/images/button.png) repeat-x;
+
background: #5499c3 url([[File:button.png]]) repeat-x;
border: none;
border: none;
height: 27px;
height: 27px;
Line 1,042: Line 1,020:
}
}
#footer .forms fieldset .btn-submit {
#footer .forms fieldset .btn-submit {
-
background: #5499c3 url(style/images/button.png) repeat-x;
+
background: #5499c3 url([[File:button.png]]) repeat-x;
border: none;
border: none;
height: 27px;
height: 27px;
Line 1,087: Line 1,065:
}
}
-
/* Opera Fix */
 
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
#footer .form-container .loading {
#footer .form-container .loading {
Line 1,102: Line 1,079:
}
}
-
/* Webkit Fix */
 
@media screen and (-webkit-min-device-pixel-ratio:0) {  
@media screen and (-webkit-min-device-pixel-ratio:0) {  
#footer .forms label {
#footer .forms label {
Line 1,108: Line 1,084:
}
}
}
}
-
 
.items {
.items {
Line 1,187: Line 1,162:
.play, .zoom, .details {
.play, .zoom, .details {
position: absolute;
position: absolute;
-
background: transparent url(style/images/icon-play.png) no-repeat center center;
+
background: transparent url([[File:icon-play.png]]) no-repeat center center;
}
}
.zoom {
.zoom {
-
background-image: url(style/images/icon-zoom.png);
+
background-image: url([[File:icon-zoom.png]]);
}
}
.details {
.details {
-
background-image: url(style/images/icon-more.png);
+
background-image: url([[File:icon-more.png]]);
}
}
.box a span, .carousel ul li a span {
.box a span, .carousel ul li a span {
Line 1,211: Line 1,186:
margin-top: 40px;
margin-top: 40px;
}
}
-
 
.blog {
.blog {
}
}
Line 1,291: Line 1,265:
}
}
.comments {
.comments {
-
background: transparent url(style/images/icon-comment.png) no-repeat left center;
+
background: transparent url([[File:icon-comment.png]]) no-repeat left center;
padding-left: 26px;
padding-left: 26px;
margin-right: 10px;
margin-right: 10px;
Line 1,297: Line 1,271:
}
}
.categories {
.categories {
-
background: transparent url(style/images/icon-category.png) no-repeat left center;
+
background: transparent url([[File:icon-category.png]]) no-repeat left center;
padding-left: 22px;
padding-left: 22px;
}
}
.tags {
.tags {
-
background: transparent url(style/images/icon-tag.png) no-repeat left center;
+
background: transparent url([[File:icon-tag.png]]) no-repeat left center;
padding-left: 30px;
padding-left: 30px;
margin-top: 10px;
margin-top: 10px;
Line 1,377: Line 1,351:
-moz-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border-radius: 5px;
-
background: #FFF url(style/images/search.png) 240px center no-repeat;
+
background: #FFF url([[File:search.png]]) 240px center no-repeat;
}
}
.tag-list ul li {
.tag-list ul li {
Line 1,455: Line 1,429:
}
}
}
}
-
 
-
 
.service {
.service {
-
background: transparent url(style/images/circle.png) no-repeat;
+
background: transparent url([[File:circle.png]]) no-repeat;
width: 100px;
width: 100px;
height: 100px;
height: 100px;
Line 1,466: Line 1,438:
vertical-align: middle;
vertical-align: middle;
}
}
-
 
.toggle {
.toggle {
width: 100%;
width: 100%;
Line 1,527: Line 1,498:
border-radius: 5px;
border-radius: 5px;
}
}
-
 
ul.tabs {
ul.tabs {
margin: 0;
margin: 0;
Line 1,595: Line 1,565:
padding: 15px 15px 15px 15px;
padding: 15px 15px 15px 15px;
}
}
-
 
table {
table {
Line 1,668: Line 1,637:
}
}
.check-icon {
.check-icon {
-
background: transparent url(style/images/check-table.png) no-repeat center left;
+
background: transparent url([[File:check-table.png]]) no-repeat center left;
width: 12px;
width: 12px;
height: 10px;
height: 10px;
}
}
.cross {
.cross {
-
background: transparent url(style/images/cross.png) no-repeat center left;
+
background: transparent url([[File:cross.png]]) no-repeat center left;
width: 10px;
width: 10px;
height: 10px;
height: 10px;
Line 1,692: Line 1,661:
height: 100%;
height: 100%;
z-index: 2;
z-index: 2;
-
background: url('style/images/tile.png');
+
background: url('[[File:tile.png]]');
}
}
 +
#comments {
 +
width: 590px;
 +
}
 +
.full-width #comments {
 +
width: 900px;
 +
}
 +
ol.commentlist .message p {
 +
font-style: normal;
 +
clear: both;
 +
padding: 0;
 +
}
 +
ol.commentlist {
 +
list-style:none;
 +
margin:0;
 +
}
 +
ol.commentlist li {
 +
margin: 0;
 +
list-style:none;
 +
background: none;
 +
padding: 25px 0 26px 0;
 +
border-bottom: 1px solid #454545;
 +
font-family: 'PTSansRegular';
 +
}
 +
#comments .user {
 +
float:left;
 +
width:60px;
 +
}
 +
.avatar {
 +
width: 60px;
 +
height: 60px;
 +
float:left;
 +
display:block;
 +
}
 +
#comments .message .info .date {
 +
float:left;
 +
font-size: 11px;
 +
margin-left: 10px;
 +
}
 +
#comments .info a {
 +
font-size:11px;
 +
float:left;
 +
text-decoration: none;
 +
}
 +
#comments a.reply-link {
 +
display:block;
 +
margin-left: 10px;
 +
float:right;
 +
text-decoration:none;
 +
font-size:9px;
 +
text-transform: uppercase;
 +
font-style: normal;
 +
}
 +
#comments .message {
 +
background:none;
 +
width:510px;
 +
float:right;
 +
font-size:13px;
 +
line-height:20px;
 +
position:relative;
 +
padding:0;
 +
margin: 0;
 +
}
 +
.full-width #comments .message {
 +
width:820px;
 +
}
 +
#comments .info {
 +
margin: 0 0 3px 0;
 +
}
 +
#comments ul.children {
 +
margin:0;
 +
padding:0 0 0 40px;
 +
}
 +
#comments ol.commentlist ul.children li {
 +
padding:25px 0 0 0;
 +
margin: 0;
 +
margin-top: 25px;
 +
border: none;
 +
border-top: 1px solid #454545;
 +
}
 +
#comments ol.commentlist ul.children li .message {
 +
width:470px;
 +
}
 +
#comments ol.commentlist ul.children ul li .message {
 +
width:430px;
 +
}
 +
#comments ol.commentlist ul.children ul ul li .message {
 +
width:390px;
 +
}
 +
#comments ol.commentlist ul.children ul ul ul li .message {
 +
width:350px;
 +
}
 +
#comments ol.commentlist ul.children ul ul ul ul li .message {
 +
width:310px;
 +
}
 +
#comments ol.commentlist ul.children ul ul ul ul ul li .message {
 +
width:270px;
 +
}
 +
.full-width #comments ol.commentlist ul.children li .message {
 +
width:780px;
 +
}
 +
.full-width #comments ol.commentlist ul.children ul li .message {
 +
width:740px;
 +
}
 +
.full-width #comments ol.commentlist ul.children ul ul li .message {
 +
width:700px;
 +
}
 +
.full-width #comments ol.commentlist ul.children ul ul ul li .message {
 +
width:660px;
 +
}
 +
.full-width #comments ol.commentlist ul.children ul ul ul ul li .message {
 +
width:620px;
 +
}
 +
.full-width #comments ol.commentlist ul.children ul ul ul ul ul li .message {
 +
width:580px;
 +
}
 +
#comments .info h3 {
 +
margin: 0;
 +
padding: 0;
 +
line-height: 18px;
 +
display: inline;
 +
}
 +
#comments .info h3 a {
 +
font-size: 15px;
 +
font-style: normal;
 +
}
 +
#comments .info h3 a:hover {
 +
}
 +
.comment-form {
 +
margin-top: 40px;
 +
}
 +
</style>
</style>
</head>
</head>
</html>
</html>

Revision as of 13:41, 16 July 2014