@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,500,600,700&display=swap');

:root {
 --color-card-background: hsl(0, 0%, 100%);
 --color-calendar-card-background: hsl(232, 19%, 84%);


--color-primary: hsl(221, 73%, 24%);
--color-primary-darker: hsl(221, 73%, 19%);
--color-primary-darkest: hsl(221, 73%, 14%);
--color-primary-translucent: hsla(221, 73%, 24%, .48);
--color-secondary: hsl(44, 61%, 53%);
--color-secondary-darker: hsl(44, 61%, 48%);
--color-secondary-darkest: hsl(44, 61%, 43%);
--color-secondary-translucent: hsla(44, 61%, 53%, .48);
--color-tertiary: hsl(95, 36%, 46%);
--color-tertiary-12: hsla(95, 36%, 46%, .12);
--color-tertiary-24: hsla(95, 36%, 46%, .24);
--color-tertiary-36: hsla(95, 36%, 46%, .36);
--color-tertiary-48: hsla(95, 36%, 46%, .48);
--color-tertiary-60: hsla(95, 36%, 46%, .60);
--color-tertiary-72: hsla(95, 36%, 46%, .72);
--color-tertiary-84: hsla(95, 36%, 46%, .84);
--color-tertiary-96: hsla(95, 36%, 46%, .96);

    --color-background-24: hsla(216, 9%, 89%, .24);
    --color-background-6: hsla(216, 9%, 89%, .6);
    --color-footer-background: hsla(216, 9%, 89%, .24);

    --color-light: hsl(0, 0%, 100%);
    --color-dark: hsl(0, 0%, 0%);
    --color-grey-1: hsl(0, 0%, 97%);
    --color-grey-2: hsl(0, 0%, 95%);
    --color-grey-3: hsl(0, 0%, 90%);
    --color-grey-4: hsl(0, 0%, 60%);
    --color-grey-5: hsl(0, 0%, 40%);


    --font-size: 16px;
    --font-family: 'Roboto', serif;
    --heading-font-family: 'Roboto';
    --heading-font-family: 'Nunito Sans';



    --shadow-default: 0 2px 16px 0 rgba(0,0,0,0.12);
    --shadow-darker: 0 2px 16px 0 rgba(0,0,0,0.16);
    --shadow-lighter: 0 2px 16px 0 rgba(0,0,0,0.08);
    --shadow-inset: inset 0 1px 3px 0 rgba(0,0,0,0.12);
}

html {
    font-size: var(--font-size);
}

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

    .t-single {
        
            h2 {
                font-size: 1.5rem!important;
                font-weight: 700!important;
                color: #000000!important;

                @media (min-width: 992px) {
                    font-size: 2rem!important;
                }
            }
        
            h3 {
                font-size: 1.125rem!important;
                font-weight: 700!important;
                color: #000000!important;

                @media (min-width: 992px) {
                    font-size: 1.375rem!important;
                }
            }
        
            h4 {
                font-size: 1.125rem!important;
                font-weight: 700!important;
                color: #000000!important;

                @media (min-width: 992px) {
                    font-size: 1.25rem!important;
                }
            }
        
            h5 {
                font-size: 1.125rem!important;
                font-weight: 700!important;
                color: #102c68!important;

                @media (min-width: 992px) {
                    font-size: 1.25rem!important;
                }
            }
        
            h6 {
                font-size: 1rem!important;
                font-weight: 700!important;
                color: #70a14c!important;

                @media (min-width: 992px) {
                    font-size: 1rem!important;
                }
            }
            }