Template:Montgomery Cougars NJUSA/Common CSS
From 2014hs.igem.org
Casey.chow (Talk | contribs) |
Casey.chow (Talk | contribs) |
||
Line 207: | Line 207: | ||
} | } | ||
- | + | #slider { | |
margin-right: 0; | margin-right: 0; | ||
margin-bottom: 0; | margin-bottom: 0; | ||
Line 215: | Line 215: | ||
} | } | ||
- | + | #slider ul { | |
margin-top: 0; | margin-top: 0; | ||
padding-left: 0; | padding-left: 0; | ||
} | } | ||
- | + | #slider li { | |
list-style: none; | list-style: none; | ||
position: relative; | position: relative; | ||
} | } | ||
- | + | #slider ul li { | |
float: left; | float: left; | ||
/*margin-top: -1em;*/ | /*margin-top: -1em;*/ | ||
} | } | ||
- | + | #slider ul li a { | |
display: block; | display: block; | ||
} | } | ||
- | + | #slider img { | |
width: 100%; | width: 100%; | ||
} | } | ||
- | + | #slider .caption { | |
background-color: rgba(0,10,5,.8); | background-color: rgba(0,10,5,.8); | ||
padding: 1.5em 1em; | padding: 1.5em 1em; | ||
Line 248: | Line 248: | ||
} | } | ||
- | + | #slider .caption h2 { | |
color: white; | color: white; | ||
border-bottom: none; | border-bottom: none; | ||
Line 257: | Line 257: | ||
} | } | ||
- | + | #slider .caption span { | |
color: white; | color: white; | ||
font-size: 1.25em; | font-size: 1.25em; |
Revision as of 19:52, 17 June 2014
/* Edit this file: https://2014hs.igem.org/wiki/index.php?title=Template:Montgomery_Cougars_NJUSA/Common_CSS&action=edit */ /* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */
/***************************************/ /* WIKI RESET */ /***************************************/
body.mediawiki {
margin-top: -1.25em;
}
- contentSub,
- search-controls,
.firstHeading,
- footer-box,
- catlinks,
- p-logo {
display:none;
}
- top-section {
border: none; height: 0px;
}
- content {
border: none;
}
- menubar > ul > li:last-child {
display: none;
}
- menubar {
width: auto;
}
- menubar ul {
margin-bottom: 0.5em;
}
/* CUSTOM STYLES */
- content {
width: 100%; padding: 0;
}
.container {
width: 70%; max-width: 1100px; margin: 0 auto;
}
p {
line-height: 1.5;
}
/***************************************/ /* RANDOM */ /***************************************/
body {
min-width: 1200px; background-color: white; border-bottom: solid #333 1px;
}
/* fontawesome */ [class*="fontawesome-"]:before {
font-family: 'FontAwesome', sans-serif;
}
/* http://css-tricks.com/snippets/css/clear-fix/ */ .clearfix:after {
visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
} .clearfix { display: inline-block; } /* start commented backslash hack \*/
- html .clearfix { height: 1%; }
.clearfix { display: block; } /* close commented backslash hack */
.centered {
display: table; margin-left: auto; margin-right: auto;
}
/***************************************/
/* FONT TWEAKS */
/***************************************/
body {
font-size: 12px;
}
p {
font-size: 14px;
}
body, p, span, blockquote, article, section, aside, nav, th, td, .wikitable th, .wikitable td {
font-family: 'Open Sans', sans-serif;
}
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
font-family: 'Open Sans', sans-serif; font-weight: 400; padding-bottom: 0.25em;
}
h1, h1 a {
border-bottom: none; font-size: 3.25em;
}
p {
line-height: 1.5;
} /***************************************/ /* HEADER */ /***************************************/
- header-wrapper {
position: relative; /* create new stacking context to keep logo on top */ z-index: 100;
}
- header {
background-color: rgb(38, 38, 38); border-bottom: solid 0.75em rgb(0, 102, 0); height: 7.5em;
}
- logo {
margin-left: 20px;
}
- logo span {
display: none;
}
- logo img {
/*max-width: 275px;*/ position: absolute; width: 250px;
}
- nav {
background: none; max-width: 1400px; margin: 0 auto; position: relative;
}
- nav ul {
position: absolute; left: 320px; top: 4.25em; width: 70%;
}
- nav li a {
color: #E6E6E6; font-family: 'Open Sans', sans-serif; font-size: 1.2em; font-weight: 300;
-webkit-transition: background-color 0.15s ease-in; -moz-transition: background-color 0.15s ease-in; -o-transition: background-color 0.15s ease-in; -ms-transition: background-color 0.15s ease-in; transition: background-color 0.15s ease-in;
}
- nav li a:hover {
background: rgb(50, 50, 50);
}
- igem-logo {
position: absolute; right: 0;
}
- igem-logo span {
display: none;
}
- igem-logo img {
width: 200px; margin-top: 1em;
}
/***************************************/ /* GALLERY */ /***************************************/
.generic-image {
position: relative;
}
- gallery {
position: relative;
}
- slider {
margin-right: 0; margin-bottom: 0; position: relative; overflow: auto; width: 100%;
}
- slider ul {
margin-top: 0; padding-left: 0;
}
- slider li {
list-style: none; position: relative;
}
- slider ul li {
float: left; /*margin-top: -1em;*/
}
- slider ul li a {
display: block;
}
- slider img {
width: 100%;
}
- slider .caption {
background-color: rgba(0,10,5,.8); padding: 1.5em 1em; position: absolute; bottom: 0; text-align: center; width: 100%; color: white;
}
- slider .caption h2 {
color: white; border-bottom: none; font-size: 3em; font-weight: 300; margin: 0.25em 0 0.75em; padding: 0;
}
- slider .caption span {
color: white; font-size: 1.25em; font-weight: 300; margin: 0;
}
/***************************************/ /* LEFT LINKS */ /***************************************/
- left-links-wrapper {
font-size: 12px; padding-right: 15px; box-sizing: border-box; -moz-box-sizing: border-box;
}
- left-links {
}
- left-links h1,
- left-links ul li a,
- left-links ul li .selflink {
color: rgb(245, 245, 245); font-family: 'Open Sans', sans-serif; text-decoration: none;
}
- left-links h1 {
background-color: rgba(0, 102, 0, 1); font-size: 2.5em; font-weight: 300; float: left; line-height: 1.15; margin: 0 0 -1px; min-width: 75%; max-width: 95%; padding: 10px;
}
- left-links ul {
float: left; margin: 0; padding: 0; width: 100%;
}
- left-links ul li {
display: block; font-size: 1.5em; font-weight: 300; margin-bottom: 0; width: 100%;
}
- left-links ul li a,
- left-links ul li .selflink {
display: block; clear: left; float: left; min-width: 30%; padding: 10px 15px;
-webkit-transition: background 200ms ease; -moz-transition: background 200ms ease; -ms-transition: background 200ms ease; -o-transition: background 200ms ease; transition: background 200ms ease;
}
- left-links ul li a:hover {
background-color: rgb(50,50,50);
}
- left #left-links-title {
background-color: rgba(0, 102, 0, 1); color: rgb(240, 240, 240);
}
- left-links .selflink {
background-color: rgb(46, 46, 46); font-weight: 300;
}
- left-links ul > :nth-child(1) > a {
background-color: rgba(0, 102, 0, 0.95);
}
- left-links ul > :nth-child(2) > a {
background-color: rgba(0, 102, 0, 0.91);
}
- left-links ul > :nth-child(3) > a {
background-color: rgba(0, 102, 0, .87);
}
- left-links ul > :nth-child(4) > a {
background-color: rgba(0, 102, 0, 0.83);
}
- left-links ul > :nth-child(5) > a {
background-color: rgba(0, 102, 0, 0.79);
}
- left-links ul > :nth-child(6) > a {
background-color: rgba(0, 102, 0, 0.75);
}
- left-links ul > :nth-child(7) > a {
background-color: rgba(0, 102, 0, 0.71);
}
- left-links ul > :nth-child(8) > a {
background-color: rgba(0, 102, 0, 0.67);
}
/***************************************/
/* CONTENT */
/***************************************/
- main-wrapper {
max-width: 1400px; margin: 0 auto;
}
- inner-content {
box-sizing: border-box; -moz-box-sizing: border-box; padding-right: 3em;
}
- innercontent h1:first-child {
margin: 0.3em 0 0.25em;
}
.editsection, .editsection a {
font-size: 16px;
}
.toc {
float: right; margin: 3em 0 2em 2em;
}
/***************************************/ /* FOOTER */ /***************************************/
- footer {
margin-top: 2em;
}
- footer li {
display: inline-block; margin: 0;
}
- footer-links {
text-align: center;
}
- footer-text {
color: #777; font-size: 0.8em; margin: 0.75em 0; text-align: center;
}
- footer-links-2 ul {
margin: 0.75em 0 0.25em; padding: 0;
}
- footer-links-2 ul li {
display: inline; list-style: none; padding-right: 1em;
}
- footer-links-2 ul li:last-child {
padding-right: 0;
}
- footer-links-2 ul li a {
font-size: 0.9em; color: #777; text-decoration: none;
}
/***************************************/ /* TOC */ /***************************************/
- jqtoc {
background: #3A3A3A; color: #fff; font-size: 12px; height: 100%; position: fixed; bottom: 0; right: 0; width: 150px;
}
- jqtoc ul {
list-style: none; margin: 0; padding: 0 0 3em; position: absolute; bottom: 12.5%;
}
- jqtoc li {
padding: 5px 10px;
}
- jqtoc a {
color: #fff; text-decoration: none; display: block;
}
- jqtoc .toc-h1 {
background-color: rgb(70, 70, 70);
}
- jqtoc .toc-h2 {
padding-left: 10px;
}
- jqtoc .toc-h3 {
padding-left: 20px;
}
- jqtoc .toc-active {
background: rgb(0, 75, 15);
}
.with-toc #inner-content {
padding-right: 175px;
}