Difference between revisions of "Template:Freiburg/CSS"

Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
 +
 
/* ============= Resetting css coming from wiki itself ============= */
 
/* ============= Resetting css coming from wiki itself ============= */
 
body {
 
body {
Line 273: Line 274:
  
 
/* ============= END: Full Width Banners  ============= */
 
/* ============= END: Full Width Banners  ============= */
 +
/*
 +
---------------- Our Team Flipcards css ----------------
 +
*/
 +
.flippanel {
 +
    width: 227px;
 +
    height: 341px;
 +
    margin: auto;
 +
    position: relative;
 +
}
  
 +
.card {
 +
    width: 227px;
 +
    height: 341px;
 +
    -o-transition: all .5s;
 +
    -ms-transition: all .5s;
 +
    -moz-transition: all .5s;
 +
    -webkit-transition: all .5s;
 +
    transition: all .5s;
 +
    -webkit-backface-visibility: hidden;
 +
    -ms-backface-visibility: hidden;
 +
    -moz-backface-visibility: hidden;
 +
    backface-visibility: hidden;
 +
    position: absolute;
 +
    top: 0px;
 +
    left: 0px;
 +
}
 +
 +
.front {
 +
    z-index: 2;
 +
}
 +
 +
.back {
 +
overflow: auto;
 +
    z-index: 1;
 +
    -webkit-transform: rotateY(180deg);
 +
    -ms-transform: rotateY(180deg);
 +
    -moz-transform: rotateY(180deg); 
 +
    transform: rotateY(180deg); 
 +
 
 +
}
 +
 +
.flippanel:hover .front {
 +
    z-index: 1;
 +
    -webkit-transform: rotateY(-180deg);
 +
    -ms-transform: rotateY(-180deg);
 +
    -moz-transform: rotateY(-180deg);
 +
    transform: rotateY(-180deg);
 +
}
 +
 +
.flippanel:hover .back {
 +
    z-index: 2; 
 +
    -webkit-transform: rotateX(0deg);
 +
    -ms-transform: rotateX(0deg);
 +
    -moz-transform: rotateX(0deg);
 +
    transform: rotateX(0deg);
 +
}
 +
.memberPicture{
 +
width: 227px;
 +
height: 341px;
 +
}
 +
 +
.profile-name {
 +
font-size: 120%;
 +
color: #c1012a;
 +
font-style: bold;
 +
}
 +
.profile-question{
 +
color: #004c97;
 +
}
 +
 +
.flippanel_row{
 +
margin-top: 25px;
 +
display: flex;
 +
}
 +
/*
 +
---------------- END Our Team Flipcards css ----------------
 +
*/
 
</style>
 
</style>
 
</html>
 
</html>

Revision as of 16:06, 16 August 2015