Team:UCLondon/Templates/bottom-content

From 2012e.igem.org

(Difference between revisions)
 
(72 intermediate revisions not shown)
Line 2: Line 2:
  <style type="text/css">
  <style type="text/css">
 +
 +
  #bodyContent a[href^="mailto:"] { background: none; }
 +
  #bodyContent a * {background: none; padding: 0;  }
     #footer-boxes {  
     #footer-boxes {  
-
                 width: 60%; clear:both; margin: auto;
+
                 width: 815px; clear:both; margin: auto;
                 font-family: 'Gill Sans', Arial, sans-serif;
                 font-family: 'Gill Sans', Arial, sans-serif;
Line 18: Line 21:
                 border-style: solid;
                 border-style: solid;
                 border-width: 1px;
                 border-width: 1px;
-
                 padding: 0 100px 10px 10px;
+
                 padding: 0 10px 10px 10px;
               // height: 60px;
               // height: 60px;
 +
             
 +
              margin-top: 2px;
 +
              margin-bottom: 20px;
 +
              box-shadow: 2px 5px 5px #888;
 +
     }
     }
Line 25: Line 33:
     .left {
     .left {
           float:left;  
           float:left;  
-
          border-right-color: rgb(230, 230, 230);
+
           width: 45%;
-
          border-right-style: solid;
+
-
          border-right-width: 1px;
+
-
           width: 50%;
+
           clear: left;
           clear: left;
Line 35: Line 40:
       .right {
       .right {
             float: left;
             float: left;
-
             width: 45%;
+
             width: 400px;
-
             padding-left: 20px;  
+
             padding-left: 20px;
 +
            border-left-color: rgb(230, 230, 230);
 +
            border-left-style: solid;
 +
            border-left-width: 1px;  
       }
       }
      
      
-
     .clear { clear: both; }
+
     .clear { clear: both; height:5px; width:100%;}
 +
 
 +
    #sponsor-slides .slides_container {
 +
width:400px;
 +
                        margin:auto;
 +
display:none;
 +
                      // overflow: none;
 +
    }
 +
 
 +
    #sponsor-slides .slides_container div {
 +
width:400px;
 +
height:170px;
 +
display:block;
 +
    }
 +
 
 +
    #sponsor-slides .pagination { with: 10%; margin-top: 5px;  }
 +
 
 +
 
 +
    /* sponsor grid */
 +
  #sponsor-slides { width: 100%; margin: auto; }
 +
   
 +
    .sponsor-list { padding-left:0;  width: 10cm; }
 +
    .sponsor-list li {
 +
    border: 1px solid silver;
 +
    border-radius: 4px;
 +
    list-style: none;
 +
margin: 2px;
 +
padding: 15px 5px 2px 5px;
 +
width: 2.5cm;
 +
float: left;
 +
height: 60px;
 +
}
 +
 +
.sponsor-logo {
 +
width: 90%;
 +
margin: auto;
 +
display:inline;
 +
vertical-align: middle;
 +
text-align: center;
 +
width:2.5cm;
 +
color:grey;
 +
text-decoration:none;
 +
                        background:none;
 +
                       
 +
}
 +
 +
.sponsor-logo img { display: block; margin-left: auto; margin-right:auto;  }
   </style>
   </style>
 +
 +
 +
 +
 +
 +
  <script>
  <script>
Line 47: Line 107:
$('#sponsor-slides').slides({
$('#sponsor-slides').slides({
preload: true,
preload: true,
 +
play: 5000,
 +
pause: 2500,
 +
hoverPause: true,
generateNextPrev: false
generateNextPrev: false
});
});
Line 62: Line 125:
  </ul>
  </ul>
</div><!-- .footer-box left -->
</div><!-- .footer-box left -->
 +
<div class="footer-box right">
<div class="footer-box right">
Line 68: Line 132:
<div class="slides_container">
<div class="slides_container">
<div>
<div>
-
<h1>Slide 1</h1>
+
<ul class="sponsor-list">
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="http://www.clcbio.com" class="sponsor-logo"><li><img src="http://www.clcbio.com/fileadmin/template/main/images/clcbio_logo_no_mirror.png"/></li></a>
 +
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
</ul>
</div>
</div>
<div>
<div>
-
<h1>Slide 2</h1>
+
<ul class="sponsor-list">
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<h1>Slide 3</h1>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<div>
+
</ul>
-
<h1>Slide 4</h1>
+
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
</div>
</div>
</div><!-- .slides_container -->
</div><!-- .slides_container -->
Line 87: Line 155:
</div><!-- .footer-box right -->
</div><!-- .footer-box right -->
-
<div class="clear"></div>
+
<div class="clear" style="width:100%; height:2px;"></div>
 +
</div>
 +
 
 +
 
   
   
<script type="text/javascript">
<script type="text/javascript">
 +
 +
$(document).ready(function() {
         var nHeight = ($('.footer-box.left').height() > $('.footer-box.right').height()) ? $('.footer-box.left').height() : $('.footer-box.right').height();
         var nHeight = ($('.footer-box.left').height() > $('.footer-box.right').height()) ? $('.footer-box.left').height() : $('.footer-box.right').height();
         $('#footer-boxes').css('height', nHeight);
         $('#footer-boxes').css('height', nHeight);
 +
});
 +
 +
function sponsoring(){  }
 +
     
</script>
</script>
   
   
</html>
</html>

Latest revision as of 21:37, 18 September 2012