Difference between revisions of "Template:Freiburg/test"

Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
 +
 +
 +
 +
/* =================== CSS Navigation =================== */
 +
/* Resetting css coming from wiki itself
 +
/* Clearing DokuWiki elements
 +
/* Declare Fonts for non-Windows machines
 +
/* CSS for Menubar
 +
/* Important Site setup
 +
/* Background
 +
/* Text Styling
 +
/* Full Width Banners
 +
/* Footer
 +
/*
 +
/* Flipcard-CSS for the members-section: inline in https://2015.igem.org/Team:Freiburg/Team
 +
/* CSS-slider: inline for the respective pages. e.g. https://2015.igem.org/wiki/index.php?title=Team:Freiburg/PaP/ScienceFair
 +
/* CSS classes and ids for Human Practice
 +
/* CSS for back-button
 +
/* CSS for the upwards-blob: on wiki_content_start
 +
/* =================== END: CSS Navigation =================== */
 +
 +
 +
 
/* ============= Resetting css coming from wiki itself ============= */
 
/* ============= Resetting css coming from wiki itself ============= */
 
body {
 
body {
Line 7: Line 30:
 
     margin: 0px;
 
     margin: 0px;
 
     padding: 0px;
 
     padding: 0px;
     background-color: #AAA;
+
     background-color: #FCFCFC;
 
line-height: 1.8;
 
line-height: 1.8;
 
}
 
}
Line 31: Line 54:
  
 
#mainContainer {   
 
#mainContainer {   
margin: 0;
+
    margin: 0;
width: 100%;
+
    width: 100%;
 
}
 
}
  
Line 90: Line 113:
 
}
 
}
  
 +
 +
/* removes URL from current site from the top of the window */
 +
.firstHeading{
 +
    font-size: 0;
 +
    border: 0;
 +
    margin-bottom: -8px;
 +
}
  
 
/* ============= END: Resetting css coming from wiki itself ============= */
 
/* ============= END: Resetting css coming from wiki itself ============= */
  
  
/* ============= Declare Fonts for non-Windows machines ============= */
 
  
 +
 +
 +
 +
 +
 +
/* ============= Clearing DokuWiki elements ============= */
 +
 +
.tags{
 +
/* remove tags from bottom */
 +
    font-size: 0;
 +
}
 +
 +
acronym{
 +
/* remove text-decoration from acronyms*/
 +
    border-bottom: none;
 +
    text-decoration: none;
 +
    cursor: auto;
 +
}
 +
 +
/* ============= END: Clearing DokuWiki elements ============= */
 +
 +
 +
 +
 +
 +
 +
 +
 +
/* ============= Declaring Fonts  ============= */
  
 
@font-face {
 
@font-face {
 
     font-family: Candara;
 
     font-family: Candara;
 +
    src: url(https://static.igem.org/mediawiki/2015/d/dd/Freiburg_Candara.eot);
 
     src: url(https://static.igem.org/mediawiki/2015/6/6c/Freiburg_Candara.ttf) format('truetype');
 
     src: url(https://static.igem.org/mediawiki/2015/6/6c/Freiburg_Candara.ttf) format('truetype');
  
 
}
 
}
 
 
@font-face {
 
@font-face {
 
     font-family: Candara;
 
     font-family: Candara;
Line 112: Line 170:
 
     font-family: Candara;
 
     font-family: Candara;
 
     src: url(https://static.igem.org/mediawiki/2015/3/3e/Freiburg_Candarai.ttf)  format('truetype');
 
     src: url(https://static.igem.org/mediawiki/2015/3/3e/Freiburg_Candarai.ttf)  format('truetype');
  font-weight: normal;
+
    font-weight: normal;
  font-style: italic;
+
    font-style: italic;
 
}
 
}
  
 
@font-face {
 
@font-face {
 
     font-family: Roboto;
 
     font-family: Roboto;
     src: url(https://static.igem.org/mediawiki/2015/c/c3/Freiburg_Roboto-Regular.ttf) format('truetype');
+
     src: url(https://static.igem.org/mediawiki/2015/e/ee/Freiburg_Roboto-Regular.eot);
 
+
    src: url(https://static.igem.org/mediawiki/2015/b/bf/Freiburg_Roboto-Regular-webfont.woff) format('woff'),
 +
    url(https://static.igem.org/mediawiki/2015/c/c3/Freiburg_Roboto-Regular.ttf) format('truetype'),
 +
    url('https://static.igem.org/mediawiki/2015/3/38/Freiburg_Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
 +
}
 +
@font-face {
 +
  font-family: Roboto;
 +
  src: url(https://static.igem.org/mediawiki/2015/7/7f/Freiburg_Roboto-Light.eot);
 +
  src: url(https://static.igem.org/mediawiki/2015/2/28/Freiburg_Roboto-Light-webfont.woff) format('woff'),
 +
  url(https://static.igem.org/mediawiki/2015/6/64/Freiburg_Roboto-Light.ttf)  format('truetype'),
 +
  url('https://static.igem.org/mediawiki/2015/8/87/Freiburg_Roboto-Light-webfont.svg#RobotoLight') format('svg');
 +
  font-style: normal;
 +
  font-weight: 300;
 +
 
 
}
 
}
 
 
@font-face {
 
@font-face {
 
     font-family: Roboto;
 
     font-family: Roboto;
     src: url(https://static.igem.org/mediawiki/2015/b/b9/Freiburg_Roboto-Bold.ttf)  format('truetype');
+
     src: url(https://static.igem.org/mediawiki/2015/4/40/Freiburg_Roboto-Bold.eot);
 +
    src: url(https://static.igem.org/mediawiki/2015/e/e4/Freiburg_Roboto-Bold-webfont.woff) format('woff'),
 +
    url(https://static.igem.org/mediawiki/2015/b/b9/Freiburg_Roboto-Bold.ttf)  format('truetype'),
 +
    url('https://static.igem.org/mediawiki/2015/4/40/Freiburg_Roboto-Bold-webfont.svg#RobotoBold') format('svg');
 
     font-weight: bold;
 
     font-weight: bold;
 
     font-style: normal;
 
     font-style: normal;
Line 130: Line 202:
 
@font-face {
 
@font-face {
 
     font-family: Roboto;
 
     font-family: Roboto;
     src: url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Roboto-Italic.ttf)  format('truetype');
+
     src: url(https://static.igem.org/mediawiki/2015/0/0f/Freiburg_Roboto-Italic.eot);
  font-weight: normal;
+
    src: url(https://static.igem.org/mediawiki/2015/6/6f/Freiburg_Roboto-Italic-webfont.woff) format('woff'), url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Roboto-Italic.ttf)  format('truetype'),
  font-style: italic;
+
    url('https://static.igem.org/mediawiki/2015/8/8f/Freiburg_Roboto-Italic-webfont.svg#RobotoItalic') format('svg');
 +
    font-weight: normal;
 +
    font-style: italic;
 
}
 
}
 
@font-face {
 
@font-face {
 
     font-family: Roboto;
 
     font-family: Roboto;
     src: url(https://static.igem.org/mediawiki/2015/2/2f/Freiburg_Roboto-BoldItalic.ttf)  format('truetype');
+
     src: url(https://static.igem.org/mediawiki/2015/c/ce/Freiburg_Roboto-BoldItalic.eot);
  font-weight: bold;
+
    src: url(https://static.igem.org/mediawiki/2015/8/89/Freiburg_Roboto-BoldItalic-webfont.woff)  format('woff'),
  font-style: italic;
+
    url(https://static.igem.org/mediawiki/2015/2/2f/Freiburg_Roboto-BoldItalic.ttf)  format('truetype'),
 +
    url('https://static.igem.org/mediawiki/2015/a/ac/Freiburg_Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg');
 +
    font-weight: bold;
 +
    font-style: italic;
 
}
 
}
  
  
  
/* ============= END: Declare Fonts for non-Windows machines  ============= */
+
 
 +
/* ============= END: Declaring Fonts   ============= */
 +
 
 +
 
 +
 
  
  
Line 151: Line 232:
 
#menubar {
 
#menubar {
 
     font-size: 16px;
 
     font-size: 16px;
background-color: #5781bd;
+
    background-color: #5781bd;
display: table;
+
    display: table;
width: 100%;
+
    width: 100%;
height: 70px;
+
    height: 70px;  
border-collapse: collapse;
+
    border-collapse: collapse;
border: none;
+
    border: none;
  
 
}
 
}
Line 162: Line 243:
 
/*The sub (and subsubs) items of the menu*/
 
/*The sub (and subsubs) items of the menu*/
 
#menubar ul li ul li{
 
#menubar ul li ul li{
width: 200px;
+
    width: 200px;
height: 30px;
+
    height: 30px;
margin-top: 2px;
+
    margin-top: 2px;
 
}
 
}
 
/*The first (horizontal) line of menu items*/
 
/*The first (horizontal) line of menu items*/
 
#menubar > ul{
 
#menubar > ul{
  
position: relative;
+
    position: relative;
margin-top: 25;
+
    margin-top: 25;
left: 50%;
+
    left: 50%;
display: block;
+
    display: block;
transform: translate(-50%,0%);
+
    transform: translate(-50%,0%);
 
}
 
}
  
 
#menubar ul ul {
 
#menubar ul ul {
background-color: #5781bd;
+
    background-color: #5781bd;
display: none;
+
    display: none;
position: absolute;
+
    position: absolute;
margin-left: 0px;
+
    margin-left: 0px;
float: left;
+
    float: left;
margin-top:0px;
+
    margin-top:0px;
 
}
 
}
 
#menubar ul ul li{
 
#menubar ul ul li{
display: block;
+
    display: block;
margin-left: 0px;
+
    margin-left: 0px;
 
}
 
}
  
 
#menubar ul li {
 
#menubar ul li {
width: 100px;
+
    width: 100px;
display: table-cell;
+
    display: table-cell;
font-family: "Roboto","Arial";
+
    font-family: "Roboto",sans-serif;
 
}
 
}
  
 
#menubar ul a{
 
#menubar ul a{
text-decoration: none;
+
    text-decoration: none;
color: #FFFFFF;
+
    color: #FFFFFF;
font-style: bold;
+
    font-style: bold;
text-align: left;
+
    text-align: left;
 
}
 
}
  
 
#menubar ul a:visited{
 
#menubar ul a:visited{
display: block;
+
    display: block;
text-decoration: none;
+
    text-decoration: none;
color: #FFFFFF;
+
    color: #FFFFFF;
font-style: bold;
+
    font-style: bold;
 
}
 
}
 
#menubar ul li:hover > ul{
 
#menubar ul li:hover > ul{
color: #EEEE00;
+
    color: #EEEE00;
display: block;
+
    display: block;
padding-top: 0px;
+
    padding-top: 0px;
padding-left: 20px;
+
    padding-left: 20px;
 
}
 
}
 
#menubar ul li:hover{
 
#menubar ul li:hover{
color: #EEEE00;
+
    color: #EEEE00;
 
}
 
}
  
 
/* ============= END: CSS for Menubar ============= */
 
/* ============= END: CSS for Menubar ============= */
  
/* ============= Important Site setup ============= */
 
  
  
 +
 +
/* ============= Important Site setup ============= */
 +
 +
/* properties for central text box */
 
.content_background_wrapper{
 
.content_background_wrapper{
 +
    overflow: hidden;
 +
    box-sizing: border-box;
 +
/* REMOVE WITH NEW NAVIGATION */
 +
/* Avoid layout damage due to old navigation */
 +
    clear: both;
 +
}
  
position: relative;
+
/* flows around all the content in the center of the screen */
background-color: #f9f9f9;
+
.page_content{
overflow:hidden;
+
    margin: 20px 5px;
 +
    box-sizing: border-box; /* allows for efficient paositioning of the elements within */
 +
}
  
 +
/* flows around text in the page_content */
 +
.content_box{
 +
    border-radius: 30px 60px;
 +
    overflow: hidden;
 +
    padding: 4%;
 +
    margin: 2em 0;
 +
    margin-bottom: 0;
 
}
 
}
.central_position_wrap{
+
 
float: left;
+
 
max-width: 1000px;
+
/* flexbox: contains the whole dokuwiki image part and renders it readable
 +
/* flexbox images are placed in one row and break the text.
 +
/* allow placing of several images including caption in one row */
 +
.flexbox .thumb2 .thumbinner .thumbcaption { /*circumvents the iGEM tag thumbcaption*/
 +
    font-size: 70%;
 +
    padding: 0 10px;
 +
    text-align: justify;
 +
}
 +
 
 +
.image_box .thumb2 .thumbinner img{
 +
    max-width: 100%;
 +
}
 +
 
 +
/* see: https://css-tricks.com/snippets/css/a-guide-to-flexbox/*/
 +
.flexbox{
 +
    display: flex;
 +
    margin: 5% 0;
 +
    justify-content: space-around;
 +
    flex-wrap: wrap;
 +
    align-content: center;
 +
}
 +
 
 +
/* for DokuWiki image boxes this prevents a zickzack positioning of the flexbox childs when wrap occurs */
 +
a.media{
 +
  margin: 0 auto;
 +
}
 +
 
 +
/* contains images where text shall float around */
 +
.image_box{
 +
    margin: 0.4em 0;
 +
    overflow: hidden;
 +
    font-size: 70%;
 +
    text-align: justify;
 +
}
 +
 
 +
.image_box.left{
 
     float: left;
 
     float: left;
     position: relative;
+
     margin-right: 3%;
    left: 50%;
+
 
}
 
}
  
.page_content{
+
.image_box.right{
display:block;
+
    float: right;
float: left;
+
     margin-left: 3%
    position: relative;
+
     left: -50%;
+
 
}
 
}
  
/* ============= END: Important Site setup ============= */
+
/* prevents the floating of images out of the DokuWiki-sections */
 +
.level1,
 +
.level2{
 +
  overflow: hidden;
 +
}
  
 +
 +
/* references coming from DokuWiki */
 +
.footnotes{
 +
    width: 90%;
 +
    margin: 2em auto 0 auto;
 +
}
 +
 +
/* styling tables coming from dokuwiki */
 +
.content_box .table{
 +
    margin: 2em 5%;
 +
}
 +
 +
/* the element that can be used to style the table */
 +
.content_box .table .inline{
 +
    font-size: 90%;
 +
    width: 100%;
 +
    border-collapse: collapse;
 +
}
 +
 +
/* grey background for the header line */
 +
.content_box .table th{
 +
    background-color: #DDD;
 +
}
 +
 +
/* greyish background for every second row */
 +
.content_box .table tr:nth-child(odd){
 +
    background-color: #EEE;
 +
}
 +
 +
/* move text away from cell borders */
 +
.content_box .table td,
 +
.content_box .table th{
 +
    padding: 0 10px;
 +
}
 +
 +
/* hovering efects */
 +
.content_box .table tr:hover{
 +
    background-color: #D2D4F3;
 +
}
 +
 +
/* === content_box2 for brick layout === */
 +
 +
/* two content boxes in same line (sb) */
 +
.content_box2_parent {
 +
    text-align: center;
 +
}
 +
 +
.content_box2_child {               
 +
    border-radius: 30px 60px;
 +
    display: inline-block;
 +
    background-color: #FFFFFF;
 +
    text-align: justify;
 +
    vertical-align: middle;
 +
    box-shadow: 1px 1px 10px #888;
 +
    -webkit-box-shadow: 1px 1px 10px #888;
 +
    -moz-box-shadow: 1px 1px 10px #888;
 +
    padding: 4%;
 +
}
 +
 +
@media screen and (min-width: 601px){
 +
    .content_box2_child{
 +
        margin: 2em 1em 2em 1em;
 +
        width: 35%;
 +
    }
 +
}
 +
 +
@media screen and (max-width: 600px){
 +
    .content_box2_child{
 +
        margin: 1em 0 0;
 +
        width: auto;
 +
    }
 +
}
 +
 +
/* === Floatboxes for two column layout === */
 +
 +
.floatbox{
 +
    width: 48%; /* 100% - 2*48% = 4% padding*/
 +
}
 +
 +
@media screen and (min-width: 601px){
 +
    .floatbox.left{
 +
        float: left;
 +
    }
 +
 +
    .floatbox.right{
 +
        float: right;
 +
    }
 +
}
 +
 +
@media screen and (max-width: 600px){
 +
    .floatbox{
 +
        float: none;
 +
        width: auto;
 +
    }
 +
}
 +
 +
/* ============= END: Important Site setup ============= */
  
  
Line 256: Line 488:
  
 
.page_content{
 
.page_content{
color: #757575;
+
    color: #666666;
font-family: "Roboto", "Arial";
+
    font-family: 'Roboto',sans-serif;
font-style: normal;
+
    font-style: normal;
font-size: 16px;
+
    font-weight: 300;
line-height: 1.8;
+
    font-size: 120%;
 +
    text-align: justify;
 +
    }
 +
 
 +
.page_content p{
 +
    line-height: 1.8em;
 +
    margin-bottom: 2em; /*move next paragraph away vertically */
 
}
 
}
  
/* ============= END: Headline Styling ============= */
 
 
h1, h2, h3{
 
h1, h2, h3{
color: #c1002a;
+
 
 +
    font-family: "Roboto", sans-serif;
 +
    color: #C5162F;
 +
    font-size: 25px;
 +
    clear: both;
 +
    font-weight: 400;
 +
    line-height: 1.2;
 +
    border-bottom: 0;
 
}
 
}
 +
 +
/* flows around text in the page_content */
 +
.content_box{
 +
    background-color: #FFFFFF;
 +
    text-align: justify;
 +
    box-shadow: 1px 1px 10px #888;
 +
    -webkit-box-shadow: 1px 1px 10px #888;
 +
    -moz-box-shadow: 1px 1px 10px #888;
 +
}
 +
 +
/* properties for central text box */
 +
.content_background_wrapper{
 +
   
 +
/*background: #EEEDED;*/
 +
background: #FCFCFC; /*by mauri*/
 +
}
 +
 +
/* references coming from DokuWiki */
 +
.footnotes{
 +
    font-size: 80%;
 +
    font-style: italic;
 +
}
 +
 +
/* KOMMENTARFUNKTION */
 +
.kommentar{
 +
    background-color: red;
 +
    color: black;
 +
    border: 2px solid black;
 +
    width: 100%;
 +
    clear: both;
 +
}
 +
.kommentar_stefan{
 +
    background-color: #ff1493;
 +
    color: black;
 +
    font-size: 14px;
 +
    font-family: "Comic Sans MS";
 +
    border: 2px solid black;
 +
    width: 100%;
 +
    clear: both;
 +
}
 +
 +
/* ============= END: Text Styling ============= */
 +
 +
 +
 +
 +
 +
 +
 +
 +
/* ============= Background ============= */
 +
 +
/* use central position as anchor for the vertical position of the side images */
 +
.central_position_wrap{
 +
    position: relative;
 +
}
 +
 +
/* define width and positioning of side images */
 +
.background_image_left,
 +
.background_image_right{
 +
    width: 150px;
 +
    position: absolute;
 +
}
 +
 +
.background_image_left{
 +
    top: 20%
 +
}
 +
 +
.background_image_right{
 +
    bottom: -20px;
 +
    right: 0;
 +
}
 +
 +
/* float the right image to the right s.t. it fits to the window border */
 +
.background_image_right img{
 +
    float: right;
 +
}
 +
 +
 +
 +
/* === Background: Responsive Design === */
 +
 +
/* hide side images if screen is too small */
 +
@media only screen and (max-width: 1320px){
 +
    .background_image_left,
 +
    .background_image_right{
 +
        display: none;
 +
    }
 +
}
 +
 +
/* adapt box width s.t. it fits the screen but has a maximum width of 1000px --jb*/
 +
@media only screen and (min-width: 1021px){
 +
    /* style for browsers wider than 1000px */
 +
    /* the 20px come from the scrollbar */
 +
    .page_content{
 +
        width: 1000px;
 +
        margin-left: auto;
 +
        margin-right: auto;
 +
    }
 +
}
 +
@media only screen and (max-width: 1020px){
 +
    /* style for browsers smaller than 1000px */
 +
    .page_content{
 +
        width: intrinsic;
 +
        width: moz-fit-content;
 +
        width: -webkit-fit-content;
 +
        width: fit-content;   
 +
    }
 +
}
 +
 +
/* === END: Background: Responsive Design === */
 +
 +
/* ============= END: Background ============= */
 +
 +
 +
  
  
Line 272: Line 632:
 
/* ============= Full Width Banners  ============= */
 
/* ============= Full Width Banners  ============= */
 
#banner_home{
 
#banner_home{
margin:0;
+
    margin:0;
padding: 0px;
+
    padding: 0px;
background-image: url("../wiki/images/8/89/Freiburg_frontpage_banner.jpg");
+
    background-image: url("../wiki/images/8/89/Freiburg_frontpage_banner.jpg");
background-repeat: no-repeat;
+
    background-repeat: no-repeat;
background-size:  cover;
+
    background-size:  cover;
width: 100%;
+
    width: 100%;
height: 400px;
+
    height: 400px;
 
}
 
}
 
#banner_team{
 
#banner_team{
margin:0;
+
    margin:0;
padding: 0px;
+
    padding: 0px;
background-image: url("../wiki/images/e/e7/FreiburgTeam2015.jpg");
+
    background-image: url("../wiki/images/e/e7/FreiburgTeam2015.jpg");
background-repeat: no-repeat;
+
    background-repeat: no-repeat;
background-size:  cover;
+
    background-size:  cover;
width: 100%;
+
    width: 100%;
height: 400px;
+
    height: 400px;
 
}
 
}
 
#banner_labjournal{
 
#banner_labjournal{
margin:0;
+
    margin:0;
padding: 0px;
+
    padding: 0px;
background-image: url("https://static.igem.org/mediawiki/2015/d/dc/Labjournal.jpg");
+
    background-image: url("https://static.igem.org/mediawiki/2015/d/dc/Labjournal.jpg");
background-repeat: no-repeat;
+
    background-repeat: no-repeat;
background-size:  cover;
+
    background-size:  cover;
width: 100%;
+
    width: 100%;
height: 400px;
+
    height: 400px;
 
}
 
}
  
 
/* ============= END: Full Width Banners  ============= */
 
/* ============= END: Full Width Banners  ============= */
/*
+
 
---------------- Our Team Flipcards css ----------------
+
 
*/
+
 
.flippanel {
+
 
     width: 227px;
+
/* =================== Footer =================== */
     height: 341px;
+
 
     margin: auto;
+
.content_footer{
    position: relative;
+
     background: #0051A2 scroll;
 +
     width: 100%;
 +
     height: 75px;
 
}
 
}
  
.card {
+
.contacts{
     width: 227px;
+
     width: 320px;
     height: 341px;
+
     margin: 0 auto;
     -o-transition: all .5s;
+
     display: flex;
     -ms-transition: all .5s;
+
     justify-content: space-around;
     -moz-transition: all .5s;
+
     display: -webkit-flex; /*Safari*/
    -webkit-transition: all .5s;
+
     -webkit-justify-content: space-around; /* Safari 6.1+ */
    transition: all .5s;
+
     -webkit-backface-visibility: hidden;
+
    -ms-backface-visibility: hidden;
+
    -moz-backface-visibility: hidden;
+
    backface-visibility: hidden;
+
    position: absolute;
+
    top: 0px;
+
    left: 0px;
+
 
}
 
}
  
.front {
+
#uni a img,
     z-index: 2;
+
#bioss a img,
 +
#facebook a img,
 +
#email a img{
 +
     max-height: 40px
 
}
 
}
  
.back {
+
#uni,
overflow: auto;
+
#bioss,
    z-index: 1;
+
#facebook,
    -webkit-transform: rotateY(180deg);
+
#email{
     -ms-transform: rotateY(180deg);
+
     padding-top: 15px;
     -moz-transform: rotateY(180deg);
+
     padding-right:10px;
    transform: rotateY(180deg); 
+
 
+
 
}
 
}
  
.flippanel:hover .front {
+
/* gap between social links and uni links */
     z-index: 1;
+
#facebook{
    -webkit-transform: rotateY(-180deg);
+
     padding-right: 40px;
    -ms-transform: rotateY(-180deg);
+
    -moz-transform: rotateY(-180deg);
+
    transform: rotateY(-180deg);
+
 
}
 
}
  
.flippanel:hover .back {
+
/* The html for the footer is included in wiki_content-end! */
    z-index: 2; 
+
 
    -webkit-transform: rotateX(0deg);
+
/* =================== END: Footer =================== */
    -ms-transform: rotateX(0deg);
+
 
    -moz-transform: rotateX(0deg);
+
#head {
     transform: rotateX(0deg);
+
     height: 0px;
 
}
 
}
.memberPicture{
+
 
width: 227px;
+
 
height: 341px;
+
/* ============== BEGIN:CSS classes and ids for Human Practice =============*/
 +
#recipe {
 +
    width: 80%;
 
}
 
}
 +
/* ============== END:CSS classes and ids for Human Practice =============*/
  
.profile-name {
+
 
font-size: 120%;
+
/* ============== BEGIN:CSS for back-button =============*/
color: #c1012a;
+
.button_back {
font-style: bold;
+
    margin-left: -14%;
 +
    margin-top: 5%;
 +
    padding: 3px 5px 5px 0px;
 +
    width: 10%;
 +
    line-height: 1.5em;
 +
    text-align: center;
 +
    background-color: #0051A2;
 +
    border-radius: 30px 15px 15px 30px;
 +
    border: 1px groove #004081;
 +
    float: left;
 
}
 
}
.profile-question{
+
 
color: #004c97;
+
.white_link {
 +
    color: #FFF;
 
}
 
}
 +
/* ============== END:CSS for back-button =============*/
 +
 +
</style>
 +
 +
<!-- INITIALIZE UPWARDS BLOB, SO ITS TOP REFERENCES TO DOCUMENT TOP -->
 +
 +
<style>
 +
 +
/* upwards navigation blob */
  
.flippanel_row{
+
#upwards_blob{
margin-top: 25px;
+
    display: none;
display: flex;
+
}
 +
 
 +
/* min-width is chosen so the blob does just not interfere with the content box */
 +
/* 1021 content_box-width + 46 blob-width + 20 scrollbar + some buffer space */
 +
@media screen and (min-width: 1144px){
 +
    #upwards_blob{
 +
        transition: transform 0.5s ease;
 +
        display: block;
 +
        position: absolute;
 +
        right: -100px;
 +
        z-index: 1000;
 +
    }
 
}
 
}
/*
 
---------------- END Our Team Flipcards css ----------------
 
*/
 
  
 
</style>
 
</style>
  
<nav id="menubar">
+
<div id="upwards_blob"><a href="#globalWrapper"><img src="https://static.igem.org/mediawiki/2015/9/93/Freiburg_upwards_blob.png"></a></div>
<ul>
+
 
<li><a href="https://2015.igem.org/Team:Freiburg">Overview</a></li>
+
 
<li><a href="https://2015.igem.org/Team:Freiburg/Project">The Project</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Team">Our Team</a>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results">Results</a>
+
<ul>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results">Summary</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/Biobricks">Biobricks</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/Surchem">Surface Chemistry</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/Cloning">Cloning</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/iRIf">iRIf</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/Modeling">Modeling</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Results/CellFree">Cell-free Expression</a></li>
+
</ul>
+
</li>   
+
  <li><a href="#">Notebook</a>
+
    <ul>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Protocols">Protocols</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Labjournals">Labjournals</a>
+
<ul>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Labjournals/cell_free">Cell-free Expression</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Labjournals/cloning">Cloning</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Labjournals/surchem">Surface Chemistry</a></li>
+
<li><a href="https://2015.igem.org/Team:Freiburg/Labjournals/irif">iRIf</a></li>
+
</ul>
+
</li>
+
</ul>
+
</li>
+
</ul>
+
</nav>
+
 
</html>
 
</html>

Revision as of 23:10, 9 September 2015