.body {
  background-color:#ffffff;
  color:#4f4440;
  font-family: "Ibarra Real Nova", serif;
  margin:0;
  padding:0;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:20px;
}

h1{
  text-align: center;
}

p{
  text-align: center;
  margin-top:80px;
}

.root{
  --content-column-width: 750px;
  
  --sidebar-column-width: 250px;
  --line-padding: 8px;
}


.navbar ul{
 list-style:none;
 padding:0;
 margin:0;
 overflow:hidden;
 text-align:center;
}

.navbar li{
  display:inline-block;
  padding: 0 7px;
  position:relative;
}

.navbar a{
  text-decoration:none;
  color:#4f4440;
  width:100px;
  display:block;
  padding:25px 20px;
  font-size:15px;
  text-align:center;
}

.navbar li:not(:last-child)::after{
  content:""; 
  border:1px solid #ccc4c0;
  border-width: 1px 1px 0 0;
  position:absolute; 
  right:-3px; 
  top:22px;
  height:25px;
  
}

.ibarra-real-nova {
  font-family: "Ibarra Real Nova", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.main {
  display:flex;
  flex-direction:column;
  width: 750;
}

.aside {
  position:sticky;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:250;
}
  

@media (max-width: 1050px) {
  body {
    flex-direction: column-reverse;
  }
  
  aside{
    width:750px
  }
  
  
  
}