Team:Queens Canada
From 2014.igem.org
(Difference between revisions)
Line 1: | Line 1: | ||
- | + | <html xmlns="http://www.w3.org/1999/xhtml"> | |
- | < | + | <head> |
- | + | <title>QGEM</title> | |
- | < | + | |
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> | <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> | ||
+ | <script src="http://code.jquery.com/jquery.js"></script> | ||
+ | </script> | ||
+ | |||
+ | <style> | ||
+ | /* ----------------Display:none---------------- */ | ||
+ | #p-logo { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #search-controls { | ||
+ | display: none; | ||
+ | } | ||
- | + | .firstHeading { | |
- | + | display: none; | |
+ | } | ||
+ | #catlinks { | ||
+ | display: none; | ||
+ | } | ||
+ | #footer-box { | ||
+ | display: none; | ||
+ | } | ||
- | + | #contentSub { | |
- | + | display: none; | |
- | + | } | |
- | + | #globalWrapper{ | |
- | + | margin:0; | |
+ | padding:0; | ||
+ | background-color:#999999 | ||
+ | } | ||
- | + | #content{ | |
- | + | margin:0; | |
- | + | padding:0; | |
+ | width:100%; | ||
+ | } | ||
+ | #bodyContent{ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | width:100%; | ||
+ | } | ||
- | + | /**---------TOP-SECTION----**/ | |
- | + | #top-section { | |
+ | height: 20px; | ||
+ | width: 100%; | ||
+ | background-color:#343838; /*per Page*/ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | font-size:0.7em; | ||
+ | } | ||
- | + | #menubar { | |
- | + | top: 1px; | |
+ | font-family: 'Droid Sans', sans-serif; | ||
+ | } | ||
+ | /* ----------------TopSection_left-menu---------------- */ | ||
+ | .left-menu,.left-menu a { | ||
+ | color: white; | ||
+ | left: 0px; | ||
+ | text-transform: capitalize; | ||
+ | } | ||
- | + | .left-menu:hover { | |
- | + | background-color: transparent; | |
+ | } | ||
- | + | .left-menu:hover a { | |
- | + | color: white; | |
+ | text-decoration: none !important; | ||
+ | } | ||
- | + | .left-menu li a:hover { | |
- | + | color: #ff6669; | |
+ | } | ||
- | + | /* ----------------TopSection_right-menu---------------- */ | |
- | + | .right-menu li { | |
+ | background-color: transparent; | ||
+ | } | ||
- | + | .right-menu,.right-menu a { | |
- | + | color: white; | |
+ | right: 0; | ||
+ | text-align: right; | ||
+ | } | ||
- | + | .right-menu:hover { | |
- | + | background-color: transparent; | |
+ | } | ||
- | + | .right-menu:hover a { | |
- | + | color: white; | |
+ | } | ||
+ | .right-menu li a { | ||
+ | background-color: transparent; | ||
+ | color: white; | ||
+ | } | ||
- | + | .right-menu li a:hover { | |
- | + | text-decoration:none; | |
- | + | color: #ff6669; | |
+ | } | ||
- | + | /**---------PAGE------------**/ | |
- | + | #fullpage{ | |
+ | color:white; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | position:fixed; | ||
+ | } | ||
+ | body{ | ||
+ | background:white; | ||
+ | background-size:cover; | ||
+ | z-index:-999; | ||
+ | } | ||
+ | .bodya{ | ||
+ | background-color:#d9e8f5; | ||
+ | } | ||
+ | .body-text{ | ||
+ | width:90%; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | border-radius: 20px; | ||
+ | background-color:#91bed4; | ||
+ | box-shadow: 10px 10px 5px #888888; | ||
+ | } | ||
+ | td{ | ||
+ | text-align:center; | ||
+ | } | ||
+ | .team-photos{ | ||
+ | width:90%; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | border-radius: 20px; | ||
+ | background-color:#d9e8f5; | ||
+ | box-shadow: 10px 10px 5px #888888; | ||
+ | } | ||
- | |||
- | |||
+ | /**---------HEADER----------**/ | ||
+ | .header-bg{ | ||
+ | width:100%; | ||
+ | background-color:#333366; | ||
+ | padding:0px; | ||
+ | padding-left:0px; | ||
+ | padding-right:0px; | ||
+ | width:100% | ||
+ | min-width:1000px; | ||
+ | } | ||
+ | .header-logo{ | ||
+ | width:800px; | ||
+ | padding-top:10px; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | } | ||
+ | /**-----HEADER-ANIMATION------**/ | ||
- | |||
- | + | .menuc { | |
- | + | width: 100%; | |
- | + | margin: 0; | |
+ | overflow: hidden; | ||
+ | position:relative; | ||
+ | padding-bottom:0px; | ||
+ | text-align:center; | ||
+ | display:inline-block; | ||
+ | } | ||
+ | #panel { | ||
+ | width:100%; | ||
+ | list-style:none; | ||
+ | padding-top:0px; | ||
+ | padding-bottom:0px; | ||
+ | display:inline-block; | ||
+ | } | ||
- | + | #panel li { | |
- | + | margin: 0px; | |
- | + | padding: 0px; | |
- | + | display:inline-block; | |
+ | width:125px; | ||
+ | background: #99cccc; | ||
+ | } | ||
- | + | #panel li.animation { | |
+ | -moz-transition: all 0.4s ease-in-out; | ||
+ | -moz-transform:translateY(0px); | ||
+ | -o-transition: all 0.4s ease-in-out; | ||
+ | -o-transform:translateY(0px); | ||
+ | -webkit-transition: all 0.4s ease-in-out; | ||
+ | -webkit-transform:translateY(0px); | ||
+ | } | ||
- | + | #panel li.animation:hover { | |
- | + | -moz-transform:translateY(10px); | |
- | + | -o-transform:translateY(10px); | |
- | + | -webkit-transform:Y(10px); | |
- | + | } | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | #panel li a { | |
+ | color:#304269; | ||
+ | display:inline-block; | ||
+ | padding:0px; | ||
+ | } | ||
- | + | #panel li a:hover { | |
+ | color:#ffffff; | ||
+ | } | ||
- | + | /**---------FONT----------**/ | |
- | + | ||
- | + | @font-face{ | |
- | + | font-family:bebasN; | |
- | + | src:url(https://dl.dropboxusercontent.com/u/125588631/BebasNeue.otf); | |
- | + | } | |
- | + | /**---------HOME----------**/ | |
- | + | .Boxup{ | |
- | + | Background-color:#304269; | |
- | + | width:100px; | |
- | + | height:300px; | |
+ | text-align:center; | ||
+ | color:white; | ||
+ | border-radius:10px; | ||
+ | |||
+ | -moz-transition: all 0.4s ease-in-out; | ||
+ | -moz-transform:translateY(0px); | ||
+ | -o-transition: all 0.4s ease-in-out; | ||
+ | -o-transform:translateY(0px); | ||
+ | -webkit-transition: all 0.4s ease-in-out; | ||
+ | -webkit-transform:translateY(0px); | ||
+ | } | ||
+ | .Boxup:hover{ | ||
+ | -moz-transform:translateY(-20px); | ||
+ | -o-transform:translateY(-20px); | ||
+ | -webkit-transform:Y(-20px); | ||
+ | } | ||
+ | .Boxdown{ | ||
+ | Background-color:#91bed4; | ||
+ | width:100px; | ||
+ | height:300px; | ||
+ | text-align:center; | ||
+ | color:white; | ||
+ | border-radius:10px; | ||
+ | -moz-transition: all 0.4s ease-in-out; | ||
+ | -moz-transform:translateY(0px); | ||
+ | -o-transition: all 0.4s ease-in-out; | ||
+ | -o-transform:translateY(0px); | ||
+ | -webkit-transition: all 0.4s ease-in-out; | ||
+ | -webkit-transform:translateY(0px); | ||
+ | } | ||
+ | .Boxdown:hover{ | ||
+ | -moz-transform:translateY(20px); | ||
+ | -o-transform:translateY(20px); | ||
+ | -webkit-transform:Y(20px); | ||
+ | } | ||
+ | .homeicons{ | ||
+ | width:100%; | ||
+ | background-color:#d9e8f5; | ||
+ | } | ||
- | + | /**----------SPONSORSHIP--------**/ | |
- | + | ||
- | + | .menuc{ | |
- | + | background-color:#99cccc; | |
+ | text-align:center; | ||
+ | padding-top:0px; | ||
+ | padding-bottom:0px; | ||
+ | border:10px solid #333366; | ||
+ | border-left:0px; | ||
+ | border-right:0px; | ||
+ | border-top:0px; | ||
+ | } | ||
+ | .menuc li{ | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | height:30px; | ||
+ | display:inline-block; | ||
+ | font-size:0.9em; | ||
+ | font-family:bebasN; | ||
+ | } | ||
+ | .menuc li a:link{ | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | color:#333366; | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | .menuc li a:hover{ | ||
+ | color:white; | ||
+ | } | ||
+ | .menuc li a:visited{ | ||
+ | color:#bf3f3e; | ||
+ | text-decoration:none; | ||
+ | } | ||
- | |||
- | |||
- | < | + | <!-----MEET THE TEAM------> |
- | + | .white{ | |
- | + | background-color:white; | |
- | + | } | |
+ | } | ||
+ | .bio{ | ||
+ | overflow:auto; | ||
+ | word-wrap:break-word; | ||
+ | } | ||
+ | .span5{ | ||
+ | overflow:hidden; | ||
+ | font-size:0.9em; | ||
+ | margin:10px 5px; | ||
+ | } | ||
+ | .right{ | ||
+ | float:right; | ||
+ | padding:5px; | ||
+ | } | ||
+ | .left{ | ||
+ | float:left; | ||
+ | padding:5px; | ||
+ | } | ||
+ | .photo-right{ | ||
+ | float:left; | ||
+ | margin:5px; | ||
+ | width:200px; | ||
+ | border-radius:10px; | ||
+ | } | ||
+ | .photo-left{ | ||
+ | float:right; | ||
+ | width:200px; | ||
+ | margin:5px; | ||
+ | border-radius:10px; | ||
- | + | } | |
- | + | .img-rounded{ | |
- | + | width:150px; | |
- | + | margin:5px; | |
- | + | } | |
- | + | </style> | |
- | </ | + | </head> |
- | < | + | <body> |
- | </ | + | <div class="bodya"> |
+ | <div class="menuc" style="font-size:1.3em;"> | ||
+ | <ul id="panel" class="animation"> | ||
+ | <li id="home" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada">HOME</a></li> | ||
+ | <li id="team" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Team">TEAM</a></li> | ||
+ | <li id="project" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Project">PROJECT</a></li> | ||
+ | <li id="outreach" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Outreach">OUTREACH</a></li> | ||
+ | <li id="notebook" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Notebook">NOTEBOOK</a></li> | ||
+ | <li id="safety" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Safety">SAFETY</a></li> | ||
+ | <li id="attributions" class="animation"><a href="https://2014.igem.org/Team:Queens_Canada/Attributions">ATTRIBUTIONS</a></li> | ||
+ | |||
+ | </ul> | ||
+ | </div> | ||
- | < | + | <div class="header-logo"> |
- | < | + | <a href="https://igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/2013/4/46/Igem_qgem_logo.png" class="img-circle" style="height:60px;min-width:60px;float:right;"></a> |
+ | </div> | ||
+ | <div class="homeicons"> | ||
+ | <div class="row"> | ||
+ | <div class="col-md-3"></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxup"><a href="https://2014.igem.org/Team:Queens_Canada/Team">T</br>E</br>A</br>M</a></div></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxdown"><a href="https://2014.igem.org/Team:Queens_Canada/Project">P</br>R</br>O</br>J</br>E</br>C</br>T</a></div></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxup"><a href="https://2014.igem.org/Team:Queens_Canada/Outreach">O</br>U</br>T</br>R</br>E</br>A</br>C</br>H</a></div></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxdown"><a href="https://2014.igem.org/Team:Queens_Canada/Notebook">N</br>O</br>T</br>E</br>B</br>O</br>O</br>K</a></div></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxup"><a href="https://2014.igem.org/Team:Queens_Canada/Safety">S</br>A</br>F</br>E</br>T</br>Y</a></div></div> | ||
+ | <div class="col-md-1"> | ||
+ | <div class="Boxdown"><a href="https://2014.igem.org/Team:Queens_Canada/Attributions">A</br>T</br>T</br>R</br>I</br>B</br>U</br>T</br>I</br>O</br>N</br>S</a></div></div> | ||
+ | <div class="col-md-3"></div> | ||
+ | </div> | ||
- | + | </div> | |
- | + | </div> | |
- | + | </body> | |
- | + | </html> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | </ | + | |
- | </ | + | |
- | </ | + |
Revision as of 02:20, 2 October 2014