Difference between revisions of "Team:UiOslo Norway/Collaborations"
(Replaced content with "{{UiOslo_Norway}} <html> <p> coming soon </p> </html>") |
|||
Line 2: | Line 2: | ||
<html> | <html> | ||
− | < | + | <head> |
+ | <style> | ||
+ | .card { | ||
+ | position: relative; | ||
+ | float: left; | ||
+ | padding-bottom: 25%; | ||
+ | width: 25%; | ||
+ | text-align: center; | ||
+ | } | ||
+ | .card__front, | ||
+ | .card__back { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | .card__front, | ||
+ | .card__back { | ||
+ | -webkit-backface-visibility: hidden; | ||
+ | backface-visibility: hidden; | ||
+ | -webkit-transition: -webkit-transform 0.3s; | ||
+ | transition: transform 0.3s; | ||
+ | } | ||
+ | |||
+ | .card__front { | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .card__back { | ||
+ | background-color: White; | ||
+ | -webkit-transform: rotateY(-180deg); | ||
+ | transform: rotateY(-180deg); | ||
+ | } | ||
+ | .card.effect__hover:hover .card__front { | ||
+ | -webkit-transform: rotateY(-180deg); | ||
+ | transform: rotateY(-180deg); | ||
+ | } | ||
+ | |||
+ | .card.effect__hover:hover .card__back { | ||
+ | -webkit-transform: rotateY(0); | ||
+ | transform: rotateY(0); | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | <div class="card effect__hover"> | ||
+ | <div class="card__front"> | ||
+ | <span class="card__text">Hi this is iGEM Team oslo</span> | ||
+ | </div> | ||
+ | <div class="card__back"> | ||
+ | <span class="card__text">We are from norway</span> | ||
+ | </div> | ||
+ | </div><!-- /card --> | ||
+ | |||
+ | </body> | ||
</html> | </html> |
Revision as of 15:47, 7 September 2015
Hi this is iGEM Team oslo
We are from norway