:root {
  --primary-color: #fad961;
  --secondary-color: #b721ff;
  background-color: #352845 ;
  /* background-color: linear-gradient(360deg,  #271f32 0%, #0f0215 20%); */
  /* background-image: linear-gradient(340deg,  #352845 0%, #100117 100%); */
}

html {
  height: 100%;
  background-size: cover;
  /* background-color: #fad961; */
  /* background-image: linear-gradient(360deg,  #271f32 0%rgb(81, 14, 112)15 100%); */
}
/* Reset some basic elements */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul {
  margin: 0;
  padding: 0;
}
body {
  /* font-family: Arial, Helvetica, sans-serif; */
  font-family: Inter;
  line-height: 1.6;
  /* color: #a11d1d; */
  /* background-color:#fad961; */
  background-image: linear-gradient(340deg,  #352845 0%, #100117 100%);
  /* padding: 20px; */
  height: 100%;
  margin-bottom: 20px;
}

/* Headers */
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #ffffff;
  margin-bottom: 10px;
}

h1 {
  font-size: 2.5em;
}

h2 {
  font-size: 2em;
}

h3 {
  font-size: 1.375em;
}

h4 {
  font-size: 1.125em;
}

h5 {
  font-size: 1em;
}

h6 {
  font-size: 0.875em;
}

/* Paragraphs */
p {
  margin-bottom: 20px;
}

a {
  color: #fad961;
  text-decoration: none;
  font-weight: normal;
}
a:hover {
  color: #b721ff;
  text-decoration: none;
}


hr {
  height: 1px; /* adjust the height to reduce the line thickness */
  /* width: 60px; */
  opacity: 0.5;
}

.text-marker {
  color: #fad961;
  text-decoration: none;
  font-weight: normal;
}
.text-marker-pink {
  color:  #fa61c4;
  text-decoration: none;
  font-weight: normal;
}
a.text-marker-pink:visited {
  color:   #fa61c4;
  text-decoration: none;
  font-weight: normal;
}

.display-huge {
  font-size: calc(2.5rem + 1.5vw);
  font-weight: 600;
  letter-spacing: -0.02rem;
}

/* Storlek för mobiler */

/* Breakpoints: */
/* > 300px SM*/
@media only screen and (min-width: 300px) {
.display-huge {
  font-size: calc(1.9rem );
  font-weight: 600;
  letter-spacing: -0.02rem;
}
h4 {
  font-size: 1em;
}
h5 {
  font-size: 0.9em;
}
p {
  font-size: 0.9em;
}

}
/* >= 768px M*/
@media only screen and (min-width: 768px) {
.display-huge {
  font-size: calc(2.2rem);
  font-weight: 600;
  letter-spacing: -0.02rem;
}
h4 {
  font-size: 1.1em;
}
h5 {
  font-size: 0.9em;
}
p {
  font-size: 1.1em;
}

}
/* >= 992px L*/
@media only screen and (min-width: 992px) {
.display-huge {
  font-size: calc(2.5rem + 1.5vw);
  font-weight: 600;
  letter-spacing: -0.02rem;
}
h4 {
  font-size: 1.125em;
}
h5 {
  font-size: 0.9em;
}
p {
  font-size: 1.1em;
}


}
/* >= 1200px XL*/
@media only screen and (min-width: 1200px) {

}
/* >= 1400px XXL*/
@media only screen and (min-width: 1400px) {

}