nav ul li a {
    font-family: 'Arial', sans-serif;
    font-size: 12px;
    font-weight: bold;
}

p { font-family: "GFS Didot", serif;
  font-weight: 400;
    font-size:20px;
  font-style: normal;
    font-weight: 200px;}

h3 {font-family:  "Titan One", sans-serif;
  font-weight: 400;
  font-style: normal;
font-size: 45px;}
b {font-weight:800;
font-size: 22px;} 




.class{  display: flex;
    justify-content: center;
    align-items: center;
  margin-left: auto;
  margin-right: auto;
  width: 30%;} 

.center-container {
  display: flex;
    justify-content: center;
    align-items: center;
  margin-left: auto;
  margin-right: auto;
  width: 30%;
}
.container{text-align:center;}

.left-aligned-content{ 
padding:30px; 
border: 1px }



.footer {
  background: linear-gradient(to right,
    red, orange, yellow, green, blue, indigo, violet);
  text-align: center;
  padding: 15px;
  margin-top: 40px;
}

.topnav {
            position: sticky;
            top:0;
            z-index:1000;
        }




.section {
  padding: 20px;
  margin: 30px auto;
  max-width: 800px;
  border-radius: 15px;
  color: black;
}

/* Individual colors */
.mantra {
  background-color: #ECDEC9; /* soft red */
}

.mandala {
  background-color: #ECDEC9; 
}

.mudra {
  background-color: #ECDEC9; 
}

/* Center images inside boxes */
.section img {
  display: block;
  margin: 15px auto;
  border-radius: 50%;
}




.section {
  padding: 20px;
  margin: 30px auto;
  max-width: 800px;
  border-radius: 15px;
  color: black;
  transition: all 0.3s ease;
}

/* Glow on hover */
.section:hover {
  transform: scale(1.02);
  box-shadow: 0 0 20px rgba(255,255,255,0.8),
              0 0 40px rgba(255,255,255,0.6);
}

.section:hover {
  box-shadow:
    0 0 10px red,
    0 0 20px orange,
    0 0 30px yellow,
    0 0 40px green,
    0 0 50px blue,
    0 0 60px indigo,
    0 0 70px violet;
}

.corner-logo {
  position: sticky; /* Positions the logo relative to the browser window */
  top: 30px;       /* Distance from the top edge */
  right: 20px;     /* Distance from the right edge */
  width: 100px;    /* Adjust size as needed */
  height: auto;
  z-index: 1000;   /* Ensures the logo is above other content */
}


.quote {font-size:2em;
font-family: "Delius Unicase" static;
  font-weight: 400;
  font-style: normal;
font-weight:bold;
}





.layout {
  display: flex;
  align-items: flex-start;
}

.main-content {
  flex: 1;

}

.sticky-box {
  position: sticky;
  top: 20px;
  width: 300px;
  margin-left: 20px;
  padding: 15px;
  background: ;
  border-radius: 10px;
}



.main-content {
  position: relative;
}

/* Sticky right box */
.sticky {
  position: sticky;
  top: 20px;

  width: 250px;

  margin-left: auto;   /* pushes it to the right */
  margin-right: 0;

  padding: 15px;
  background: ;
  border-radius: 12px;
}

/* optional styling */
.quote {
  font-family: "GFS Didot", serif;
  font-size: 26px;
 
}