Line 79: | Line 79: | ||
} | } | ||
body { | body { | ||
− | background-image: url("https://static.igem.org/mediawiki/2017/c/ | + | background-image: url("https://static.igem.org/mediawiki/2017/c/c7/T--BostonU--SaiPipetting2.jpg"); |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-attachment: fixed; | background-attachment: fixed; | ||
Line 135: | Line 135: | ||
width: 100%; | width: 100%; | ||
color: #1d1d1d; | color: #1d1d1d; | ||
+ | z-index: 1; | ||
} | } | ||
#backgroundimage2 { | #backgroundimage2 { | ||
Line 160: | Line 161: | ||
margin: 0; | margin: 0; | ||
padding: 40px; | padding: 40px; | ||
+ | } | ||
+ | .link-slideup { | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | } | ||
+ | .link-slideup a { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | outline: none; | ||
+ | color: #D45B5C; | ||
+ | vertical-align: bottom; | ||
+ | text-decoration: none; | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | .link-slideup a::before, .link-slideup a::after { | ||
+ | pointer-events: none; | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | } | ||
+ | .link-slideup a { | ||
+ | overflow: hidden; | ||
+ | font-weight: 500; | ||
+ | } | ||
+ | .link-slideup a::before { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: -1; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | background-color: #A9A9A9; | ||
+ | opacity: 1; | ||
+ | content: ''; | ||
+ | -webkit-transition: -webkit-transform 0.2s; | ||
+ | transition: transform 0.2s; | ||
+ | -webkit-transform: translateY(95%); | ||
+ | transform: translateY(95%); | ||
+ | opacity: 0.3; | ||
+ | } | ||
+ | .link-slideup a:hover::before, .link-slideup a:focus::before { | ||
+ | -webkit-transform: translateY(0); | ||
+ | transform: translateY(0); | ||
+ | } | ||
+ | .figwrap { | ||
+ | background: #FFFFFF; | ||
+ | width: 80%; | ||
+ | border-radius: 5pt; | ||
+ | align-content:center; | ||
+ | } | ||
+ | .figwrap img { | ||
+ | height: 500px; | ||
+ | padding: 0 5%; | ||
+ | } | ||
+ | .figwrap p { | ||
+ | padding: 0 5%; | ||
+ | } | ||
+ | #overview_description { | ||
+ | width: 720px; | ||
} | } | ||
</style> | </style> | ||
</head> | </head> | ||
<body> | <body> | ||
− | <div id="backgroundimage1"><div class="background-gradient-down"><p class="wide-heading-type mainwrap align-center">PROJECT | + | <div id="backgroundimage1"><div class="background-gradient-down"> |
− | <div id="panel1" | + | <p class="wide-heading-type mainwrap align-center">BOSTONU 2017 PROJECT OVERVIEW</p> |
− | + | </div></div> | |
− | + | <div id="panel1" class="link-slideup"></div> | |
− | + | <img id="overview_description" src="https://static.igem.org/mediawiki/2017/a/af/T--BostonU--overview_description.svg"></img> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | </ | + | |
− | + | ||
<div id="backgroundimage2"><div class="background-gradient-up"> | <div id="backgroundimage2"><div class="background-gradient-up"> | ||
</div></div> | </div></div> |
Revision as of 18:13, 1 November 2017
BOSTONU 2017 PROJECT OVERVIEW