Difference between revisions of "Template:IIT Kanpur/Footer"

Line 1: Line 1:
 
<html>
 
<html>
  
<style>
+
<div class="sponsors">
 +
    <img src="https://static.igem.org/mediawiki/2018/7/76/T--Lund--sponsor_gant.png" alt="Gant Logo"
 +
    style="height: 20px; width: auto">
 +
    <img src="https://static.igem.org/mediawiki/2018/7/7c/T--Lund--sponsor_lmk.png" alt="LMK Logo"
 +
    style="height: 100px; width: auto">
 +
    <img src="https://static.igem.org/mediawiki/2018/8/8a/T--Lund--sponsor_lund.png" alt="Lund Logo"
 +
    style="height: 125px; width: auto">
 +
    <img src="https://static.igem.org/mediawiki/2018/1/14/T--Lund--sponsor_kunskap_partner.png" alt="Kunskap Partner Logo"
 +
    style="height: 50px; width: auto">
 +
  </div>
  
 +
<footer class="footer">
  
/* Code for removing iGEM loader content */
+
  <section class="site-map container">
 +
    <div class="row">
  
#sideMenu, #top_title, #top, #toc{
+
      <div class="col-sm-3">
  display: none;
+
        <h5>Home</h5>
}
+
        <ul>
 +
          <li><a href="/Team:Lund">Home</a></li>
 +
        </ul>
  
/* Content styling */
+
        <h5>Team</h5>
 +
        <ul>
 +
          <li><a href="/Team:Lund/Team">Team</a></li>
 +
          <li><a href="/Team:Lund/Collaborations">Collaborations</a></li>
 +
          <li><a href="/Team:Lund/Attributions">Attributions</a></li>
 +
        </ul>
 +
      </div>
  
#content {
+
      <div class="col-sm-3">
  width: 100%;
+
        <h5>Project</h5>
  height: 100%;
+
        <ul>
  box-sizing: border-box;
+
          <li><a href="/Team:Lund/Description">Description</a></li>
  margin: -31px 0 0;
+
          <li><a href="/Team:Lund/Design">Design</a></li>
  padding: 0;
+
          <li><a href="/Team:Lund/Results">Results</a></li>
}
+
          <li><a href="/Team:Lund/InterLab">InterLab</a></li>
 +
          <li><a href="/Team:Lund/Parts">Parts</a></li>
 +
          <li><a href="/Team:Lund/Experiments">Protocol</a></li>
 +
          <li><a href="/Team:Lund/Notebook">Notebook</a></li>
 +
        </ul>
 +
      </div>
  
body {
+
      <div class="col-sm-3">
    margin: 0;
+
        <h5>Model</h5>
    height: 100%;
+
        <ul>
}
+
          <li><a href="/Team:Lund/Model">Results</a></li>
 +
          <li><a href="/Team:Lund/Modeling/ModelDerivation">Model derivation</a></li>
 +
          <li><a href="/Team:Lund/Modeling/ParameterEstimation">Parameter estimation</a></li>
 +
          <li><a href="/Team:Lund/Modeling/Implementation">Implementation</a></li>
 +
        </ul>
  
 +
        <h5>Safety</h5>
 +
        <ul>
 +
          <li><a href="/Team:Lund/Safety">Safety</a></li>
 +
        </ul>
 +
      </div>
  
 +
      <div class="col-sm-3">
 +
        <h5>Practices</h5>
 +
        <ul>
 +
          <li><a href="/Team:Lund/HP/Silver">Overview</a>
 +
          <li><a href="/Team:Lund/HP/Gold_Integrated">Integrated</a>
 +
          <li><a href="/Team:Lund/Engagement">Engagement</a>
 +
          <li><a href="/Team:Lund/HP/Media">Media</a>
 +
          <li><a href="/Team:Lund/Communication">Communication</a>
 +
        </ul>
 +
      </div>
  
 +
    </div>
 +
  </section>
  
 +
  <section class="container">
 +
    <div class="row">
  
.clearfix::after {
+
      <div class="contact col-sm-3">
    content: "";
+
         <h4>Contact</h4>
    clear: both;
+
        <a>Sölvegatan 22 A</a><br>
    display: table;
+
         <a>223 62 Lund</a><br>
}
+
        <a> Sweden</a><br>
 
+
        <a href="mailto:igemlund@gmail.com">igemlund@gmail.com</a>
.fch {
+
      </div>
    border-bottom: 2px solid !important;
+
}
+
 
+
.fch tr:nth-child(1) th:nth-child(1) {
+
    border-bottom: 2px solid !important;
+
}
+
 
+
.fch tr th:nth-child(1) {
+
    border: none !important;
+
}
+
 
+
#contentMain li {
+
    font-size: 1.25em;
+
    line-height: 1.9;
+
}
+
 
+
#contentMain table li {
+
    font-size: 1em;
+
}
+
 
+
 
+
 
+
 
+
 
+
 
+
/* Footer styling */
+
 
+
        #pagefooter {
+
            width: 100%;
+
            position: fixed;
+
            bottom: -250px;
+
            left: 0;
+
            background-color: #23e082;
+
            transition: all 0.5s ease;
+
            padding-left: 10px;
+
            z-index: 2;
+
            font-family: "Poppins", sans-serif;
+
         }
+
        #smallfooter {
+
            transition: all 0.5s ease;
+
        }
+
        .expanded {
+
            bottom: 0 !important;
+
            transition: all 0.5s ease;
+
        }
+
        .expanded #smallfooter {
+
            opacity: 0;
+
            transition: all 0.5s ease;
+
        }
+
        .footerarrow {
+
            position: absolute;
+
            top: 4px;
+
            left: 50%;
+
            transform: translateX(-50%);
+
            transition: transform 0.5s ease-in;
+
            height: 12px;
+
        }
+
        .inverted {
+
            transform: rotate(180deg);
+
            transition: transform 0.5 ease-in;
+
        }
+
        #bigfooter table {
+
            border: none;
+
            background: none;
+
        }
+
        #bigfooter table tr td {
+
            border: none;
+
            background: none;
+
        }
+
        #bigfooter table tr th {
+
            border: none;
+
            background: none;
+
            font-family: "Raleway-ExtraBold", sans-serif;
+
            font-size: 2em;
+
            letter-spacing: 1px;
+
            text-transform: uppercase;
+
        }
+
        #footericons {
+
            float: right;
+
            margin-right: 20px;
+
        }
+
        #footericons img{
+
            height: 18px;
+
            margin-right: 10px;
+
            margin-bottom: 2px;
+
        }
+
        #bigfooter {
+
            width: 100%;
+
            position: relative;
+
            display: block;
+
            height: 250px;
+
        }
+
        #footersponsors {
+
            width: 60%;
+
            float: left;
+
        }
+
        #footersponsors img {
+
            height: 100%;
+
        }
+
        #footercontact {
+
            width: 40%;
+
            float: right;
+
        }
+
        #footercontact img {
+
            height: 50px;
+
        }
+
        #footersponsors td {
+
            text-align: center;
+
            height: 70px;
+
        }
+
 
+
</style>
+
 
+
<div id="contentWrapper">
+
<div style="position: fixed; width: 100%; top: 16px; left: 0; z-index: 1;">
+
 
+
 
+
<div id="pagefooter" class="clearfix">
+
         <div id="smallfooter" class="clearfix">
+
            <div id="footericons">
+
                <a href="https://www.facebook.com/bioluminatiigem/"><img src="https://static.igem.org/mediawiki/2018/a/a2/T--IIT_Kanpur--fb.svg" /></a><a href="https://twitter.com/igemiit?lang=en"><img src="https://static.igem.org/mediawiki/2018/f/f7/T--IIT_Kanpur--twitter.svg" /></a><a href="mailto:teamigemiitk2k18@gmail.com"><img src="https://static.igem.org/mediawiki/2018/5/5d/T--IIT_Kanpur--mail.svg" /></a><a href="https://www.instagram.com/igem_iitk/"><img src="https://static.igem.org/mediawiki/2018/2/22/T--IIT_Kanpur--insta.svg" /></a>
+
            </div>
+
        </div>
+
        <img class="footerarrow" src="https://static.igem.org/mediawiki/2018/a/a8/T--IIT_Kanpur--arrow.png" width="20px" />
+
        <div id="bigfooter" class="clearfix">
+
            <div id="footersponsors">
+
<table style="margin: auto">
+
<tr>
+
 
+
<th colspan="6" style="text-align: center; font-size: 1.5em;">Sponsors</th>
+
  
</tr>
+
      <div class="social-media col-sm-3 col-sm-offset-3">
<tr>
+
        <h4>Stay connected</h4>
<td colspan="2"><a href="https://www.iitk.ac.in/"><img src="https://static.igem.org/mediawiki/2018/3/3d/T--IIT_Kanpur--IITKlogo.png"></a></td>
+
        <ul>
<td colspan="2"><a href="https://in.mathworks.com/"><img src="https://static.igem.org/mediawiki/2018/b/ba/T--IIT_Kanpur--mw.png"></a></td>
+
          <li>
<td colspan="2"><a href="https://eu.idtdna.com/pages"><img src="https://static.igem.org/mediawiki/2018/1/10/T--IIT_Kanpur--idt.png"></a></td>
+
            <a href="https://www.facebook.com/igemlund" target="_blank">
</tr>
+
              <i class="fa fa-facebook-official" aria-hidden="true"></i>
<tr>
+
              Facebook
<td colspan="2"><a href="https://www.geneious.com/"><img src="https://static.igem.org/mediawiki/2018/a/ae/T--IIT_Kanpur--geneious.png"></a></td>
+
            </a>
<td colspan="2"><a href="http://www.snapgene.com/"><img src="https://static.igem.org/mediawiki/2018/8/84/T--IIT_Kanpur--snapgene.png"></a></td>
+
          </li>
<td colspan="2"><a href="http://www.iitk.ac.in/siic/d/birac-bio-incubator"><img src="https://static.igem.org/mediawiki/2018/5/57/T--IIT_Kanpur--birac.png"></a></td>
+
          <li>
</tr>
+
            <a href="https://www.instagram.com/igem_lund" target="_blank">
 +
              <i class="fa fa-instagram" aria-hidden="true"></i>
 +
              Instagram
 +
            </a>
 +
          </li>
 +
          <li>
 +
            <a href="https://twitter.com/iGEM_Lund" target="_blank">
 +
              <i class="fa fa-twitter" aria-hidden="true"></i>
 +
              Twitter
 +
            </a>
 +
          </li>
 +
        </ul>
 +
      </div>
  
                </table>
 
            </div><div id="footercontact">
 
                <table style="margin: auto">
 
                    <tr><th colspan="6" style="text-align: center; font-size: 1.5em;">Contact</th></tr>
 
                    <tr><td>&nbsp;</td></tr>
 
                    <tr>
 
                        <td><a href="https://www.facebook.com/bioluminatiigem/"><img src="https://static.igem.org/mediawiki/2018/a/a2/T--IIT_Kanpur--fb.svg" /></a></td>
 
                        <td><a href="https://twitter.com/igemiit?lang=en"><img src="https://static.igem.org/mediawiki/2018/f/f7/T--IIT_Kanpur--twitter.svg" /></a></td>
 
                        <td><a href="mailto:teamigemiitk2k18@gmail.com"><img src="https://static.igem.org/mediawiki/2018/5/5d/T--IIT_Kanpur--mail.svg" /></a></td>
 
                        <td><a href="https://www.instagram.com/igem_iitk/"><img src="https://static.igem.org/mediawiki/2018/2/22/T--IIT_Kanpur--insta.svg" /></a></td>
 
                    </tr>
 
                    <tr><td>&nbsp;</td></tr>
 
                </table>
 
            </div>
 
        </div>
 
 
     </div>
 
     </div>
</div>
+
  </section>
  
<script>
+
  <section class="copyright container">
     $("#pagefooter").click(function() {
+
     &copy;2018 iGEM Lund
        $("#pagefooter").toggleClass("expanded");
+
  </section>
        $(".footerarrow").toggleClass("inverted");
+
    });
+
  
</script>
+
</footer>
 
</html>
 
</html>

Revision as of 21:49, 13 October 2018

Gant Logo LMK Logo Lund Logo Kunskap Partner Logo