Team:Toronto/css/style
From 2014.igem.org
(Difference between revisions)
Line 32: | Line 32: | ||
#bodyContent { | #bodyContent { | ||
height: 100%; | height: 100%; | ||
+ | } | ||
+ | #menubar ul { | ||
+ | margin: 0; | ||
} | } | ||
Revision as of 05:48, 17 October 2014
/* Fonts
* font-family: 'Ropa Sans', sans-serif; * font-family: 'Contrail One', cursive; * font-family: 'Walter Turncoat', cursive; * font-family: 'Voltaire', sans-serif; * font-family: 'Bangers', cursive; * font-family: 'Oswald', sans-serif; */
- {
margin: 0; padding: 0; box-sizing: border-box; }
- globalWrapper {
height: 100%; }
- top-section {
height: auto; }
- top-section #p-logo {
display: none;
}
- top-section #search-controls {
display:none;
}
- content {
width:100%; height: 100%; }
- bodyContent {
height: 100%; }
- menubar ul {
margin: 0;
}
.col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11 {
margin: 0; padding: 0; box-sizing: border-box; }
html {
position: relative; height: 100%; }
body {
position: relative; min-height: 100%; height: 100%} body::-webkit-scrollbar { width: 12px; background: rgba(127, 140, 141, 0.4); opacity: 0; } body::-webkit-scrollbar-thumb { background: rgba(127, 140, 141, 0.8); }
h1, h2, h3, h4, h5, h6 {
overflow: hidden; margin-top: 10px; font-family: 'Bangers', cursive; text-align: center; } h1:before, h1:after, h2:before, h2:after, h3:before, h3:after, h4:before, h4:after, h5:before, h5:after, h6:before, h6:after { background-color: white; content: ""; display: inline-block; height: 2px; position: relative; vertical-align: middle; width: 50%; } h1:before, h2:before, h3:before, h4:before, h5:before, h6:before { right: 0px; margin-left: -50%; } h1:after, h2:after, h3:after, h4:after, h5:after, h6:after { left: 0px; margin-right: -50%; } h1 span, h2 span, h3 span, h4 span, h5 span, h6 span { color: white; display: inline-block; padding: 0.5em; padding-top: 0.2em; padding-bottom: 0.2em; border: 2px solid white; }
h4:before, h4:after, h5:before, h5:after, h6:before, h6:after {
background-color: black; }
h4 span, h5 span, h6 span {
color: black; border-color: black; }
@media screen and (-webkit-min-device-pixel-ratio: 0) {
h5 span, h6 span { border-bottom-width: 3px; } }
canvas#canvas {
position: fixed; display: block; z-index: 1; }
div#splash-wrapper {
position: relative; height: 100%; margin-bottom: 42px; background-color: #a66bbe; color: white; } div#splash-wrapper section#splash { position: absolute; width: 100%; z-index: 9999; } div#splash-wrapper section#splash::-webkit-scrollbar { width: 12px; background: black; } div#splash-wrapper section#splash::-webkit-scrollbar-thumb { background: green; } div#splash-wrapper nav { position: absolute; z-index: 9999; bottom: -42px; width: 100%; height: 42px; border-bottom: 2px solid whitesmoke; -webkit-transition: all 250ms ease; -moz-transition: all 250ms ease; -o-transition: all 250ms ease; transition: all 250ms ease; } div#splash-wrapper nav.stuck { position: fixed; top: 0; } div#splash-wrapper nav.free { position: absolute; z-index: 9999; bottom: -42px; } div#splash-wrapper nav:hover { background-color: #3498db; } div#splash-wrapper nav ul { margin: 0; } div#splash-wrapper nav ul li { float: left; list-style-type: none; font-family: 'Bangers', cursive; text-transform: capitalize; font-size: 2em; -webkit-transition: all 250ms ease; -moz-transition: all 250ms ease; -o-transition: all 250ms ease; transition: all 250ms ease; } div#splash-wrapper nav ul li.active { background-color: whitesmoke; } div#splash-wrapper nav ul li.active a { color: black; } div#splash-wrapper nav ul li:hover { background-color: rgba(245, 245, 245, 0.5); } div#splash-wrapper nav ul li a { padding: 10px; color: white; height: 40px; line-height: 40px; } div#splash-wrapper nav ul li a .fa { font-size: 0.6em; vertical-align: middle; padding-right: 5px; } div#splash-wrapper nav ul li a:hover { text-decoration: none; }
section#main {
position: absolute; /*overflow: hidden;*/ width: 100%; z-index: 9998; } section#main #main-inner { position: absolute; width: 100%; } section#main .container-wrapper { background-color: whitesmoke; } section#main .container-wrapper.first { padding-top: 15px; } section#main footer { position: relative; padding-top: 10px; }