*{
	padding: 0px;
	margin: 0px;
	
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  
}


a{
	text-decoration: none;
}


ul li{
	list-style: none;
}






/************************text ********************************/



.head {

position: relative;
display: flex;
align-items: center;
justify-content: center;
background-color: #898AA6;
margin: 100px auto;
padding: 50px;
width: 80%;
border-radius: 20px;
margin-bottom: 3vh;
gap:50px;

color: #2E073F;


}



@media (max-width: 970px) {

.head {

 display: grid;



}

}


.card {

  position: relative;
display: flex;
align-items: center;
justify-content: center;

margin: 10px auto;
padding: 50px;
width: 80%;
border-radius: 20px;
margin-bottom: 5vh;
gap: 50px;


}

 .bg_1 {


  background-color: #BB9AB1;
  color: #2E073F

}

.bg_2 {


  background-color: #987D9A;
  color: #2E073F
}

.bg_3 {

  background-color: #BB9AB1;
  color: #2E073F
}

.bg_4 {

background-color: #E0AED0;
color: #2E073F
}
.card img {

position: relative;
display: grid;
align-items: center;
justify-content: center;


border-radius: 20px;
    object-fit: cover;

    top: 0;
    bottom: 0;
    
    width: 50vh;
    
   height: 500px;
       

}




.card .text_1 {

padding: 50px;


}








@media (max-width: 1050px) {

.card {

 display: grid;



}

.card img {

 margin: 0 auto;
 width: 70vh;


}


}

@media (max-width: 970px) {

.card {

 display: grid;



}

.card img {

 margin: 0 auto;
 width: 65vh;


}


}


@media (max-width: 820px) {

.card {

display: grid;



}

.card img {

margin: 0 auto;
width: 60vh;


}


}

@media (max-width: 800px) {

  .card {

display: grid;



}

.card img {

 margin: 0 auto;
 width: 70vh;


}


}



@media (max-width: 770px) {




.card {

display: grid;



}

.card img {

margin: 0 auto;
width: 65vh;


}


}



@media (max-width: 650px) {

 

.card {
display: grid;

}

.card img {

margin: 0 auto;
width: 60vh;


}


}




@media (max-width: 600px) {


  .head {

width: 70%;

  }
.card {
display: grid;
width: 70%;
}

.card img {

margin: 0 auto;
width: 50vh;


}

}
@media (max-width: 500px) {


.head {

width: 70%;

}
.card {
display: grid;
width: 70%;
}

.card img {

margin: 0 auto;
width: 45vh;


}

}
@media (max-width: 450px) {


.head {

width: 68%;

}
.card {
display: grid;
width: 68%;

}

.card img {

margin: 0 auto;
width: 45vh;
height: 300px;


}


}


@media (max-width: 430px) {


.head {

width: 65%;

}
.card {
display: grid;
width: 65%;
}

.card img {

margin: 0 auto;
width: 35vh;
height: 300px;

}

}

@media (max-width: 420px) {


.head {

width: 65%;

}
.card {
display: grid;
width: 65%;
}

.card img {

margin: 0 auto;
width: 35vh;
height: 300px;

}

}

@media (max-width: 400px) {


.head {

width: 65%;

}
.card {
display: grid;
width: 65%;
}

.card img {

margin: 0 auto;
width: 40vh;
height: 300px;


}



}

@media (max-width: 350px) {


.head {

width: 65%;

}
.card {
display: grid;
width: 65%;
}

.card img {

margin: 0 auto;
width: 30vh;
height: 300px;


}

}
.text h3 {

font-size: large;

}

.text p {

font-size: large;

}





main {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.site-footer {
  background-color: #f8f8f8;
  text-align: center;
  font-size: 12px;
  padding: 10px 0;
  color: #2e2e2e;
 
}

.site-footer a {
  color: #2e2e2e;
  text-decoration: none; 
}
.site-footer a:hover {

  color: #BB9AB1;
}


body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}