@import url("https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap");

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

:root {
  --primary-clr: #3d52a0;
  --secondary-clr: #7091e6;
  --white-clr: #fff;
  --gray-clr: #8697c4;
  --light-gray-clr: #adbbda;
  --light-white-clr: #ede8f5;
  --dark-clr: #00173c;
  --black-clr: #000000;
  --yellow-clr: #f8a501;
  --orange-clr: #ff7c69;
}
/* 
.services {
  margin-top: -400px;
} */

.services h1 {
  font-size: 50px;
  text-align: center;
  color: #000;
  font-weight: 800;
  margin-bottom: 40px;
}

.services .secondary_text {
  color: var(--secondary-clr);
  font-weight: 900;
}

/* .services_container {
  border: 1px solid green;
} */
.homeservices_alternative_bg .services_container:nth-child(odd) {
  padding-right: 100px;
}
.homeservices_alternative_bg .services_container:nth-child(even) {
  padding-left: 100px;
}
.services_container a {
  background-color: var(--dark-clr);
  text-decoration: none;
  border-radius: 30px;
  color: var(--white-clr);
  padding: 8px 16px;
  border: 2px solid var(--dark-clr);
  font-weight: 500;
  transition: all 0.4s ease-in-out;
}
.services_container a:hover {
  background-color: transparent;
  color: var(--dark-clr);
  padding: 8px 16px;
}



/* ----------------------------------------- webdev_service ---------------------------------- */
.webdev_service {
  /* background-image: url('../assets/web-d-bg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.seo_service {
  /* background-image: url('../assets/seo-bg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.social_media_service {
  /* background-image: url('../assets/smm-bg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.paid_ads_service {
  /* background-image: url('../assets/ads-bg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.orm_service {
  /* background-image: url('../assets/orm-bg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.graphic_design_bg {
  /* background-image: url('../assets/grpahic\ desigbg.png'); */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.home_gif {
  /* border: 1px solid red; */
  width: 100%;
  height: 300px;
}

.homeservices_alternative_bg .services_container:nth-child(odd) .services_container_content {
  padding-left: 100px;
  /* border: 1px solid red; */
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.homeservices_alternative_bg .services_container:nth-child(even) .services_container_content {
  padding-right: 100px;
  /* border: 1px solid red; */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.services_container_content a {
  margin-right: auto;
}

@media (max-width: 426px) {
  .webdev_service {
    padding-bottom: 50px;
  }
  .webdev_service .row {
    flex-direction: column-reverse;
  }
  .social_media_service {
    padding-bottom: 50px;
  }
  .social_media_service .row {
    flex-direction: column-reverse;
  }
  .graphic_design_bg {
    padding-bottom: 50px;
  }
  .graphic_design_bg .row {
    flex-direction: column-reverse;
  }

  .homeservices_alternative_bg .services_container:nth-child(odd) {
    /* border: 1px solid red; */
    padding-right: 10px;
  }
  .homeservices_alternative_bg .services_container:nth-child(even) {
    /* border: 1px solid red; */
    padding-left: 10px;
  }
  .services_container_content {
    padding-top: 30px;
  }
  .services_container_content  h3 {
    font-size: 24px;
  }

  .homeservices_alternative_bg .services_container:nth-child(odd) .services_container_content {
    padding-left: 10px;
  }
  .homeservices_alternative_bg .services_container:nth-child(even) .services_container_content {
    padding-right: 10px;
  }
}

@media (min-width: 426px) and (max-width: 768px) {
  .webdev_service {
    padding-bottom: 50px;
  }
  .webdev_service .row {
    flex-direction: column-reverse;
  }
  .social_media_service {
    padding-bottom: 50px;
  }
  .social_media_service .row {
    flex-direction: column-reverse;
  }
  .graphic_design_bg {
    padding-bottom: 50px;
  }
  .graphic_design_bg .row {
    flex-direction: column-reverse;
  }
  .homeservices_alternative_bg .services_container:nth-child(odd) {
    /* border: 1px solid red; */
    padding-right: 10px;
  }
  .homeservices_alternative_bg .services_container:nth-child(even) {
    /* border: 1px solid red; */
    padding-left: 10px;
  }
  .services_container_content {
    padding-top: 30px;
  }
  .services_container_content  h3 {
    font-size: 24px;
  }

  .homeservices_alternative_bg .services_container:nth-child(odd) .services_container_content {
    padding-left: 10px;
  }
  .homeservices_alternative_bg .services_container:nth-child(even) .services_container_content {
    padding-right: 10px;
  }
  
}
@media (min-width: 769px) and (max-width: 1280px) {
  .webdev_service video {
    width: 100%;
  }
  .webdev_service {
    padding-bottom: 50px;
  }
  .social_media_service {
    padding-bottom: 50px;
  }
  .graphic_design_bg {
    padding-bottom: 50px;
  }

  .homeservices_alternative_bg .services_container:nth-child(odd) {
    /* border: 1px solid red; */
    padding-right: 10px;
  }
  .homeservices_alternative_bg .services_container:nth-child(even) {
    /* border: 1px solid red; */
    padding-left: 10px;
  }
  .services_container_content {
    padding-top: 30px;
  }

.resp_services_container_img_container {
  /* border: 1px solid red; */
  display: flex;
  justify-content: center;
  align-items: center;
}
.homeservices_alternative_bg .services_container:nth-child(odd) .services_container_content {
  padding-left: 20px;
}
.homeservices_alternative_bg .services_container:nth-child(even) .services_container_content {
  padding-right: 20px;
}

}


.services_container_img_div {
  display: flex;
  justify-content: end;
  position: relative;
}
.services_container_img_div2 {
  display: flex;
  justify-content: start;
  position: relative;
}
.services_container_img_div_bgIMG {
  /* border: 1px solid red; */
  width: 80%; 
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  /* height: 90vh; */
}
.services_container_img_div_bgIMG2 {
  /* border: 1px solid red; */
  width: 80%; 
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  /* height: 90vh; */
}
.services_container_img_div_smIMG {
  /* border: 1px solid green; */
  position: absolute;
  top: 23%;
  left: 0;
  width: 40%;
  border-radius: 10px;
  -webkit-box-shadow: -16px 8px 30px -12px rgba(117,117,117,1);
  -moz-box-shadow: -16px 8px 30px -12px rgba(117,117,117,1);
  box-shadow: -16px 8px 30px -12px rgba(117,117,117,1);

  transition: transform 0.3s ease-in-out; /* Smooth transition */

}
.services_container_img_div_smIMG2 {
  /* border: 1px solid green; */
  position: absolute;
  top: 23%;
  right: 0;
  width: 40%;
  border-radius: 10px;
  -webkit-box-shadow: 13px 8px 30px -12px rgba(117,117,117,1);
  -moz-box-shadow: 13px 8px 30px -12px rgba(117,117,117,1);
  box-shadow: 13px 8px 30px -12px rgba(117,117,117,1);

  transition: transform 0.3s ease-in-out; /* Smooth transition */

}