/* keyframe.css*/
a:hover{
    color: rgb(137, 217, 169);
}
a:link{
    transition: color 0.5s;
}

p{
    color: rgb(227, 155, 155);
}

#platform{
    width: 220px;
    height: 350px;
    background-color: rgb(8, 88, 52);
    transform: translate(100px) rotateX(55deg) rotateZ(45deg);
    transform-style: preserve-3d;
    border-radius: 16px;
    box-shadow: 1px 2px 10px rgb(78, 78, 78, 0.95), 
    44px 44px 24px rgba(78, 78, 78, 0.75);
    transition: 0.5s ease-in-out  transform, 0.5s ease-in-out box-shadow;
}

#platform:hover{
    transform: translateX(100px) translateY(-24px) rotateX(55deg) rotateZ(45deg);
    box-shadow: 1px 2px  10px rgb(78, 78, 78, 0.95), 
    70px 70px 24px rgba(78, 78, 78, 0.65);
}

#platform p {
    transform-style: preserve-3d;
    opacity: 0;
    transform: translateY(90px) translateZ(6px) rotateX(90deg) rotateY(90deg) rotateZ(180deg);
    transition: 0.6s ease-in-out opacity;
}

#platform:hover p{
    opacity: 1;
    text-shadow: rgb(78, 78, 78, 0.95);
}
body {
    background-color: rgb(248, 237, 223);
}

h1 {
    color: rgb(22, 61, 11);
}