|
|
(8 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | <html>
| |
- | <head>
| |
- | <link href='http://fonts.googleapis.com/css?family=Audiowide|Share+Tech+Mono' rel='stylesheet' type='text/css'>
| |
- | <link href="http://fonts.googleapis.com/css?family=Goudy+Bookletter+1911" rel="stylesheet" type="text/css">
| |
- | <link href="http://fonts.googleapis.com/css?family=Raleway:100" rel="stylesheet" type="text/css">
| |
- | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
| |
- | <script src="http://yourjavascript.com/428146502/menu.js"></script>
| |
- | </head>
| |
| | | |
- | <style>
| |
- |
| |
- | /* Hide Defaults */
| |
- | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
| |
- | display:none;}
| |
- | #top-section {
| |
- | border: none;
| |
- | height: 0px;}
| |
- | #content {
| |
- | border: none;}
| |
- | .right-menu li a{
| |
- | background: none;
| |
- | color:rgba(0,0,0,0);
| |
- | }
| |
- | .right-menu li a:hover{
| |
- | color: #fff;
| |
- | }
| |
- | .left-menu li{
| |
- | color: rgba(0, 0, 0, 0) !important;
| |
- | }
| |
- | .left-menu:hover li{
| |
- | color: #fff;
| |
- | }
| |
- |
| |
- | /* Background */
| |
- | body {
| |
- | background-image:url("http://oi62.tinypic.com/2uek64o.jpg");
| |
- | }
| |
- | div#bodyContent {
| |
- | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| |
- | }
| |
- | div#content{
| |
- | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| |
- | }
| |
- | div#menubar {
| |
- | background-image: url('http://oi59.tinypic.com/2qvgkcw.jpg !important');
| |
- | }
| |
- | h1{
| |
- | font: 400 45px/0.5 'Audiowide', Helvetica, sans-serif;
| |
- | text-align: center;
| |
- | border-bottom: medium none !important;
| |
- | }
| |
- | h2{
| |
- | font-family: 'Raleway', Helvetica, Arial, sans-serif;
| |
- | font-size: 32px;
| |
- | line-height: 70px;
| |
- | border-bottom: medium none !important;
| |
- | }
| |
- | p{
| |
- | font-family: 'Goudy Bookletter 1911', Georgia, Times, serif;
| |
- | font-size: 15px;
| |
- | line-height: 25px;
| |
- | }
| |
- | /* Footer */
| |
- | * {
| |
- | margin: 0;
| |
- | }
| |
- | html, body {
| |
- | height: 100%;
| |
- | }
| |
- | .page-wrap {
| |
- | min-height: 100%;
| |
- | margin-bottom: -61px;
| |
- | }
| |
- | .page-wrap:after {
| |
- | content: "";
| |
- | display: block;
| |
- | }
| |
- | .site-footer, .page-wrap:after {
| |
- | height: 61px;
| |
- | }
| |
- | .site-footer{
| |
- | text-align: center;
| |
- | }
| |
- |
| |
- | /* Navigation */
| |
- | #cssmenu {
| |
- | position: relative;
| |
- | height: 44px;
| |
- | background: url('http://oi59.tinypic.com/2qvgkcw.jpg');
| |
- | width: auto;
| |
- | }
| |
- | #cssmenu ul {
| |
- | list-style: none;
| |
- | padding: 0;
| |
- | margin: 0;
| |
- | line-height: 1;
| |
- | }
| |
- | #cssmenu > ul {
| |
- | position: relative;
| |
- | display: block;
| |
- | background: url('http://oi59.tinypic.com/2qvgkcw.jpg');
| |
- | height: 32px;
| |
- | width: 100%;
| |
- | z-index: 500;
| |
- | }
| |
- | #cssmenu > ul > li {
| |
- | display: block;
| |
- | position: relative;
| |
- | float: left;
| |
- | margin: 0;
| |
- | padding: 0;
| |
- | }
| |
- | #cssmenu > ul > #menu-button {
| |
- | display: none;
| |
- | }
| |
- | #cssmenu ul li a {
| |
- | display: block;
| |
- | font-family: Helvetica, sans-serif;
| |
- | text-decoration: none;
| |
- | }
| |
- | #cssmenu > ul > li > a {
| |
- | font-size: 14px;
| |
- | font-weight: bold;
| |
- | padding: 15px 20px;
| |
- | color: black;
| |
- | text-transform: uppercase;
| |
- | -webkit-transition: color 0.25s ease-out;
| |
- | -moz-transition: color 0.25s ease-out;
| |
- | -ms-transition: color 0.25s ease-out;
| |
- | -o-transition: color 0.25s ease-out;
| |
- | transition: color 0.25s ease-out;
| |
- | }
| |
- | #cssmenu > ul > li.has-sub > a {
| |
- | padding-right: 32px;
| |
- | }
| |
- | #cssmenu > ul > li:hover > a {
| |
- | color: #9c9c9c;
| |
- | }
| |
- | #cssmenu li.has-sub::after {
| |
- | display: block;
| |
- | content: '';
| |
- | position: absolute;
| |
- | width: 0;
| |
- | height: 0;
| |
- | }
| |
- | #cssmenu > ul > li.has-sub::after {
| |
- | right: 10px;
| |
- | top: 20px;
| |
- | border: 5px solid transparent;
| |
- | border-top-color: black;
| |
- | }
| |
- | #cssmenu > ul > li:hover::after {
| |
- | border-top-color: #9c9c9c;
| |
- | }
| |
- | #indicatorContainer {
| |
- | position: absolute;
| |
- | height: 12px;
| |
- | width: 100%;
| |
- | bottom: 0px;
| |
- | overflow: hidden;
| |
- | z-index: -1;
| |
- | }
| |
- | #pIndicator {
| |
- | position: absolute;
| |
- | height: 0;
| |
- | width: 100%;
| |
- | border: 12px solid transparent;
| |
- | border-top-color: #2b2f3a;
| |
- | z-index: -2;
| |
- | -webkit-transition: left .25s ease;
| |
- | -moz-transition: left .25s ease;
| |
- | -ms-transition: left .25s ease;
| |
- | -o-transition: left .25s ease;
| |
- | transition: left .25s ease;
| |
- | }
| |
- | #cIndicator {
| |
- | position: absolute;
| |
- | height: 0;
| |
- | width: 100%;
| |
- | border: 12px solid transparent;
| |
- | border-top-color: #2b2f3a;
| |
- | top: -12px;
| |
- | right: 100%;
| |
- | z-index: -2;
| |
- | }
| |
- | #cssmenu ul ul {
| |
- | position: absolute;
| |
- | left: -9999px;
| |
- | top: 70px;
| |
- | opacity: 0;
| |
- | -webkit-transition: opacity .3s ease, top .25s ease;
| |
- | -moz-transition: opacity .3s ease, top .25s ease;
| |
- | -ms-transition: opacity .3s ease, top .25s ease;
| |
- | -o-transition: opacity .3s ease, top .25s ease;
| |
- | transition: opacity .3s ease, top .25s ease;
| |
- | z-index: 1000;
| |
- | }
| |
- | #cssmenu ul ul ul {
| |
- | top: 37px;
| |
- | padding-left: 5px;
| |
- | }
| |
- | #cssmenu ul ul li {
| |
- | position: relative;
| |
- | }
| |
- | #cssmenu > ul > li:hover > ul {
| |
- | left: auto;
| |
- | top: 44px;
| |
- | opacity: 1;
| |
- | }
| |
- | #cssmenu ul ul li:hover > ul {
| |
- | left: 170px;
| |
- | top: 0;
| |
- | opacity: 1;
| |
- | }
| |
- | #cssmenu ul ul li a {
| |
- | width: 130px;
| |
- | border-bottom: 1px solid #eee;
| |
- | padding: 10px 20px;
| |
- | font-size: 12px;
| |
- | color: #7a8189;
| |
- | background: #fff;
| |
- | -webkit-transition: all .35s ease;
| |
- | -moz-transition: all .35s ease;
| |
- | -ms-transition: all .35s ease;
| |
- | -o-transition: all .35s ease;
| |
- | transition: all .35s ease;
| |
- | }
| |
- | #cssmenu ul ul li:hover > a {
| |
- | background: #f6f6f6;
| |
- | color: #8c9195;
| |
- | }
| |
- | #cssmenu ul ul li:last-child > a,
| |
- | #cssmenu ul ul li.last > a {
| |
- | border-bottom: 0;
| |
- | }
| |
- | .submenuArrow {
| |
- | border: 6px solid transparent;
| |
- | width: 0;
| |
- | height: 0;
| |
- | border-bottom-color: #fff;
| |
- | position: absolute;
| |
- | top: -12px;
| |
- | }
| |
- | #cssmenu ul ul li.has-sub::after {
| |
- | border: 4px solid transparent;
| |
- | border-left-color: #7a8189;
| |
- | right: 10px;
| |
- | top: 12px;
| |
- | -moz-transition: all .2s ease;
| |
- | -ms-transition: all .2s ease;
| |
- | -o-transition: all .2s ease;
| |
- | transition: all .2s ease;
| |
- | -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
| |
- | }
| |
- | #cssmenu ul ul li.has-sub:hover::after {
| |
- | border-left-color: #fff;
| |
- | right: -5px;
| |
- | -webkit-transform: rotateY(180deg);
| |
- | -ms-transform: rotateY(180deg);
| |
- | -moz-transform: rotateY(180deg);
| |
- | -o-transform: rotateY(180deg);
| |
- | transform: rotateY(180deg);
| |
- | }
| |
- | @media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
| |
- | #cssmenu {
| |
- | width: auto;
| |
- | }
| |
- | #cssmenu ul {
| |
- | width: auto;
| |
- | }
| |
- | #cssmenu .submenuArrow,
| |
- | #cssmenu #indicatorContainer {
| |
- | display: none;
| |
- | }
| |
- | #cssmenu > ul {
| |
- | height: auto;
| |
- | display: block;
| |
- | }
| |
- | #cssmenu > ul > li {
| |
- | float: none;
| |
- | }
| |
- | #cssmenu li,
| |
- | #cssmenu > ul > li {
| |
- | display: none;
| |
- | }
| |
- | #cssmenu ul ul,
| |
- | #cssmenu ul ul ul,
| |
- | #cssmenu ul > li:hover > ul,
| |
- | #cssmenu ul ul > li:hover > ul {
| |
- | position: relative;
| |
- | left: auto;
| |
- | top: auto;
| |
- | topacity: 1;
| |
- | padding-left: 0;
| |
- | }
| |
- | #cssmenu ul .has-sub::after {
| |
- | display: none;
| |
- | }
| |
- | #cssmenu ul li a {
| |
- | padding: 12px 20px;
| |
- | }
| |
- | #cssmenu ul ul li a {
| |
- | border: 0;
| |
- | background: none;
| |
- | width: auto;
| |
- | padding: 8px 35px;
| |
- | }
| |
- | #cssmenu ul ul li:hover > a {
| |
- | background: none;
| |
- | color: #8c9195;
| |
- | }
| |
- | #cssmenu ul ul ul a {
| |
- | padding: 8px 50px;
| |
- | }
| |
- | #cssmenu ul ul ul ul a {
| |
- | padding: 8px 65px;
| |
- | }
| |
- | #cssmenu ul ul ul ul ul a {
| |
- | padding: 8px 80px;
| |
- | }
| |
- | #cssmenu ul ul ul ul ul ul a {
| |
- | padding: 8px 95px;
| |
- | }
| |
- | #cssmenu > ul > #menu-button {
| |
- | display: block;
| |
- | cursor: pointer;
| |
- | }
| |
- | #cssmenu #menu-button > a {
| |
- | padding: 14px 20px;
| |
- | }
| |
- | #cssmenu ul.open li,
| |
- | #cssmenu > ul.open > li {
| |
- | display: block;
| |
- | }
| |
- | #cssmenu > ul.open > li#menu-button > a {
| |
- | color: #fff;
| |
- | border-bottom: 1px solid rgba(150, 150, 150, 0.1);
| |
- | }
| |
- | #cssmenu #menu-button::after {
| |
- | display: block;
| |
- | content: '';
| |
- | position: absolute;
| |
- | height: 3px;
| |
- | width: 22px;
| |
- | border-top: 2px solid black;
| |
- | border-bottom: 2px solid black;
| |
- | right: 20px;
| |
- | top: 15px;
| |
- | }
| |
- | #cssmenu #menu-button::before {
| |
- | display: block;
| |
- | content: '';
| |
- | position: absolute;
| |
- | height: 3px;
| |
- | width: 22px;
| |
- | border-top: 2px solid black;
| |
- | right: 20px;
| |
- | top: 25px;
| |
- | }
| |
- | #cssmenu ul.open #menu-button::after,
| |
- | #cssmenu ul.open #menu-button::before {
| |
- | border-color: #fff;
| |
- | }
| |
- | }
| |
- | #cssmenu {
| |
- | padding-left: 200px !important;
| |
- | }
| |
- |
| |
- | /* Slider */
| |
- | .rslides {
| |
- | margin: 0 auto;
| |
- | }
| |
- | .rslides_container {
| |
- | margin-bottom: 50px;
| |
- | position: relative;
| |
- | float: left;
| |
- | width: 100%;
| |
- | }
| |
- | .rslides1_nav {
| |
- | position: absolute;
| |
- | -webkit-tap-highlight-color: rgba(0,0,0,0);
| |
- | top: 50%;
| |
- | left: 0;
| |
- | z-index: 99;
| |
- | opacity: 0.7;
| |
- | text-indent: -9999px;
| |
- | overflow: hidden;
| |
- | text-decoration: none;
| |
- | height: 61px;
| |
- | width: 38px;
| |
- | background: transparent url(.!http://responsiveslides.com/with-captions/themes.gif) no-repeat left top;
| |
- | margin-top: -45px;
| |
- | }
| |
- | .rslides1_nav:active {
| |
- | opacity: 1.0;
| |
- | }
| |
- | .rslides1_nav.next {
| |
- | left: auto;
| |
- | background-position: right top;
| |
- | right: 0;
| |
- | }
| |
- | .rslides2_nav {
| |
- | position: absolute;
| |
- | -webkit-tap-highlight-color: rgba(0,0,0,0);
| |
- | top: 0;
| |
- | left: 0;
| |
- | display: block;
| |
- | background: #fff; /* Fix for IE6-9 */
| |
- | opacity: 0;
| |
- | filter: alpha(opacity=1);
| |
- | width: 48%;
| |
- | text-indent: -9999px;
| |
- | overflow: hidden;
| |
- | height: 91%;
| |
- | }
| |
- | .rslides2_nav.next {
| |
- | left: auto;
| |
- | right: 0;
| |
- | }
| |
- | .rslides3_nav {
| |
- | position: absolute;
| |
- | -webkit-tap-highlight-color: rgba(0,0,0,0);
| |
- | opacity: 0.6;
| |
- | text-indent: -9999px;
| |
- | overflow: hidden;
| |
- | top: 0;
| |
- | bottom: 0;
| |
- | left: 0;
| |
- | background: #000 url(.!http://responsiveslides.com/with-captions/themes.gif) no-repeat left 50%;
| |
- | width: 38px;
| |
- | }
| |
- | .rslides3_nav:active {
| |
- | opacity: 1.0;
| |
- | }
| |
- | .rslides3_nav.next {
| |
- | left: auto;
| |
- | background-position: right 50%;
| |
- | right: 0;
| |
- | }
| |
- | .rslides1_nav:focus,
| |
- | .rslides2_nav:focus,
| |
- | .rslides3_nav:focus {
| |
- | outline: none;
| |
- | }
| |
- | .rslides_tabs {
| |
- | margin-top: 10px;
| |
- | text-align: center;
| |
- | }
| |
- | .rslides_tabs li {
| |
- | display: inline;
| |
- | float: none;
| |
- | _float: left;
| |
- | *float: left;
| |
- | margin-right: 5px;
| |
- | }
| |
- | .rslides_tabs a {
| |
- | text-indent: -9999px;
| |
- | overflow: hidden;
| |
- | -webkit-border-radius: 15px;
| |
- | -moz-border-radius: 15px;
| |
- | border-radius: 15px;
| |
- | background: #ccc;
| |
- | background: rgba(0,0,0, .2);
| |
- | display: inline-block;
| |
- | _display: block;
| |
- | *display: block;
| |
- | -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
| |
- | -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
| |
- | box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
| |
- | width: 9px;
| |
- | height: 9px;
| |
- | }
| |
- | .rslides_tabs .rslides_here a {
| |
- | background: #222;
| |
- | background: rgba(0,0,0, .8);
| |
- | }
| |
- | .caption {
| |
- | position: absolute;
| |
- | display: block;
| |
- | bottom: 0;
| |
- | left: 0;
| |
- | right: 0;
| |
- | padding: 15px;
| |
- | text-align: center;
| |
- | background: #000;
| |
- | background: rgba(0,0,0, .8);
| |
- | color: #fff;
| |
- | }
| |
- | .rslides {
| |
- | position: relative;
| |
- | list-style: none;
| |
- | overflow: hidden;
| |
- | width: 100%;
| |
- | padding: 0;
| |
- | margin: 0;
| |
- | }
| |
- | .rslides li {
| |
- | -webkit-backface-visibility: hidden;
| |
- | position: absolute;
| |
- | display: none;
| |
- | width: 100%;
| |
- | left: 0;
| |
- | top: 0;
| |
- | }
| |
- | .rslides li:first-child {
| |
- | position: relative;
| |
- | display: block;
| |
- | float: left;
| |
- | }
| |
- | .rslides img {
| |
- | display: block;
| |
- | height: auto;
| |
- | float: left;
| |
- | width: 100%;
| |
- | border: 0;
| |
- | }
| |
- |
| |
- | </style>
| |
- |
| |
- | <body>
| |
- |
| |
- | <!-- Logo -->
| |
- | <h1><font color=black>Ravenwood</font><font color=#820909> Raptors</font></h1>
| |
- |
| |
- | <!-- Navigation -->
| |
- | <div id='cssmenu'>
| |
- | <ul>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors'><span>Home</span></a></li>
| |
- | <li class='has-sub'><a href='#'><span>Team</span></a>
| |
- | <ul>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Team/About'><span>About</span></a>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Team/Members'><span>Members</span></a>
| |
- | </ul>
| |
- | <li class='has-sub'><a href='#'><span>Project</span></a>
| |
- | <ul>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Overview'><span>Overview</span></a>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Process'><span>Process</span></a>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Results'><span>Results</span></a>
| |
- | </ul>
| |
- | <li class='has-sub'><a href='#'><span>Technicalities</span></a>
| |
- | <ul>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Technicalities/Safety'><span>Safety</span></a>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Project/Technicalities/Credits'><span>Credits</span></a>
| |
- | </ul>
| |
- | <li class='active'><a href='https://2014hs.igem.org/Team:Ravenwood_Raptors/Sponsors'><span>Sponsors</span></a>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- | <!-- Footer -->
| |
- | <h2>About</h2>
| |
- | <!-- Codes by HTML.am -->
| |
- | <p style="font-size:18px;color:orange;text-shadow:1px 1px 1px #666;">Eliot Can hack so well</p>
| |
- |
| |
- | <!-- Footer -->
| |
- | <footer class="site-footer">
| |
- | <p>
| |
- | <br>
| |
- | Send comments and suggestions to our <a href="mailto:rhsigem@gmail.com?subject=RHS iGEM Website">Webmaster</a>.<br> © 2014 Ravenwood High School iGEM
| |
- | </p>
| |
- | </footer>
| |
- |
| |
- | </body>
| |
- |
| |
- | </html>
| |