Team:ITESM-Guadalajara/Contact

From 2014.igem.org

(Difference between revisions)
(Blanked the page)
Line 1: Line 1:
 +
{{CSS/Main}}
 +
<html>
 +
 +
<head>
 +
 +
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 +
  <meta name="description" content="Team ITESM - Guadalajara Wiki for the iGEM competition of 2014">
 +
  <meta name="keywords" content="iGEM, Chitosan, 2014, ITESM Guadalajara, Wiki">
 +
  <meta name="author" content="Irving Fernando Alvarez Vazquez">
 +
  <meta name="title" content="Team ITESM - Guadalajara Wiki">
 +
 +
  <!-- External scripts -->
 +
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600'
 +
rel='stylesheet' type='text/css'>
 +
  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
 +
  <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'>
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
 +
 +
  <!-- Functionallity and behaviour JS -->
 +
  <script>
 +
 +
    $(document).ready(function(){
 +
 +
      //Loading screen functionallity
 +
      $('.loading').animate(
 +
          {opacity:0},
 +
          500,
 +
          function(){
 +
            $('.loading').attr("style", "display:none");
 +
          }
 +
      );
 +
 +
      //Height responsiveness
 +
      $(window).resize(function() {
 +
          wheight = $(window).height();
 +
          $('.container').attr("style","height:"+(wheight)+"px;background-size:cover;");
 +
          $('.team-member-container').attr("style","height:"+wheight/2.7+"px;");
 +
      });
 +
 +
      $(window).trigger('resize');
 +
 +
      //Menu moveto container on item click functionallity
 +
      $('.menu-item').on('click', function(){
 +
          $('.menu-item').removeClass('subselected');
 +
          $(this).addClass('subselected');
 +
          if($(this).attr("data")=="#top"){
 +
              $('html, body').animate({
 +
                  scrollTop: 0
 +
              }, 1000);
 +
          }else{
 +
              $('html, body').animate({
 +
                  scrollTop: $($(this).attr("data")).offset().top-70
 +
              }, 1000);
 +
          }
 +
      });
 +
 +
      //Hover of team members
 +
      $('.team-member-container').on('mouseenter', function(){
 +
        $(this).children('.team-member-photo').attr("style", "background-image:url('"+$(this).attr("hover")+"');");
 +
        $(this).on('mouseleave', function(){
 +
          $(this).children('.team-member-photo').attr('style', "background-image:url('"+$(this).attr("data")+"');");
 +
        });
 +
      });
 +
 +
    });
 +
   
 +
  </script>
 +
 +
  <style>
 +
    body,
 +
    html{
 +
      margin: 0;
 +
      padding:0;
 +
      font-family: font-family: 'Yanone Kaffeesatz', sans-serif;
 +
    }
 +
 +
    /* REMOVE UNWANTED ELEMENTS AND STYLE OTHERS */
 +
    .firstHeading{
 +
      display:none;
 +
    }
 +
    #top-section{
 +
      background:#48af5d;
 +
      margin-left:0 !important;
 +
      width:100%;
 +
      left:0;
 +
    }
 +
 +
 +
    /* LOADING SCREEN */
 +
    .loading{
 +
      position:fixed;
 +
      width:100%;
 +
      height:100%;
 +
      top:0;
 +
      left:0;
 +
 +
      z-index:5;
 +
 +
      background-color:#555;
 +
      color:#fff;
 +
      text-align: center;
 +
    }
 +
    .loading p{
 +
      position: relative;
 +
      width:100%;
 +
      height:10%;
 +
      top:45%;
 +
      left:0;
 +
    }
 +
 +
    /* MENU STYLING */
 +
    .menu{
 +
      position:fixed;
 +
      width:100%;
 +
      height:56px;
 +
      top:14px;
 +
      background-color: #47a3da;
 +
 +
      z-index:4;
 +
 +
      border-collapse: collapse;
 +
      text-align:center;
 +
    }
 +
    .menu tr td{
 +
      text-align: center;
 +
      vertical-align: middle;
 +
 +
      font-weight: 700;
 +
      font-size:16px;
 +
      color:#fff;
 +
      width:7%;
 +
    }
 +
    .menu tr td.menu-item:hover{
 +
      background-color:#258ecd;
 +
      cursor: pointer;
 +
    }
 +
    .subselected{
 +
      background-color: #258ecd;
 +
    }
 +
 +
    /* CONTAINERS STYLING */
 +
    .container{
 +
      position:relative;
 +
      width:100%;
 +
      top:50px;
 +
    }
 +
    .container .subcontainer{
 +
      position:absolute;
 +
      width:95%;
 +
      height:90%;
 +
      top:5%;
 +
      left:2.5%;
 +
    }
 +
    #top{
 +
      background-size: cover;
 +
      background-image: url("http://i1191.photobucket.com/albums/z475/alex0892/Guadalajara%20Minerva/171120111899.jpg");
 +
      overflow:hidden;
 +
    }
 +
 +
    /* TEAM MEMBERS CARDS STYLING */
 +
    .team-member-container{
 +
      position:relative;
 +
      width:14%;
 +
      margin-left:2.28%;
 +
 +
      float:left;
 +
    }
 +
    .team-member-container:hover{
 +
      cursor:pointer;
 +
    }
 +
    .row2{
 +
      top:4%;
 +
    }
 +
    .team-member-container .team-member-photo{
 +
      position:relative;
 +
      width:100%;
 +
      height:85%;
 +
      top:0;
 +
      left:0;
 +
      background-size: cover;
 +
    }
 +
    .team-member-container .team-member-footer{
 +
      position:relative;
 +
      width:100%;
 +
      height:15%;
 +
      top:0;
 +
      left:0;
 +
 +
      border:none;
 +
      border-collapse: collapse;
 +
      background-color: #47a3da;
 +
      color:#fff;
 +
 +
      text-align: center;
 +
      vertical-align: middle;
 +
    }
 +
 +
body {
 +
    padding-top: 110px;
 +
}
 +
 +
.center-block {
 +
  display: block;
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
}
 +
 +
 +
.navbar-fixed-top {
 +
background: #fff;
 +
filter: none !important;
 +
box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 +
-moz-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 +
-webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.25);
 +
        border-bottom: 1px solid rgba(0,0,0,0.2);
 +
 +
}
 +
 +
.faceBot{
 +
  background: black;
 +
}
 +
 +
@font-face {
 +
  font-family: 'Open Sans', Arial;;
 +
}
 +
 +
body
 +
{
 +
    font-family: 'Open Sans', Arial;
 +
}
 +
ul.nav a{
 +
  color: gray;
 +
  background-color: transparent;
 +
  height: 100%;
 +
  position: relative;
 +
}
 +
ul.nav a:hover {
 +
background-color: transparent;}
 +
 +
h2 {
 +
  color:green;
 +
}
 +
 +
h4 {
 +
    font-weight: bold;
 +
}
 +
 +
.menu-item{
 +
  height: 75px;
 +
}
 +
 +
.green-effect{
 +
  display: none;
 +
  background-color: #4AAF51;
 +
  opacity: 1;
 +
  color: #FFF;
 +
  transition-property: all;
 +
  transition-duration: 0.3s;
 +
  transition-timing-function: ease-out;
 +
  transition-delay: 0s;
 +
  border-color: #288D30;
 +
  position: absolute;
 +
  bottom: 0px;
 +
  width: 100%;
 +
  height: 2px;
 +
  right: 0px;
 +
}
 +
 +
a:hover .green-effect{
 +
  display: inherit;
 +
}
 +
 +
 +
  </style>
 +
 +
 +
 +
</head>
 +
 +
<body>
 +
 +
 +
<div class="navbar navbar-fixed-top" style="margin-top:10px">
 +
  <nav class="navbar-inner">
 +
  <div class="row">
 +
  <div class="col-md-2"></div>
 +
  <div class="col-md-3"<a><img class="inicioLogo" src="https://static.igem.org/mediawiki/2014/5/55/BioPhrameIgem_logo.png" height="100"  width="auto" ></a></div>
 +
  <div class="col-md-1"></div>
 +
 +
      <div class="col-md-6" >
 +
      <ul class="nav navbar-nav" style="margin-top:30px">
 +
        <li class="menu-item">
 +
          <a href="https://2014.igem.org/Team:ITESM-Guadalajara">
 +
            <span>Home</span>
 +
            <span class="green-effect"></span>
 +
          </a>
 +
        </li>
 +
        <li class="menu-item">
 +
          <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Company">
 +
            <span>The Company</span>
 +
            <span class="green-effect"></span>
 +
          </a>
 +
        </li>
 +
        <li class="menu-item">
 +
          <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Team">
 +
            <span>Team</span>
 +
            <span class="green-effect"></span>
 +
          </a>
 +
        </li>
 +
        <li class="menu-item">
 +
          <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Contact">
 +
            <span>Contact</span>
 +
            <span class="green-effect"></span>
 +
          </a>
 +
        </li>
 +
        <li class="menu-item">
 +
          <a href="https://2014.igem.org/Main_Page">
 +
            <span>iGEM 2014</span>
 +
            <span class="green-effect"></span>
 +
          </a>
 +
        </li>
 +
      </ul>
 +
</div>
 +
  </nav>
 +
</div>
 +
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><div style="overflow:hidden;height:400px;width:1900px;"><div id="gmap_canvas" style="height:400px;width:1900px;"></div><style>#gmap_canvas img{max-width:none!important;background:none!important}</style><a class="google-map-code" href="http://www.trivoo.net/gutscheine/fleurop/" id="get-map-data">trivoo</a></div><script type="text/javascript"> function init_map(){var myOptions = {zoom:14,center:new google.maps.LatLng(20.7341591,-103.46660380000003),mapTypeId: google.maps.MapTypeId.TERRAIN};map = new google.maps.Map(document.getElementById("gmap_canvas"), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(20.7341591, -103.46660380000003)});infowindow = new google.maps.InfoWindow({content:"<b>BIOPHRAME TECHNOLOGIES</b><br/>General Ramon Corona 2514<br/> Zapopan" });google.maps.event.addListener(marker, "click", function(){infowindow.open(map,marker);});}google.maps.event.addDomListener(window, 'load', init_map);</script>
 +
 +
 +
</body>
 +
</html>

Revision as of 21:07, 15 October 2014

trivoo