Al hacer hover en el botón aparecen los elementos ocultos, lo que busco hacer es que al mismo tiempo que aparecen estos elementos ocultos, desaparezca un elemento que está visible (icono-6).
Esto es lo que tengo:
/* Elementos ocultos */
.hidef {
color: white;
position:absolute;
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 600ms, visibility 600ms;
transition: opacity 600ms, visibility 600ms;
line-height: 150%;
}
/* Boton */
.myDIVf {
color: white;
font-weight: 200;
letter-spacing: 1.8px;
fill: #FFFFFF;
color: #FFFFFF;
background-color: rgba(2, 1, 1, 0);
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: #FFFFFF;
border-radius: 0px 0px 0px 0px;
}
/* Hover del Boton */
.myDIVf:hover {
color: #052532;
background-color:#FFFFFF;
cursor:pointer;
margin-top: -7px;
transition: all .3s;
}
/* Icono */
.img6 {
margin-top:-278px;
margin-left: 64px;
width: 48%;
}
/* Titulo */
.img6-2 {
margin-top:-245px;
margin-left: 0px;
width: 100%;
}
/* Hover para mostrar elementos ocultos */
.myDIVf:hover + .hidef {
color: white;
visibility: visible;
opacity: 1;
line-height: 150%;
}
Busco que el elemento icono-6 desaparezca al hacer hover en el botón para que los elementos ocultos aparezcan en el mismo sitio que icono-6 para que no aparezcan encima de el elemento icono-6.