mygreeting.css
*{
Padding:0;
Margin:0;
}
body{
background :#fff;
Margin:0;
Padding:0;
Text-align:center;
font-family: Arial, Helvetica, sans-serif;
}
.flip-card {
background-color: transparent;
Position:fixed;
width: 300px;
height: 500px;
Margin-top:3%;
Margin-left:8.5%;
perspective: 1000px;
}
.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform 0.6s;
transform-style: preserve-3d;
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}
.flip-card:hover .flip-card-inner {
transform: rotateY(180deg);
}
.flip-card-front, .flip-card-back {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
color :#E4287C;
Font-weight:bold;
}
.flip-card-front {
background-color: #bbb;
color :;
}
.flip-card-back {
background-color:;
color:#E4287C;
Font-weight:bold;
transform: rotateY(180deg);
}
.sub-division{
Position:fixed;
Width:100%;
Height:100%;
}
.sub-division p{
Margin-top:80px;
Position:fixed;
Margin-left:32%;
Font-size:20px;
}
.sub-division h3{
Margin-top:250px;
Margin-left:40%;
Font-size:25px;
}
.sub-division, .paragraph, {
Position:absolute;
}
.form-group{
Position:absolute ;
Margin-Top:25%;
Margin-left:0%;
}
input{
width :85%;
Height:25px;
Margin-left:0%;
Text-align:center;
Margin-bottom :45px;
Background :none;
Border-style:none;
Outline:none;
Border-bottom :2px solid #fff;
Font-size:18px;
Font-weight:bold;
}
Button {
Width:42%;
Height:32px;
Font-size:20px;
Font-weight :bold ;
Border-style :none;
Border:solid #fff;
Border-radius:5px;
Background-color :#E4287C;
Color:#fff;
}
