:root {
    --habit-font-face-roboto: Roboto, sans-serif;
    --habit-font-face-poppins: Poppins, sans-serif;
    --habit-white: #fff;
    --habit-dark-grey: #323232;
    --habit-sunny: #ffbc13;
    --habit-dark-blue: #1d1f49;
    --habit-grey: #c0c6d1;
    --habit-grey-dark: #7e8aa0;
    --habit-grey-light: #f0f1f4
}

body {
    font-family: var(--habit-font-face-roboto)
}

html, body {
    height: 100%
}

.container {
    max-width: 100%
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--habit-font-face-poppins)
}

.font-roboto {
    font-family: var(--habit-font-face-roboto)
}

.font-poppins {
    font-family: var(--habit-font-face-poppins)
}

.hidden {
    display: none !important
}

.title-habit {
    line-height: 30px !important
}

.dark-habit {
    color: #1d1f49
}

.grey-habit {
    color: #c0c6d1
}

.grey-dark-habit {
    color: #7e8aa0
}

.sunny-habit {
    color: #ffbc13;
    fill: #ffbc13
}

.bold {
    font-weight: 600
}