#loading{display:flex;justify-content:center;align-items:center;position:absolute;height:100vh;width:100vw;background-color:var(--white);z-index:100000}#loading .lds-default{display:inline-block;position:relative;width:80px;height:80px}#loading .lds-default div{position:absolute;width:6px;height:6px;background:var(--black);border-radius:50%;-webkit-animation:lds-default 1.2s linear infinite;animation:lds-default 1.2s linear infinite}#loading .lds-default div:first-child{-webkit-animation-delay:0s;animation-delay:0s;top:37px;left:66px}#loading .lds-default div:nth-child(2){-webkit-animation-delay:-.1s;animation-delay:-.1s;top:22px;left:62px}#loading .lds-default div:nth-child(3){-webkit-animation-delay:-.2s;animation-delay:-.2s;top:11px;left:52px}#loading .lds-default div:nth-child(4){-webkit-animation-delay:-.3s;animation-delay:-.3s;top:7px;left:37px}#loading .lds-default div:nth-child(5){-webkit-animation-delay:-.4s;animation-delay:-.4s;top:11px;left:22px}#loading .lds-default div:nth-child(6){-webkit-animation-delay:-.5s;animation-delay:-.5s;top:22px;left:11px}#loading .lds-default div:nth-child(7){-webkit-animation-delay:-.6s;animation-delay:-.6s;top:37px;left:7px}#loading .lds-default div:nth-child(8){-webkit-animation-delay:-.7s;animation-delay:-.7s;top:52px;left:11px}#loading .lds-default div:nth-child(9){-webkit-animation-delay:-.8s;animation-delay:-.8s;top:62px;left:22px}#loading .lds-default div:nth-child(10){-webkit-animation-delay:-.9s;animation-delay:-.9s;top:66px;left:37px}#loading .lds-default div:nth-child(11){-webkit-animation-delay:-1s;animation-delay:-1s;top:62px;left:52px}#loading .lds-default div:nth-child(12){-webkit-animation-delay:-1.1s;animation-delay:-1.1s;top:52px;left:62px}@-webkit-keyframes lds-default{0%,20%,80%,to{transform:scale(1)}50%{transform:scale(1.5)}}@keyframes lds-default{0%,20%,80%,to{transform:scale(1)}50%{transform:scale(1.5)}}img{position:absolute;left:0;width:100%;z-index:-1000}#color-mode-container{display:flex;justify-content:center;align-items:center;position:absolute;left:50px;top:40px;z-index:1}#color-mode-container #color-mode{cursor:pointer;display:flex;align-items:center;position:relative;padding:0 2px;margin:0 5px;height:14px;width:30px;border-radius:10px;background:var(--black)}#color-mode-container #color-mode-toggle{position:relative;height:10px;width:10px;border-radius:50%;background:var(--white);transition:transform .1s ease}#color-mode-container #color-mode-toggle.dark-mode-enabled{transform:translate(16px)}#footer{display:flex;justify-content:center;align-items:center;height:100px}.loading-leave-active,.loading-leave-to{opacity:0;transition:opacity .25s}.post{position:relative;margin:20px;width:calc(50% - 40px);min-width:300px;height:200px;text-align:left;border-radius:10px;color:var(--black);background:rgba(var(--primary-rgb),.5);box-shadow:0 0 10px -8px var(--black);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);overflow:hidden;transition:box-shadow .25s;-webkit-animation:opacity-in .25s;animation:opacity-in .25s}.post *{padding:10px}.post .read-more{display:flex;justify-content:center;align-items:flex-end;position:absolute;bottom:0;height:90px;width:100%;background:linear-gradient(180deg,transparent,var(--primary) 50%)}.post:hover{box-shadow:0 0 15px -5px var(--black)}#posts-container{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;margin:auto;padding:20px;max-width:60rem}#blog{-webkit-animation:opacity-in .5s;animation:opacity-in .5s}:root{--font-primary:Avenir,Helvetica,Arial,sans-serif;--black:#2c3e50;--black-rgb:44,62,80;--white:#fafff9;--white-rgb:250,255,249;--primary:#83e482;--primary-rgb:131,228,130;--secondary:#eeeb33;--secondary-rgb:238,235,51}[data-mode=dark]{--black:#fafff9;--white:#2c3e50;--black-rgb:250,255,249;--white-rgb:44,62,80;--primary:#2c3e50;--primary-rgb:44,62,80;--secondary:#2c3e50;--secondary-rgb:44,62,80}@-webkit-keyframes opacity-in{0%{opacity:0}}@keyframes opacity-in{0%{opacity:0}}@-webkit-keyframes scale-in{0%{opacity:0;transform:scale(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(0)}}@-webkit-keyframes spin{0%{transform:rotate(0deg)}}@keyframes spin{0%{transform:rotate(0deg)}}#not-found{display:flex;justify-content:center;align-items:center;height:100vh}#not-found h1{transform:translateY(-100%)}