@import './icons.css';
 @import './fonts.css';
 @import './body.css';
 @import './link.css';
 @import './button-icon.css';
 @import './sidebar.css';
 @import './ellipse.css';
 @import './player.css';
 @import './playlist-a.css';
 @import './playlist-b.css';
 @import './playlist-list.css';
 @import './search.css';
 @import './navigation.css';
 @import './header.css';
 @import './sticky.css';
 @import './page.css';
 @import './layout.css';
 @import './scrollBar.css';



:root {
    font-size: 14px;
    --primary: #00B050;
    --white: #FFFFFF;
    --gray10: #B3B3B3;
    --gray20: #737373;
    --gray30: #282828;
    --gray40: #181818;
    --gray50: #121212;
    --black: #000000;
    --baseFontFamily: Avenir, Helvetica, sans-serif; 
    --headLine1: 900 2rem/normal var(--baseFontFamily);
    --headLine2: 800 1.5rem/1.75rem var(--baseFontFamily); 
    --subTitle2: 400 .75rem/1.024375rem var(--baseFontFamily); 
    --baseFontNormal: 400 .875rem/1.375rem var(--baseFontFamily); 
    --baseFontBold: 900 .875rem/1.375rem var(--baseFontFamily); 
    --button: 500 .876rem/1rem var(--baseFontFamily);
    --small: 400 .65em/normal var(--baseFontFamily);
}

@media screen and (min-width: 768px) {
    :root {
        font-size: 16px;
    }        
}

@media screen and (min-width: 1367px) {
    :root {
        font-size: 18px;
    }        
}