:root {
	--color1: #fdfdfd; /*#FB7015;*/
	--color2: #020202;
	--color3: #fdfdfd;
	--email:  #333;
	--links:  #555;
	--3d1:	  cyan; /* cold */
	--3d2:	  red; /* hot */
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Quicksand', sans-serif;
  background-color: var(--color2);
  /*background-color: #06123A;*/
  color: var(--color3);
  font-size: 18px;
}

header {
  padding: 200px;
  text-align: center;
}

header h1 {
  letter-spacing: 3px;
  font-size: 100px; /* 55px; */
  margin: 0;
  font-family: 'Josefin Sans', sans-serif; 
  color: var(--color3); /* Define a cor do texto */
  text-shadow: -4px 0 1px var(--3d1), 4px 0 1px var(--3d2);
}

h1, h2 {
  text-overflow: clip;
}

h2{
  letter-spacing: 1px;
  margin: 0px;
  font-family: 'Josefin Sans', sans-serif; 
  text-shadow: -2px 0 1px var(--3d1), 2px 0 1px var(--3d2);
}

a{
  color: var(--links);
  text-decoration: underline;
}

.white-bg {
  background-color: var(--color2);
  color: var(--color3);
}

.white-bg h2 {
  color: var(--color1);
}

.color-bg {
  background-color: var(--color1);
  color: var(--color2);
}

.color-bg h2 {
  color: var(--color2);
}

.email {
  font-size: 18px;
  color: var(--email);
}

.container {
  display: flex;
  flex-direction: row;
}

.texto-longo {
  text-align: justify;
}

nav {
  width: 200px;
  background: rgba(0,0,0,0);
  /* border-right: 3px solid #F44B3C; */
  padding: 20px;
  display: flex;
  flex-direction: column;
  position: fixed;
  /*height: 100%;*/
}

nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  flex-grow: 1;
}

nav ul li {
  margin-bottom: 10px;
}

nav ul li a {
  text-decoration: none;
  color: var(--links);
  font-style: bold;
  /*font-size: 22px;*/
}

.content {
  /* height: 550px; */
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 270px;
  padding-right: 50px;
}

.handwrite {
  font-family: 'Sriracha', cursive; 
  font-size: 18px;
}

.pacifico {
  letter-spacing: 3px;
  font-size: 30px;
  font-family: 'Pacifico', cursive;
}

footer {
  background-color: #f1f1f1;
  padding: 20px;
  text-align: center;
}