Difference between revisions of "Team:Technion Israel/Team/gallery"

 
(19 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&nbsp;Us</a>
+
<a href="https://2015.igem.org/Team:Technion_Israel/Team/About_Us" id="Team_Links_About_Us">About&nbsp;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 305: Line 77:
 
<!-------------------------------------nav-bar-end------------------------------------------>
 
<!-------------------------------------nav-bar-end------------------------------------------>
  
<div class="content">
+
<!-------------------------------------up-button-------------------------------------------->
 +
<div class="up_button" style="text-decoration: none;">
 +
<a href="#" class="up_link" style="text-decoration: none;">
 +
    <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>
 +
</div>
 +
<!-------------------------------------up-button-end---------------------------------------->
 +
 
 
<header>
 
<header>
<div id="label">
+
</header>
<br><h1><b>Gallery</b></h1>
+
<div class="title">
 +
<h1><b>Gallery</b></h1>
 +
</div>
 +
 
 +
<div class="content">
 +
<div class="img_wrapper">
 +
<img src="https://static.igem.org/mediawiki/2015/5/55/Technion_Israel_2015_collage5.jpg" />
 +
</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>
Line 377: Line 131:
 
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
 
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
 
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/navbar/javascript?
 
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/navbar/javascript?
 +
action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2015.igem.org/Template:Technion/Javascript?
 
action=raw&ctype=text/javascript"></script>
 
action=raw&ctype=text/javascript"></script>
 
<script src="js/javascript.js"></script>
 
<script src="js/javascript.js"></script>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 18:07, 18 September 2015

Team: Technion 2015

Gallery

Contact Us