MediaWiki:Wikia.css/transitions

/* * / /**/ /* Transition Effects */ /**/ /* Use these like any other css class. To request a fade effect contact The Excel please specify Properties involved durations and values for those properties if needed you will be asked to clarify.

/*Fading Effects*/

/*Read More Improvements*/

.readmore { position: relative; -moz-transition-property: background-color, color; -moz-transition-duration: 1s; -webkit-transition-property: background-color, color; -webkit-transition-duration: 1s; -o-transition-property: background-color, color; -o-transition-duration: 1s; text-align: center; background-color: white; color: blue; -moz-border-radius: 1em; border-radius: 1em; border: solid 0px black; }

.readmore:hover { position: relative; -moz-transition-property: background-color, color; -moz-transition-duration: 1s; -webkit-transition-property: background-color, color; -webkit-transition-duration: 1s; -o-transition-property: background-color, color; -o-transition-duration: 1s; background-color: blue; color: white; }

/*Other*/

/*Big Red Boom*/

.bigredboom { position: relative; -moz-transition-property: background-color, color, width, height; -moz-transition-duration: 1s; -webkit-transition-property: background-color, color, width, height; -webkit-transition-duration: 1s; -o-transition-property: background-color, color, width, height; -o-transition-duration: 1s; text-align: center; background-color: white; color: black; -moz-border-radius: 1em; border-radius: 1em; border: solid 0px black; width: 15%; }

.bigredboom:hover { position: relative; -moz-transition-property: background-color, color, width, height; -moz-transition-duration: 1s; -webkit-transition-property: background-color, color, width, height; -webkit-transition-duration: 1s; -o-transition-property: background-color, color, width, height; -o-transition-duration: 1s; background-color: red; color: white; width: 100%; }

/*Red Glow*/

.redglow { position: relative; -moz-transition-property: text-shadow; -moz-transition-duration: 1s; -webkit-transition-property: text-shadow; -webkit-transition-duration: 1s; -o-transition-property: text-shadow; -o-transition-duration: 1s; text-shadow: none; }

.redglow:hover { position: relative; -moz-transition-property: text-shadow; -moz-transition-duration: 1s; -webkit-transition-property: text-shadow; -webkit-transition-duration: 1s; -o-transition-property: text-shadow; -o-transition-duration: 1s; text-shadow: red 0px 0px 2px; }

/*Signature Special*/

.signaturespecialexcel { position: relative; -moz-transition-property: width; -moz-transition-duration: 2s; -webkit-transition-property: width; -webkit-transition-duration: 2s; -o-transition-property: width; -o-transition-duration: 2s; overflow:hidden; width: 90px; }

.signaturespecialexcel:hover { position: relative; -moz-transition-property: width; -moz-transition-duration: 2s; -webkit-transition-property: width; -webkit-transition-duration: 2s; -o-transition-property: width; -o-transition-duration: 2s; width: 165px; }

/* * /