UTT (Appearing) - BR CSS

#container-bottom-right {
    /*don't change anything*/
    position:fixed;
    right:0px;
    bottom:0px;
    z-index:999;
    }

    #container-bottom-right:hover #text-bottom-right {
        opacity:1; /*don't change*/
        /*transition speed: 0.1 = fastest and 1 = slowest*/
        -webkit-transition: all .7s ease-in-out;
        -moz-transition: all .7s ease-in-out;
        -o-transition: all .7s ease-in-out;
    }

#text-bottom-right {

    /*you can change the things below this*/
    font-size:10px;
    font-family:calibri;
    text-align:center;
    width:125px; /*how wide the text spans*/
    bottom:30px; /*higher number = farther down on page*/
    right:100px; /*lower number = closer to image; beware: don't make this number higher than the image width or your text will be on top of your image*/

    /*don't change anything below this*/
    padding:0px 5px 0px 5px;
    position:fixed;
    opacity:0;

    /*transition speed: 0.1 = fastest and 1 = slowest*/
    -webkit-transition: all .7s ease-in-out;
    -moz-transition: all .7s ease-in-out;
    -o-transition: all .7s ease-in-out;

}

#image-bottom-right img {
    width: 100px; /*higher number = larger image; if you change this, make sure you change the "left:100px" style under #text-top-left, or else your text will be on top of your image*/

    /*don't change anything below this*/
    height: auto;
    bottom:0px;
    right:0px;
}