.exemplo1{
    display: inline-block;
    border: 1px dashed #000;
    padding: 10px;
    background: #ffffa2;
    height: 20px;
    opacity: 0.3;

    -moz-transition: height 1s ease-out, opacity 1s ease;
    -webkit-transition: height 1s ease-out, opacity 1s ease;
    -o-transition: height 1s ease-out, opacity 1s ease;
    transition: height 1s ease-out, opacity 1s ease;
}

.exemplo1:hover {
    height: 70px;
    opacity: 1;
}

.exemplo2 {
    position: relative;
    display: inline-block;
    border: 1px dashed #000;
    padding: 10px;
    background: #ffffa2;
    height: 20px;
    opacity: 0.3;
    margin:0 0 0 20px;
    text-decoration: none;

    -moz-transition: all 1s ease;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

.exemplo2:hover {
    opacity: 1;

    -moz-transform: scale(2) rotate(30deg) translate(50px);
    -webkit-transform: scale(1.2) rotate(30deg) translate(50px);
    -o-transform: scale(2) rotate(30deg) translate(50px);
    transform: scale(2) rotate(30deg) translate(50px);

    z-index: 1000;
}