Team:Sevilla/Gallery

From 2011.igem.org

(Difference between revisions)
 
(36 intermediate revisions not shown)
Line 2: Line 2:
<html>
<html>
-
<!=====================================================HTML====================================-->
+
<p>Here you have some of the pictures we've taken during this months, it's unpublished material! Enjoy it...</p>
-
<div class="main_image">
+
</br>
-
    <img src="banner1.jpg" alt="" />
+
<p> <strong> THE TEAM <strong> </p>
-
    <div class="desc">
+
<embed type="application/x-shockwave-flash" src="https://picasaweb.google.com/s/c/bin/slideshow.swf" width="400" height="267" style="margin-left:190px;" flashvars="host=picasaweb.google.com&hl=es&feat=flashalbum&RGB=0x000000&feed=https%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2F100571191190012676212%2Falbumid%2F5629529901700434145%3Falt%3Drss%26kind%3Dphoto%26hl%3Des" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
-
        <a href="#" class="collapse">Close Me!</a>
+
</br>
-
        <div class="block">
+
</br>
-
            <h2>Title</h2>
+
-
            <small>Date</small>
+
-
            <p>Copy</p>
+
-
        </div>
+
-
    </div>
+
-
</div>
+
-
 
+
-
<div class="image_thumb">
+
-
    <ul>
+
-
        <li>
+
-
            <a href="banner1.jpg"><img src="banner1_thumb.jpg" alt="Image Name" /></a>
+
-
            <div class="block">
+
-
                <h2>Title</h2>
+
-
                <small>Date</small>
+
-
                <p>Copy</p>
+
-
            </div>
+
-
        </li>
+
-
    </ul>
+
-
</div>
+
-
<!=====================================================CSS====================================-->
+
-
<style>
+
-
.main_image {
+
-
    width: 598px;
+
-
    height: 456px;
+
-
    float: left;
+
-
    background: #333;
+
-
    position: relative;
+
-
    overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
+
-
    color: #fff;
+
-
}
+
-
.main_image h2 {
+
-
    font-size: 2em;
+
-
    font-weight: normal;
+
-
    margin: 0 0 5px;
+
-
    padding: 10px;
+
-
}
+
-
.main_image p {
+
-
    font-size: 1.2em;
+
-
    line-height: 1.6em;
+
-
    padding: 10px;
+
-
    margin: 0;
+
-
}
+
-
.block small { /*--We'll be using this same style on our thumbnail list--*/
+
-
    font-size: 1em;
+
-
    padding: 0 0 0 20px;
+
-
    background: url(icon_calendar.gif) no-repeat 0 center;
+
-
}
+
-
.main_image .block small {margin-left: 10px;}
+
-
.main_image .desc{
+
-
    position: absolute;
+
-
    bottom: 0;
+
-
    left: 0; /*--Stick the desc class to the bottom of our main image container--*/
+
-
    width: 100%;
+
-
    display: none; /*--Hide description by default, if js is enabled, we will show this--*/
+
-
}
+
-
.main_image .block{
+
-
    width: 100%;
+
-
    background: #111;
+
-
    border-top: 1px solid #000;
+
-
}
+
-
.main_image a.collapse { /*--This is our hide/show tab--*/
+
-
    background: url(btn_collapse.gif) no-repeat left top;
+
-
    height: 27px;
+
-
    width: 93px;
+
-
    text-indent: -99999px;
+
-
    position: absolute;
+
-
    top: -27px;
+
-
    right: 20px;
+
-
}
+
-
.main_image a.show {background-position: left bottom;}
+
-
 
+
-
.image_thumb {
+
-
    float: left;
+
-
    width: 299px;
+
-
    background: #f0f0f0;
+
-
    border-right: 1px solid #fff;
+
-
    border-top: 1px solid #ccc;
+
-
}
+
-
.image_thumb img {
+
-
    border: 1px solid #ccc;
+
-
    padding: 5px;
+
-
    background: #fff;
+
-
    float: left;
+
-
}
+
-
.image_thumb ul {
+
-
    margin: 0;
+
-
    padding: 0;
+
-
    list-style: none;
+
-
}
+
-
.image_thumb ul li{
+
-
    margin: 0;
+
-
    padding: 12px 10px;
+
-
    background: #f0f0f0 url(nav_a.gif) repeat-x;
+
-
    width: 279px;
+
-
    float: left;
+
-
    border-bottom: 1px solid #ccc;
+
-
    border-top: 1px solid #fff;
+
-
    border-right: 1px solid #ccc;
+
-
}
+
-
.image_thumb ul li.hover { /*--Hover State--*/
+
-
    background: #ddd;
+
-
    cursor: pointer;
+
-
}
+
-
.image_thumb ul li.active { /*--Active State--*/
+
-
    background: #fff;
+
-
    cursor: default;
+
-
}
+
-
html .image_thumb ul li h2 {
+
-
    font-size: 1.5em;
+
-
    margin: 5px 0;
+
-
    padding: 0;
+
-
}
+
-
.image_thumb ul li .block {
+
-
    float: left;
+
-
    margin-left: 10px;
+
-
    padding: 0;
+
-
    width: 170px;
+
-
}
+
-
.image_thumb ul li p{display: none;}/*--Hide the description on the list items--*/
+
-
</style>
+
-
 
+
-
<!=====================================================JS====================================-->
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
 +
<p><strong>WORK IN THE LAB<strong></p>
 +
<embed type="application/x-shockwave-flash" src="https://picasaweb.google.com/s/c/bin/slideshow.swf" width="400" height="267" style="margin-left:190px;" flashvars="host=picasaweb.google.com&hl=es&feat=flashalbum&RGB=0x000000&feed=https%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2F100571191190012676212%2Falbumid%2F5629529014869326945%3Falt%3Drss%26kind%3Dphoto%26hl%3Des" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>
 +
<br/>
 +
</br>
</html>
</html>

Latest revision as of 16:33, 21 September 2011

Here you have some of the pictures we've taken during this months, it's unpublished material! Enjoy it...


THE TEAM



WORK IN THE LAB