@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600;700;900&display=swap");
@import url(component.min.css);
@import url(layout.min.css);

:root {
  --blue: #16295c;
  --green: #62e389;
  --yellow: #edcf4b;
  --black: #000;
  --white: #fff;
  --text-color: #828282;
}
* {
  box-sizing: border-box;
}

::selection {
  background: var(--blue);
  color: var(--white);
}

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background: rgb(0 0 0 / 0%);
}

::-webkit-scrollbar-thumb {
  background: rgb(0 0 0 / 0.5);
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(0 0 0 / 0.8);
}

html,
body {
  height: 100%;
}

html {
  font-size: 16px;
  line-height: 1;
}

body {
  background: var(--white);
  color: #030303;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  line-height: 1;
  margin: 0;
}

a,
button {
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

a:hover,
button:hover {
  text-decoration: none;
}

p {
  font-size: 1.125rem;
  color: var(--text-color);
  line-height: 1.35;
}

img {
  max-width: 100%;
}

ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

h1 {
  font-size: 3.5rem;
  font-weight: 800;
  color: var(--blue);
}

h2 {
  font-size: 2.5rem;
  font-weight: 800;
}

h6 {
  font-size: 1.875rem;
}

h4 {
  font-size: 1.75rem;
  font-weight: 600;
}

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

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

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

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

section {
  padding: 3rem 0;
  position: relative;
}

/* main banner start */
.mainBanner {
  display: flex;
  align-items: center;
  /* height: calc(100% - 8rem); */
  /* min-height: calc(100% - 1rem); */
  background: url(../images/banner/banner.webp) top left/cover no-repeat;
}
.mainBanner.home{
  height: calc(100% - 8rem);
}
.bannerContnt h2 {
  font-size: 32px;
}

.bannerContnt h4 {
  font-size: 22px;
}

.bannerContnt li {
  font-size: 16px;
  line-height: 1.5 !important;
}
.mainBanner p {
  color: var(--white);
  margin-top: 1rem;
}

/* .mainBanner .btnSec {
  position: absolute;
  bottom: 4rem;
} */

.btnSec {
  display: flex;
  gap: 2.5rem;
}

/* logo Section CSS Start */
.logoSec {
  padding: 1rem 0;
}

.logoSlider {
  border-left: 1px solid #00000030;
  position: relative;
}

.logoSlider::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(80deg, #ffffff, transparent);
  width: 20%;
  z-index: 1;
}

.logoSec h6 {
  font-size: 1.55rem;
  text-transform: uppercase;
  color: #2d2d2d;
  font-weight: 700;
}

.logoSlider {
  border-left: 1px solid #00000030;
}

.logoSlider .slick-track {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.logoSlider .slick-track img {
  width: 5rem;
  margin: 0 auto;
}

/* Potfolio Section CSS Start */
.portfolioSec {
  padding: 2rem 0 2rem;
  overflow: hidden;
  background: url(../images/bg/1.webp) top center/cover no-repeat;
}

.portfolioSec .stokeText {
  position: absolute;
  top: -2.5rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 4rem;
}

.portfolioSec .headingStyleOne h2 {
  /* margin-top: 4rem; */
  font-size: 2.25rem;
}

.portfolioSec .headingStyleOne h4 {
  font-size: 1.76rem;
}

.portfolioSec .headingStyleOne {
  text-align: center;
}

.portSlider.slick-slider .slick-list,
.portSlider.slick-slider .slick-track {
  margin: 3rem 0 3rem;
}

.portSlider img {
  filter: drop-shadow(12px 13px 6px rgb(0 0 0 / 30%));
  width: 100%;
  padding: 0;
  transition: all 0.5s ease;
}

.portSlider .slick-dots {
  bottom: -0.5rem;
}

.portfolioSec .animationImg {
  position: absolute;
  bottom: 0;
  z-index: -1;
  left: 10rem;
}

.portTag {
  background: url(../images/icons/star.webp) top right/100% no-repeat;
  width: 7rem;
  height: 7rem;
  padding: 30px 20px;
  position: absolute !important;
  z-index: 1;
  right: -11px;
  top: -2rem;
}

.portTag p {
  font-size: 10px;
  text-align: center;
  margin: 0;
  color: var(--black);
}

.portSlider div {
  position: relative;
  transition: all 0.5s ease;
}

.portFolioImg:hover {
  transform: scale(1.05);
  z-index: 11;
}

.portSlider {
  transition: all 0.5s ease;
}

/* Project Section CSS Start */
.projectSec ul li h6 .count,
.projectSec ul li h6 {
  font-size: 2.25rem;
  color: var(--blue);
  font-weight: 700;
  margin: 10px 0;
  line-height: 1;
}

.projectSec ul li h6 .count {
  margin: 0;
}

.projectSec ul li p {
  color: var(--black);
  font-weight: 500;
  display: block;
  margin-bottom: 0;
  font-size: 1rem;
}

.projectSec ul h6 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.projectSec ul li {
  text-align: center;
  padding: 0.4rem;
}

.projectSec ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 1rem 0;
  gap: 1rem;
}

.projectSec .themeBtn1 {
  font-weight: 600;
}

.projectSec ul li img {
  /* min-height: 3rem; */
  margin-bottom: 1rem;
}

/* Services section CSS Start */
.serviceSec {
  background: url(../images/bg/2.webp) top center/cover no-repeat;
}

.serbox {
  padding: 3rem 4rem;
  border-radius: 10px;
  transition: all 0.5s ease;
  height: 100%;
  position: relative;
  background: #16295ca3;
  backdrop-filter: blur(6px);
}

.serbox h4 {
  font-size: 1.65rem;
  color: var(--yellow);
  font-weight: 700;
  margin-bottom: 0.8rem;
}

.serbox h6 {
  color: var(--white);
  font-size: 1.45rem;
  font-weight: 700;
}

.serbox p {
  color: var(--white);
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
}

.serbox ul li {
  color: var(--white);
  padding: 8px 0;
  font-size: 1rem;
  line-height: 1.3;
  position: relative;
}

.serbox ul {
  position: relative;
  padding-left: 1.25rem;
}

.serbox ul li::before {
  content: "";
  position: absolute;
  border-left: 1px solid var(--white);
  height: 100%;
  top: 0;
  bottom: 0;
  left: -17px;
  z-index: 1;
}

.serbox ul li:first-child::before {
  top: 20px;
}

.serbox ul li:last-child::before {
  top: calc(-100% - -20px);
}

.serbox ul li::after {
  content: "";
  position: absolute;
  inset: 0;
  background: white;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  left: -20px;
  top: 14px;
}

.serbox:hover {
  background: var(--white);
}

.serbox:hover * {
  color: var(--blue);
}

.serbox:hover ul li::before {
  border-color: var(--blue);
}

.serbox:hover ul li::after {
  background: var(--blue);
}

.servicesBox {
  background: var(--white);
  text-align: center;
  padding: 2.35rem 1.5rem;
  box-shadow: -1px 2px 4px #00000030;
  border-radius: 40px;
  height: 100%;
  transition: all 0.5s ease;
}

.servicesBox:hover {
  transform: scale(1.05);
}

.servicesBox h3 {
  font-size: 1.875rem;
  font-weight: 600;
  color: var(--blue);
  margin: 1rem 0;
}

.servicesBox p {
  color: var(--blue);
  font-size: 1.25rem;
}

/* partner Section CSS Start */
.companyLogoSec {
  background: url(../images/bg/3.webp) top center/cover fixed no-repeat;
}

.partnersSlider li img {
  width: 10rem;
}

.partnersSliderreverse {
  transform: scale(-1);
}

.partnersSliderreverse img {
  transform: scale(-1);
}

.companyLogoSec::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(86deg, #e8d04b, transparent);
  z-index: 1;
  width: 15%;
  height: 75%;
  margin-top: auto;
}

.companyLogoSec::after {
  content: "";
  position: absolute;
  background: linear-gradient(273deg, #ead049, transparent);
  z-index: 1;
  width: 15%;
  height: 75%;
  right: 0;
  margin-top: auto;
  bottom: 0;
}

.companyLogoSec ul li {
  background: var(--white);
  box-shadow: 0 0 20px #00000026;
  border-radius: 10px;
  padding: 1rem;
  margin: 2rem 5px;
  transition: all 0.5s ease;
}

.companyLogoSec .slick-slide.slick-current.slick-active.slick-center {
  transform: scale(1.26);
}

.companyLogoSec li img {
  margin: 0 auto;
}

.contactBook {
  position: absolute;
  bottom: -2rem;
  left: -2rem;
  width: 14rem;
}

/* process Section CSS Start */
.processSec {
  background: url(../images/bg/4.webp) bottom left/contain fixed no-repeat;
  padding-bottom: 4rem;
  margin-bottom: 0;
}

.processSec h4 {
  font-size: 1.35rem;
  position: relative;
  z-index: 1;
  color: var(--yellow);
  font-weight: 700;
}

.processSec h4::before {
  z-index: -1;
}

.processSec h2 {
  color: var(--white);
}

.processHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.processBox {
  background: var(--blue);
  padding: 2rem 1rem 1rem;
  border-radius: 10px;
  border: 1px solid #626569;
  transition: all 0.5s ease;
  /* margin: 1rem 0; */
  position: relative;
  z-index: 11;
  box-shadow: 0 18px 20px #00000045;
  height: 100%;
}

.processBox:hover {
  background: var(--yellow);
}

.processImg {
  position: absolute;
  right: 6rem;
  z-index: 0;
  margin: 0;
  bottom: 0;
  width: 29rem;
}

.processLink h5 {
  background: var(--yellow);
  display: inline-block;
  padding: 5px 4rem 5px 10px;
  border: 2px solid var(--yellow);
  color: var(--blue);
  border-radius: 8px;
}

.processLink {
  position: absolute;
  top: -1rem;
  right: 2rem;
}

.processBox p {
  color: var(--yellow);
  padding-top: 1rem;
  line-height: 1.5;
}

.processBox:hover img {
  filter: brightness(20);
}

.processSec .bookStep {
  position: absolute;
  right: 2rem;
  z-index: 1;
  bottom: -9rem;
}

.processBox:hover h4,
.processBox:hover p {
  color: var(--blue);
}

.processBox:hover .processLink h5 {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--yellow);
}

.processBox:hover img {
  filter: brightness(0);
}

/* Books Section CSS Start */
.booksSec {
  background: url(../images/bg/5.webp) bottom right/cover fixed no-repeat;
}

.booksSec h5 {
  color: var(--primary);
  font-weight: 600;
  /* font-size: 2rem; */
}

.booksSec h2 {
  /* font-size: 3.25rem; */
}

.bookBox .overlay {
  border-radius: 5px;
  position: absolute;
  bottom: -7.5rem;
  text-align: start;
  padding: 1.5rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  opacity: 1;
  transition: all 0.5s ease-in-out;
  overflow: hidden;
}

.bookBox:hover .overlay {
  background: none;
  inset: 0;
}

.bookhead {
  position: absolute;
  color: white;
  bottom: 1rem;
  right: 1rem;
  opacity: 1;
  transition: all 0.5s ease;
}

.bookBox:hover .bookhead {
  opacity: 0;
}

.bookBox {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin: 1.5rem 0.8rem;
  box-shadow: 0 10px 20px rgb(0 0 0 / 20%);
  background: var(--black);
  transition: all 0.5s ease;
  border: 2px solid #fff;
}

.bookBox:hover {
  box-shadow: none;
}

.bookBox h4 {
  /* font-size: 2rem; */
  text-transform: capitalize;
  margin-bottom: 1rem;
}

.overlay * {
  color: var(--white);
}

.overlay p {
  font-size: 1rem;
  transition: all 0.5s ease;
  margin: 0;
  min-height: 5.25rem;
}

.bookBox:hover .overlay p {
  display: block;
  visibility: visible;
  opacity: 1;
}

.bookBox img {
  width: 100%;
  filter: grayscale(1) brightness(0.5);
  transition: ease all 0.5s;
  height: 300px;
  object-fit: cover;
  object-position: center;
  opacity: 0.5;
}

.bookBox:hover img {
  filter: grayscale(0) brightness(0.8);
}

/* Team Section CSS Start */
.teamSec {
  background: url(../images/bg/6.webp) top left/cover fixed no-repeat;
}

.teamSec p,
.teamSec h2 {
  color: var(--white);
}

.teamSec .nav-tabs {
  justify-content: center;
  margin-bottom: 1rem;
  border: none;
  gap: 10px;
}

.teamSec .nav-tabs .nav-link {
  background: var(--white);
  border-radius: 5px;
  padding: 1rem 1.5rem;
  color: var(--primary);
  font-size: 1rem;
  font-weight: 500;
}

.teamSec .nav-tabs .nav-item.show .nav-link,
.teamSec .nav-tabs .nav-link.active {
  background: var(--blue);
  color: var(--white);
}

.teamBox {
  position: relative;
  margin: 1rem 0;
}
.teamBox figure{
  text-align: center;
}

.teamBox .overlay-text {
  padding: 1.5rem;
  width: 100%;
  border-bottom: 0;
  text-align: center;
  background: #00000091;
  border: 2px solid #fff;
  backdrop-filter: blur(7px);
}

.teamBox .overlay-text * {
  color: var(--white);
  margin: 0;
  position: relative;
  z-index: 2;
}

.teamSec h5 {
  color: var(--white);
  font-weight: 400;
}

.teamBox img {
  border-radius: 50%;
  border: 2px solid #fff;
}

/* cta section css */
.ctaSec {
  background: url(../images/bg/4.webp) top right/contain no-repeat;
}

.ctaSec h1 span {
  font-weight: 300;
}

.ctaSec h1 strong {
  font-weight: 700;
}

.ctaSec .btnSec {
  justify-content: center;
  margin-top: 3rem;
}

/* Begin: Testimonial CSS */
.testimonialSec {
  background: url(../images/bg/7.webp) top right/cover fixed no-repeat;
}

.testiThumb {
  position: relative;
  background: var(--blue);
  border-radius: 4px;
  box-shadow: 0 8px 15px rgb(0 0 0 / 5%), 0 -8px 15px rgb(0 0 0 / 5%);
  padding: 3rem 2rem;
  margin: 2rem 1rem;
  min-height: 30rem;
  text-align: center;
  transition: ease all 0.5s;
}

.testiThumb:hover,
.slick-current + .slick-active .testiThumb {
  transform: scale(1.05);
}

.testiThumb .quote {
  position: absolute;
  top: -1.5rem;
  right: 3rem;
}

.testiThumb .quote img {
  position: relative;
  transition: ease all 0.5s;
}

.testiThumb .img img {
  border: 8px solid #ffffff;
  border-radius: 100px;
  box-shadow: 0 10px 15px rgb(0 0 0 / 15%);
  margin: 0 auto 2rem;
}

.testiThumb h4 {
  font-size: 1.75rem;
  font-weight: 600;
  margin-bottom: 2rem;
  color: var(--green);
}

.testiThumb p {
  margin: 0;
  font-weight: 300;
  line-height: 1.7;
  color: var(--white);
}

/* END: Testimonial CSS */

/* Begin: FAQ's CSS */
.accordionStyle {
  margin: 3rem 0;
}

.accordionStyle .accordion-item {
  box-shadow: none;
  border-radius: 1rem;
  box-shadow: 0 0 20px #0000002b;
  margin-top: 1rem;
}

.accordionStyle .accordion-item .accordion-button {
  border-radius: 1rem;
  box-shadow: none;
  background: none;
  padding: 1.5rem;
  color: var(--black);
  font-weight: 600;
  font-size: 1.125rem;
}

.accordionStyle .accordion-item .accordion-button::after {
  transform: rotate(0deg);
  color: #000;
}

.accordionStyle .accordion-item .accordion-button:not(.collapsed)::after {
  filter: brightness(1);
  transform: rotate(540deg);
}

.accordionStyle .accordion-item .accordion-button[aria-expanded="true"]:hover {
  background: var(--white);
  color: var(--black);
}

.accordionStyle .accordion-item .accordion-button:hover {
  background: var(--blue);
  color: var(--white);
  border-radius: 1rem;
}

.accordionStyle .accordion-body {
  border-top: 1px solid #ffffff;
  padding: 1.5rem;
  border-radius: 0 0 1rem 1rem;
  transition: ease all 0.5s;
  background: var(--blue);
}

.accordionStyle .show .accordion-body {
  border-top-color: rgb(255 255 255 / 20%);
}

.accordionStyle .accordion-body p {
  margin: 0;
  line-height: 1.6;
  color: var(--white);
}

.accordionStyle .accordion-body p + p {
  margin-top: 1rem;
}

.accordionStyle .accordion-item:not(:first-of-type) {
  border-top: 1px solid #c1c1c1;
}

/* END: FAQ's CSS */

.contactForm {
  background: var(--blue);
  padding: 3rem;
  border-radius: 30px;
}

.contactSec {
  background: url(../images/bg/8.webp) top right/cover fixed no-repeat;
}

.contactSec .logoList {
  display: flex;
  align-items: center;
  margin-top: 4rem;
  justify-content: center;
  gap: 1rem;
}

/* Inner Pages CSS Start */
.archiveSec {
  background: url(../images/bg/9.webp) top center/cover no-repeat;
}

.archiveSec ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6rem 0 3rem;
}

.archiveSec ul li h6 {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--green);
}

.archiveSec p {
  color: var(--white);
}

.archiveSec ul li {
  border-right: 1px solid #ffffff6b;
  padding: 0 2rem;
}

.book {
  position: absolute;
}

.right-book {
  position: absolute;
  right: 0;
  top: -2rem;
  width: 27rem;
}

.abtInner {
  padding: 7rem 0;
}

.serInnerBox {
  background: var(--yellow);
  padding: 2rem 2rem 0;
  border-radius: 50px 50px 0 0;
  transition: all 0.5s ease;
  height: 100%;
}

.serInnerBox h3 {
  font-weight: 700;
  color: var(--blue);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.serInnerBox p {
  color: var(--blue);
}

.serInnerBox:hover {
  background: var(--blue);
}

.serInnerBox:hover * {
  color: var(--white);
}

.serInnerBox:hover img {
  filter: brightness(20.5);
}

.publishSer .serInnerBox {
  background: var(--blue);
  border-radius: 15px;
  border: 1px solid var(--yellow);
}

.publishSer .serInnerBox p {
  color: var(--white);
  margin: 1rem 0;
}

.publishSer .serInnerBox h3 {
  color: var(--yellow);
}

.publishSer .serInnerBox:hover {
  background: var(--yellow);
}

.publishSer .serInnerBox:hover * {
  color: var(--blue);
}

.publishSer .serInnerBox:hover img {
  filter: brightness(0);
}

.contactPublish {
  background: url(../images/bg/13.webp) top center/cover no-repeat;
  margin-top: 2rem;
}

.contactInner {
  background: url(../images/bg/14.webp) bottom left/contain no-repeat;
  margin-bottom: 11rem;
}

.contactInner h4 {
  font-size: 3.5rem;
  color: var(--blue);
  line-height: 1.7;
}

.arrow {
  position: absolute;
  left: 28rem;
}

.blogBox {
  background: var(--blue);
  border-radius: 0 50px 50px 50px;
  transition: all 0.5s ease;
  height: 100%;
}

.blogBox img {
  width: 100%;
}

.blogBox .blogContnt {
  padding: 1rem;
  border-radius: 0 0 30px 30px;
  background: var(--blue);
  min-height: 6rem;
  transition: all 0.5s ease;
}

.blogBox .blogContnt p {
  color: var(--white);
  font-weight: 600;
}

.blogBox:hover .blogContnt {
  background: var(--yellow);
}

.blogBox:hover .blogContnt p {
  color: var(--blue);
}

.designBook {
  padding: 1rem;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: 12rem;
}

.designBook img {
  position: absolute;
  right: -1rem;
  top: -2rem;
  filter: drop-shadow(2px 4px 6px #00000051);
  width: 12rem;
}

.publishSer .designBook:hover img {
  filter: brightness(1);
}

.servicesCta {
  background: url(../images/bg/25.webp) bottom center/cover no-repeat;
}

.rightImg {
  position: absolute;
  bottom: -150px;
  right: 46px;
  margin: 0;
  mix-blend-mode: lighten;
  width: 47rem;
}
/* .bannerContnt {
  position: relative;
  z-index: 1;
} */

.portFolioImg figure:hover,
.slick-current + .slick-active .portFolioImg figure {
  transform: scale(1);
}

.teamBox .overlay-text {
  padding: 10px;
}

.teamBox .overlay-text p {
  font-size: 12px;
}

.term-first-wrapper h5 {
  font-size: 1.76rem;
  font-weight: 600;
  color: var(--blue);
}

.term-first-wrapper h1 {
  font-size: 2.25rem;
}

.terms-first-wrap-text a {
  color: var(--text-color);
  font-size: 1rem;
  padding: 5px 0;
  display: inline-block;
}

/* Step CSS */
.stepBanner {
  position: relative;
}

.stepBanner {
  background: url(../images/banner/stepBg.webp) center/cover no-repeat;
  padding: 1rem 0 3.5rem;
  display: flex;
  align-items: center;
}

.stepBanner * {
  color: var(--white);
}

.stepBanner p {
  font-size: 1.33rem;
}

.stepBanner .bookBannerOne {
  position: absolute;
  left: 10%;
  top: 40%;
  width: 5rem;
}

.stepBanner .bookBannerTwo {
  position: absolute;
  right: 5%;
  bottom: 5%;
  width: 15rem;
  z-index: 1;
}

.stepBanner .bookBannerThree {
  position: absolute;
  left: 8%;
  bottom: 5%;
  width: 5rem;
  z-index: 1;
}

.servicesForm button {
  border: none;
}

.servicesForm h2 {
  font-size: 1.65rem;
  background: #fff;
  position: absolute;
  top: -1rem;
  padding: 0 11px;
}

/* Begin: Step 1 CSS */
.discountStrip {
  background: var(--blue);
  color: var(--white);
  text-align: center;
  padding: 10px 1rem;
  margin: -3.5rem 0 3rem;
  border-radius: 10px;
}

.discountStrip > span {
  font-size: 1.33rem;
}

.discountStrip h2 {
  margin: 10px 0 0;
  line-height: 1;
}

.chooseService {
  position: relative;
  padding: 0 0 5rem;
}

.chooseService .serviceTwo {
  position: absolute;
  top: 15%;
  left: 10%;
  width: 6rem;
}

.chooseService .serviceOne {
  position: absolute;
  left: 10%;
  bottom: 10%;
  width: 12rem;
}

.chooseService .serviceThree {
  position: absolute;
  left: 68%;
  bottom: 15%;
  z-index: 0;
}

.servicesForm {
  background: var(--white);
  border: 1px solid #d4d4d4;
  border-radius: 1.5rem;
  box-shadow: 0 1.125rem 4.44rem rgb(22 41 92 / 6%);
  padding: 2rem;
  position: relative;
  z-index: 1;
}

.servicesList {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid #8282824f;
  border-radius: 15px;
}

.servicesForm p {
  margin: 0;
}

.inputGroup {
  margin-top: 1rem;
}

.questionList {
  display: flex;
  flex-direction: column;
}

.servicesList li,
.questionList li {
  position: relative;
}

.servicesList li {
  border-bottom: 1px solid #8282824f;
}

.servicesList li:first-child {
  /* border-radius: 15px 15px 0 0; */
}

.servicesList li:last-child {
  border-radius: 0 0 15px 15px;
  border-bottom: 0;
}

.servicesList li input,
.questionList li input {
  position: absolute;
  inset: 0;
  z-index: 10;
  opacity: 0;
  width: 100%;
  height: 100%;
}

.servicesList .checkBoxStyle {
  display: flex;
  align-items: center;
  position: relative;
  padding: 10px 2rem;
  justify-content: space-between;
}

.servicesList li:last-child .checkBoxStyle {
  border-bottom: 0;
}

.servicesList .checkBoxStyle label {
  font-size: 1rem;
  font-weight: 700;
}

.servicesList .checkBoxStyle i {
  font-size: 1.25rem;
  color: #d6d6d6;
}

.servicesList li input:checked + .checkBoxStyle i {
  color: var(--blue);
}

.servicesForm .form-control,
.inputGroup .form-control {
  font-size: 0.9rem;
  height: 3rem;
  border-radius: 10px;
}

.inputGroup .form-control {
  margin: 10px 0;
}

/* .phone-container .iti--show-flags {
  width: 100%;
  border: 1px solid #ced4da;
  font-size: 0.9rem;
  height: 3rem;
  border-radius: 10px;
} */

.chooseService .phone-container .iti--show-flags {
  margin-top: 10px;
}

.chooseService .phone-container .iti__selected-dial-code {
  color: rgb(0 0 0 / 60%);
}

.chooseService .phone-container .phone1 {
  border-radius: 10px;
  border: 0;
  height: 3rem;
  width: 100%;
  border: 1px solid #ced4da;
  margin: 10px 0;
}

.chooseService .phone-container .phone1:focus-visible {
  outline: 0;
}

.form-control:focus,
.accordion-button:focus {
  border: 1px solid var(--blue);
  box-shadow: none;
}

/* END: Step 1 CSS */
/* Begin: Step 2 CSS */
.stepTwo {
  padding-top: 5rem;
}

.questionList li {
  display: flex;
  flex-flow: row wrap;
  gap: 10px 3rem;
  padding: 1rem 0;
  border-bottom: 1px solid #d4d4d4;
}

.questionList li:last-child {
  border-bottom: 0;
}

.questionList li > label {
  width: 100%;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--black);
  margin-bottom: 8px;
}

.questionList .radioStyle {
  position: relative;
}

.questionList .radioStyle label {
  font-weight: 500;
  display: flex;
  align-items: center;
}

.questionList .radioStyle label:before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: #eeeeee;
  border: 1px solid #d7d7d7;
  border-radius: 100px;
  margin-right: 10px;
}

.questionList .radioStyle input:checked + label:before {
  border: 5px solid var(--blue);
}

.servicesForm .themeBtn2 {
  font-size: 1.125rem;
  border-radius: 8px;
  text-transform: uppercase;
  margin-top: 1.25rem;
  padding: 0.8rem 2.5rem;
}

.stepTwo .servicesForm .themeBtn2 {
  width: 35%;
}

/* END: Step 2 CSS */
.stepBanner .headingStyleThree .stokeText {
  color: transparent;
  font-size: 6rem;
  -webkit-text-stroke: 1px rgb(255 255 255);
}

.stepBanner .headingStyleThree h2 {
  font-size: 5rem;
  color: var(--green);
}

.stepBanner .headingStyleThree h6 {
  margin-top: 10px;
  font-weight: 400;
}

.stepBanner .headingStyleThree h6 span {
  display: block;
  font-weight: 700;
}

.congbanner {
  background: url(../images/banner/congs.webp) top right/cover no-repeat;
  padding: 5rem 0;
}

.congsContnt {
  margin: 8rem auto -2rem;
}

.congsContnt p a {
  font-weight: 700;
}

.congsContnt p {
  font-size: 20px;
  line-height: 1.3;
}

.congbanner .bookBannerTwo {
  top: 3rem;
}

.congbanner .bookBannerThree {
  bottom: 15rem;
}

.congbanner .bookBannerOne {
  top: 10%;
}

.congsContnt p a:hover {
  color: var(--blue);
}

.stepTwo .discountStrip {
  margin: -8.5rem 0 3rem;
}

.lpHeader .topBar ul {
  justify-content: end;
}

.lpHeader .logo img {
  /* width: 13rem; */
  /* width: 9rem; */
}

/* virtual-select */
.vscomp-value {
  opacity: 1 !important;
}
.signupForm .virtual-select,
footer .virtual-select,
.default-select {
  width: 100%;
  max-width: 100%;
}
.signupForm .iti__tel-input {
  height: 3.5rem;
  border-radius: 10px;
  border: none;
}
.virtual-select .vscomp-wrapper {
  font-family: inherit !important;
}
.virtual-select .vscomp-option-text {
  line-height: 1.5;
}
.vscomp-option.focused {
  background: rgb(255, 255, 255, 0.3) !important;
}

.vscomp-option.selected {
  background: var(--green) !important;
}
.signupForm .virtual-select .vscomp-toggle-button,
footer .virtual-select .vscomp-toggle-button {
  width: 100%;
  height: 3.5rem;
  padding-left: 1rem;
  border-radius: 8px;
  border: 1px solid white;
  background: white;
  color: black;
}
.signupForm .virtual-select .vscomp-arrow::after,
footer .virtual-select .vscomp-arrow::after {
  border: 1px solid rgba(0, 0, 0, 0);
  border-bottom-color: black;
  border-right-color: black;
}
.signupForm .virtual-select .vscomp-dropbox,
footer .virtual-select .vscomp-dropbox {
  background: var(--blue);
  color: white;
}
.signupForm
  .virtual-select
  .vscomp-wrapper.multiple
  .vscomp-option.selected
  .checkbox-icon::after,
footer
  .virtual-select
  .vscomp-wrapper.multiple
  .vscomp-option.selected
  .checkbox-icon::after {
  border-color: white;
  border-left-color: rgba(0, 0, 0, 0);
  border-top-color: rgba(0, 0, 0, 0);
}
.vscomp-wrapper .checkbox-icon.checked::after {
  border-color: var(--blue);
  border-left-color: rgba(0, 0, 0, 0);
  border-top-color: rgba(0, 0, 0, 0);
}

footer .virtual-select .vscomp-dropbox {
  background: var(-);
}
footer .virtual-select .vscomp-toggle-button {
  height: 2.8rem;
}
footer .leadForm input:not(.iti__search-input) {
  height: 2.8rem;
  font-size: 13px;
}
footer .leadForm button:not(.iti__selected-country) {
  padding: 1rem;
}
.brands-images img {
  width: 130px;
}
.brands-images {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 2rem;
}
@media screen and (min-width: 768px) {
  .brands-images {
    justify-content: start;
  }
}

ul.listStyle li {
  line-height: 1.2;
}

.form-error {
  border: 2px solid red !important;
  border-radius: 8px;
}
.form-error .vscomp-value {
  color: red !important;
}

.form-error::placeholder {
  color: red !important;
}

.text-blink-animation {
  color: var(--yellow);
  transition: ease all 0.5s;
  animation: blink 1s infinite;
}
@keyframes blink {
  0% {
    color: #fff;
  }
  50% {
    color: var(--yellow);
  }
  100% {
    color: #fff;
  }
}
@media screen and (max-width: 576px) {
  .mainBanner .bannerContnt {
    min-height: calc(100vh - 166px);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
#signup-form {
  transition: box-shadow 0.5s ease-in-out;
}

.highlight {
  border: 2px solid red;
}
.highlight input[name="name"] {
  border: 2px solid red !important;
}
footer .leadForm button {
  padding: 1rem;
}

.blogbanner {
  position: relative;
  z-index: 1;
}
.blogbanner::before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.blogInner li {
  line-height: 1.4 !important;
  margin-bottom: 1rem;
}

/* default-select */
.simple-select {
  padding: clamp(7px, 2vw, 13px);
  border-radius: 10px;
  width: 100%;
  border: 1px solid #ddd;
}
.default-select {
  width: 100%;
  max-width: inherit !important;
  border-radius: 10px;
}
.default-select .vscomp-toggle-button {
  padding: clamp(7px, 2vw, 13px);
  border-radius: 10px;
}
.default-select .vscomp-option.focused {
  background-color: #ccc !important;
}
.form-check-input:checked {
  background-color: var(--blue);
}



.stepWrap h2{
  text-align: center;
  color: var(--blue);
}

.packageBox {
  border: 2px solid var(--blue);
  border-radius: 20px;
  padding: 1rem 1.5rem;
  transition: all 0.5s ease;
  margin: 0;
  background: #fff;
  position: relative;
}
.packageBox .tag {
  width: 60%;
}
.packageBox .tag {
  background: var(--black);
  padding: 6px 1.5rem;
  border-radius: 20px;
  text-align: center;
  color: var(--white);
  position: absolute;
  top: -1rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.3rem;
}

.packageBox h4 {
  font-size: 3rem;
  color: var(--secondry);
  position: relative;
  font-weight: 800;
  margin: 0;
  text-align: center;
  border-top: 1px solid #999;
  border-bottom: 1px solid #999;
  padding: 1rem 0;
}

.packageBox h4 span {
  font-size: 1rem;
  color: #000;
  position: relative;
  font-weight: 600;
  display: block;
}

.packageBox h3 {
  color: var(--primary);
  font-weight: 600;
  font-size: 2.5rem;
  text-align: center;
}

.packageBox p {
  font-weight: 700;
  text-align: center;
  line-height: 1;
  margin-top: 10px;
  font-size: 14px;
}

.packageBox .listStyle {
  list-style-type: disc;
  padding-left: 1.5rem;
  /* background: var(--white); */
  border-radius: 10px;
  padding: 1rem 0 0 2rem;
  transition: all 0.5s ease;
  margin: 1rem 0;
  height: 300px;
  overflow: auto;
}

.packageBox .listStyle li {
  padding: 7px 0;
  font-weight: 500;
  line-height: 1;
  color: var(--black);
}

.packageBox .themeBtn {
  text-align: center;
  padding: 15px 5rem;
  background: var(--blue);
  color: var(--white);
}
.themeBtn{
  border: 2px solid var(--white);
  font-size: 1.25rem;
  font-weight: 500;
  padding: 10px 2rem;
  border-radius: 10px;
  box-shadow: 10px 5px 30px #0002;
  display: inline-block;
}

.packageBox .btnSec {
  justify-content: center;
  margin: 0 auto;
}

.packageBox:hover,
.packageBox.active {
  background: var(--blue);
}

.packageBox:hover *,
.packageBox.active * {
  color: var(--white);
}

.packageBox:hover h4,
.packageBox.active h4 {
  border-color: var(--white);
}

.packageBox:hover ul,
.packageBox.active ul {
  background: #0272a2;
}

.packageBox:hover .themeBtn,
.packageBox.active .themeBtn {
  background: var(--white);
  color: var(--blue);
}

.packageBox:hover .listStyle li,
.packageBox.active .listStyle li {
  color: var(--white);
}

.package-name{
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
/* .package-name li{
  font-size: 1.3rem;
  margin-right: 10px;
  font-weight: 500;
} */
.package-name li{
  color: var(--blue);
  padding: 0 20px;
  line-height: 50px;
  display: block;
  border-radius: 50px;
  font-size: 1.3rem;
  margin-right: 10px;
}
.package-name li:hover, .package-name li.current{
  background: var(--blue);
  color: var(--white);
}
#navbarSupportedContent{
  justify-content: start;
}
.tab-container .tab-content{
  display: none;
}
.tab-container .tab-content.current{
  display: inherit;
}

/* ADMIN LOGIN CSS */
.login_container{
  display: flex;
  height: 100%;
  font-family: 'Poppins', sans-serif;
}
.login_container > div{
  width: 50%;
}
.login_container .logo_wrapper{
  background: url(../images/admin/background-img.png) bottom center no-repeat;
}
.login_container .logo_wrapper img{
  
}
.login_container .logo_wrapper .logo{
  padding: 50px 0 0 50px;
}
.login_container .login_wrapper{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 10%;
  background: #EDCF4B;
}
.login_container .login_wrapper .password_wrapper{
  display: flex;
  justify-content: space-between;
  margin: 20px 0 0;
}
.login_container .login_wrapper .password_wrapper a, 
.login_container .login_wrapper .password_wrapper label{
  color: #20305B;
  font-size: 1.1rem;
  
}
.login_container .login_wrapper .password_wrapper a{
  text-decoration: underline;
}
.login_container .login_wrapper h2{
  font-size: 2rem;
  text-align: center;
  font-weight: 700;
  color: #15295C;
}
.login_container .login_wrapper input.login-input{
  width: 100%;
  margin-bottom: 10px;
  padding: 1rem 1.5rem;
  border-radius: 50px;
  border: none;
  background: #15295C;
  color: #fff;
  font-size: 1.3rem;
  font-family: 'Poppins', sans-serif;
}
.login_container .login_wrapper input.login-input::placeholder{
  color: #fff;
}
.login_container .login_wrapper input.login-btn{
  width: 100%;
  background: #78C581;
  border-radius: 50px;
  border: none;
  padding: 0;
  line-height: 50px;
  font-size: 1.3rem;
  margin-top: 50px;
  font-family: 'Poppins', sans-serif;
}

@media (max-width: 1440px){
  .login_container .login_wrapper{
    padding: 0 8%;
  }
  .login_container .login_wrapper h2{
    font-size: 1.7rem;
    margin-bottom: 30px;
  }
  
}
@media (max-width: 1200px){
  .login_container .login_wrapper{
    padding: 0 5%;
  }
  .login_container .login_wrapper h2{
    font-size: 1.5rem;
    margin-bottom: 30px;
  }
}

@media (max-width: 768px){
  .login_container{
    flex-direction: column;
  }
  .login_container .logo_wrapper .logo{
    text-align: center;
    padding: 50px 0 0 0;
  }
  .login_container > div{
    width: 100%;
    height: 100%;
  }
  .login_container .login_wrapper{
    padding: 5% 10%;
  }
  .login_container .login_wrapper .password_wrapper a, 
  .login_container .login_wrapper .password_wrapper label{
    font-size: 1rem;
    font-weight: 500;
  }
}
@media (max-width: 575px){
  .login_container .login_wrapper{
    padding: 10% 5%;
  }
  .login_container .login_wrapper .password_wrapper a, 
  .login_container .login_wrapper .password_wrapper label{
    font-size: .9rem;
  }
}


/* DASHBOARD CSS */
.left_panel{
  position: fixed;
  left: 0;
  top: 0;
  width: 300px;
  background: #15295C url(../images/admin/left_panel_artwork.png) top center no-repeat;
  height: 100%;
  font-family: 'Poppins', sans-serif;
}
.left_panel .logo_wrapper{
  text-align: center;
  padding-top: 50px;
}
.left_panel .menu_bar, .left_panel .account_bar{
  display: flex;
  flex-direction: column;
  margin: 50px 0 0 0;
  height: 55%;
  padding: 0;
}
.left_panel .menu_bar li, .left_panel .account_bar li{
  padding-left: 50px;
  font-size: 1.3rem;
}
.left_panel .menu_bar a, .left_panel .account_bar a{
  color: #fff;
  line-height: 50px;
  text-decoration: none;
  display: block;
}
.left_panel .menu_bar a:hover, .left_panel .account_bar a:hover{
  color: #78C581;
  background: url(../images/admin/yellow_bar.png) center right no-repeat;
}
.left_panel .logout_wrapper{
  padding: 0 0 0 50px;
  font-size: 1.3rem;
}
.left_panel .logout_wrapper a{
  color: #fff;
  text-decoration: none;
  display: block;
}
.left_panel .logout_wrapper a:hover{
  color: #78C581;
  background: url(../images/admin/yellow_bar.png) center right no-repeat;
}


.right_panel{
  padding-left: 350px;
  padding-right: 50px;
  background: url(../images/admin/body_artwork.png) center center no-repeat;
  font-family: 'Poppins', sans-serif;
}
.right_panel .blue_background{
  background: #15295C;
  border-radius: 15px;
  padding: 20px;
  min-height: 300px;
  margin-bottom: 20px;
}
.right_panel .blue_background .box {
  width: 160px;
  margin: auto;
}
.right_panel .blue_background .box h2 {
  display: block;
  text-align: center;
  color: #fff;
}
.right_panel .blue_background .box .chart {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 40px;
  line-height: 160px;
  height: 160px;
  color: #fff;
}
.right_panel .blue_background .box canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  width: 100%;
}

.right_panel .blue_background h3, 
.right_panel .blue_background p{
  color: #EDCF4B;
}
.right_panel .blue_background table{
  color: #EDCF4B;
  font-size: 1.2rem;
  width: 100%;
}
.right_panel .blue_background table td{
  border-bottom: 1px solid #EDCF4B;
}
.right_panel .yellow_background{
  background: #EDCF4B;
  border-radius: 20px;
  border: 1px solid #15295C;
  margin-bottom: 30px;
  font-family: 'Poppins', sans-serif;
  min-height: 300px;
}
.right_panel .yellow_background h3{
  border-bottom: 1px solid #15295C;
  padding: 0 0 0 20px;
  font-size: 2rem;
  line-height: 60px;
  font-weight: 700;
  color: #15295C;
}
.right_panel .yellow_background p{
  font-size: 1.5rem;
  padding: 0 0 0 20px;
  color: #15295C;
  font-weight: 700;
}
.right_panel .yellow_background ul{
  padding: 0;
  margin: 0 10px 10px 20px;
  height: 150px;
  overflow-y:scroll;
  overflow-x:hidden;
  direction: rtl;
}
.right_panel .yellow_background ul li{
  font-size: 1rem;
  font-weight: 600;
}
.right_panel .header_wrapper .header_panel{
  display: flex;
  padding: 20px 0 0 0;
}
.right_panel .header_wrapper .header_panel li{
  position: relative;
}
.right_panel .header_wrapper .header_panel li:first-child{
  width: 60%;
  font-size: 1.7rem;
  font-weight: 600;
  text-transform: capitalize;
}
.right_panel .header_wrapper .header_panel li:first-child i{
  font-size: 1.5rem;
  display: inline-block;
}
.right_panel .header_wrapper .header_panel li:last-child{
  width: 40%;
}
.right_panel .header_wrapper .header_panel li:last-child{
  text-align: right;
}
.right_panel .header_wrapper .header_panel li:last-child .search-wrapper{
  position: relative;
  display: inline-block;
}
.right_panel .header_wrapper .header_panel li input[type=text]{
  position: relative;
  border-radius: 50px;
  border: 1px solid #15295C;
  padding: .5rem 1.1rem;
  width: 100%;
}
.right_panel .header_wrapper .header_panel li input[type=submit]{
  position: absolute;
  z-index: 1;
  top: 4px;
  left: 6px;
  background: #15295C url(../images/admin/search.png) 7px 8px no-repeat;
  border-radius: 50px;
  width: 33px;
  height: 33px;
  border: none;
}
.right_panel .header_wrapper .header_panel li .notify, 
.right_panel .header_wrapper .header_panel li .logout{
  display: inline-block;
}
.right_panel .header_wrapper .header_panel li .dashboard,
.right_panel .header_wrapper .header_panel li .order{
  display: none;
}
.right_panel .header_wrapper .header_panel li .notify a,
.right_panel .header_wrapper .header_panel li .logout a,
.right_panel .header_wrapper .header_panel li .dashboard a,
.right_panel .header_wrapper .header_panel li .order a{
  background: #15295C;
  border-radius: 50px;
  width: 36px;
  height: 36px;
  display: inline-block;
  text-align: center;
  color: #EDCF4B;
  line-height: 36px;
  font-size: 1.2rem;
}


@media (max-width: 1600px){
  .left_panel .menu_bar, .left_panel .account_bar{
    height: 50%;
  }
}

@media (max-width: 1440px){
  .right_panel .header_wrapper .header_panel li{
    width: 50%;
  }
  .right_panel .header_wrapper .header_panel li:last-child{
    /* width: 35%; */
  }
  .right_panel .header_wrapper .header_panel li:last-child{
    text-align: right;
  }
  .left_panel .menu_bar, .left_panel .account_bar{
    height: 45%;
  }
}

@media (max-width: 1200px){
  .right_panel .header_wrapper .header_panel li:first-child{
    width: 40%;
  }
  .right_panel .header_wrapper .header_panel li:last-child{
    width: 60%;
  }
  .right_panel .blue_background p{
    font-size: .9rem;
  }
}

@media (max-width: 992px){
  .left_panel{
    width: 100%;
    position: relative;
    height: auto;
  }
  .left_panel .logo_wrapper{
    text-align: center;
    padding: 20px 0;
  }
  .left_panel .menu_bar, .left_panel .logout_wrapper, .left_panel .account_bar{
    display: none;
  }
  .left_panel .logo_wrapper img{
  }
  .left_panel .menu_bar li, .left_panel .logout_wrapper{
    padding-left: 20px;
    font-size: 1rem;
  }
  .right_panel{
    padding-left: 20px;
    padding-right: 20px;
  }
  .right_panel .header_wrapper .header_panel li .dashboard,
  .right_panel .header_wrapper .header_panel li .order{
    display: inline-block;
  }
  .right_panel .blue_background{
    margin-bottom: 20px;
  }
  .right_panel .blue_background p{
    font-size: .9rem;
  }
  
}

@media (max-width: 768px){
  .right_panel .blue_background{
    margin-bottom: 10px;
  }
  .right_panel .blue_background h3{
    font-size: 1.3rem;
  }
  .right_panel .blue_background p{
    font-size: .9rem;
  }
  .right_panel .yellow_background h3{
    font-size: 1.6rem;
  }
  .right_panel .yellow_background p{
    font-size: 1.4rem;
    color: #000;
    font-weight: 600;
  }
  .right_panel .blue_background table{
    font-size: 1rem;
  }
  .right_panel h2{
    font-size: 1.6rem;
  }
}

@media (max-width: 680px){
  .right_panel .header_wrapper .header_panel{
    flex-direction: column;
  }
  .right_panel .header_wrapper .header_panel li:first-child{
    text-align: right;
    padding: 0 0 10px;
  }
  .right_panel .header_wrapper .header_panel li:first-child,
  .right_panel .header_wrapper .header_panel li:last-child{
    width: 100%;
  }
}

@media (max-width: 480px){
  .right_panel .header_wrapper .header_panel li:last-child .search-wrapper{
    width: 100%;
    margin: 0 0 15px 0;
  }
}
.lpService{
  max-height: 56px;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 10px;
}
.step1 .lpService{
  max-height: 52px;
  min-height: 36px;
  /* height: 48px; */
  border: 1px solid transparent;
  border-radius: 10px;
}


.form-error-label {
    color: red !important;

}