/* * 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; text-decoration: none; height: 100%; text-align: center; vertical-align: middle; font-size: 18px; width: 300px; font-weight: 700; line-height: 20px; padding: 14px 12px 12px 12px; letter-spacing: 0.1px; white-space: wrap; outline: none; border-radius: 8px; cursor: pointer; } button:hover, .button:focus { color: #212121; border-color: #888; outline: #7AB8FF solid 3px } .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 3.5px 0px; vertical-align: middle; width: 20px; height: 20px; } /* Brand Styles (we recommend adding these in alphabetical order) –––––––––––––––––––––––––––––––––––––––––––––––––– */ /* Extended (this is great for your own brand color!) */ .button.button-extended { color: #ffffff; background-color: #0085ff; } .button.button-extended:hover, .button.button-extended:focus { filter: brightness(90%); } /* 500px */ .button.button-500px { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-500px:hover, .button.button-500px:focus { filter: brightness(90%); } /* Alpha Universe (Sony) */ .button.button-alphauniverse { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-alphauniverse:hover, .button.button-alphauniverse:focus { filter: brightness(90%); } /* AniList */ .button.button-anilist { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-anilist:hover, .button.button-anilist:focus { filter: brightness(90%); } /* Audiomack */ .button.button-audiomack { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-audiomack:hover, .button.button-audiomack:focus { filter: brightness(90%); } /* Bandsintown */ .button.button-bandsintown { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-bandsintown:hover, .button.button-bandsintown:focus { filter: brightness(90%); } /* Bonfire */ .button.button-bonfire { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-bonfire:hover, .button.button-bonfire:focus { filter: brightness(90%); } /* Cameo */ .button.button-cameo { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-cameo:hover, .button.button-cameo:focus { filter: brightness(90%); } /* Codepen */ .button.button-codepen { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-codepen:hover, .button.button-codepen:focus { filter: brightness(90%); } /* Deezer */ .button.button-deezer { color: #ffffff; background-color: #181818; border: 1px solid #ffffff; } .button.button-deezer:hover, .button.button-deezer:focus { filter: brightness(90%); } /* Devpost */ .button.button-devpost { color: #ffffff; background-color: #003E54; border: 1px solid #ffffff; } .button.button-devpost:hover, .button.button-devpost:focus { filter: brightness(90%); } /* Distiller */ .button.button-dist { color: #ffffff; background-color: #ed5c47; } .button.button-dist:hover, .button.button-dist:focus { filter: brightness(90%); } /* Filmweb */ .button.button-filmweb { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-filmweb:hover, .button.button-filmweb:focus { filter: brightness(90%); } /* Gog */ .button.button-gog { color: #ffffff; background-color: #303030; border: 1px solid #ffffff; } .button.button-gog:hover, .button.button-gog:focus { filter: brightness(90%); } /* Hackerearth */ .button.button-hackerearth { color: #ffffff; background-color: #2b3352; } .button.button-hackerearth:hover, .button.button-hackerearth:focus { filter: brightness(90%); } /* Hackerrank */ .button.button-hackerrank { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-hackerrank:hover, .button.button-hackerrank:focus { filter: brightness(90%); } /* itch.io */ .button.button-itchio { color: #ffffff; background-color: #fa5c5c; } .button.button-itchio:hover, .button.button-itchio:focus { filter: brightness(90%); } /* Layers */ .button.button-layers { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-layers:hover, .button.button-layers:focus { filter: brightness(90%); } /* Lemmy */ .button.button-lemmy { color: #ffffff; background-color: #14854f; } .button.button-lemmy:hover, .button.button-lemmy:focus { filter: brightness(90%); } /* ListenBrainz */ .button.button-listenbrainz { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-listenbrainz:hover, .button.button-listenbrainz:focus { filter: brightness(90%); } /* Matrix */ .button.button-matrix { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-matrix:hover, .button.button-matrix:focus { filter: brightness(90%); } /* Micro.blog */ .button.button-microblog { color: #FFFFFF; background-color: #FD9927 } .button.button-microblog:hover, .button.button-microblog:focus { filter: brightness(90%) } /* Mixcloud */ .button.button-mixcloud { color: #ffffff; background-color: #5000FF; } .button.button-mixcloud:hover, .button.button-mixcloud:focus { filter: brightness(90%); } /* MyAnimeList */ .button.button-myanimelist { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-myanimelist:hover, .button.button-myanimelist:focus { filter: brightness(90%) } /* OP.GG */ .button.button-opgg { color: #ffffff; background-color: #5383E8} .button.button-opgg:hover, .button.button-opgg:focus { filter: brightness(90%) } /* OpenSea */ .button.button-opensea { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-opensea:hover, .button.button-opensea:focus { filter: brightness(90%); } /* ORCID ID */ .button.button-orcid-id { color: #000000; background-color: #FFFFFF; border: 1px solid #212121; } .button.button-orcid-id:hover, .button.button-orcid-id:focus { filter: brightness(90%); } /* osu! */ .button.button-osu { color: #000000; background-color: #ff8ee6; } .button.button-osu:hover, .button.button-osu:focus { filter: brightness(90%); } /* Pixelfed */ .button.button-pixelfed { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-pixelfed:hover, .button.button-pixelfed:focus { filter: brightness(90%) } /* PlayStation */ .button.button-playstation { color: #ffffff; background-color: #0070D1; } .button.button-playstation:hover, .button.button-playstation:focus { filter: brightness(90%) } /* Qobuz */ .button.button-qobuz { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-qobuz:hover, .button.button-qobuz:focus { filter: brightness(90%); } /* ravelry */ .button.button-ravelry { color: #EE6E62; background-color: #F3F4F0; border: 1px solid #F3F4F0; } .button.button-ravelry:hover, .button.button-ravelry:focus { filter: brightness(90%); } /* ResearchGate */ .button.button-researchgate { color: #000000; background-color: #FFFFFF; border: 1px solid #212121; } .button.button-researchgate:hover, .button.button-researchgate:focus { filter: brightness(90%); } /* Roll20 */ .button.button-roll20 { color: #FFFFFF; background-color: #ec008c } .button.button-roll20:hover, .button.button-roll20:focus { filter: brightness(90%) } /* SpaceHey */ .button.button-spacehey { color: #FFFFFF; background-color: #3234CF; } .button.button-spacehey:hover, .button.button-spacehey:focus { filter: brightness(90%); } /* Tidal */ .button.button-tidal { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-tidal:hover, .button.button-tidal:focus { filter: brightness(90%); } /* Vero */ .button.button-vero { color: #ffffff; background-color: #000000; border: 1px solid #ffffff; } .button.button-vero:hover, .button.button-vero:focus { filter: brightness(90%) } /* WIP */ .button.button-wip { color: #000000; background-color: #F9DB00} .button.button-wip:hover, .button.button-wip:focus { filter: brightness(90%) } /* write.as */ .button.button-writeas { color: #000000; background-color: #ffffff; border: 1px solid #000000; } .button.button-writeas:hover, .button.button-writeas:focus { filter: brightness(90%); } /* writefreely */ .button.button-writefreely { color: #000000; background-color: #f4f4f4; border: 1px solid #000000; } .button.button-writefreely:hover, .button.button-writefreely:focus { filter: brightness(90%); } /* writefreely */ .button.button-writefreely { color: #000000; background-color: #f4f4f4; border: 1px solid #000000; } .button.button-writefreely:hover, .button.button-writefreely:focus { filter: brightness(90%); } /* Xbox */ .button.button-xbox { color: #ffffff; background-color: #107C10; } .button.button-xbox:hover, .button.button-xbox:focus { filter: brightness(90%); }