|
|
(2 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | /*!
| + | <html> |
- | * Bootstrap v3.1.1 (http://getbootstrap.com)
| + | <style type="text/css"> |
- | * Copyright 2011-2014 Twitter, Inc.
| + | |
- | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
| + | |
- | */
| + | |
| | | |
- | /*! normalize.css v3.0.0 | MIT License | git.io/normalize */
| |
| html { | | html { |
| font-family: sans-serif; | | font-family: sans-serif; |
Line 5,789: |
Line 5,785: |
| } | | } |
| } | | } |
- | /*# sourceMappingURL=bootstrap.css.map */
| |
| | | |
- | | + | </style> |
- | | + | </html> |
- | | + | |
- | | + | |
- | /* CUSTOMIZE THE NAVBAR | + | |
- | -------------------------------------------------- */
| + | |
- | | + | |
- | /* Special class on .container surrounding .navbar, used for positioning it into place. */
| + | |
- | .navbar-wrapper {
| + | |
- | position: absolute;
| + | |
- | top: 0;
| + | |
- | right: 0;
| + | |
- | left: 0;
| + | |
- | z-index: 20;
| + | |
- | }
| + | |
- | | + | |
- | /* Flip around the padding for proper display in narrow viewports */
| + | |
- | .navbar-wrapper .container {
| + | |
- | padding-right: 0;
| + | |
- | padding-left: 0;
| + | |
- | }
| + | |
- | .navbar-wrapper .navbar {
| + | |
- | padding-right: 15px;
| + | |
- | padding-left: 15px;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | /* CUSTOMIZE THE CAROUSEL
| + | |
- | -------------------------------------------------- */
| + | |
- | | + | |
- | /* Carousel base class */
| + | |
- | .carousel {
| + | |
- | height: 500px;
| + | |
- | margin-bottom: 60px;
| + | |
- | }
| + | |
- | /* Since positioning the image, we need to help out the caption */
| + | |
- | .carousel-caption {
| + | |
- | z-index: 10;
| + | |
- | }
| + | |
- | | + | |
- | /* Declare heights because of positioning of img element */
| + | |
- | .carousel .item {
| + | |
- | height: 500px;
| + | |
- | background-color: #777;
| + | |
- | }
| + | |
- | .carousel-inner > .item > img {
| + | |
- | position: absolute;
| + | |
- | top: 0;
| + | |
- | left: 0;
| + | |
- | min-width: 100%;
| + | |
- | height: 500px;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /* MARKETING CONTENT
| + | |
- | -------------------------------------------------- */
| + | |
- | | + | |
- | /* Pad the edges of the mobile views a bit */
| + | |
- | .marketing {
| + | |
- | padding-right: 15px;
| + | |
- | padding-left: 15px;
| + | |
- | }
| + | |
- | | + | |
- | /* Center align the text within the three columns below the carousel */
| + | |
- | .marketing .col-lg-4 {
| + | |
- | margin-bottom: 20px;
| + | |
- | text-align: center;
| + | |
- | }
| + | |
- | .marketing h2 {
| + | |
- | font-weight: normal;
| + | |
- | }
| + | |
- | .marketing .col-lg-4 p {
| + | |
- | margin-right: 10px;
| + | |
- | margin-left: 10px;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | /* Featurettes
| + | |
- | ------------------------- */
| + | |
- | | + | |
- | .featurette-divider {
| + | |
- | margin: 80px 0; /* Space out the Bootstrap <hr> more */
| + | |
- | }
| + | |
- | | + | |
- | /* Thin out the marketing headings */
| + | |
- | .featurette-heading {
| + | |
- | font-weight: 300;
| + | |
- | line-height: 1;
| + | |
- | letter-spacing: -1px;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /* RESPONSIVE CSS
| + | |
- | -------------------------------------------------- */
| + | |
- | | + | |
- | @media (min-width: 768px) {
| + | |
- | | + | |
- | /* Remove the edge padding needed for mobile */
| + | |
- | .marketing {
| + | |
- | padding-right: 0;
| + | |
- | padding-left: 0;
| + | |
- | }
| + | |
- | | + | |
- | /* Navbar positioning foo */
| + | |
- | .navbar-wrapper {
| + | |
- | margin-top: 20px;
| + | |
- | }
| + | |
- | .navbar-wrapper .container {
| + | |
- | padding-right: 15px;
| + | |
- | padding-left: 15px;
| + | |
- | }
| + | |
- | .navbar-wrapper .navbar {
| + | |
- | padding-right: 0;
| + | |
- | padding-left: 0;
| + | |
- | }
| + | |
- | | + | |
- | /* The navbar becomes detached from the top, so we round the corners */
| + | |
- | .navbar-wrapper .navbar {
| + | |
- | border-radius: 4px;
| + | |
- | }
| + | |
- | | + | |
- | /* Bump up size of carousel content */
| + | |
- | .carousel-caption p {
| + | |
- | margin-bottom: 20px;
| + | |
- | font-size: 21px;
| + | |
- | line-height: 1.4;
| + | |
- | }
| + | |
- | | + | |
- | .featurette-heading {
| + | |
- | font-size: 50px;
| + | |
- | }
| + | |
- | }
| + | |
- | | + | |
- | @media (min-width: 992px) {
| + | |
- | .featurette-heading {
| + | |
- | margin-top: 120px;
| + | |
- | }
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | * Globals
| + | |
- | */
| + | |
- | | + | |
- | .a-logo:hover{
| + | |
- | text-decoration: none;
| + | |
- | color: rgb(145,213,87);
| + | |
- | }
| + | |
- | | + | |
- | .a-logo{
| + | |
- | color: rgb(145,213,87);
| + | |
- | }
| + | |
- | | + | |
- | /* Links */
| + | |
- | a,
| + | |
- | a:focus,
| + | |
- | a:hover {
| + | |
- | color: #0ecd28;
| + | |
- | }
| + | |
- | | + | |
- | /* Custom default button */
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | * Base structure
| + | |
- | */
| + | |
- | | + | |
- | html, | + | |
- | body {
| + | |
- | height: 100%;
| + | |
- | }
| + | |
- | body {
| + | |
- | color: #fff;
| + | |
- | text-align: center;
| + | |
- | }
| + | |
- | | + | |
- | /* Extra markup and styles for table-esque vertical and horizontal centering */
| + | |
- | .site-wrapper {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 100%; /* For at least Firefox */
| + | |
- | min-height: 100%;
| + | |
- | background: url('../img/background/Team_Berlin_igem_background_start.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem_background_start.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub-team
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem_background_team.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub-project
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem_background_project.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub-workshop
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem_background_workshop.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub-safety
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem08_small.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-sub-contact
| + | |
- | {
| + | |
- | display: table;
| + | |
- | width: 100%;
| + | |
- | height: 370px; /* For at least Firefox */
| + | |
- | min-height: 370px;
| + | |
- | background: url('../img/background/Team_Berlin_igem02_small.jpg') no-repeat center center fixed;
| + | |
- | -webkit-background-size: cover;
| + | |
- | -moz-background-size: cover;
| + | |
- | -o-background-size: cover;
| + | |
- | background-size: cover;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-inner {
| + | |
- | display: table-cell;
| + | |
- | vertical-align: top;
| + | |
- | }
| + | |
- | .cover-container {
| + | |
- | margin-right: auto;
| + | |
- | margin-left: auto;
| + | |
- | }
| + | |
- | | + | |
- | /* Padding for spacing */
| + | |
- | .inner {
| + | |
- | | + | |
- | | + | |
- | }
| + | |
- | | + | |
- | .inner-workshop
| + | |
- | {
| + | |
- | | + | |
- | background-color: white;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | .masthead-brand {
| + | |
- | margin-top: 10px;
| + | |
- | margin-bottom: 10px;
| + | |
- | }
| + | |
- | | + | |
- | .masthead-nav > li {
| + | |
- | display: inline-block;
| + | |
- | }
| + | |
- | .masthead-nav > li + li {
| + | |
- | margin-left: 20px;
| + | |
- | }
| + | |
- | .masthead-nav > li > a {
| + | |
- | padding-right: 0;
| + | |
- | padding-left: 0;
| + | |
- | font-size: 16px;
| + | |
- | font-weight: bold;
| + | |
- | color: rgba(255,255,255,.75);
| + | |
- | border-bottom: 2px solid transparent;
| + | |
- | }
| + | |
- | .masthead-nav > li > a:hover,
| + | |
- | .masthead-nav > li > a:focus {
| + | |
- | background-color: transparent;
| + | |
- | border-bottom-color: rgba(255,255,255,.25);
| + | |
- | }
| + | |
- | .masthead-nav > .active > a,
| + | |
- | .masthead-nav > .active > a:hover,
| + | |
- | .masthead-nav > .active > a:focus {
| + | |
- | color: #fff;
| + | |
- | border-bottom-color: #fff;
| + | |
- | }
| + | |
- | | + | |
- | @media (min-width: 768px) {
| + | |
- | .masthead-brand {
| + | |
- | float: left;
| + | |
- | }
| + | |
- | .masthead-nav {
| + | |
- | float: right;
| + | |
- | }
| + | |
- | }*/
| + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | * Cover
| + | |
- | */
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | * Footer
| + | |
- | */
| + | |
- | | + | |
- | .mastfoot {
| + | |
- | color: #999; /* IE8 proofing */
| + | |
- | color: rgba(255,255,255,.5);
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | /*
| + | |
- | * Affix and center
| + | |
- | */
| + | |
- | | + | |
- | @media (min-width: 768px) {
| + | |
- | /* Pull out the header and footer */
| + | |
- | .masthead {
| + | |
- | position: fixed;
| + | |
- | top: 0;
| + | |
- | }
| + | |
- | .mastfoot {
| + | |
- | position: fixed;
| + | |
- | bottom: 0;
| + | |
- | }
| + | |
- | /* Start the vertical centering */
| + | |
- | .site-wrapper-inner {
| + | |
- | /*vertical-align: middle;*/
| + | |
- | }
| + | |
- | /* Handle the widths */
| + | |
- | .masthead,
| + | |
- | .mastfoot,
| + | |
- | .cover-container {
| + | |
- | width: 100%; /* Must be percentage or pixels for horizontal alignment */
| + | |
- | }
| + | |
- | }
| + | |
- | | + | |
- | @media (min-width: 992px) {
| + | |
- | .masthead,
| + | |
- | .mastfoot,
| + | |
- | .cover-container {
| + | |
- | width: 1017px;
| + | |
- | }
| + | |
- | }
| + | |
- | | + | |
- | .masthead{
| + | |
- | z-index: 10;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | | + | |
- | /* Media Querie small
| + | |
- | *****************/
| + | |
- | @media (max-width: 468px){
| + | |
- | .site-wrapper {
| + | |
- | /*background: rgba(0,0,0,.5);*/
| + | |
- | max-height: 400px;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper-inner{
| + | |
- | padding: 0;
| + | |
- | max-height: 400px;
| + | |
- | }
| + | |
- |
| + | |
- | .site-wrapper-sub,
| + | |
- | .site-wrapper-sub-team,
| + | |
- | .site-wrapper-sub-project,
| + | |
- | .site-wrapper-sub-workshop,
| + | |
- | .site-wrapper-sub-safety,
| + | |
- | .site-wrapper-sub-contact{
| + | |
- | background: none;
| + | |
- | height: 0;
| + | |
- | min-height: 0;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper{
| + | |
- | background: black;
| + | |
- | }
| + | |
- | }
| + | |
- | | + | |
- | @media (max-width: 768px){
| + | |
- | .site-wrapper-sub,
| + | |
- | .site-wrapper-sub-team,
| + | |
- | .site-wrapper-sub-project,
| + | |
- | .site-wrapper-sub-workshop,
| + | |
- | .site-wrapper-sub-safety,
| + | |
- | .site-wrapper-sub-contact{
| + | |
- | background: none;
| + | |
- | height: 0;
| + | |
- | min-height: 0;
| + | |
- | }
| + | |
- | | + | |
- | .site-wrapper{
| + | |
- | background: black;
| + | |
- | }
| + | |
- | }
| + | |