/* * littlelink.io * Skeleton V2.0.4 * Copyright 2014, Dave Gamache * www.getskeleton.com * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php * 12/29/2014 */ /* * Built using on: * Skeleton V2.0.4 * Copyright 2014, Dave Gamache * www.getskeleton.com * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php * 12/29/2014 */ /* Table of contents –––––––––––––––––––––––––––––––––––––––––––––––––– - Buttons - Brand Styles */ /* Buttons –––––––––––––––––––––––––––––––––––––––––––––––––– */ .button, button { display: inline-block; height: 48px; padding: 0 16px; text-align: center; vertical-align: middle; font-size: 18px; width: 300px; font-weight: 600; line-height: 48px; letter-spacing: 0.5px; text-decoration: none; white-space: nowrap; background-color: transparent; border-radius: 8px; cursor: pointer; box-sizing: border-box; } button:hover, .button:focus { color: #333; border-color: #888; outline: 0; } .button.button-primary { color: #FFF; filter: brightness(90%) } .button.button-primary:hover, .button.button-primary:focus { color: #FFF; filter: brightness(90%) } /* Brand Icons –––––––––––––––––––––––––––––––––––––––––––––––––– */ .icon { padding: 0px 8px; vertical-align: middle; width: 20px; height: 20px; } /* Brand Styles –––––––––––––––––––––––––––––––––––––––––––––––––– */ /* Discord */ .button.button-discord { color: #FFFFFF; background-color: #7289DA } .button.button-discord:hover, .button.button-discord:focus { filter: brightness(90%) } /* Facebook */ .button.button-facebook { color: #FFFFFF; background-color: #1877f2 } .button.button-facebook:hover, .button.button-facebook:focus { filter: brightness(90%) } /* Figma */ .button.button-figma { color: #FFFFFF; background-color: #131313 } .button.button-figma:hover, .button.button-figma:focus { filter: brightness(90%) } /* Github */ .button.button-github { color: #FFFFFF; background-color: #24292e } .button.button-github:hover, .button.button-github:focus { filter: brightness(90%) } /* Instagram */ .button.button-instagram { color: #FFFFFF; background-image: linear-gradient(-135deg,#1400c8,#b900b4,#f50000) } .button.button-instagram:hover, .button.button-instagram:focus { filter: brightness(90%) } /* Kit */ .button.button-kit { color: #FFFFFF; background-color: #10c694 } .button.button-kit:hover, .button.button-kit:focus { filter: brightness(90%) } /* LinkedIn */ .button.button-linkedin { color: #FFFFFF; background-color: #0A66C2 } .button.button-linkedin:hover, .button.button-linkedin:focus { filter: brightness(90%) } /* Medium */ .button.button-medium { color: #000000; background-color: #E8F3EC } .button.button-medium:hover, .button.button-medium:focus { filter: brightness(90%) } /* Mixer */ .button.button-mixer { color: #FFFFFF; background-color: #212c3d } .button.button-mixer:hover, .button.button-mixer:focus { filter: brightness(90%) } /* Pinterest */ .button.button-pinterest { color: #FFFFFF; background-color: #E60023 } .button.button-pinterest:hover, .button.button-pinterest:focus { filter: brightness(90%) } /* Reddit */ .button.button-reddit { color: #FFFFFF; background-color: #FF4500 } .button.button-reddit:hover, .button.button-reddit:focus { filter: brightness(90%) } /* Snapchat */ .button.button-snapchat { color: #000000; background-color: #fffc00 } .button.button-snapchat:hover, .button.button-snapchat:focus { filter: brightness(90%) } /* Spotify */ .button.button-spotify { color: #FFFFFF; background-color: #1DB954 } .button.button-spotify:hover, .button.button-spotify:focus { filter: brightness(90%) } /* Steam */ .button.button-steam { color: #FFFFFF; background-color: #171a21 } .button.button-steam:hover, .button.button-steam:focus { filter: brightness(90%) } /* Telegram */ .button.button-telegram { color: #FFFFFF; background-color: #3faee8 } .button.button-telegram:hover, .button.button-telegram:focus { filter: brightness(90%) } /* Tumblr */ .button.button-tumblr { color: #FFFFFF; background-color: #131313 } .button.button-tumblr:hover, .button.button-tumblr:focus { filter: brightness(90%) } /* Twitch */ .button.button-twitch { color: #FFFFFF; background-color: #9146ff } .button.button-twitch:hover, .button.button-twitch:focus { filter: brightness(90%) } /* Twitter */ .button.button-twitter { color: #FFFFFF; background-color: #1DA1F2 } .button.button-twitter:hover, .button.button-twitter:focus { filter: brightness(90%) } /* YouTube */ .button.button-youtube { color: #FFFFFF; background-color: #FF0000 } .button.button-youtube:hover, .button.button-youtube:focus { filter: brightness(90%) }