Template:Montgomery Cougars NJUSA/Common CSS
From 2014hs.igem.org
Casey.chow (Talk | contribs) (Undo revision 12730 by Casey.chow (talk)) |
Casey.chow (Talk | contribs) (New Theme for real!) |
||
Line 2: | Line 2: | ||
/* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */ | /* https://2011.igem.org/Team:DTU-Denmark/How_to_customize_an_iGEM_wiki#Centralizing_the_layout_using_templates */ | ||
- | /* | + | |
+ | |||
+ | /***************************************/ | ||
+ | /* WIKI RESET */ | ||
+ | /***************************************/ | ||
+ | |||
#contentSub, | #contentSub, | ||
#search-controls, | #search-controls, | ||
Line 23: | Line 28: | ||
#menubar { | #menubar { | ||
width: auto; | width: auto; | ||
+ | |||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | /* CUSTOM STYLES */ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | #globalWrapper { | |
- | + | font-size: auto !important; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | #content { | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
width: 100%; | width: 100%; | ||
- | + | padding: 0; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | ||
- | + | .container { | |
- | width: | + | width: 70%; |
- | + | max-width: 1100px; | |
- | + | margin: 0 auto; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | p { | |
- | + | line-height: 1.5; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | h1 { | |
- | + | font-size: 3em; | |
- | + | }} | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | /***************************************/ | |
- | + | /* RANDOM */ | |
- | + | /***************************************/ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | /* 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, p, span, blockquote, article, section, aside, nav { |
+ | 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; | |
} | } | ||
- | a | + | h1, h1 a { |
- | { | + | font-size: 3.25em; |
- | + | ||
} | } | ||
- | /* | + | /***************************************/ |
+ | /* 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; |
- | + | ||
} | } | ||
- | + | #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(70, 70, 70); | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | /***************************************/ | |
- | + | /* GALLERY */ | |
- | + | /***************************************/ | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | #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); | |
- | + | color: white; | |
+ | padding: 1.5em 1em; | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | text-align: center; | ||
+ | width: 100%; | ||
} | } | ||
- | + | #slider .caption h2 { | |
- | + | font-size: 3em; | |
- | + | font-weight: 300; | |
- | + | margin: 0 0 0.25em; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | . | + | #slider .caption span { |
- | + | font-size: 1.25em; | |
- | + | font-weight: 300; | |
+ | margin: 0; | ||
} | } | ||
- | /** | + | /***************************************/ |
- | + | /* LEFT LINKS */ | |
+ | /***************************************/ | ||
- | + | #left-links { | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-title, | |
- | + | #left-links-links li a { | |
- | + | color: rgb(245, 245, 245); | |
- | + | font-family: 'Open Sans', sans-serif; | |
- | + | text-decoration: none; | |
} | } | ||
- | + | #left-links-title { | |
- | + | background-color: rgba(0, 102, 0, 1); | |
- | + | font-size: 2.5em; | |
- | + | font-weight: 300; | |
- | + | float: left; | |
- | + | margin: 0; | |
- | + | min-width: 75%; | |
- | + | padding: 10px; | |
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | |||
- | + | #left-links-links { | |
- | + | float: left; | |
- | + | margin: 0; | |
- | + | padding: 0; | |
- | + | width: 100%; | |
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-links li { | |
- | + | display: block; | |
- | + | font-size: 1.5em; | |
- | + | font-weight: 300; | |
- | + | width: 100%; | |
} | } | ||
- | + | #left-links-links li a { | |
- | + | display: block; | |
- | + | width: 50%; | |
- | + | padding: 7px 15px; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(1) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.95); | |
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(2) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.91); | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(3) > a { | |
- | + | background-color: rgba(0, 102, 0, .87); | |
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(4) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.83); | |
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(5) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.79); | |
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(6) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.75); | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | #left-links-links > :nth-child(7) > a { | |
- | + | background-color: rgba(0, 102, 0, 0.71); | |
- | + | } | |
+ | #left-links-links > :nth-child(8) > a { | ||
+ | background-color: rgba(0, 102, 0, 0.67); | ||
+ | } | ||
+ | #left #left-links-title { | ||
+ | background-color: rgba(0, 102, 0, 1); | ||
+ | color: rgb(240, 240, 240); | ||
} | } | ||
- | /* | + | /***************************************/ |
+ | /* CONTENT */ | ||
+ | /***************************************/ | ||
- | + | #content { | |
- | + | box-sizing: border-box; | |
+ | padding-right: 3em; | ||
} | } | ||
- | + | #content h1:first-child { | |
- | + | margin: 0.3em 0 0.25em; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
- | + | /***************************************/ | |
- | + | /* FOOTER */ | |
- | + | /***************************************/ | |
- | + | ||
- | + | #footer { | |
- | + | margin-top: 2em; | |
- | + | ||
- | + | ||
} | } | ||
- | + | #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; | |
- | + | ||
- | + | ||
} | } |
Revision as of 20:47, 13 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 */ /***************************************/
- 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;
}
/* CUSTOM STYLES */
- globalWrapper {
font-size: auto !important;
}
- content {
width: 100%; padding: 0;
}
.container {
width: 70%; max-width: 1100px; margin: 0 auto;
}
p {
line-height: 1.5;
}
h1 {
font-size: 3em;
}}
/***************************************/ /* RANDOM */ /***************************************/
/* 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, p, span, blockquote, article, section, aside, nav {
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;
}
h1, h1 a {
font-size: 3.25em;
}
/***************************************/ /* 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;
}
- 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(70, 70, 70);
}
/***************************************/ /* GALLERY */ /***************************************/
- 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); color: white; padding: 1.5em 1em; position: absolute; bottom: 0; text-align: center; width: 100%;
}
- slider .caption h2 {
font-size: 3em; font-weight: 300; margin: 0 0 0.25em;
}
- slider .caption span {
font-size: 1.25em; font-weight: 300; margin: 0;
}
/***************************************/ /* LEFT LINKS */ /***************************************/
- left-links {
}
- left-links-title,
- left-links-links li a {
color: rgb(245, 245, 245); font-family: 'Open Sans', sans-serif; text-decoration: none;
}
- left-links-title {
background-color: rgba(0, 102, 0, 1); font-size: 2.5em; font-weight: 300; float: left; margin: 0; min-width: 75%; padding: 10px;
}
- left-links-links {
float: left; margin: 0; padding: 0; width: 100%;
}
- left-links-links li {
display: block; font-size: 1.5em; font-weight: 300; width: 100%;
}
- left-links-links li a {
display: block; width: 50%; padding: 7px 15px;
}
- left-links-links > :nth-child(1) > a {
background-color: rgba(0, 102, 0, 0.95);
}
- left-links-links > :nth-child(2) > a {
background-color: rgba(0, 102, 0, 0.91);
}
- left-links-links > :nth-child(3) > a {
background-color: rgba(0, 102, 0, .87);
}
- left-links-links > :nth-child(4) > a {
background-color: rgba(0, 102, 0, 0.83);
}
- left-links-links > :nth-child(5) > a {
background-color: rgba(0, 102, 0, 0.79);
}
- left-links-links > :nth-child(6) > a {
background-color: rgba(0, 102, 0, 0.75);
}
- left-links-links > :nth-child(7) > a {
background-color: rgba(0, 102, 0, 0.71);
}
- left-links-links > :nth-child(8) > a {
background-color: rgba(0, 102, 0, 0.67);
}
- left #left-links-title {
background-color: rgba(0, 102, 0, 1); color: rgb(240, 240, 240);
}
/***************************************/ /* CONTENT */ /***************************************/
- content {
box-sizing: border-box; padding-right: 3em;
}
- content h1:first-child {
margin: 0.3em 0 0.25em;
}
/***************************************/
/* FOOTER */
/***************************************/
- footer {
margin-top: 2em;
}
- 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;
}