* {
    padding: 0;
    margin: 0;
}

:root {
    --primary: #00c7a9;
    --dark_primary: #00b398;
    --light: #fffffff6;
    --white: #ffffff;
    --dark: #000000f6;
    --black: #000000;
}

html {
    scroll-behavior: smooth;
}

.material-icons {
    font-size: 20px !important;
}

/* default  */
.space_nowrap {
    white-space: nowrap !important;
}
.wrapper {
    max-width: 1240px !important;
}

.min_wrapper {
    max-width: 990px !important;
}

.main_heading {
    letter-spacing: -1px !important;
    line-height: 1.1 !important;
}

.fs_5 {
    font-size: 1.15rem !important;
}

.fs_6 {
    font-size: 0.95rem !important;
}

.fs_7 {
    font-size: 0.8rem !important;
}

.modal-content {
    background: var(--dark) !important;
}

.btn-close  {
    filter: invert(1);
}

/* text  */

.text_light {
    color: var(--light) !important;
}

.text_lighter {
    color: #ffffffbd !important;
}

.text_primary {
    color: var(--dark_primary) !important;
}

.text_white {
    color: var(--white) !important;
}

.text_ghostwhite {
    color: ghostwhite !important;
}

.text_dark {
    color: var(--dark) !important;
}

.text_dark_primary {
    color: var(--dark_primary) !important;
}

/* bgs  */
/* .bg_primary {
    background-color: primary;
}  */

/* buttons  */
.btn_primary {
    background: var(--primary);
    color: var(--black);
    fill: var(--black);
    padding: 0.65rem 1.4rem;
    border: none;
    outline: none;
    cursor: pointer;
    text-decoration: none;
    -moz-text-decoration-line: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    transition: 0.25s;
}

.btn_primary:hover {
    background: var(--dark_primary);
    color: var(--black);
    fill: var(--black);
}

.btn_explore {
    background-color: #75E151 !important;
    color: var(--dark);
    fill: var(--dark);
    padding: 0.65rem 1.4rem;
    border: none;
    outline: none;
    cursor: pointer;
    text-decoration: none;
    -moz-text-decoration-line: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    transition: 0.25s;
}

.btn_explore:hover {
    background: #68d445 !important;
    color: var(--light);
    fill: var(--light);
}

/* navbar  */
#navbar {
    transition: background 0.25s;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

#navbar:hover {
    background: var(--dark);
}

#navbar.active {
    background: var(--dark);
    box-shadow: 1px 1px 8px 2px #c4c4c41d;
}