/* *{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

body {
  background-color: #171717;
}  */
 #cou{
 background-color: #000000;
 }
 .wrapper1{
  /* position: absolute; 
  width: 80vw;
  transform:  translate(-50%, -50%);
 top:50%;
  left: 50%; */
  display: flex;
  justify-content: space-around;
  gap: 10px;
}
#te{ 
 font-size: xx-large;
 font-weight: 400;
 margin-top: -10px;
}

.container1 {
  width: 48vmin;
  height: 28vmin;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: 1em 0;
  position: relative;
  font-size: 18px;
  border-radius: 0.5em;
  background-color: #c6c9cb91;
  border-bottom: 10px solid #515c7a;
}

#i{
  color: #080feaa9;
  font-size: 2.5em;
  text-align: center;
  color: red;
  
}
a:hover{
  color: red;

}
span.num {
  color: #000000;
  display: grid;
  place-items: center;
  font-weight: 600;
  font-size: 3em;
}

span.text {
  color: #030303;
  font-size: 1.1em;
  text-align: center;
  pad: 0.7em 0;
  font-weight: 400;
  line-height: 0;
}
 .wrapper1{
  padding-top: -5%;
  padding-bottom: 5%;

}

@media screen and (max-width:1024px) {
  .wrapper{
    width: 85vw;
  }
  .container{
    height: 26vmin;
    width: 26vmin;
    font-size: 12px;
  }
}

@media screen and (max-width: 768px) {
  .wrapper{
    width: 90vw;
    flex-wrap: wrap;
    gap: 30px;
  }

  .container{
    width: calc(50% -40px);
    height: 30vmin;
    font-size: 13px;
  }
}
@media screen and (max-width: 480px) {
  .wrapper{
    gap: 15px;
  }

  .container{
    width: 100%;
    height: 25vmin;
    font-size: 8px;
  }
}

/* Stacking image and content */
@media (max-width: 575.98px) {
  #pg7 .row {
    flex-direction: column;
  }
  #pg7 .row > .col-md {
    text-align: center;
    margin-bottom: 20px;
  }
  #pg7 .row img {
    width: 90%;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width:575.98px) {
  /* For the second section (Race Guard) */
  #pg7 .row:nth-child(2) {
    display: flex;
    flex-direction: column-reverse; /* Stack content and image, content first */
  }
  
  #pg7 .row:nth-child(2) .col-md-6 {
    text-align: center; /* Center the content */
  }
  
  #pg7 .row:nth-child(2) .col-md {
    text-align: center;
    margin-bottom: 20px;
  }

  #pg7 .row:nth-child(2) .col-md img {
    width: 90%;
    margin-bottom: 20px;
  }

  

  /* For the third section (Fire Guard) */
  #pg7 .row:nth-child(4) {
    display: flex;
    flex-direction: column-reverse; /* Stack content and image, content first */
  }

  #pg7 .row:nth-child(4) .col-md-6 {
    text-align: center; /* Center the content */
  }

  #pg7 .row:nth-child(4) .col-md {
    text-align: center;
    margin-bottom: 20px;
  }

  #pg7 .row:nth-child(4) .col-md img {
    width: 90%;
    margin-bottom: 20px;
  }

  
 /* For the second section (Race Guard) */
 #pg7 .row:last-child {
  display: flex;
  flex-direction: column-reverse; /* Stack content and image, content first */
}

#pg7 .row:last-child .col-md-6 {
  text-align: center; /* Center the content */
}

#pg7 .row:last-child .col-md {
  text-align: center;
  margin-bottom: 20px;
}

#pg7 .row:last-child .col-md img {
  width: 90%;
  margin-bottom: 20px;
}
#pg7 .row:nth-child(1) .col-md-6 {
  text-align: center; /* Center the content */
}
#pg7 .row:nth-child(1) .col-md {
  text-align: center;
  margin-bottom: 20px;

}
#pg7 .row:nth-of-type(3) .col-md-6 {
  text-align: center; /* Center the content */
}
#pg7 .row:nth-child(3) .col-md {
  text-align: center;
  margin-bottom: 20px;

}
}