Team:TU-Munich/TUM13 wiki.css

/* iGEM TU-Munich Stylesheet by Florian Albrecht (albrecht.flo@gmx.net)
   if you want to use parts of this on your wiki, cite us and / or write an e-mail to us */

/* Start general style ================================================== */

/* Add Sketch-rockwell for menu and headings (hosted on dropbox.com) */
@font-face {
    font-family: 'sketch_rockwell';
    src: url('https://dl.dropboxusercontent.com/s/c2su1zy22xs6x9k/sketchrockwell-bold-webfont.eot');
    src: url('https://dl.dropboxusercontent.com/s/c2su1zy22xs6x9k/sketchrockwell-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('https://dl.dropboxusercontent.com/s/gnktv67746ccx42/sketchrockwell-bold-webfont.woff') format('woff'),
         url('https://dl.dropboxusercontent.com/s/b6g9lp8shab463r/sketchrockwell-bold-webfont.ttf') format('truetype'),
         url('https://dl.dropboxusercontent.com/s/cbfupthn2al3xk1/sketchrockwell-bold-webfont.svg#sketch_rockwellregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'sketch_rockwell';
        src: url('https://dl.dropboxusercontent.com/s/cbfupthn2al3xk1/sketchrockwell-bold-webfont.svg#sketch_rockwellregular') format('svg');
    }
}

/* Beige noisy bg and default font */
html body {
    background: #ded6ca url('https://static.igem.org/mediawiki/2013/a/a3/TUM13_paper-bg.png') repeat;
    color: #000000;
    font-family: Helvetica,Arial,Verdana,sans-serif;
}

/* Upper brown and green bg */
div#globalWrapper {
    background: url('https://static.igem.org/mediawiki/2013/0/0c/TUM13_green-bg.png') repeat-x 50% 0%;
}

/* End general style ==================================================== */


/* Start top-section style ============================================== */

/* Remove logo and search */
div#p-logo, div#search-controls {
    display: none;
}

/* Center wiki-menu; set font & bg (as fallback) color */
div#top-section {
    margin: 0px auto;
    width: 930px;
    height: 20px;
    color: #d4c6b6;
    background: #411c03 url('https://static.igem.org/mediawiki/2013/b/b3/TUM13_brown-top-bg.png') repeat-x 50% 0%;
}

/* Set font and positions */
div#menubar {
    font-weight: bold;
    font-size: 13px;
    line-height: 20px;
}

div#menubar.right-menu {
    float: right;
}

div#menubar.left-menu {
    float: left;
}

/* Fix text */
div#menubar.left-menu a, div#menubar.left-menu li {
    text-transform: capitalize;
}

div#menubar li {
    padding: 0px 5px;
    display: inline;
}

/* White on hover */
div#menubar a:hover {
    color: #FFFFFF;
    text-decoration: none;
}

div#menubar li[style="color:white;cursor:default"] {
    display: none;
}

/* End top-section style ================================================ */


/* Start header style =================================================== */

/* Hide page title (it would appear before the header) */
h1.firstHeading {
    display: none;
}

/* Header-bg and positioning */
div#header-container {
    background: url('https://static.igem.org/mediawiki/2013/b/bf/TUM13_page-bg-top.png') no-repeat 50% 0%;
    height: 217px;
    padding-top: 30px;
}

/* Header positioning */
div#header {
    width: 920px;
    height: 130px;
    margin: 0px auto;
    padding: 5px 20px 0px;
    overflow: visible;
}

/* Logos */
div#header img#physco-logo {
    display: block;
    height: 130px;
    margin-left: 303px;
}

div#header img#igem-logo {
    display: block;
    margin-top: 40px;
    height: 95px;
    float: right;
}

div#header img#tum-logo {
    display: block;
    margin-top: 15px;
    height: 120px;
    float: left;
}

/* End header style ===================================================== */


/* Start menu style ===================================================== */

/* Menu-bg and spacing*/
div#menu {
    background: url('https://static.igem.org/mediawiki/2013/a/a8/TUM13_menu-bg.png') no-repeat 50% 0%;
    height: 60px;
    padding: 5px 0px 17px;
}

div#menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Position menu and set font color */
div#menu > ul {
    margin: 0px auto;
    width: 960px;
    height: 60px;
    color: #411c03;
}

/* Position menu elements and set font */
div#menu > ul > li {
    float: left;
    width: 137px;
    height: 44px;
    padding: 8px 0px 8px;
    text-align: center;
    position: relative;
    font: normal 24px/44px sketch_rockwell,Arial,sans-serif;
}

div#menu > ul > li > a {
    display: block;
    width: 137px;
    height: 44px;
    color: inherit;
}

/* Hover effect */
div#menu > ul > li > a:hover {
    background: url('https://static.igem.org/mediawiki/2013/9/95/TUM13_menu-highlight.png') repeat-x 50% 50%;
}

div#menu > ul > li > a:hover {
    text-decoration: none;
}

/* Style and hide submenu */
div#menu > ul > li > ul {
    border-left: solid 1px #411c03;
    border-right: solid 1px #411c03;
    width: 135px;
    background: #7cac2c;
    display: none;
    position: absolute;
    top: 60px;
    z-index: 9998;
}

/* Style submenu elements */
div#menu > ul > li > ul > li {
    background: url('https://static.igem.org/mediawiki/2013/4/4e/TUM13_submenu-bg.png') repeat-y 50% 50%;
    padding: 0px 10px;
    text-align: left;
    border-bottom: solid 1px #411c03;
    font: bold 13px/20px Helvetica,Arial,Verdana,sans-serif;
}

div#menu > ul > li > ul > li > a {
    display: block;
    width: 115px;
    padding: 5px 0px;
    color: inherit;
}

/* Hover effect */
div#menu > ul > li > ul > li:hover {
    background: url('https://static.igem.org/mediawiki/2013/d/db/TUM13_submenu-highlight.png') repeat-y 50% 50%;
}

div#menu > ul > li > ul > li > a:hover {
    text-decoration: none;
}

/* Show submenu on hover */
div#menu > ul > li:hover > ul {
    display: block;
}

/* End menu style ======================================================= */


/* Start content style ================================================== */

div#bodyContent > p, div#contentSub, div#catlinks, table#toc.toc {
    display: none;
}

/* top button */
div#social-footer a#gotop {
    display: block;
    width: 40px;
    height: 40px;
    padding: 10px;
    background: url('https://static.igem.org/mediawiki/2013/2/2d/TUM13_gotop.png') no-repeat 50% 50%;
    position: fixed;
    bottom: 15px;
    right: 15px;
}

div#social-footer  a#gotop:hover {
    background: url('https://static.igem.org/mediawiki/2013/c/c5/TUM13_gotop-highlight.png') no-repeat 50% 50%;
}

/* Set page-bg */
div#wikicontent-container {
    background: url('https://static.igem.org/mediawiki/2013/a/ac/TUM13_page-bg-middle.png') repeat-y 50% 0%;
    padding: 2px 0px 1px;
}

div#wikicontent > :first-child {
    margin-top: 0px;
}

div#wikicontent > :last-child {
    margin-bottom: 0px;
}

/* Font and position */
div#wikicontent {
    font-size: 14px;
    line-height: 21px;
    background: #e9e3dd;
    width: 920px;
    margin: 0px auto;
    padding: 0px 20px;
    text-align: justify;
    position: relative;
}

/* Lower page border */
div#bodyContent > div.visualClear {
    background: url('https://static.igem.org/mediawiki/2013/6/6e/TUM13_page-bg-bottom.png') no-repeat 50% 0%;
    height: 50px;
}

/* Standard elements */
div#wikicontent p {
    margin: 0 0 1em;
}

div#wikicontent ul {
    padding-left: 2em;
    list-style: disc outside;
}

div#wikicontent div.achievements ul {
    list-style: none;
    padding-left: 0.4em;
}

div#wikicontent div.achievements ul li {
    background: url('https://static.igem.org/mediawiki/2013/d/d8/TUM13_checkmark-small.png') no-repeat 0% 50%;
    padding-left: 40px;
    line-height: 32px;
    margin: 0px;
}

div#wikicontent ol {
    padding-left: 2em;
    list-style: decimal outside;
}

div#wikicontent li {
    margin-bottom: 0.5em;
}

div#wikicontent a {
    color: #7cac2c;
}

div#bodyContent a[href^="https://"], div#bodyContent a[href^="mailto:"], #bodyContent .link-https {
    background: transparent;
    padding: 0px;
}

div#wikicontent a:hover {
    text-decoration: underline;
}

/* Headings */
div#wikicontent h1, div#wikicontent h2, div#wikicontent h3, div#wikicontent h4, div#wikicontent h5, div#wikicontent h6 {
    font-weight: bold;
    line-height: 1.5;
    margin: 1em 0em 0.5em;
    clear: both;
    text-align: left;
}

div#wikicontent .editsection {
    color: #7cac2c;
    font-family: Helvetica,Arial,Verdana,sans-serif;
}

div#wikicontent h1, div#wikicontent h2 {
    color: #502204;
    font: normal 2em/1.35 sketch_rockwell,Arial,sans-serif;
    border-bottom: 2px solid #502204;
}

div#wikicontent h3 {
    font-size: 1.5em;
}

div#wikicontent h4 {
    font-size: 1.25em;
}

div#wikicontent h5, div#wikicontent h6 {
    font-size: 1.0em;
}

/* Pictures */
div#wikicontent div.thumb {
    border: none;
}

div#wikicontent div.thumb div.thumbinner {
    background: #ded6ca;
    border: none;
    font-size: 12px;
    line-height: 23px;
    overflow: hidden;
    padding: 5px 4px 2px !important;
    text-align: center;
}

div#wikicontent div.thumb div.thumbinner a img {
    border: none;
    padding-bottom: 3px;
}

div#wikicontent div.thumb div.thumbinner div.thumbcaption {
    background: transparent;
    font-size: inherit;
    line-height: inherit;
    overflow: hidden;
    padding: 0px 5px !important;
}

div#wikicontent div.thumb div.thumbinner div.thumbcaption div.magnify {
    display: none;
}

div#wikicontent div.tright {
    clear: right;
    margin: 0 0 1em 1em;
}

div#wikicontent div.tleft {
    clear: left;
    margin: 0 1em 1em 0;
}

div#wikicontent div.center div.tnone {
    clear: both;
    margin: 0 0 1em;
}

/* Tables */
div#wikicontent table {
    background: #ded6ca;
    border: 1px solid #502204;
    margin: 0 auto 1em;
}

div#wikicontent table.left {
    float: left;
    clear: left;
    margin: 0 1em 1em 0;
}


div#wikicontent table.right {
    float: right;
    clear: right;
    margin: 0 0 1em 1em;
}

div#wikicontent table.safety td, div#wikicontent table.safety th {
    text-align: left;
    vertical-align: top;
}

div#wikicontent table caption {
    text-align: left;
    font-size: 12px;
    line-height: 18px;
}

div#wikicontent td, div#wikicontent th {
    border: 1px solid #502204;
    padding: 2px 5px;
}

div#wikicontent th {
    background: #d4c6b6;
    font-weight: bold;
    text-align: center;
}

div#wikicontent table code {
    background: transparent;
}

/* Fix AutoAnnotator */
div#wikicontent table#AutoAnnotator, div#wikicontent table#AutoAnnotator table {
    background: #ffffff;
    border: 1px solid #000000;
    font-size: 12px;
    line-height: 18px;
    margin-bottom: 0px;
}

div#wikicontent table#AutoAnnotator td, div#wikicontent table#AutoAnnotator th {
    border: 1px solid #000000;
    padding: 1px;
}

div#wikicontent table#AutoAnnotator table.AutoAnnotatorNoBorder {
    border: none;
}

div#wikicontent table#AutoAnnotator table.AutoAnnotatorNoBorder td, div#wikicontent table#AutoAnnotator table.AutoAnnotatorNoBorder th {
    border: none;
}

div#wikicontent table#AutoAnnotator table.AutoAnnotatorWithBorder {
    border: 1px solid #000000;
}

div#wikicontent table#AutoAnnotator table.AutoAnnotatorWithBorder td, div#wikicontent table#AutoAnnotator table.AutoAnnotatorWithBorder th {
    border: 1px solid #000000;
}

div#wikicontent table#AutoAnnotator th {
    background: rgb(221, 221, 221);
}

div#wikicontent div#autoannotator-computing {
    text-align: center;
}

/* Fix parts table */
div#groupparts {
    width: 920px !important;
}

div#groupparts td {
    background: #ded6ca;
}

/* Sponsors */
div#wikicontent a.sponsor {
    display: block;
    float: left;
    width: 286px;
    height: 100px;
    margin: 10px;
    background: #FFFFFF;
    position: relative;
}

div#wikicontent a.sponsor img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

div#wikicontent div.sponsor {
    background: #ded6ca;
    height: 215px;
    margin-bottom: 20px;
    padding: 0px;
    clear: both;
}

div#wikicontent div.sponsor a.sponsor {
    width: 320px;
    height: 215px;
    margin: 0 1em 0 0;
}

div#wikicontent div.sponsor p {
    padding: 1em;
}

div div#wikicontent div.overview {
    height: 240px;
    width: 440px;
    padding: 0px 0px 0px 10px;
}

div#wikicontent div.overview img {
    float: right;
    margin: 0px 0px 0px 10px;
}

div#wikicontent div.overview h3 {
    margin: 5px 0px 0px;
    clear: none;
}

div#wikicontent div.overview span.editsection {
    display: none;
}

/* Boxes */
div#wikicontent div.box-right {
    width: 430px;
    background: #ded6ca;
    margin: 0px 0px 20px 10px;
    padding: 10px 10px 0px;
    clear: right;
    float: right;
}

div#wikicontent div.box-left {
    width: 430px;
    background: #ded6ca;
    margin: 0px 10px 20px 0px;
    padding: 10px 10px 0px;
    clear: left;
    float: left;
}

div#wikicontent div.team.box-left, div#wikicontent div.team.box-right {
    height: 620px;
}

div#wikicontent div.team div, div#wikicontent div.team a img {
    float: right;
    position: relative;
    margin: 0 0 10px 10px;
    background: url('https://static.igem.org/mediawiki/2013/4/4d/TUM13_computing.gif') no-repeat 50% 50%;
}

div#wikicontent div.team div.portrait {
    width: 200px;
    height: 356px;
}

div#wikicontent div.team div.landscape {
    width: 300px;
    height: 169px;
}

div#wikicontent div.team div img {
    position: absolute;
    top: 0;
    left: 0;
}

div#wikicontent div.team div img.top {
    z-index: 20;
}

div#wikicontent div.team div:hover img.top {
    visibility: hidden;
}

div#wikicontent div.team div img.bottom {
    z-index: 10;
}

div#wikicontent div.box-definition {
    width: 320px;
    background: #ded6ca;
    margin: 0 0 1em 1em;
    padding: 10px 10px 0px;
    clear: right;
    float: right;
    font-size: 12px;
    line-height: 18px;
}

div#wikicontent div.box-definition p {
    margin-bottom: 10px;
}

div#wikicontent div.box-center {
    background: #ded6ca;
    margin-bottom: 20px;
    padding: 10px;
    clear: both;
}

div#wikicontent div.team h4 {
    margin-top: 0px;
}

div#wikicontent div.quote {
    margin: 0px 1.5em;
    padding: 0.5em 0.7em;
    background: #ded6ca;
    font-style: italic;
}

div#wikicontent div.quote p {
    margin: 0px;
}

div#wikicontent div.quote div.author {
    text-align: right;
    font-style: normal;
}

/* Buttons */

div#wikicontent a.tour {
    display: block;
    font: normal 24px/40px sketch_rockwell,Arial,sans-serif;
    color: #411c03;
    text-align: center;
    text-decoration: none;
}

div#wikicontent a.tour.start {
    float: right;
    width: 205px;
    height: 40px;
    padding: 5px 7px 5px 38px;
    background: url('https://static.igem.org/mediawiki/2013/3/36/TUM13_tour-start.png') no-repeat 50% 50%;
}

div#wikicontent a.tour.start:hover {
    background: url('https://static.igem.org/mediawiki/2013/5/5f/TUM13_tour-start-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.tour.previous {
    float: left;
    width: 135px;
    height: 40px;
    padding: 5px 5px 5px 25px;
    margin-bottom: 20px;
    background: url('https://static.igem.org/mediawiki/2013/f/fc/TUM13_tour-previous.png') no-repeat 50% 50%;
}

div#wikicontent a.tour.previous:hover {
    background: url('https://static.igem.org/mediawiki/2013/6/6e/TUM13_tour-previous-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.tour.next {
    float: right;
    width: 135px;
    height: 40px;
    padding: 5px 25px 5px 5px;
    margin-bottom: 20px;
    background: url('https://static.igem.org/mediawiki/2013/c/c6/TUM13_tour-next.png') no-repeat 50% 50%;
}

div#wikicontent a.tour.next:hover {
    background: url('https://static.igem.org/mediawiki/2013/3/35/TUM13_tour-next-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button {
    display: block;
    float: left;
    width: 131px;
    height: 20px;
    padding: 11px 7px 114px;
    margin-left: 10px;
    font: normal 16px/20px sketch_rockwell,Arial,sans-serif;
    color: #411c03;
    text-align: center;
    text-decoration: none;
}

div#wikicontent a.button.application {
    margin-left: 0px;
    background: url('https://static.igem.org/mediawiki/2013/7/7b/TUM13_button-application.png') no-repeat 50% 50%;
}

div#wikicontent a.button.application:hover {
    background: url('https://static.igem.org/mediawiki/2013/4/44/TUM13_button-application-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button.autoannotator {
    background: url('https://static.igem.org/mediawiki/2013/4/43/TUM13_button-autoannotator.png') no-repeat 50% 50%;
}

div#wikicontent a.button.autoannotator:hover {
    background: url('https://static.igem.org/mediawiki/2013/a/a7/TUM13_button-autoannotator-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button.physco {
    background: url('https://static.igem.org/mediawiki/2013/7/77/TUM13_button-physco.png') no-repeat 50% 50%;
}

div#wikicontent a.button.physco:hover {
    background: url('https://static.igem.org/mediawiki/2013/d/d5/TUM13_button-physco-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button.entrepreneur {
    background: url('https://static.igem.org/mediawiki/2013/e/e1/TUM13_button-entrepreneur.png') no-repeat 50% 50%;
}

div#wikicontent a.button.entrepreneur:hover {
    background: url('https://static.igem.org/mediawiki/2013/e/e6/TUM13_button-entrepreneur-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button.safety {
    background: url('https://static.igem.org/mediawiki/2013/4/4f/TUM13_button-safety.png') no-repeat 50% 50%;
}

div#wikicontent a.button.safety:hover {
    background: url('https://static.igem.org/mediawiki/2013/0/01/TUM13_button-safety-highlight.png') no-repeat 50% 50%;
}

div#wikicontent a.button.judging {
    background: url('https://static.igem.org/mediawiki/2013/4/47/TUM13_button-judging.png') no-repeat 50% 50%;
}

div#wikicontent a.button.judging:hover {
    background: url('https://static.igem.org/mediawiki/2013/d/d6/TUM13_button-judging-highlight.png') no-repeat 50% 50%;
}

div#wikicontent div#ajax-overlay {
    width: 100%;
    height: 100%;
    z-index: 9996;
    position: absolute;
    top: 0;
    left: 0;
    background: url('https://static.igem.org/mediawiki/2013/2/29/TUM13_ajax-bg.png') repeat 0% 0%;
}

div#wikicontent div#ajax-overlay img {
    position: absolute;
    z-index: 9997;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}

/* End content style ==================================================== */


/* Start footer style =================================================== */

/* Makes the footer stick to the bottom */
html, body {
    height: 100%;
} 

body > div#globalWrapper {
    position: relative;
    height: auto;
    min-height: 100%;
    margin: 0px auto -156px;
}

div#globalWrapper > div.visualClear {
    height: 156px;
}

div#footer-box {
    background: url('https://static.igem.org/mediawiki/2013/c/c3/TUM13_footer-bg.png') repeat-x 50% 0%;
    padding: 5px 0px 10px;
    height: 141px;
    width: 100%;
    position: absolute;
    bottom: 0px;
    color: #d4c6b6;
    font-weight: normal;
    font-size: 12px;
    line-height: 18px;
}

div#social-footer {
    width: 940px;
    height: 95px;
    margin: 0px auto;
    padding: 0px 10px 10px;
}

div#social-footer div#annotator, div#social-footer div#address, div#social-footer div#follow {
    width: 293px;
    height: 95px;
    margin: 0px 10px;
    float: left;
}

div#social-footer h2 {
    font: normal 28px/42px sketch_rockwell, Arial, sans-serif;
    text-align: center;
    margin: 0px;
}

div#social-footer div#annotator {
    text-align: center;
}

div#social-footer div#annotator input {
    font-size: 12px;
    padding: 2px 5px;
}

div#social-footer div#annotator input[type="text"] {
    margin: 0px 0px 5px;
    border: 1px solid #502204;
    background: #d4c6b6;
    width: 275px;
}

div#social-footer div#address p {
    margin: 0px;
    width: 50%;
    float: left;
}

div#social-footer div#follow a {
    display: block;
    width: 32px;
    height: 32px;
    margin: 9px;
    float: left;
}

div#social-footer div#follow div {
    margin: 3px 21px 0px;
}

div#social-footer div#follow a#adress {
    background: url('https://static.igem.org/mediawiki/2013/4/4b/TUM13_address-icon.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#adress:hover {
    background: url('https://static.igem.org/mediawiki/2013/0/05/TUM13_address-highlight.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#mail {
    background: url('https://static.igem.org/mediawiki/2013/d/d8/TUM13_contact-icon.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#mail:hover {
    background: url('https://static.igem.org/mediawiki/2013/c/c7/TUM13_contact-icon-highlight.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#facebook {
    background: url('https://static.igem.org/mediawiki/2013/c/cb/TUM13_facebook-icon.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#facebook:hover {
    background: url('https://static.igem.org/mediawiki/2013/9/9f/TUM13_facebook-icon-highlight.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#twitter {
    background: url('https://static.igem.org/mediawiki/2013/3/34/TUM13_twitter-icon.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#twitter:hover {
    background: url('https://static.igem.org/mediawiki/2013/2/22/TUM13_twitter-icon-highlight.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#youtube {
    background: url('https://static.igem.org/mediawiki/2013/4/49/TUM13_youtube-icon.png') no-repeat 50% 50%;
}

div#social-footer div#follow a#youtube:hover {
    background: url('https://static.igem.org/mediawiki/2013/a/a1/TUM13_youtube-icon-highlight.png') no-repeat 50% 50%;
}

div#footer {
    width: 920px;
    margin: 0px auto;
    padding: 0px 20px;
    text-align: center;
}

div#footer ul {
   margin: 0;
   padding: 0;
}

div#footer li {
    padding: 0px 5px;
    display: inline;
}

div#footer li#t-recentchangeslinked {
    display: none;
}

div#footer-box a {
    color: inherit;
}

div#footer-box a:hover {
    text-decoration: underline;
}

div#footer div#f-poweredbyico {
    margin-top: 3px;
    float: right;
}

div#footer div#f-copyrightico {
    margin-top: 3px;
    float: left;
}

/* End footer style ===================================================== */