/*common variables*/

:root {
    /*--mobile-spacing: 30px;*/
    --mobile-spacing: 30px;
    --x-small-width: calc(100% - var(--mobile-spacing));
    --small-width: 95%;
    --medium-width: 92%;
    --large-width: 88%;
    --x-large-width: 88%;
    --xx-large-width: 1240px;
    --mr_fontsize: 1.6rem;
}


/* X-Small devices (portrait phones, less than 576px) */

:root {
    --global-width: var(--x-small-width);
}


/* Small devices (landscape phones, 576px and up) */

@media (min-width: 576px) {
     :root {
        --global-width: var(--small-width);
    }
}


/* Medium devices (tablets, 768px and up) */

@media (min-width: 768px) {
     :root {
        --global-width: var(--medium-width);
    }
}


/* Large devices (laptops, 992px and up) */

@media (min-width: 992px) {
     :root {
        --global-width: var(--large-width);
    }
}


/* X-Large devices (large desktops, 1200px and up) */

@media (min-width: 1200px) {
     :root {
        --global-width: var(--x-large-width);
    }
}


/* XX-Large devices (larger desktops, 1400px and up) */

@media (min-width: 1366px) {
     :root {
        --global-width: var(--xx-large-width);
    }
}

@media (min-width: 1921px) {
     :root {
        --mr_fontsize: 1.6rem;
    }
}


/* Colors */

:root {
    --mr_color__pink: #CA1D5B;
    --mr_color__yellow: #FED800;
    --mr_color__white: #FFFFFF;
    --mr_color__black: #000;
    --mr_color__lightblue: #F6F8FD;
    --mr_color__primary: #273370;
    --mr_color__linkwater: #CACCDA;
    --mr_color__pacificblue: #01A3CB;
    --mr_color__red: #ff4c4c;
    --mr_color__sweetblue: #E2EAFA;
    --mr_color__violet: #7478A3;
}


/* Fonts Variables */

:root {
    /* Font Size */
    --mr_fontsize__xsmall: min(max(1.2rem, 1.2vw), 1.2rem);
    --mr_fontsize__small: min(max(1.2rem, 1.4vw), 1.4rem);
    --mr_fontsize__normal: min(max(1.4rem, 1.6vw), 1.6rem);
    --mr_fontsize__normal2: min(max(1.6rem, 1.8vw), 1.8rem);
    --mr_fontsize__seoheader: min(max(1.9rem, 1.9vw), 1.9rem);
    --mr_fontsize__medium: min(max(1.8rem, 2vw), 2rem);
    --mr_fontsize__title: min(max(2.4rem, 3vw), 3rem);
    --mr_fontsize__big: min(max(2.4rem, 3vw), 4.0rem);
    --mr_fontsize__bigger: min(max(2.8rem, 5vw), 5.0rem);
    --mr_fontsize__biggest: min(max(4rem, 10vw), 8.0rem);
    /* Font Weight */
    --mr_fontweight__light: 300;
    --mr_fontweight__regular: 400;
    --mr_fontweight__medium: 500;
    --mr_fontweight__semibold: 600;
    --mr_fontweight__bold: 700;
    --mr_fontweight__black: 900;
}