/* floating, padding, flexbox, positioning, border, and margins*/
#firstpic {float: right; right: 15%;top:15%; border: 2px solid orange;width:40%; height:auto; padding: 5px; position: relitive; display:flex; flex-direction:column;} /* I'm not sure if the flexbox worked, it didn't seem to change my work?*/
/* credits for the image, I had a hard time getting this to be in a place I wanted. The order seems to be weird?*/
#credits1 {text-align:center; margin-top:5px; font-size: 10px; margin-right: 15px; float:top;padding:5px; opacity:70%;display:flex; flex-direction:column;}
/* text*/
#text {background-color: pink; font-size: 20px; text-align: center; position:reletive; padding: 20px; float:left;display:flex; flex-direction:column;}
/* background color*/
body { background-color: lightyellow}