|
|
Line 1: |
Line 1: |
− | <html lang="en">
| + | ] |
− | | + | |
− | <head>
| + | |
− | <meta charset="UTF-8">
| + | |
− | <title>TAS_Taipei</title>
| + | |
− | <style>
| + | |
− | | + | |
− | body {
| + | |
− | background-color: white;
| + | |
− | height: 1000vh;
| + | |
− | overflow-x: hidden;
| + | |
− | }
| + | |
− | | + | |
− | .navbar {
| + | |
− | position: fixed;
| + | |
− | z-index: 99999;
| + | |
− | background-color: whitesmoke;
| + | |
− | height: 8vh;
| + | |
− | width: 100vw;
| + | |
− | left: 0;
| + | |
− | top: 2.7vh;
| + | |
− | opacity: 0.8;
| + | |
− | }
| + | |
− | | + | |
− | .navbar:hover {
| + | |
− | opacity: 1;
| + | |
− | }
| + | |
− | | + | |
− | .tas {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | color: black;
| + | |
− | top: 1.8vh;
| + | |
− | left: 2%;
| + | |
− | font-size: 3.5vh;
| + | |
− | font-family: 'Nexa bold', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | padding: 3px 1px;
| + | |
− | }
| + | |
− | | + | |
− | .pro {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 38%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .pro:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .exp {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 45%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .exp:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .mod {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 56%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .mod:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .prot {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 65%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .prot:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .hp {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 74%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .hp:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .as {
| + | |
− | position: absolute;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | top: 11%;
| + | |
− | left: 88%;
| + | |
− | color: black;
| + | |
− | font-family: 'Nexa light', sans-serif;
| + | |
− | font-weight: 100;
| + | |
− | letter-spacing: 1px;
| + | |
− | }
| + | |
− | | + | |
− | .as:hover {
| + | |
− | cursor: pointer;
| + | |
− | color: black;
| + | |
− | text-decoration: underline;
| + | |
− | }
| + | |
− | | + | |
− | .jumbo {
| + | |
− | position: relative;
| + | |
− | width: 100vw;
| + | |
− | height: 100vh;
| + | |
− | top: -15vh;
| + | |
− | left: -4vw;
| + | |
− | background-image: url("https://static.igem.org/mediawiki/2018/4/48/T--TAS_Taipei--iGEM-11-min.jpg");
| + | |
− | background-repeat: no-repeat;
| + | |
− | background-position: top;
| + | |
− | background-size: 100%;
| + | |
− | z-index: 9999;
| + | |
− | }
| + | |
− | | + | |
− | .meet {
| + | |
− | color: white;
| + | |
− | font-size: 13vh;
| + | |
− | text-align: center;
| + | |
− | position: relative;
| + | |
− | line-height: 20vh;
| + | |
− | font-weight: normal !important;
| + | |
− | top: 32%;
| + | |
− | left: -4%;
| + | |
− | text-shadow: 0px 10px 30px black;
| + | |
− | }
| + | |
− | | + | |
− | .fixed {
| + | |
− | position: fixed;
| + | |
− | z-index: 998;
| + | |
− | color: black;
| + | |
− | top: 0;
| + | |
− | }
| + | |
− |
| + | |
− | .paddingremoval {
| + | |
− | padding-left: 0;
| + | |
− | padding-right: 0;
| + | |
− | }
| + | |
− | | + | |
− | .sidenavback {
| + | |
− | position: fixed;
| + | |
− | top: 8vh;
| + | |
− | left: 0;
| + | |
− | height: 92vh;
| + | |
− | width: 16.46vw !important;
| + | |
− | background-color: white;
| + | |
− | }
| + | |
− | | + | |
− | .sidenavback:hover {
| + | |
− | background-color: azure;
| + | |
− | }
| + | |
− | | + | |
− | .qo {
| + | |
− | position: fixed;
| + | |
− | top: 11vh;
| + | |
− | height: 7vh;
| + | |
− | width: 16.46vw;
| + | |
− | }
| + | |
− | | + | |
− | .qo:hover {
| + | |
− | background-color: aquamarine;
| + | |
− | }
| + | |
− | | + | |
− | .me {
| + | |
− | position: fixed;
| + | |
− | top: 18vh;
| + | |
− | height: 7vh;
| + | |
− | width: 16.46vw;
| + | |
− | }
| + | |
− | | + | |
− | .me:hover {
| + | |
− | background-color: aqua;
| + | |
− | }
| + | |
− | | + | |
− | .snfont {
| + | |
− | position: fixed;
| + | |
− | z-index: 999;
| + | |
− | font-size: 3vh;
| + | |
− | font-weight: normal;
| + | |
− | color: black !important;
| + | |
− | left: 1%;
| + | |
− | vertical-align: middle;
| + | |
− | }
| + | |
− | | + | |
− | .yellowrow {
| + | |
− | position: relative;
| + | |
− | background-color: #fcc319;
| + | |
− | z-index: 100;
| + | |
− | color: white;
| + | |
− | left: 13.7vw;
| + | |
− | width: 82.3vw;
| + | |
− | top: -15vh;
| + | |
− | font-weight: 100 !important;
| + | |
− | }
| + | |
− | | + | |
− | .quicko {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | color: white;
| + | |
− | left: 5%;
| + | |
− | font-weight: 100 !important;
| + | |
− | font-size: 6vh;
| + | |
− | }
| + | |
− | | + | |
− | .bullet1, .bullet2, .bullet3 {
| + | |
− | position: relative;
| + | |
− | color: white;
| + | |
− | left: 8%;
| + | |
− | }
| + | |
− | | + | |
− | .members {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | color: black;
| + | |
− | left: 25%;
| + | |
− | top: -8.5vh;
| + | |
− | font-size: 6vh;
| + | |
− | font-weight: 100 !important;
| + | |
− | }
| + | |
− | | + | |
− | .m1 {
| + | |
− | z-index: 100;
| + | |
− | border-radius: 50%;
| + | |
− | height: 27vh;
| + | |
− | left: 26vw;
| + | |
− | position: relative;
| + | |
− | padding: 1.9vh;
| + | |
− | top: -10vh;
| + | |
− | }
| + | |
− | | + | |
− | .namesrow1 {
| + | |
− | position: relative;
| + | |
− | z-index: 100;
| + | |
− | border-radius: 50%;
| + | |
− | text-align: center;
| + | |
− | font-size: 3vh;
| + | |
− | }
| + | |
− | | + | |
− | .c1 {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | font-weight: 100;
| + | |
− | font-size: 3.5vh;
| + | |
− | line-height: 3.8vh;
| + | |
− | left: -4vw;
| + | |
− | top: -12vh;
| + | |
− | }
| + | |
− | | + | |
− | .c2 {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | font-weight: 100;
| + | |
− | font-size: 3.5vh;
| + | |
− | line-height: 3.8vh;
| + | |
− | left: 10.9vw;
| + | |
− | top: -21.3vh;
| + | |
− | }
| + | |
− | | + | |
− | .c3 {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | font-weight: 100;
| + | |
− | font-size: 3.5vh;
| + | |
− | line-height: 3.8vh;
| + | |
− | left: 25.9vw;
| + | |
− | top: -30.9vh;
| + | |
− | }
| + | |
− | | + | |
− | .c4 {
| + | |
− | position: relative;
| + | |
− | z-index: 999;
| + | |
− | font-weight: 100;
| + | |
− | font-size: 3.5vh;
| + | |
− | line-height: 3.8vh;
| + | |
− | left: 39.7vw;
| + | |
− | top: -40.9vh;
| + | |
− | }
| + | |
− | | + | |
− | </style>
| + | |
− | </head>
| + | |
− | | + | |
− | <body>
| + | |
− | <div class="navbar">
| + | |
− | <h4 class="tas">TAS_Taipei</h4>
| + | |
− | <h4 class="pro">Project</h4>
| + | |
− | <h4 class="exp">Experiments</h4>
| + | |
− | <h4 class="mod">Modelling</h4>
| + | |
− | <h4 class="prot">Prototype</h4>
| + | |
− | <h4 class="hp">Human Practices</h4>
| + | |
− | <h4 class="as">About Us</h4>
| + | |
− | </div>
| + | |
− | | + | |
− | <div class="row">
| + | |
− | <div class="jumbo col-lg-12">
| + | |
− | <h1 class="meet">Meet the Team</h1>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− |
| + | |
− | <div class="col-lg-10 col-lg-offset-2 paddingremoval">
| + | |
− | <div class="row yellowrow col-lg-12" id="quickoverview">
| + | |
− | <br>
| + | |
− | <h1 class="quicko col-lg-offset-1">Quick Overview</h1><br>
| + | |
− | <ul>
| + | |
− | <p class="bullet1 col-lg-offset-1">• We are Taiwan's first high school
| + | |
− | team.</p><br>
| + | |
− | <p class="bullet2 col-lg-offset-1">• We have 27 dedicated members, 11
| + | |
− | of whom are attending the Jamboree.</p><br>
| + | |
− | <p class="bullet3 col-lg-offset-1">• We have participated in the iGEM
| + | |
− | competition since 2013.</p><br>
| + | |
− | </ul>
| + | |
− | <br>
| + | |
− | </div>
| + | |
− | | + | |
− | <div class="row sidenavback">
| + | |
− | <div class="col-lg-2 fixed paddingremoval qo">
| + | |
− | <h1><a href="#quickoverview" class="snfont">Quick Overview</a></h1>
| + | |
− | </div>
| + | |
− | <div class="col-lg-2 fixed paddingremoval me">
| + | |
− | <h1><a href="#members" class="snfont">Members</a></h1>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | | + | |
− | <div class="row" id="members">
| + | |
− | <h1 class="col-lg-6 col-lg-offset-1 members"><br>Members</h1>
| + | |
− | </div>
| + | |
− | | + | |
− | <div class="row">
| + | |
− | <br>
| + | |
− | <img class="m1 col-lg-2 col-lg-offset-2" src="https://static.igem.org/mediawiki/2018/b/b9/T--TAS_Taipei--Aire.jpg"
| + | |
− | alt="">
| + | |
− | <img class="m1 col-lg-2" src="https://static.igem.org/mediawiki/2018/6/68/T--TAS_Taipei--Austin.jpg.jpg" alt="">
| + | |
− | <img class="m1 col-lg-2" src="https://static.igem.org/mediawiki/2018/f/f6/T--TAS_Taipei--Ben.jpg" alt="">
| + | |
− | <img class="m1 col-lg-2" src="https://static.igem.org/mediawiki/2018/7/7e/T--TAS_Taipei--Caroline.jpg" alt="">
| + | |
− | </div>
| + | |
− |
| + | |
− | <div class="row">
| + | |
− | <h6 class="namesrow1 col-lg-2 col-lg-offset-2 c1">Aire Wu <br> HP</h6>
| + | |
− | <h6 class="namesrow1 col-lg-2 c2">Austin Huang <br> HP</h6>
| + | |
− | <h6 class="namesrow1 col-lg-2 c3">Benjamin Wei <br> HP</h6>
| + | |
− | <h6 class="namesrow1 col-lg-2 c4">Caroline Chou<br> Wiki, HP</h6>
| + | |
− | </div>
| + | |
− | </body>
| + | |
− | | + | |
− | </html>
| + | |