|
|
| Line 72: |
Line 72: |
| | | | |
| | <br> | | <br> |
| − | <style>
| + | |
| − | #banner {
| + | |
| − | margin-bottom: 50px;
| + | |
| − | margin-top: 0px;
| + | |
| − |
| + | |
| − | width: 100%;
| + | |
| − |
| + | |
| − | height: 100vh; !important
| + | |
| − | position: fixed;
| + | |
| − | clear: both;
| + | |
| − | background: transparent url("https://static.igem.org/mediawiki/2017/1/12/T--Harvard--TeamPhotoSans.jpg") center center no-repeat fixed;
| + | |
| − | -webkit-background-size: cover;
| + | |
| − | -moz-background-size: cover;
| + | |
| − | -o-background-size: cover;
| + | |
| − | background-size: cover;
| + | |
| − | filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://static.igem.org/mediawiki/2017/1/12/T--Harvard--TeamPhotoSans.jpg',sizingMethod='scale');
| + | |
| − | -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://static.igem.org/mediawiki/2017/1/12/T--Harvard--TeamPhotoSans.jpg',sizingMethod='scale')";
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | .wrap-center{
| + | |
| − | margin: 0 auto;
| + | |
| − | position: relative;
| + | |
| − | max-width: 73.231em;
| + | |
| − | max-height: 10px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner-centered {
| + | |
| − | text-align: center;
| + | |
| − | font-family: 'Josefin Sans', sans-serif;
| + | |
| − | position: absolute;
| + | |
| − | display: block;
| + | |
| − | max-width: 75.231em;
| + | |
| − | height: inherit;
| + | |
| − | display: block;
| + | |
| − | margin-top: 150px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner-centered h2 {
| + | |
| − | font-size: 20vw;
| + | |
| − | padding: 0;
| + | |
| − | font-family: 'Josefin Sans', sans-serif;
| + | |
| − | text-transform: uppercase;
| + | |
| − | letter-spacing: 5vw;
| + | |
| − | color: #fafafa;
| + | |
| − | font-weight: 300;
| + | |
| − | display: inline-block;
| + | |
| − | text-align: center;
| + | |
| − | position:relative;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner-centered h3 {
| + | |
| − | font-size: 10vw;
| + | |
| − | font-family: 'Josefin Sans', sans-serif;
| + | |
| − | line-height: 1.5;
| + | |
| − | text-transform: uppercase;
| + | |
| − | letter-spacing: 5vw;
| + | |
| − | color: #fafafa;
| + | |
| − | font-weight: 300;
| + | |
| − | display: block;
| + | |
| − | text-align: center;
| + | |
| − | position:relative;
| + | |
| − |
| + | |
| − |
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Profile */
| + | |
| − | .caption {
| + | |
| − | font-size: 15px;
| + | |
| − | font-family: 'Josefin Sans', sans-serif;
| + | |
| − | text-align: center;
| + | |
| − | padding-bottom: 5%;
| + | |
| − | }
| + | |
| − | | + | |
| − | #picture {
| + | |
| − | width: 100%;
| + | |
| − | height: 100%;
| + | |
| − | }
| + | |
| − | | + | |
| − | .row {
| + | |
| − | align: center;
| + | |
| − | margin: auto;
| + | |
| − | display:block;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Three columns side by side */
| + | |
| − | .column {
| + | |
| − | float: left;
| + | |
| − | width: 33.3%;
| + | |
| − | margin-bottom: 16px;
| + | |
| − | padding: 0 8px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .title {
| + | |
| − | font-size: 15px;
| + | |
| − | font-family: 'Josefin Sans', sans-serif;
| + | |
| − | text-align: center;
| + | |
| − | position: relative;
| + | |
| − | color: gray;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Display the columns below each other instead of side by side on small screens */
| + | |
| − | @media (max-width: 650px) {
| + | |
| − | .column {
| + | |
| − | width: 100%;
| + | |
| − | display: block;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Add some shadows to create a card effect */
| + | |
| − | .card {
| + | |
| − | box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Trying to make cards equally sized */
| + | |
| − | .card {
| + | |
| − | width: auto;
| + | |
| − | height: auto;
| + | |
| − | | + | |
| − | }
| + | |
| − | | + | |
| − | /* Some left and right padding inside the container */
| + | |
| − | .container {
| + | |
| − | padding: 0 0;
| + | |
| − | | + | |
| − | margin:auto;
| + | |
| − | align: center;
| + | |
| − | }
| + | |
| − | | + | |
| − | ./containertwo {
| + | |
| − | padding: 0 40px;
| + | |
| − | margin:auto;
| + | |
| − | align: center;
| + | |
| − | }
| + | |
| − | | + | |
| − | /* Clear floats */
| + | |
| − | .container::after, .row::after {
| + | |
| − | content: "";
| + | |
| − | clear: both;
| + | |
| − | display: table;
| + | |
| − | }
| + | |
| − | | + | |
| − | </style>
| + | |
| | <body> | | <body> |
| | <div class="footer" style="margin-top:0;"> | | <div class="footer" style="margin-top:0;"> |
