/***************
CONTAINER
****************/
.bcontainer#t021020120600 {
width: 118px;
height: 598px;
border:1px solid black;
position: relative;
overflow: hidden;
background: #fff;
}
.bcontainer#t021020120600 a {
display: block;
z-index: 2;
text-decoration: none;
position: initial;
}
/***************
CONTENT
****************/
#t021020120600 .bg1 {
position: absolute;
top: 0px;
z-index: 14;
opacity: 1;
}
#t021020120600 .bg2 {
position: absolute;
z-index: 15;
top: 0px;
opacity: 0;
left: 0px;
}
#t021020120600 .text1 {
position: absolute;
z-index: 16;
left: 4px;
bottom: -175px;
opacity: 1;
}
#t021020120600 .borderline {
position: absolute;
z-index: 3;
left: 5px;
top: 10px;
height: 250px;
box-shadow: 0px 0px 30px 75px #fff;
opacity: 0;
}
#t021020120600 .logo {
position: absolute;
z-index: 20;
top: -30px;
left: 7px;
}
#t021020120600 .stoerer {
position: absolute;
z-index: 20;
top: 314px;
left: 43px;
opacity: 0;
}
#t021020120600 .kasten1 {
position: absolute;
z-index: 15;
left: 0px;
bottom:-2px;
}
#t021020120600 .text2 {
position: absolute;
z-index: 16;
left: 6px;
bottom: -175px;
opacity: 1;
}
#t021020120600 .text3 {
position: absolute;
z-index: 16;
right: 8px;
bottom: -175px;
opacity: 1;
}
#t021020120600 .btn {
position: absolute;
z-index: 16;
top:522px;
left:9px;
opacity: 0;
}
#t021020120600.anim .bg1 {
animation: zoomInshort 7s 1 forwards 1s;
}
#t021020120600.anim .bg2 {
animation: fadeIn 3s 1 forwards 7s,
zoomInshort 4s 1 forwards 9s;
}
#t021020120600.anim .logo {
animation: slideIn 2s 1 forwards;
}
#t021020120600.anim .text1 {
animation: slideInbottom 2s 1 forwards,
fadeOut 1s 1 forwards 3s;
}
#t021020120600.anim .text2 {
animation: slideInbottom3 2s 1 forwards 4s,
fadeOut 1s 1 forwards 7s;
}
#t021020120600.anim .text3 {
animation: slideInbottom2 2s 1 forwards 8s;
}
#t021020120600.anim .borderline {
animation: fadeIn 3s 1 forwards 4s;
}
#t021020120600.anim .stoerer {
animation: fadeIn 3s 1 forwards 1s;
}
#t021020120600.anim .btn {
animation: fadeIn 1s 1 forwards 9s,
bounce 1.5s 1 forwards 11s,
bounce 1.5s 1 forwards 13s;
}
/***************
ANIMATION
****************/
@keyframes zoomIn {
to {transform: scale(1.5);}
}
@keyframes zoomInshort {
to {transform: scale(1.1);}
}
@keyframes fadeIn {
to {opacity: 1;}
}
@keyframes fadeOut {
to {opacity: 0;}
}
@keyframes growIn {
to {width: 281px;}
}
@keyframes bounce {
50% {transform: scale(0.75);}
100% {transform: scale(1);}
}
@keyframes slideIn {
to {top: -4px;}
}
@keyframes slideInbottom {
to {bottom: 90px;}
}
@keyframes slideInbottom2 {
to {bottom: 122px;}
}
@keyframes slideInbottom3 {
to {bottom: 90px;}
}
@keyframes slideInLeft1 {
to {left: 7px;}
}
@keyframes slideInLeft2 {
to {left: 7px;}
}
@keyframes slideInLeft3 {
to {left: 7px;}
}
@keyframes slideInLeft4 {
to {left: 7px;}
}
@keyframes moveToTop {
to {top: -20px;}
}