/ Published in: CSS
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
button.facebook { background: #6e86bd; background: -moz-linear-gradient(top, #6e86bd 0%, #6680b9 100%); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6e86bd), to(#6680b9)); border-top: 1px solid #3f5b98; border-left: 1px solid #3f5b98; border-bottom: 1px solid #3f5b98; border-right: 1px solid #3f5b98; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: inset 0 1px 0 0 #abbbdf; -webkit-box-shadow: inset 0 1px 0 0 #abbbdf; box-shadow: inset 0 1px 0 0 #abbbdf; color: #fff; font-size: 1.6em; font-weight: bold; line-height: 1; padding: 8px 0 7px 0; text-align: center; text-shadow: 0 -1px 1px #344d80; width: 233px; margin: 0 0 10px 0; } button.facebook:hover { background: #546a99; background: -moz-linear-gradient(top, #546a99 0%, #546a99 100%); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#546a99), to(#546a99)); -moz-box-shadow: inset 0 1px 0 0 #98a8d3; -webkit-box-shadow: inset 0 1px 0 0 #98a8d3; box-shadow: inset 0 1px 0 0 #98a8d3; text-shadow: 0 -1px 1px #283960; color: #fff; cursor: pointer; } button.facebook:active { border: 1px solid #283960; -moz-box-shadow: inset 0 0 4px 2px #51658b, 0 0 1px 0 #eee; -webkit-box-shadow: inset 0 0 4px 2px #51658b, 0 0 1px 0 #eee; box-shadow: inset 0 0 4px 2px #51658b, 0 0 1px 0 #eee; } button.twitter { background: #fff; background: -moz-linear-gradient(top, #fff 0%, #d5e9f6 100%); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#d5e9f6)); border-top: 1px solid #a4cce6; border-left: 1px solid #a4cce6; border-bottom: 1px solid #9eb9cc; border-right: 1px solid #a4cce5; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; color: #186588; font-size: 1.6em; font-weight: bold; line-height: 1; padding: 8px 0 7px 0; text-align: center; text-shadow: 0 1px 1px #fff; width: 233px; } button.twitter:hover { background: #f2f8fc; background: -moz-linear-gradient(top, #f2f8fc 0%, #bfe0ee 100%); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f2f8fc), to(#bfe0ee)); border-top: 1px solid #53a3d7; border-left: 1px solid #53a3d7; border-bottom: 1px solid #68a0c4; border-right: 1px solid #53a3d5; text-shadow: 0 1px 1px #fff; color: #0c3752; cursor: pointer; } button.twitter:active { background: #cee5f4; border-top: 1px solid #7ab7de; border-left: 1px solid #7ab7de; border-bottom: 1px solid #85acc5; border-right: 1px solid #7ab7de; text-shadow: 0 1px 1px #e6f0f8; color: #668a9e; }