:root{--font-inter:"Inter",sans-serif;--limegreen:#1db489;--brightred:#dc414c;--facebook:#198ff5;--twitter:#1ca0f2;--instagram-start:#fdc468;--instagram-middle:#ee867c;--instagram-end:#df4996;--youtube:#c4032a;--toggle-bg-light:#aeb3cb;--toggle-bg-start:#378fe6;--toggle-bg-end:#3eda82;--toggle-light:#868cac;--toggle-button-light:#f0f2f9;--dark-bg:#1e202a;--dark-top-bg:#1f212e;--dark-card:#252a41;--dark-card-hover:#343b56;--dark-text1:#8b97c6;--dark-text2:#fff;--light-bg:#fff;--light-top-bg:#f5f7ff;--light-card:#f0f2fa;--light-card-hover:#e0e4f0;--light-text1:#63677e;--light-text2:#1e202a;--background:var(--light-bg);--text-color:var(--light-text2);--text-color2:var(--light-text1);--card-bg:var(--light-card);--card-hover:var(--light-card-hover);--toggle:var(--toggle-light);--toggle-bg:var(--toggle-bg-light);--toggle-button:var(--toggle-button-light)}@media (prefers-color-scheme:dark){:root{--background:var(--dark-bg);--text-color:var(--dark-text2);--text-color2:var(--dark-text1);--card-bg:var(--dark-card);--card-hover:var(--dark-card-hover);--toggle:var(--light-bg);--toggle-bg:linear-gradient(225deg,var(--toggle-bg-end) 0%,var(--toggle-bg-start) 98.02%);--toggle-button:var(--dark-bg)}}body.light{--background:var(--light-bg);--text-color:var(--light-text2);--text-color2:var(--light-text1);--card-bg:var(--light-card);--card-hover:var(--light-card-hover);--toggle:var(--toggle-light);--toggle-bg:var(--toggle-bg-light);--toggle-button:var(--toggle-button-light)}body.dark{--background:var(--dark-bg);--text-color:var(--dark-text2);--text-color2:var(--dark-text1);--card-bg:var(--dark-card);--card-hover:var(--dark-card-hover);--toggle:var(--light-bg);--toggle-bg:linear-gradient(225deg,var(--toggle-bg-end) 0%,var(--toggle-bg-start) 98.02%);--toggle-button:var(--dark-bg)}html{box-sizing:border-box;font-size:100%}*,:after,:before{box-sizing:inherit}body{background-color:var(--background);color:var(--text-color);font-family:var(--font-inter);margin:0;padding:0}h1,h2,h3,h4,h5{line-height:1.1;margin-bottom:0}h1{font-style:1.5rem}@media (min-width:71.875em){h1{font-style:1.75rem}}a,a:active,a:visited{text-decoration:none}.container{margin:0 auto 2.875rem;max-width:69.375rem;padding:0 1.5625rem}@media (min-width:71.875em){.container{padding:0}}.header{margin-top:2.25rem}@media (min-width:40em){.header{align-items:center;display:flex;justify-content:space-between}}.header__subtitle{color:var(--text-color2);font-size:.875rem;font-weight:700}.header hr{border-color:var(--text-color2);margin:1.25rem 0 .9375rem;width:100%}@media (min-width:40em){.header hr{display:none}}.toggle{align-items:center;border:none;display:flex;justify-content:space-between}@media (min-width:40em){.toggle{justify-content:end}}.toggle__wrapper{border-radius:3.5em;display:flex;font-size:.5625rem;height:3.5em;position:relative;vertical-align:middle;width:7em}.toggle input[type=radio]{cursor:pointer;display:inline-block;opacity:0;position:relative;width:50%;z-index:1}.toggle input[type=radio][id=dark]:checked~.toggle__button{left:10%}.toggle input[type=radio][id=dark]:checked~__background{background:linear-gradient(225deg,var(--toggle-bg-start) 0,var(--toggle-bg-end) 98%)}.toggle__background{background:var(--toggle-bg);border-radius:3.5em;height:100%;left:0;top:0;width:100%;z-index:0}.toggle__background,.toggle__button{display:block;position:absolute;transition:all .1s ease-out}.toggle__button{background-color:var(--toggle-button);border-radius:50%;height:1.6875rem;left:50%;right:0;right:100%;top:50%;transform:translateY(-50%);width:1.6875rem;z-index:2}.toggle .label{cursor:pointer;display:none;font-size:1.125rem;font-weight:700;margin:0 .5em}.toggle .label--show{display:block}.cards__title{margin-bottom:1.5625rem;margin-left:0;margin-right:0;margin-top:inherit}.cards__wrapper{display:grid;gap:1.5625rem;grid-template-columns:1fr}@media (min-width:40em){.cards__wrapper{grid-template-columns:1fr 1fr}}@media (min-width:52.5em){.cards__wrapper{grid-template-columns:1fr 1fr 1fr 1fr}}.card{align-items:center;background-color:var(--card-bg);color:var(--text-color2);cursor:pointer;display:flex;flex-direction:column;height:11.875rem;justify-content:space-between;padding:1.5625rem;transition:background .15s ease-in-out;width:100%}.card--big{background-clip:padding-box;border-radius:0 0 .375rem .375rem;border-top:.34375rem solid transparent;position:relative}.card:before{border-radius:.375rem;bottom:90%;content:"";left:0;position:absolute;right:0;top:-.25rem;z-index:-1}.card--facebook:before{background:var(--facebook)}.card--instgram:before{background:linear-gradient(225deg,var(--instagram-end),var(--instagram-middle) 50.91%,var(--instagram-start) 100%)}.card--twitter:before{background:var(--twitter)}.card--youtbe:before{background:var(--youtube)}.card__platform-container{align-items:center;display:flex;gap:.4375rem;justify-content:center}.card__icon{max-width:1.25rem;min-width:1.25rem}.card__username{font-size:.8125rem;margin:0}.card__username a{color:var(--text-color2)}.card__username a:hover{color:var(--text-color)}.card__count-container{align-items:center;display:flex;flex-direction:column;justify-content:space-between}.card__count{color:var(--text-color);display:block;font-weight:700;text-align:center}.card__count--small{font-size:1.5625rem}.card__count--big{font-size:3.125rem}.card__label{font-size:.75rem;letter-spacing:.3125rem;text-transform:uppercase}.card__change{font-size:.75rem;margin:0}.card__change:before{background-repeat:no-repeat;content:"";display:inline-block;height:.25rem;width:.5rem}.card__change--up{color:var(--limegreen)}.card__change--up:before{background-image:url(../../../images/icon-up.svg)}.card__change--down{color:var(--brightred)}.card__change--down:before{background-image:url(../../../images/icon-down.svg)}.card--small{border-radius:.375rem;height:7.5rem}.card__top-container{align-items:center;display:flex;justify-content:space-between;width:100%}.card__meta{font-size:.9375rem;margin-top:0}.card__bottom-container{align-items:end;display:flex;justify-content:space-between;width:100%}.card:hover{background-color:var(--card-hover);cursor:pointer}.footer__copyright{color:var(--text-color);font-size:.8125rem;text-align:center}.footer__link{color:var(--text-color2)}.footer__link:hover{color:var(--brightred)}
/*# sourceMappingURL=style.css.map */