@import url('https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.3.1/css/all.min.css');

html {
  font-size: 16px;
}

body {
  font-family: 'Roboto', sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: 'wdth' 100;
  font-size: 1rem;
}
.body {
  background: linear-gradient(to right, #c6e2c4 5%, #9fe29a 17%, #61b15c 40%, #30722c 85%, #062c03 95%);
}
.negative {
  background: linear-gradient(to left, #93adad -50%, #77a0b1 -10%, #4a7c92 0%, #125772 100%, #041a97 150%);
}
.percents {
  background: linear-gradient(to bottom, #c6e2c4 2em, #9fe29a 4em, #76c570 8em, #499e45 16em, #298623 32em, #104b0c 64em, #042901 128em);
}
.radial {
  background: radial-gradient(ellipse at top, orange, transparent), radial-gradient(ellipse at bottom, red, transparent);
}
h1 {
  font-size: 1.45rem;
}
h2 {
  font-size: 1.3rem;
}

div span {
  font-size: 1.142859em;
}

span span {
  font-size: 1.6em;
}

strong {
  font-size: 1.6rem;
}

h1,
h2,
h3 {
  color: grey;
  font-weight: 700 
}
.list-unstyled {
  list-style: none;
}
.footer-social {}

#main {
  color: #e60202;
}

.h2 {
  color: red;
}

.heading {
  color: green;
}