CSS Updates Tab 3 - by Chloe

/* Updates Tab by Chloe | @dontbrag | @bychloethemes */
/* only change the things with comments next to them */
#update {

    font-size: 10px;
    font-family: verdana; /*font*/
    display: block;
    z-index: 9999;
}
#heart {
	position: absolute;
    width: 100px;
    height: 90px;
}
#heart:before,
#heart:after {
    position: absolute;
    content: "";
    left: 70px; /*distance from left*/
    top: 20px; /*distance from top*/
    width: 50px;
    height: 80px;
    background: rgba(255,0,154,1); /*change the heart colour here, must be rgba, only change the first 3 numbers*/
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
 	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
	     -o-transition: all 0.5s ease-in-out;
		    transition: all 0.5s ease-in-out;
	-webkit-transition-delay: 0.1s;
	   -moz-transition-delay: 0.1s;
		 -o-transition-delay: 0.1s;
			transition-delay: 0.1s;
}
#heart:after {
    left: 20px;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
 	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
		 -o-transition: all 0.5s ease-in-out;
		    transition: all 0.5s ease-in-out;
	-webkit-transition-delay: 0.1s;
	   -moz-transition-delay: 0.1s;
		 -o-transition-delay: 0.1s;
			transition-delay: 0.1s;
}
#update:hover #heart:before, #update:hover #heart:after{
	width:150px;
	height:200px;
	border: 1px solid rgba(255,0,154,0.7); /*border after hover, must be rgba, only change the first 3 numbers*/
	background: rgba(255,255,255,0.4); /*background after hover, must be rgba, only change the first 3 numbers*/
	border-radius: 5px;
	left:25px;
	-webkit-transform: rotate(0deg);
	   -moz-transform: rotate(0deg);
	    -ms-transform: rotate(0deg);
	     -o-transform: rotate(0deg);
		    transform: rotate(0deg);
 	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
		 -o-transition: all 0.5s ease-in-out;
		    transition: all 0.5s ease-in-out;
}
#updateinfo {
	position: absolute;
	width:135px;
	height: 0px;
	overflow: hidden;
	top:35px;
	left:41px;
	opacity: 0;
 	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
		 -o-transition: all 0.3s ease-in-out;
		    transition: all 0.3s ease-in-out;
}
#update:hover #updateinfo {
	display: block;
	opacity: 1;
	height: 190px; /*the height of the tab after hover*/
	overflow-y: scroll; /*change scroll to hidden if you dont want it to scroll*/
 	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
		 -o-transition: all 0.5s ease-in-out;
		    transition: all 0.5s ease-in-out;
	-webkit-transition-delay: 0.3s;
	   -moz-transition-delay: 0.3s;
		 -o-transition-delay: 0.3s;
			transition-delay: 0.3s;
}
#updateinfo .heading {
	visibility: none;
	display: block;
	opacity: 0;
	width:100%;
	text-align:center;
	background:#fff; /* Heading background colour */
	color:#000; /* Heading font colour */
	margin:3px 0px;
	padding: 2px 0px;
 	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
		 -o-transition: all 0.3s ease-in-out;
		    transition: all 0.3s ease-in-out;
}
#update:hover #updateinfo .heading {
	display: block;
	visibility: visible;
	opacity: 1;
 	-webkit-transition: all 0.5s ease-in-out;
	   -moz-transition: all 0.5s ease-in-out;
		 -o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
	-webkit-transition-delay: 0.3s;
	   -moz-transition-delay: 0.3s;
		 -o-transition-delay: 0.3s;
			transition-delay: 0.3s;
}
/* Updates Tab by Chloe | @dontbrag | @bychloethemes */