Difference between revisions of "Team:LUBBOCK TTU"

Line 1: Line 1:
{{LUBBOCK_TTU}}
+
{{LUBBOCK_TTU/MAIN/CSS}}
<!-- {{Team:LUBBOCK_TTU/backtotop}} -->
+
{{LUBBOCK_TTU/MAIN/JS}}
  
 
<html>
 
<html>
 
<html lang="en">
 
<html lang="en">
  
<head>
+
<!-- iGEM specific css -->
 
+
 
<style>
 
<style>
 
/* Clear the default wiki settings */
 
/* Clear the default wiki settings */
home_logo, #sideMenu { display:none; }
+
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
<!--#body {background-color:white; }-->
+
body {background-color:white; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
</style>
 +
<!-- end of iGEM specific css -->
  
<!-- typing animation -->
+
  <head>
body{
+
   
  padding-top: 10px;
+
    <!-- Meta Tag -->
}
+
    <meta charset="UTF-8">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 +
   
 +
    <title>Lubbock_TTU</title>
 +
   
 +
    <!-- Favicon -->
 +
    <link rel="shortcut icon" href="images/favicon/favicon.ico">
 +
    <link rel="apple-touch-icon" sizes="144x144" type="image/x-icon" href="images/favicon/apple-touch-icon.png">
 +
   
 +
    <!-- Google Web Fonts  -->
 +
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:400,300,500,600,700">
 +
   
 +
   
 +
    <!-- HTML5 shiv and Respond.js support IE8 or Older for HTML5 elements and media queries -->
 +
    <!--[if lt IE 9]>
 +
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
 +
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
 +
    <![endif]-->
  
font{
+
</head>
  font-family: "Courier";
+
  margin: 10px 0 0 10px;
+
  white-space: nowrap;
+
  overflow: hidden;
+
  width: 30em;
+
  animation: type 4s steps(60, end);
+
}
+
  
font:nth-child(2){
+
<body>
  animation: type2 8s steps(60, end);
+
 
}
+
<!-- Menu Section Start -->
 +
    <header id="home">
 +
       
 +
        <div class="header-top-area">
 +
            <div class="container">
 +
                <div class="row">
 +
               
 +
                    <div class="col-sm-3">-->
 +
                        <div class="logo">
 +
                            <center><a href="https://2017.igem.org/Team:LUBBOCK_TTU">LUBBOCK_TTU</a></center>
 +
                        </div>
 +
                    </div>
 +
                   
 +
                    <div class="col-sm-9">
 +
                        <div class="navigation-menu">
 +
                            <div class="navbar">
 +
                                <div class="navbar-header">
 +
                                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
 +
                                        <span class="sr-only">Toggle navigation</span>
 +
                                        <span class="icon-bar"></span>
 +
                                        <span class="icon-bar"></span>
 +
                                        <span class="icon-bar"></span>
 +
                                    </button>
 +
                                </div> <!-- end class navbar-header -->
 +
                                </br><div class="navbar-collapse collapse">
 +
                                    <ul class="nav navbar-nav navbar-right">
 +
                                        <li class="active"><a class="smoth-scroll" href="https://2017.igem.org/Team:LUBBOCK_TTU">Home</a></li>
 +
                                        <li><a class="smoth-scroll" href="https://2017.igem.org/Team:LUBBOCK_TTU/Team">Team</a></li>
 +
                                        <li><a class="smoth-scroll" href="https://2017.igem.org/Team:LUBBOCK_TTU/Description">Project</a></li>
 +
                                        <li><a class="smoth-scroll" href="https://2017.igem.org/Team:LUBBOCK_TTU/Parts">Parts</a></li>
 +
                                        <li><a class="smoth-scroll" href="https://2017.igem.org/Team:LUBBOCK_TTU/Safety">Safety</a></li>
 +
                                        <li><a class="smoth-scroll" href="">HP</a></li>
 +
                                        <li><a class="smoth-scroll" href="">Awards</a></li>
 +
                                    </ul>
 +
                                </div> <!-- end class navbar-collapse -->
 +
                            </div> <!-- end navbar -->
 +
                        </div> <!-- end navigation-menu -->
 +
                    </div> <!-- end col-sm-9 -->
  
font a{
+
                </div> <!-- class end row -->
  color: black;
+
            </div> <!-- class end container -->
  text-decoration: none;
+
        </div> <!-- class header-top-area -->
}
+
  
span{
+
    </header>
  animation: blink 1s infinite;
+
<!-- Menu Section End --> 
}
+
   
 +
   
 +
<!-- Home Section Start -->
 +
    <section class="home-section">
 +
        <div class="container">
 +
            <div class="row">               
 +
<!--<center><img src="" width=""></center>-->
 +
<!--</br></br><center><h1>PROJECT_TTU</h1></center></br>-->                                       
 +
              </div> <!-- end of class row -->
 +
            </div> <!-- end of class container -->
 +
        </section>
 +
<!-- Home Section End -->
 +
       
 +
<!-- About Start -->
 +
    <section id="about" class="about section-space-padding">
 +
      <div class="container">
 +
          <div class="row">
 +
                <div class="col-sm-12">
 +
                    <div class="section-title">
 +
                        <h2>About Us</h2>
 +
                        <div class="divider dark">
 +
  <i class="icon-emotsmile"></i>
 +
  </div> <!-- end class divider dark -->
 +
                        <!--<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>-->
 +
                    </div> <!-- end class section-title -->
 +
                </div> <!-- end class col-sm-12 -->
 +
            </div> <!-- end class row -->
 +
           
 +
           
 +
            <div class="row">
 +
             
 +
              <div class="col-md-6">
 +
              <div class="about-me-text margin-top-50">
 +
              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus feugiat facilisis dignissim. Etiam scelerisque ultricies euismod. Etiam pellentesque enim ac risus dapibus consequat. Nulla euismod lacinia felis, vel <a href="#" data-toggle="modal" data-target="#skillmodal" title="My Skills"><b>Check out my Skills</b></a> massa accumsan sit amet. Cras id fermentum neque. Curabitur et mollis neque. Fusce eu mattis arcu. Integer eget augue sit amet lorem convallis fermentum, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus feugiat facilisis dignissim. Etiam scelerisque ultricies euismod. Etiam pellentesque enim ac risus dapibus consequat.</p>
 +
              </div> <!-- end class about-me-text -->
 +
              </div> <!-- end class col-md-6 -->
 +
             
 +
            <div class="col-md-6">
 +
                </br><div class="about-me-text pattern-bg margin-top-50 margin-bottom-50">
 +
                  <div class="text-center">
 +
                    <!--<a class="button button-style button-style-dark button-style-color-2" data-toggle="modal" data-target="#subscribemodal" href="#">BUTTON</a>-->
 +
<center><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=400×350&w=400&h=350"></center>
 +
                  </div> <!-- end class text-center -->
 +
              </div> <!-- end class about-me-text pattern -->
 +
             
 +
            <!-- <div class="about-me-text"> -->
 +
             
 +
              <!-- <ul class="social-icon"> -->
 +
                <!-- <li><a href="#" target="_blank" class="facebook"><i class="icon-social-facebook"></i></a></li> -->
 +
                <!-- <li><a href="#" target="_blank" class="twitter"><i class="icon-social-twitter"></i></a></li> -->
 +
                <!-- <li><a href="#" target="_blank" class="behance"><i class="icon-social-behance"></i></a></li> -->
 +
                <!-- <li><a href="#" target="_blank" class="dribbble"><i class="icon-social-dribbble"></i></a></li> -->
 +
              <!-- </ul> -->
 +
             
 +
              <!-- </div> --> <!-- end class about-me-text -->
 +
              </div> <!-- end class col-md-6 -->
 +
             
 +
            </div> <!-- end class row -->
  
@keyframes type{
+
<!-- MOVED SCOIAL MEDIA ICONS -->
  from { width: 0; }
+
</br><div class="row">
}
+
            <div class="about-me-text">
 +
             
 +
              <ul class="social-icon">
 +
                <li><a href="#" target="_blank" class="facebook"><i class="icon-social-facebook"></i></a></li>
 +
                <li><a href="#" target="_blank" class="twitter"><i class="icon-social-twitter"></i></a></li>
 +
                <li><a href="#" target="_blank" class="behance"><i class="icon-social-behance"></i></a></li>
 +
                <li><a href="#" target="_blank" class="dribbble"><i class="icon-social-dribbble"></i></a></li>
 +
              </ul>
 +
             
 +
              </div> <!-- end class about-me-text -->
 +
</div> <!-- end class row -->
 +
<!-- END OF MOVED SOCIAL MEDIA ICONS -->
  
@keyframes type2{
+
          </div>  <!-- end class container -->
  0%{width: 0;}
+
      </section>
  50%{width: 0;}
+
     
  100%{ width: 100; }
+
<!-- Skills Modal Start -->
}
+
      <div class="modal fade padding-top-70" id="skillmodal" role="dialog">
 +
        <div class="modal-dialog">
 +
   
 +
     
 +
      <div class="modal-content pattern-bg">
 +
        <div class="modal-body">
 +
          <div class="row">
 +
                <div class="col-sm-12">
 +
                    <div class="section-title margin-top-30">
 +
                      <button type="button" class="btn pull-right" data-dismiss="modal"><i class="fa fa-close"></i></button>
 +
                        <h2>My Skills.</h2>
 +
                        <div class="divider dark">
 +
  <i class="icon-energy"></i>
 +
  </div>
 +
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
           
 +
          <div class="row">
 +
          <div class="col-sm-offset-2 col-xs-offset-0 col-md-8 col-sm-8">
 +
         
 +
            <div class="my-skill margin-bottom-50">
 +
                    <strong>Graphic Design</strong>
 +
                      <span class="pull-right">80%</span>
 +
                            <div class="progress">
 +
                                <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 80%;">
 +
                                </div>
 +
                              </div>
  
@keyframes blink{
+
                    <strong>Website Design</strong>
  to{opacity: .0;}
+
                        <span class="pull-right">99%</span>
}
+
                            <div class="progress">
 +
                                  <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="99" aria-valuemin="0" aria-valuemax="100" style="width: 99%;">
 +
                                </div>
 +
                              </div>
  
<!-- map -->
+
                      <strong>HTML5/CSS3</strong>
#map {
+
                        <span class="pull-right">85%</span>
    position: relative;
+
                            <div class="progress">
}
+
                                  <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 85%;">
#overlay {
+
                              </div>
    position: absolute;
+
                          </div>
    background: #000;
+
                         
    color: #fff;
+
                      <strong>Javascript</strong>
    top: 20px;
+
                        <span class="pull-right">90%</span>
     left: 20px;
+
                            <div class="progress">
}
+
                                  <div class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100" style="width: 90%;">
</style>
+
                              </div>
 +
                          </div>
 +
                        </div>
 +
         
 +
                  </div>
 +
              </div>
 +
            </div>
 +
          </div>
 +
        </div>
 +
      </div>
 +
<!-- Skills Modal End -->
 +
     
 +
     
 +
     
 +
<!-- Subscribe Modal Start -->
 +
      <div class="modal fade subscribe padding-top-120" id="subscribemodal" role="dialog">
 +
        <div class="modal-dialog">
 +
      
 +
     
 +
      <div class="modal-content">
 +
        <div class="modal-body">
 +
          <div class="row">
 +
                <div class="col-sm-12">
 +
                    <div class="section-title margin-top-30">
 +
                      <button type="button" class="btn pull-right" data-dismiss="modal"><i class="fa fa-close"></i></button>
 +
                        <h2>Subscribe.</h2>
 +
                        <div class="divider dark">
 +
  <i class="icon-envelope-letter"></i>
 +
  </div>
 +
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
           
 +
          <div class="row">
 +
          <div class="col-sm-offset-2 col-xs-offset-0 col-md-8 col-sm-8">
 +
         
 +
            <div class="margin-bottom-50">
 +
                    <form id="mc-form" method="post" action="http://uipasta.us14.list-manage.com/subscribe/post?u=854825d502cdc101233c08a21&amp;id=86e84d44b7">
 +
 +
  <div class="subscribe-form">
 +
<input id="mc-email" type="email" placeholder="Email Address" class="text-input">
 +
  <button class="submit-btn" type="submit">Submit</button>
 +
</div>
 +
<label for="mc-email" class="mc-label"></label>
 +
  </form>
 +
                          </div>
 +
                        </div>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
          </div>
 +
      </div>
 +
<!-- Subscribe Modal End -->
 +
<!-- About End -->
  
</head>
+
<!-- statistics -->
 +
      <section class="statistics-section section-space-padding bg-cover text-center">
 +
        <div class="container">   
  
<body>
+
            <div class="row">
 +
<center>       
 +
          <div class="col-md-3 col-sm-6 col-xs-6">
 +
            <div class="statistics bg-color-6">
 +
              <div class="statistics-icon"><i class="icon-emotsmile"></i>
 +
              </div>
 +
              <div class="statistics-content">
 +
                <h5> <span data-count="12" class="statistics-count">12</span></h5><span>iGEM Raiders</span>
 +
              </div>
 +
            </div>
 +
          </div>
 +
         
 +
          <div class="col-md-3 col-sm-6 col-xs-6">
 +
            <div class="statistics bg-color-5">
 +
              <div class="statistics-icon"><i class="icon-cup"></i>
 +
              </div>
 +
              <div class="statistics-content">
 +
                <h5><span data-count="4000" class="statistics-count">4000</span></h5><span>Cups of Coffee</span>
 +
              </div>
 +
            </div>
 +
            </div>
  
<!-- Map -->
+
          <div class="col-md-3 col-sm-6 col-xs-6">
<center>
+
            <div class="statistics bg-color-4">
<!--<img id = "home-button" alt = "" src = "https://static.igem.org/mediawiki/2017/8/82/Lubbock_TTU_largemap.png" height= width=  alt="" usemap="#Map"/ width="95%">-->
+
              <div class="statistics-icon"><i class="icon-hourglass"></i>
<body>
+
              </div>
<div id="map">
+
              <div class="statistics-content">
    <div id="overlay"></div>
+
                <h5><span data-count="8000" class="statistics-count">8000</span></h5><span>Hours of Work</span>
    <img src="https://static.igem.org/mediawiki/2017/8/82/Lubbock_TTU_largemap.png" width="95%" height="" alt="" usemap="#map" />
+
              </div>
</div>
+
            </div>
<map name="map">
+
          </div> <!-- end of class row -->
<area shape="circle" coords="428,258,66" alt="" href="https://2017.igem.org/Team:LUBBOCK_TTU/Description" title="Project Overview"/>
+
<area shape="circle" coords="585,100,53" alt="" href="https://2017.igem.org/Team:LUBBOCK_TTU/Part_Collection" title="Part Collection"/>
+
<area shape="circle" coords="605,437,32" alt="" href="" title="Human Practices"/>
+
<area shape="circle" coords="438,405,36" alt="" href="https://2017.igem.org/Team:LUBBOCK_TTU/Description" title="Safety"/>
+
<area shape="circle" coords="258,340,40" alt="" href="https://2017.igem.org/Team:LUBBOCK_TTU/Notebook" title="Notebook"/>
+
<area shape="circle" coords="305,138,36" alt="" href="https://2017.igem.org/Team:LUBBOCK_TTU/Results" title="Results"/>
+
</map>
+
</body>
+
<br></br>
+
<font size="8" color="CC0000">C:\LUBBOCK_TTU\SELECT_PATH?<span>|</span></font>
+
</center>
+
    </div> <!-- end of col-md-14 -->
+
<div class="col-md-2"></div>
+
</div> <!-- end of id map -->
+
  
</body>
+
          <div class="col-md-3 col-sm-6 col-xs-6">
 +
            <div class="statistics bg-color-1">
 +
              <div class="statistics-icon"><i class="icon-mustache"></i>
 +
              </div>
 +
              <div class="statistics-content">
 +
                <h5><span data-count="9999" class="statistics-count">Infinite</span></h5><span>Possibilites</span>
 +
              </div>
 +
            </div>
 +
          </div>
  
<!-- map -->
+
        </div>
<script>
+
      </div>
$('area').each(function(){
+
    </section>
     var area = $(this),
+
<!-- statistics end -->
         alt = area.attr('alt');
+
       
    area.mouseenter(function(){
+
<!-- Services Start -->
        $('#overlay').html(alt);
+
     <section id="services" class="services-section section-space-padding">
    }).mouseleave(function(){
+
         <div class="container">
        $('#overlay').html('');
+
          <div class="row">
    });
+
                <div class="col-sm-12">
});
+
                    <div class="section-title">
</script>
+
                        <h2>Learn More</h2>
 +
                          <div class="divider dark">
 +
  <i class="icon-drop"></i>
 +
</div>
 +
                        <!--<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>-->
 +
                    </div>
 +
                </div>
 +
            </div>
 +
           
 +
            <div class="row margin-top-30">
 +
           
 +
            <div class="col-md-4 col-sm-6">
 +
<a href="https://2017.igem.org/Team:LUBBOCK_TTU/Team">
 +
<div class="services-detail">
 +
<i class="icon-screen-smartphone color-1"></i>
 +
<h3>Team</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
  
</html>
+
<div class="col-md-4 col-sm-6">
 +
<a href="https://2017.igem.org/Team:LUBBOCK_TTU/Description">
 +
<div class="services-detail">
 +
<i class="icon-screen-tablet color-2"></i>
 +
<h3>Project</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
  
<!--{{Team:LUBBOCK_TTU/Javascript}}-->
+
<div class="col-md-4 col-sm-6">
 +
<a href="https://2017.igem.org/Team:LUBBOCK_TTU/Parts">
 +
<div class="services-detail">
 +
<i class="fa fa-code color-3"></i>
 +
<h3>Parts</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
 +
           
 +
            <div class="col-md-4 col-sm-6">
 +
<a href="https://2017.igem.org/Team:LUBBOCK_TTU/Safety">
 +
<div class="services-detail">
 +
<i class="icon-support color-4"></i>
 +
<h3>Safety</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
 +
 
 +
<div class="col-md-4 col-sm-6">
 +
<a href="">
 +
<div class="services-detail">
 +
<i class="fa fa-html5 color-5"></i>
 +
<h3>Human Practices</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
 +
 
 +
<div class="col-md-4 col-sm-6">
 +
<a href="">
 +
<div class="services-detail">
 +
<i class="icon-bulb color-6"></i>
 +
<h3>Awards</h3>
 +
<hr>
 +
</div>
 +
</a>
 +
</div>
 +
           
 +
            </div>
 +
        </div>
 +
    </section>
 +
<!-- Services End -->
 +
           
 +
<!-- Footer Start -->
 +
    <footer class="footer-section">
 +
        <div class="container">
 +
            <div class="row">
 +
             
 +
            <div class="col-md-12">
 +
              <ul class="social-icon margin-bottom-30">
 +
                <li><a href="#" target="_blank" class="facebook"><i class="icon-social-facebook"></i></a></li>
 +
                <li><a href="#" target="_blank" class="twitter"><i class="icon-social-twitter"></i></a></li>
 +
                <li><a href="#" target="_blank" class="google-plus"><i class="icon-social-google"></i></a></li>
 +
                <li><a href="#" target="_blank" class="instagram"><i class="icon-social-instagram"></i></a></li>
 +
                <li><a href="#" target="_blank" class="dribbble"><i class="icon-social-dribbble"></i></a></li>
 +
              </ul>
 +
          </div>
 +
 
 +
<center><font color="black">iGEM Raiders 2017 &copy;</font></center>
 +
             
 +
            <!--<div class="col-md-12 uipasta-credit">-->
 +
                <!--<p><a href="" target="_blank" title="">Texas Tech University</a></p>-->
 +
            <!--</div>-->
 +
               
 +
            </div>
 +
        </div>
 +
    </footer>
 +
<!-- Footer End -->
 +
   
 +
<!-- Back to Top Start -->
 +
    <a href="#" class="scroll-to-top"><i class="icon-arrow-up-circle"></i></a>
 +
<!-- Back to Top End -->
 +
     
 +
</body>
 +
</html>

Revision as of 01:40, 27 May 2017

Lubbock_TTU

About Us

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus feugiat facilisis dignissim. Etiam scelerisque ultricies euismod. Etiam pellentesque enim ac risus dapibus consequat. Nulla euismod lacinia felis, vel Check out my Skills massa accumsan sit amet. Cras id fermentum neque. Curabitur et mollis neque. Fusce eu mattis arcu. Integer eget augue sit amet lorem convallis fermentum, Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus feugiat facilisis dignissim. Etiam scelerisque ultricies euismod. Etiam pellentesque enim ac risus dapibus consequat.



12
iGEM Raiders
4000
Cups of Coffee
8000
Hours of Work
Infinite
Possibilites
iGEM Raiders 2017 ©