Difference between revisions of "Team:Groningen/test"

 
(95 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{Groningen}}
+
{{groningen}}
 
<html>
 
<html>
 
+
<body>
 
+
 
+
 
+
 
<style>
 
<style>
.mySlides {display:none}
+
div.bar {
.slideshow-container {
+
    background-color: #027ad0;
  position: relative;
+
    background-image: linear-gradient(#027ad0, #027ad0);
  margin: auto;
+
 
}
 
}
.slideshow-container img {
+
ul.menu, ul.menu ul {
  filter: blur(2px);
+
    margin: 0;  
  width:100%;
+
    padding: 0;  
  height:350px;
+
    list-style: none;
  object-fit: cover;
+
 
}
 
}
/* Caption text */
+
ul.menu {
.slidetext {
+
width: 960px;  
  color: #111;
+
    width: -moz-fit-content;
  font-size: 15px;
+
    width: -webkit-fit-content;
  padding: 8px 12px;
+
    width: fit-content;  
  position: absolute;
+
    text-align: center;
  bottom: 8px;
+
    /*white-space: nowrap;*/
  width: 100%;
+
    margin: 0px auto;  
  text-align: center;
+
    border: 0px solid #222;
 +
    background-color: #027ad0;
 +
    background-image: linear-gradient(#027ad0, #027ad0);
 +
    border-radius: 0px;
 
}
 
}
/* The dots/bullets/indicators */
+
ul.menu:before,ul.menu:after {
.dot {
+
    content: "";
  height: 15px;
+
    display: block;
  width: 15px;
+
  margin: 0 2px;
+
  background-color: #bbb;
+
  border-radius: 50%;
+
  display: inline-block;
+
  transition: background-color 0.6s ease;
+
 
}
 
}
.activeslide {
+
ul.menu:after {
  background-color: #717171;
+
    clear: both;
 
}
 
}
/* Fading animation */
+
ul.menu li {
.fade {
+
    float: left;  
  -webkit-animation-name: fade;
+
    box-shadow: none;
  -webkit-animation-duration: 1.5s;
+
    position: relative;
  animation-name: fade;
+
  animation-duration: 1.5s;
+
 
}
 
}
@-webkit-keyframes fade {
+
ul.menu li.lilast {
  from {opacity: .4}
+
    border-right: none;
  to {opacity: 1}
+
 
}
 
}
@keyframes fade {
+
ul.menu a {
  from {opacity: .4}
+
    float: left;
  to {opacity: 1}
+
    padding: 12px 16px;
 +
    color: #FFFFFF;
 +
    font: 17px Arial, Helvetica;
 +
    text-decoration: none;
 +
    text-shadow: 0 1px 0 #000;
 
}
 
}
/* On smaller screens, decrease text size */
+
ul.menu ul {
@media only screen and (max-width: 300px) {
+
    margin: 20px 0 0 0;
   .slidetext {font-size: 11px}
+
    _margin: 0; /*IE6 only*/
 +
    opacity: 0;
 +
    visibility: hidden;
 +
    position: absolute; 
 +
    /* spacing between the menu and the dropdown menu, ideally 28px, or 23px for bordered menu */
 +
    top: 45px;
 +
    left: 0;
 +
    z-index: 1;   
 +
    background: #027ad0; 
 +
    background: linear-gradient(#027ad0, #027ad0);
 +
    border-radius: 0px;
 +
    transition: all .2s ease-out;
 +
}
 +
ul.menu li:hover > ul {
 +
    opacity: 1;
 +
    visibility: visible;
 +
    margin: 0;
 +
}
 +
ul.menu ul ul {
 +
    top: 0;
 +
    left: 150px;
 +
    margin: 0 0 0 20px;
 +
    _margin: 0; /*IE6 only*/
 +
    box-shadow: -0px 0 0 rgba(255,255,255,.3);   
 +
}
 +
ul.menu ul li {
 +
    float: none;
 +
    display: block;
 +
    border: 0;
 +
    _line-height: 0; /*IE6 only*/
 +
    box-shadow: 0 0px 0 #111, 0 0px 0 #666;
 +
    text-align: left;
 +
}
 +
ul.menu ul li:last-child {    
 +
    box-shadow: none;   
 +
    border: 0;
 +
}
 +
ul.menu ul a {  
 +
    padding: 10px;
 +
    width: 150px;
 +
    _height: 10px; /*IE6 only*/
 +
    display: block;
 +
    white-space: nowrap;
 +
    float: none;
 +
    text-transform: none;
 +
}
 +
ul.menu ul a:hover {
 +
    background-color: #032c62;
 +
    background-image: linear-gradient(#032c62, #032c62);
 +
}
 +
ul.menu li a:hover {
 +
    background-color: #032c62;
 +
    background-image: linear-gradient(#032c62, #032c62);
 
}
 
}
</style>
 
  
<body>
+
/*div.bar li a {display: block;}*/
 +
div.bar li.icon {display: none;}
  
<div class="slideshow-container">
+
@media screen and (max-width:800px) {
<div class="mySlides fade">
+
ul.menu li a {
  <img src="https://static.igem.org/mediawiki/2017/b/b7/Indexpicture.png" style="width:100%">
+
position: relative;
  <div class="slidetext">Caption Text</div>
+
left: 0;
</div>
+
top: 0;
<div class="mySlides fade">
+
display: block;
  <img src="https://static.igem.org/mediawiki/2017/9/95/Indexfig2.png" style="width:100%">
+
}
   <div class="slidetext">Caption Two</div>
+
div.bar li {display: none;}
</div>
+
div.bar li.icon {
<div class="mySlides fade">
+
    position: relative;
   <img src="https://static.igem.org/mediawiki/2017/a/a3/Indexteamsytear.png" style="width:100%">
+
    left: 0;
  <div class="slidetext">Caption Three</div>
+
    top: 0;
</div>
+
    display: block;
</div>
+
}
 +
ul.menu {
 +
  list-style-type: block;
 +
   margin: 0;
 +
  padding: 0;
 +
}
 +
ul.menu li a {
 +
   padding: 12px 14px;
 +
  text-decoration: none;
 +
  font-size: 15px;
 +
}
 +
ul.menu ul a {   
 +
    padding: 10px;
 +
    width: 120px;
 +
}
 +
}
  
<br>
+
  div.bar.res {position: relative;}
 +
  div.menu.res li.icon {
 +
    position: absolute;
 +
    left: 0;
 +
    top: 0;
 +
float: left;
 +
  }
 +
  div.bar.res li {
 +
    float: none;
 +
    display: block;
 +
  }
 +
  div.bar.res li a {
 +
    display: block;
 +
    text-align: left;
 +
  }
 +
ul.menu.res ul {
 +
    margin: 0px 0 0 0;
 +
    _margin: 0;
 +
    opacity: 1;
 +
    visibility: visible;
 +
    position: absolute; 
 +
    top: 42px;
 +
    left: 0;
 +
    z-index: 1;   
 +
    background: #027ad0; 
 +
    background: linear-gradient(#027ad0, #027ad0);
 +
    border-radius: 0px;
 +
    transition: all .2s ease-in-out;
 +
}
  
<div style="text-align:center">
+
ul.menu.res li {float: left;}
  <span class="dot"></span>
+
  <span class="dot"></span>
+
  <span class="dot"></span>
+
</div>
+
  
<script>
 
var slideIndex = Math.floor((Math.random() * 3) + 1);
 
showSlides();
 
  
function showSlides() {
+
</style>
    var i;
+
 
    var slides = document.getElementsByClassName("mySlides");
+
 
    var dots = document.getElementsByClassName("dot");
+
  <section>
     for (i = 0; i < slides.length; i++) {
+
  <div class="bar">
      slides[i].style.display = "none"
+
<!-- Begin content block -->
    }
+
  <!--<ul id="menu"> -->
     slideIndex++;
+
  <ul class="menu">
     if (slideIndex > slides.length) {slideIndex = 1}    
+
     <li class="icon"> <a href="javascript:void(0);" onclick="myFunction()">≡ Menu</a></li>
     for (i = 0; i < dots.length; i++) {
+
  <li><a href="?page=home">Home</a></li>
        dots[i].className = dots[i].className.replace(" activeslide", "");
+
  <li><a href="#">Symposium</a>
    }
+
     <ul>
     slides[slideIndex-1].style.display = "block";  
+
    <li><a href="?page=program" onclick="">Program</a></li>
     dots[slideIndex-1].className += " activeslide";
+
    <li><a href="?page=daychair" onclick="">Day chair</a></li>
     setTimeout(showSlides, 6000); // Change image every 2 seconds
+
    <li><a href="?page=speakers" onclick="">Speakers</a></li>
 +
    <li><a href="?page=guestspeaker" onclick="">Guest speaker</a></li>
 +
    <li><a href="?page=location" onclick="">Location</a></li>
 +
     </ul>
 +
  </li>
 +
<!--  <li><a href="?page=gallery">Gallery</a></li>-->
 +
   <li><a href="?page=sponsors">Sponsors</a></li>
 +
  <li><a href="#">About us</a>
 +
     <ul>
 +
    <li><a href="?page=nanoscience" onclick="">Nanoscience</a></li>
 +
    <li><a href="?page=topmaster" onclick="">Top Master</a></li>
 +
    <li><a href="?page=recom" onclick="">Recommendations</a></li>
 +
     </ul>
 +
  </li>
 +
  <li><a href="?page=contact">Contact</a></li>
 +
  <li class="lilast"><a href="?page=registration">Registration</a></li>
 +
  </ul>
 +
  </div>
 +
</section>
 +
 
 +
<script>
 +
function myFunction() {
 +
     document.getElementsByClassName("bar")[0].classList.toggle("res");
 +
     document.getElementsByClassName("menu")[0].classList.toggle("res");
 
}
 
}
 
</script>
 
</script>
  
 +
<div class="main-col">
  
 +
<h2><a href="https://2017.igem.org/Team:Groningen/test1">back to test 1</a></h2>
  
 +
<div>hicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
  
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet.
 +
Sub heading style
 +
 +
Nunc ut ornare odio. Proin massa turpis, porta at dolor non, tempus sagittis risus. Maecenas ornare, eros eget commodo sagittis, neque orci consectetur risus, sed convallis purus
 +
# First Name Last Name Username
 +
1 Mark Otto @mdo
 +
2 Jacob Thornton @fat
 +
3 Larry the Bird @twitter
 +
The Route
 +
 +
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
 +
Hotel.
 +
795 Folsom Ave, Suite 600
 +
San Francisco, CA 94107
 +
P: (123) 456-7890
 +
Full Name
 +
first.last@example.com
 +
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Cras nec libero leo. Nulla bibendum ligula ut nisi dictum, et interdum ipsum scelerisque. Nullam a volutpat tellus. Maecenas nisi est, ultricies in neque in, aliquet dictum odio. Etiam suscipit sapien purus, suscipit pharetra tellus lobortis ut. Maecenas commodo feugiat justo ac ullamcorper. In volutpat nec velit posuere placerat. Suspendisse rutrum dolor sed semper pharetra.
 +
The Bike
 +
 +
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
 +
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Description lists
 +
    A description list is perfect for defining terms.
 +
Euismod
 +
    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
 +
    Donec id elit non mi porta gravida at eg</div>
 +
 +
<div id="snavtest">
 +
<h3>THIS IS MY ID TARGET</h3>
 +
<a href="#snavtest">test this page</a><br>
 +
</div>
 +
 +
<div>faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
 +
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet.
 +
Sub heading style
 +
 +
Nunc ut ornare odio. Proin massa turpis, porta at dolor non, tempus sagittis risus. Maecenas ornare, eros eget commodo sagittis, neque orci consectetur risus, sed convallis purus
 +
# First Name Last Name Username
 +
1 Mark Otto @mdo
 +
2 Jacob Thornton @fat
 +
3 Larry the Bird @twitter
 +
The Route
 +
 +
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
 +
Hotel.
 +
795 Folsom Ave, Suite 600
 +
San Francisco, CA 94107
 +
P: (123) 456-7890
 +
Full Name
 +
first.last@example.com
 +
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Cras nec libero leo. Nulla bibendum ligula ut nisi dictum, et interdum ipsum scelerisque. Nullam a volutpat tellus. Maecenas nisi est, ultricies in neque in, aliquet dictum odio. Etiam suscipit sapien purus, suscipit pharetra tellus lobortis ut. Maecenas commodo feugiat justo ac ullamcorper. In volutpat nec velit posuere placerat. Suspendisse rutrum dolor sed semper pharetra.
 +
The Bike
 +
 +
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas.
 +
 +
Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi.
 +
 +
Description lists
 +
    A description list is perfect for defining terms.
 +
Euismod
 +
    Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
 +
    Donec id elit non mi porta gravida at eg</div>
 +
 +
 +
</div> <!-- main-col -->
  
 
<div class="footer">
 
<div class="footer">
 
<img id="bannerimg" usemap="#imagemap_sponsors" style="width: 100%;" src="https://static.igem.org/mediawiki/2017/b/b5/Banner.jpg" alt="Sponsors">
 
<img id="bannerimg" usemap="#imagemap_sponsors" style="width: 100%;" src="https://static.igem.org/mediawiki/2017/b/b5/Banner.jpg" alt="Sponsors">
 
</div>
 
</div>
 
 
</body>
 
</body>
</html>
+
<html>

Latest revision as of 19:33, 31 October 2017


back to test 1

hicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Sub heading style Nunc ut ornare odio. Proin massa turpis, porta at dolor non, tempus sagittis risus. Maecenas ornare, eros eget commodo sagittis, neque orci consectetur risus, sed convallis purus # First Name Last Name Username 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 Larry the Bird @twitter The Route Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Hotel. 795 Folsom Ave, Suite 600 San Francisco, CA 94107 P: (123) 456-7890 Full Name first.last@example.com Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Cras nec libero leo. Nulla bibendum ligula ut nisi dictum, et interdum ipsum scelerisque. Nullam a volutpat tellus. Maecenas nisi est, ultricies in neque in, aliquet dictum odio. Etiam suscipit sapien purus, suscipit pharetra tellus lobortis ut. Maecenas commodo feugiat justo ac ullamcorper. In volutpat nec velit posuere placerat. Suspendisse rutrum dolor sed semper pharetra. The Bike Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Description lists A description list is perfect for defining terms. Euismod Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit. Donec id elit non mi porta gravida at eg

THIS IS MY ID TARGET

test this page
faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Sub heading style Nunc ut ornare odio. Proin massa turpis, porta at dolor non, tempus sagittis risus. Maecenas ornare, eros eget commodo sagittis, neque orci consectetur risus, sed convallis purus # First Name Last Name Username 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 Larry the Bird @twitter The Route Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Hotel. 795 Folsom Ave, Suite 600 San Francisco, CA 94107 P: (123) 456-7890 Full Name first.last@example.com Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Maecenas tincidunt, ante in ultricies porta, magna ipsum convallis augue, non ornare turpis orci ac risus. Duis non enim sit amet libero ultricies egestas. Duis bibendum felis est, nec feugiat erat imperdiet sed. Donec aliquet, velit ac semper fermentum, quam leo eleifend nisl, non rhoncus sapien nibh ac massa. Integer mattis arcu nec suscipit laoreet. Cras nec libero leo. Nulla bibendum ligula ut nisi dictum, et interdum ipsum scelerisque. Nullam a volutpat tellus. Maecenas nisi est, ultricies in neque in, aliquet dictum odio. Etiam suscipit sapien purus, suscipit pharetra tellus lobortis ut. Maecenas commodo feugiat justo ac ullamcorper. In volutpat nec velit posuere placerat. Suspendisse rutrum dolor sed semper pharetra. The Bike Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut egestas consectetur ante a rhoncus. Praesent a sapien vulputate, vehicula risus et, congue mi. Praesent quis auctor enim. Aenean gravida, libero ut dignissim porta, elit nisi faucibus nisi, vitae faucibus lorem eros in augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In ac varius diam. Mauris consectetur sed erat at dapibus. Fusce pulvinar est eu orci lacinia egestas. Phasellus facilisis nulla quis tortor adipiscing, eu blandit tortor pulvinar. In lacus purus, aliquet eu ante ut, tempor ultricies diam. Donec cursus neque neque, eget vehicula nisl commodo at. Fusce eu urna tempus, egestas ante id, facilisis dolor. Pellentesque venenatis ante convallis, ullamcorper erat at, malesuada elit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Aliquam commodo lectus ut luctus malesuada. Donec leo nisl, dignissim et ullamcorper ut, porta id ante. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eros felis, consequat sed augue non, semper eleifend nisi. Description lists A description list is perfect for defining terms. Euismod Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit. Donec id elit non mi porta gravida at eg