|
|
| (30 intermediate revisions by 5 users not shown) |
| Line 1: |
Line 1: |
| − | <html>
| |
| − | <style>
| |
| | | | |
| − |
| |
| − | /* ============= Resetting css coming from wiki itself ============= */
| |
| − | body {
| |
| − | font: sans-serif;
| |
| − | color: #000;
| |
| − | margin: 0px;
| |
| − | padding: 0px;
| |
| − | background-color: #AAA;
| |
| − | line-height: 1.8;
| |
| − | }
| |
| − |
| |
| − | a {
| |
| − | color: #002BB8;
| |
| − | text-decoration: none;
| |
| − | background: transparent none repeat scroll 0% 0%;
| |
| − | }
| |
| − |
| |
| − | p {
| |
| − | margin: 0.4em 0px 0.5em;
| |
| − | line-height: 1.5em;
| |
| − | }
| |
| − |
| |
| − | #globalWrapper {
| |
| − | position: absolute;
| |
| − | font-size: 150%;
| |
| − | width: 100%;
| |
| − | margin: 0px;
| |
| − | padding: 0px 0px 0px;
| |
| − | }
| |
| − |
| |
| − | #mainContainer {
| |
| − | margin: 0;
| |
| − | width: 100%;
| |
| − | }
| |
| − |
| |
| − | #top_menu_under {
| |
| − | position: relative;
| |
| − | width: 100%;
| |
| − | height: 16px;
| |
| − | border-bottom: 2px solid #000;
| |
| − | }
| |
| − |
| |
| − | #top_menu_14 {
| |
| − | position: fixed;
| |
| − | width: 100%;
| |
| − | top: 0px;
| |
| − | left: 0px;
| |
| − | height: 16px;
| |
| − | background-color: #383838;
| |
| − | border-bottom: 2px solid #000;
| |
| − | z-index: 9999;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | #top_menu_inside {
| |
| − | display: block;
| |
| − | position: relative;
| |
| − | width: 900px;
| |
| − | height: 100%;
| |
| − | margin: 0px auto;
| |
| − | padding: 0px 10px;
| |
| − | border-left: 1px solid #C8C8C8;
| |
| − | border-right: 1px solid #C8C8C8;
| |
| − | font-family: "arial",sans-serif;
| |
| − | font-size: 12px;
| |
| − | font-weight: 400;
| |
| − | color: #FFF;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | #content {
| |
| − | position: relative;
| |
| − | width: 100%;
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | background: #FFF none repeat scroll 0% 0%;
| |
| − | color: #000;
| |
| − | border-left: 0;
| |
| − | border-right: 0;
| |
| − | /* line-height: 0; */
| |
| − | z-index: 2;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .visualClear {
| |
| − | clear: both;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /* ============= END: Resetting css coming from wiki itself ============= */
| |
| − |
| |
| − |
| |
| − | /* ============= Declare Fonts for non-Windows machines ============= */
| |
| − |
| |
| − |
| |
| − | @font-face {
| |
| − | font-family: Candara;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/6/6c/Freiburg_Candara.ttf) format('truetype');
| |
| − |
| |
| − | }
| |
| − |
| |
| − | @font-face {
| |
| − | font-family: Candara;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/8/89/Freiburg_Candarab.ttf) format('truetype');
| |
| − | font-weight: bold;
| |
| − | font-style: normal;
| |
| − | }
| |
| − | @font-face {
| |
| − | font-family: Candara;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/3/3e/Freiburg_Candarai.ttf) format('truetype');
| |
| − | font-weight: normal;
| |
| − | font-style: italic;
| |
| − | }
| |
| − |
| |
| − | @font-face {
| |
| − | font-family: Roboto;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/c/c3/Freiburg_Roboto-Regular.ttf) format('truetype');
| |
| − |
| |
| − | }
| |
| − | @font-face {
| |
| − | font-family: Roboto;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/6/64/Freiburg_Roboto-Light.ttf) format('truetype');
| |
| − | font-style: normal;
| |
| − | font-weight: 300;
| |
| − |
| |
| − | }
| |
| − | @font-face {
| |
| − | font-family: Roboto;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/b/b9/Freiburg_Roboto-Bold.ttf) format('truetype');
| |
| − | font-weight: bold;
| |
| − | font-style: normal;
| |
| − | }
| |
| − | @font-face {
| |
| − | font-family: Roboto;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/2/2e/Freiburg_Roboto-Italic.ttf) format('truetype');
| |
| − | font-weight: normal;
| |
| − | font-style: italic;
| |
| − | }
| |
| − | @font-face {
| |
| − | font-family: Roboto;
| |
| − | src: url(https://static.igem.org/mediawiki/2015/2/2f/Freiburg_Roboto-BoldItalic.ttf) format('truetype');
| |
| − | font-weight: bold;
| |
| − | font-style: italic;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* ============= END: Declare Fonts for non-Windows machines ============= */
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* ============= CSS for Menubar ============= */
| |
| − |
| |
| − | #menubar {
| |
| − | font-size: 16px;
| |
| − | background-color: #5781bd;
| |
| − | display: table;
| |
| − | width: 100%;
| |
| − | height: 70px;
| |
| − | border-collapse: collapse;
| |
| − | border: none;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | /*The sub (and subsubs) items of the menu*/
| |
| − | #menubar ul li ul li{
| |
| − | width: 200px;
| |
| − | height: 30px;
| |
| − | margin-top: 2px;
| |
| − | }
| |
| − | /*The first (horizontal) line of menu items*/
| |
| − | #menubar > ul{
| |
| − |
| |
| − | position: relative;
| |
| − | margin-top: 25;
| |
| − | left: 50%;
| |
| − | display: block;
| |
| − | transform: translate(-50%,0%);
| |
| − | }
| |
| − |
| |
| − | #menubar ul ul {
| |
| − | background-color: #5781bd;
| |
| − | display: none;
| |
| − | position: absolute;
| |
| − | margin-left: 0px;
| |
| − | float: left;
| |
| − | margin-top:0px;
| |
| − | }
| |
| − | #menubar ul ul li{
| |
| − | display: block;
| |
| − | margin-left: 0px;
| |
| − | }
| |
| − |
| |
| − | #menubar ul li {
| |
| − | width: 100px;
| |
| − | display: table-cell;
| |
| − | font-family: "Roboto",sans-serif;
| |
| − | }
| |
| − |
| |
| − | #menubar ul a{
| |
| − | text-decoration: none;
| |
| − | color: #FFFFFF;
| |
| − | font-style: bold;
| |
| − | text-align: left;
| |
| − | }
| |
| − |
| |
| − | #menubar ul a:visited{
| |
| − | display: block;
| |
| − | text-decoration: none;
| |
| − | color: #FFFFFF;
| |
| − | font-style: bold;
| |
| − | }
| |
| − | #menubar ul li:hover > ul{
| |
| − | color: #EEEE00;
| |
| − | display: block;
| |
| − | padding-top: 0px;
| |
| − | padding-left: 20px;
| |
| − | }
| |
| − | #menubar ul li:hover{
| |
| − | color: #EEEE00;
| |
| − | }
| |
| − |
| |
| − | /* ============= END: CSS for Menubar ============= */
| |
| − |
| |
| − | /* ============= Important Site setup ============= */
| |
| − |
| |
| − | /* changed tiles background to scaling full-size image --jb */
| |
| − | /*.content_background_wrapper{
| |
| − |
| |
| − | position: relative;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2015/7/74/Freiburg_antibody_background.png");
| |
| − | background-attachment: fixed;
| |
| − | overflow:hidden;
| |
| − | }*/
| |
| − | /*
| |
| − | .content_background_wrapper{
| |
| − | background: url("https://static.igem.org/mediawiki/2015/b/b4/Freiburg_wiki_background_2.png") no-repeat center center fixed;
| |
| − | -webkit-background-size: cover;
| |
| − | -moz-background-size: cover;
| |
| − | -o-background-size: cover;
| |
| − | background-size: cover;
| |
| − | overflow: hidden;
| |
| − | REMOVE WITH NEW NAVIGATION BAR!!! AVOIDS CONTENT SHIFTING AFTER MENU-WRAP
| |
| − | clear: both;
| |
| − | }
| |
| − | */
| |
| − |
| |
| − | .content_background_wrapper{
| |
| − | background: #F9F9F9;
| |
| − | overflow: hidden;
| |
| − | box-sizing: border-box;
| |
| − | }
| |
| − |
| |
| − | .central_position_wrap{
| |
| − | position: relative;
| |
| − | }
| |
| − |
| |
| − | .background_image_left,
| |
| − | .background_image_right{
| |
| − | width: 150px;
| |
| − | position: absolute;
| |
| − | }
| |
| − |
| |
| − | .background_image_left{
| |
| − | top: 20%
| |
| − | }
| |
| − |
| |
| − | .background_image_right{
| |
| − | bottom: -20px;
| |
| − | right: 0;
| |
| − | }
| |
| − |
| |
| − | .background_image_right img{
| |
| − | float: right;
| |
| − | }
| |
| − |
| |
| − | @media only screen and (max-width: 1320px){
| |
| − | .background_image_left,
| |
| − | .background_image_right{
| |
| − | display: none;
| |
| − | }
| |
| − | }
| |
| − |
| |
| − | /* was removed in favour of fit-content --jb */
| |
| − | /* old version:
| |
| − | float: left;
| |
| − | max-width: 1000px;
| |
| − | float: left;
| |
| − | position: relative;
| |
| − | left: 50%;
| |
| − | */
| |
| − |
| |
| − | /*
| |
| − | .page_content{
| |
| − | display:block;
| |
| − | float: left;
| |
| − | position: relative;
| |
| − | left: -50%;
| |
| − | }
| |
| − | */
| |
| − |
| |
| − | /* responsive desgin: adapt box width s.t. it fits the screen but has a maximum width of 1000px --jb*/
| |
| − | .page_content{
| |
| − | margin: 20px 5px;
| |
| − | }
| |
| − |
| |
| − | @media only screen and (min-width: 1021px){
| |
| − | /* style for browsers wider than 1000px */
| |
| − | .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: Important Site setup ============= */
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* ============= Text Styling ============= */
| |
| − |
| |
| − | .page_content{
| |
| − | color: #666666;
| |
| − | font-family: 'Roboto',sans-serif;
| |
| − | font-style: normal;
| |
| − | font-weight: 300;
| |
| − | font-size: 16px;
| |
| − | line-height: 1.8;
| |
| − | }
| |
| − |
| |
| − | /* ============= END: Headline Styling ============= */
| |
| − | h1, h2, h3{
| |
| − |
| |
| − | font-family: "Roboto", sans-serif;
| |
| − | color: #c1002a;
| |
| − | font-size: 25px;
| |
| − | clear: both;
| |
| − | font-weight: 400;
| |
| − | line-height: 1.2;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* ============= Full Width Banners ============= */
| |
| − | #banner_home{
| |
| − | margin:0;
| |
| − | padding: 0px;
| |
| − | background-image: url("../wiki/images/8/89/Freiburg_frontpage_banner.jpg");
| |
| − | background-repeat: no-repeat;
| |
| − | background-size: cover;
| |
| − | width: 100%;
| |
| − | height: 400px;
| |
| − | }
| |
| − | #banner_team{
| |
| − | margin:0;
| |
| − | padding: 0px;
| |
| − | background-image: url("../wiki/images/e/e7/FreiburgTeam2015.jpg");
| |
| − | background-repeat: no-repeat;
| |
| − | background-size: cover;
| |
| − | width: 100%;
| |
| − | height: 400px;
| |
| − | }
| |
| − | #banner_labjournal{
| |
| − | margin:0;
| |
| − | padding: 0px;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2015/d/dc/Labjournal.jpg");
| |
| − | background-repeat: no-repeat;
| |
| − | background-size: cover;
| |
| − | width: 100%;
| |
| − | height: 400px;
| |
| − | }
| |
| − |
| |
| − | /* ============= END: Full Width Banners ============= */
| |
| − | /*
| |
| − | ---------------- Our Team Flipcards css ----------------
| |
| − | */
| |
| − | .flippanel {
| |
| − | width: 227px;
| |
| − | height: 341px;
| |
| − | margin: auto;
| |
| − | position: relative;
| |
| − | }
| |
| − |
| |
| − | .card {
| |
| − | width: 227px;
| |
| − | height: 341px;
| |
| − | -o-transition: all .5s;
| |
| − | -ms-transition: all .5s;
| |
| − | -moz-transition: all .5s;
| |
| − | -webkit-transition: all .5s;
| |
| − | 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 {
| |
| − | z-index: 2;
| |
| − | }
| |
| − |
| |
| − | .back {
| |
| − | overflow: auto;
| |
| − | z-index: 1;
| |
| − | -webkit-transform: rotateY(180deg);
| |
| − | -ms-transform: rotateY(180deg);
| |
| − | -moz-transform: rotateY(180deg);
| |
| − | transform: rotateY(180deg);
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .flippanel:hover .front {
| |
| − | z-index: 1;
| |
| − | -webkit-transform: rotateY(-180deg);
| |
| − | -ms-transform: rotateY(-180deg);
| |
| − | -moz-transform: rotateY(-180deg);
| |
| − | transform: rotateY(-180deg);
| |
| − | }
| |
| − |
| |
| − | .flippanel:hover .back {
| |
| − | z-index: 2;
| |
| − | -webkit-transform: rotateX(0deg);
| |
| − | -ms-transform: rotateX(0deg);
| |
| − | -moz-transform: rotateX(0deg);
| |
| − | transform: rotateX(0deg);
| |
| − | }
| |
| − | .memberPicture{
| |
| − | width: 227px;
| |
| − | height: 341px;
| |
| − | }
| |
| − |
| |
| − | .profile-name {
| |
| − | font-size: 120%;
| |
| − | color: #c1012a;
| |
| − | font-style: bold;
| |
| − | }
| |
| − | .profile-question{
| |
| − | color: #004c97;
| |
| − | }
| |
| − |
| |
| − | .flippanel_row{
| |
| − | margin-top: 25px;
| |
| − | display: flex;
| |
| − | }
| |
| − | /*
| |
| − | ---------------- END Our Team Flipcards css ----------------
| |
| − | */
| |
| − |
| |
| − |
| |
| − | /* ======================= content boxes =================== */
| |
| − | .content_box{
| |
| − | border-radius: 30px 60px;
| |
| − | overflow: hidden;
| |
| − | padding: 2em;
| |
| − | margin: 2em 0;
| |
| − | background-color: #FFFFFF;
| |
| − | text-align: justify;
| |
| − | margin-bottom: 0;
| |
| − | }
| |
| − |
| |
| − | /* ====================== image boxes =================== */
| |
| − | .image_box{
| |
| − | overflow: hidden;
| |
| − | }
| |
| − |
| |
| − | /* =================== END of image box =================== */
| |
| − |
| |
| − | .tags{
| |
| − | /* remove tags from bottom */
| |
| − | font-size: 0;
| |
| − | }
| |
| − |
| |
| − | acronym{
| |
| − | /* remove text-decoration from acronyms*/
| |
| − | border-bottom: none;
| |
| − | text-decoration: none;
| |
| − | cursor: auto;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /* 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;
| |
| − | }
| |
| − |
| |
| − | .flexbox{
| |
| − | display: flex;
| |
| − | margin: 5% 0;
| |
| − | }
| |
| − |
| |
| − | /* =================== Footer =================== */
| |
| − |
| |
| − | .content_footer{
| |
| − | background: rgb(54, 119, 188) none repeat scroll;
| |
| − | width: 100%;
| |
| − | height: 75px;
| |
| − | }
| |
| − |
| |
| − | .contacts{
| |
| − | width: 320px;
| |
| − | margin: 0 auto;
| |
| − | display: flex;
| |
| − | justify-content: space-around;
| |
| − | display: -webkit-flex; /*Safari*/
| |
| − | -webkit-justify-content: space-around; /* Safari 6.1+ */
| |
| − | }
| |
| − |
| |
| − | #uni a img,
| |
| − | #bioss a img,
| |
| − | #facebook a img,
| |
| − | #email a img{
| |
| − | max-height: 40px
| |
| − | }
| |
| − |
| |
| − | #uni,
| |
| − | #bioss,
| |
| − | #facebook,
| |
| − | #email{
| |
| − | padding-top: 15px;
| |
| − | padding-right:10px;
| |
| − | }
| |
| − |
| |
| − | /* gap between social links and uni links */
| |
| − | #facebook{
| |
| − | padding-right: 40px;
| |
| − | }
| |
| − | </style>
| |
| − |
| |
| − | </html>
| |