:root {
  /* TEXT VARIABLES */
  --text-dark: #000;
  --text-light: #fff;
  --text-grey: #adbdcc;
  --body-font: "Roboto", sans-serif;
  --heading-font: "Anek Telugu", sans-serif;
  --h1-size: 94px;
  --h1-height: 108px;
  --h2-size: 50px;
  --h2-height: 75px;
  --h3-size: 34px;
  --h4-size: 32px;
  --h5-size: 28px;
  --h6-size: 22px;
  --subtitle-size: 17px;
  --subtitle-height: 26px;
  --p-size: 18px;
  --p-height: 26px;
  --secondary-text-size: 14px;
  --secondary-text-height: 18px;
  --button-size: 16px;

  /* SPACING VARIABLES */
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 32px;
  --spacing-xl: 64px;
  --standard-width: 1500px;
  /* COLOR VARIABLES */
  --purple-1: #6962f7;
  --purple-2: #7000ff;
  --blue-1: #00d4ff;
  --primary-accent: #0a2540;
  --primary-button-hover: #6d7a88;
  --bg-white: #fff;
  --bg-light: #f7f9fc;

  --clr-dark: #303030;

  --standard-border-radius: 20px;
  --standard-box-shadow: 0px 2px 40px rgba(0, 0, 0, 0.15);
  --primary-gradient: linear-gradient(
    101.33deg,
    #08209a 0.76%,
    #6563ff 33.33%,
    #36c5f0 76.92%,
    #83e2ff 96.96%
  );
  
}

/* Layout Styles  */
.section-container {
  width: 100%;
  max-width: var(--standard-width);
  margin: auto;
  
  /* background-color: #00d4ff; */
}


.section-container > p{
  text-align: start;
}




/*3 col section*/

.three-column {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.three-column a:hover {
  text-decoration: underline;
  color: cyan;

}

/*Left col section*/

.three-column > .col-left {
  width: 33.33%;
  box-sizing: border-box;
  padding: 0 var(--spacing-md) 0 0;
  display: flex;
  flex-direction: column;
  align-items: Start;
  justify-content: Start;
}

.col-left h3{
  font-size: var(--h3-size);
  text-align: start;
  text-decoration: underline;
  margin: 0;

}

.three-column > .col-left ul{
  margin-right: 20px;
  padding: 0;
  /* list-style-type: none; */
  text-align: start;
  font-size: 22px;
}

.three-column > .col-left li{
  margin-right: 20px;

}

.three-column > .col-left ol{
  margin-right: 20px;
  padding: 0;
  text-align: start;
  font-size: 22px;
}

.three-column > .col-left a {
  text-decoration: none;
  color: white;
  
}

.three-column > .col-left a:hover {
  text-decoration: none;
  color: cyan;;
  
}

.three-column > .col-left p {
  text-align: left;
  margin: 10px;
  box-sizing: border-box;
  padding: 0;
  font-size: 22px;
}

.three-column > .col-left img{
object-fit: cover;
}

/*Middle col section*/

.three-column > .col-middle {
  width: 33.33%;
  box-sizing: border-box;
  padding: 0 var(--spacing-md) 0 0;
  display: flex;
  flex-direction: column;
  align-items: Start;
  justify-content: Start;
}

.col-middle h3{
  font-size: var(--h3-size);
  text-align: start;
  text-decoration: underline;
  margin: 0;
}

.three-column > .col-middle ul{
  margin-right: 20px;
  padding: 0;
  /* list-style-type: none; */
  text-align: start;
  font-size: 22px;
}

.three-column > .col-middle li{
  margin-right: 20px;

}

.three-column > .col-middle ol{
  margin-right: 20px;
  padding: 0;  
  text-align: start;
  font-size: 22px;
}

.three-column > .col-middle a {
  text-decoration: none;
  color: white;
 
}

.three-column > .col-middle a:hover {
  text-decoration: none;
  color: cyan;;
  
}

.three-column > .col-middle p {
  text-align: left;
  margin: 10px;
  box-sizing: border-box;
  padding: 0;
  font-size: 22px;
}



/*Right col section*/

.three-column > .col-right {
  width: 33.33%;
  box-sizing: border-box;
  padding: 0 0 0 var(--spacing-md);
  display: flex;
  flex-direction: column;
  align-items: Start;
  justify-content: Start;
}

.col-right h3{
  font-size: var(--h3-size);
  text-align: start;
  text-decoration: underline;
  margin: 0;
  
}


.three-column > .col-right ul{
  margin-right: 20px;
  padding: 0;
  /* list-style-type: none; */
  text-align: start;
  font-size: 22px;
}

.three-column > .col-right li{
  margin-right: 20px;

}

.three-column > .col-right ol{
  margin-right: 20px;
  padding: 0;  
  text-align: start;
  font-size: 22px;
}

.three-column > .col-right a {
  text-decoration: none;
  color: white;
  
}

.three-column > .col-right a:hover {
  text-decoration: none;
  color: cyan;;
  
}

.three-column > .col-right p {
  text-align: left;
  margin: 10px;
  box-sizing: border-box;
  padding: 0;
  font-size: 22px;
}

.three-column > .col-right img{
  background-color: white;
  }