:root {
  --orange-color: #ef6c0d;
  --light-orange-color: #feb702;
  --yellow-color: #e2cc06;
  --dark-color: #444444;
  --white: #ffff;
  --white95: #f2f2f2;
  --white90: #e6e6e6;
  --white85: #d9d9d9;
  --white40: #666666;
  --heavyDark-color: #1b1b1b;
  --dark-green-color: #92c80c;
  --light-blue-color: #024885;
}

.portfolio-hot-container,
.hot-update,
.menu-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.portfolio-img img,
.hero-img img,
.hot-update img,
.updates-nav-center img,
.excellence-img img,
.man-with-laptop img,
.geodefine-edge-right img,
.gcard1 img,
.get-in-touch-form img {
  max-width: 100%;
  height: auto;
}

/* Hero Content style starts */
.hero-text {
  font-size: 58px;
}

.portfolio-head-text {
  p {
    margin-top: 0px;
    margin-bottom: 10px;
    cursor: pointer;
  }
  p:hover {
    opacity: 0.85;
  }
}

.hero-text span:nth-child(1),
span:nth-child(2) {
  color: var(--orange-color);
}

.hero-desc {
  margin-bottom: 20px;
}

.hero-btn-section button {
  border: none;
  border-radius: 20px;
  padding: 10px 20px;
  font-weight: 550;
}

#more-btn {
  color: var(--dark-color);
  background-color: var(--white90);
}

#get-in-btn {
  color: var(--white90);
  background-color: var(--dark-color);
}

.portfolio-explore {
  margin-top: 25px;
}

.portfolio-head-text {
  display: flex;
  align-items: center;
  justify-content: left;
}

.portfolio-arrow-img {
  padding: 7.5px 14px;
  border-radius: 40px;
  background-color: var(--orange-color);
  margin-left: 10px;
}

.portfolio-img {
  position: relative;
}

.portfolio-img span {
  position: absolute;
  left: 5%;
  top: 60%;
  color: var(--white90);
  font-size: 16px;
}

.hot-update-text {
  margin-left: 10px;
}

.hot-update-head {
  margin-bottom: 0px !important;
}

.hot-update-desc {
  font-size: 14px !important;
  color: #9b9a9a;
  margin-top: 5px !important;
  margin-bottom: 0px !important;
}

.updates-nav-center {
  margin-left: 15px;
  margin-right: 10px;
}

.portfolio-hot-container {
  margin-top: 20px;
  /* justify-content:left; */
  padding: 0px;
  padding-bottom: 2vh;
}

.hero-right img {
  width: 100% !important;
}

.updates-nav {
  margin-right: 15px;
}

.float-box {
  max-width: max-content !important;
  background-color: var(--white90);
  position: absolute;
  top: 42%;
  left: 35%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 10px;
  border-radius: 10px;
}

.float-box-ul {
  margin-bottom: 0px;
  padding: 0px;
  list-style-position: outside;
}
.float-box-ul a {
  text-decoration: none;
  cursor: pointer;
  color: var(--dark-color);
}
.float-box-ul li {
  list-style: none;
  padding: 5px 20px;
  border-bottom: 1px solid var(--white85);
}

.float-box-ul li:last-child {
  border-bottom: none;
}
.float-box-ul a:hover {
  opacity: 0.85;
}

/* Hero Section completed */

/* Define Section starts */
.define-section {
  background-color: var(--white95);
  border-radius: 25px;
  padding: 30px 15px;
}

.defining-head h3 {
  font-size: 40px;
  color: var(--orange-color);
}

.defining-head p {
  font-size: 20px;
}

.service-icons-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.icon-text {
  text-align: center;
  font-size: 15px;
  color: var(--white40);
}

.icon-rect2 {
  border-radius: 14px;
  position: relative;
  background-color: var(--orange-color);
  width: 80px;
  height: 80px;
}

#virtual-icon::before {
  content: url("/Assets/vectors/p1v2/Subtract.svg");
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.icon-rect1,
.icon-rect3 {
  border-radius: 14px;
  position: relative;
  background-color: var(--white90);
  width: 80px;
  height: 80px;
}

#admin-icon::before {
  content: url("/Assets/vectors/p1v2/library.svg");
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#it-icon::before {
  content: url("/Assets/vectors/p1v2/Group.svg");
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.it-soln-head {
  font-size: 30px;
  font-weight: 400;
  color: var(--orange-color);
}

.it-soln-para {
  font-size: 18px;
}

.vr-box {
  position: relative;
  background-color: #e6e6e6;
  border-radius: 30px;
  display: flex;
  justify-content: end !important;
  padding: 40px 0px;
  margin-top: 60px;
}

.yoeText {
  writing-mode: vertical-lr;
  transform: rotate(180deg);
  font-size: 24px;
  margin-bottom: 0px;
}

.vr-box::before {
  content: url("/Assets/vectors/p1v2/10+.svg");
  position: absolute;
  top: 20%;
  left: 9%;
}

.vr-box::after {
  content: url("/Assets/vectors/p1v2/vr_metaverse_8\ 1.svg");
  position: absolute;
  top: -27%;
  left: 16%;
}

.chat-section {
  position: relative;
  margin-left: 10px;
}

.chat-box::before {
  content: url("/Assets/vectors/p1v2/chat_icon.png");
  position: absolute;
  top: -10%;
  width: 20%;
}

.chat-box::after {
  content: url("/Assets/vectors/p1v2/Rectangle 9.png");
  position: absolute;
  bottom: -3%;
  right: 0%;
}

.chat-box::after {
  content: "Let's Start a project";
  position: absolute;
  top: 65%;
  left: 10%;
  max-width: 40%;
  color: var(--white);
}
.down-btn {
  position: absolute;
  bottom: 0;
  right: 0;
}
.mobile-app-dev {
  padding: 30px 30px;
  color: var(--white);
  background-color: var(--orange-color);
  border-radius: 20px;
}
.mobile-app-head {
  font-size: 24px;
  font-weight: 600 !important;
}

.mobile-app-para {
  font-size: 18px;
  font-weight: 400 !important;
}

.btn.btn-dark {
  border-radius: 25px;
  font-size: 16px;
  font-weight: 500 !important;
  background-color: #444444;
  padding: 10px 15px;
  cursor: pointer;
}

/* Define Section ends */

/* Choose-excellence Section starts */
.choose-excellence {
  margin: 20px auto;
}

.choose-excellence-text {
  font-size: 40px;
  font-weight: 600;
  line-height: 60px;
  text-align: left;
}

.orange-text {
  color: var(--orange-color);
}

.excellence-details-text,
.man-laptop-text {
  font-family: "Poppins";
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
  color: var(--dark-color);
}

.excellence-rank {
  display: flex;
}

.excellence-tag-section {
  display: flex;
  flex-direction: column;
}

.excellence-img,
.excellence-tag-section {
  padding: 0px !important;
}

.excellence-rectangle {
  flex: 1;
  text-align: center;
  background-color: var(--yellow-color);
  border-radius: 20px;
}

#client-count {
  background-color: var(--orange-color);
}

#badge img {
  width: 60%;
  height: auto;
}

#client-count img {
  width: 70%;
  height: auto;
}

#man-with-laptop-img {
  position: relative;
}

#man-with-laptop-readmore {
  position: absolute;
  top: 63%;
  left: 67%;
  cursor: pointer;
}

/* Choose-excellence Section ends */

/* Other-valued Section Starts */

.other-valued-section {
  background-color: var(--yellow-color);
  border-radius: 25px;
  padding: 30px 25px;
  margin: 20px auto;
  color: var(--white);
  position: relative;
  overflow: hidden;
  /* Clip the background image */
  z-index: 1;
}

.other-valued-section::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 40%;
  height: 50%;
  background-image: url("/Assets/vectors/p1v4/bgImage.svg");
  /* URL of your background image */
  background-size: cover;
  /* Adjust the size of the background image */
  background-position: center;
  /* Position the background image */
  z-index: -1;
  /* Send the clipped part behind the container */
}

.valued-head {
  font-size: 40px;
  font-weight: 600;
  line-height: 56px;
  text-align: left;
}

.value-text {
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  text-align: left;
}

#visit-project-btn {
  float: right;
  top: 10px;
  cursor: pointer;
}

#card_container_div .card {
  text-align: center !important;
  border-radius: 15px;
  padding: 20px;
  height: 100%;
}

.card {
  height: 100%;
  /* Ensure all cards have the same height */
}

.card-body {
  display: flex;
  flex-direction: column;
}

.card-body p {
  margin-top: 15px;
  flex-grow: 1;
  /* Allow the <p> element to grow to fill the remaining space */
}

#card-1-img {
  border-radius: 15px;
  padding: 28px 10px;
  background-color: var(--heavyDark-color);
}

#card-2-img {
  border-radius: 15px;
  padding: 25px 10px;
  background-color: var(--dark-green-color);
}

#card-3-img {
  border-radius: 15px;
  padding: 30px 10px;
  background-color: #000;
}

#card-4-img {
  border-radius: 15px;
  /* padding: 25px 20px; */
  max-width: 100%;
  width: 100%;
}

/* Other-valued Section ends */

/* feed_back Section starts */
.feed_back_section {
  margin: 30px auto;
}

.testimonal-card {
  background-color: var(--white);
  color: #444444;
  border-radius: 15px;
  padding: 20px;
}

.feedback-head {
  font-size: 34px;
  font-weight: 600;
  line-height: 47.6px;
  text-align: left;
}

.feedback-text {
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  text-align: left;
}

.testimonal-head {
  font-size: 28px;
  font-weight: 600;
  line-height: 39.2px;
  text-align: left;
}

.testimonal-p {
  font-size: 20px;
  font-style: italic;
  font-weight: 400;
  line-height: 30px;
  text-align: left;
  margin-bottom: 20px;
}

.testimonal-last-p p {
  margin-bottom: 0px !important;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  text-align: left;
}

/* feed_back Section ends */

/* geodefine-edge Section starts */

.geodefine-edge-section {
  margin: 30px auto;
}

.geodefine-edge-head {
  font-size: 40px;
  font-weight: 600;
  line-height: 60px;
  text-align: left;
}

.geodefine-edge-text {
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
}

.geodefine-img {
  position: relative;
}

.geodefine-rm-btn {
  position: absolute;
  top: 36%;
  left: 66%;
  cursor: pointer;
}

/* geodefine-edge Section ends */

/* get-in-touch-section-edge Section starts */
.get-in-touch-section {
  background-color: var(--orange-color);
  padding: 30px;
  margin-bottom: 20px;
  border-radius: 25px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.get-in-touch-section::after {
  content: "";
  position: absolute;
  top: 5%;
  right: 0;
  width: 50%;
  height: 100%;
  background-image: url("/Assets/vectors/p1v6/bg\ image.svg");
  background-size: cover;
  background-position: center;
  z-index: -1;
}

.get-in-touch-form {
  background-color: var(--white);
  border-radius: 25px;
  padding: 20px;
}

.head-cont {
  font-size: 28px;
  font-weight: 600;
  line-height: 44.8px;
  text-align: left;
}

#submi-btnn {
  background-color: var(--yellow-color);
  color: var(--white);
  font-size: 18px;
  font-weight: 600;
  line-height: 28.8px;
  text-align: center;
  padding: 5px 20px;
  margin-bottom: 8px;
}

#form-container input,
#form-container textarea {
  background-color: var(--white85);
  border: none;
  padding: 25px !important;
  color: var(--dark-color);
  opacity: 0.5;
}

.center-placeholder::placeholder {
  vertical-align: middle;
  padding-top: 35px;
}

/* Remove textarea resize handle */
#exampleFormControlTextarea1::-webkit-resizer,
#exampleFormControlTextarea1::-moz-resizer,
#exampleFormControlTextarea1::resizer {
  display: none !important;
}

.get-in-touch-contact {
  margin-top: 10px;
  color: var(--white);
}

.get-in-touch-contact p {
  margin-bottom: 0px !important;
}

.get-in-touch-head {
  font-size: 30px;
  font-weight: 600;
  line-height: 45px;
  text-align: left;
  margin: 10px 0px 10px 0px;
}

.get-in-touch-text {
  font-size: 18px;
  font-weight: 400;
  line-height: 28.8px;
  text-align: left;
}

.get-in-touch-details {
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
  text-align: left;
  margin-top: 20px;
}

/* get-in-touch-section-edge Section ends */

/* For Mobile */
@media only screen and (max-width: 767px) {
  .search-rect {
    margin-left: 0px;
  }
  .float-box {
    display: none;
  }
  .define-section {
    margin: 10px auto;
  }

  #vertical_rect_img {
    display: none;
  }

  .vr-box::before,
  .vr-box::after,
  .chat-box::before,
  .chat-box::after {
    max-width: 50px;
    height: auto;
    content: "";
    display: inline-block;
  }

  .vr-box::before {
    content: url("/Assets/vectors/p1v2/10+.svg");
    position: absolute;
    top: 20%;
    left: -20%;
  }

  .vr-box::after {
    content: url("/Assets/vectors/p1v2/vr_metaverse_8\ 1.svg");
    position: absolute;
    top: -27%;
    left: -2%;
  }

  .chat-box::after {
    content: "Let's Start a project";
    position: absolute;
    top: 5%;
    left: 10%;
    color: var(--white);
  }
  .down-btn {
    width: 20%;
  }
  #man-with-laptop-readmore {
    position: absolute;
    top: 45%;
    left: 62%;
  }

  #card_container_div .card {
    margin-bottom: 10px;
  }

  .page_navigation {
    margin-bottom: 10px;
  }

  .gcard1 {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }

  .gcard1 img {
    max-width: 100%;
    margin: 5px;
  }
}

/* For tablets */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .search-rect {
    margin-left: 0px;
  }
  #submit-btn {
    width: 80%;
  }
  .float-box {
    display: none;
  }

  .define-section {
    margin: 20px auto;
  }

  #vertical_rect_img {
    display: none;
  }

  .vr-box::before,
  .vr-box::after,
  .chat-box::before,
  .chat-box::after {
    max-width: 100px;
    height: auto;
    content: "";
    display: inline-block;
  }

  .vr-box::before {
    content: url("/Assets/vectors/p1v2/10+.svg");
    position: absolute;
    top: 20%;
    left: 12%;
  }

  .vr-box::after {
    content: url("/Assets/vectors/p1v2/vr_metaverse_8\ 1.svg");
    position: absolute;
    top: -27%;
    left: 20%;
  }

  .chat-box::after {
    content: "Let's Start a project";
    position: absolute;
    top: 5%;
    left: 10%;
    color: var(--white);
  }
  .down-btn {
    width: 20%;
  }
  #man-with-laptop-readmore {
    position: absolute;
    top: 50%;
    left: 62%;
  }

  .geodefine-rm-btn {
    position: absolute;
    top: 36%;
    left: 50%;
  }

  .gcard1 {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
  }

  .gcard1 img {
    max-width: 100%;
    margin: 5px;
  }
}