Difference between revisions of "Team:TECHNION-ISRAEL/example"

Line 1: Line 1:
{{NTU-Singapore}}
+
<html>
 +
    <head>
  
<html lang="en">
 
<style>
 
  
/*-- Remove borders, float content left and remove padding/margin */
+
     <title>My First Website</title>
#globalWrapper, #content{
+
background-color: transparent;
+
border: 0px;
+
border-bottom: 0px;
+
float: none;
+
margin:0px;
+
padding: 0px;
+
width:  100%;
+
color: #666;
+
list-style-image: none;
+
font-size: 14px;
+
}
+
 
+
#HQ_page th {
+
    background-color: transparent;
+
    padding: 10px 40px;
+
    color: black;
+
    border: none;
+
    border-collapse: collapse;
+
    vertical-align: text-top;
+
    text-transform: uppercase;
+
    text-align: center;
+
    letter-spacing: 3px;
+
font-size: 16px;
+
font-weight: bond;
+
}
+
 
+
#HQ_page td {
+
    padding: 0px;
+
    border: 0px solid #ccc;
+
    vertical-align: text-top;
+
    text-align: center;
+
    line-height: 35px;
+
    font-size: 15px;
+
}
+
 
+
#top_menu_14 {
+
        background-color: rgba(120,194,196,1);
+
        border-bottom: 1px solid rgba(120,194,196,1);
+
 
+
}
+
 
+
 
+
#HQ_page .jumbotron p {
+
text-align: center;
+
margin-bottom: 15px;
+
font-size: 21px;
+
font-weight: 200;
+
}
+
 
+
#HQ_page p {
+
  margin: 0 0 25px;
+
    text-align: justify;
+
    font-size: 18px;
+
  font-family: 'Raleway', sans-serif;
+
 
+
}
+
 
+
 
+
#HQ_page h1 {
+
    font-family: 'Just Me Again Down Here';
+
    border-bottom: none;
+
    font-weight: normal;
+
    margin-bottom: 0;
+
    margin-top: 0;
+
    padding-bottom: 25px;
+
   
+
}
+
 
+
 
+
 
+
#HQ_page h2, h3, h4, h5 {
+
  font-family: 'Raleway', sans-serif;
+
    border-bottom: none;
+
    font-weight: bold;
+
    margin-bottom: 0;
+
    margin-top: 0;
+
    text-transform: uppercase;
+
    font-size: 20px;
+
    letter-spacing: 3px;
+
color: black;
+
}
+
 
+
#top_title, #sideMenu{
+
 
+
display: none;
+
 
+
}
+
 
+
a {
+
    color: rgba(120,194,196,1);
+
}
+
 
+
a:visited{
+
      color: black;
+
}
+
 
+
a:hover{
+
      text-decoration: none;
+
 
+
}
+
 
+
.mw-content-ltr ul {
+
 
+
padding-top: 10px;
+
padding-right: 0px;
+
}
+
 
+
body {
+
    margin-top: 100px;
+
     /* background-color: #222; */
+
}
+
 
+
@media(min-width:768px) {
+
    body {
+
        margin-top: 50px;
+
+
    }
+
}
+
 
+
#wrapper {
+
    padding-left: 0;
+
}
+
 
+
#page-wrapper {
+
    width: 100%;
+
    padding: 0;
+
 
+
}
+
 
+
.intro{
+
background: url(https://static.igem.org/mediawiki/2015/b/b5/Team_NTU-Singapore_banner.jpg) no-repeat center;
+
background-size: cover;
+
width:100%;
+
position:relative;
+
}
+
 
+
 
+
.huge {
+
    font-size: 50px;
+
    line-height: normal;
+
}
+
 
+
@media(min-width:768px) {
+
    #wrapper {
+
        /*padding-left: 225px;*/
+
    }
+
 
+
    #page-wrapper {
+
        /*padding: 10px;*/
+
    }
+
}
+
 
+
/* Top Navigation */
+
 
+
.top-nav {
+
    padding: 0 15px;
+
    margin: auto;
+
    width: 1060px;
+
}
+
 
+
.top-nav>li {
+
    display: inline-block;
+
    float: left;
+
-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
+
box-shadow: 0 6px 12px rgba(0,0,0,.175);
+
 
+
 
+
}
+
 
+
.top-nav>li>a {
+
    padding-top: 15px;
+
    padding-bottom: 15px;
+
    line-height: 20px;
+
    color: white;
+
}
+
 
+
.top-nav>li>a:hover,
+
.top-nav>li>a:focus,
+
.top-nav>.open>a,
+
.top-nav>.open>a:hover,
+
.top-nav>.open>a:focus {
+
    color: #fff;
+
border-radius: 25px;
+
}
+
 
+
.top-nav>.open>.dropdown-menu {
+
    float: left;
+
    position: relative;
+
    margin-top: 0;
+
 
 
    border-top-left-radius: 0;
+
<meta name="author" content="your name" />
    border-top-right-radius: 0;
+
<meta name="description" content="" />
    background-color: transparent;
+
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Team:TECHNION-ISRAEL/slick.css2/CSS?action=raw&ctype=text/css"/>
    }
+
<link rel="stylesheet" type="text/css" href="https://2017.igem.org/Team:TECHNION-ISRAEL/slick.css/CSS?action=raw&ctype=text/css"/>
 
+
.top-nav>.open>.dropdown-menu>li>a {
+
    white-space: normal;
+
}
+
 
+
ul.message-dropdown {
+
    padding: 0;
+
    max-height: 250px;
+
    overflow-x: hidden;
+
    overflow-y: auto;
+
}
+
 
+
li.message-preview {
+
    width: 275px;
+
    border-bottom: 1px solid rgba(0,0,0,.15);
+
}
+
 
+
li.message-preview>a {
+
    padding-top: 15px;
+
    padding-bottom: 15px;
+
}
+
 
+
li.message-footer {
+
    margin: 5px 0;
+
}
+
 
+
ul.alert-dropdown {
+
    width: 200px;
+
}
+
 
+
/* Top Navigation */
+
 
+
.top-nav>li>ul>li>a {
+
display: block;
+
padding: 10px 15px 10px 15px;
+
text-decoration: none;
+
color: white;
+
}
+
 
+
.top-nav>li>ul {
+
list-style-type: none;
+
padding-left: 0px;
+
}
+
 
+
 
+
/* Side Navigation */
+
 
+
@media(min-width:768px) {
+
    .side-nav {
+
        position: fixed;
+
        top: 51px;
+
        left: 225px;
+
        width: 225px;
+
        margin-left: -225px;
+
        border: none;
+
        border-radius: 0;
+
        overflow-y: auto;
+
        /* background-color: #222;  */
+
        bottom: 0;
+
        overflow-x: hidden;
+
        padding-bottom: 40px;
+
    }
+
 
+
.side-nav>li{
+
 
 
background-color: aquamarine;
+
</head>
border-radius: 25px;
+
width: 195px;
+
margin-left: 10px;
+
margin-top: 10px;
+
 
 
 +
<style>
 +
 +
.slick-carousel {
 +
  width: auto;
 +
  margin: 60px 50px 50px;
 
}
 
}
 
 
    .side-nav>li>a {
 
        width: 225px;
 
    }
 
  
    .side-nav li a:hover,
+
.slick-slide {
    .side-nav li a:focus {
+
  background: #FFFFFF;
        outline: none;
+
  padding: 40px 0;
        background-color: aliceblue !important;
+
  text-align: center;
width: 195px;
+
}
border-radius: 25px;
+
+
    }
+
}
+
  
.side-nav>li>ul {
+
.slick-prev:before,
    padding: 0;
+
.slick-next:before {
}
+
  color: black;
 +
}
  
 +
.slick-dots {
 +
  bottom: -30px;
 +
}
  
 
+
.sponsors {
.side-nav>li>ul>li>a {
+
width: 150px;
    display: block;
+
}
    padding: 10px 15px 10px 38px;
+
    text-decoration: none;
+
</style>
    color: #999;
+
}
+
 
+
.side-nav>li>ul>li>a:hover {
+
    color: #fff;
+
}
+
 
+
/* Flot Chart Containers */
+
 
+
.flot-chart {
+
    display: block;
+
    height: 400px;
+
}
+
 
+
.flot-chart-content {
+
    width: 100%;
+
    height: 100%;
+
}
+
 
+
/* Custom Colored Panels */
+
 
+
.huge {
+
    font-size: 40px;
+
}
+
 
+
.panel-green {
+
    border-color: #5cb85c;
+
}
+
 
+
.panel-green > .panel-heading {
+
    border-color: #5cb85c;
+
    color: #fff;
+
    background-color: #5cb85c;
+
}
+
 
+
.panel-green > a {
+
    color: #5cb85c;
+
}
+
 
+
.panel-green > a:hover {
+
    color: #3d8b3d;
+
}
+
 
+
.panel-red {
+
    border-color: #d9534f;
+
}
+
 
+
.panel-red > .panel-heading {
+
    border-color: #d9534f;
+
    color: #fff;
+
    background-color: #d9534f;
+
}
+
 
+
.panel-red > a {
+
    color: #d9534f;
+
}
+
 
+
.panel-red > a:hover {
+
    color: #b52b27;
+
}
+
 
+
.panel-yellow {
+
    border-color: #f0ad4e;
+
}
+
 
+
.panel-yellow > .panel-heading {
+
    border-color: #f0ad4e;
+
    color: #fff;
+
    background-color: #f0ad4e;
+
}
+
 
+
.panel-yellow > a {
+
    color: #f0ad4e;
+
}
+
 
+
.panel-yellow > a:hover {
+
    color: #df8a13;
+
 
 
}
+
<body>
</style>
+
<div class="slick-carousel">
<head>
+
<div><a target="_blank" href="http://www.labotal.co.il">
 
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/e/e0/T--TECHNION-ISRAEL--labotal.jpg">
    <meta charset="utf-8">
+
</a></div>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
<div><a target="_blank" href="http://www.bioind.com">
    <meta name="viewport" content="width=device-width, initial-scale=1">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/d/d6/T--TECHNION-ISRAEL--BI.jpg">
    <meta name="description" content="">
+
</a></div>
    <meta name="author" content="">
+
<div><a target="_blank" href="http://www.zotal.co.il">
 
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/0/0b/T--TECHNION-ISRAEL--zotal.jpg">
    <title>NTU-Singapore</title>
+
</a></div>
 
+
<div><a target="_blank" href="http://www.almog.co.il">
    <!-- Fonts -->
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/1/14/T--TECHNION-ISRAEL--Almog.jpg">
        <script src="https://use.fontawesome.com/597ba5ca72.js"></script>
+
</a></div>
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
+
<div><a target="_blank" href="http://www.hylabs.co.il">
<link href="https://fonts.googleapis.com/css?family=Amatic+SC:700|Annie+Use+Your+Telescope|Gloria+Hallelujah|Just+Me+Again+Down+Here|Nothing+You+Could+Do|Reenie+Beanie|Rock+Salt|Schoolbell|Shadows+Into+Light|Sue+Ellen+Francisco" rel="stylesheet">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/6/61/T--TECHNION-ISRAEL--Hylabs.jpg">
   
+
</a></div>
</head>
+
<div><a target="_blank" href="https://www.idt.com">
 
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/c/cd/T--TECHNION-ISRAEL--IDT.jpg">
<body>
+
</a></div>
 
+
<div><a target="_blank" href="https://www.neb.com">
    <div id="wrapper">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/5/53/T--TECHNION-ISRAEL--neb.jpg">
 
+
</a></div>
        <!-- Navigation -->
+
<div><a target="_blank" href="http://www.snapgene.com">
      <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/6/6b/T--TECHNION-ISRAEL--snapgene.jpg">
            <!-- Brand and toggle get grouped for better mobile display -->
+
</a></div>
            <div class="navbar-header">
+
<div><a target="_blank" href="https://www.technion.ac.il/en">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/1/18/T--TECHNION-ISRAEL--technion.jpg">
                    <span class="sr-only">Toggle navigation</span>
+
</a></div>
                    <span class="icon-bar"></span>
+
<div><a target="_blank" href="https://www.sigmaaldrich.com/united-states.html">
                    <span class="icon-bar"></span>
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/b/be/T--TECHNION-ISRAEL--sigma.jpg">
                    <span class="icon-bar"></span>
+
</a></div>
                </button>
+
<div> <a target="_blank" href="http://www.rhenium.co.il">
               
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/2/24/T--TECHNION-ISRAEL--Rhenium.jpg">
            </div>
+
</a></div>
            <!-- Top Menu Items -->
+
<div><a target="_blank" href="http://www.tivanbiotech.co.il/">
            <ul class="nav navbar-right top-nav" style="margin: auto; width: 1063px;">
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/4/4b/T--TECHNION-ISRAEL--Tivan.jpg">
 
+
</a></div>
                <li class="dropdown" style="margin-left:0px;">
+
<div><a target="_blank" href="https://www.peprotech.com/en-US">
<a href="https://2016.igem.org/Team:NTU-Singapore" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x fa-home"></i> <span class="navbar-name"> NTU-SG</span> </a>
+
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/3/3e/T--TECHNION-ISRAEL--peprotech.jpg">
</li>
+
</a></div>
 +
<div><a target="_blank" href="www.bioanalytics.co.il">
 +
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/5/55/T--TECHNION-ISRAEL--BioAnalytics.jpg">
 +
</a></div>
 +
<div><a target="_blank" href="http://www.syntezza.com">
 +
<img class="sponsors" src="https://static.igem.org/mediawiki/2017/5/55/T--TECHNION-ISRAEL--BioAnalytics.jpg">
 +
</a></div>
 
 
                <li class="dropdown">
+
</div>
                    <a href="https://2016.igem.org/Team:NTU-Singapore/Collaborations" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x fa-globe"></i><span class="navbar-name"> Collaboration</span></a>
+
</li>
+
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
+
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<li class="dropdown">
+
<script type="text/javascript" src="slick/slick.min.js"></script>
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x fa-flask"></i><span class="navbar-name"> Projects</span><b class="caret"></b></a>
+
<div class="drop-menu">
+
<script>
<ul class="dropdown-menu dropdown-menu-project" style="margin: 0px;  left: -40px;">
+
$(".slick-carousel").slick({
<li>
+
speed: 6000,
<a href="https://2016.igem.org/Team:NTU-Singapore/Interlab"><i class="fa fa-2x fa-balance-scale"></i><span style="top: -34px; float: left; left: 50px;"class="navbar-name"> Interlab Measurement </span> </a>
+
autoplay: true,
</li>
+
autoplaySpeed: 0,
<li>
+
cssEase: 'linear',
<a href="https://2016.igem.org/Team:NTU-Singapore/Description" style="top: -20px; position: relative;"><i class="fa fa-fw fa-2x fa-book"></i><span style="left: 9px;" class="navbar-name"> Description</span> </a>
+
arrows: false,
</li>
+
slidesToShow: 6,
 
+
slidesToScroll: 10,
+
infinite: true,
<li>
+
centerMode: true,
<a href="https://2016.igem.org/Team:NTU-Singapore/Proof" style="height: 49px;"><i class="fa fa-2x  fa-bar-chart" style="float: left;"></i><span style="width: 96px;
+
focusOnSelect: true,
left: 10px;
+
rtl: false,
float: left;
+
pauseOnHover: true,
margin-left: 6px;
+
top: -6px;" class="navbar-name"> Proof of concept </span></a>
+
</li>
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/Demonstrate"><i class="fa fa-2x  fa-space-shuttle"></i><span style="left: 9px;" class="navbar-name"> Demonstrate</span> </a>
+
</li>
+
+
</ul>
+
</div>
+
</li>
+
+
<li class="dropdown">
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x fa-gears"></i><span class="navbar-name"> Parts</span>  <b class="caret"></b></a>
+
<div class="drop-menu">
+
<ul class="dropdown-menu" style="margin: 0px; left: -42px;">
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/Basic_Part"><i class="fa fa-fw fa-2x fa-gear"></i><span style="left: 8px;"class="navbar-name"> Basic Parts</span> </a>
+
</li>
+
+
<li>
+
<a style="height: 49px" href="https://2016.igem.org/Team:NTU-Singapore/Composite_Part"><i style="float: left;" class="fa fa-fw fa-2x fa-briefcase"></i><span style="    float: left;
+
width: 96px;
+
top: -6px;
+
left: 13px;" class="navbar-name"> CRISPR<span style="text-transform: lowercase;">y</span> Collection</span> </a>
+
</li>
+
+
+
</ul>
+
</div>
+
+
</li>
+
+
+
<li class="dropdown">
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x fa-key"></i><span class="navbar-name"> Team</span>  <b class="caret"></b></a>
+
<div class="drop-menu">
+
<ul class="dropdown-menu" style="margin: 0px; left: -50px;">
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/Team"><i class="fa fa-2x fa-flag-checkered" aria-hidden="true"></i><span style="left: 13px;"class="navbar-name">Adventurers</span> </a>
+
</li>
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/Attributions"><i class="fa fa-2x fa-key" aria-hidden="true"></i><span style="left: 13px;" class="navbar-name">Attribution</span> </a>
+
</li>
+
<li>
+
<a style="height: 49px" href="https://2016.igem.org/Team:NTU-Singapore/Notebook"><i class="fa fa-2x fa-file-text-o" aria-hidden="true"></i>
+
<span style=" left: 13px;" class="navbar-name">Notebook</span> </a>
+
</li>
+
+
+
</ul>
+
</div>
+
 
+
</li>
+
 
+
                                      <li class="dropdown">
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-2x  fa-group"></i><span class="navbar-name"> Human Practice</span>  <b class="caret"></b></a>
+
<div class="drop-menu">
+
<ul class="dropdown-menu dropdown-menu-humanprac" style="margin: 0px">
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/HP/Silver"><i class="fa fa-fw fa-2x fa-user"></i><span class="navbar-name"> Silver</span> </a>
+
</li>
+
<li>
+
<a href="https://2016.igem.org/Team:NTU-Singapore/HP/Gold"><i class="fa fa-fw fa-2x fa-envelope"></i><span class="navbar-name"> Gold</span> </a>
+
</li>
+
+
</ul>
+
</div>
+
</li>
+
 
+
 
+
            </ul>
+
        </nav>
+
 
+
</body>
+
  
 +
 +
});
 +
 +
</script>
 +
</body>
 
</html>
 
</html>

Revision as of 08:46, 27 September 2017

My First Website