body{
  overflow-x: hidden;
}

.section-bg{
  background-color: #1a68bc;
  color: #ffffff;
}


/* why-section */

.why-section-card {
  border-radius: 16px;
  background-color: #ffffff;
  color: #000;
  box-shadow: 1.2px 1.2px 4.3px rgba(0, 0, 0, 0.028),
    2.9px 3px 10.4px rgba(0, 0, 0, 0.04), 5.4px 5.6px 19.5px rgba(0, 0, 0, 0.05),
    9.6px 10.1px 34.8px rgba(0, 0, 0, 0.06),
    18px 18.8px 65.2px rgba(0, 0, 0, 0.072), 43px 45px 156px rgba(0, 0, 0, 0.1);
  
}

/* why-section */

/* how-we-do */
.how-we-do-question{
  color:#174c77;
  padding-left:10px;
}
@media (max-width: 600px) {
  .how-we-do-col {
    text-align: center;
  }
}
/* how-we-do */

/* digital-footprint  AI Revolution*/

.digital-footprint-p{
  text-align: justify;
}

.digital-footprint-pic{
  border-radius: 10px;
  height: 35vw;
  width: 35vw;
}
@media (max-width: 600px) {
  .digital-footprint-pic {
    height: 40vh;
    width: 40vh;
  }
}

/* digital-footprint  AI Revolution*/



/* contact us portion */
.contact-us-section-card{
  background-color: #ffffff;
  font-weight: bold;
  color: #000;
  border-radius: 5px;
  box-shadow: 1.2px 1.2px 4.3px rgba(0, 0, 0, 0.028),
  2.9px 3px 10.4px rgba(0, 0, 0, 0.04), 5.4px 5.6px 19.5px rgba(0, 0, 0, 0.05),
  9.6px 10.1px 34.8px rgba(0, 0, 0, 0.06),
  18px 18.8px 65.2px rgba(0, 0, 0, 0.072), 43px 45px 156px rgba(0, 0, 0, 0.1);
}
/* contact us portion */

/* services portion */
.services-card-border{
  border-radius: 10px;
  font-weight:normal;
  box-shadow: 1.2px 1.2px 4.3px rgba(0, 0, 0, 0.028),
  2.9px 3px 10.4px rgba(0, 0, 0, 0.04), 5.4px 5.6px 19.5px rgba(0, 0, 0, 0.05),
  9.6px 10.1px 34.8px rgba(0, 0, 0, 0.06),
  18px 18.8px 65.2px rgba(0, 0, 0, 0.072), 43px 45px 156px rgba(0, 0, 0, 0.1);
}
.services-card-p{
  text-align: justify;
}
.card-back{
  display: none;
}
.card-content:hover .card-back{
  display:block; 
 
}
.card-content:hover .card-front{
  display:none; 
}
.service-card-col:hover {
  background-color: #1a68bc;
  color: #ffffff;
}
.read-more {
  color: #ffffff;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
}

.read-more:hover {
  color:#000;
  text-decoration: underline;
}
/* services portion */


body{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Barlow Semi Condensed', sans-serif;
}
.outerdiv
{
	width: 100%;
    min-height: 100vh;
    background: #EDF2F8;
    display: flex;
    align-items: center;
    justify-content: center;
}
.innerdiv
{
	transform: scale(0.9);
	margin: 1rem;
	display: grid;
	grid-gap: 1.5rem;
	grid-template-rows: repeat(2,22rem);
	grid-template-columns: repeat(4,17rem);
}
.eachdiv
{
	padding: 1rem 2rem;
    border-radius: 0.8rem;
    box-shadow: 5px 5px 20px #6d6b6b6b;
    color: white;
}
.div1
{
	background: #1a68bc;
    grid-column: 1/3;
    grid-row: 1/2;
    background-image: url(https://raw.githubusercontent.com/RahulSahOfficial/testimonials_grid_section/5532c958b7d3c9b910a216b198fdd21c73112d84/images/bg-pattern-quotation.svg);
    background-repeat: no-repeat;
    background-position-x: 25rem;
}
.div2
{
	background:#49556B;
    grid-column: 3/4;
    grid-row: 1/2;
}
.div3
{
	background: white;
    grid-column: 4/5;
    grid-row: 1/3;
    color: black;
}
.div4
{
	background: white;
	grid-column: 1/2;
    grid-row: 2/3;
    color: black;
}
.div5
{
	background: #18202D;
	grid-column: 2/4;
    grid-row: 2/3;
}
.userdetails
{
	display: flex;
}
.imgbox
{
	margin-right: 1rem;
}
.imgbox img
{
	border-radius: 50%;
	width: 2rem;
	border: 2px solid #cec5c5;
}
.detbox
{
	display: flex;
    flex-direction: column;
    justify-content: center;
}
.detbox p
{
	margin: 0;
}
.detbox .name
{
	color: hsl(0, 0%, 81%);
    font-size: 0.9rem;
    margin-bottom: 0.1rem;
    font-weight: 600;
}
.detbox .name.dark
{
	color: #49505A;
}
.detbox .designation
{
	color: hsl(0, 0%, 81%);
    opacity: 50%;
    font-size: 0.8rem;
}
.detbox .designation.dark
{
	color: #49505A;
}
.review h4
{
	font-size: 1.4rem;
	color: #F3DEFF;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 0.8rem;
}
.review.dark h4{
	color:#4B5258;
}
.review p
{
	font-size: 0.95rem;
    color: #F3DEFF;
    font-weight: 500;
    opacity: 50%;
    line-height: 1.5;
}
.review.dark p{
	color: #0e0e0e;
}
.attribution
{
	font-size: 1rem;
    line-height: 1.5;
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    text-align: right;
}
.attribution a
{
	text-decoration: none;
}

@media only screen and (max-width: 1000px)
{
	.innerdiv
	{
		transform: scale(0.7);
	}
}
@media only screen and (max-width: 800px)
{
	.innerdiv
	{
		transform: scale(0.6);
	}
}
@media only screen and (max-width: 600px)
{
	.div1 {
		background-position-x: 10rem;
	}
	.innerdiv
	{
		display: flex; 
		flex-direction: column;
		transform: scale(1);
		margin: 2rem;
		margin-bottom: 5rem;
	}
	.attribution
	{
		position: relative;
	}
}

  
.fade-in {
  opacity: 0;
  transition: opacity 350ms ease-in;
}

.fade-in.appear {
  opacity: 1;
}

.from-left {
  grid-column: 2 / 3;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.from-right {
  grid-column: 3 / 4;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
}

.from-left,
.from-right {
  transition: opacity 250ms ease-in, -webkit-transform 400ms ease-in;
  transition: opacity 250ms ease-in, transform 400ms ease-in;
  transition: opacity 250ms ease-in, transform 400ms ease-in,
    -webkit-transform 400ms ease-in;
  opacity: 0;
}

.from-left.appear,
.from-right.appear {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}