|
|
(17 intermediate revisions by 4 users not shown) |
Line 11: |
Line 11: |
| } | | } |
| | | |
− | h1 {
| |
− | font-weight: 100;
| |
− | margin-bottom: 0;
| |
− | }
| |
| | | |
− | p {
| + | header{background-image: url("https://static.igem.org/mediawiki/2015/0/07/Technion_Israel_2015_gallery.jpg"); background-size: 100%; background-repeat: no-repeat; width: 100%; margin-top: 78px; |
− | margin: 0 0 16px; | + | margin-bottom: -30; |
− | } | + | margin-bottom: -30; |
| + | margin-bottom: -100; |
| + | height: 350px; margin-bottom: 0px;} |
| + | .title h1{ color: rgb(243, 225, 97); font-weight: bold; font-size: 100px; text-align: center; background: rgba(0, 0, 0, 0.8); font-family: sans-serif; font-style: Arial; height: 100px; text-shadow: black 6px 6px 6px; line-height: 80px;} |
| + | #bodyContent h1{margin-bottom: 0em;} |
| | | |
− | header{background-image: url("https://static.igem.org/mediawiki/2015/6/6c/Technion_Israel_2015_heading_Practices.jpg"); background-size: 100%; background-repeat: no-repeat; width: 100%; height: 300px;}
| + | .content{width: 1024px; margin: 0 auto;} |
− | header h1{ color: rgb(243, 225, 97);}
| + | |
| | | |
− | #label{font-style: bold; font-family: sans-serif; font-style: Arial; height: 300px; line-height: 80px; width: 100%; text-align: center; vertical-align: center;}
| + | .img_wrapper{text-align: center; width: 100%; display: block;} |
− | #label h1{font-size: 80px;}
| + | |
| | | |
− | .boximage > a { | + | .up_button img { width: 120px;} |
− | display: inline-block;
| + | |
− | position: relative;
| + | |
− | text-decoration: none;
| + | |
− | vertical-align: bottom;
| + | |
− | width: 16.66%;
| + | |
− | }
| + | |
− | | + | |
− | .boximage > a > img {
| + | |
− | border: none;
| + | |
− | display: block;
| + | |
− | height: auto;
| + | |
− | width: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .arrow::after {
| + | |
− | border: 10px solid #333;
| + | |
− | content: "";
| + | |
− | left: 50%;
| + | |
− | position: absolute;
| + | |
− | transform: translate(-10px, -10px) rotate(45deg);
| + | |
− | }
| + | |
− | | + | |
− | .box {
| + | |
− | background: #333;
| + | |
− | float: left;
| + | |
− | padding: 13px 0;
| + | |
− | position: relative;
| + | |
− | text-align: center;
| + | |
− | width: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .js-boxloading::before {
| + | |
− | content: "Loading...";
| + | |
− | left: 0;
| + | |
− | position: absolute;
| + | |
− | text-align: center;
| + | |
− | top: 50%;
| + | |
− | width: 100%;
| + | |
− | }
| + | |
− | | + | |
− | .box > div {
| + | |
− | color: #9c9c9c;
| + | |
− | padding: 0 13px 8px;
| + | |
− | position: relative;
| + | |
− | text-align: center;
| + | |
− | }
| + | |
− | | + | |
− | .box > img {
| + | |
− | max-height: 420px;
| + | |
− | max-width: 100%;
| + | |
− | position: relative;
| + | |
− | vertical-align: bottom;
| + | |
− | }
| + | |
− | | + | |
− | @media screen and (min-width: 480px) and (max-width: 919px) {
| + | |
− | body {
| + | |
− | width: 95%;
| + | |
− | }
| + | |
− | | + | |
− | .boximage > a {
| + | |
− | width: 20%;
| + | |
− | }
| + | |
− | }
| + | |
− | | + | |
− | @media screen and (max-width: 479px) {
| + | |
− | body {
| + | |
− | width: 95%;
| + | |
− | }
| + | |
− | | + | |
− | .boximage > a {
| + | |
− | width: 33.33%;
| + | |
− | }
| + | |
− | } | + | |
| | | |
| </style> | | </style> |
− | <script>
| |
− | (function () {
| |
− | 'use strict';
| |
− | ////////////////////////////////////////////////////////////////////////////////
| |
− | // Get Next Element Sibling, Get Last Element Sibling
| |
− |
| |
− | function getnextElementSibling(element) {
| |
− | if (element.nextElementSibling) {
| |
− | return element.nextElementSibling;
| |
− | }
| |
− |
| |
− | var current = element.nextSibling;
| |
− | while (current && current.nodeType !== 1) {
| |
− | current = current.nextSibling;
| |
− | }
| |
− | return current;
| |
− | }
| |
− |
| |
− | function getpreviousElementSibling(element) {
| |
− | if (element.previousElementSibling) {
| |
− | return element.previousElementSibling;
| |
− | }
| |
− |
| |
− | var current = element.previousSibling;
| |
− | while (current && current.nodeType !== 1) {
| |
− | current = current.previousSibling;
| |
− | }
| |
− | return current;
| |
− | }
| |
− |
| |
− | ////////////////////////////////////////////////////////////////////////////////
| |
− | // Class List functions
| |
− |
| |
− | function addClass(element, string) {
| |
− | if (element.classList) {
| |
− | return element.classList.add(string);
| |
− | }
| |
− |
| |
− | var list = element.className.split(' '),
| |
− | i,
| |
− | notpresent = true;
| |
− |
| |
− | for (i = 0; i < list.length; i++) {
| |
− | if (list[i] === string) {
| |
− | notpresent = false;
| |
− | break;
| |
− | }
| |
− | }
| |
− | if (notpresent) {
| |
− | element.className += (element.className ? ' ' : '') + string;
| |
− | }
| |
− | }
| |
− |
| |
− | function removeClass(element, string) {
| |
− | if (element.classList) {
| |
− | return element.classList.remove(string);
| |
− | }
| |
− |
| |
− | var list = element.className.split(' '),
| |
− | i;
| |
− |
| |
− | element.className = '';
| |
− |
| |
− | for (i = 0; i < list.length; i++) {
| |
− | if (list[i] !== string) {
| |
− | element.className += (element.className ? ' ' : '') + list[i];
| |
− | }
| |
− | }
| |
− | }
| |
− |
| |
− | function containsClass(element, string) {
| |
− | if (element.classList) {
| |
− | return element.classList.contains(string);
| |
− | }
| |
− |
| |
− | var list = element.className.split(' '),
| |
− | i,
| |
− | present = false;
| |
− |
| |
− | for (i = 0; i < list.length; i++) {
| |
− | if (list[i] === string) {
| |
− | present = true;
| |
− | break;
| |
− | }
| |
− | }
| |
− | return present;
| |
− | }
| |
− |
| |
− | ////////////////////////////////////////////////////////////////////////////////
| |
− | // Image gallery
| |
− |
| |
− | function boximage(idboximage, classbox, classactive) {
| |
− | var list, i,
| |
− | box = document.createElement('div'),
| |
− | boxloading = 'js-boxloading';
| |
− | box.className = classbox;
| |
− |
| |
− | list = document.getElementById(idboximage).getElementsByTagName('a');
| |
− | i = list.length;
| |
− | while (i--) {
| |
− | list[i].onclick = function () {
| |
− |
| |
− | removeClass(this, classactive);
| |
− |
| |
− | if (containsClass(getnextElementSibling(this), classbox)) {
| |
− |
| |
− | box.parentNode.removeChild(box);
| |
− |
| |
− | } else {
| |
− |
| |
− | if ((box.parentNode !== null) && (box.parentNode.nodeName !== '#document-fragment')) {
| |
− | removeClass(getpreviousElementSibling(box), classactive);
| |
− | }
| |
− | addClass(this, classactive);
| |
− |
| |
− | removeClass(box, boxloading);
| |
− |
| |
− | box.innerHTML = '<div>' + this.getAttribute('title') + '</div><img src="' + this.getAttribute('href') + '">';
| |
− |
| |
− | setTimeout(function () {
| |
− | addClass(box, boxloading);
| |
− | }, 500);
| |
− |
| |
− | this.parentNode.insertBefore(box, getnextElementSibling(this));
| |
− |
| |
− | var this_height = this.getBoundingClientRect().height,
| |
− | box_height = box.getBoundingClientRect().height,
| |
− | box_bottom = box.getBoundingClientRect().bottom,
| |
− | client_height = document.documentElement.clientHeight;
| |
− |
| |
− | if ((this.getBoundingClientRect().top < 0) || ((box_bottom > client_height) && ((this_height + box_height) > client_height))) {
| |
− | this.scrollIntoView();
| |
− | } else if ((box_bottom > client_height) && ((this_height + box_height) < client_height)) {
| |
− | box.scrollIntoView(false);
| |
− | }
| |
− |
| |
− | }
| |
− |
| |
− | var e = event || window.event;
| |
− | if (e.preventDefault) {
| |
− | e.preventDefault();
| |
− | } else {
| |
− | return false;
| |
− | }
| |
− | };
| |
− | }
| |
− | }
| |
− |
| |
− | boximage('boximage', 'box', 'arrow');
| |
− |
| |
− | }());
| |
− |
| |
− | </script>
| |
| <title>Team: Technion 2015</title> | | <title>Team: Technion 2015</title> |
| </head> | | </head> |
Line 262: |
Line 34: |
| <div class="nav_menu"> | | <div class="nav_menu"> |
| | | |
− | <a href="https://2015.igem.org/Team:Technion_Israel"> | + | <a href="https://2015.igem.org/Team:Technion_Israel" style="position:fixed; width: 170px; display:inline-block; text-decoration: none;" class="nav_home_link"> |
− | <img src="https://static.igem.org/mediawiki/2015/c/c1/Team_Technion_Navbar_Home.png" alt="Home" id="nav_home" /></a> | + | <img src="https://static.igem.org/mediawiki/2015/c/c1/Team_Technion_Navbar_Home.png" alt="Home" id="nav_home" /><div class="home_text">Home</div></a> |
| | | |
| <div class="main_buttons"> | | <div class="main_buttons"> |
Line 274: |
Line 46: |
| <nav> | | <nav> |
| <div id="Team_Links" class="main_links"> | | <div id="Team_Links" class="main_links"> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Team/About_Us">About Us</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Team/About_Us" id="Team_Links_About_Us">About Us</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Attributions">Attributions</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Attributions" id="Team_Links_Attributions">Attributions</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Team/Sponsors">Sponsors</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Team/Sponsors" id="Team_Links_Sponsors">Sponsors</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Team/gallery">Gallery</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Team/gallery" id="Team_Links_gallery">Gallery</a> |
| </div> | | </div> |
| <div id="Judging_Criteria_Links" class="main_links"> | | <div id="Judging_Criteria_Links" class="main_links"> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Parts">Parts</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Parts" id="Judging_Criteria_Links_Parts">Parts</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Judging_Criteria/Achievements">Achievements</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Judging_Criteria/Achievements" id="Judging_Criteria_Links_Achievements">Achievements</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Collaborations">Collaborations</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Collaborations" id="Judging_Criteria_Links_Collaborations">Collaborations</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Design">Design</a>
| + | |
| </div> | | </div> |
| <div id="Human_Practices_Links" class="main_links"> | | <div id="Human_Practices_Links" class="main_links"> |
Line 295: |
Line 66: |
| <div id="project_Links" class="main_links"> | | <div id="project_Links" class="main_links"> |
| <a href="https://2015.igem.org/Team:Technion_Israel/Project/Overview">Overview</a> | | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Overview">Overview</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Bacillus">Bacillus</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Secretion">Secretion</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Project/E_Coli">E.Coli</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Expression">Expression</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Project/NADPH">NADPH</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Cofactor">Cofactor</a> |
− | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Comb">Comb</a> | + | <a href="https://2015.igem.org/Team:Technion_Israel/Design">Comb</a> |
| <a href="https://2015.igem.org/Team:Technion_Israel/Modeling">Modeling</a> | | <a href="https://2015.igem.org/Team:Technion_Israel/Modeling">Modeling</a> |
| + | <a href="https://2015.igem.org/Team:Technion_Israel/Project/Results">Results</a> |
| </div> | | </div> |
| </nav> | | </nav> |
Line 306: |
Line 78: |
| | | |
| <!-------------------------------------up-button--------------------------------------------> | | <!-------------------------------------up-button--------------------------------------------> |
− | <div class="up_button"> | + | <div class="up_button" style="text-decoration: none;"> |
− | <a href="#" class="up_link"> | + | <a href="#" class="up_link" style="text-decoration: none;"> |
− | <img src="https://static.igem.org/mediawiki/2015/3/39/https://static.igem.org/mediawiki/2015/1/17/Technion_2015_Up_sitting.png" alt="Scroll to top" /> | + | <div class="up_button_text" style="text-decoration: none;">UP</div> |
| + | <img src="https://static.igem.org/mediawiki/2015/1/17/Technion_2015_Up_sitting.png" alt="Scroll to top" /> |
| </a> | | </a> |
| </div> | | </div> |
| <!-------------------------------------up-button-end----------------------------------------> | | <!-------------------------------------up-button-end----------------------------------------> |
| | | |
− | | + | <header> |
| + | </header> |
| + | <div class="title"> |
| + | <h1><b>Gallery</b></h1> |
| + | </div> |
| | | |
| <div class="content"> | | <div class="content"> |
− | <header> | + | <div class="img_wrapper"> |
− | <div id="label"> | + | <img src="https://static.igem.org/mediawiki/2015/5/55/Technion_Israel_2015_collage5.jpg" /> |
− | <br><h1><b>Gallery</b></h1> | + | </div> |
| + | <div class="content"> |
| + | <div class="img_wrapper"> |
| + | <img src="https://static.igem.org/mediawiki/2015/a/a4/Techion_Israel_2015_cpllage777.jpg" /> |
| + | </div> |
| + | <div class="img_wrapper"> |
| + | <img src="https://static.igem.org/mediawiki/2015/5/55/Technion_Israel_2015_collage1.jpg" /> |
| + | </div> |
| + | <div class="img_wrapper"> |
| + | <img src="https://static.igem.org/mediawiki/2015/e/ef/Technion_Israel_2015_collage4.jpg" /> |
| + | </div> |
| + | <div class="img_wrapper"> |
| + | <img src="https://static.igem.org/mediawiki/2015/7/71/Technion_Israel_2015_collage2.jpg" /> |
| + | </div> |
| + | <div class="img_wrapper"> |
| + | <img src="https://static.igem.org/mediawiki/2015/e/e4/Technion_Israel_2015_collage3.jpg" /> |
| </div> | | </div> |
− | </header>
| |
− | <div id="boximage" class="boximage">
| |
− | <a title="Receiving the torch" href="https://static.igem.org/mediawiki/2015/9/98/Technion_Israel_2015_Gallery6.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/9/98/Technion_Israel_2015_Gallery6.jpg" />
| |
− | </a><a title="Passing on the torch" href="https://static.igem.org/mediawiki/2015/2/21/Technion_Israel_2015_Gallery7.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/2/21/Technion_Israel_2015_Gallery7.jpg" />
| |
− | </a><a title="Tal's artistic masterpiece" href="https://static.igem.org/mediawiki/2015/0/06/Technion_Israel_2015_Gallery8.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/0/06/Technion_Israel_2015_Gallery8.jpg" />
| |
− | </a><a title="Space art-img5" href="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/normal_Space_art-1900x1200-img5.jpg">
| |
− | <img alt="" src="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/thumb_Space_art-1900x1200-img5.jpg" />
| |
− | </a><a title="Space art-img6" href="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/normal_Space_art-1900x1200-img6.jpg">
| |
− | <img alt="" src="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/thumb_Space_art-1900x1200-img6.jpg" />
| |
− | </a><a title="Space art-img93" href="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/normal_Space_art-1900x1200-img93.jpg">
| |
− | <img alt="" src="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/thumb_Space_art-1900x1200-img93.jpg" />
| |
− | </a><a title="Space art-img177" href="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/normal_Space_art-1900x1200-img177.jpg">
| |
− | <img alt="" src="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/thumb_Space_art-1900x1200-img177.jpg" />
| |
− | </a><a title="Space art-img170" href="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/normal_Space_art-1900x1200-img170.jpg">
| |
− | <img alt="" src="http://universe-beauty.com/albums/userpics/2011y/04/21/1/7/thumb_Space_art-1900x1200-img170.jpg" />
| |
− | </a><a title="Behold our beloved combs" href="https://static.igem.org/mediawiki/2015/5/56/Technion_Israel_2015_gallery2.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/5/56/Technion_Israel_2015_gallery2.jpg" />
| |
− | </a><a title="Attempted Selfie" href="https://static.igem.org/mediawiki/2015/2/27/Technion_Israel_2015_gallery1.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/2/27/Technion_Israel_2015_gallery1.jpg" />
| |
− | </a><a title="All dressed up at Adi's wedding" href="https://static.igem.org/mediawiki/2015/7/72/Technion_Israel_2015_gallery4.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/7/72/Technion_Israel_2015_gallery4.jpg" />
| |
− | </a><a title="Look at our glycerol stock :D" href="https://static.igem.org/mediawiki/2015/8/83/Technion_Israel_2015_aboutus2.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/8/83/Technion_Israel_2015_aboutus2.jpg" />
| |
− | </a><a title="Goofing off in the lab" href="https://static.igem.org/mediawiki/2015/4/48/Technion_Israel_2015_aboutus3.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/4/48/Technion_Israel_2015_aboutus3.jpg" />
| |
− | </a><a title="Group outing to the Ramat Hanadiv Gardens and Tishbi winery" href="https://static.igem.org/mediawiki/2015/3/3d/Technion_Israel_2015_aboutus5.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/3/3d/Technion_Israel_2015_aboutus5.jpg" />
| |
− | </a><a title="Group bonfire bonding night" href="https://static.igem.org/mediawiki/2015/6/6b/Technion_Israel_2015_aboutus6.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/6/6b/Technion_Israel_2015_aboutus6.jpg" />
| |
− | </a><a title="" href="https://static.igem.org/mediawiki/2015/a/a6/Technion_Israel_2015_aboutus7.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/a/a6/Technion_Israel_2015_aboutus7.jpg" />
| |
− | </a><a title="Team toast at Adi's wedding" href="https://static.igem.org/mediawiki/2015/2/2f/Technion_Israel_2015_aboutus18.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/2/2f/Technion_Israel_2015_aboutus18.jpg" />
| |
− | </a><a title="We were on the radio!" href="https://static.igem.org/mediawiki/2015/2/23/Technion_Israel_2015_aboutus22.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/2/23/Technion_Israel_2015_aboutus22.jpg" />
| |
− | </a><a title="Giving back (with all our hearts ;-p)" href="https://static.igem.org/mediawiki/2015/d/d5/Technion_Israel_2015_aboutus24.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/d/d5/Technion_Israel_2015_aboutus24.jpg" />
| |
− | </a><a title="Planning the Mini-Jamboree" href="https://static.igem.org/mediawiki/2015/1/1a/Technion_Israel_2015_aboutus25.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/1/1a/Technion_Israel_2015_aboutus25.jpg" />
| |
− | </a><a title="Working hard and playing hard" href="https://static.igem.org/mediawiki/2015/e/e2/Technion_Israel_2015_aboutus26.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/e/e2/Technion_Israel_2015_aboutus26.jpg" />
| |
− | </a><a title="Hard at work" href="https://static.igem.org/mediawiki/2015/6/67/Technion_Israel_2015_aboutus27.jpg">
| |
− | <img alt="" src="https://static.igem.org/mediawiki/2015/6/67/Technion_Israel_2015_aboutus27.jpg" />
| |
− | </a><div class="clear"></div>
| |
− | </div>
| |
| </div> | | </div> |
| <footer> | | <footer> |