/*!
    Theme Name:     Me
    Theme URI:      https://jackduffy.co.uk
    Author:         Jack Duffy
    Author URI:     https://jackduffy.co.uk
    Description:    A new, minimal profile site.
    Created:        02/10/2020
    Version:        1.0.0
*/body,html{overflow-x:hidden;height:100%;margin:0}#particles{position:absolute;top:0;left:0;width:100%;height:100vh;height:-webkit-fill-available;opacity:.5}.container{max-width:1080px;width:94%;margin:auto;position:relative;z-index:1}section.home{display:flex;align-items:center;padding:50px 0}@media screen and (min-height:750px){section.home{padding:0;height:100vh;height:-webkit-fill-available}}.btn{display:inline-block;vertical-align:middle;transform:perspective(1px) translateZ(0);box-shadow:0 0 1px transparent;border-radius:30px;font-family:Rubik,sans-serif;font-size:16px;line-height:1;padding:12px 32px;font-weight:700;text-decoration:none}::-webkit-scrollbar{display:none}*{-ms-overflow-style:none;scrollbar-width:none}.profile{flex:1;max-width:540px;text-align:center;margin:auto}@media screen and (min-width:530px){.profile{text-align:left}}.profile .photo{width:175px;height:175px;border-radius:50%;background-color:#fff}@media screen and (min-width:530px){.profile .photo{display:inline-block;vertical-align:top;transform:translateY(-15px)}}.profile .profile-content{padding-top:15px}@media screen and (min-width:530px){.profile .profile-content{display:inline-block;vertical-align:top;padding-top:0;padding-left:25px}}.profile .profile-content h1{font-family:Rubik,sans-serif;font-weight:700;font-size:36px;margin:0 0 .5rem;color:#fff}.profile .profile-content p{font-family:Rubik,sans-serif;font-size:16px;color:#fff}.profile .profile-content .social{margin-top:1.5rem;padding:0}.profile .profile-content .social li{display:inline-block;list-style:none;margin:0 .75rem}@media screen and (min-width:530px){.profile .profile-content .social li{margin:0 1rem 0 0}}.profile .profile-content .social a{font-size:21px;color:#fff;text-decoration:none}#now-playing{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:10px 10px 10px 80px;border-radius:50px;width:calc(94% - 90px);height:55px;box-shadow:0 2px 5px 1px rgba(0,0,0,.15);position:fixed;bottom:10px;left:50%;z-index:999;cursor:pointer;transform:translateX(-50%) translateY(100px)}@media screen and (min-width:400px){#now-playing{bottom:25px;width:300px}}#now-playing.active{transition:transform 1s ease,bottom .3s ease;transform:translateX(-50%) translateY(0)}#now-playing.expanded{bottom:355px;box-shadow:0 5px 8px 1px rgba(0,0,0,.25)}#now-playing.expanded #expand-recent{transform:translateY(-50%) rotate(180deg)}#now-playing #expand-recent{position:absolute;top:50%;right:20px;transition:transform .5s ease;transform:translateY(-50%);color:#fff}.player-container{overflow:hidden;pointer-events:none}.player-container .album-art{width:55px;height:55px;border-radius:50%;position:absolute;top:10px;left:10px}.player-container .album,.player-container .artist,.player-container .title{display:table;position:relative;color:#fff;font-family:Rubik,sans-serif;white-space:nowrap;font-size:14px;line-height:1;margin:0 0 5px}.player-container .album.overflow,.player-container .artist.overflow,.player-container .title.overflow{width:300px;-webkit-animation:content-overflow 30s linear infinite;animation:content-overflow 30s linear infinite}.player-container .title{font-size:18px;font-weight:700}.player-container .album{margin-bottom:0}@-webkit-keyframes content-overflow{0%{transform:translateX(0)}32%{transform:translateX(-100%)}33%{transform:translateX(-100%) translateY(10000px)}34%{transform:translateX(100%) translateY(0)}66%{transform:translateX(0)}}@keyframes content-overflow{0%{transform:translateX(0)}32%{transform:translateX(-100%)}33%{transform:translateX(-100%) translateY(10000px)}34%{transform:translateX(100%) translateY(0)}66%{transform:translateX(0)}}#recently-played{width:100%;position:fixed;left:50%;height:400px;top:100vh;top:-webkit-fill-available;transform:translateX(-50%);z-index:998;box-sizing:border-box;border:1px solid rgba(0,0,0,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 5px 10px 1px rgba(0,0,0,.15);border-radius:25px 25px 0 0;transition:top .3s ease}@media screen and (min-width:425px){#recently-played{width:425px}}#recently-played.expanded{top:calc(100% - 400px)}#recently-played .recent-scroll{overflow-y:scroll;height:100%;box-sizing:border-box;padding:75px 20px 0}#recently-played .recent-title{position:relative;font-family:Rubik,sans-serif;font-size:28px;margin:0 0 30px;font-weight:600;color:#fff}#recently-played .recent-title .source{font-family:Rubik,sans-serif;font-size:13px;display:block;font-weight:300}#recently-played #recent,.recent-track{position:relative}.recent-track{padding-left:65px;margin-bottom:20px}.recent-track .album-art{top:0;left:0}.playing-indicator{position:absolute;background-color:rgba(0,0,0,.4);width:55px;height:55px;border-radius:50%;top:10px;left:10px;opacity:0;pointer-events:none;transition:opacity .3s ease}.playing-indicator.active{opacity:1}.playing-indicator .play{display:block;position:absolute;width:2px;height:12px;background-color:#fff;transform-origin:0 100%;top:23px;left:26px;-webkit-animation:playing .5s ease .2s infinite alternate;animation:playing .5s ease .2s infinite alternate}.playing-indicator .play:after,.playing-indicator .play:before{content:" ";display:block;position:absolute;width:2px;height:100%;background-color:#fff;transform-origin:0 100%;bottom:0;left:4px;-webkit-animation:playing .5s ease .1s infinite alternate;animation:playing .5s ease .1s infinite alternate}.playing-indicator .play:after{left:-4px;-webkit-animation:playing .5s ease .3s infinite alternate;animation:playing .5s ease .3s infinite alternate}@-webkit-keyframes playing{0%{transform:scaleY(.6)}to{transform:scaleY(1.1)}}@keyframes playing{0%{transform:scaleY(.6)}to{transform:scaleY(1.1)}}.colours-purple{background:#353252}.colours-purple .btn{color:#fff;background:#b82e3e}.colours-purple #now-playing,.colours-purple .colour-picker{background-color:rgba(53,50,82,.25)}.colours-purple #now-playing.expanded,.colours-purple #recently-played,.colours-purple .colour-picker.expanded{background-color:rgba(53,50,82,.85)}.colours-red{background:#ad3535}.colours-red .btn{color:#ad3535;background:#fff}.colours-red #now-playing,.colours-red .colour-picker{background-color:rgba(153,33,33,.25)}.colours-red #now-playing.expanded,.colours-red #recently-played,.colours-red .colour-picker.expanded{background-color:rgba(153,33,33,.85)}.colours-dark{background:#1a1919}.colours-dark .btn{color:#1a1919;background:#fff}.colours-dark #now-playing,.colours-dark .colour-picker{background-color:rgba(26,25,25,.25)}.colours-dark #now-playing.expanded,.colours-dark #recently-played,.colours-dark .colour-picker.expanded{background-color:rgba(26,25,25,.85)}.colour-picker{position:fixed;display:none;top:10px;right:10px;background-color:#fff;list-style:none;padding:7px 10px;margin:0;font-size:0;box-shadow:0 2px 5px 1px rgba(0,0,0,.15);border-radius:20px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@media screen and (min-height:750px){.colour-picker{display:block}}.colour-picker li{display:inline-block;vertical-align:top;width:20px;height:20px;border-radius:50%;border:2px solid transparent;cursor:pointer}.colour-picker li:not(:last-child){margin-right:5px}.colour-picker li.active{border-color:#fff}@font-face{font-family:me;src:url(/src/fonts/me.eot?mce4kt);src:url(/src/fonts/me.eot?mce4kt#iefix) format("embedded-opentype"),url(/src/fonts/me.ttf?mce4kt) format("truetype"),url(/src/fonts/me.woff?mce4kt) format("woff"),url(/src/fonts/me.svg?mce4kt#me) format("svg");font-weight:400;font-style:normal;font-display:block}i{font-family:me!important;speak:never;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.me-pause:before{content:"\E907"}.me-play:before{content:"\E906"}.me-caret-down:before{content:"\E905"}.me-music:before{content:"\E900"}.me-steam:before{content:"\E901"}.me-github:before{content:"\E902"}.me-instagram:before{content:"\E903"}.me-twitter:before{content:"\E904"}