/**
 * theme-variables.css
*/

:root {
    --root-font-size: 20px;
    --primary-font: 'Montserrat';
    --secondary-font: 'Montserrat';

    --body-text-color: #1B252C;
    --heading-text-color: #1B252C;

    --color-white: #fff;
    --color-dark: #1B252C;
    --color-yellow: #FFDE15;
    --color-orange: #FFB400;
    --color-grey: #3F4E5A;
    --color-grey-light: #9DAFBD;
    --color-input: #1B252C;
    --color-border: #9DAFBD;

    --background-white: #fff;
    --background-dark: #1B252C;
    --background-yellow: #FFDE15;
    --background-orange: #FFB400;
    --background-grey: #3F4E5A;
    --background-light-dark: #9DAFBD;
    --background-grey-dark: #191C22;

    --gradient-270: transparent linear-gradient(270deg, #FFDE15 0%, #FFB400 100%) 0% 0% no-repeat padding-box;
    --gradient-180: transparent linear-gradient(180deg, #FFDE15 0%, #FFB400 100%) 0% 0% no-repeat padding-box;
    --gradient-180-hover: transparent linear-gradient(180deg, #FFB400 0%, #FFDE15 100%) 0% 0% no-repeat padding-box;
    --gradient-dark: transparent linear-gradient(180deg, rgba(25, 28, 34, 0) 0%, rgba(25, 28, 34, 0.7) 48%, #191C22 100%) 0% 0% no-repeat padding-box;
    
    --section-padding-top-bottom: 5rem 0;
    --section-padding-top: 5rem 0 0;
    --section-padding-bottom: 0 0 5rem;
    --section-padding-bottom-small: 0 0 2.5rem;
    --section-padding-bottom-large: 0 0 10rem;

    --border-radius-half: .5rem;
    --border-radius-one: 1rem;
    --border-radius-one-quarter: 1.25rem;
    --border-radius-one-half: 1.5rem;
}


@media screen and (max-width: 1600px) {

    :root {
        --root-font-size: 19px;
        
    }

}


@media screen and (max-width: 1500px) {

    :root {
        --root-font-size: 18px;

    }

}


@media screen and (max-width: 1100px) {

    :root {
        --root-font-size: 17px;
    }

}



@media screen and (max-width: 982px) {

    :root {
        --root-font-size: 16px;
    }

}