* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
:root {
  --secondary-color: #0e184c;
  --white-color: #ffffff;
  --black-color: #000000;
  --grey-color: #797979;
  --light-blue-color: #91c4ed;
  --blue-color: #0065e2;
  --blue-dark-color: #002c63;
  --blue-font: #225C92;
  --light-blue-color-two: #D0E6F9;
}
a {
  text-decoration: none;
}
/* font style */
.inter-thin {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  /* font-style: normal; */
}
.inter-extraLight {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  /* font-style: normal; */
}
.inter-light {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  /* font-style: normal; */
}
.inter-regular {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  /* font-style: normal; */
}
.inter-semibold {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  /* font-style: normal; */
}
.inter-bold {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  /* font-style: normal; */
}
.inter-extraBold {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  /* font-style: normal; */
}

/* Roboto Font */
.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  /* font-style: normal; */
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  /* font-style: normal; */
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  /* font-style: normal; */
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  /* font-style: normal; */
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  /* font-style: normal; */
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  /* font-style: normal; */
}


/*ANAND*/
.container {
    display: grid;
    grid-template-columns: repeat(12, 1fr); /* 12-column grid system */
    gap: 10px;
}

.column {
    grid-column: span 4; /* Each column spans 4 grid tracks (i.e., 1/3 of the row) */
    padding: 10px;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .column {
        grid-column: span 12; /* On smaller screens, columns span full width */
    }
}