/*HOME*/
.voltar {
    border-radius: 10px;
    background-color: #194b32;
    padding: 10px;
    position: absolute;
    top: 30px;
    left: 30px;
    color: white;
    font-size: 20px;
    text-decoration: none;
    transition: transform 0.3s;
    transition-duration: 2s;
}
.voltar:hover {
    background-color: #d0e4ae;
    color: #194b32;
    transform: scale(1.2) translateY(-13px) translateX(20px);
    box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.424);
}

/*PRIMEIRO BLOCO*/
body {
    background-color: white;
}

span {
    border: 3px solid black;
    transition-duration: 5s;
    transition: transform 1.1s;
}
.bloco {
    transition-duration: 5s;
    transition: transform 1.5s;
}
.bloco:hover {
transform: translateY(-200px);
.pteto {
    transform: translateY(-100px)
    matrix3d(0.7, 0, 0, 0, -0.7, 0.5, 0.1, 0, -0.6, -0.5, 0.5, 0, 0, 0, 0, 1);
}
}
.plado {
    background-color: #d0e4ae;
    padding: 49px;
    position: absolute;
    top: 364px;
    left: 464px;
}
.pfrente {
    background-color: #d0e4ae;
    padding: 70px;
    position: absolute;
    top: 308px;
    left: 544px;
    transform: rotateX(45deg) rotateY(-45deg) translate(1px);
}
.pfrente:hover {
    transform: rotateX(45deg) rotateY(-45deg) translate(100px);
}
.pteto {
    background-color: #d0e4ae;
    padding: 71px;
    position: absolute;
    top: 253px;
    left: 494px;
    transform: matrix3d(0.7, 0, 0, 0, -0.7, 0.5, 0.1, 0, -0.6, -0.5, 0.5, 0, 0, 0, 0, 1);
}

/* SEGUNDO BLOCO*/
.bloco2 {
    position: relative;
    transition-duration: 5s;
    transition: transform 1.5s;
}

.bloco2:hover {
transform: translateY(-200px);
.teto2 {
    z-index: top;
    transform: scale(1.4)
    matrix3d(0.7, 0, 0, 0, -0.7, 0.5, 0.1, 0, -0.6, -0.5, 0.5, 0, 0, 0, 0, 1)
    translateZ(100px) translateY(200px);
}
}
.frente2 {
    background-color: #194b32;
    padding: 70px;
    position: absolute;
    top: 322px;
    left: 570px;
}
.lado2 {
    background-color: #194b32;
    padding: 70px;
    position: absolute;
    top: 271px;
    left: 713px;
    transform: rotateX(45deg) rotateY(-45deg) scale(1.4);
}
.teto2 {
    background-color: #194b32;
    padding: 70px;
    position: absolute;
    top: 200px;
    left: 641px;
    transform: scale(1.4)
    matrix3d(0.7, 0, 0, 0, -0.7, 0.5, 0.1, 0, -0.6, -0.5, 0.5, 0, 0, 0, 0, 1);
}

/* TERCEIRO BLOCO */
.bloco3 {
    position: relative;
    transition-duration: 5s;
    transition: transform 1.5s;
}
.bloco3:hover {
.pteto3 {
    transform: scale(1.4) translate(150px, 80px)
    matrix3d(0.7,0.5,0,0,-0.7,0.5,0.1,0,-0.6,-0.5,0.5,0,0,0,0,1);
}
}

.pfrente3 {
    background-color: #39184a;
    width: 190px;
    height: 120px;
    position: absolute;
    top: 342px;
    left: 720px;
}

.plado3 {
    background-color: #39184a;
    width: 190px;
    height: 120px;
    position: absolute;
    top: 275px;
    left: 914px;
    transform: rotateX(45deg) rotateY(-45deg) scale(1.4);
}

.pteto3 {
    background-color: #39184a;
    width: 197px;
    height: 190px;
    position: absolute;
    top: 177px;
    left: 812px;
    transform: scale(1.4)
    matrix3d(0.7, 0, 0, 0, -0.7, 0.5, 0.1, 0, -0.6, -0.5, 0.5, 0, 0, 0, 0, 1);
}
