Difference between revisions of "Team:Imperial College/Applied Design"

Line 2: Line 2:
  
 
<html>
 
<html>
 +
<head>
 
<style>
 
<style>
 +
.btn1{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/c/c0/T--Imperial_College--computational.png);
 +
    background-size: 90px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
.btn2{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/f/fb/T--Imperial_College--biocontainment.png);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
 +
.btn3{
 +
    background-image: url(biomaterial.jpg);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat; 
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
.btn4{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/e/e3/T--Imperial_College--bacon.png);
 +
    background-size: 90px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
 +
.btn5{
 +
    background: white;
 +
    background-image: url(https://static.igem.org/mediawiki/2018/9/93/T--Imperial_College--selection.png);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
 +
.btn6{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/c/c0/T--Imperial_College--computational.png);
 +
    background-size: 90px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
.btn7{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/f/fb/T--Imperial_College--biocontainment.png);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
 +
.btn8{
 +
    background-image: url(biomaterial.jpg);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat; 
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
.btn9{
 +
    background-image: url(https://static.igem.org/mediawiki/2018/e/e3/T--Imperial_College--bacon.png);
 +
    background-size: 90px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
 +
.btn10{
 +
    background: white;
 +
    background-image: url(https://static.igem.org/mediawiki/2018/9/93/T--Imperial_College--selection.png);
 +
    background-size: 123px;
 +
    border: solid 5px #374785;
 +
    height: 130px;
 +
    width:130px; 
 +
    border-radius: 50%;
 +
    background-repeat:no-repeat;
 +
    background-position: center;
 +
    cursor: pointer;
 +
}
 +
.collab-pic {
 +
    float:left;
 +
    margin:auto;
 +
    cursor: pointer;
 +
    margin-top:5%;
 +
}
 
</style>
 
</style>
  
 
<body>
 
<body>
 
  <div class="container">           
 
  <div class="container">           
−
  <div class="content">
+
                    <div class="content">
−
      <div class="titleimg">
+
                          <div class="titleimg">
−
<br/>
+
                              <h1>Applications</h1>
−
                <h1>Public Engagement</h1>
+
 
−
                <br/>
+
                      </div>
−
                <br/>
+
−
  <img src="" alt="" width="24%"; >
+
−
        </div>
+
  
−
</div>
+
                      <div class="miniBlock">
 +
                            <div class="collab-pic" style="margin-left: 8%">
 +
                                  <button class="btn1" data-balloon-length="large" data-balloon="High-throughput Computational" data-balloon-pos="up"></button>
 +
                       
 +
                                </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn2"  data-balloon-length="large" data-balloon="Biocontainment" data-balloon-pos="up"></button>
 +
                                 
 +
                               
 +
                                </div>
 +
                               
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn3" data-balloon-length="large" data-balloon="Biomaterial" data-balloon-pos="up"></button>
 +
                                 
 +
           
 +
                                </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn4" data-balloon-length="large" data-balloon="Artificial Meat" data-balloon-pos="up"></button>
 +
                                     
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn5" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 8%">
 +
                                        <button class="btn6" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn7" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn8" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn9" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
                                <div class="collab-pic" style="margin-left: 10%">
 +
                                        <button class="btn10" data-balloon-length="large" data-balloon="Selection Pressure Scanning" data-balloon-pos="up"></button>
 +
                                         
 +
                           
 +
                                    </div>
 +
 
 +
               
 +
                            </div>
 +
       
 +
                            <div class="clr"></div>
 +
                           
 +
 
 +
              <div class="application">
 +
                    <h3>Applications</h3>
 +
<br/>
 +
<br/>
 +
<div id="computational"></div>
 +
        <h4>Hybrid digital-biological computation</h4>
 +
                </div>
 +
    </div>
 
</body>
 
</body>
 
</html>
 
</html>
 +
 
{{:Team:Imperial_College/Templates/Footer}}
 
{{:Team:Imperial_College/Templates/Footer}}

Revision as of 15:10, 11 October 2018

Applications

Applications



Hybrid digital-biological computation