Difference between revisions of "Team:UCSC"

 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
{{UCSC-Header}}
 +
 
<html>
 
<html>
  
−
<link href="https://fonts.googleapis.com/css?family=Abel|Open+Sans" rel="stylesheet">
+
<style>
−
<link href="https://fonts.googleapis.com/css?family=objektiv-mk1" rel="stylesheet">
+
−
<script src="https://use.fontawesome.com/a87d4c895f.js"></script>  
+
  
−
<script src="https://use.typekit.net/hii0ztv.js"></script>
+
h1 {
−
   <script>try{Typekit.load({ async: true });}catch(e){}</script>
+
  font-family: 'objektiv-mk1'!important;
 +
  font-size: 300%; /*!important*/
 +
   font-weight: 300 !important;
 +
    width: 80%;
 +
}
  
−
<style type="text/css">
+
h2 {
−
+
  font-family: 'objektiv-mk1' !important;
−
footer {
+
  font-size: 200%;
−
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(240,255,240,1)), color-stop(100%, rgba(216,214,255,1)));
+
  font-weight: 300;
−
/*opacity: 0.7;*/
+
}
−
padding-top: 40px !important;
+
−
padding-left: 80px;
+
−
padding-right: 80px;
+
−
padding-bottom: 20px;
+
−
margin-top: inherit;
+
−
}
+
  
−
/* footer a {
 
−
display: block;
 
−
}*/
 
  
−
.sponsors {
+
.proj-button {
−
width: 140px;
+
    position: relative;
−
padding: 5px;
+
    width: 10%;
−
text-decoration: none !important;
+
    text-decoration: none !important;
−
}
+
}
  
−
.sponsors-single {
+
.proj-button-image {
−
width: 110px;
+
  opacity: 1;
−
padding: 5px;
+
  display: inline-block;
−
text-decoration: none !important;
+
  width: 14%;
−
}
+
  height: auto;
 +
  transition: .5s ease;
 +
  backface-visibility: hidden;
 +
  margin: 20px;
 +
}
  
−
.footer-section-title {
+
.proj-button-desc {
−
font-family: 'objektiv-mk1';
+
  transition: .5s ease;
−
font-size: 125%;
+
  opacity: 0;
−
}
+
  position: absolute;
 +
  top: 100%;
 +
  left: 50%;
 +
  background: transparent;
 +
  transform: translate(-50%, -50%);
 +
  -ms-transform: translate(-50%, -50%)
 +
}
  
−
.address-of-our-team {
+
.proj-button:hover .proj-button-image {
−
font-family: 'objektiv-mk1';
+
  opacity: 0.2;
−
font-size: 90%;
+
}
−
}
+
  
−
a[href ^="mailto:"] {
+
.proj-button:hover .proj-button-desc {
−
padding: 0px !important;
+
  opacity: 0.8;
−
}
+
}
  
−
.add-a-little-space-hehe {
+
.overlap-button-text {
−
margin-bottom: 20px;
+
  background-color: transparent;
−
}
+
  color: black;
 +
  font-size: 20px;
 +
  font-family: "Objektiv-mk1" !important;
 +
  font-weight: 400 !important;
 +
  padding: 16px 32px;
 +
}
  
−
.footer-box {
+
.desktop-frontpage {
−
width: 100%;
+
display: block;
−
overflow-y: auto;
+
user-drag: none;
 +
user-select: none;
 +
-moz-user-select: none;
 +
-webkit-user-drag: none;
 +
-webkit-user-select: none;
 +
-ms-user-select: none;
 +
        background: honeydew;
 +
        width: 80%;
 +
        padding: 40px 0px;
 
}
 
}
  
−
.horizontal-line {
+
.mobile-frontpage {
−
height: 1px;
+
display: none;
−
width: 100%;
+
−
color: black;
+
−
}
+
−
 
+
−
hr {
+
−
border-color: #999;
+
 
}
 
}
  
 
@media (max-width: 768px) {
 
@media (max-width: 768px) {
−
.sponsors {
 
−
width: 80px;
 
−
}
 
  
−
.sponsors-single {
+
  h1 {
−
width: 100px;
+
      font-family: 'objektiv-mk1'; /*!important*/
−
}
+
      font-size: 250%; /*!important*/
 +
  }
 +
 
 +
  h2 {
 +
      font-family: 'objektiv-mk1'; /*!important*/
 +
      font-size: 20px; /*!important*/
 +
  }
  
−
.footer-section-title {
+
.overlap-button-text {
−
font-size: 100%;
+
background-color: rgba(94, 94, 94, 0.5);
 +
border-radius: 60px;
 +
color: white;
 
}
 
}
  
−
.address-of-our-team {
+
.proj-button-image {
−
font-size: 70%;
+
opacity: 0.7;
 +
      display: inline-block;
 +
      width: 30%;
 +
      height: auto;
 +
      transition: .5s ease;
 +
      backface-visibility: hidden;
 
}
 
}
  
−
.add-a-little-space-hehe {
+
.desktop-frontpage {
−
margin-bottom: 10px;
+
width: 95%;
 
}
 
}
 +
 +
    .proj-button-desc {
 +
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 100%;
 +
      left: 50%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 
}
 
}
  
−
@media (max-width: 420px) {
+
@media (max-width: 576px) {
−
.sponsors {
+
−
width: 70px;
+
−
}
+
  
−
.sponsors-single {
+
.proj-button-image {
−
width: 55px;
+
      opacity: 0.7;
−
}
+
      display: inline-block;
 +
      width: 38%;
 +
      height: auto;
 +
      transition: .5s ease;
 +
      backface-visibility: hidden;
 +
    }
  
−
.footer-section-title {
+
    .proj-button-desc {
−
font-size: 90%;
+
      transition: .5s ease;
 +
      opacity: 1;
 +
      position: absolute;
 +
      top: 100%;
 +
      left: 50%;
 +
      transform: translate(-50%, -50%);
 +
      -ms-transform: translate(-50%, -50%)
 +
  }
 +
 
 +
.desktop-frontpage {
 +
display: none;
 
}
 
}
  
−
.address-of-our-team {
+
.mobile-frontpage {
−
font-size: 60%;
+
display: block;
 +
user-drag: none;
 +
user-select: none;
 +
-moz-user-select: none;
 +
-webkit-user-drag: none;
 +
-webkit-user-select: none;
 +
-ms-user-select: none;
 +
        background: honeydew;
 +
        width: 96%;
 +
        padding-top: 5px;
 
}
 
}
  
−
.add-a-little-space-hehe {
+
.overlap-button-text {
−
margin-bottom: 8px;
+
background-color: rgba(94, 94, 94, 0.5);
 +
border-radius: 60px;
 +
color: white;
 +
font-size: 13px;
 
}
 
}
 
}
 
}
  
 
</style>
 
</style>
 +
  <head>
 +
      <meta name="UCSC IGEM" content="The legendary, UCSC igem Science Superheros">
 +
        <title>Santa Cruz IGEM</title>
 +
  </head>
  
−
<footer>
+
<div class="page">
 +
<center>
 +
<div class="desktop-frontpage">
 +
<img src="https://static.igem.org/mediawiki/2017/e/e6/UCSC-Frontpage.png" style="width: 100%;">
 +
</div>
 +
<center>
  
−
<div class="footer-box">
+
<div class="mobile-frontpage">
−
<div class="col-md-5" style="padding-bottom: 40px;">
+
<img src="https://static.igem.org/mediawiki/2017/d/dd/UCSC-Frontpage_Mobile.png" style="width: 100%;">
−
<center>
+
</div>
−
<div class="footer-section-title">S P O N S O R S</div>
+
−
<hr>
+
−
<div class="row">
+
−
<a href="https://us.vwr.com/store/" style="text-decoration: none !important;">
+
−
              <img src="https://static.igem.org/mediawiki/2017/0/03/Vwr.png" class="sponsors">
+
−
            </a>
+
−
+
−
            <a href="http://www.snapgene.com/" style="text-decoration: none !important;">
+
−
              <img class="sponsors" src="https://static.igem.org/mediawiki/2017/b/bd/UCSC--snapGene.png">
+
−
            </a>
+
−
            </div>
+
−
            <div class="row">
+
−
            <a href="https://www.geneious.com/" style="text-decoration: none !important;">
+
−
              <img class="sponsors" src="https://static.igem.org/mediawiki/2017/d/d7/GeneiousLogo.png">
+
−
            </a>
+
−
+
−
            <a href="https://www.zymoresearch.com/" style="text-decoration: none !important;">
+
−
              <img class="sponsors" src="https://static.igem.org/mediawiki/2017/1/17/Zymo.png">
+
−
            </a>
+
−
            </div>
+
−
            <div class="row">
+
−
            <a href="https://www.neb.com/" style="text-decoration: none !important;">
+
−
              <img class="sponsors" src="https://static.igem.org/mediawiki/2017/0/06/NEBlogo2.png">
+
−
            </a>
+
−
+
−
            <a href="https://www.idtdna.com/site" style="text-decoration: none !important;">
+
−
              <img class="sponsors" src="https://static.igem.org/mediawiki/2017/9/9e/IDTlogo.png">
+
−
            </a>
+
−
            </div>
+
−
            <div class="row">
+
−
            <a href="https://www.oracle.com/index.html" style="text-decoration: none !important;">
+
−
            <img class="sponsors" src="https://static.igem.org/mediawiki/2017/2/24/Oracle_logo_sponsor.png">
+
−
            </a>
+
  
−
            <a href="http://www.cacustom.com/" style="text-decoration: none !important;">
+
<br>
−
            <img class="sponsors" src="https://static.igem.org/mediawiki/2017/e/ea/Ca_custom_logo_sponsor.png">
+
<h2>Click on an icon below to learn more about our project!</h2>
−
            </a>
+
<br>
−
            </div>
+
−
            <div class="row">
+
−
            <a href="https://www.adorableflowers.com/">
+
−
            <img class="sponsors" src="https://static.igem.org/mediawiki/2017/1/14/Adorable_logooooooo222.png">
+
−
            </a>
+
−
        </center>
+
−
        </div>
+
  
−
        <div class="col-md-2" style="padding-bottom: 40px;">
+
<div class="row">
−
        <center>
+
  <!-- <a href="https://2017.igem.org/Team:UCSC/Team" class="proj-button">
−
        <div class="footer-section-title">S O C I A L </div>
+
      <img src="https://static.igem.org/mediawiki/2017/d/dd/Team-icon.png" class="proj-button-image">
−
        <hr>
+
      <div class="proj-button-desc">
−
        <a href="https://www.facebook.com/ucscigem/" style="text-decoration: none !important;">
+
        <div class="overlap-button-text">TEAM</div>
−
        <i class="fa fa-facebook-official fa-2x"></i>
+
      </div>
−
        </a>
+
  </a>
−
    <a href="https://www.instagram.com/igem_ucsc/" style="text-decoration: none !important;">
+
-->
−
    <i class="fa fa-instagram fa-2x"></i>
+
  <a href="https://2017.igem.org/Team:UCSC/Project" class="proj-button">
−
    </a>
+
      <img src="https://static.igem.org/mediawiki/2017/6/64/UCSCproject.png" class="proj-button-image" alt="image sources from http://simpleicon.com/dev/light-bulb-10.html">
−
    </center>  
+
      <div class="proj-button-desc">
−
         </div>
+
        <div class="overlap-button-text">OUR PROJECT</div>
 +
      </div>
 +
  </a>
 +
 
 +
  <a href="https://2017.igem.org/Team:UCSC/Human_Practices" class="proj-button">
 +
      <img src="https://static.igem.org/mediawiki/2017/7/72/Hp-icon.png" class="proj-button-image" alt="http://www.clker.com/clipart-398063.html">
 +
      <div class="proj-button-desc">
 +
        <div class="overlap-button-text">HUMAN PRACTICES</div>
 +
      </div>
 +
  </a>
 +
 
 +
  <a href="https://2017.igem.org/Team:UCSC/Attributions" class="proj-button">
 +
      <img src="https://static.igem.org/mediawiki/2017/7/77/Attributionsicon.png" class="proj-button-image" alt="http://clipartix.com/hands-clip-art-image-38330/">
 +
      <div class="proj-button-desc">
 +
        <div class="overlap-button-text">ATTRIBUTIONS</div>
 +
      </div>
 +
  </a>
 +
 
 +
  <a href="https://2017.igem.org/Team:UCSC/Notebook" class="proj-button">
 +
      <img src="https://static.igem.org/mediawiki/2017/c/cc/Labnotebook.png" class="proj-button-image">
 +
      <div class="proj-button-desc">
 +
        <div class="overlap-button-text">NOTEBOOK</div>
 +
      </div>
 +
  </a>
 +
 
 +
  <a href="https://2017.igem.org/Team:UCSC/Judging" class="proj-button">
 +
      <img src="https://static.igem.org/mediawiki/2017/1/1e/Medals_Transparent.png" class="proj-button-image">
 +
      <div class="proj-button-desc">
 +
         <div class="overlap-button-text">JUDGING</div>
 +
      </div>
 +
  </a>
 +
 
 +
</div>
  
−
        <div class="col-md-4" style="padding-bottom: 40px;">
 
−
        <center>
 
−
        <div class="footer-section-title">C O N T A C T</div>
 
−
        <hr>
 
−
        <a href="mailto: ucscigem2017@gmail.com" style="text-decoration: none !important;">
 
−
        <i class="fa fa-envelope-open-o fa-2x add-a-little-space-hehe"></i>
 
−
        </a>
 
−
        <div class="address-of-our-team"><span>Jack Baskin School of Engineering<br>
 
−
    University of California, Santa Cruz<br>
 
−
    1156 High Street<br>
 
−
    Santa Cruz, California, 95064</span></div>
 
−
    </center>
 
−
        </div>
 
−
    </div>
 
−
</footer>
 
 
</html>
 
</html>
 +
 +
{{UCSC-Footer}}

Latest revision as of 04:26, 1 November 2017

Santa Cruz IGEM


Click on an icon below to learn more about our project!


image sources from http://simpleicon.com/dev/light-bulb-10.html
OUR PROJECT
 http://www.clker.com/clipart-398063.html
HUMAN PRACTICES
 http://clipartix.com/hands-clip-art-image-38330/
ATTRIBUTIONS
NOTEBOOK
JUDGING

S P O N S O R S
S O C I A L
C O N T A C T
Jack Baskin School of Engineering
University of California, Santa Cruz
1156 High Street
Santa Cruz, California, 95064