Template:TemplateStyles sandbox/Ed6767/tests.css

/* Testing CSS animations ext. */ .materialRipple { background-position: center; transition: background 0.4s; } .materialRipple:hover { background: #ff5e52 radial-gradient(circle, transparent 1%, #ff5e52 1%) center/15000%; } .materialRipple:active { background-color: #ff4638; background-size: 100%; transition: background 0s; }

/* Button style */ .materialButton { border: none; border-radius: 2px; padding: 12px 18px; font-size: 16px; text-transform: uppercase; cursor: pointer; color: white; background-color: #ff1100; box-shadow: 0 0 4px #999; outline: none; user-select: none; text-align: center; font-family: Roboto, sans-serif; }

.buttonContainer > .plainlinks > a { color: white; text-decoration: none; /* no underline */ }

.hideJunk { font-size: 0; }

.makeLinkLookLikeButton > a { color: white; text-decoration: none; /* no underline */ border: none; border-radius: 2px; padding: 12px 18px; font-size: 16px; text-transform: uppercase; cursor: pointer; background-color: #ff1100; box-shadow: 0 0 4px #999; outline: none; user-select: none; text-align: center; font-family: Roboto, sans-serif; background-position: center; transition: background 0.4s; }

.makeLinkLookLikeButton > a:hover { background: #ff5e52 radial-gradient(circle, transparent 1%, #ff5e52 1%) center/15000%; } .makeLinkLookLikeButton > a:active { background-color: #ff4638; background-size: 100%; transition: background 0s; }