Template:Http://2014.igem.org/Team:Colombia

From 2013.igem.org

(Difference between revisions)
Line 54: Line 54:
</style>
</style>
 +
 +
 +
/* Webfont link */
 +
@import url(http://fonts.googleapis.com/css?family=Unica+One);
 +
 +
/* Plugin base styles */
 +
 +
.slider {
 +
  position: relative;
 +
  width: 100%;
 +
  overflow: hidden;
 +
}
 +
 +
.slides {
 +
  position: relative;
 +
  padding: 0;
 +
  list-style: none;
 +
  letter-spacing: 0;
 +
  word-spacing: 0;
 +
  font-size: 0;
 +
  -webkit-backface-visibility: hidden;
 +
  -webkit-transform: translate3d(0,0,0);
 +
}
 +
 +
.slides li {
 +
  display: inline-block;
 +
  -webkit-backface-visibility: hidden;
 +
}
 +
 +
.slides li img {
 +
  width: 100%;
 +
  height: auto;
 +
}
 +
 +
/* Non-plugin styles */
 +
 +
* {
 +
  margin: 0;
 +
  padding: 0;
 +
}
 +
 +
body {
 +
  position: relative;
 +
  width: 90%;
 +
  max-width: 600px;
 +
  margin: 0 auto;
 +
  font-family: 'Unica One', sans-serif;
 +
}
 +
 +
.slide-nav {
 +
  position: absolute;
 +
  bottom: 20px;
 +
  right: 20px;
 +
  z-index: 1;
 +
}
 +
 +
.slide-nav ul {
 +
  letter-spacing: 0;
 +
  word-spacing: 0;
 +
  font-size: 0;
 +
}
 +
 +
.slide-nav li { display: inline-block; }
 +
 +
.slide-nav li a {
 +
  display: block;
 +
  color: #444;
 +
  background: #FFF;
 +
  text-decoration: none;
 +
  border-radius: 50%;
 +
  width: 26px;
 +
  height: 26px;
 +
  line-height: 26px;
 +
  font-size: 12px;
 +
  text-align: center;
 +
  margin: 0 0 0 6px;
 +
}
 +
 +
.slide-nav li a.active { color: #DEBB1E; }
 +
 +
Line 761: Line 842:
</td>
</td>
 +
 +
<section class="slider">
 +
 +
  <nav class="slide-nav">
 +
    <ul>
 +
      <li><a href="#">01</a></li>
 +
      <li><a href="#">02</a></li>
 +
      <li><a href="#">03</a></li>
 +
      <li><a href="#">04</a></li>
 +
      <li><a href="#">05</a></li>
 +
      <li><a href="#">06</a></li>
 +
    </ul>
 +
  </nav>
 +
 
 +
  <ul class="slides">
 +
    <li><img src="http://kylefoster.me/cp/Up01.jpg" alt="Slide One"></li>   
 +
    <li><img src="http://kylefoster.me/cp/Up02.jpg" alt="Slide Two"></li>
 +
    <li><img src="http://kylefoster.me/cp/Up03.jpg" alt="Slide Three"></li>
 +
    <li><img src="http://kylefoster.me/cp/Up04.jpg" alt="Slide Four"></li>
 +
    <li><img src="http://kylefoster.me/cp/Up05.jpg" alt="Slide Five"></li>
 +
    <li><img src="http://kylefoster.me/cp/Up06.jpg" alt="Slide Five"></li>
 +
  </ul>
 +
 
 +
</section>

Revision as of 15:48, 22 August 2014

/* Webfont link */ @import url(http://fonts.googleapis.com/css?family=Unica+One); /* Plugin base styles */ .slider { position: relative; width: 100%; overflow: hidden; } .slides { position: relative; padding: 0; list-style: none; letter-spacing: 0; word-spacing: 0; font-size: 0; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); } .slides li { display: inline-block; -webkit-backface-visibility: hidden; } .slides li img { width: 100%; height: auto; } /* Non-plugin styles */ * { margin: 0; padding: 0; } body { position: relative; width: 90%; max-width: 600px; margin: 0 auto; font-family: 'Unica One', sans-serif; } .slide-nav { position: absolute; bottom: 20px; right: 20px; z-index: 1; } .slide-nav ul { letter-spacing: 0; word-spacing: 0; font-size: 0; } .slide-nav li { display: inline-block; } .slide-nav li a { display: block; color: #444; background: #FFF; text-decoration: none; border-radius: 50%; width: 26px; height: 26px; line-height: 26px; font-size: 12px; text-align: center; margin: 0 0 0 6px; } .slide-nav li a.active { color: #DEBB1E; } ' Wheeltz - CSS3 Navigational Wheel Menu

  • Slide One
  • Slide Two
  • Slide Three
  • Slide Four
  • Slide Five
  • Slide Five
  • Home
  • University
  • Facebook
  • Twitter