



.section-about-us-circle-wrapper

{

    width: 720px;

    height: 720px;

    position: relative;

    margin-left: auto;
    margin-right: auto;

    margin-bottom: 240px;

    background-color: #fff;

    border-radius: 50%;
}

.section-about-us-title
{
  text-align: center;
  color:#fa0905;

  color:#05fadd;



 font-size: 32px;
 line-height: 49px;
  
}

.section-about-us-information
{
  width: 720px;
  margin-left: auto;
  margin-right: auto;

  margin-top: 24px;

  /* box-shadow: 0px 8px 0px 0px #172663; */

  padding-bottom: 48px;
  margin-bottom: 120px;

}
.section-about-us-information p

{
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  color:#181818 !important;

  color:#5b5656 !important;

  color:#a5a4a4 !important;

  

  letter-spacing: normal;


  font-family: 'Inter';


}
.section-about-us-circle-wrapper-before {
    content: '';
    position: absolute;
    top: 0px;
    left: 50%;
    width: 720px;
    height: 720px;
    background-color: #172663;
    background-color: #fa05ec;
    border-radius: 50%;
    z-index: -1;
    transform: translate(-50%, 0);
}

.section-about-us-circle-wrapper-before::after
{
  content: '';
  position: absolute;
   top:10px;
   left: 10px;
   width:700px;
   height: 700px;
   background-color: #fff;
   border-radius: 50%;
  z-index: -1;
  transform: translate(0%,0);
    background: linear-gradient(123deg, #7f2d2d 0%, #4d4bc5 49.76%, #f6eeee 100%);   border-radius: 50%;
  
    background:conic-gradient(
      from 0deg ,
      #fff 0deg 50deg,
      #d2d0d7 50deg 80deg,
      #fff 80deg 170deg,
      #E9F23F 170deg 200deg,
      #fff 200deg 290deg,
      #d2d0d7 290deg 320deg,
      #fff 320deg 360deg
    );

    background: #fff;


 /* animation:aboutcircleanimation 12s linear infinite; */


}

.section-about-us-circle-card
{
  
  padding: 12px;
  padding-left: 120px;

  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  border-radius: 48px;

  position: relative;


  transition: opacity 1s linear;



}

[data-card-index='0'] .section-about-us-card-column-2
{
  opacity: 0.3;
  font-style: italic;

}
[data-card-index='1'] .section-about-us-card-column-2
{
  opacity: 0.5;
  font-style: italic;

}
[data-card-index='2'] .section-about-us-card-column-2
{
  opacity: 1;
    color: red;
font-weight: bold;

  font-style: italic;

}

[data-card-index='2'] .section-about-us-card-column-2 .aboutus-highlight-text
{
  color: blue;
  font-weight: bold;

}


.centered-card-circle-wrapper
{
   width:60%;
   height: 60%;
   position: absolute;
   top:50%;
   left: 50%;

   transform: translate(-50%, -50%);

   overflow: hidden;

   box-shadow:  24px -24px 0 0  #05fa52,  -24px 24px 0 0  #05fa52 ;

}



.centered-card-circle-image-wrapper img
{
  width: 100%;
  height: 100%;
   border-radius: 48px;

  
}


.section-about-us-circle-card-1
{
position: absolute;
  
  position: absolute;
  top:0%;
  left: 0%;


}
.section-about-us-circle-card-2
{
position: absolute;
 top:0%;
  left: 0%;
  
}

.section-about-us-card-circle
{
  grid-template-columns: repeat(12, minmax(10px, 1fr));
  gap:0px;
  display: grid;
  padding-left: 0px !important;

  padding: 0px !important;
  background-color: rgba(255,255,255,0.2) !important;
  background-color: rgba(255,255,255,0.7) !important;

  color:#000;
  width: 50%;

  box-shadow: -8px -8px 0 0 #fa0905;

  transition: box-shadow background-color 1s linear;

  overflow: hidden;
}

[data-card-index='0'].section-about-us-card-circle
{
  box-shadow: 0px 8px 0 0 #fa0905;
    background-color: rgba(255,255,255,0.2) !important;

}

[data-card-index='1'].section-about-us-card-circle
{
  box-shadow: 8px 8px 0 0 #fa0905;

    background-color: rgba(255,255,255,0.2) !important;


}
[data-card-index='2'].section-about-us-card-circle
{
  box-shadow: -8px -8px 0 0 #fa0905;

}

.section-about-us-card-circle::after
{
  position: absolute;

  content: '';
  top:48px;
  left: 8px;
  width: 12px;
  height: 12px;
  background-color: #172663;
  background-color: #fa0905;

  border-radius: 50%;
  z-index: 10;
}

.section-about-us-card-column-2
{
 color:#000;

 background-color: rgba(255,255,255,0) !important;
 
}


.glass-card {
    
    
    /* 2. The "Frosted" look */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); /* Safari support */
   
}


@media (max-width:1260px)  { 





}


@media (max-width: 1080px) {


}

@media (max-width:720px)  { 

.section-about-us-circle-wrapper

{
  
 width: 480px;
 height: 480px;

}

.section-about-us-circle-wrapper-before {
    content: '';
    position: absolute;
    top: 0px;
    left: 50%;
    width: 480px;
    height: 480px;
    background-color: #172663;
    background-color: #fa05ec;
    border-radius: 50%;
    z-index: -1;
    transform: translate(-50%, 0);
}

.section-about-us-circle-wrapper-before::after
{
  content: '';
  position: absolute;
   top:10px;
   left: 10px;
   width:460px;
   height: 460px;
   background-color: #fff;
   border-radius: 50%;
  z-index: -1;
  transform: translate(0%,0);
    background: linear-gradient(123deg, #7f2d2d 0%, #4d4bc5 49.76%, #f6eeee 100%);   border-radius: 50%;
  
    background:conic-gradient(
      from 0deg ,
      #fff 0deg 50deg,
      #d2d0d7 50deg 80deg,
      #fff 80deg 170deg,
      #E9F23F 170deg 200deg,
      #fff 200deg 290deg,
      #d2d0d7 290deg 320deg,
      #fff 320deg 360deg
    );

    background: #fff;


 /* animation:aboutcircleanimation 12s linear infinite; */


}

.centered-card-circle-wrapper
{
   width:240px;
   height: 240px;
   position: absolute;
   top:60%;
   left: 40%;

   transform: translate(-40%, -60%);

   overflow: hidden;

   box-shadow:  8px -8px 0 0  #05fa52,  -8px 8px 0 0  #05fa52 ;

}


.centered-card-circle-image-wrapper img
{
  width: 240px;
  height: 240px;
   border-radius: 48px;

  
}

.section-about-us-information
{
  margin-top: 24px;

  width: 100%;
  padding: 8px;
  padding-bottom: 48px;
}

.section-about-us-title
{
  text-align: left;
  margin-left: 8px;

  position: relative;

  color:#05fadd;



 font-size: 32px;
 line-height: 49px;

}

.section-about-us-title::after
{
  content: '';

  
 width: 48px;
 height: 48px;

  background-color: #172663;
  background-color: #05fadd;
  top:50%;
  right: 8px;
  transform: translate(0,-50%);

  position: absolute;
  border-radius: 5px;
  
}





}