|
|
| Line 1: |
Line 1: |
| | + | {{Aalto-Helsinki}} |
| | + | |
| | <html> | | <html> |
| − | <script>
| |
| − | ( function( $ ) {
| |
| − | $( document ).ready(function() {
| |
| − | $('#dropdown').prepend('');
| |
| − | var activeElement = $('#dropdown>ul>li:first');
| |
| | | | |
| − | $('#dropdown>ul>li').each(function() {
| + | <section class="front-page front-page-block"> |
| − | if ($(this).hasClass('active')) {
| + | <div style="min-height: 700px; max-height: 70%;"> |
| − | activeElement = $(this);
| + | <div class='porify'> |
| − | }
| + | <img src="https://static.igem.org/mediawiki/2017/4/4f/T--Aalto-Helsinki--Porifi.png" alt="Porifi Main"> |
| − | });
| + | </div> |
| | + | <div id="o-h1">PURIFY YOUR PORES FROM ACNE BACTERIA</div> |
| | + | </div> |
| | + | </section> |
| | | | |
| − | var posLeft = activeElement.position().left;
| |
| − | var elementWidth = activeElement.width();
| |
| − | posLeft = posLeft + elementWidth/2 -6;
| |
| − | if (activeElement.hasClass('has-sub')) {
| |
| − | posLeft -= 6;
| |
| − | }
| |
| − |
| |
| − | $("#dropdown>ul>li").hover(function() {
| |
| − | element = $(this);
| |
| − | var w = element.width();
| |
| − | if ($(this).hasClass('has-sub'))
| |
| − | {
| |
| − | leftPos = element.position().left + w/2 - 12;
| |
| − | }
| |
| − | else {
| |
| − | leftPos = element.position().left + w/2 - 6;
| |
| − | };
| |
| − | });
| |
| − |
| |
| − | $('#dropdown>ul').prepend('<li id="menu-button"><a>Menu</a></li>');
| |
| − | $( "#menu-button" ).click(function(){
| |
| − | if ($(this).parent().hasClass('open')) {
| |
| − | $(this).parent().removeClass('open');
| |
| − | }
| |
| − | else {
| |
| − | $(this).parent().addClass('open');
| |
| − | }
| |
| − | });
| |
| − |
| |
| − | // ROTATING PORIFI
| |
| − |
| |
| − | var target = $("img[alt^='Porifi']").attr('src');
| |
| − | var labTarg = target.replace('4/4f/T--Aalto-Helsinki--Porifi.png', 'd/dc/T--Aalto-Helsinki--Porifi-lab.png');
| |
| − | var modTarg = target.replace('4/4f/T--Aalto-Helsinki--Porifi.png', '9/90/T--Aalto-Helsinki--Porifi-mod.png');
| |
| − | var hpTarg = target.replace('4/4f/T--Aalto-Helsinki--Porifi.png', '8/85/T--Aalto-Helsinki--Porifi-hp.png');
| |
| − | var comTarg = target.replace('4/4f/T--Aalto-Helsinki--Porifi.png', '8/87/T--Aalto-Helsinki--Porifi-community.png');
| |
| − | var peoTarg = target.replace('4/4f/T--Aalto-Helsinki--Porifi.png', '7/7b/T--Aalto-Helsinki--Porifi-people.png');
| |
| − |
| |
| − | $('#dropdown>ul>li>a.lab').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", labTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", labTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown ul ul li a.lab').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", labTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", labTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown>ul>li>a.mod').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", modTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", modTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown ul ul li a.mod').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", modTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", modTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown>ul>li>a.hp').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", hpTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", hpTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown ul ul li a.hp').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", hpTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", hpTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown>ul>li>a.com').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", comTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", comTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown ul ul li a.com').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", comTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", comTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown>ul>li>a.peo').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", peoTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", peoTarg);
| |
| − | });
| |
| − |
| |
| − | $('#dropdown ul ul li a.peo').hover(function() {
| |
| − | $("img[alt^='Porifi']").attr("src", peoTarg);
| |
| − | }, function() {
| |
| − | $("img[alt^='Porifi']").attr("src", peoTarg);
| |
| − | });
| |
| − | });
| |
| − |
| |
| − | } )( jQuery );
| |
| − |
| |
| − | </script>
| |
| | | | |
| | + | <!--Force footer to stay at the bottom...--> |
| | <style> | | <style> |
| − |
| |
| − | /***************************************************** DEFAULT WIKI SETTINGS ****************************************************/
| |
| − |
| |
| − | /* Clear the default wiki settings */
| |
| − |
| |
| − | #home_logo, #sideMenu { display:none; }
| |
| − | #sideMenu, #top_title, .patrollink {display:none;}
| |
| − | #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;}
| |
| − | body {background-color:white; }
| |
| − | #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
| |
| − |
| |
| − | /* OUR OWN CSS BEGINS */
| |
| − |
| |
| | html { | | html { |
| − | position: relative;
| + | /*height: auto !important; This broke the flex and footer positioning. */ |
| − | height: 100%;
| + | min-height: 100% !important; |
| − | min-width: 950px;
| + | |
| − | text-align: center;
| + | |
| − | background-color: white;
| + | |
| − | background-size: cover;
| + | |
| − | -webkit-font-smoothing: antialiased; /* font smoothing */ | + | |
| − | -moz-osx-font-smoothing: grayscale;
| + | |
| − | font-family: 'Quicksand', Work Sans !important;
| + | |
| − | font-size:16px !important; | + | |
| | } | | } |
| − |
| |
| − | header, body {
| |
| − | height: 100%;
| |
| − | min-height: 765px; /* So that the bottom bar does not go over the picture on a small screen */
| |
| − | margin: 0 0 0px;
| |
| − | padding: 0;
| |
| − | }
| |
| − |
| |
| − | p {
| |
| − | text-align: justify;
| |
| − | font-family: Work Sans !important;
| |
| − | font-size: 16px !important;
| |
| − | /*margin: 20px 15px 35px 10px !important;*/
| |
| − | }
| |
| − | #paragraph {
| |
| − | margin: 20px 15px 35px 10px !important;
| |
| − | }
| |
| − | #figuretext-c {
| |
| − | text-align: center !important;
| |
| − | }
| |
| − |
| |
| − | a {
| |
| − | text-decoration: none;
| |
| − | color: #000000;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | a:hover {
| |
| − | color: #363638;
| |
| − | font-weight: bolder;
| |
| − | }
| |
| − |
| |
| − | img {
| |
| − | padding: 0;
| |
| − | display: block;
| |
| − | margin: auto;
| |
| − | max-height: 100%;
| |
| − | max-width: 100%;
| |
| − | }
| |
| − |
| |
| − | /* Force height 100% on iGEM settings */
| |
| − | #content {
| |
| − | height: 100% !important;
| |
| − | }
| |
| − | #HQ_page {
| |
| − | height: 100% !important;
| |
| − | }
| |
| − | .mw-body {
| |
| − | height: 100% !important;
| |
| − | }
| |
| − | #globalWrapper {
| |
| − | height: 100% !important;
| |
| − | }
| |
| − | /* Force link padding for https keep small */
| |
| − | #bodyContent a[href^="https://"], .link-https{
| |
| − | padding-right: 1px !important;
| |
| − | }
| |
| − | #space {
| |
| − | height: 30px;
| |
| − | }
| |
| − | #mainlogo {
| |
| − | /*background-image: url("https://static.igem.org/mediawiki/2017/6/68/T--Aalto-Helsinki--mainlogo.png");*/
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/a/ad/T--Aalto-Helsinki--mainlogo-2.png");
| |
| − | background-size: cover;
| |
| − | background-repeat: no-repeat;
| |
| − | background-position: center center;
| |
| − | max-height: 160px;
| |
| − | }
| |
| − | .link-spanner {
| |
| − | position: absolute;
| |
| − | width: 100%;
| |
| − | height: 21%;
| |
| − | top: 0;
| |
| − | left: 0;
| |
| − | z-index: 1;
| |
| − | }
| |
| − |
| |
| − | /* Front page */
| |
| − | .front-page {
| |
| − | width: 100%;
| |
| − | min-height: 65%;
| |
| − | padding: 0px 0px;
| |
| − | /*display: -webkit-box;*/ /* OLD - iOS 6-, Safari 3.1-6 */
| |
| − | /*display: -moz-box;*/ /* OLD - Firefox 19- (buggy but mostly works) */
| |
| − | /*display: -ms-flexbox;*/ /* TWEENER - IE 10 */
| |
| − | /*display: -webkit-flex;*/ /* NEW - Chrome */
| |
| − | /*display: flex;*/
| |
| − | /*flex-direction: column;*/
| |
| − | }
| |
| − | .front-page > div {
| |
| − | flex: 1 1 auto;
| |
| − | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
| |
| − | display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
| |
| − | display: -ms-flexbox; /* TWEENER - IE 10 */
| |
| − | display: -webkit-flex; /* NEW - Chrome */
| |
| − | display: flex;
| |
| − | flex-direction: column;
| |
| − | padding: 10% 10% 13% 10%;
| |
| − | }
| |
| − | /* Not needed anymore
| |
| − | .front-page > div > div {
| |
| − | flex: 1 1 auto;
| |
| − | }*/
| |
| − | .front-page > div:nth-child(1) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/8/8f/T--Aalto-Helsinki--coverpicture2.jpg");
| |
| − | background-size: cover;
| |
| − | /*overflow: hidden;*/
| |
| − | background-color: #c63;
| |
| − | border: 2px solid white;
| |
| − | }
| |
| − | .porify {
| |
| − | /*flex: 1 1 auto; breaks Firefox */
| |
| − | text-align: center;
| |
| − | width: 35%;
| |
| − | margin: auto;
| |
| − | }
| |
| − |
| |
| − | /* Sponsors */
| |
| − | article.sponsor {
| |
| − | float: left;
| |
| − | display: table-cell;
| |
| − | vertical-align: middle;
| |
| − | text-align: center;
| |
| − | width: 203px;
| |
| − | height: 150px;
| |
| − | margin-right: 15px;
| |
| − | margin-bottom: 15px;
| |
| − | /*border: 1px solid #4d4d4d;*/
| |
| − | -webkit-border-radius: 3px;
| |
| − | -moz-border-radius: 3px;
| |
| − | border-radius: 3px;
| |
| − | -webkit-filter: grayscale(80%); /*brightness(60%) contrast(10000000%);*/
| |
| − | filter: grayscale(80%);
| |
| − | opacity: .8;
| |
| − | }
| |
| − | article.sponsor * {
| |
| − | vertical-align: middle;
| |
| − | }
| |
| − |
| |
| − | article.sponsor span {
| |
| − | display: inline-block;
| |
| − | height: 100%;
| |
| − | width: 1px;
| |
| − | }
| |
| − | article.sponsor.last {
| |
| − | margin-right: 0px;
| |
| − | }
| |
| − | article.sponsor:hover {
| |
| − | -webkit-filter: grayscale(0%);
| |
| − | filter: grayscale(0%);
| |
| − | opacity: 1.0;
| |
| − | }
| |
| − |
| |
| − | /* Site Map styles */
| |
| − | .sitemap {
| |
| − | background-color: #339999;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − |
| |
| − | #map-column-styles {
| |
| − | clear:left;
| |
| − | float:left;
| |
| − | text-align: left;
| |
| − | width:100%;
| |
| − | overflow:hidden;
| |
| − | background:#339999;
| |
| − | font-size: 14px !important;
| |
| − | }
| |
| − | #map-column-1 {
| |
| − | float:left;
| |
| − | min-width:16%;
| |
| − | position:relative;
| |
| − | left:14%;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − | #map-column-1 a {
| |
| − | list-style: none;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − | #map-column-1 a:hover {
| |
| − | color: #066;
| |
| − | }
| |
| − | #map-column-2 {
| |
| − | float:left;
| |
| − | min-width:16%;
| |
| − | position:relative;
| |
| − | left:14%;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − | #map-column-2 a {
| |
| − | list-style: none;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − | #map-column-2 a:hover {
| |
| − | color: #066;
| |
| − | }
| |
| − | #map-column-3 {
| |
| − | float:left;
| |
| − | min-width:16%;
| |
| − | position:relative;
| |
| − | left:14%;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − | #map-column-3 a {
| |
| − | list-style: none;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − | #map-column-3 a:hover {
| |
| − | color: #066;
| |
| − | }
| |
| − | #map-column-4 {
| |
| − | float:left;
| |
| − | min-width:16%;
| |
| − | position:relative;
| |
| − | left:14%;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − | #map-column-4 a {
| |
| − | list-style: none;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − | #map-column-4 a:hover {
| |
| − | color: #066;
| |
| − | }
| |
| − | #map-column-5 {
| |
| − | float:left;
| |
| − | min-width:16%;
| |
| − | position:relative;
| |
| − | left:14%;
| |
| − | overflow:hidden;
| |
| − | }
| |
| − | #map-column-5 a {
| |
| − | list-style: none;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − | #map-column-5 a:hover {
| |
| − | color: #066;
| |
| − | }
| |
| − |
| |
| − | /* Normal page styles */
| |
| − | .container {
| |
| − | padding-top: 1%;
| |
| − | padding-left: 13%;
| |
| − | padding-right: 13%;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − |
| |
| − | .basictext {
| |
| − | font-weight: 300 !important;
| |
| − | line-height: 32px;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − |
| |
| − | .introtext {
| |
| − | font-weight: 300 !important;
| |
| − | line-height: 32px;
| |
| − | }
| |
| − |
| |
| − | /* Team page styles */
| |
| − |
| |
| − | .person-wrap {
| |
| − | width: 100%;
| |
| − | padding-top: 1%;
| |
| − | padding-bottom: 5%;
| |
| − | padding-left: 2%;
| |
| − | padding-right: 0.5%;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − | .person-photo {
| |
| − | padding: 2% 0 2% 0;
| |
| − | float: left;
| |
| − | width: 25%;
| |
| − | }
| |
| − | .person-texts {
| |
| − | float: right;
| |
| − | width: 68%;
| |
| − | font-weight: lighter;
| |
| − | line-height: 28px;
| |
| − | font-family: Work Sans;
| |
| − | text-align: justify;
| |
| − | margin-right: 2%;
| |
| − | font-size: 14px !important;
| |
| − | }
| |
| − |
| |
| − | /* Some icon styles */
| |
| − | .some {
| |
| − | display: inline-block;
| |
| − | width: 30px;
| |
| − | vertical-align: middle;
| |
| − | }
| |
| − |
| |
| − | .some:hover {
| |
| − | content: url('https://static.igem.org/mediawiki/2017/d/d1/T--Aalto-Helsinki--home_icon_hover.png');
| |
| − | }
| |
| − |
| |
| − | /* Quote styles */
| |
| − | #quote-block {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − | #quote-block-mod {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #CC9933;
| |
| − | overflow: hidden;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − | #quote-block-hp {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #c63;
| |
| − | overflow: hidden;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − | #quote-block-com {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #006699;
| |
| − | overflow: hidden;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − | #quote-block-peo {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #336633;
| |
| − | overflow: hidden;
| |
| − | font-family: Work Sans;
| |
| − | }
| |
| − |
| |
| − | q {
| |
| − | quotes: "“" "”" "‘" "’";
| |
| − | font-family: Work Sans;
| |
| − | font-style: normal;
| |
| − | }
| |
| − |
| |
| − | q:before {
| |
| − | content: open-quote;
| |
| − | font-size: 150px !important;
| |
| − | }
| |
| − |
| |
| − | q:after {
| |
| − | content: no-close-quote;
| |
| − | }
| |
| − |
| |
| − | .quote-mark {
| |
| − | width: 0%;
| |
| − | float: left;
| |
| − | text-align: left;
| |
| − | font-weight: bolder;
| |
| − | font-size: 0px !important;
| |
| − | font-family: Work Sans !important;
| |
| − | padding: 0 8%;
| |
| − | color: #000000;
| |
| − | margin-bottom:-100px;
| |
| − | margin-top: 25px;
| |
| − | }
| |
| − | .quote-mark-white {
| |
| − | width: 0%;
| |
| − | float: left;
| |
| − | text-align: left;
| |
| − | font-weight: bolder;
| |
| − | font-size: 0px !important;
| |
| − | font-family: Work Sans !important;
| |
| − | padding: 0 8%;
| |
| − | color: #ffffff;
| |
| − | margin-bottom:-100px;
| |
| − | margin-top: 25px;
| |
| − | }
| |
| − |
| |
| − | .quote-text {
| |
| − | /*width: 70%; iGEM website broke this, so let's not have this*/
| |
| − | text-align: left;
| |
| − | font-weight: bolder;
| |
| − | font-size: 30px !important;
| |
| − | padding: 0 18%;
| |
| − | color: #000000;
| |
| − | line-height: 130%;
| |
| − | }
| |
| − | .quote-text-white {
| |
| − | /*width: 70%; iGEM website broke this, so let's not have this*/
| |
| − | text-align: left;
| |
| − | font-weight: bolder;
| |
| − | font-size: 30px !important;
| |
| − | padding: 0 18%;
| |
| − | color: #ffffff;
| |
| − | line-height: 130%;
| |
| − | }
| |
| − |
| |
| − | .quote-person {
| |
| − | /*width: 69%; iGEM website broke this, so let's not have this*/
| |
| − | text-align: right;
| |
| − | font-weight: lighter;
| |
| − | font-size: 25px !important;
| |
| − | padding: 0 18%;
| |
| − | color: #000000;
| |
| − | }
| |
| − | .quote-person-white {
| |
| − | /*width: 69%; iGEM website broke this, so let's not have this*/
| |
| − | text-align: right;
| |
| − | font-weight: lighter;
| |
| − | font-size: 25px !important;
| |
| − | padding: 0 18%;
| |
| − | color: #ffffff;
| |
| − | }
| |
| − |
| |
| − | /* Color block styles */
| |
| − |
| |
| − | #color-block {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/d/d1/T--Aalto-Helsinki--Laboratory-block.jpg");
| |
| − | background-size: cover;
| |
| − | /*background-position: center center; maybe???*/
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − |
| |
| − | #color-block-mod {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/e/e5/T--Aalto-Helsinki--Model-block.jpg");
| |
| − | background-size: cover;
| |
| − | background-color: #CC9933;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − |
| |
| − | #color-block-com {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/b/b4/T--Aalto-Helsinki--Community-block.jpg");
| |
| − | background-size: cover;
| |
| − | background-color: #006699;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − | #color-block-hp1 {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/2/2e/T--Aalto-Helsinki--Project-block.jpg");
| |
| − | background-size: cover;
| |
| − | /*background-position: center center; maybe???*/
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − | #color-block-hp2 {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/4/46/T--Aalto-Helsinki--Outreach-block.jpg");
| |
| − | background-size: cover;
| |
| − | /*background-position: center center; maybe???*/
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − | #color-block-hp3 {
| |
| − | width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/0/0b/T--Aalto-Helsinki--Judging-block.jpg");
| |
| − | background-size: cover;
| |
| − | /*background-position: center center; maybe???*/
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − |
| |
| − | #parts-text {
| |
| − | padding: 1% 0% 1% 13%;
| |
| − | color: #ffffff;
| |
| − | width: 46%;
| |
| − | float: left;
| |
| − | text-align: justify;
| |
| − | font-weight: bold;
| |
| − | overflow: hidden;
| |
| − | }
| |
| − | #parts-photo {
| |
| − | padding: 1% 13% 1% 5%;
| |
| − | float: right;
| |
| − | width: 23%;
| |
| − | }
| |
| − |
| |
| − | .color-block-container {
| |
| − | min-height: 68%; /*fills the remaining space of the page*/
| |
| − | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
| |
| − | display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
| |
| − | display: -ms-flexbox; /* TWEENER - IE 10 */
| |
| − | display: -webkit-flex; /* NEW - Chrome */
| |
| − | display: flex;
| |
| − | flex-direction: column;
| |
| − | /*position: relative;
| |
| − | width: 100%;*/
| |
| − | background-color: #ffffff;
| |
| − | }
| |
| − | .color-block-container > div {
| |
| − | flex: 1 1 auto;
| |
| − | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
| |
| − | display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
| |
| − | display: -ms-flexbox; /* TWEENER - IE 10 */
| |
| − | display: -webkit-flex; /* NEW - Chrome */
| |
| − | display: flex;
| |
| − | }
| |
| − | .color-block-container > div > div {
| |
| − | flex: 1 1 auto;
| |
| − | }
| |
| − | .color-block-hp > div {
| |
| − | padding: 1rem;
| |
| − | }
| |
| − | .color-block-hp > div:nth-child(1) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/2/2e/T--Aalto-Helsinki--Project-block.jpg");
| |
| − | background-size: cover;
| |
| − | background-color: #c63;
| |
| − | border: 2px solid white;
| |
| − | }
| |
| − | .color-block-hp > div:nth-child(2) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/4/46/T--Aalto-Helsinki--Outreach-block.jpg");
| |
| − | background-size: cover;
| |
| − | background-color: #c63;
| |
| − | border: 2px solid white;
| |
| − | }
| |
| − | .color-block-hp > div:nth-child(3) {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/0/0b/T--Aalto-Helsinki--Judging-block.jpg");
| |
| − | background-size: cover;
| |
| − | background-color: #c63;
| |
| − | border: 2px solid white;
| |
| − | }
| |
| − | .color-block-hp > div:hover {
| |
| − | padding: 1rem;
| |
| − | }
| |
| − | .color-block-hp > div:hover:nth-child(1) {
| |
| − | background-color: #b85c2e;
| |
| − | /*on hover darker shade of same color*/
| |
| − | }
| |
| − | .color-block-hp > div:hover:nth-child(2) {
| |
| − | background-color: #b85c2e;
| |
| − | /*on hover darker shade of same color*/
| |
| − | }
| |
| − | .color-block-hp > div:hover:nth-child(3) {
| |
| − | background-color: #b85c2e;
| |
| − | /*on hover darker shade of same color*/
| |
| − | }
| |
| − | #color-block-hp {
| |
| − | /*height: 200px;*/
| |
| − | /*min-height: 100px;*/
| |
| − | /*width: 100%;
| |
| − | top: 0%;
| |
| − | height: 80%;
| |
| − | padding: 3% 0px;*/
| |
| − | text-align: left;
| |
| − | background-color: #c63;
| |
| − | /*overflow: hidden;*/
| |
| − | }
| |
| − | #color-block-team {
| |
| − | /*scroll effect: background: url("./img/1group crop+.jpg") no-repeat center center fixed;*/
| |
| − | background: url("https://static.igem.org/mediawiki/2017/c/c2/T--Aalto-Helsinki--group_grass.jpg") no-repeat center center; /* attention, no dash */
| |
| − | /*background-size: 100%;*/
| |
| − | background-size: cover;
| |
| − | height: 55%;
| |
| − | /*width: 100%;
| |
| − | top: 2%;
| |
| − | padding: 30px 0px;
| |
| − | text-align: left;
| |
| − | background-color: #c63;
| |
| − | overflow: hidden;*/
| |
| − | }
| |
| − |
| |
| − | /* text opacity change filter */
| |
| − |
| |
| − | div#color-block span,
| |
| − | div#color-block-mod span,
| |
| − | div#color-block-com span,
| |
| − | div#color-block-hp span {
| |
| − | display: block;
| |
| − | height: 100%;
| |
| − | width: 100%;
| |
| − | opacity: 0.65;
| |
| − | background: #000000;
| |
| − | -moz-transition: all 1s;
| |
| − | -webkit-transition: all 1s;
| |
| − | transition: all 1s;
| |
| − | z-index: ;
| |
| − | }
| |
| − |
| |
| − | div#color-block:hover span,
| |
| − | div#color-block-mod:hover span,
| |
| − | div#color-block-com:hover span
| |
| − | div#color-block-hp:hover span {
| |
| − | opacity: 1;
| |
| − | }
| |
| − |
| |
| − | #color-block:hover {
| |
| − | /*background-color: #066;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | #color-block-mod:hover {
| |
| − | /*background-color: #b88a2e;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | .color-block-hp > div:hover {
| |
| − | /*background-color: #b85c2e;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | #color-block-hp1:hover {
| |
| − | /*background-color: #b85c2e;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | #color-block-hp2:hover {
| |
| − | /*background-color: #b85c2e;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | #color-block-hp3:hover {
| |
| − | /*background-color: #b85c2e;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | #color-block-com:hover {
| |
| − | /*background-color: #036;*/
| |
| − | -webkit-filter: grayscale(10%) brightness(85%);
| |
| − | filter: grayscale(10%) brightness(85%);
| |
| − | }
| |
| − | .text1 {
| |
| − | width: 60%;
| |
| − | /*text closer to center*/
| |
| − | float: left;
| |
| − | padding: 2% 0;
| |
| − | text-align: center;
| |
| − | font-weight: bolder;
| |
| − | font-family: 'Quicksand';
| |
| − | font-size: 30px !important;
| |
| − | color: #fff;
| |
| − | }
| |
| − | .text2 {
| |
| − | left: 50%;
| |
| − | width: 40%;
| |
| − | /*so the text doesn't start immediately from 50% of page*/
| |
| − | float: right;
| |
| − | font-family: 'Quicksand';
| |
| − | font-size: 16px !important;
| |
| − | line-height: normal;
| |
| − | color: #fff;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | .text2-hp {
| |
| − | min-height: 150px; /* added because iGEM + Firefox breaks the function*/
| |
| − | /*left: 50%;*/
| |
| − | font-family: 'Quicksand';
| |
| − | line-height: normal;
| |
| − | padding: 2% 0;
| |
| − | width: 40%;
| |
| − | text-align: left;
| |
| − | /*so the text doesn't start immediately from 50% of page*/
| |
| − | /*float: right;
| |
| − | font-size: 16px;
| |
| − | color: #ffffff;*/
| |
| − | text-decoration: none;
| |
| − | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
| |
| − | display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
| |
| − | display: -ms-flexbox; /* TWEENER - IE 10 */
| |
| − | display: -webkit-flex; /* NEW - Chrome */
| |
| − | display: flex;
| |
| − | /*The links will flex in the vertical direction*/
| |
| − | flex-direction: column;
| |
| − | justify-content: center;
| |
| − | }
| |
| − |
| |
| − | .text2 a {
| |
| − | font-weight: bold;
| |
| − | color: #ffffff;
| |
| − | text-decoration: none;
| |
| − | display: block;
| |
| − | }
| |
| − |
| |
| − | .text2-hp a {
| |
| − | flex: 1 1 auto;
| |
| − | font-weight: bold;
| |
| − | color: #ffffff;
| |
| − | line-height: 6px;
| |
| − | text-decoration: none;
| |
| − | display: block;
| |
| − | }
| |
| − |
| |
| − | .text2 a:hover {
| |
| − | /*color: #eeeeee;*/
| |
| − | -webkit-filter: brightness(10%);
| |
| − | filter: brightness(10%);
| |
| − | text-decoration: none;
| |
| − | }
| |
| − |
| |
| − | .text2-hp a:hover {
| |
| − | -webkit-filter: brightness(10%);
| |
| − | filter: brightness(10%);
| |
| − | text-decoration: none;
| |
| − | }
| |
| − |
| |
| − | /* Headings etc. */
| |
| − | @font-face {
| |
| − | font-family: Quicksand;
| |
| − | src: url(Adam.otf);
| |
| − |
| |
| − | }
| |
| − |
| |
| − | #o-h1 {
| |
| − | color: #000000;
| |
| − | padding: 10px;
| |
| − | font-size: 200% !important;
| |
| − | text-align: center;
| |
| − | font-weight: normal;
| |
| − | font-family: Quicksand;
| |
| − | }
| |
| − |
| |
| − | h1 {
| |
| − | color: #000000;
| |
| − | padding: 10px;
| |
| − | font-size: 250% !important;
| |
| − | text-align: center;
| |
| − | font-weight: normal;
| |
| − | }
| |
| − |
| |
| − | h2 {
| |
| − | color: #000000;
| |
| − | padding: 10px;
| |
| − | font-size: 80px !important;
| |
| − | }
| |
| − |
| |
| − | h3 {
| |
| − | color: #000000;
| |
| − | font-size: 200% !important;
| |
| − | text-align: left;
| |
| − | }
| |
| − |
| |
| − | h4 {
| |
| − | color: #000000;
| |
| − | font-size: 150% !important;
| |
| − | line-height: 33px !important;
| |
| − | text-align: left;
| |
| − | }
| |
| − |
| |
| − | h5 {
| |
| − | color: #ffffff;
| |
| − | font-size: 115% !important;
| |
| − | line-height: 30px !important;
| |
| − | font-style: italic !important;
| |
| − | text-align: left;
| |
| − | }
| |
| − |
| |
| − | /* Dropdown menu styles */
| |
| − | #dropdown {
| |
| − | position: relative;
| |
| − | height: 24px;
| |
| − | background: #ffffff;
| |
| − | width: auto;
| |
| − | }
| |
| − | #dropdown ul {
| |
| − | list-style: none;
| |
| − | padding: 0;
| |
| − | margin: auto; /*this was 0*/
| |
| − | /*text-align: center; this was added*/
| |
| − | line-height: 1;
| |
| − | }
| |
| − | #dropdown > ul {
| |
| − | position: relative;
| |
| − | display: block;
| |
| − | text-align: center; /*test, this was added*/
| |
| − | background: #ffffff; /*This is the heading1 background*/
| |
| − | width: 100%;
| |
| − | z-index: 500;
| |
| − | }
| |
| − | #dropdown:after,
| |
| − | #dropdown > ul:after {
| |
| − | content: ".";
| |
| − | display: block;
| |
| − | clear: both;
| |
| − | visibility: hidden;
| |
| − | line-height: 0;
| |
| − | height: 0;
| |
| − | }
| |
| − | #dropdown.align-right > ul > li {
| |
| − | float: right;
| |
| − | }
| |
| − | #dropdown.align-center ul {
| |
| − | text-align: center;
| |
| − | }
| |
| − | #dropdown.align-center ul ul {
| |
| − | text-align: center; /*this was left*/
| |
| − | }
| |
| − | #dropdown > ul > li {
| |
| − | display: inline-block;
| |
| − | position: relative;
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | }
| |
| − | #dropdown > ul > #menu-button {
| |
| − | display: none;
| |
| − | }
| |
| − | #dropdown ul li a {
| |
| − | display: block;
| |
| − | font-family: 'Quicksand', Work Sans;
| |
| − | src: url(Adam.otf);
| |
| − | font-weight: bold;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − | #dropdown > ul > li > a {
| |
| − | font-size: 18px;
| |
| − | font-weight: bold;
| |
| − | text-align: center; /* this was added */
| |
| − | padding: 5px 45px; /* heading sizes */
| |
| − | color: #363638; /*previous color #7a8189;*/
| |
| − | -moz-transition: color 0.25s ease-out;
| |
| − | -webkit-transition: color 0.25s ease-out;
| |
| − | -ms-transition: color 0.25s ease-out;
| |
| − | -o-transition: color 0.25s ease-out;
| |
| − | transition: color 0.25s ease-out;
| |
| − | }
| |
| − | #dropdown > ul > li.has-sub > a {
| |
| − | padding-right: 40px;
| |
| − | }
| |
| − | /*Dropdown parent links give different colours when hovered*/
| |
| − | #dropdown > ul > li:hover > a.lab {
| |
| − | color: #339999;
| |
| − | border-bottom: 3px solid currentColor;
| |
| − | }
| |
| − | #dropdown > ul > li:hover > a.mod {
| |
| − | color: #CC9933;
| |
| − | border-bottom: 3px solid currentColor;
| |
| − | }
| |
| − | #dropdown > ul > li:hover > a.hp {
| |
| − | color: #CC6633;
| |
| − | border-bottom: 3px solid currentColor;
| |
| − | }
| |
| − | #dropdown > ul > li:hover > a.com {
| |
| − | color: #336699;
| |
| − | border-bottom: 3px solid currentColor;
| |
| − | }
| |
| − | #dropdown > ul > li:hover > a.peo {
| |
| − | color: #336633;
| |
| − | border-bottom: 3px solid currentColor;
| |
| − | }
| |
| − | #dropdown li.has-sub::after {
| |
| − | display: block;
| |
| − | content: "";
| |
| − | position: absolute;
| |
| − | width: 0;
| |
| − | height: 0;
| |
| − | }
| |
| − |
| |
| − | #dropdown ul ul {
| |
| − | position: absolute;
| |
| − | left: -9999px;
| |
| − | top: 70px;
| |
| − | opacity: 0;
| |
| − | -moz-transition: opacity .3s ease, top .25s ease;
| |
| − | -webkit-transition: opacity .3s ease, top .25s ease;
| |
| − | -ms-transition: opacity .3s ease, top .25s ease;
| |
| − | -o-transition: opacity .3s ease, top .25s ease;
| |
| − | transition: opacity .3s ease, top .25s ease;
| |
| − | z-index: 1000;
| |
| − | }
| |
| − | #dropdown ul ul ul {
| |
| − | top: 37px;
| |
| − | padding-left: 5px;
| |
| − | }
| |
| − | #dropdown ul ul li {
| |
| − | position: relative;
| |
| − | margin-bottom: .001em; /*Added because iGEM website breaks the dropdown otherwise*/
| |
| − | }
| |
| − | /* This defines how much space between heading and drop down menu */
| |
| − | #dropdown > ul > li:hover > ul {
| |
| − | width: 100%; /* this makes the dropdown menus widths 100% */
| |
| − | left: auto;
| |
| − | right: auto;
| |
| − | top: 31px; /*this was 44px -> too far away, 31px is right under */
| |
| − | opacity: 1;
| |
| − | }
| |
| − | #dropdown.align-right > ul > li:hover > ul {
| |
| − | left: auto;
| |
| − | right: 0;
| |
| − | opacity: 1;
| |
| − | }
| |
| − | /*Specifies how the link opened by hovering dropdown looks*/
| |
| − | #dropdown ul ul li:hover > ul {
| |
| − | left: 175px; /* how far from the dropdown menu the submenu opens */
| |
| − | top: 0;
| |
| − | opacity: 1;
| |
| − | }
| |
| − | #dropdown.align-right ul ul li:hover > ul {
| |
| − | left: auto;
| |
| − | /*right: 170px;*/
| |
| − | width: 100%; /*added*/
| |
| − | top: 0;
| |
| − | opacity: 1;
| |
| − | padding-right: 5px;
| |
| − | }
| |
| − | #dropdown ul ul li a {
| |
| − | /*width: 170px;*/
| |
| − | width: 100%; /*the width of the subelement of subheadings */
| |
| − | border-bottom: 1px solid #eeeeee; /* horiz. line colour */
| |
| − | padding: 4px 2.6%;
| |
| − | font-size: 13px;
| |
| − | font-weight: bold;
| |
| − | color: #363638; /* colour of the drop down menu subheadings */
| |
| − | background: #ffffff;
| |
| − | -webkit-transition: all .5s ease;
| |
| − | -moz-transition: all .5s ease;
| |
| − | -ms-transition: all .5s ease;
| |
| − | -o-transition: all .5s ease;
| |
| − | transition: all .5s ease;
| |
| − | }
| |
| − | #dropdown.align-right ul ul li a {
| |
| − | text-align: center; /* this was right prev. */
| |
| − | }
| |
| − |
| |
| − | #dropdown ul ul li:hover > a {
| |
| − | background: #f2f2f2; /* colour of dropdown menu links when hovered - light grey */
| |
| − | color: #363638;
| |
| − | }
| |
| − |
| |
| − | #dropdown ul ul li:last-child > a,
| |
| − | #dropdown ul ul li.last > a {
| |
| − | border-bottom: 0;
| |
| − | }
| |
| − |
| |
| − | /* Social media icons */
| |
| − | @font-face {
| |
| − | font-family: 'pe-icon-social';
| |
| − | src:url('https://static.igem.org/mediawiki/2017/d/de/T--Aalto-Helsinki--pe-icon-social.eot');
| |
| − | src:url('https://static.igem.org/mediawiki/2017/2/2a/T--Aalto-Helsinki--pe-icon-social.svg') format('embedded-opentype'),
| |
| − | url('https://static.igem.org/mediawiki/2017/2/28/T--Aalto-Helsinki--pe-icon-social%2B%2B.woff') format('woff'),
| |
| − | url('https://static.igem.org/mediawiki/2017/c/ce/T--Aalto-Helsinki--pe-icon-social%2B.ttf') format('truetype'),
| |
| − | url('https://static.igem.org/mediawiki/2017/2/2a/T--Aalto-Helsinki--pe-icon-social.svg') format('svg');
| |
| − | font-weight: normal;
| |
| − | font-style: normal;
| |
| − | }
| |
| − |
| |
| − | [class^="pe-so-"], [class*=" pe-so-"] {
| |
| − | display: inline-block;
| |
| − | font-family: 'pe-icon-social';
| |
| − | speak: none;
| |
| − | font-style: normal;
| |
| − | font-weight: normal;
| |
| − | font-variant: normal;
| |
| − | text-transform: none;
| |
| − | line-height: 1;
| |
| − |
| |
| − | /* Better Font Rendering =========== */
| |
| − | -webkit-font-smoothing: antialiased;
| |
| − | -moz-osx-font-smoothing: grayscale;
| |
| − | }
| |
| − | .pe-2x {
| |
| − | font-size: 2em;
| |
| − | }
| |
| − | .pe-so-instagram:before {
| |
| − | content: "\e626";
| |
| − | }
| |
| − | .pe-so-linkedin:before {
| |
| − | content: "\e62c";
| |
| − | }
| |
| − | .pe-so-twitter:before {
| |
| − | content: "\e651";
| |
| − | }
| |
| − | .pe-so-facebook:before {
| |
| − | content: "\e617";
| |
| − | }
| |
| − |
| |
| − | /* Footer styles */
| |
| − | footer .footer-social {
| |
| − | position: static;
| |
| − | width: 100%;
| |
| − | text-align: center;
| |
| − | padding: 15px 0px 5px 0px;
| |
| − | bottom: 0;
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | font-family: "Quicksand";
| |
| − | }
| |
| − | footer .footer-social ul {
| |
| − | list-style: none;
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | }
| |
| − | footer .footer-social ul li {
| |
| − | display: inline-block;
| |
| − | }
| |
| − | footer .footer-social ul li a {
| |
| − | display: block;
| |
| − | font-size: 16px;
| |
| − | color: #ffffff;
| |
| − | -webkit-transition: background-color 0.3s;
| |
| − | transition: background-color 0.3s;
| |
| − | }
| |
| − | footer .footer-social ul li a:hover {
| |
| − | color: #363638 !important;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | footer .footer-social a:hover {
| |
| − | color: #363638 !important;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | /*Footer for main page*/
| |
| − |
| |
| − | footer .footer-mainpage {
| |
| − | position: absolute;
| |
| − | width: 100%;
| |
| − | text-align: center;
| |
| − | padding: 15px 0px 5px 0px;
| |
| − | bottom: 0;
| |
| − | background-color: #339999;
| |
| − | overflow: hidden;
| |
| − | font-family: "Quicksand";
| |
| − | }
| |
| − |
| |
| − | footer .footer-mainpage ul {
| |
| − | list-style: none;
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | }
| |
| − | footer .footer-mainpage ul li {
| |
| − | display: inline-block;
| |
| − | }
| |
| − | footer .footer-mainpage ul li a {
| |
| − | display: block;
| |
| − | font-size: 16px !important;
| |
| − | color: #ffffff;
| |
| − | -webkit-transition: background-color 0.3s;
| |
| − | transition: background-color 0.3s;
| |
| − | }
| |
| − | footer .footer-mainpage ul li a:hover {
| |
| − | color: #363638 !important;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | footer .footer-mainpage a:hover {
| |
| − | color: #363638 !important;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | footer .texts ul a {
| |
| − | font-weight: bold;
| |
| − | text-decoration: none;
| |
| − | color: #ffffff;
| |
| − | padding: 15px 30px;
| |
| − | font-size: 14px !important;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | @media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
| |
| − |
| |
| − | html {
| |
| − | position: relative;
| |
| − | height: 100%;
| |
| − | min-width: 360px;
| |
| − | text-align: center;
| |
| − | background-color: white;
| |
| − | background-size: cover;
| |
| − | font-size:16px !important;
| |
| − | }
| |
| − |
| |
| − | header, body {
| |
| − | height: 100%;
| |
| − | min-height: 600px; /* So that the bottom bar does not go over the picture on a small screen */
| |
| − | margin: 0 0 0px;
| |
| − | padding: 0;
| |
| − | }
| |
| − |
| |
| − | #dropdown {
| |
| − | width: auto;
| |
| − | }
| |
| − | #dropdown.align-center ul {
| |
| − | text-align: left;
| |
| − | }
| |
| − | #dropdown.align-right > ul > li {
| |
| − | float: none;
| |
| − | }
| |
| − | #dropdown ul {
| |
| − | width: auto;
| |
| − | }
| |
| − | #dropdown .submenuArrow,
| |
| − | #dropdown #indicatorContainer {
| |
| − | display: none;
| |
| − | }
| |
| − | #dropdown > ul {
| |
| − | height: auto;
| |
| − | display: block;
| |
| − | }
| |
| − | #dropdown > ul > li {
| |
| − | float: none;
| |
| − | }
| |
| − | #dropdown li,
| |
| − | #dropdown > ul > li {
| |
| − | display: none;
| |
| − | }
| |
| − | #dropdown ul ul,
| |
| − | #dropdown ul ul ul,
| |
| − | #dropdown ul > li:hover > ul,
| |
| − | #dropdown ul ul > li:hover > ul,
| |
| − | #dropdown.align-right ul ul,
| |
| − | #dropdown.align-right ul ul ul,
| |
| − | #dropdown.align-right ul > li:hover > ul,
| |
| − | #dropdown.align-right ul ul > li:hover > ul {
| |
| − | position: relative;
| |
| − | left: auto;
| |
| − | top: auto;
| |
| − | opacity: 1;
| |
| − | padding-left: 0;
| |
| − | padding-right: 0;
| |
| − | right: auto;
| |
| − | }
| |
| − | #dropdown ul .has-sub::after {
| |
| − | display: none;
| |
| − | }
| |
| − | #dropdown ul li a {
| |
| − | padding: 12px 20px;
| |
| − | }
| |
| − | #dropdown ul ul li a {
| |
| − | border: 0;
| |
| − | background: none;
| |
| − | width: auto;
| |
| − | padding: 28px 35px;
| |
| − | }
| |
| − | #dropdown.align-right ul ul li a {
| |
| − | text-align: left;
| |
| − | }
| |
| − | #dropdown ul ul li:hover > a.lab > a.mod {
| |
| − | background: none;
| |
| − | color: #363638;
| |
| − | }
| |
| − | #dropdown ul ul ul a {
| |
| − | padding: 8px 50px;
| |
| − | }
| |
| − | #dropdown ul ul ul ul a {
| |
| − | padding: 8px 65px;
| |
| − | }
| |
| − | #dropdown ul ul ul ul ul a {
| |
| − | padding: 8px 80px;
| |
| − | }
| |
| − | #dropdown ul ul ul ul ul ul a {
| |
| − | padding: 8px 95px;
| |
| − | }
| |
| − | #dropdown > ul > #menu-button {
| |
| − | display: block;
| |
| − | cursor: pointer;
| |
| − | }
| |
| − | #dropdown #menu-button > a {
| |
| − | padding: 14px 20px;
| |
| − | }
| |
| − | #dropdown ul.open li,
| |
| − | #dropdown > ul.open > li {
| |
| − | display: block;
| |
| − | }
| |
| − | #dropdown > ul.open > li#menu-button > a {
| |
| − | color: #fff;
| |
| − | border-bottom: 1px solid rgba(150, 150, 150, 0.1);
| |
| − | }
| |
| − | #dropdown ul ul::after {
| |
| − | display: none;
| |
| − | }
| |
| − | #dropdown #menu-button::after {
| |
| − | display: block;
| |
| − | content: '';
| |
| − | position: absolute;
| |
| − | height: 3px;
| |
| − | width: 22px;
| |
| − | border-top: 2px solid #7a8189;
| |
| − | border-bottom: 2px solid #7a8189;
| |
| − | right: 20px;
| |
| − | top: 15px;
| |
| − | }
| |
| − |
| |
| − | #dropdown #menu-button::before {
| |
| − | display: block;
| |
| − | content: '';
| |
| − | position: absolute;
| |
| − | height: 3px;
| |
| − | width: 22px;
| |
| − | border-top: 2px solid #7a8189;
| |
| − | right: 20px;
| |
| − | top: 25px;
| |
| − | }
| |
| − | #dropdown ul.open #menu-button::after,
| |
| − | #dropdown ul.open #menu-button::before {
| |
| − | border-color: #fff;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | /* Other than dropdown menu */
| |
| − |
| |
| − | footer .footer-social ul li a {
| |
| − | font-size: 12px !important;
| |
| − | }
| |
| − | footer .texts ul a {
| |
| − | font-size: 12px !important;
| |
| − | }
| |
| − | .pe-2x {
| |
| − | font-size: 1.5em;
| |
| − | }
| |
| − | .container {
| |
| − | width: auto !important;
| |
| − | }
| |
| − | #mainlogo {
| |
| − | background-image: url("https://static.igem.org/mediawiki/2017/9/92/T--Aalto-Helsinki--mainlogo-mobile.png");
| |
| − | background-size: auto 100%;
| |
| − | background-repeat: no-repeat;
| |
| − | max-height: 152px;
| |
| − | }
| |
| − |
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| | </style> | | </style> |
| | | | |
| − | <!-- THIS IS WHERE THE HTML BEGINS --> | + | <!-- FOOTER --> |
| − | | + | <footer> |
| − | <head> | + | <div class="footer-social"> |
| − | | + | <div class="texts"> |
| − | <meta charset='utf-8'>
| + | <ul class="pe-social"> |
| − | <meta http-equiv="X-UA-Compatible" content="IE=edge">
| + | <a href="https://2017.igem.org/Team:Aalto-Helsinki"> HOME</a> |
| − | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | <a href=" http:// www. aalto. fi/ en/"> AALTO UNIVERSITY</a> |
| − | | + | <a href=" http:// www. aaltohelsinki. com/ 2017/ index. html"> |
| − | <!-- This tells the browser that your page is responsive --> | + | <img class="some" src="https://static.igem.org/mediawiki/2017/f/f1/T--Aalto-Helsinki--home_icon.png"> |
| − | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
| + | </a> |
| − | | + | <li> |
| − | <link rel="stylesheet" href="https://2017.igem.org/Template:Aalto-Helsinki">
| + | <a href="https:// www. facebook. com/ AaltoHelsinki/"> |
| − | <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
| + | <i class="pe-so-facebook pe-hover pe-2x"></i> |
| − | <script src="script.js"></script>
| + | </a> |
| − | <!--MathJax hosted by iGEM-->
| + | </li> |
| − | <script src="https://2017.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
| + | <li> |
| − | <!--Vector social media icons provided by Pixeden-->
| + | <a href="https:// www. instagram. com/ aaltohelsinki_igem/"> |
| − | <link rel="stylesheet" href="./pe-icon-social/css/pe-icon-social.css">
| + | <i class="pe-so-instagram pe-hover pe-2x"></i> |
| − | <link rel="stylesheet" href="./pe-icon-social/css/helper.css">
| + | </a> |
| − | | + | </li> |
| − | <!-- Quicksand font -->
| + | <li> |
| − | <link href='//fonts.googleapis.com/css?family=Quicksand' rel='stylesheet'>
| + | <a href="https:// twitter. com/ aaltohelsinki?lang= en"> |
| − | <!-- Work Sans font -->
| + | <i class="pe-so-twitter pe-hover pe-2x"></i> |
| − | <link href='https://fonts.googleapis.com/css?family=Work+Sans' rel='stylesheet'>
| + | </a> |
| − | | + | </li> |
| − | <title>Aalto-Helsinki</title>
| + | <li> |
| − | | + | <a href= "https:// www. linkedin. com/ company- beta/ 16253263/ "> |
| − | </head>
| + | <i class="pe-so-linkedin pe-hover pe-2x"></i> |
| − | | + | </a> |
| − | <body>
| + | </li> |
| − | <!--HTML5 syntax doesn't work so hack-->
| + | <a href="https:// www. helsinki. fi/ en"> UNIVERSITY OF HELSINKI</a> |
| − | <div id="space"><br></div>
| + | <a href="https://2017.igem.org/Team:Aalto-Helsinki/ Map"> SITE MAP</a> |
| − | <div id="mainlogo">
| + | </ul> |
| − | <a href="https://2017.igem.org/Team:Aalto-Helsinki"> <span class="link-spanner"></span> | + | </div> |
| − | </a><br><br><br><br><br><br><br><br>
| + | </div> |
| − | </div>
| + | </footer> |
| − | <br>
| + | </body> |
| − | <!-- DROPDOWN MENU -->
| + | |
| − | <div id='dropdown'>
| + | |
| − | <ul>
| + | |
| − | <li class='active has-sub'><a class='lab' href='https://2017.igem.org/Team:Aalto-Helsinki/Description'>Laboratory</a>
| + | |
| − | <ul>
| + | |
| − | <li class='has-sub'>
| + | |
| − | <li><a href=" https:// 2017. igem. org/ Team:Aalto-Helsinki/ Description"> Overview</a ></li> | + | |
| − | <li><a href=" https:// 2017. igem. org/ Team:Aalto-Helsinki/ Laboratory_Theory">Theoretical Background</a></li> | + | |
| − | <li class='has-sub'><a href="https://2017.igem.org/Team:Aalto-Helsinki/Experiments">Materials and Methods</a>
| + | |
| − | <ul>
| + | |
| − | <li class='last'><a href="https://2017.igem.org/Team:Aalto-Helsinki/Protocols">Protocols</a></li> | + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Results">Results and Discussion</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Laboratory_Future">Future Perspectives</a></li>
| + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li class='active has-sub'><a class='mod' href='https://2017.igem.org/Team:Aalto-Helsinki/Model'>Modeling</a>
| + | |
| − | <ul>
| + | |
| − | <li class='has-sub'>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Model">Overview</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Model_Theory">Theoretical Background</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Model_Setup">Simulation Setup</a></li>
| + | |
| − | <li><a href="https:// 2017. igem. org/ Team:Aalto-Helsinki/ Model_Results" >Results and Discussion</a></li> | + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | | + | |
| − | <li class='active has-sub'><a class='hp' href='https://2017.igem.org/Team:Aalto-Helsinki/Human_Practices'>Human Practices</a>
| + | |
| − | <ul>
| + | |
| − | <li class='has-sub'>
| + | |
| − | <li><a href='https://2017.igem.org/Team:Aalto-Helsinki/Human_Practices'>Overview</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Story">Project</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Education">Public Outreach</a></li>
| + | |
| − | <li><a href="https:// 2017. igem. org/ Team:Aalto-Helsinki/ HP/Silver" >Judging</a></li> | + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | | + | |
| − | <li class='active has-sub'><a class='com' href='https://2017.igem.org/Team:Aalto-Helsinki/Community'>Community</a>
| + | |
| − | <ul>
| + | |
| − | <li class='has-sub'>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Community">Overview</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Parts">Parts</a></li>
| + | |
| − | <li><a href="https:// 2017. igem.org/ Team:Aalto-Helsinki/Composite_Part">Composite Part</a></li> | + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Improve">Improved Part</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/InterLab">InterLab</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Collaborations">Collaborations</a></li>
| + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | | + | |
| − | <li class='active has-sub'><a class='peo' href= 'https:// 2017. igem. org/ Team:Aalto- Helsinki/ Team'>People</ a> | + | |
| − | <ul>
| + | |
| − | <li class='has-sub'>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Team">Team Members</a></li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Advisors">Advisors</a></li>
| + | |
| − | <li><a href="https:// 2017. igem. org/ Team:Aalto-Helsinki/Attributions"> Attributions</a ></li> | + | |
| − | <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/ Sponsors"> Sponsors</a ></li> | + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | </ul> | + | |
| − | </div> | + | |
| | | | |
| | </html> | | </html> |
PURIFY YOUR PORES FROM ACNE BACTERIA
