.container {overflow: hidden}

.logotxt {font-size: 22px; color: white}
.logoimg img {width: 90%}

.gapa-page-content {
  display: grid;
  justify-content: space-between;
  grid-template-columns: 250px 550px 250px;
  padding: 30px;
  gap: 20px;
}

.call-us {
 color: black;
 font-size: 23px;
 font-weight: bold;
}

.gapa-grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); 
  gap: 20px;
  margin: 0 auto;
}

.grid-item {
  background: #f4f4f4;
  padding: 10px;
  border-radius: 8px;
text-align: center;
border-radius : 10px;
}

.grid-item img {
width: 100%;
border-radius : 10px;
}

.embed-container {
  width: 100%;
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.embed-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 1024px) {
  .gapa-page-content {
    grid-template-columns: 200px 450px 200px;
  }
}

@media screen and (min-width: 1440px) {
  .gapa-page-content {
    grid-template-columns: 250px 550px 250px;
  }
}

@media screen and (max-width: 768px) {
  .gapa-page-content-side-1 {order:2}
  .gapa-page-content-side-2 {order:1}
  .gapa-page-content-side-3 {order:3}
  
   .gapa-page-content {
    grid-template-columns: auto
  }
  
.gapa-grid-container  {
  grid-template-columns: auto auto; 
}
.gapa-logo {grid-template-columns: auto; gap: 0px}
.logosec {background-size: auto; background-position: right}
}

@media screen and (max-width: 425px) {
.gapa-grid-container {grid-template-columns: auto}
.gapa-page-content { padding:20px }
  .gapa-page-content-side-1, .gapa-page-content-side-3 {padding:20px}
.logosec {display: grid; height: auto; gap: 20px; background-position: left; padding: 20px}
.gapa-logo {gap: 10px}
}