|
|
| (149 intermediate revisions by 5 users not shown) |
| Line 1: |
Line 1: |
| − | @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
| + | {{:Team:EPF_Lausanne/Top_Nav}} |
| − | /* ==========================================================================
| + | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr"> |
| − | HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
| + | <body> |
| − | ========================================================================== */
| + | |
| − | html,
| + | |
| − | button,
| + | |
| − | input,
| + | |
| − | select,
| + | |
| − | textarea {
| + | |
| − | color: #222;
| + | |
| − | }
| + | |
| − | body {
| + | |
| − | font-size: 1em;
| + | |
| − | line-height: 1.4;
| + | |
| − | }
| + | |
| − | ::-moz-selection {
| + | |
| − | background: #b3d4fc;
| + | |
| − | text-shadow: none;
| + | |
| − | }
| + | |
| − | ::selection {
| + | |
| − | background: #b3d4fc;
| + | |
| − | text-shadow: none;
| + | |
| − | }
| + | |
| − | hr {
| + | |
| − | display: block;
| + | |
| − | height: 1px;
| + | |
| − | border: 0;
| + | |
| − | border-top: 1px solid #ccc;
| + | |
| − | margin: 1em 0;
| + | |
| − | padding: 0;
| + | |
| − | }
| + | |
| − | img {
| + | |
| − | vertical-align: middle;
| + | |
| − | }
| + | |
| − | fieldset {
| + | |
| − | border: 0;
| + | |
| − | margin: 0;
| + | |
| − | padding: 0;
| + | |
| − | }
| + | |
| − | textarea {
| + | |
| − | resize: vertical;
| + | |
| − | }
| + | |
| − | .chromeframe {
| + | |
| − | margin: 0.2em 0;
| + | |
| − | background: #ccc;
| + | |
| − | color: #000;
| + | |
| − | padding: 0.2em 0;
| + | |
| − | }
| + | |
| − | /* ========================================================================== | + | |
| − | Helper classes
| + | |
| − | ========================================================================== */
| + | |
| − | .hidden {
| + | |
| − | display: none !important;
| + | |
| − | visibility: hidden;
| + | |
| − | } | + | |
| − | .visuallyhidden {
| + | |
| − | border: 0;
| + | |
| − | clip: rect(0 0 0 0);
| + | |
| − | height: 1px;
| + | |
| − | margin: -1px;
| + | |
| − | overflow: hidden;
| + | |
| − | padding: 0;
| + | |
| − | position: absolute;
| + | |
| − | width: 1px;
| + | |
| − | } | + | |
| − | .visuallyhidden.focusable:active,
| + | |
| − | .visuallyhidden.focusable:focus {
| + | |
| − | clip: auto;
| + | |
| − | height: auto;
| + | |
| − | margin: 0;
| + | |
| − | overflow: visible;
| + | |
| − | position: static;
| + | |
| − | width: auto;
| + | |
| − | }
| + | |
| − | .invisible {
| + | |
| − | visibility: hidden;
| + | |
| − | }
| + | |
| − | .clearfix:before,
| + | |
| − | .clearfix:after {
| + | |
| − | content: " ";
| + | |
| − | display: table;
| + | |
| − | }
| + | |
| − | .clearfix:after {
| + | |
| − | clear: both;
| + | |
| − | }
| + | |
| − | .clearfix {
| + | |
| − | *zoom: 1;
| + | |
| − | }
| + | |
| − | .text-muted {
| + | |
| − | color: #848b8f;
| + | |
| − | }
| + | |
| − | /* ==========================================================================
| + | |
| − | Forms
| + | |
| − | ========================================================================== */
| + | |
| − | form input[type="text"],
| + | |
| − | form input[type="email"],
| + | |
| − | form input[type="number"],
| + | |
| − | form input[type="password"] {
| + | |
| − | background: #fff;
| + | |
| − | color: #777;
| + | |
| − | border: 1px solid #dddddd;
| + | |
| − | padding: 12px 15px;
| + | |
| − | width: 100%;
| + | |
| − | -webkit-transition: all 250ms ease-in-out;
| + | |
| − | -moz-transition: all 250ms ease-in-out;
| + | |
| − | -o-transition: all 250ms ease-in-out;
| + | |
| − | transition: all 250ms ease-in-out;
| + | |
| − | }
| + | |
| − | form input[type="text"]:focus,
| + | |
| − | form input[type="email"]:focus,
| + | |
| − | form input[type="number"]:focus,
| + | |
| − | form input[type="password"]:focus {
| + | |
| − | -webkit-box-shadow: none !important;
| + | |
| − | -moz-box-shadow: none !important;
| + | |
| − | box-shadow: none !important;
| + | |
| − | outline: none !important;
| + | |
| − | border-color: #f57e37;
| + | |
| − | }
| + | |
| − | label {
| + | |
| − | font-weight: normal;
| + | |
| − | }
| + | |
| − | /*
| + | |
| − | * jQuery FlexSlider v2.2.0
| + | |
| − | * http://www.woothemes.com/flexslider/
| + | |
| − | *
| + | |
| − | * Copyright 2012 WooThemes
| + | |
| − | * Free to use under the GPLv2 license.
| + | |
| − | * http://www.gnu.org/licenses/gpl-2.0.html
| + | |
| − | *
| + | |
| − | * Contributing author: Tyler Smith (@mbmufffin)
| + | |
| − | */
| + | |
| − | /* Browser Resets
| + | |
| − | *********************************/
| + | |
| − | .flex-container a:active,
| + | |
| − | .flexslider a:active,
| + | |
| − | .flex-container a:focus,
| + | |
| − | .flexslider a:focus {
| + | |
| − | outline: none;
| + | |
| − | }
| + | |
| − | .slides,
| + | |
| − | .flex-control-nav,
| + | |
| − | .flex-direction-nav {
| + | |
| − | margin: 0;
| + | |
| − | padding: 0;
| + | |
| − | list-style: none;
| + | |
| − | }
| + | |
| − | /* Icon Fonts
| + | |
| − | *********************************/
| + | |
| − | /* Font-face Icons */
| + | |
| − | @font-face {
| + | |
| − | font-family: 'flexslider-icon';
| + | |
| − | src: url('../fonts/flexslider-icon.eot');
| + | |
| − | src: url('../fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('../fonts/flexslider-icon.woff') format('woff'), url('../fonts/flexslider-icon.ttf') format('truetype'), url('../fonts/flexslider-icon.svg#flexslider-icon') format('svg');
| + | |
| − | font-weight: normal;
| + | |
| − | font-style: normal;
| + | |
| − | }
| + | |
| − | /* FlexSlider Necessary Styles
| + | |
| − | *********************************/
| + | |
| − | .flexslider {
| + | |
| − | margin: 0;
| + | |
| − | padding: 0;
| + | |
| − | }
| + | |
| − | .flexslider .slides > li {
| + | |
| − | display: none;
| + | |
| − | -webkit-backface-visibility: hidden;
| + | |
| − | }
| + | |
| − | /* Hide the slides before the JS is loaded. Avoids image jumping */
| + | |
| − | .flexslider .slides img {
| + | |
| − | width: 100%;
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | .flex-pauseplay span {
| + | |
| − | text-transform: capitalize;
| + | |
| − | }
| + | |
| − | /* Clearfix for the .slides element */
| + | |
| − | .slides:after {
| + | |
| − | content: ".";
| + | |
| − | display: block;
| + | |
| − | clear: both;
| + | |
| − | visibility: hidden;
| + | |
| − | line-height: 0;
| + | |
| − | height: 0;
| + | |
| − | }
| + | |
| − | html[xmlns] .slides {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | * html .slides {
| + | |
| − | height: 1%;
| + | |
| − | }
| + | |
| − | /* No JavaScript Fallback */
| + | |
| − | /* If you are not using another script, such as Modernizr, make sure you
| + | |
| − | * include js that eliminates this class on page load */
| + | |
| − | .no-js .slides > li:first-child {
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | /* FlexSlider Default Theme
| + | |
| − | *********************************/
| + | |
| − | .flexslider {
| + | |
| − | margin: 0;
| + | |
| − | background: transparent;
| + | |
| − | position: relative;
| + | |
| − | zoom: 1;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .flex-viewport {
| + | |
| − | max-height: 2000px;
| + | |
| − | -webkit-transition: all 1s ease;
| + | |
| − | -moz-transition: all 1s ease;
| + | |
| − | -o-transition: all 1s ease;
| + | |
| − | transition: all 1s ease;
| + | |
| − | }
| + | |
| − | .loading .flex-viewport {
| + | |
| − | max-height: 300px;
| + | |
| − | }
| + | |
| − | .flexslider .slides {
| + | |
| − | zoom: 1;
| + | |
| − | }
| + | |
| − | .carousel li {
| + | |
| − | margin-right: 5px;
| + | |
| − | }
| + | |
| − | /* Direction Nav */
| + | |
| − | .flex-direction-nav {
| + | |
| − | *height: 0;
| + | |
| − | }
| + | |
| − | .flex-direction-nav a {
| + | |
| − | text-decoration: none;
| + | |
| − | display: block;
| + | |
| − | width: 40px;
| + | |
| − | height: 40px;
| + | |
| − | margin: -20px 0 0;
| + | |
| − | position: absolute;
| + | |
| − | top: 50%;
| + | |
| − | z-index: 10;
| + | |
| − | overflow: hidden;
| + | |
| − | opacity: 0;
| + | |
| − | cursor: pointer;
| + | |
| − | -webkit-transition: all .3s ease;
| + | |
| − | -moz-transition: all .3s ease;
| + | |
| − | transition: all .3s ease;
| + | |
| − | }
| + | |
| − | .flex-direction-nav .flex-prev {
| + | |
| − | left: -50px;
| + | |
| − | }
| + | |
| − | .flex-direction-nav .flex-next {
| + | |
| − | right: -50px;
| + | |
| − | text-align: right;
| + | |
| − | }
| + | |
| − | .flexslider:hover .flex-prev {
| + | |
| − | opacity: 1;
| + | |
| − | left: 30px;
| + | |
| − | }
| + | |
| − | .flexslider:hover .flex-next {
| + | |
| − | opacity: 1;
| + | |
| − | right: 30px;
| + | |
| − | }
| + | |
| − | .flexslider:hover .flex-next:hover,
| + | |
| − | .flexslider:hover .flex-prev:hover {
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | .flex-direction-nav .flex-disabled {
| + | |
| − | opacity: 0!important;
| + | |
| − | filter: alpha(opacity=0);
| + | |
| − | cursor: default;
| + | |
| − | }
| + | |
| − | .flex-direction-nav a:before {
| + | |
| − | font-family: "flexslider-icon";
| + | |
| − | color: #fff;
| + | |
| − | font-size: 24px;
| + | |
| − | line-height: 1;
| + | |
| − | display: inline-block;
| + | |
| − | content: '\f001';
| + | |
| − | }
| + | |
| − | .flex-direction-nav a.flex-next:before {
| + | |
| − | content: '\f002';
| + | |
| − | }
| + | |
| − | /* Pause/Play */
| + | |
| − | .flex-pauseplay a {
| + | |
| − | display: block;
| + | |
| − | width: 20px;
| + | |
| − | height: 20px;
| + | |
| − | position: absolute;
| + | |
| − | bottom: 5px;
| + | |
| − | left: 10px;
| + | |
| − | opacity: 0.8;
| + | |
| − | z-index: 10;
| + | |
| − | overflow: hidden;
| + | |
| − | cursor: pointer;
| + | |
| − | color: #000;
| + | |
| − | }
| + | |
| − | .flex-pauseplay a:before {
| + | |
| − | font-family: "flexslider-icon";
| + | |
| − | font-size: 20px;
| + | |
| − | display: inline-block;
| + | |
| − | content: '\f004';
| + | |
| − | }
| + | |
| − | .flex-pauseplay a:hover {
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | .flex-pauseplay a.flex-play:before {
| + | |
| − | content: '\f003';
| + | |
| − | }
| + | |
| − | /* Control Nav */
| + | |
| − | .flex-control-nav {
| + | |
| − | width: 100%;
| + | |
| − | position: absolute;
| + | |
| − | bottom: -40px;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .flex-control-nav li {
| + | |
| − | margin: 0 6px;
| + | |
| − | display: inline-block;
| + | |
| − | zoom: 1;
| + | |
| − | *display: inline;
| + | |
| − | }
| + | |
| − | .flex-control-paging li a {
| + | |
| − | width: 11px;
| + | |
| − | height: 11px;
| + | |
| − | display: block;
| + | |
| − | background: #666;
| + | |
| − | background: rgba(0, 0, 0, 0.5);
| + | |
| − | cursor: pointer;
| + | |
| − | text-indent: -9999px;
| + | |
| − | -webkit-border-radius: 20px;
| + | |
| − | -moz-border-radius: 20px;
| + | |
| − | -o-border-radius: 20px;
| + | |
| − | border-radius: 20px;
| + | |
| − | -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
| + | |
| − | -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
| + | |
| − | -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
| + | |
| − | box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
| + | |
| − | }
| + | |
| − | .flex-control-paging li a:hover {
| + | |
| − | background: #333;
| + | |
| − | background: rgba(0, 0, 0, 0.7);
| + | |
| − | }
| + | |
| − | .flex-control-paging li a.flex-active {
| + | |
| − | background: #000;
| + | |
| − | background: rgba(0, 0, 0, 0.9);
| + | |
| − | cursor: default;
| + | |
| − | }
| + | |
| − | .flex-control-thumbs {
| + | |
| − | margin: 5px 0 0;
| + | |
| − | position: static;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .flex-control-thumbs li {
| + | |
| − | width: 25%;
| + | |
| − | float: left;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | .flex-control-thumbs img {
| + | |
| − | width: 100%;
| + | |
| − | display: block;
| + | |
| − | opacity: .7;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| − | .flex-control-thumbs img:hover {
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | .flex-control-thumbs .flex-active {
| + | |
| − | opacity: 1;
| + | |
| − | cursor: default;
| + | |
| − | }
| + | |
| − | @media screen and (max-width: 860px) {
| + | |
| − | .flex-direction-nav .flex-prev {
| + | |
| − | opacity: 1;
| + | |
| − | left: 10px;
| + | |
| − | }
| + | |
| − | .flex-direction-nav .flex-next {
| + | |
| − | opacity: 1;
| + | |
| − | right: 10px;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | #lightbox {
| + | |
| − | cursor: pointer;
| + | |
| − | position: fixed;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | background: #000000;
| + | |
| − | /* IE Fallback (Solid Colour) */
| + | |
| − | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAIElEQVQ4T2NkYGDYDMRkA8ZRAxhGw4BhNAyA+WAYpAMAIFgLQfO9BoEAAAAASUVORK5CYII=);
| + | |
| − | background: rgba(0, 0, 0, 0.7);
| + | |
| − | -webkit-filter: none !important;
| + | |
| − | z-index: 99999;
| + | |
| − | }
| + | |
| − | #lightbox img {
| + | |
| − | display: block;
| + | |
| − | position: absolute;
| + | |
| − | border: 5px solid #fff;
| + | |
| − | box-shadow: 0 0 20px #000;
| + | |
| − | border-radius: 1px;
| + | |
| − | }
| + | |
| − | body.blurred > * {
| + | |
| − | -webkit-filter: blur(2px);
| + | |
| − | }
| + | |
| − | .lightbox-loading {
| + | |
| − | background: url(https://static.igem.org/mediawiki/2015/6/69/EPF_Lausanne_Loading.gif) center center no-repeat;
| + | |
| − | width: 31px;
| + | |
| − | height: 31px;
| + | |
| − | margin: -16px 0 0 -16px;
| + | |
| − | position: absolute;
| + | |
| − | top: 48%;
| + | |
| − | left: 50%;
| + | |
| − | }
| + | |
| − | .lightbox-caption {
| + | |
| − | display: none;
| + | |
| − | position: absolute;
| + | |
| − | left: 0;
| + | |
| − | bottom: 0;
| + | |
| − | width: 100%;
| + | |
| − | text-align: center;
| + | |
| − | z-index: 1000;
| + | |
| − | background: #000;
| + | |
| − | background: rgba(0, 0, 0, 0.7);
| + | |
| − | }
| + | |
| − | .lightbox-caption p {
| + | |
| − | margin: 0 auto;
| + | |
| − | max-width: 70%;
| + | |
| − | display: inline-block;
| + | |
| − | *display: inline;
| + | |
| − | *zoom: 1;
| + | |
| − | padding: 10px;
| + | |
| − | color: #fff;
| + | |
| − | font-size: 12px;
| + | |
| − | line-height: 18px;
| + | |
| − | }
| + | |
| − | .lightbox-button {
| + | |
| − | position: absolute;
| + | |
| − | z-index: 9999;
| + | |
| − | background: no-repeat center center;
| + | |
| − | width: 32px;
| + | |
| − | height: 32px;
| + | |
| − | opacity: 0.4;
| + | |
| − | -webkit-transition: all 0.3s;
| + | |
| − | -moz-transition: all 0.3s;
| + | |
| − | -ms-transition: all 0.3s;
| + | |
| − | transition: all 0.3s;
| + | |
| − | }
| + | |
| − | .lightbox-button:hover,
| + | |
| − | .lightbox-button:focus {
| + | |
| − | opacity: 1;
| + | |
| − | -webkit-transform: scale(1.4);
| + | |
| − | -moz-transform: scale(1.4);
| + | |
| − | -ms-transform: scale(1.4);
| + | |
| − | transform: scale(1.4);
| + | |
| − | }
| + | |
| − | .lightbox-close {
| + | |
| − | right: 10px;
| + | |
| − | top: 10px;
| + | |
| − | background-image: url('https://static.igem.org/mediawiki/2015/7/71/EPF_Lausanne_Close.png');
| + | |
| − | }
| + | |
| − | .lightbox-next {
| + | |
| − | right: 10px;
| + | |
| − | top: 48%;
| + | |
| − | background-image: url('https://static.igem.org/mediawiki/2015/5/5f/EPF_Lausanne_Next.png');
| + | |
| − | }
| + | |
| − | .lightbox-previous {
| + | |
| − | left: 10px;
| + | |
| − | top: 48%;
| + | |
| − | background-image: url('https://static.igem.org/mediawiki/2015/6/62/EPF_Lausanne_Previous.png');
| + | |
| − | }
| + | |
| − | /* ==========================================================================
| + | |
| − | Print styles
| + | |
| − | ========================================================================== */
| + | |
| − | @media print {
| + | |
| − | * {
| + | |
| − | background: transparent !important;
| + | |
| − | color: #000 !important;
| + | |
| − | /* Black prints faster: h5bp.com/s */
| + | |
| − | box-shadow: none !important;
| + | |
| − | text-shadow: none !important;
| + | |
| − | }
| + | |
| − | a,
| + | |
| − | a:visited {
| + | |
| − | text-decoration: underline;
| + | |
| − | }
| + | |
| − | a[href]:after {
| + | |
| − | content: " (" attr(href) ")";
| + | |
| − | }
| + | |
| − | abbr[title]:after {
| + | |
| − | content: " (" attr(title) ")";
| + | |
| − | }
| + | |
| − | /*
| + | |
| − | * Don't show links for images, or javascript/internal links
| + | |
| − | */
| + | |
| − | .ir a:after,
| + | |
| − | a[href^="javascript:"]:after,
| + | |
| − | a[href^="#"]:after {
| + | |
| − | content: "";
| + | |
| − | }
| + | |
| − | pre,
| + | |
| − | blockquote {
| + | |
| − | border: 1px solid #999;
| + | |
| − | page-break-inside: avoid;
| + | |
| − | }
| + | |
| − | thead {
| + | |
| − | display: table-header-group;
| + | |
| − | /* h5bp.com/t */
| + | |
| − | }
| + | |
| − | tr,
| + | |
| − | img {
| + | |
| − | page-break-inside: avoid;
| + | |
| − | }
| + | |
| − | img {
| + | |
| − | max-width: 100% !important;
| + | |
| − | }
| + | |
| − | @page {
| + | |
| − | margin: 0.5cm;
| + | |
| − | }
| + | |
| − | p,
| + | |
| − | h2,
| + | |
| − | h3 {
| + | |
| − | orphans: 3;
| + | |
| − | widows: 3;
| + | |
| − | }
| + | |
| − | h2,
| + | |
| − | h3 {
| + | |
| − | page-break-after: avoid;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | /* ==========================================================================
| + | |
| − | Structure & Defaults
| + | |
| − | ========================================================================== */
| + | |
| − | html,
| + | |
| − | body { | + | |
| − | font-size: 100%;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | }
| + | |
| − | body {
| + | |
| − | background: #ffffff;
| + | |
| − | color: #777777;
| + | |
| − | font-size: 13px;
| + | |
| − | line-height: 24px;
| + | |
| − | font-family: 'Open Sans', sans-serif;
| + | |
| − | }
| + | |
| − | a {
| + | |
| − | color: #39c8e2;
| + | |
| − | text-decoration: none !important;
| + | |
| − | -webkit-transition: color 200ms ease-in-out;
| + | |
| − | -moz-transition: color 200ms ease-in-out;
| + | |
| − | -o-transition: color 200ms ease-in-out;
| + | |
| − | transition: color 200ms ease-in-out;
| + | |
| − | }
| + | |
| − | a:hover {
| + | |
| − | color: #232323;
| + | |
| − | }
| + | |
| − | h1,
| + | |
| − | h2,
| + | |
| − | h3,
| + | |
| − | h4,
| + | |
| − | h5,
| + | |
| − | h6 {
| + | |
| − | font-family: 'Open Sans', sans-serif;
| + | |
| − | font-weight: 500;
| + | |
| − | }
| + | |
| − | /* ==========================================================================
| + | |
| − | Header
| + | |
| − | ========================================================================== */
| + | |
| | | | |
| − | .dropdown:hover .dropdown-menu { | + | <div class="carousel slide" id="carousel-home"> |
| − | display: block;
| + | <div class="carousel-inner"> |
| − | }
| + | <div class="item active"> |
| | + | <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2015/4/4b/EPF_Lausanne_Home1.png" alt="First slide"> |
| | + | </div> |
| | + | <div class="item"> |
| | + | <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2015/6/60/EPF_Lausanne_Home5.png" alt="Second slide"> |
| | + | </div> |
| | + | <div class="item"> |
| | + | <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2015/4/4b/EPF_Lausanne_Home2.png" alt="Third slide"> |
| | + | </div> |
| | + | <div class="item"> |
| | + | <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2015/9/9b/EPF_Lausanne_Home3.png" alt="Fourth slide"> |
| | + | </div> |
| | + | <div class="item"> |
| | + | <img class="img-responsive center-block" src="https://static.igem.org/mediawiki/2015/1/1a/EPF_Lausanne_Home4.png" alt="Fifth slide"> |
| | + | </div> |
| | + | </div> |
| | + | <a href="#carousel-home" class="left carousel-control" data-slide="prev"> |
| | + | <span class="icon-prev"></span> |
| | + | </a><!-- end left control --> |
| | + | <a href="#carousel-home" class="right carousel-control" data-slide="next"> |
| | + | <span class="icon-next"></span> |
| | + | </a> |
| | + | </div> |
| | | | |
| − | .navbar {
| + | |
| − | margin-bottom: 0; | + | <section id="features"> |
| − | }
| + | <div id="Tour-section"> |
| − | .navbar-default .navbar-toggle {
| + | <img src="https://static.igem.org/mediawiki/2015/f/f6/EPF_Lausanne_Home_Button.png" alt="Take a tour" usemap="#TakeTour"> |
| − | background-color: #fff;
| + | |
| − | border-color: #fff;
| + | <map name="TakeTour"> |
| − | font-size: 14px;
| + | <area shape="circle" coords="162,250,105" alt="Project" href="https://2015.igem.org/Team:EPF_Lausanne/Project/Description"> |
| − | color: #39c8e2;
| + | <area shape="circle" coords="452,120,95" alt="Design" href="https://2015.igem.org/Team:EPF_Lausanne/Design"> |
| − | margin-top: 18px;
| + | <area shape="circle" coords="1002,160,110" alt="Results" href="https://2015.igem.org/Team:EPF_Lausanne/Results"> |
| − | -webkit-border-radius: 0;
| + | <area shape="circle" coords="642,360,160" alt="Tour" href="https://2015.igem.org/Team:EPF_Lausanne/Project/Description"> |
| − | -webkit-background-clip: padding-box;
| + | <area shape="circle" coords="962,540,105" alt="Modeling" href="https://2015.igem.org/Team:EPF_Lausanne/Modeling"> |
| − | -moz-border-radius: 0;
| + | <area shape="circle" coords="352,560,120" alt="Practices" href="https://2015.igem.org/Team:EPF_Lausanne/Practices"> |
| − | -moz-background-clip: padding;
| + | <area shape="circle" coords="1154,477,50" alt="meetus" href="https://2015.igem.org/Team:EPF_Lausanne/Team/Meet"> |
| − | border-radius: 0;
| + | </map> |
| − | background-clip: padding-box;
| + | </div> |
| − | }
| + | |
| − | .navbar-default .navbar-toggle:hover,
| + | </section> |
| − | .navbar-default .navbar-toggle:focus {
| + | </body> |
| − | background-color: #fff;
| + | </html> |
| − | border: 1px solid #fff;
| + | {{:Team:EPF_Lausanne/Footer}} |
| − | }
| + | |
| − | .navbar-default .navbar-collapse,
| + | |
| − | .navbar-default .navbar-form {
| + | |
| − | border-color: #fff;
| + | |
| − | }
| + | |
| − | .navbar-default {
| + | |
| − | background-color: transparent;
| + | |
| − | border-color: transparent;
| + | |
| − | }
| + | |
| − | .navbar-header {
| + | |
| − | padding-bottom: 15px;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-nav > li > a {
| + | |
| − | color: #ffffff;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-size: 14px;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-nav > li > a:hover {
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-nav > li {
| + | |
| − | border-right: 1px solid #1eb0ca;
| + | |
| − | padding: 10px;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-nav > li:first-child {
| + | |
| − | border-left: 1px solid #1eb0ca;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-brand {
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-size: 32px;
| + | |
| − | font-weight: 700;
| + | |
| − | color: #fff;
| + | |
| − | padding-top: 25px;
| + | |
| − | padding-bottom: 25px;
| + | |
| − | }
| + | |
| − | .navbar-default .navbar-brand:hover {
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .site-header {
| + | |
| − | background-color: #39c8e2;
| + | |
| − | color: #ffffff;
| + | |
| − | }
| + | |
| − | .site-slider {
| + | |
| − | position: relative;
| + | |
| − | z-index: 16;
| + | |
| − | }
| + | |
| − | .site-slider .slide {
| + | |
| − | position: relative;
| + | |
| − | }
| + | |
| − | .site-slider .overlay {
| + | |
| − | background-color: rgba(0, 0, 0, 0.3);
| + | |
| − | position: absolute;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | z-index: 9;
| + | |
| − | }
| + | |
| − | .site-slider .slider-caption {
| + | |
| − | position: absolute;
| + | |
| − | z-index: 12;
| + | |
| − | width: 100%;
| + | |
| − | top: 30%;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .site-slider .slider-caption .title {
| + | |
| − | width: 276px;
| + | |
| − | margin: 0 auto;
| + | |
| − | border: 4px solid #fff;
| + | |
| − | padding: 40px 40px 20px 40px;
| + | |
| − | text-align: center;
| + | |
| − | }
| + | |
| − | .site-slider .slider-caption .title h2 {
| + | |
| − | margin: 0 0 20px 0;
| + | |
| − | font-size: 28px;
| + | |
| − | color: #fff;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 700;
| + | |
| − | }
| + | |
| − | .site-slider .slider-caption .slider-button {
| + | |
| − | color: #fff;
| + | |
| − | margin-top: 60px;
| + | |
| − | display: inline-block;
| + | |
| − | border: 2px solid #fff;
| + | |
| − | padding: 7px 45px;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 700;
| + | |
| − | -webkit-border-radius: 3px;
| + | |
| − | -webkit-background-clip: padding-box;
| + | |
| − | -moz-border-radius: 3px;
| + | |
| − | -moz-background-clip: padding;
| + | |
| − | border-radius: 3px;
| + | |
| − | background-clip: padding-box;
| + | |
| − | }
| + | |
| − | .col-centered{
| + | |
| − | float: none; | + | |
| − | margin: 0 auto;
| + | |
| − | }
| + | |
| − | .first-section {
| + | |
| − | color: #E6E6E6;
| + | |
| − | position: relative;
| + | |
| − | z-index: 17;
| + | |
| − | padding: 20px 0;
| + | |
| − | margin-top: -86px;
| + | |
| − | background-color: #2E2E2E;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .first-section h3 {
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 500;
| + | |
| − | font-size: 24px;
| + | |
| − | color: #39c8e2;
| + | |
| − | }
| + | |
| − | .first-section h2 {
| + | |
| − | text-align: center;
| + | |
| − | color: #39c8e2;
| + | |
| − | font-weight: 400;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | .first-section .image-holder {
| + | |
| − | margin-top: 50px;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .second-section {
| + | |
| − | color: #333333;
| + | |
| − | position: relative;
| + | |
| − | z-index: 18;
| + | |
| − | padding: 40px 0;
| + | |
| − | margin-top: -40px;
| + | |
| − | background-color: #EBEBEB;
| + | |
| − | /*background-size: cover;*/
| + | |
| − | }
| + | |
| − | .second-section h3 {
| + | |
| − | text-align: center;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 500;
| + | |
| − | font-size: 24px;
| + | |
| − | color: #000066;
| + | |
| − | }
| + | |
| − | .second-section h2 {
| + | |
| − | text-align: center;
| + | |
| − | color: #191975;
| + | |
| − | font-weight: 400;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | .second-section p {
| + | |
| − | font-size: 16px;
| + | |
| − | color : #2F2F2F;
| + | |
| − | }
| + | |
| − | .second-section .col-md-3 {
| + | |
| − | margin-top: 60px;
| + | |
| − | }
| + | |
| − | .second-section h4 {
| + | |
| − | font-size: 16px;
| + | |
| − | font-weight: 600;
| + | |
| − | }
| + | |
| − | .third-section {
| + | |
| − | color: #fff;
| + | |
| − | position: relative;
| + | |
| − | z-index: 19;
| + | |
| − | padding: 80px 0 20px 0;
| + | |
| − | margin-top: -20px;
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/d/d7/EPF_Lausanne_Bg3.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .third-section h2 {
| + | |
| − | text-align: center;
| + | |
| − | color: #39c8e2;
| + | |
| − | font-weight: 700;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | .third-section span {
| + | |
| − | display: block;
| + | |
| − | margin-bottom: 30px;
| + | |
| − | }
| + | |
| − | .third-section .col-md-6 {
| + | |
| − | margin-bottom: 60px;
| + | |
| − | }
| + | |
| − | .third-section ol {
| + | |
| − | margin-bottom: 30px;
| + | |
| − | }
| + | |
| − | .third-section ol li {
| + | |
| − | color: #39c8e2;
| + | |
| − | }
| + | |
| − | .third-section ol li h4 {
| + | |
| − | font-size: 15px;
| + | |
| − | margin: 0;
| + | |
| − | }
| + | |
| − | .third-section ol li p {
| + | |
| − | margin: 0 0 20px 20px;
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .third-section ol li ol {
| + | |
| − | margin: 0 0 30px 20px;
| + | |
| − | }
| + | |
| − | .third-section ol.no-color li {
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .fourth-section {
| + | |
| − | color: #fff;
| + | |
| − | position: relative;
| + | |
| − | z-index: 19;
| + | |
| − | padding: 150px 0;
| + | |
| − | margin-top: -50px;
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/2/26/EPF_Lausanne_Bg4.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .fourth-section h2 {
| + | |
| − | font-size: 32px;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 700;
| + | |
| − | margin: 0 0 20px 0;
| + | |
| − | }
| + | |
| − | .fourth-section a {
| + | |
| − | font-size: 18px;
| + | |
| − | }
| + | |
| − | .fourth-section a:hover {
| + | |
| − | color: #39c8e2;
| + | |
| − | }
| + | |
| − | .page-h {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/a/ad/EPF_Lausanne_Headerbg.png') no-repeat bottom center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 60px 0;
| + | |
| − | }
| + | |
| − | .page-h h3 {
| + | |
| − | font-size: 28px;
| + | |
| − | color: #fff;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 600;
| + | |
| − | }
| + | |
| − | .filter {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/e/e6/EPF_Lausanne_Filterbg.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 50px 0;
| + | |
| − | margin-top: -60px;
| + | |
| − | }
| + | |
| − | .filter ul {
| + | |
| − | padding: 0;
| + | |
| − | margin: 0;
| + | |
| − | list-style: none;
| + | |
| − | }
| + | |
| − | .filter ul li {
| + | |
| − | display: inline-block;
| + | |
| − | margin: 0 20px;
| + | |
| − | color: #fff;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| − | .filter ul li.active {
| + | |
| − | color: #39c8e2;
| + | |
| − | }
| + | |
| − | .products {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/9/92/EPF_Lausanne_Productsbg.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 120px 0 80px 0;
| + | |
| − | margin-top: -40px;
| + | |
| − | }
| + | |
| − | .products .thumb-p {
| + | |
| − | overflow: hidden;
| + | |
| − | position: relative;
| + | |
| − | -webkit-border-radius: 6px;
| + | |
| − | -webkit-background-clip: padding-box;
| + | |
| − | -moz-border-radius: 6px;
| + | |
| − | -moz-background-clip: padding;
| + | |
| − | border-radius: 6px;
| + | |
| − | background-clip: padding-box;
| + | |
| − | }
| + | |
| − | .products .thumb-p img {
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | .products .thumb-p .overlay-p {
| + | |
| − | background-color: #39c8e2;
| + | |
| − | position: absolute;
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | top: 0;
| + | |
| − | left: 0;
| + | |
| − | -webkit-border-radius: 6px;
| + | |
| − | -webkit-background-clip: padding-box;
| + | |
| − | -moz-border-radius: 6px;
| + | |
| − | -moz-background-clip: padding;
| + | |
| − | border-radius: 6px;
| + | |
| − | background-clip: padding-box;
| + | |
| − | -webkit-transform: scaleY(0);
| + | |
| − | -moz-transform: scaleY(0);
| + | |
| − | -o-transform: scaleY(0);
| + | |
| − | -ms-transform: scaleY(0);
| + | |
| − | transform: scaleY(0);
| + | |
| − | -webkit-transition: all 200ms ease-in-out;
| + | |
| − | -moz-transition: all 200ms ease-in-out;
| + | |
| − | -o-transition: all 200ms ease-in-out;
| + | |
| − | transition: all 200ms ease-in-out;
| + | |
| − | }
| + | |
| − | .products .thumb-p .overlay-p a {
| + | |
| − | position: absolute;
| + | |
| − | top: 50%;
| + | |
| − | left: 50%;
| + | |
| − | margin: -7px 0 0 -8px;
| + | |
| − | font-size: 18px;
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .products .thumb-p:hover .overlay-p {
| + | |
| − | -webkit-transform: scaleY(1);
| + | |
| − | -moz-transform: scaleY(1);
| + | |
| − | -o-transform: scaleY(1);
| + | |
| − | -ms-transform: scaleY(1);
| + | |
| − | transform: scaleY(1);
| + | |
| − | }
| + | |
| − | .products .content-p {
| + | |
| − | margin-bottom: 40px;
| + | |
| − | }
| + | |
| − | .products .content-p h4 {
| + | |
| − | font-size: 16px;
| + | |
| − | font-weight: 700;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #000;
| + | |
| − | margin: 15px 0 5px 0;
| + | |
| − | }
| + | |
| − | .products .content-p span {
| + | |
| − | font-size: 12px;
| + | |
| − | font-weight: 300;
| + | |
| − | text-transform: uppercase;
| + | |
| − | color: #000;
| + | |
| − | }
| + | |
| − | #Grid .mix {
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | button.main-button,
| + | |
| − | .main-button {
| + | |
| − | background-color: #39c8e2;
| + | |
| − | color: #fff;
| + | |
| − | padding: 10px 15px;
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-weight: 700;
| + | |
| − | outline: 0;
| + | |
| − | border: 0;
| + | |
| − | -webkit-border-radius: 4px;
| + | |
| − | -webkit-background-clip: padding-box;
| + | |
| − | -moz-border-radius: 4px;
| + | |
| − | -moz-background-clip: padding;
| + | |
| − | border-radius: 4px;
| + | |
| − | background-clip: padding-box;
| + | |
| − | }
| + | |
| − | .contact {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/9/92/EPF_Lausanne_Contactbg.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 120px 0;
| + | |
| − | margin-top: -55px;
| + | |
| − | }
| + | |
| − | .contact fieldset {
| + | |
| − | margin-bottom: 30px;
| + | |
| − | }
| + | |
| − | .contact fieldset input,
| + | |
| − | .contact fieldset textarea {
| + | |
| − | width: 100%;
| + | |
| − | min-width: 100%;
| + | |
| − | max-width: 100%;
| + | |
| − | background: rgba(250, 250, 250, 0.7);
| + | |
| − | border: 1px solid #999;
| + | |
| − | color: #777;
| + | |
| − | }
| + | |
| − | .contact fieldset input:focus,
| + | |
| − | .contact fieldset textarea:focus {
| + | |
| − | border: 1px solid #39c8e2;
| + | |
| − | outline: 0;
| + | |
| − | }
| + | |
| − | .contact fieldset textarea {
| + | |
| − | padding: 15px;
| + | |
| − | }
| + | |
| − | .page-h.promotion {
| + | |
| − | padding-bottom: 100px;
| + | |
| − | }
| + | |
| − | .video-featured {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/2/25/EPF_Lausanne_Bg1.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 160px 0;
| + | |
| − | margin-top: -130px;
| + | |
| − | }
| + | |
| − | .video-featured .video-holder {
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .video-featured .video-holder iframe {
| + | |
| − | width: 100%;
| + | |
| − | }
| + | |
| − | .promotion-s {
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/8/8d/EPF_Lausanne_Promotionbg.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | padding: 180px 0 120px 0;
| + | |
| − | margin-top: -120px;
| + | |
| − | }
| + | |
| − | .product-left {
| + | |
| − | color: #444444;
| + | |
| − | padding-right: 30px;
| + | |
| − | }
| + | |
| − | .product-left h3 {
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-size: 18px;
| + | |
| − | font-weight: 700;
| + | |
| − | }
| + | |
| − | .product-left .product-image {
| + | |
| − | margin-right: 15px;
| + | |
| − | float: left;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .product-content {
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | .product-content h3 {
| + | |
| − | text-transform: uppercase;
| + | |
| − | font-size: 18px;
| + | |
| − | font-weight: 700;
| + | |
| − | }
| + | |
| − | .product-right {
| + | |
| − | padding-left: 30px;
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .product-right .product-image {
| + | |
| − | float: right;
| + | |
| − | overflow: hidden;
| + | |
| − | margin-left: 15px;
| + | |
| − | }
| + | |
| − | /* | + | |
| − | .site-footer {
| + | |
| − | position: relative;
| + | |
| − | z-index: 19;
| + | |
| − | padding: 100px 0 40px 0;
| + | |
| − | margin-top: -70px;
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/a/a7/EPF_Lausanne_Footerbg.png') no-repeat top center;
| + | |
| − | background-size: cover;
| + | |
| − | }
| + | |
| − | .site-footer ul.social {
| + | |
| − | width: 120px;
| + | |
| − | height: 120px;
| + | |
| − | overflow: hidden;
| + | |
| − | padding: 0;
| + | |
| − | margin: 0 auto;
| + | |
| − | list-style: none;
| + | |
| − | position: relative;
| + | |
| − | background: url('https://static.igem.org/mediawiki/2015/3/3d/EPF_LausanneSocialbg.png') no-repeat center;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li {
| + | |
| − | display: inline-block; | + | |
| − | position: absolute;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li a {
| + | |
| − | width: 32px;
| + | |
| − | height: 32px;
| + | |
| − | text-align: center;
| + | |
| − | line-height: 32px;
| + | |
| − | -webkit-border-radius: 3px;
| + | |
| − | -webkit-background-clip: padding-box;
| + | |
| − | -moz-border-radius: 3px;
| + | |
| − | -moz-background-clip: padding;
| + | |
| − | border-radius: 3px;
| + | |
| − | background-clip: padding-box;
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.facebook {
| + | |
| − | top: 0;
| + | |
| − | left: 46px;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.facebook a {
| + | |
| − | background-color: #4c66a4;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.twitter {
| + | |
| − | top: 46px;
| + | |
| − | left: 0;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.twitter a {
| + | |
| − | background-color: #55acee;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.linkedin {
| + | |
| − | top: 46px;
| + | |
| − | left: 88px;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.linkedin a {
| + | |
| − | background-color: #006699;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.rss {
| + | |
| − | top: 88px;
| + | |
| − | left: 46px;
| + | |
| − | }
| + | |
| − | .site-footer ul.social li.rss a {
| + | |
| − | background-color: #fb6405;
| + | |
| − | }
| + | |
| − | .site-footer p {
| + | |
| − | display: block;
| + | |
| − | }*/
| + | |
| − | /* Medium devices (desktops, 992px and up) */ | + | |
| − | @media (max-width: 992px) {
| + | |
| − | .slider-button {
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | /* Small devices (tablets, 768px and up) */ | + | |
| − | @media (max-width: 768px) {
| + | |
| − | .slider-caption {
| + | |
| − | display: none;
| + | |
| − | }
| + | |
| − | .first-section {
| + | |
| − | background-position: left;
| + | |
| − | margin-top: -20px;
| + | |
| − | }
| + | |
| − | .contact form {
| + | |
| − | margin-top: 60px;
| + | |
| − | }
| + | |
| − | .product-left {
| + | |
| − | color: #fff;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | /* ==========================================================================
| + | |
| − | Media Queries
| + | |
| − | ========================================================================== */
| + | |
