Template:Bielefeld-CeBiTec/css/stylesheet

/* WIKI SETTINGS*/

/* try for three level submenu */ .marginBottom-0 {margin-bottom:0;}

.dropdown-submenu{position:relative;} .dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;} .dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;} .dropdown-submenu:hover>a:after{border-left-color:#555;} .dropdown-submenu.pull-left{float:none;}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}


/* Hide first heading */ .firstHeading { display: none; }

/*-- Remove borders, float content left and remove padding/margin */

  1. globalWrapper, #content{

background-color: transparent; border: 0px; float: left; margin:0px; padding: 0px; }

/*left align Black Menu Bar */

  1. top_menu_inside {

margin-left: 20px; box-sizing: content-box; }

  1. top_menu_under {

border-bottom: 0px; }

  1. content {

width: auto; float: none; }


  1. top_menu_inside li {

font-size: 12px; }

/*

  1. top_menu_14 {

box-sizing: content-box; }

  1. menu_BarsBox h4 {

margin: 0px; font-weight: 700; font-size: 14px; line-height: 16px; }

  1. menu_BarsBox h5 {

font-weight: none; font-size: 12px; font-weight: 700; }

  1. menu_BarsBox ul li {

width: 100%; }

  • /
  1. top_menu_inside #user_item {

padding-top: 1px; }

  1. top_menu_inside #bars_item {

top: 0px; }


/* Navbar */

.navbar-fixed-top { top: 18px; padding-top: 2px; background-image: url("Bielefeld-CeBiTec_paper3.jpg"); background-size: cover; }

.navbar-default .navbar-nav > li > a { color: #333 }

.navbar-default .navbar-nav > li > a:hover { color: #9E1915

}

.navbar-default .navbar-brand { color: #333 }

.navbar-default .navbar-brand:hover { color: #9E1915 z-index: 9005; }

.navbar-default .navbar-nav > li { font-size: 18px; }

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { color: #9E1915; background-color: transparent; }

.navbar-default .navbar-nav > li > a.navbar-active { color: #9E1915; text-shadow: -1px 1px 8px #9E1915, 1px -1px 8px #fff; }

/* Festlegen des Breakpoints der Navbar (Anpassung an kleinere Bildschirme) */ @media (max-width: 1000px) { 

   .navbar-header {
       float: none;
   }
   .navbar-left,.navbar-right {
       float: none !important;
   }
   .navbar-toggle {
       display: block;
   }
   .navbar-collapse {
       border-top: 1px solid transparent;
       box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
   }
   .navbar-fixed-top {

border-width: 0 0 1px; } 

   .navbar-collapse.collapse {
       display: none!important;
   }
   .navbar-nav {
       float: none!important;

margin-top: 7.5px; } .navbar-nav>li { 

       float: none;
   }
   .navbar-nav>li>a {
       padding-top: 10px;
       padding-bottom: 10px;
   }
   .collapse.in{
 		display:block !important;

} .nomobile { display: none; }

  1. pagenav {

display: none; } }

@media (min-width: 1001px) { .navbar-header { display: none; } .navbar-nav{ display: flex; justify-content: space-between; width: 100%; } }

/* Entfernen der grauen Hinterlegung von ausgewählten Menüpunkten */ .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .active > a { background-image: none; box-shadow: none; }

/* Button auf kleinen Bildschirmen */ .navbar-default .navbar-toggle { border-color: #E41118; }

.navbar-default .navbar-toggle .icon-bar { background-color: #E41118; }

/* Farbwechsel des Logos in der Menüleiste */

  1. logo-cf{
   position: relative;
   width: 120px;
   height: 20px;
   top: -14px;

outline: 0; } div #logo-cf > img{ 

   display: block;
   width:90px;
   height: 48px;
   position: absolute;
   /* transitions */
   -webkit-transition: all 500ms linear;
      -moz-transition: all 500ms linear;
       -ms-transition: all 500ms linear;
        -o-transition: all 500ms linear;
           transition: all 500ms linear;

}

  1. logo-cf > img:nth-child(1){ /* first <img> child of
    */
   filter: alpha(opacity=100); /* IE stuff */
   opacity: 1;
   z-index: 2;

}

  1. logo-cf > img:nth-child(2){ /* second <img> child of
    */
   filter: alpha(opacity=0); /* IE stuff */
   opacity: 0;
   z-index: 1;

} /* hover */ /*

  1. logo-cf:hover > img:nth-child(1){ 
   filter: alpha(opacity=0);
   opacity: 0;
   z-index: 1;

}

  1. logo-cf:hover > img:nth-child(2){ 
   filter: alpha(opacity=100);
   opacity: 1;
   z-index: 2;

}

  • /

/* Aufleuchten des ausgewählten Menüpunkts */ a.glow, a.glow:hover, a.glow:focus { text-decoration: none; color: #aaf; text-shadow: none; -webkit-transition: text-shadow 500ms linear 0s; -moz-transition: text-shadow 500ms linear 0s; -o-transition: text-shadow 500ms linear 0s; transition: text-shadow 500ms linear 0s; outline: 0 none; }


a.glow:hover, a.glow:focus { color: #fff; text-shadow: -1px 1px 8px #9E1915, 1px -1px 8px #fff; }

/* Verhindern, dass der Inhalt unter die fixed navbar rutscht */ body { 

 padding-top: 80px;

} @media (max-width: 979px) { 

 body {
   padding-top: 60px;
 }

}

/* Öffnen der Navbar bei hover ul.nav li.dropdown:hover ul.dropdown-menu { display: block; margin-top:0px }*/


/* Scrollspy */

.page-nav, .nav-tabs { display: flex; justify-content: space-between; width: 100%; background-image: url("Bielefeld-CeBiTec_paper3.jpg"); }

.nav-tabs > li > a { 

   color: black;

}

.nav-tabs > li.active > a { 

   text-shadow: -1px 1px 8px #9E1915, 1px -1px 8px #fff;
   color: #9E1915;

}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-image: none; box-shadow: none; }


/* Allgemein */

img{ max-width: 100%; /* Wichtig für die Anzeige auf kleinen Bildschirmen */ height: auto; }

figcaption { font-size: 14px; font-style: italic; padding-top: 2px; text-align: justify; line-height: 1.5em; /* display: table-caption; caption-side: bottom ; */ }

figure { 

   max-width: 100%;
   height: auto;
   /* display: table;  */

margin-bottom: 20px; }

p { text-align: justify; font-size: 17px; }

li { font-size: 16px; }

ul.popuppunkte { list-style-image: url(none); }

  1. bodyContent a[href^="http://"], #bodyContent a[href^="gopher://"] {

outline: 0px; }


/* Notebook */

.notebook-overview h2{ font-size: 26px; font-weight: bold; }

.notebook-overview p{ text-align: justify; }

.notebook-overview a { 

   text-decoration: none;
   color: black;
   outline: 0;

}

.img-inactive { 

   opacity: 0.4;
   filter: alpha(opacity=40); /* For IE8 and earlier */

}

.img-inactive:hover { 

   opacity: 1;
   filter: alpha(opacity=100); /* For IE8 and earlier */

}

.img-notebook-nav { margin-left: 20px; height: 12%; width: 12%; }

.panel-default > .panel-heading { /* Kopfbereich des Notebooks */ background-image: linear-gradient(to bottom, #E91010 0px, #9F0000 100%); color: white; }

.notebook .panel-body > ul > li { /* Erste Ebene der Listen im Notebook */ font-weight: bold; font-size: 16px; }

.notebook .panel-body > ul > ul li { /* Zweite Ebene der Listen im Notebook (wenn einer eine geschicktere Art findet das zu adressieren gerne ;) ) */ font-size: 14px; }

.panel-title { 

 margin-top: 0;
 margin-bottom: 0;
 font-size: ceil((@font-size-base * 1.125));

}

.panel-title > a { 

   display: block;
   width: 100%
   color: inherit;
   text-decoration: none;
      outline: 0;

}

.panel-group.inneraccordion .panel-default > .panel-title { 

   font-weight: bold;

}

.panel-group.inneraccordion .panel { 

   border: 0px;
   box-shadow: none;

}

.notebook table { font-size: 14px; margin: 10px; }

.scientific { font-size: 17px; }


.notebook table td, .notebook table th, .scientific td, .scientific th { padding-right: 40px; }

.notebook th, .scientific th { border-bottom: 1px solid black; border-top: 1px solid black; }

.notebook tr:last-child, .scientific tr:last-child { border-bottom: 1px solid black; }

.parameters td { 

   vertical-align: super;
   padding-right: 10px;

}



/* Primers */

.primers-subheading { 

   font-size:16px;

font-weight:bold; /* background-color: #E91010; */ }

.table-hover > tbody > tr.primers-subheading:hover { /* background-color: #E91010; */ }

.primers{ font-size:14px; } .primers th{ font-size:16px; }



/* 5 gleiche Spalten in Bootstrap */

.col-xs-5ths, .col-sm-5ths, .col-md-5ths, .col-lg-5ths { 

   position: relative;
   min-height: 1px;
   padding-right: 10px;
   padding-left: 10px;

}

.col-xs-5ths { 

   width: 20%;
   float: left;

}

/* Portrait phones and smaller */ @media (max-width: 480px) {

}

/* Landscape phones and portrait tablets */ @media (max-width: 767px) {

}

/* Portrait tablets and small desktops */ @media (min-width: 768px) { 

   .col-sm-5ths {
       width: 20%;
       float: left;
   }

}

/* Landscape tablets and medium desktops */ @media (min-width: 992px) { 

   .col-md-5ths {
       width: 20%;
       float: left;
   }

}

/* Large desktops and laptops */ @media (min-width: 1200px) { 

   .col-lg-5ths {
       width: 20%;
       float: left;
   }

} 



   .featurette-divider {
margin: 80px 0; /* Space out the Bootstrap
more */ 
   }
   .featurette {
     padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */
     overflow: hidden;  /* Vertically center images part 2: clear their floats. */
   }
   .featurette-image {
    margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
   }

   /* Give some space on the sides of the floated elements so text doesn't run right into it. */
   .featurette-image.pull-left {
     margin-right: 40px;
   }
   .featurette-image.pull-right {
     margin-left: 40px;
   }

   /* Thin out the marketing headings */
   .featurette-heading {
     font-size: 50px;
     font-weight: 300;
     line-height: 1;
     letter-spacing: -1px;
   }

.lead { text-align: justify; }



/* Jumbotron */

.jumbotron { height: 300px; background-size: cover; position: relative; }

.jumbotron h1, .jumbotron p { 

   color: white;
   text-shadow: 0 0 5px black;

}

.jumbotron-text { position: absolute; bottom: 10px; }



.references p { font-size: 14px; }

/* Tabs */ .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { outline: 0; }

.nav > li > a:hover, .nav > li > a:focus { outline: 0; } 


 .affix {
     top: 0px;
     width: 100%;
 }

 .affix + .container-fluid {
     padding-top: 70px;
 }

.affix-top { 

   position: absolute;
   top: -70px;
   width: 100%;

}

.team { display: inline-block; margin-right: 20px; }

.check { 

   margin-bottom: 20px;
   margin-right: 15px;
   position: relative;
   top: 8px;

}


/* Footer */ .footer-distributed{ background-color: white; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12); box-sizing: border-box; width: 100%; text-align: left; font: bold 16px sans-serif;

padding: 55px 50px; margin-top: 80px; }

.footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right{ display: inline-block; vertical-align: top; }

/* Footer left */

.footer-distributed .footer-left{ width: 40%; }

/* The company logo */

.footer-distributed h3{ color: #ffffff; font: normal 36px 'Cookie', cursive; margin: 0; }

.footer-distributed h3 span{ color: #5383d3; }

/* Footer links */

.footer-distributed .footer-links{ color: #ffffff; margin: 20px 0 12px; padding: 0; }

.footer-distributed .footer-links a{ display:inline-block; line-height: 1.8; text-decoration: none; color: inherit; }

.footer-distributed .footer-company-name{ color: #8f9296; font-size: 14px; font-weight: normal; margin: 0; }

/* Footer Center */

.footer-distributed .footer-center{ width: 35%; }

.footer-distributed .footer-center i{ background-color: #33383b; color: #ffffff; font-size: 25px; width: 38px; height: 38px; border-radius: 50%; text-align: center; line-height: 42px; margin: 10px 15px; vertical-align: middle; }

.footer-distributed .footer-center i.fa-envelope{ font-size: 17px; line-height: 38px; }

.footer-distributed .footer-center p{ display: inline-block; color: #ffffff; vertical-align: middle; margin:0; }

.footer-distributed .footer-center p span{ display:block; font-weight: normal; font-size:14px; line-height:2; }

.footer-distributed .footer-center p a{ color: #5383d3; text-decoration: none;; }


/* Footer Right */

.footer-distributed .footer-right{ width: 20%; }

.footer-distributed .footer-company-about{ line-height: 20px; color: #92999f; font-size: 13px; font-weight: normal; margin: 0; }

.footer-distributed .footer-company-about span{ display: block; color: #ffffff; font-size: 14px; font-weight: bold; margin-bottom: 20px; }

.footer-distributed .footer-icons{ margin-top: 25px; }

.footer-distributed .footer-icons a{ display: inline-block; width: 35px; height: 35px; cursor: pointer; background-color: #33383b; border-radius: 2px;

font-size: 20px; color: #ffffff; text-align: center; line-height: 35px;

margin-right: 3px; margin-bottom: 5px; }

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {

.footer-distributed{ font: bold 14px sans-serif; }

.footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right{ display: block; width: 100%; margin-bottom: 40px; text-align: center; }

.footer-distributed .footer-center i{ margin-left: 0; }

}

.btn { border: none; }

.btn-next { white-space: normal; /* text-align: right; */ height: 100px; display: inline-table; margin-bottom: 20px; padding: 0px; }

.btn-next img { width: 100px; margin-left:10px; }

.btn-next p { vertical-align: middle; display: inline-block; color: black; font-size: 16px; text-align: center; }

.footer .btn-default, .btn-primary, .btn-success, .btn-info, .btn-warning, .btn-danger { box-shadow: none; }

.footer { 

   margin: 40px 0px 20px 0px;

}

/* Bootstrap fix Stockholm */

  1. top_menu_14, #top_menu_under, #top_menu_inside{

box-sizing: initial; }

  1. top_menu_inside {

margin-left: 20px; }

  1. bars_box, #menu_BarsBox, h5{

-webkit-box-sizing: initial; box-sizing: initial; line-height: normal; }

  1. menu_BarsBox > h5 {

color: rgb(0, 0, 0); font-family: arial, sans-serif; font-size: 12px; line-height: normal; margin-bottom: 0px; margin-top: 0px; font-weight: bold; }

.accordion-content li { line-height: 18px; -webkit-box-sizing: initial; box-sizing: initial; }

.accordion-header, .active-header, .accordion-header_noaction { -webkit-box-sizing: initial; box-sizing: initial; color: rgb(101, 100, 89); font-family: Arial, Gadget, sans-serif; font-size: 13.92px; font-weight: bold; line-height: normal; margin: 0;

}