/* global variables */
:root {
    --fontsize: calc(0.3125rem + ((1vw - 3.6px) * 0.4965));
}

:root {
    /* add fluid rem function */
    font-size: max(37.5%, min(var(--fontsize), 62.5%));
    /* RWD */
    --global-width: min(calc(320px + ((1vw - 3.6px) * 100)), 123.5rem);
    /* --global-width--small: min(calc(320px + ((1vw - 3.6px) * 88)), 80.8rem); */
    /*small

    /* colors */
    --color-white: #fff;
    --color-black: #000;
    --color-dark: #2B2B2B;
    --color-gray: #3F3F3F;
    --color-light-gray: #7C8796;
    --color-box-gray: #F1F1F1;
    --color-green:#76C3AB;
    --color-light-green:#E2F9E6;
    --color-turquoise:#90DBD1;
    --color-red:#E04C4C;

    /* fonts */
    --font-family-main: "Poppins", sans-serif;
    --font-family-rowan: "Rowan", sans-serif;
    --font-size-11: max(11px, 1.1rem);
    --font-size-12: max(12px, 1.2rem);
    --font-size-14: max(14px, 1.4rem);
    --font-size-16: max(15px, 1.6rem);
    --font-size-18: max(17px, 1.8rem);
    --font-size-20: max(18px, 2rem);
    --font-size-21: max(21px, 2.1rem);
    --font-size-32: max(28px, 3.2rem);
    --font-size-52: max(32px, 5.2rem);

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    font-family: var(--font-family-main);
}

@media(min-width: 2048px) {
    :root {
        font-size: 85%;
    }
}

@media(min-width: 3840px) {
    :root {
        font-size: 140%;
    }
}

/* Font family for headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-rowan);
}

/* Color Classes */
.color-white {
    color: var(--color-white);
}

.color-black {
    color: var(--color-black);
}

.color-dark {
    color: var(--color-dark);
}

.color-light-gray {
    color: var(--color-light-gray);
}

.color-green {
    color: var(--color-green);
}

.color-light-green {
    color: var(--color-light-green);
}

.color-turquoise {
    color: var(--color-turquoise);
}

.color-red {
    color: var(--color-red);
}

.color-gray {
    color: var(--color-gray);
}

/* Background Color Classes */

.bg-white {
    background-color: var(--color-white);
}

.bg-black {
    background-color: var(--color-black);
}

.bg-gray {
    background-color: var(--color-gray);
}

.bg-dark {
    background-color: var(--color-dark);
}

.bg-light-gray {
    background-color: var(--color-light-gray);
}

.bg-green {
    background-color: var(--color-green);
}

.bg-light-green {
    background-color: var(--color-light-green);
}

.bg-turquoise {
    background-color: var(--color-turquoise);
}

.bg-red {
    background-color: var(--color-red);
}

/* Font Family Classes */
.font-family-main {
    font-family: var(--font-family-main);
}

.font-family-rowan {
    font-family: var(--font-family-rowan);
}

/* Font Size Classes */
.font-size-11 {
    font-size: var(--font-size-11);
}

.font-size-12 {
	font-size: var(--font-size-12);
}

.font-size-14 {
    font-size: var(--font-size-14);
}

.font-size-16 {
    font-size: var(--font-size-16);
}

.font-size-18 {
    font-size: var(--font-size-18);
}

.font-size-20 {
    font-size: var(--font-size-20);
}

.font-size-21 {
    font-size: var(--font-size-21);
}

.font-size-32 {
    font-size: var(--font-size-32);
}

.font-size-52 {
    font-size: var(--font-size-52);
}

.line-height-30 {
    line-height: max(30px, 3rem);
}

/* Font Weight Classes */
.font-weight-light {
    font-weight: var(--font-weight-light);
}

.font-weight-regular {
    font-weight: var(--font-weight-regular);
}

.font-weight-medium {
    font-weight: var(--font-weight-medium);
}

.font-weight-semibold {
    font-weight: var(--font-weight-semibold);
}

.font-weight-bold {
    font-weight: var(--font-weight-bold);
}

.font-weight-extrabold {
    font-weight: var(--font-weight-extrabold);
}

.poppins {
    font-family: var(--font-family-main);
}

.rowan {
    font-family: var(--font-family-rowan);
}

.cont {
    width: var(--global-width);
    max-width: 96%;
}

a {
    text-decoration: none;
}

.slick-track {
    display: flex !important;
}

.slick-slide {
    height: inherit !important;
}
