Template:UBonn HBRS/css/main

/** Main Styles iGEM-Team Bonn

feel free to use stuff from here but please give credit

• /

/* * * * * * * * * * * * * * * * * * * * * * * * * Resets & Fixes

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

html, body, #globalWrapper, #content, #HQ_page, #bodyContent, #mw-content-text { min-height: 100% !important; margin: 0 !important; padding: 0 !important; }

1. content {

width: 100%; margin: 0; padding: 0; }

1. HQ_page h1, h2, h3, h4, h5 {

margin-bottom: 0 !important; font-family: inherit !important; font-weight: normal !important; }

1. top_title, #mw-content-text > p:first-of-type, #top_menu_under, .sideNav_h1:first-of-type, .mw-editsection {

display: none !important; }

1. globalWrapper {

font-size: inherit !important; }

1. sideMenu, #sideMenu * {

box-sizing: content-box; }

1. sideMenu {

display: none; left: auto !important; right: 25px; border: 1px solid #222; border-radius: 5px; }

1. top_menu_14 {

height: 19px; background: linear-gradient(0deg, #383838, #444444); }

1. top_menu_inside {

width: 100%; margin: 0 auto; border: none; }

1. user_item {

float: left !important; margin: 0 !important; padding: 0px 25px 0px 20px !important; }

1. bars_item {

left: auto !important; right: 25px; }

1. top_menu_14 .submenu {

opacity: 0.9; }

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

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

html { position: relative; }

body { padding-top: 16px !important; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; background-color: #FFF; }

header { padding: 12px 0; background: #F8F8F8; border-bottom: 1px solid #EEE; }

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

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

div.container.main { margin: 12px auto; }

.main { margin: 0 auto !important; padding-bottom: 15px; background: #FFF; }

.nav-link-img a { display: block; background: transparent; transition: 200ms linear; }

.nav-link-img:hover a, .nav-link-img:focus a { background: #FFF; }

.nav-link-img img { transition: 200ms linear; filter: grayscale( 100% ); filter: brightness( 68% ); }

.nav-link-img.active img, .nav-link-img:hover img, .nav-link-img:focus img { filter: grayscale( 0% ); filter: brightness( 100% ); }

.blue-title { color: #39C; }

1. logo, .nav-link-img {

padding: 0.4% !important; }

1. logo {

text-align: center; }

1. title {

line-height: 1.1em; color: #222; }

.half-img { width: 50%; float: left; }

.full-img { width: 100%; }

/**

* MEDIA-QUERIES
*/

@media (max-width: 767px) { #title { margin: 4% 0 0 0; text-align: center; font-size: 4em; } #logo>img { width: 33.3333%; } .half-img { width: 100%; float: none; } }

@media (min-width: 768px) { #title { margin: 1% 0 0 0; font-size: 1.6em; } }

@media (min-width: 992px) { #title { margin: 1.4% 0 0 0; font-size: 2em; } }

@media (min-width: 1200px) { #title { margin: 1.8% 0 0 0; font-size: 2.2em; } }

/**

* CALLOUTS
*/

.callout { border-color: #EEE; border-image: none; border-radius: 3px; border-style: solid; border-width: 1px 1px 1px 5px; margin: 20px 0; padding: 20px; background: #FFF; }

.callout-info { border-left-color: #1b809e; }

/**

* SIDENAV
*/

1. sideNav {margin-top: 20px}
2. sideNav li>a {padding: 6px 0 6px 6px}
3. sideNav li>a:hover {padding-left: 4px;background: transparent;border-left: 2px solid #39C}
4. sideNav li.active>a {padding-left: 4px;font-weight: bold;border-left: 2px solid #39C}

.NsideNav_h3, .sideNav_h4 {display: none !important} .sideNav_h3 {padding-left: 12px}

h1, h2, h3 {margin: 0; padding: 20px 0 10px 0}