/*
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	/* font-size: 100%; */
  /*
	font: inherit;
	vertical-align: baseline;
}

*/



html {
  scroll-behavior: smooth;
  }


body {
        left:5vw;
        overflow:auto;
        overflow-y: scroll;

        font-family:  'Quicksand','Afacad Flux', 'Quicksand','Rubik','Inter', sans-serif;
        font-optical-sizing: auto;
        font-variation-settings:"slnt" 0;
        font-style: normal;

        margin-left:5vw;
        padding:0px;
        width:100vw;
        max-width: 100vw;
        min-width: fit-content;
        margin-top: 7rem;
      /* background-color: #F7FAFC; */


}





 span {
        background:#FFF;
        width: auto;
        display: block;
}


h1 {

    font-size: 2rem;
    color: var(--p700);
    font-weight: 700;
    margin-bottom: 0.5rem;
  
}

h2 { 

    font-size: 1.5rem;
    color: var(--p700);
    font-weight: 500;
    margin-bottom: 0.35rem;
}

h3 {
    font-size: 1.3rem;
    color: var(--p700);
    font-weight: 500;
    margin-bottom:  0.25rem;
}

h4 {
    font-size: 1.15rem;
    color: var(--gray700);
    font-weight: 300;
    margin-bottom: 0.25rem;
}

h5 {
    font-size: 1rem;
    color: var(--gray700);
    font-weight: 300;
    margin-bottom:  0.25rem;
}

h6 {
    font-size: 0.8rem;
    color: var(--gray700);
    font-weight: 200;
    margin-bottom:  0.25rem;
}

p {
    font-size: 1rem;
    color: var(--gray700);
    font-weight: 300;
}

    figcaption {
        font-size: 0.9rem;
        color: var(--p900);
        margin-top: 0.5rem;
        text-align: center;
    }


ul {
    font-size: 1rem;
}

li {
    font-size: 1rem;
}

    /* ---  MEDIA QUERIES  --- */

    @media screen and (min-width: 768px) {
       html {
        font-size: 80%;
       }
    }

       @media screen and (min-width: 1024px) {
       html {
        font-size: 90%;
       }
    }

       @media screen and (min-width: 1200px) {
       html {
        font-size: 110%;
       }
    }