/*
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 {
        overflow-x: hidden;
        /* overflow-y: hidden; */
        margin: auto;
        width:100%;
        max-width: 100rem;
        min-width: fit-content;
         /* 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-top: 7rem;
        background-color: var(--gray100,#F5F5F5); 
  /* display: flex;
  flex-wrap: wrap;  */

}


html, body {
  /* overflow-x: hidden; */
}


 span {
        background:transparent;
        width: auto;
        display: block;
}


h1 {

    font-size: 1.8rem;
    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: 1.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: 1.1rem;
}

li {
    font-size: 1.1rem;
}

  /* --- MEDIA QUERIES --- */
/*   --  768px --- */
@media screen and (min-width: 48rem) {
  html {
    font-size: 70%;
  }
}
/*   --  1024px --- */
@media screen and (min-width: 64rem) {
  html {
    font-size: 75%;
  }
}
/*   --  1300px --- */
@media screen and (min-width: 81.25rem) {
  html {
    font-size: 80%;
  }
}
/*   --  2880px --- */
@media screen and (min-width: 180rem) {
  html {
    font-size: 90%;
  }
}