@import "layout.css";
@import "sidebar.css";
@import "footer.css";
@import "main.nav.css";
@import "main.content.css";
@import "main.popularsong.css";
@import "main.popularartist.css";

:root {
    --white: #ffffff;
    --black: #000000;
    --gray-100: #a4a8b4;
    --gray-200: gray;
    --gray-300: #4c5262;
    --gray-800: #131312;
    --lighBlue-500: #36e2ec;
    --lighBlue-600: #50c3c9;
    --blue-800: #090f1f;
    --navBlue-700: #111727;
    --navBlue-800: #0b1320;
    --navBlue-900: #111727;
    --transition-100: rgb(105, 105, 170, .1);
    --transition-200: rgb(184, 184, 184, .1);
}

:focus {
    outline: transparent;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

body {
    width: 100%;
    height: 100vh;
    background-color: var(--gray-800);
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-font-smoothing: antialiased;
    overflow-x:hidden;
}

body, input, textarea, button {
    font-family: 'Poppins', sans-serif;
}

@media (max-width: 800px) {
    html {
        font-size: 80%;
    }
}