Template:UBonn HBRS/css/main

/** Main Styles iGEM-Team Bonn

feel free to use stuff from here but please give credit

• /

/* * * * * * * * * * * * * * * * * * * * * * * * * Team Bonn Template

• * * * * * * * * * * * * * * * * * * * * * * * */

html { position: relative; }

body { margin-bottom: 53px !important; }

1. content {

background: transparent; }

.previewnote { padding-top: 15px; }

1. editform {

margin-bottom: 75px; }

/* Header

• /

1. mw-content-text {

padding-top: 46px !important; }

header .navbar { margin-top: 17px; background-color: #EEE; }

.navbar .navbar-collapse.show .navbar-nav, .navbar .navbar-collapse.collapsing .navbar-nav { padding-top: 60px; }

1. nav_logo {

width: 102px; }

1. nav_logo::after {

content: ""; position: absolute; top: 0; width: 102px; height: 100px; background-image: url(//2017.igem.org/wiki/images/4/48/T--UBonn_HBRS--logo_nav.png); background-position: center; background-repeat: no-repeat; background-attachment: scroll; }

1. mainNav .navbar-nav {

margin-left: 0; }

1. mainNav .dropdown-menu {

min-width: 170px; margin-left: 5px; padding: 5px 0; }

1. mainNav .dropdown-menu a {

padding: 8px; color: #058; }

1. mainNav .dropdown-menu a:active {

background-color: #F8F9FA; }

1. mainNav .dropdown-menu .divider {

margin: 5px 0; }

1. mainNav .dropdown-menu {

margin-top: 0px; }

1. mainNav .dropdown-item:focus, .dropdown-item:hover {

background-image: linear-gradient( to bottom, #F8F9FA 0, #E9E9E9 100% ); }

@media (min-width: 768px) { #mainNav li:hover .dropdown-menu, .dropdown-menu:hover { display: block; }

#mainNav .dropdown-menu::before { position: absolute; top: -7px; left: 10px; display: inline-block; border-right: 6px solid transparent; border-bottom: 6px solid #CCC; border-left: 6px solid transparent; border-bottom-color: rgba(0, 0, 0, 0.2); content: ; }

#mainNav .dropdown-menu::after { position: absolute; top: -6px; left: 10px; display: inline-block; border-right: 6px solid transparent; border-bottom: 6px solid white; border-left: 6px solid transparent; content: ; } }

1. sideNav {

position: sticky; top: 135px; padding: 0; opacity: 0; }

1. sideNav a {

color: #337AB7; }

1. sideNav a:hover {

color: #23527C; }

1. sideNav nav {

width: 100%; padding: 0 0 0 4px; }

1. sideNav nav>a {

padding: 0; /* padding: 0 10px 0 0;

• /

}

1. sideNav nav>a.active {

padding: 0; }

1. sideNav nav>a>span {display: inline-block}
2. sideNav nav>a>span {padding: 4px 0 4px 4px; text-decoration: none}
3. sideNav nav>a:hover>span {padding-left: 2px;background: transparent;border-left: 2px solid #39C}
4. sideNav nav>a.active>span {padding-left: 2px;font-weight: bold;border-left: 2px solid #39C}

.sideNav_h3 {display: none} .sideNav_h2.active + nav .sideNav_h3 {display: block}

1. sideNav nav nav {margin: 0;margin-left:1.5em}

/* Content

• /

.container.main { margin-top: 70px; }

1. toc {

display: none; }

1. mainContent {

text-align: justify; }

h1, h2, h3 { margin: -60px 0 0 0; padding: 80px 0 10px 0; font-weight: normal !important; border: none; }

h1 { color: #36C; font-size: 2.5rem !important; }

h2 { color: #058; font-size: 2rem !important; }

h3 { color: #222; font-size: 1.33rem !important; }

1. mainContent li {

padding-left: 1em !important; list-style: none !important; }

1. mainContent li:before {

content: "• "; font-size: 2em; vertical-align: middle; color: #39C; }

a, a:visited { color: #337AB7; }

.igem_2017_menu_wrapper { margin-top: -28px; z-index: 1031; }

table { table-layout: fixed; }

table caption { caption-side: top; }

.info-text { text-align: justify; font-style: italic; color: #666; }

1. mainContent .references {

margin: 0 !important; }

1. mainContent .references li {

padding: 0 0 0 1.6rem !important; text-indent: -1.6rem; white-space: pre-wrap; }

1. mainContent .references li::before {

content: none; }

.start-row { max-width: 980px; margin-top: 5rem; margin-right: auto; margin-bottom: 5rem; margin-left: auto; }

.start-text { font-size: 2rem; line-height: 2.5rem; text-align: justify; }

.start-text em { font-style: italic; }

.start-text .fat-blue { color: #39C; font-weight: bold; }

.sponsors-row .sponsor { padding: 20px 40px; }

.sponsors-row .sponsor img { width: auto; height: 80px; }

.team-entry h3 { margin: -100px 0 0 0; padding-top: 90px; }

.notebook-entry { margin-bottom: 25px; }

.notebook-entry h2 { margin: -95px 0 0 0; padding: 95px 0 0 0; font-size: 1.33rem !important; color: #222; }

.notebook-entry h4 { padding: 0; font-size: 1.25rem; }

.notebook-entry ul { margin-bottom: 1.2rem; }

/* Footer

• /

.footer.footer { position: absolute; bottom: 0; width: 100%; height: 53px; background-color: #EEE; }

1. scrollTop img {

display: inline-block; height: 1em; margin-bottom: 4px; vertical-align: middle; transition: 100ms linear; filter: brightness( 90% ); }

1. scrollTop:hover img, #scrollTop:focus img {

filter: brightness( 70% ); }

.container .text-muted { margin: 14px 0; }