@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
/*START. VARIABLES*/
/*Start. Buttons box Shadows*/
/*End*/
/*Start. color palette*/
/*End*/
/*Start. gray scale*/
/*End*/
/*END*/
body {
  background-color: #FAFCFE;
  font-size: 16px;
  font-weight: 300;
  font-family: "Poppins", sans-serif;
  color: #4B535E;
  overflow-x: hidden;
}

.grayBlob {
  position: absolute;
  top: 0;
  left: 0;
  width: 50vmax;
  z-index: -1;
  -webkit-animation: movebgBlob 20s ease-in-out infinite;
          animation: movebgBlob 20s ease-in-out infinite;
  transform-origin: 50% 50%;
}

@-webkit-keyframes movebgBlob {
  0% {
    transform: scale(1) translate(-100px, -30px);
  }
  38% {
    transform: scale(0.8, 1) translate(80vw, 30vh) rotate(160deg);
  }
  40% {
    transform: scale(0.8, 1) translate(80vw, 30vh) rotate(160deg);
  }
  78% {
    transform: scale(1.3) translate(0vw, 50vh) rotate(-20deg);
  }
  80% {
    transform: scale(1.3) translate(0vw, 50vh) rotate(-20deg);
  }
  100% {
    transform: scale(1) translate(-100px, -30px);
  }
}

@keyframes movebgBlob {
  0% {
    transform: scale(1) translate(-100px, -30px);
  }
  38% {
    transform: scale(0.8, 1) translate(80vw, 30vh) rotate(160deg);
  }
  40% {
    transform: scale(0.8, 1) translate(80vw, 30vh) rotate(160deg);
  }
  78% {
    transform: scale(1.3) translate(0vw, 50vh) rotate(-20deg);
  }
  80% {
    transform: scale(1.3) translate(0vw, 50vh) rotate(-20deg);
  }
  100% {
    transform: scale(1) translate(-100px, -30px);
  }
}
h1, h2, h3, h4, h5, h6 {
  color: #262B30;
}

button:focus {
  outline: 0;
}

/*WIDTHS*/
.width-100 {
  width: 100%;
}

/*START. CONTAINERS AND SECTIONS*/
.st-section {
  padding: 4rem 0;
}

/*START. TITLES*/
.cnt-title {
  text-align: center;
}
.cnt-title h2 {
  margin-bottom: 4rem;
  position: relative;
}
.cnt-title h2 small {
  display: block;
  font-weight: 300;
  color: #4B535E;
  font-size: 1rem;
  margin-top: 1rem;
}
.cnt-title h2::after {
  content: "";
  background-color: #EB593C;
  width: 100%;
  max-width: 58px;
  height: 4px;
  position: absolute;
  bottom: -1rem;
  left: 50%;
  transform: translate(-50%, 0);
}

/*START. BUTTONS*/
.btn {
  border-radius: 20px;
  padding: 8px 16px;
}

.btn.btn-lg {
  border-radius: 26px;
}

.btn.btn-primary {
  background-color: #EB593C;
  border-color: #EB593C;
  box-shadow: 0px 16px 18px -4px rgba(235, 89, 60, 0.4);
}
.btn.btn-primary svg {
  color: #fff;
}
.btn.btn-primary:hover {
  background-color: rgba(235, 89, 60, 0.85);
}

.btn.btn-secondary {
  background-color: #354576;
  border-color: #354576;
  box-shadow: 0px 16px 18px -4px rgba(53, 69, 118, 0.4);
}
.btn.btn-secondary svg {
  color: #fff;
}
.btn.btn-secondary:hover {
  background-color: rgba(53, 69, 118, 0.85);
}

/*END*/
/*START. DROPDOWNS*/
.dropdown-menu {
  background: rgba(250, 252, 254, 0.8);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  border-radius: 20px;
  border: 0;
  box-shadow: 0px 16px 18px -4px rgba(0, 0, 0, 0.2);
}

/*END*/
/*START. ACCORDION*/
.accordion {
  background-color: transparent !important;
  --bs-accordion-bg: transparent;
  --bs-accordion-color:$light-text;
}
.accordion .accordion-item .accordion-header .accordion-button {
  font-size: 1.5rem;
}
.accordion .accordion-item .accordion-header .accordion-button:focus {
  outline: 0;
  border: 0;
  box-shadow: none;
}
.accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  background-color: transparent;
  color: #262B30;
}
.accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
  background-image: var(--bs-accordion-btn-icon);
}

/*START. HEADER*/
.p-header {
  display: unset;
  position: relative;
  z-index: 1999;
}
.p-header .topHeader {
  background: #354576;
  color: #fff;
  font-size: 0.875rem;
  padding: 6px;
}
.p-header .topHeader .nav .nav-item .nav-link {
  padding: 0 8px;
  transition: all 0.25s ease-in;
}
.p-header .topHeader .nav .nav-item .nav-link:hover {
  opacity: 0.6;
}
.p-header .topHeader .nav .nav-item .nav-link img {
  width: 18px;
}
.p-header .topHeader .nav .nav-item .nav-link.disabled {
  padding: 0;
  color: #fff;
}
.p-header .topHeader .nav .nav-item .nav-link.disabled:hover {
  opacity: 1;
}
.p-header .topHeader .dropdown-toggle {
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.p-header .topHeader .dropdown-toggle::after {
  display: none;
}
.p-header .topHeader .dropdown-toggle span {
  margin-right: 8px;
}
.p-header .bottomHeader {
  padding: 8px 0px;
  overflow: inherit;
  transition: all 500ms ease-in;
}
.p-header .bottomHeader .navbar {
  position: unset;
}
.p-header .bottomHeader .navbar .navbar-toggler {
  padding: 0;
  border: 0;
}
.p-header .bottomHeader .navbar .navbar-toggler:focus {
  box-shadow: none;
}
.p-header .bottomHeader .navbar .navbar-collapse .navbar-nav .nav-link.active {
  font-weight: 500;
  color: #EB593C;
}
@media (max-width: 767.98px) {
  .p-header .bottomHeader .navbar .navbar-collapse {
    background: #FAFCFE;
    padding: 1rem;
    position: absolute;
    top: 58px;
    left: 0;
    width: 100%;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    box-shadow: 0px 38px 30px #FAFCFE;
    z-index: -1;
  }
  .p-header .bottomHeader .navbar .navbar-collapse .navbar-nav .nav-link {
    text-align: center;
  }
}
.p-header .bottomHeader .header-logo img {
  width: 100%;
  max-width: 126px;
}
.p-header .bottomHeader .btn-header {
  -webkit-animation: pulse 2s ease-in-out infinite;
          animation: pulse 2s ease-in-out infinite;
}
.p-header .bottomHeader.fixedHeader {
  background-color: #FAFCFE;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  box-shadow: 0px 18px 20px rgba(255, 255, 255, 0.6);
}

/*END. HEADER*/
.homeBanner {
  width: 100%;
  min-height: calc(100vh - 108px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.homeBanner .lightYellowBlob {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  right: 0;
  z-index: -1;
}
.homeBanner h1, .homeBanner h2, .homeBanner p {
  font-weight: 400;
}
.homeBanner h1 {
  font-size: 3rem;
  color: #EB593C;
}
.homeBanner h2 {
  font-size: 4.5rem;
}
.homeBanner h2 strong {
  font-weight: 600;
}
.homeBanner p {
  font-size: 1.5rem;
}
.homeBanner .designTools {
  max-width: 100%;
  display: block;
}

.my-picture {
  position: relative;
  width: 100%;
  max-width: 470px;
  margin: 0 auto;
}
.my-picture .my-picture-img {
  width: 100%;
  max-width: 470px;
}
.my-picture .my-picture-card {
  position: absolute;
  width: 200px;
  right: -14px;
  bottom: 40px;
  -webkit-animation: fadeInUp 500ms ease-in;
  animation: fadeInUp 500ms ease-in;
}
@media (max-width: 575.98px) {
  .my-picture .my-picture-card {
    width: 160px;
  }
}
.my-picture .my-picture-yBlob {
  position: absolute;
  width: 200px;
  left: -14px;
  bottom: 5%;
  -webkit-animation: rotate-center 30s ease-in infinite;
  animation: rotate-center 30s ease-in infinite;
}
@media (max-width: 575.98px) {
  .my-picture .my-picture-yBlob {
    width: 158px;
  }
}
.my-picture .my-picture-oBlob {
  position: absolute;
  width: 100px;
  right: -14px;
  top: 35%;
  -webkit-animation: swing 10s ease-in-out infinite;
  animation: swing 10s ease-in-out infinite;
}
@media (max-width: 575.98px) {
  .my-picture .my-picture-oBlob {
    width: 80px;
  }
}
@-webkit-keyframes rotate-center {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.box-tags {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}
.box-tags span {
  font-size: 0.875rem;
  border-radius: 20px;
  padding: 4px 16px;
  border: 1px solid #dfe2e7;
}

/*START. BOX LANGUAGES*/
.box-languages {
  border-radius: 20px;
  padding: 24px;
  border: 1px solid #dfe2e7;
}
.box-languages h3 {
  font-size: 1rem;
  font-weight: 300;
  color: #707884;
}
.box-languages .item-languange {
  margin-bottom: 0.5rem;
}
.box-languages .item-languange:last-child {
  margin-bottom: 0;
}
.box-languages .item-languange p:last-child {
  margin-bottom: 0;
  font-weight: 500;
  color: #262B30;
}
.box-languages .item-languange p small {
  display: block;
  font-weight: 300;
  color: #4B535E;
}
.box-languages .item-languange .cont-rating {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}
.box-languages .item-languange .cont-rating span {
  background-color: #C9CCD2;
  width: 16px;
  height: 16px;
  margin: 0 4px;
  border-radius: 20px;
}
.box-languages .item-languange .cont-rating span:first-of-type {
  margin-left: 0;
}
.box-languages .item-languange .cont-rating span:last-of-type {
  margin-right: 0;
}
.box-languages .item-languange .cont-rating span.active {
  background-color: #96abd2;
  box-shadow: 0px 8px 8px -2px rgba(150, 171, 210, 0.6);
}

.sc-services .services-item {
  border: 1px solid #dfe2e7;
  padding: 24px;
  border-radius: 20px;
}
.sc-services .services-item .services-sprIcon {
  background-color: rgba(53, 69, 118, 0.2);
  display: flex;
  width: 100px;
  height: 100px;
  border-radius: 50px;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  box-shadow: 0px 22px 20px -16px rgba(53, 69, 118, 0.4);
}
.sc-services .services-item .services-sprIcon svg {
  color: #354576;
  width: 48px;
  height: 48px;
}
.sc-services .services-item h4 {
  font-size: 1.5rem;
  font-weight: 500;
}

/*START. CUSTOM SWIPER*/
.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #EB593C;
}

/*START. SERVICE SWIPERS*/
.services-swiper .swiper-wrapper {
  align-items: stretch;
}
.services-swiper .swiper-wrapper .swiper-slide {
  border: 1px solid #dfe2e7;
  padding: 24px;
  border-radius: 20px;
  height: initial;
}
.services-swiper .swiper-wrapper .swiper-slide .services-sprIcon {
  background-color: rgba(53, 69, 118, 0.2);
  display: flex;
  width: 100px;
  height: 100px;
  border-radius: 50px;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
  box-shadow: 0px 22px 20px -16px rgba(53, 69, 118, 0.4);
}
.services-swiper .swiper-wrapper .swiper-slide .services-sprIcon svg {
  color: #354576;
  width: 48px;
  height: 48px;
}
.services-swiper .swiper-wrapper .swiper-slide h4 {
  font-size: 1.5rem;
  font-weight: 500;
}

/*START. MY PORTFOLIO SWIPERS*/
.myportfolio-swiper .swiper-wrapper {
  align-items: stretch;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide {
  background-color: #FAFCFE;
  border: 1px solid #dfe2e7;
  padding: 24px;
  border-radius: 20px;
  height: initial;
  overflow: hidden;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide .myportfologio-img {
  position: relative;
  overflow: hidden;
  margin: -24px -24px 24px;
  aspect-ratio: 5/3;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide .myportfologio-img::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  background-color: rgba(53, 69, 118, 0.4);
  transition: all 500ms ease-in;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide .myportfologio-img img {
  width: 100%;
  filter: grayscale(90%);
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  margin: auto;
  transition: all 500ms ease-in;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide .portfolio-infobox h5 {
  margin-bottom: 0;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide .portfolio-infobox h5 small {
  display: block;
  color: #EB593C;
  font-size: 0.875rem;
  font-weight: 300;
  margin-top: 0.5rem;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide:hover .myportfologio-img::after {
  top: initial;
  height: 0%;
  background-color: #354576;
}
.myportfolio-swiper .swiper-wrapper .swiper-slide:hover .myportfologio-img img {
  filter: grayscale(10%);
}

.st-contact .reply-time {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
}
.st-contact .reply-time .onlineIndicator {
  background-color: #2aec7a;
  width: 12px;
  height: 12px;
  border-radius: 7px;
  margin-right: 8px;
  box-shadow: 0px 8px 8px -2px rgba(42, 236, 122, 0.6);
}
.st-contact .cnt-map {
  border-radius: 20px;
  width: 100%;
  overflow: hidden;
  box-shadow: 0px 40px 30px -20px rgba(0, 0, 0, 0.15);
}
.st-contact .cnt-map img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  margin: auto;
}
.st-contact .contact-extrainfo .contact-extrainfo-item h5 {
  color: #4B535E;
}
.st-contact .contact-extrainfo .contact-extrainfo-item p {
  color: #262B30;
}

footer {
  padding: 0.5rem 0 2rem;
  text-align: center;
  font-size: 0.75rem;
  color: #4B535E;
}/*# sourceMappingURL=styles.css.map */