Team:Hong Kong HKUST

From 2014.igem.org

(Difference between revisions)
 
(57 intermediate revisions not shown)
Line 1: Line 1:
-
body {
+
{{Team:Hong_Kong_HKUST/shell|
-
width: 100%;
+
<html><head>
-
padding:0;
+
-
margin:0;
+
-
font: 14px Helvetica;
+
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
-
}
+
-
html, body, .wrapper {
+
-
    background-color: #fcebe6;
+
-
}
+
-
#content_container {
+
-
width:950px;
+
-
margin: 0 auto;
+
-
-webkit-box-shadow: 0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
-moz-box-shadow:    0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
box-shadow:        0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
}
+
-
a {
+
-
color: #c0392b;
+
-
text-decoration: none;
+
-
}
+
-
a:hover {
+
-
color: #e74c3c;
+
-
}
+
-
#menu {
+
-
padding: 0;
+
-
text-align: center;
+
-
text-transform:uppercase;
+
-
}
+
-
h1 {
+
<script>
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
var on = true;
-
font-size: 100px;
+
var myVar = setInterval(function(){ if(on) {slides()}on=true;},9000);
-
text-align: center;
+
-
margin: 0 0 0 0;
+
-
padding: 50px 0 0 0 ;
+
-
color: #fff;
+
-
font-weight:100;
+
-
letter-spacing: 0.0625em;
+
-
}
+
-
/*The access-menu start*/
+
function slides(i) {
-
/* ============================================================================ */
+
document.getElementsByClassName("slide_pic")[1].style.width="0px";
-
nav {
+
document.getElementsByClassName("slide_pic")[2].style.width="100%";
-
    background-color: #ff9900;
+
var slide = document.getElementsByClassName("slide_pic")[0];
-
}
+
document.getElementById("slide").appendChild(slide);
-
nav ul{
+
if(i) {
-
list-style: none;
+
on = false;
-
margin: 0;
+
}
-
padding: 0;
+
}
-
white-space: nowrap;
+
function back_slide(i) {
-
}
+
document.getElementsByClassName("slide_pic")[1].style.width="0px";
-
.access-menu{
+
document.getElementsByClassName("slide_pic")[0].style.width="100%";
-
display: table;
+
var slide = document.getElementsByClassName("slide_pic")[3];
-
margin: 1em auto;
+
var slide2 = document.getElementsByClassName("slide_pic")[0];
 +
document.getElementById("slide").insertBefore(slide,slide2);
 +
if(i) {
 +
on = false;
 +
}
 +
}
 +
</script>
 +
 +
<style type="text/css">
 +
.slide_pic > img {
 +
width: 100%;
 +
}
 +
#slide{
 +
width:70%;
 +
height:390px;
 +
margin-top: 20px;
 +
}
 +
button.prev, button.next {
 +
margin-top: 21px;
 +
}
 +
button.next {
 +
margin-left: 626px;
 +
}
 +
</style>
-
}
+
</head></html>
 +
|
 +
<html><body>
 +
<div id="content_container">
 +
<section id="slide">
 +
<button onclick="back_slide(true)" class="prev">&#171;</button>
 +
<button onclick="slides(true)" class="next">&#187;</button>
 +
<div class="slide_pic">
 +
<img src="https://static.igem.org/mediawiki/2014/d/d9/HKUST_MainPage_Slideshow4.png"/>
 +
</div>
 +
<div class="slide_pic" style="width: 100%;">
 +
<img class="picture" src="https://static.igem.org/mediawiki/2014/1/18/HKUST_MainPage_Slideshow1.png"/>
 +
</div>
 +
<div class="slide_pic">
 +
<img src="https://static.igem.org/mediawiki/2014/4/45/HKUST_MainPage_Slideshow2.png"/>
 +
</div>
 +
<div class="slide_pic">
 +
<img src="https://static.igem.org/mediawiki/2014/7/79/HKUST_MainPage_Slideshow3.png"/>
 +
</div>
 +
</section>
 +
<!-- Work of Juston Cheney -->
-
.access-menu > li{
 
-
background: #554433;
 
-
display: inline-block;
 
-
position: relative;
 
-
margin-top: 15px;
 
-
display: inline-block;
 
-
white-space: nowrap
 
 +
-
}
+
<br><br>
 +
<div class= "project_area">
 +
<a href="https://2014.igem.org/Team:Hong_Kong_HKUST/pneumosensor"><div class = 'project_box'>
 +
<img src="https://static.igem.org/mediawiki/2014/thumb/0/08/PNEUMOSENSOR-2.png/800px-PNEUMOSENSOR-2.png"/>
 +
</div></a>
-
.access-menu > li + li{
+
-
border-left: solid 1px #000;
+
<a href="https://2014.igem.org/Team:Hong_Kong_HKUST/riboregulator"><div class= 'project_box'>
-
}
+
<img  src="https://static.igem.org/mediawiki/2014/thumb/b/b5/RiboregulatorHKUST.png/800px-RiboregulatorHKUST.png">
 +
</div></a>
 +
</div>
-
.access-menu > li:hover .access-submenu{
 
-
top: 100%;
 
-
left: auto;
 
-
}
 
-
.access-menu a{
+
<div class="quick_link_area">
-
color: #eee;
+
-
display: block;
+
<div class= "quick_link_row">
-
padding: .5em 2em;
+
<div>
-
text-decoration: none;
+
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/pneumosensor/parts">
-
border: 1px solid white;
+
<img src="https://static.igem.org/mediawiki/2014/thumb/8/87/Parts_pneumosensor_2HKUST.png/604px-Parts_pneumosensor_2HKUST.png"/>
-
-webkit-transition: all .2s linear;
+
                                                <p>Parts</p>
-
-moz-transition: all .2s linear;
+
</a>
-
-ms-transition: all .2s linear;
+
</div>
-
-o-transition: all .2s linear;
+
<div>
-
transition: all .2s linear;
+
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/pneumosensor/characterization">
-
}
+
<img src="https://static.igem.org/mediawiki/2014/thumb/3/3c/Characterization_pneumosensor_2HKUST.png/612px-Characterization_pneumosensor_2HKUST.png"/>
-
.access-menu .access_logo{
+
                                                <p>Characterization</p>
-
padding:0;
+
</a>
-
}
+
</div>
-
.access-menu img{
+
</div>
-
height: 30px;
+
<div class= "quick_link_row">
-
}
+
<div>
-
.access-menu a:hover,
+
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/data">
-
.access-menu a:focus{
+
<img src="https://static.igem.org/mediawiki/2014/4/42/HKUST_Quicklink_Icon_Data.png"/>
-
background: #000000;
+
                                                <p>Data</p>
-
outline: none;
+
-
}
+
-
.access-submenu{
+
</a>
-
background: #665544;
+
</div>
-
left: -9999px;
+
<div>
-
position: absolute;
+
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/human_practice">
-
top: -9999px;
+
<img src="https://static.igem.org/mediawiki/2014/e/e8/HKUST_Quicklink_Icon_Human_Practice.png"/>
-
width: 150%;
+
                                                <p>Human practice</p>
-
}
+
-
.access-submenu > li + li{
+
</a>
-
border-top: solid 1px #000;
+
</div>
-
}
+
</div>
 +
<div class= "quick_link_row">
 +
<div>
 +
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/riboregulator/characterization">
 +
<img src="https://static.igem.org/mediawiki/2014/thumb/c/c1/Characterization_riboregulator_2HKUST.png/612px-Characterization_riboregulator_2HKUST.png"/>
 +
                                                <p>Characterization</p>
 +
</a>
 +
</div>
 +
<div>
 +
<a class="quick_link_sub" href="https://2014.igem.org/Team:Hong_Kong_HKUST/riboregulator/parts">
 +
<img src="https://static.igem.org/mediawiki/2014/thumb/3/33/Parts_riboregulator_2HKUST.png/604px-Parts_riboregulator_2HKUST.png"/>
 +
                                                <p>Parts</p>
-
.access-submenu > li:last-child{
+
</a>
-
border-bottom: solid 3px #000;
+
</div>
-
}
+
</div>
-
 
+
-
.access-submenu a{
+
</div>
-
padding: .5em 1em;
+
<p> Click <a href="https://static.igem.org/mediawiki/2014/e/ee/HKUST_2014_2_page_highlights.pdf">here</a> to see our highlights page</p>
-
}
+
</div>
-
 
+
</body></html>
-
 
+
}}
-
.is-show{
+
-
left: auto;
+
-
top: 100%;
+
-
}
+
-
li.indent_list a{
+
-
background-color:#776655;
+
-
}
+
-
/* ============================================================================ */
+
-
/*The access-menu end*/
+
-
 
+
-
 
+
-
#slide{
+
-
width: 100%;
+
-
height: 600px;
+
-
overflow:hidden;
+
-
margin: 30px auto;
+
-
box-shadow: 0 8px 6px -6px rgba(0,0,0,1);
+
-
}
+
-
#slide div{
+
-
display:block;
+
-
width:0;
+
-
float: left;
+
-
-webkit-transition: all 0.75s;
+
-
-moz-transition: all 0.75s;
+
-
-o-transition:all 0.75s;
+
-
transition: all 0.75s;
+
-
}
+
-
img.picture {
+
-
width:960px;
+
-
}
+
-
button.prev, button.next {
+
-
position: absolute;
+
-
z-index: 999;
+
-
display: block;
+
-
padding:0 10px;
+
-
width: auto;
+
-
height:350px;
+
-
background: rgba(0,0,0,0);
+
-
color: #ffffff;
+
-
font-size:26px;
+
-
cursor: pointer;
+
-
border:none;
+
-
outline:none;
+
-
}
+
-
button.prev:hover, button.next:hover {
+
-
background: rgba(0,0,0,0.8);
+
-
}
+
-
button.next {
+
-
margin-left:926px;
+
-
}
+
-
 
+
-
 
+
-
div.project_area{
+
-
margin:0 auto;
+
-
border: 1px solid black;
+
-
background-color:#006699;
+
-
padding:15px;
+
-
  }
+
-
.project_area h4, .project_area p{
+
-
color:white;
+
-
}
+
-
div.project_box{
+
-
border: 1px solid gray;
+
-
width: 450px;
+
-
height: 150px;
+
-
text-align: center;
+
-
background-color:#006699;
+
-
}
+
-
div.project_box:hover {
+
-
    background-color: #0077AA;
+
-
}
+
-
 
+
-
div.quick_link_container{
+
-
    border-radius: 15px;
+
-
-webkit-box-shadow: 0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
-moz-box-shadow:    0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
box-shadow:        0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
width:200px;
+
-
background-color:#F0A830;
+
-
    height: 500px;
+
-
    padding: 20px 50px;
+
-
}
+
-
.quick_link_container > h4,.start_up_link_container > h4{
+
-
font-size: 25px;
+
-
    color: black;
+
-
    font-weight: 600;
+
-
}
+
-
 
+
-
.quick_link_container > p, .start_up_link_container > p{
+
-
    font-size: 17px;
+
-
}
+
-
.quick_link_container > img {
+
-
    margin: auto;
+
-
    width: 200px;
+
-
}
+
-
.quick_link_sub {
+
-
border: 1px solid black;
+
-
border-radius: 10px;
+
-
float: left;
+
-
margin: 5px;
+
-
padding: 20px 0;
+
-
text-align: center;
+
-
width: 100%;
+
-
background-color:#fceeb4;
+
-
color:black;
+
-
}
+
-
.quick_link_sub:hover{
+
-
background-color:#ffffc5;
+
-
color:#aaaaaa;
+
-
}
+
-
table.site_map_table{
+
-
background-color: #554433;
+
-
width: 90%;
+
-
padding: 5px 20px;
+
-
border-radius: 5px;
+
-
margin: 20px auto;
+
-
}
+
-
table.site_map_table td{
+
-
vertical-align: text-top;
+
-
+
-
}
+
-
table.site_map_table td h4{
+
-
font-weight:900;
+
-
color:white;
+
-
font-size:100%;
+
-
}
+
-
table.site_map_table td a{
+
-
color: #eee;
+
-
}
+
-
.site_map_table h4{
+
-
color:#F07818;
+
-
}
+
-
.site_map_table ul ul{
+
-
padding:0 15px;
+
-
}
+
-
 
+
-
.site_map_table p, .site_map_table ul, .site_map_table a{
+
-
color: #F0A830;
+
-
}
+
-
 
+
-
.site_map_table a:hover {
+
-
    text-decoration: underline;
+
-
}
+
-
 
+
-
div.banner_area{
+
-
width:100%;
+
-
margin:0 auto;
+
-
padding:0 auto;
+
-
display:block;
+
-
}
+
-
div.banner_area img{
+
-
width:100%;
+
-
height: 150px;
+
-
padding-top: 10px;
+
-
}
+
-
div.content_1{
+
-
width:100%;
+
-
margin-top:20px;
+
-
}
+
-
div.content_1 h3{
+
-
font-size:45px;
+
-
color:#5E412F;
+
-
border-bottom: 2px solid black;
+
-
padding:0px 30px;
+
-
}
+
-
table.content_table td{
+
-
width:50%;
+
-
padding: 30px;
+
-
vertical-align:top;
+
-
}
+
-
table.content_table p {
+
-
font-size: 18px;
+
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
-
line-height: 1.5em;
+
-
}
+
-
table.content_table{
+
-
background-color:transparent;
+
-
}
+
-
div.content_area{
+
-
padding:0 20px 0 20px;
+
-
border-radius: 2px;
+
-
height:auto;
+
-
}
+
-
td.content_cell img{
+
-
width:100%;
+
-
display:inline;
+
-
 
+
-
}
+
-
 
+
-
p.first_letter_enhanced::first-letter{
+
-
font-size:300%;
+
-
color: navy;
+
-
}
+
-
td.content_cell h5{
+
-
font-size: 19px;
+
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
-
font-weight:bold;
+
-
display:inline;
+
-
}
+
-
td.content_cell{
+
-
background-color: #FFFFAA;
+
-
border-radius: 8px;
+
-
text-indent: 1em;
+
-
}
+
-
td.content_cell h6{
+
-
font-size: 15px;
+
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
-
font-weight:normal;
+
-
display:inline;
+
-
}
+
-
.embedded_image_right{
+
-
float: right;
+
-
margin: 20px;
+
-
width:50%;
+
-
padding:10px;
+
-
}
+
-
.embedded_image_left{
+
-
float: left;
+
-
        margin: 20px;
+
-
width:50%;
+
-
        padding:10px;
+
-
}
+
-
div#description_area{
+
-
padding: 20px;
+
-
border-bottom: 2px dotted black;
+
-
background-color:#5E412F;
+
-
padding:10px 90px;
+
-
}
+
-
div#description_area h2 {
+
-
text-align:center;
+
-
font-size: 30px;
+
-
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+
-
font-weight:900;
+
-
display:block;
+
-
text-decoration:underline;
+
-
color:#78C0A8;
+
-
text-transform:uppercase;
+
-
}
+
-
div#description_area p{
+
-
text-indent:20px;
+
-
color:white;
+
-
}
+
-
table.start_up_link_area{
+
-
width:100%;
+
-
}
+
-
td.start_up_link_button{
+
-
width:25%;
+
-
height:300px;
+
-
}
+
-
div.start_up_link_container{
+
-
width:90%;
+
-
height:300px;
+
-
padding:5px 10px 5px 10px;
+
-
-webkit-box-shadow: 0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
-moz-box-shadow:    0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
box-shadow:        0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
-
}
+
-
 
+
-
.quick_link_row:nth-child(odd) .quick_link_button:nth-child(even) div.quick_link_container,
+
-
.quick_link_row:nth-child(even) .quick_link_button:nth-child(odd) div.quick_link_container,
+
-
tr.start_up_link_row:nth-child(odd) td.start_up_link_button:nth-child(even) div.start_up_link_container,
+
-
tr.start_up_link_row:nth-child(even) td.start_up_link_button:nth-child(odd) div.start_up_link_container{
+
-
background-color:#FF9c00;
+
-
color: #000000;
+
-
}
+
-
.quick_link_row:nth-child(odd) .quick_link_button:nth-child(even) a div.quick_link_container:hover,
+
-
.quick_link_row:nth-child(even) .quick_link_button:nth-child(odd) a div.quick_link_container:hover,
+
-
tr.start_up_link_row:nth-child(odd) td.start_up_link_button:nth-child(even) div.start_up_link_container:hover ,
+
-
tr.start_up_link_row:nth-child(even) td.start_up_link_button:nth-child(odd) div.start_up_link_container:hover {
+
-
background-color: #FF7700;
+
-
color:#009999;
+
-
}
+
-
.quick_link_row:nth-child(odd) .quick_link_button:nth-child(odd) div.quick_link_container,
+
-
.quick_link_row:nth-child(even) .quick_link_button:nth-child(even) div.quick_link_container,
+
-
tr.start_up_link_row:nth-child(odd) td.start_up_link_button:nth-child(odd) div.start_up_link_container,
+
-
tr.start_up_link_row:nth-child(even) td.start_up_link_button:nth-child(even) div.start_up_link_container{
+
-
background-color:#009999;
+
-
color: #000000;
+
-
}
+
-
.quick_link_row:nth-child(odd) .quick_link_button:nth-child(odd) a div.quick_link_container:hover,
+
-
.quick_link_row:nth-child(even) .quick_link_button:nth-child(even) a div.quick_link_container:hover,
+
-
tr.start_up_link_row:nth-child(odd) td.start_up_link_button:nth-child(odd) div.start_up_link_container:hover ,
+
-
tr.start_up_link_row:nth-child(even) td.start_up_link_button:nth-child(even) div.start_up_link_container:hover {
+
-
background-color: #11aaaa;
+
-
color:#FF9c00;
+
-
}
+
-
 
+
-
div#medal_reqire_container{
+
-
display: flex;
+
-
flex-wrap: row;
+
-
justify-content: center;
+
-
align-items: stretch;
+
-
align-content: space-between;
+
-
}
+
-
h3.What_medal{
+
-
font-size: large;
+
-
font-weight: 200;
+
-
text-transform: uppercase;
+
-
text-align: center;
+
-
border-bottom: 2px solid black;
+
-
}
+
-
div.each_medal{
+
-
background: tomato;
+
-
padding: 10px;
+
-
margin:10px;
+
-
}
+
-
 
+
-
div.achievement_container{
+
-
padding: 10px;
+
-
margin:0 auto;
+
-
+
-
}
+
-
div.achievement_container ul{
+
-
padding: 10px;
+
-
margin:10px;
+
-
background-color: #E3E0D7;
+
-
}
+
-
div.achievement_container ul li{
+
-
background-color: gray;
+
-
list-style: none;
+
-
font-size: 16px;
+
-
}
+

Latest revision as of 02:39, 18 October 2014

Click here to see our highlights page

Home

Pneumosensor

Riboregulator

Human Practice

Team

WetLab

Achievement

Retrieved from "http://2014.igem.org/Team:Hong_Kong_HKUST"