Team:UCLondon/Templates/bottom-contentv4

From 2012e.igem.org

(Difference between revisions)
 
(87 intermediate revisions not shown)
Line 30: Line 30:
     }
     }
 +
 +
#footer-boxes h3 { color: #497567 !important; font-family: sans-serif; font-size: 17px;}
     .left {
     .left {
           float:left;  
           float:left;  
-
           width: 30%;
+
           width: 35%;
           clear: left;
           clear: left;
       }
       }
   
   
-
     .middle { float:left; width:35%; border-left-color: rgb(230, 230, 230);
+
     .middle { float:left; width:30%; border-left-color: rgb(230, 230, 230);
-
            border-left-style: solid;
+
            // border-left-style: solid;
-
             border-left-width: 1px;  
+
             //border-left-width: 1px;  
 +
           
             padding-left:10px;
             padding-left:10px;
             padding-right:10px;
             padding-right:10px;
Line 50: Line 53:
             width: 30%;
             width: 30%;
             padding-left: 5px;
             padding-left: 5px;
-
            border-left-color: rgb(230, 230, 230);
+
-
            border-left-style: solid;
+
-
            border-left-width: 1px;
+
       }
       }
      
      
-
     .clear { clear: both; height:5px; width:100%;}
+
     .clear { clear: both; height:1px; width:100%;}
     #sponsor-slides .slides_container {
     #sponsor-slides .slides_container {
Line 87: Line 88:
margin: 2px;
margin: 2px;
padding: 15px 5px 2px 5px;
padding: 15px 5px 2px 5px;
-
width: 2.5cm;
+
width: 5cm;
float: left;
float: left;
-
height: 60px;
+
height: 98px;
}
}
Line 98: Line 99:
vertical-align: middle;
vertical-align: middle;
text-align: center;  
text-align: center;  
-
width:2.5cm;
+
//width:2.5cm;
color:grey;  
color:grey;  
text-decoration:none;
text-decoration:none;
                         background:none;
                         background:none;
-
                       
+
                        font-size:16pt;
 +
                        line-width:1.3pt;
}
}
.sponsor-logo img { display: block; margin-left: auto; margin-right:auto;  }
.sponsor-logo img { display: block; margin-left: auto; margin-right:auto;  }
 +
 +
        .sponsor-logo:hover p {text-decoration:none;}
Line 114: Line 118:
       position:relative;
       position:relative;
padding:1px;
padding:1px;
-
margin:1em 0 3em;
+
margin:0 0 2.5em 0;
border:2px solid #5a8f00;
border:2px solid #5a8f00;
color:#333;
color:#333;
Line 158: Line 162:
.triangle-isosceles p {
.triangle-isosceles p {
 +
  height:150px;
   }
   }
-
.testimonial,  #test-slides .slides_container .triangle-isosceles {  height: 200px; }
+
.testimonial,  #test-slides .slides_container .triangle-isosceles {  height: 160px; padding: 0px 4px; }
.test-author { position:relative; top: -15px; }
.test-author { position:relative; top: -15px; }
-
.tab-nav { float:left; width:15%;}
 
-
.tab-content { float:right; width:75%;}
+
/* Testimonial slideshow */
-
  </style>
+
/* ---------------------------------------------------- */
 +
/* SLIDESHOW
 +
/* ---------------------------------------------------- */
 +
#slideshow {
 +
width: 100%; //250px;
 +
//background-color: #eee;
 +
//border: 1px solid #ddd;}
 +
 +
#slideshow ul {
 +
margin: 0;
 +
padding: 0;
 +
list-style-type: none !important;
 +
                        list-style-image: none !important;
 +
height: 1%; /* IE fix */}
 +
 +
#slideshow ul:after {
 +
content: ".";
 +
clear: both;
 +
display: block;
 +
height: 0;
 +
visibility: hidden;}           
 +
 +
/* ---------------------------------------------------- */
 +
/* SLIDESHOW > SLIDES
 +
/* ---------------------------------------------------- */
 +
#slideshow .slides {
 +
overflow: hidden;
 +
                        width: 100%; //250px;
 +
                        }
 +
 +
#slideshow .slides ul {
 +
width: 500px;}
 +
 +
#slideshow .slides li {
 +
width: 68%; //220px;
 +
float: left;
 +
padding: 0 5px;}
 +
 +
#slideshow .slides h2 {
 +
margin-top: 0;}
 +
 +
/* ---------------------------------------------------- */
 +
/* SLIDESHOW > NAVIGATION
 +
/* ---------------------------------------------------- */
 +
                        #slideshow .div-slide-nav {
 +
                          //background-color: #ddd;
 +
  //border-top: 2px solid #ccc;}
 +
             
 +
#slideshow .slides-nav {
 +
                          margin:auto;
 +
                          width: 79%;
 +
  background-color: #ddd;
 +
  border-top: 2px solid #ccc;}
 +
 +
#slideshow .slides-nav li {
 +
float: left;}
 +
 +
#slideshow .slides-nav li a {
 +
display: block;
 +
padding: 15px 20px;
 +
outline: none;}
 +
 +
.js #slideshow .slides-nav li.on,
 +
.js #slideshow .slides-nav li.on a {
 +
background-color: rgb(249, 249, 249); cursor:default;}
 +
 +
.js #slideshow .slides-nav li.on a {
 +
position: relative;
 +
top: -4px;}
 +
 +
 +
/* ---------------------------------------------------- */
 +
/* Scroll box */
 +
/* ---------------------------------------------------- */
 +
 +
//.testimonial { height: 200px; overflow-y:scroll; }
 +
.test-author { padding-top: 5px; padding-bottom:-10px; }
 +
  </style>
-
<script>
 
-
$(function(){
 
-
$('#sponsor-slides').slides({
 
-
preload: true,
 
-
play: 15000,
 
-
pause: 2500,
 
-
hoverPause: true,
 
-
generateNextPrev: false
 
-
});
 
-
             
 
-
});
+
 
 +
 
 +
<script>
</script>
</script>
Line 200: Line 273:
<h3>Latest News</h3>
<h3>Latest News</h3>
  <ul>
  <ul>
 +
                                        <li><a href="http://codonusageoptimizer.org/download/">CUO 0.92 released</a></li>
<li><a href="http://www.ucl.ac.uk/news/news-articles/1209/10092012-QS">UCL in 4th place in world university rankings</a></li>
<li><a href="http://www.ucl.ac.uk/news/news-articles/1209/10092012-QS">UCL in 4th place in world university rankings</a></li>
<li><a href="http://codonusageoptimizer.org/download/">CUO 0.91 released</a></li>
<li><a href="http://codonusageoptimizer.org/download/">CUO 0.91 released</a></li>
Line 212: Line 286:
               <div class="footer-box middle">
               <div class="footer-box middle">
<h3>Testimonials</h3>
<h3>Testimonials</h3>
-
  <div id="tabs">
+
  <div id="slideshow">
-
                              <ul class="tab-nav">
+
            <div class="slides">
-
                                <li><img src="https://dl.dropbox.com/u/45600819/igemewiki%20team%20photos/advisors/c.jpg" width="56"/></li>
+
                <ul>
-
                                <li><img src="https://dl.dropbox.com/u/45600819/igemewiki%20team%20photos/acknowledgements/r.jpg" width="56"/></li>
+
                    <li id="slide-one">
-
                              </ul>
+
                        <!--<h2>Slide one</h2>-->
-
<div class="tab-content" >
+
                        <p>
-
<div style="width:90%; margin:auto;">
+
                        <div class="testimonial triangle-isosceles" >
-
                                                  <div class="testimonial triangle-isosceles" ><p style="overflow:auto; ">I am reaching the end of my PhD on algal molecular biology and have found the CUO extremely useful. To date my use of it has fallen into three categories. My initial use of it was for the assisted design or redesign of several recombinant genes for expression in the Chlamydomonas reinhardtii chloroplast, a task which it has excelled at. Further to this I have used the program extensively for the analysis of previously expressed genes in the C. reinhardtii chloroplast to evaluate trends in expressing and non-expressing sub-sets. The CUO has also proven to be a very powerful tool for the study of the codon and codon pair usage in genes native to the C. reinhardtii chloroplast, a task I would have been unable to complete without this program.</p></div>
+
                        <p style="overflow:auto; ">I am reaching the end of my PhD on algal molecular biology and have found the CUO extremely useful. To date my use of it has fallen into three categories. My initial use of it was for the assisted design or redesign of several recombinant genes for expression in the Chlamydomonas reinhardtii chloroplast, a task which it has excelled at. Further to this I have used the program extensively for the analysis of previously expressed genes in the C. reinhardtii chloroplast to evaluate trends in expressing and non-expressing sub-sets. The CUO has also proven to be a very powerful tool for the study of the codon and codon pair usage in genes native to the C. reinhardtii chloroplast, a task I would have been unable to complete without this program.</p>
-
                                                  <div class="test-author" style="margin:auto; width:95%; text-align:center;">Henry Taunt, PhD Candidate</div>
+
                        </div>
-
                                              </div>
+
                        <div class="test-author" style="margin:auto; width:95%; text-align:center;">Henry Taunt, PhD Candidate</div>
-
 
+
                        </p>
-
<div style="width:90%; margin:auto;">
+
                    </li>
-
                                                  <div class="testimonial triangle-isosceles" ><p style="overflow:auto; ">I have used CUO to optimize several gene and tag sequences for expression in the Chlamydomonas chloroplast. The advantage of this program lies in its integration of codon usage with codon pairing optimization, using data from highly expressed genes. The interface is professional, flexible and easy to navigate and the manual provides clear instructions. Whilst we are still gathering data, early indications are that the program performs very well in redesigning genes for optimal expression.</p></div>
+
                    <li id="slide-two">
-
                                                  <div class="test-author" style="margin:auto; width:95%; text-align:center;"><br/>Dr Rosie Young</div>
+
                        <!--<h2>Slide two</h2>-->
-
                                              </div>
+
                        <p>
-
                                      </div><!-- tab-content-->
+
                            <div class="testimonial triangle-isosceles" ><p style="overflow:auto; ">I have used CUO to optimize several gene and tag sequences for expression in the Chlamydomonas chloroplast. The advantage of this program lies in its integration of codon usage with codon pairing optimization, using data from highly expressed genes. The interface is professional, flexible and easy to navigate and the manual provides clear instructions. Whilst we are still gathering data, early indications are that the program performs very well in redesigning genes for optimal expression.</p></div>
-
                          </div><!-- tabs-->
+
                            <div class="test-author" style="margin:auto; width:95%; text-align:center;">Dr Rosie Young</div>
 +
                        </p>
 +
                    </li>             
 +
                </ul>
 +
            </div>
 +
            <div class="div-slide-nav">
 +
            <ul class="slides-nav">
 +
                <li class="on"><a href="#slide-one"><img src="https://dl.dropbox.com/u/45600819/igemewiki%20team%20photos/advisors/c.jpg" width="56"/></a></li>
 +
                <li><a href="#slide-two"><img src="https://dl.dropbox.com/u/45600819/igemewiki%20team%20photos/acknowledgements/r.jpg" width="56"/></a></li>
 +
            </ul>
 +
            </div> <!-- .div-slide-nav -->
 +
        </div><!-- #slideshow -->
</div><!-- .footer-box left -->
</div><!-- .footer-box left -->
Line 239: Line 324:
<div class="footer-box right">
<div class="footer-box right">
<h3>Sponsors</h3>
<h3>Sponsors</h3>
-
<div id="sponsor-slides">
 
-
<div class="slides_container">
 
-
<div>
 
-
<ul class="sponsor-list">
 
-
<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="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 
-
</ul>
 
-
</div>
 
<div>
<div>
<ul class="sponsor-list">
<ul class="sponsor-list">
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
+
<a href="http://www.clcbio.com" class="sponsor-logo"><li><img src="http://www.clcbio.com/wp-content/themes/clcbio-wordpress/images/clcbio_logo_web.png" width="130" style="padding-top:17px;"/></li></a>
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
+
<a href="http://www.engineering.ucl.ac.uk" class="sponsor-logo"><li><img src="http://media.tumblr.com/tumblr_lxeegbS9iG1qitocx.gif" width="150" style="padding-top:0px;"/></li></a>
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
+
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li><p style="margin-top:32px; color:grey;">click to sponsor!</p></li></a>
-
<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
+
<!--<a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li><p>click to sponsor!</p></li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>
 +
                                <a href="#" class="sponsor-logo nothing" onclick="sponsoring()"><li>click to sponsor!</li></a>-->
</ul>
</ul>
</div>
</div>
-
</div><!-- .slides_container -->
 
-
</div><!-- #slides -->
 
</div><!-- .footer-box right -->
</div><!-- .footer-box right -->
-
<div class="clear" style="width:100%; height:2px;"></div>
+
<div class="clear" style="width:100%; height:0.3px;"></div>
  </div>
  </div>
   
   
 +
<script type="text/javascript" src="https://dl.dropbox.com/u/3703109/igeme/js/jquery.cycle.js"></script>
 +
<script type="text/javascript" src="https://dl.dropbox.com/u/3703109/igeme/js/slideshow.js"></script>
<script type="text/javascript">
<script type="text/javascript">
Line 273: Line 354:
         nHeight = (nHeight > $('.footer-box.middle').height() ) ? nHeight : $('.footer-box.middle').height();
         nHeight = (nHeight > $('.footer-box.middle').height() ) ? nHeight : $('.footer-box.middle').height();
         console.log('height' + nHeight);
         console.log('height' + nHeight);
-
        //$('#footer-boxes').css('height', nHeight);
+
        /* $('#footer-boxes').css('height', nHeight);
-
/*      $('.footer-box.left').outerHeight(nHeight);
+
      $('.footer-box.left').outerHeight(nHeight);
         $('.footer-box.middle').outerHeight(nHeight);
         $('.footer-box.middle').outerHeight(nHeight);
         $('.footer-box.right').outerHeight(nHeight);
         $('.footer-box.right').outerHeight(nHeight);

Latest revision as of 19:40, 21 October 2012

Retrieved from "http://2012e.igem.org/wiki/index.php/Team:UCLondon/Templates/bottom-contentv4"