Difference between revisions of "Template:Aalto-Helsinki"

 
(43 intermediate revisions by the same user not shown)
Line 12: Line 12:
 
     });
 
     });
  
var posLeft = activeElement.position().left;
+
  var posLeft = activeElement.position().left;
var elementWidth = activeElement.width();
+
  var elementWidth = activeElement.width();
posLeft = posLeft + elementWidth/2 -6;
+
  posLeft = posLeft + elementWidth/2 -6;
if (activeElement.hasClass('has-sub')) {
+
  if (activeElement.hasClass('has-sub')) {
posLeft -= 6;
+
    posLeft -= 6;
}
+
  }
+
 
$("#dropdown>ul>li").hover(function() {
+
  $("#dropdown>ul>li").hover(function() {
 
         element = $(this);
 
         element = $(this);
 
         var w = element.width();
 
         var w = element.width();
 
         if ($(this).hasClass('has-sub'))
 
         if ($(this).hasClass('has-sub'))
 
         {
 
         {
        leftPos = element.position().left + w/2 - 12;
+
          leftPos = element.position().left + w/2 - 12;
 
         }
 
         }
 
         else {
 
         else {
        leftPos = element.position().left + w/2 - 6;
+
          leftPos = element.position().left + w/2 - 6;
 
         };
 
         };
 
       });
 
       });
  
$('#dropdown>ul').prepend('<li id="menu-button"><a>Menu</a></li>');
+
  $('#dropdown>ul').prepend('<li id="menu-button"><a>Menu</a></li>');
$( "#menu-button" ).click(function(){
+
  $( "#menu-button" ).click(function(){
    if ($(this).parent().hasClass('open')) {
+
        if ($(this).parent().hasClass('open')) {
    $(this).parent().removeClass('open');
+
          $(this).parent().removeClass('open');
    }
+
        }
    else {
+
        else {
    $(this).parent().addClass('open');
+
          $(this).parent().addClass('open');
    }
+
        }
    });
+
      });
  
 
// ROTATING PORIFI
 
// ROTATING PORIFI
Line 119: Line 119:
 
/***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
 
/***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
  
/* Clear the default wiki settings */
+
  /* Clear the default wiki settings */
  
#home_logo, #sideMenu { display:none; }
+
  #home_logo, #sideMenu { display:none; }
#sideMenu, #top_title, .patrollink  {display:none;}
+
  #sideMenu, #top_title, .patrollink  {display:none;}
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
+
  #content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
body {background-color:white; }
+
  body {background-color:white; }
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
  #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
  
 
/* OUR OWN CSS BEGINS */
 
/* OUR OWN CSS BEGINS */
Line 157: Line 157:
 
#paragraph {
 
#paragraph {
 
   margin: 20px 15px 35px 10px !important;
 
   margin: 20px 15px 35px 10px !important;
 +
}
 +
#figuretext-c {
 +
  text-align: center !important;
 
}
 
}
  
Line 191: Line 194:
 
   height: 100% !important;
 
   height: 100% !important;
 
}
 
}
 
+
/* Force link padding for https keep small */
 +
#bodyContent a[href^="https://"], .link-https{
 +
padding-right: 1px !important;
 +
}
 
#space {
 
#space {
 
   height: 30px;
 
   height: 30px;
 
}
 
}
 
#mainlogo {
 
#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-size: cover;
 
   background-repeat: no-repeat;
 
   background-repeat: no-repeat;
Line 216: Line 222:
 
   min-height: 65%;
 
   min-height: 65%;
 
   padding: 0px 0px;  
 
   padding: 0px 0px;  
   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
+
   /*display: -webkit-box;*/     /* OLD - iOS 6-, Safari 3.1-6 */
   display: -moz-box;        /* OLD - Firefox 19- (buggy but mostly works) */
+
   /*display: -moz-box;*/         /* OLD - Firefox 19- (buggy but mostly works) */
   display: -ms-flexbox;      /* TWEENER - IE 10 */
+
   /*display: -ms-flexbox;*/     /* TWEENER - IE 10 */
   display: -webkit-flex;    /* NEW - Chrome */
+
   /*display: -webkit-flex;*/     /* NEW - Chrome */
   display: flex;
+
   /*display: flex;*/
   flex-direction: column;
+
   /*flex-direction: column;*/
 
}
 
}
 
.front-page > div {
 
.front-page > div {
Line 261: Line 267:
 
   margin-right: 15px;
 
   margin-right: 15px;
 
   margin-bottom: 15px;
 
   margin-bottom: 15px;
  /*border: 1px solid #4d4d4d;*/
 
 
   -webkit-border-radius: 3px;
 
   -webkit-border-radius: 3px;
 
     -moz-border-radius: 3px;
 
     -moz-border-radius: 3px;
Line 291: Line 296:
 
   background-color: #339999;
 
   background-color: #339999;
 
   color: #ffffff;
 
   color: #ffffff;
 +
  font-family: Work Sans !important;
 
}
 
}
  
Line 382: Line 388:
  
 
.basictext {
 
.basictext {
   font-weight: lighter;
+
   font-weight: 300 !important;
 
   line-height: 32px;
 
   line-height: 32px;
 
   font-family: Work Sans;
 
   font-family: Work Sans;
Line 388: Line 394:
  
 
.introtext {
 
.introtext {
   font-weight: lighter;
+
   font-weight: 300 !important;
 
   line-height: 32px;
 
   line-height: 32px;
 
}
 
}
Line 471: Line 477:
 
   padding: 30px 0px;
 
   padding: 30px 0px;
 
   text-align: left;
 
   text-align: left;
   background-color: #336633;
+
   background-color: #bbddbb;
 
   overflow: hidden;
 
   overflow: hidden;
 
   font-family: Work Sans;
 
   font-family: Work Sans;
Line 500: Line 506:
 
   padding: 0 8%;
 
   padding: 0 8%;
 
   color: #000000;
 
   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-bottom:-100px;
 
   margin-top: 25px;
 
   margin-top: 25px;
Line 511: Line 529:
 
   padding: 0 18%;
 
   padding: 0 18%;
 
   color: #000000;
 
   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%;
 
   line-height: 130%;
 
}
 
}
Line 521: Line 548:
 
   padding: 0 18%;
 
   padding: 0 18%;
 
   color: #000000;
 
   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;
 
}
 
}
  
Line 532: Line 567:
 
   background-image: url("https://static.igem.org/mediawiki/2017/d/d1/T--Aalto-Helsinki--Laboratory-block.jpg");
 
   background-image: url("https://static.igem.org/mediawiki/2017/d/d1/T--Aalto-Helsinki--Laboratory-block.jpg");
 
   background-size: cover;
 
   background-size: cover;
  /*background-position: center center; maybe???*/
 
 
   background-color: #339999;
 
   background-color: #339999;
 
   overflow: hidden;
 
   overflow: hidden;
Line 556: Line 590:
 
   background-size: cover;
 
   background-size: cover;
 
   background-color: #006699;
 
   background-color: #006699;
 +
  overflow: hidden;
 +
}
 +
#color-block-peo {
 +
  width: 100%;
 +
  top: 2%;
 +
  padding: 30px 0px;
 +
  text-align: left;
 +
  background-size: cover;
 +
  background-color: #bbddbb; /* green */
 
   overflow: hidden;
 
   overflow: hidden;
 
}
 
}
Line 565: Line 608:
 
   background-image: url("https://static.igem.org/mediawiki/2017/2/2e/T--Aalto-Helsinki--Project-block.jpg");   
 
   background-image: url("https://static.igem.org/mediawiki/2017/2/2e/T--Aalto-Helsinki--Project-block.jpg");   
 
   background-size: cover;
 
   background-size: cover;
  /*background-position: center center; maybe???*/
 
 
   background-color: #339999;
 
   background-color: #339999;
 
   overflow: hidden;
 
   overflow: hidden;
Line 576: Line 618:
 
   background-image: url("https://static.igem.org/mediawiki/2017/4/46/T--Aalto-Helsinki--Outreach-block.jpg");
 
   background-image: url("https://static.igem.org/mediawiki/2017/4/46/T--Aalto-Helsinki--Outreach-block.jpg");
 
   background-size: cover;
 
   background-size: cover;
  /*background-position: center center; maybe???*/
 
 
   background-color: #339999;
 
   background-color: #339999;
 
   overflow: hidden;
 
   overflow: hidden;
Line 587: Line 628:
 
   background-image: url("https://static.igem.org/mediawiki/2017/0/0b/T--Aalto-Helsinki--Judging-block.jpg");
 
   background-image: url("https://static.igem.org/mediawiki/2017/0/0b/T--Aalto-Helsinki--Judging-block.jpg");
 
   background-size: cover;
 
   background-size: cover;
  /*background-position: center center; maybe???*/
 
 
   background-color: #339999;
 
   background-color: #339999;
 
   overflow: hidden;
 
   overflow: hidden;
Line 593: Line 633:
  
 
#parts-text {
 
#parts-text {
   padding: 1% 0% 1% 13%;
+
   padding: 1% 0% 1% 14%;
   color: #ffffff;
+
   color: #336633;
   width: 46%;
+
   width: 66%;
 
   float: left;
 
   float: left;
 
   text-align: justify;
 
   text-align: justify;
 
   font-weight: bold;
 
   font-weight: bold;
 
   overflow: hidden;
 
   overflow: hidden;
 +
  font-family: Work Sans !important;
 
}
 
}
 
#parts-photo {
 
#parts-photo {
 
   padding: 1% 13% 1% 5%;
 
   padding: 1% 13% 1% 5%;
 
   float: right;
 
   float: right;
   width: 23%;
+
   width: 30%;
 +
  max-width: 660px;
 
}
 
}
  
Line 629: Line 671:
 
.color-block-container > div > div {
 
.color-block-container > div > div {
 
   flex: 1 1 auto;
 
   flex: 1 1 auto;
 +
  margin-top: 5px;
 
}
 
}
 
.color-block-hp > div {
 
.color-block-hp > div {
Line 667: Line 710:
 
}
 
}
 
#color-block-hp {
 
#color-block-hp {
  /*height: 200px;*/
 
  /*min-height: 100px;*/
 
  /*width: 100%;
 
  top: 0%;
 
  height: 80%;
 
  padding: 3% 0px;*/
 
 
   text-align: left;
 
   text-align: left;
 
   background-color: #c63;
 
   background-color: #c63;
  /*overflow: hidden;*/
 
 
}
 
}
 
#color-block-team {
 
#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;
   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;
 
   background-size: cover;
 
   height: 55%;
 
   height: 55%;
  /*width: 100%;
 
  top: 2%;
 
  padding: 30px 0px;
 
  text-align: left;
 
  background-color: #c63;
 
  overflow: hidden;*/
 
 
}
 
}
  
Line 696: Line 724:
 
div#color-block-mod span,
 
div#color-block-mod span,
 
div#color-block-com span,
 
div#color-block-com span,
 +
div#color-block-hp1 span,
 +
div#color-block-hp2 span,
 +
div#color-block-hp3 span,
 
div#color-block-hp span {
 
div#color-block-hp span {
 
     display: block;
 
     display: block;
Line 710: Line 741:
 
div#color-block:hover span,
 
div#color-block:hover span,
 
div#color-block-mod:hover span,
 
div#color-block-mod:hover span,
div#color-block-com:hover span
+
div#color-block-com:hover span,
 +
div#color-block-hp1:hover span,
 +
div#color-block-hp2:hover span,
 +
div#color-block-hp3:hover span,
 
div#color-block-hp:hover span {
 
div#color-block-hp:hover span {
 
     opacity: 1;
 
     opacity: 1;
Line 716: Line 750:
  
 
#color-block:hover {
 
#color-block:hover {
  /*background-color: #066;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
#color-block-mod:hover {
 
#color-block-mod:hover {
  /*background-color: #b88a2e;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
.color-block-hp > div:hover {
 
.color-block-hp > div:hover {
  /*background-color: #b85c2e;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
#color-block-hp1:hover {
 
#color-block-hp1:hover {
  /*background-color: #b85c2e;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
#color-block-hp2:hover {
 
#color-block-hp2:hover {
  /*background-color: #b85c2e;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
#color-block-hp3:hover {
 
#color-block-hp3:hover {
  /*background-color: #b85c2e;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
}
 
}
 
#color-block-com:hover {
 
#color-block-com:hover {
  /*background-color: #036;*/
 
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   -webkit-filter:  grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
 
   filter: grayscale(10%) brightness(85%);
Line 752: Line 779:
 
.text1 {
 
.text1 {
 
   width: 60%;
 
   width: 60%;
  /*text closer to center*/
 
 
   float: left;
 
   float: left;
 
   padding: 2% 0;
 
   padding: 2% 0;
Line 764: Line 790:
 
   left: 50%;
 
   left: 50%;
 
   width: 40%;
 
   width: 40%;
  /*so the text doesn't start immediately from 50% of page*/
 
 
   float: right;
 
   float: right;
 
   font-family: 'Quicksand';
 
   font-family: 'Quicksand';
Line 774: Line 799:
 
.text2-hp {
 
.text2-hp {
 
   min-height: 150px; /* added because iGEM + Firefox breaks the function*/
 
   min-height: 150px; /* added because iGEM + Firefox breaks the function*/
  /*left: 50%;*/
 
 
   font-family: 'Quicksand';
 
   font-family: 'Quicksand';
 
   line-height: normal;
 
   line-height: normal;
Line 780: Line 804:
 
   width: 40%;
 
   width: 40%;
 
   text-align: left;
 
   text-align: left;
  /*so the text doesn't start immediately from 50% of page*/
 
  /*float: right;
 
  font-size: 16px;
 
  color: #ffffff;*/
 
 
   text-decoration: none;
 
   text-decoration: none;
 
   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
 
   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
Line 790: Line 810:
 
   display: -webkit-flex;    /* NEW - Chrome */
 
   display: -webkit-flex;    /* NEW - Chrome */
 
   display: flex;
 
   display: flex;
  /*The links will flex in the vertical direction*/
 
 
   flex-direction: column;
 
   flex-direction: column;
 
   justify-content: center;
 
   justify-content: center;
Line 869: Line 888:
 
h5 {
 
h5 {
 
   color: #ffffff;
 
   color: #ffffff;
   font-size: 130% !important;
+
   font-size: 115% !important;
 +
  line-height: 30px !important;
 +
  font-style: normal !important;
 
   text-align: left;
 
   text-align: left;
 
}
 
}
Line 883: Line 904:
 
   list-style: none;
 
   list-style: none;
 
   padding: 0;
 
   padding: 0;
   margin: auto; /*this was 0*/
+
   margin: auto;  
  /*text-align: center; this was added*/
+
 
   line-height: 1;
 
   line-height: 1;
 
}
 
}
Line 890: Line 910:
 
   position: relative;
 
   position: relative;
 
   display: block;
 
   display: block;
   text-align: center; /*test, this was added*/
+
   text-align: center;
 
   background: #ffffff; /*This is the heading1 background*/
 
   background: #ffffff; /*This is the heading1 background*/
 
   width: 100%;
 
   width: 100%;
Line 911: Line 931:
 
}
 
}
 
#dropdown.align-center ul ul {
 
#dropdown.align-center ul ul {
   text-align: center; /*this was left*/
+
   text-align: center;
 
}
 
}
 
#dropdown > ul > li {
 
#dropdown > ul > li {
Line 932: Line 952:
 
   font-size: 18px;
 
   font-size: 18px;
 
   font-weight: bold;
 
   font-weight: bold;
   text-align: center; /* this was added */
+
   text-align: center;  
 
   padding: 5px 45px; /* heading sizes */
 
   padding: 5px 45px; /* heading sizes */
 
   color: #363638; /*previous color #7a8189;*/
 
   color: #363638; /*previous color #7a8189;*/
Line 998: Line 1,018:
 
   left: auto;
 
   left: auto;
 
   right: auto;
 
   right: auto;
   top: 31px; /*this was 44px -> too far away, 31px is right under */
+
   top: 31px;
 
   opacity: 1;
 
   opacity: 1;
 
}
 
}
Line 1,036: Line 1,056:
 
}
 
}
 
#dropdown.align-right ul ul li a {
 
#dropdown.align-right ul ul li a {
   text-align: center; /* this was right prev. */
+
   text-align: center;
 
}
 
}
  
Line 1,179: Line 1,199:
 
     position: relative;
 
     position: relative;
 
     height: 100%;
 
     height: 100%;
     min-width: 380px;
+
     min-width: 360px;
 
     text-align: center;
 
     text-align: center;
 
     background-color: white;
 
     background-color: white;
Line 1,188: Line 1,208:
 
   header, body {
 
   header, body {
 
     height: 100%;
 
     height: 100%;
     min-height: 500px; /* So that the bottom bar does not go over the picture on a small screen */
+
     min-height: 600px; /* So that the bottom bar does not go over the picture on a small screen */
 
     margin: 0 0 0px;
 
     margin: 0 0 0px;
 
     padding: 0;
 
     padding: 0;
Line 1,319: Line 1,339:
 
     font-size: 12px !important;
 
     font-size: 12px !important;
 
   }
 
   }
 
+
  footer .texts ul a {
 +
    font-size: 12px !important;
 +
    padding: 10px 15px !important;
 +
  }
 +
  .pe-2x {
 +
    font-size: 1.5em;
 +
  }
 
   .container {
 
   .container {
 
     width: auto !important;
 
     width: auto !important;
Line 1,327: Line 1,353:
 
     background-size: auto 100%;
 
     background-size: auto 100%;
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 +
    max-height: 152px;
 
   }
 
   }
 
+
   .porify {
/*
+
  text-align: center;
   #dropdown {
+
  width: 95%;
    width: 100%;
+
  margin: auto;
 
   }
 
   }
   #dropdown ul {
+
   .front-page > div {
    width: 100%;
+
  min-height: 500px !important;
    display: none;
+
 
   }
 
   }
   #dropdown.align-center > ul {
+
   .front-page > div:nth-child(1) {
    text-align: left;
+
  background-position: 50%;
 
   }
 
   }
   #dropdown ul li {
+
   .quote-text {
    width: 100%;
+
  font-size: 18px !important;
    border-top: 1px solid rgba(120, 120, 120, 0.2);
+
 
   }
 
   }
   #dropdown ul ul li,
+
   .quote-person {
  #dropdown li:hover > ul > li {
+
  font-size: 20px !important;
    height: auto;
+
 
   }
 
   }
   #dropdown ul li a,
+
   .quote-text-white {
  #dropdown ul ul li a {
+
  font-size: 18px !important;
    width: 100%;
+
    border-bottom: 0;
+
 
   }
 
   }
   #dropdown > ul > li {
+
   .quote-person-white {
    float: none;
+
  font-size: 20px !important;
 
   }
 
   }
  #dropdown ul ul li a {
+
 
    padding-left: 25px;
+
 
  }
+
  #dropdown ul ul ul li a {
+
    padding-left: 35px;
+
  }
+
  #dropdown ul ul li a {
+
    color: #dddddd;
+
    background: none;
+
  }
+
  #dropdown ul ul li:hover > a,
+
  #dropdown ul ul li.active > a {
+
    color: #ffffff;
+
  }
+
  #dropdown ul ul,
+
  #dropdown ul ul ul,
+
  #dropdown.align-right ul ul {
+
    position: relative;
+
    left: 0;
+
    width: 100%;
+
    margin: 0;
+
    text-align: left;
+
  }
+
  #dropdown > ul > li.has-sub > a:after,
+
  #dropdown > ul > li.has-sub > a:before,
+
  #dropdown ul ul > li.has-sub > a:after,
+
  #dropdown ul ul > li.has-sub > a:before {
+
    display: none;
+
  }
+
  #dropdown #menu-button {
+
    display: block;
+
    padding: 17px;
+
    color: #dddddd;
+
    cursor: pointer;
+
    font-size: 12px;
+
    text-transform: uppercase;
+
    font-weight: 700;
+
  }
+
  #dropdown #menu-button:after {
+
    position: absolute;
+
    top: 22px;
+
    right: 17px;
+
    display: block;
+
    height: 4px;
+
    width: 20px;
+
    border-top: 2px solid #dddddd;
+
    border-bottom: 2px solid #dddddd;
+
    content: '';
+
  }
+
  #dropdown #menu-button:before {
+
    position: absolute;
+
    top: 16px;
+
    right: 17px;
+
    display: block;
+
    height: 2px;
+
    width: 20px;
+
    background: #dddddd;
+
    content: '';
+
  }
+
  #dropdown #menu-button.menu-opened:after {
+
    top: 23px;
+
    border: 0;
+
    height: 2px;
+
    width: 15px;
+
    background: #ffffff;
+
    -webkit-transform: rotate(45deg);
+
    -moz-transform: rotate(45deg);
+
    -ms-transform: rotate(45deg);
+
    -o-transform: rotate(45deg);
+
    transform: rotate(45deg);
+
  }
+
  #dropdown #menu-button.menu-opened:before {
+
    top: 23px;
+
    background: #ffffff;
+
    width: 15px;
+
    -webkit-transform: rotate(-45deg);
+
    -moz-transform: rotate(-45deg);
+
    -ms-transform: rotate(-45deg);
+
    -o-transform: rotate(-45deg);
+
    transform: rotate(-45deg);
+
  }
+
  #dropdown .submenu-button {
+
    position: absolute;
+
    z-index: 99;
+
    right: 0;
+
    top: 0;
+
    display: block;
+
    border-left: 1px solid rgba(120, 120, 120, 0.2);
+
    height: 46px;
+
    width: 46px;
+
    cursor: pointer;
+
  }
+
  #dropdown .submenu-button.submenu-opened {
+
    background: #262626;
+
  }
+
  #dropdown ul ul .submenu-button {
+
    height: 34px;
+
    width: 34px;
+
  }
+
  #dropdown .submenu-button:after {
+
    position: absolute;
+
    top: 22px;
+
    right: 19px;
+
    width: 8px;
+
    height: 2px;
+
    display: block;
+
    background: #dddddd;
+
    content: '';
+
  }
+
  #dropdown ul ul .submenu-button:after {
+
    top: 15px;
+
    right: 13px;
+
  }
+
  #dropdown .submenu-button.submenu-opened:after {
+
    background: #ffffff;
+
  }
+
  #dropdown .submenu-button:before {
+
    position: absolute;
+
    top: 19px;
+
    right: 22px;
+
    display: block;
+
    width: 2px;
+
    height: 8px;
+
    background: #dddddd;
+
    content: '';
+
  }
+
  #dropdown ul ul .submenu-button:before {
+
    top: 12px;
+
    right: 16px;
+
  }
+
  #dropdown .submenu-button.submenu-opened:before {
+
    display: none;
+
  }
+
*/
+
 
}
 
}
  
Line 1,547: Line 1,437:
 
             </li>
 
             </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/Results">Results and Discussion</a></li>
             <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Laboratory_Future">Future Prospectives</a></li>
+
             <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/Laboratory_Future">Future Perspectives</a></li>
 
         </li>
 
         </li>
 
       </ul>
 
       </ul>
Line 1,567: Line 1,457:
 
             <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/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/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/Engagement">Public Outreach</a></li>
 
             <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/HP/Silver">Judging</a></li>
 
             <li><a href="https://2017.igem.org/Team:Aalto-Helsinki/HP/Silver">Judging</a></li>
 
         </li>
 
         </li>
Line 1,576: Line 1,466:
 
       <ul>
 
       <ul>
 
         <li class='has-sub'>
 
         <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/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/Parts">Parts</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/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><a href="https://2017.igem.org/Team:Aalto-Helsinki/Collaborations">Collaborations</a></li>
 
         </li>
 
         </li>
Line 1,584: Line 1,476:
 
   </li>
 
   </li>
  
   <li class='active has-sub'><a class='peo' href='https://2017.igem.org/Team:Aalto-Helsinki/People'>People</a>
+
   <li class='active has-sub'><a class='peo' href='https://2017.igem.org/Team:Aalto-Helsinki/Team'>People</a>
 
       <ul>
 
       <ul>
 
         <li class='has-sub'>
 
         <li class='has-sub'>

Latest revision as of 08:11, 4 December 2017

Aalto-Helsinki