div {
height: 150px;
width: 150px;
/*makes all the picture containers same size*/
float: left;
display: inline;
/*makes all the pictures come one after another in a row*/
}

p {
opacity: 0;
/*do this so that all the p's are invisible at first*/
}

.container {
height: 1000px;
width: 1000px;
/*arbitrary settings for height and width of the container, if i am correct, this will override the above mentioned div settings*/
}

.imag {
width: 150px;
height: 150px;
/*makes all pics same size*/
}

/*now i would need something here to make it so when pic1 is hovered, it p element would change to have "opacity: 1;". My original thought would be this:*/
.div1:hover .div1 < p {
opacity: 1 !important;
/*but that didnt work!*/
}