/* First Things first */
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "DM Sans", sans-serif;
}

body {
  background: linear-gradient(180deg, #3A1C71 0%, #e0be25 100%);
}

:root {
  --cotton-candy-pink: #ff76cf;
  --cotton-candy-pink-shade: #ff76cf3d;
  --off-white-color: #f9f9f9;
  --main-element-border: .75px solid rgba(255, 255, 255, 0.308);
  --golden-yellow-color: #e0be25;
}

body, a, i {
  color: #f9f9f9;
}

a {
  text-decoration: none;
  width: -moz-max-content;
  width: max-content;
  font-weight: 400;
  color: var(--off-white-color);
}

ul {
  display: flex;
  list-style-type: none;
}

span {
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500;
}

p {
  font-weight: 300;
}

div, img {
  border: var(--main-element-border);
}

img {
  -o-object-fit: contain;
     object-fit: contain;
}

/* Section Styling */
section {
  display: flex;
  width: 100%;
  height: 100%;
  background-color: var(--cotton-candy-pink-shade);
}

.sectionHeader {
  display: flex;
  margin: 2vh;
}
.sectionHeader .sectionHeader__Left {
  padding: 1vh 2vh 2vh;
  margin: 2vh;
  border: var(--main-element-border);
}
.sectionHeader .sectionHeader__Left a, .sectionHeader .sectionHeader__Left h4 {
  width: 100%;
  height: 100%;
  font-size: 14px;
}
.sectionHeader .sectionHeader__Left h4 {
  padding-top: 1vh;
}
.sectionHeader .sectionHeader__Center {
  overflow: hidden;
  display: flex;
  align-items: center;
  margin: 2vh;
}
.sectionHeader .sectionHeader__Center .marqueeEffect {
  display: flex;
  align-items: center;
  -webkit-mask-image-: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 12.5%, rgb(0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 100%);
  animation: marquee 10s infinite linear;
  /* Marquee Animation */
}
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-25%);
  }
  50% {
    transform: translateX(-50%);
  }
  75% {
    transform: translateX(-75%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.sectionHeader .sectionHeader__Center .marqueeEffect li {
  padding: 2vh;
  flex-shrink: 0;
  width: 150%;
}
.sectionHeader .sectionHeader__Center .marqueeEffect li:nth-child(2) {
  margin-left: -39vh;
}
.sectionHeader .sectionHeader__Right {
  border: none;
  padding: 1vh 10vh;
  position: relative;
  margin: 2vh;
}
.sectionHeader .sectionHeader__Right .BothSwiperArrows {
  display: flex;
  flex-direction: column;
  width: 45px;
  height: 45px;
  text-align: center;
  padding-top: 1.8vh;
  position: absolute;
  top: 0.3vh;
  right: 3vh;
  border: var(--main-element-border);
  cursor: pointer;
  box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}
.sectionHeader .sectionHeader__Right .BothSwiperArrows:hover {
  color: var(--off-white-color);
  border-color: var(--main-element-border);
}
.sectionHeader .sectionHeader__Right .BothSwiperArrows::after {
  content: "";
}
.sectionHeader .sectionHeader__Right .BothSwiperArrows i {
  transition: transform 0.4s ease-in-out;
}
.sectionHeader .sectionHeader__Right .BothSwiperArrows i:nth-child(1) {
  padding-bottom: 20px;
  padding-top: 3px;
}
.sectionHeader .sectionHeader__Right .button-prev {
  right: 12vh;
}

.sectionMainMargin {
  margin: 2vh;
}

.sectionMainPadding {
  padding: 2vh;
}

/* Link Button Effect */
.button-effect-inner,
.button-effect-text {
  display: inline-block;
  width: -moz-max-content;
  width: max-content;
}

.button-effect-inner {
  height: 1.75em;
  overflow: hidden;
  position: relative;
}

.button-effect-text {
  line-height: 2;
  transition: transform 0.4s ease-out;
  font-size: 14px;
  padding-top: 3px;
}

.button-effect-text::after {
  content: attr(data-effect);
  display: block;
  color: var(--cotton-candy-pink);
}

.button-effect:hover .button-effect-text {
  transform: translateY(-50%);
}

/* OnlineAnim Animation */
@keyframes onlineAnim {
  0% {
    opacity: 1;
    padding: 1px;
    left: -5px;
  }
  25% {
    opacity: 0.75;
    padding: 2.25px;
    left: -6px;
  }
  50% {
    opacity: 0.5;
    padding: 3.5px;
    left: -7px;
  }
  50% {
    opacity: 0.25;
    padding: 4.75px;
    left: -8px;
  }
  100% {
    opacity: 0;
    padding: 5px;
    left: -9px;
  }
}
/* Scroll to Top Button */
#topBtn {
  z-index: 10;
  cursor: pointer;
  transition: 0.5s ease-in-out;
}
#topBtn:hover {
  color: #f9f9f9;
}

header {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: fixed;
  left: 18px;
  top: 18px;
  width: 320px;
  height: 96vh;
  border-color: rgba(49, 53, 55, 0.05);
  background-color: var(--cotton-candy-pink-shade);
  padding: 34px 15px 24px;
}
header .headerTop {
  display: flex;
  flex-direction: column;
  gap: 2vh;
  border: none;
}
header .headerTop .headerTop__Top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  border: none;
}
header .headerTop .headerTop__Top a {
  display: flex;
  align-items: center;
  gap: 2vh;
}
header .headerTop .headerTop__Top a img {
  padding: 2vh;
}
header .headerTop .headerTop__Bottom {
  display: flex;
  align-items: center;
  gap: 2vh;
  margin-top: 2vh;
  padding: 27px 0 27px 15px;
}
header .headerTop .headerTop__Bottom img {
  width: 15vh;
  height: 15vh;
  -o-object-fit: contain;
     object-fit: contain;
}
header .headerTop .headerTop__Bottom .headerTop__BottomText {
  display: flex;
  flex-direction: column;
  gap: 1vh;
  border: none;
}
header .headerTop .headerTop__Bottom .headerTop__BottomText span {
  display: flex;
  align-items: center;
  gap: 1vh;
}
header nav ul {
  display: flex;
  flex-direction: column;
}
header nav ul li a {
  display: flex;
  align-items: center;
  gap: 1.5vh;
  width: 100%;
  padding: 2vh;
}
header nav ul li a i {
  width: 3vh;
  height: 3vh;
  text-align: center;
  padding: 1px;
}
header nav ul li .pageActive {
  border: var(--main-element-border);
}

main {
  position: relative;
  left: 55vh;
  width: 150vh;
  height: 100%;
  padding: 3.1vh 1vh;
}
main #Intro {
  display: flex;
  align-items: center;
  padding-right: 2vh;
}
main #Intro #hero {
  width: 40vh;
  height: 40vh;
  margin: 2vh;
  border: none;
}
main #Intro .introRight {
  width: 100%;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 1vh;
}
main #Intro .introRight .introRight__Top {
  display: flex;
  justify-content: space-between;
  padding: 1vh 2vh;
  gap: 1vh;
}
main #Intro .introRight .introRight__Top .introRight__TopLeft {
  display: flex;
  align-items: center;
  gap: 1vh;
  padding: 1vh 3vh 1vh 3vh;
}
main #Intro .introRight .introRight__Top .introRight__TopLeft a {
  display: flex;
  align-items: center;
  gap: 2vh;
  font-size: 14px;
  color: var(--off-white-color);
}
main #Intro .introRight .introRight__Top .introRight__TopLeft a span {
  width: 6px;
  height: 6px;
  background-color: #00A34C;
  border-radius: 50%;
  position: relative;
}
main #Intro .introRight .introRight__Top .introRight__TopLeft a span::before {
  content: "";
  background-color: rgb(0, 163, 76);
  position: absolute;
  top: -7px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  animation: onlineAnim 1s infinite linear;
}
main #Intro .introRight .introRight__Top .introRight__TopCenter {
  display: flex;
  align-items: center;
  gap: 1vh;
  padding: 1vh 4vh 1vh 4vh;
}
main #Intro .introRight .introRight__Top .introRight__TopCenter i {
  color: var(--cotton-candy-pink);
}
main #Intro .introRight .introRight__Top .introRight__TopCenter span {
  font-size: 14px;
  color: var(--off-white-color);
}
main #Intro .introRight .introRight__Top .introRight__TopRight {
  display: flex;
  align-items: center;
  color: white;
  gap: 1vh;
  padding: 1vh 7vh 1vh 7vh;
}
main #Intro .introRight .introRight__Bottom {
  display: flex;
  gap: 1vh;
  border: none;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomLeft {
  display: flex;
  flex-direction: column;
  flex-basis: 50%;
  padding: 2vh;
  gap: 1vh;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomLeft span {
  font-size: 14px;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomLeft h1 {
  font-size: 23px;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomLeft p {
  font-size: 14px;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight {
  display: flex;
  flex-direction: column;
  flex-basis: 50%;
  padding: 1vh 3vh 1vh 3vh;
  overflow: hidden;
  height: 100%;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight .introRight__BottomRight__Top {
  display: flex;
  justify-content: space-around;
  border: none;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight .introRight__BottomRight__Top span {
  color: var(--off-white-color);
  border: var(--main-element-border);
  padding: 1vh 4vh 1vh 4vh;
  font-size: 14px;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight .introRight__BottomRight__Top span:nth-child(2) {
  display: flex;
  align-items: center;
  gap: 1vh;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight .introRight__BottomRight__Bottom {
  width: 100%;
  height: 20vh;
  border: none;
  position: relative;
}
main #Intro .introRight .introRight__Bottom .introRight__BottomRight .introRight__BottomRight__Bottom img {
  width: 55vh;
  height: 45vh;
  border: none;
  position: absolute;
  top: 2vh;
  left: -3vh;
}
main .Projects {
  flex-direction: column;
}
main .Projects span {
  width: 100%;
}
main .Projects .marqueeEffect li:nth-child(2) {
  margin-left: -4vh !important;
}
main .Projects .projectsHeader__Left {
  width: 35vh;
}
main .Projects .projectsHeader__Center .marqueeEffect li {
  width: 155%;
}
main .Projects .projectsMain {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 97.3%;
  border: none;
}
main .Projects .projectsMain .projectsMain__Cards {
  display: flex;
  gap: 2vh;
  width: 100%;
  border: none;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card {
  display: flex;
  flex-direction: column;
  gap: 2vh;
  width: 25%;
  padding: 1vh 1vh 0;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card img {
  width: 44vh;
  padding-top: 1vh;
  padding-left: 1.4vh;
  border: none;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink {
  display: flex;
  flex-direction: column;
  border: none;
  padding: 0 5px 15px 10px;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 98%;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a:hover {
  color: var(--golden-yellow-color) !important;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a .projectsMain__CardArrows {
  display: flex;
  flex-direction: column;
  width: 5vh;
  height: 5vh;
  gap: 1.5vh;
  overflow: hidden;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a .projectsMain__CardArrows i {
  text-align: center;
  font-size: 16px;
  transition: 0.1s ease-in-out;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a .projectsMain__CardArrows i:nth-child(1) {
  padding-top: 1vh;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink a .projectsMain__CardArrows:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .Projects .projectsMain .projectsMain__Cards .projectsMain__Card .projectsMain__CardLink span {
  font-size: 13px;
}
main .Partners {
  flex-direction: column;
  align-items: center;
}
main .Partners .partnersMain__Images {
  border: var(--main-element-border);
  padding: 2vh;
  margin: 2vh;
  overflow: hidden;
  width: 97.3%;
}
main .Partners .partnersMain__Images li {
  margin: 1vh;
  height: 100%;
}
main .Partners .partnersMain__Images li img {
  animation: marquee 10s infinite linear;
  padding: 2vh;
  width: 25vh;
  height: 15vh;
}
main .Partners .partnersMain__Info {
  justify-content: space-between;
  width: 100%;
  gap: 5vh;
}
main .Partners .partnersMain__Info li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 2vh;
  width: 20vw;
  padding: 2vh;
  border: var(--main-element-border);
}
main #EducationAndExperience {
  display: flex;
  justify-content: space-between;
  padding: 2vh;
}
main #EducationAndExperience .education, main #EducationAndExperience .experience {
  width: 49%;
  display: flex;
  flex-direction: column;
}
main #EducationAndExperience .education .educationHeader, main #EducationAndExperience .education .experienceHeader, main #EducationAndExperience .experience .educationHeader, main #EducationAndExperience .experience .experienceHeader {
  width: -moz-max-content;
  width: max-content;
  padding: 1vh 2vh 2vh;
  margin: 2vh;
  border: var(--main-element-border);
}
main #EducationAndExperience .education .educationHeader h4, main #EducationAndExperience .education .experienceHeader h4, main #EducationAndExperience .experience .educationHeader h4, main #EducationAndExperience .experience .experienceHeader h4 {
  padding-top: 0.5vh;
}
main #EducationAndExperience .education .educationMain, main #EducationAndExperience .education .experienceMain, main #EducationAndExperience .experience .educationMain, main #EducationAndExperience .experience .experienceMain {
  flex-direction: column;
}
main #EducationAndExperience .education .educationMain li, main #EducationAndExperience .education .experienceMain li, main #EducationAndExperience .experience .educationMain li, main #EducationAndExperience .experience .experienceMain li {
  display: flex;
}
main #EducationAndExperience .education .educationMain li img, main #EducationAndExperience .education .experienceMain li img, main #EducationAndExperience .experience .educationMain li img, main #EducationAndExperience .experience .experienceMain li img {
  width: 15vh;
  height: 15vh;
  padding: 2vh;
  border-left: none;
}
main #EducationAndExperience .education .educationMain li .educationAndExperience__Text, main #EducationAndExperience .education .experienceMain li .educationAndExperience__Text, main #EducationAndExperience .experience .educationMain li .educationAndExperience__Text, main #EducationAndExperience .experience .experienceMain li .educationAndExperience__Text {
  padding-left: 2vh;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-right: none;
}
main #Services {
  flex-direction: column;
  justify-content: center;
}
main #Services .serviceHeader .sectionHeader__Center {
  width: 150%;
}
main #Services #serviceCards {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 1vh 2vh;
}
main #Services #serviceCards .serviceCard {
  display: flex;
  flex-wrap: wrap;
  width: 48%;
  height: 100%;
  border: var(--main-element-border);
  margin: 8px;
  transition: 0.15s ease-in-out;
}
main #Services #serviceCards .serviceCard:hover {
  border-color: var(--golden-yellow-color);
}
main #Services #serviceCards .serviceCard .serviceCard__TextAndImage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: none;
  margin: 2vh;
  width: 100%;
  height: 100%;
}
main #Services #serviceCards .serviceCard .serviceCard__TextAndImage .serviceCard__Text {
  display: flex;
  flex-direction: column;
  border: none;
}
main #Services #serviceCards .serviceCard .serviceCard__TextAndImage .serviceCard__Text p {
  font-size: 14px;
}
main #Services #serviceCards .serviceCard .serviceCard__TextAndImage i {
  color: white;
}
main #Services #serviceCards .serviceCard span {
  margin: 2vh;
  font-size: 14px;
}
main #Stack {
  flex-direction: column;
}
main #Stack .sectionHeader__Center li:nth-child(2) {
  margin-left: -43vh;
}
main #Stack .stackMain {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 3vh;
  border: none;
}
main #Stack .stackMain .stackMain__Card {
  display: flex;
  flex-basis: 47.8%;
  align-items: center;
}
main #Stack .stackMain .stackMain__Card img {
  width: 15vh;
  height: 15vh;
  padding: 2vh;
  border: none;
}
main #Stack .stackMain .stackMain__Card .stackMain__CardText {
  display: flex;
  flex-direction: column;
  border: none;
}
main #Stack .stackMain .stackMain__Card .stackMain__CardText a {
  font-size: 16px;
  transition: 0.1s ease-in-out;
}
main #Stack .stackMain .stackMain__Card .stackMain__CardText a:hover {
  color: var(--golden-yellow-color) !important;
}
main #Stack .stackMain .stackMain__Card .stackMain__CardText p {
  font-size: 14px;
}
main #Blog {
  flex-direction: column;
}
main #Blog .sectionHeader__Left .button-effect-inner {
  height: 4.1vh;
}
main #Blog .sectionHeader__Center li:nth-child(2) {
  margin-left: -46vh;
}
main #Blog .blogMain {
  display: flex;
  justify-content: space-between;
  padding: 2vh;
  margin: 1vh 2vh;
}
main #Blog .blogMain a:hover h4 {
  color: var(--golden-yellow-color) !important;
}
main #Blog .blogMain a:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main #Blog .blogMain a .blogMain__Card {
  width: 100%;
  padding: 2vh;
  display: flex;
  flex-direction: column;
}
main #Blog .blogMain a .blogMain__Card img {
  width: 40vh;
  height: 40vh;
  border: none;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: none;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow .blogMain__CardTextAndArrow__Text {
  display: flex;
  flex-direction: column;
  border: none;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow .blogMain__CardTextAndArrow__Arrow {
  display: flex;
  flex-direction: column;
  width: 5vh;
  height: 5vh;
  gap: 1.5vh;
  overflow: hidden;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow .blogMain__CardTextAndArrow__Arrow i {
  text-align: center;
  font-size: 16px;
  transition: 0.1s ease-in-out;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow .blogMain__CardTextAndArrow__Arrow i:nth-child(1) {
  padding-top: 1.1vh;
}
main #Blog .blogMain a .blogMain__Card .blogMain__CardTextAndArrow .blogMain__CardTextAndArrow__Arrow:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .Testimonial {
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
main .Testimonial .testimonialHeader {
  justify-content: space-between;
}
main .Testimonial .testimonialCards {
  display: flex;
  margin: 1vh 2vh;
}
main .Testimonial .testimonialCards .testimonialCard {
  display: flex;
  flex-direction: column;
  flex-basis: 50%;
}
main .Testimonial .testimonialCards .testimonialCard .testimonialCard__Top {
  display: flex;
  border: none;
}
main .Testimonial .testimonialCards .testimonialCard .testimonialCard__Top .testimonialHero {
  width: 12vh;
  height: 13vh;
  padding: 1vh;
}
main .Testimonial .testimonialCards .testimonialCard .testimonialCard__Top .testimonialCard__TopTextWithImage {
  width: 82.2%;
  display: flex;
  align-items: center;
  border: none;
}
main .Testimonial .testimonialCards .testimonialCard .testimonialCard__Top .testimonialCard__TopTextWithImage .testimonialCard__TopText {
  padding: 2.3vh;
  display: flex;
  flex-direction: column;
  gap: 1vh;
  width: 75% !important;
}
main .Testimonial .testimonialCards .testimonialCard .testimonialCard__Top .testimonialCard__TopTextWithImage .testimonialIcon {
  width: 12vh;
  height: 13vh;
  padding: 2vh;
}
main .Testimonial .testimonialCards .testimonialCard p {
  width: 94.1% !important;
  border: var(--main-element-border);
  padding: 2vh;
}
main .Gallery {
  flex-direction: column;
  overflow: hidden;
}
main .Gallery .galleryImages {
  width: 100%;
}
main .Gallery .galleryImages .galleryImage {
  width: 25vh;
}
main #Contact {
  flex-direction: column;
}
main #Contact .contactMain {
  display: flex;
  justify-content: space-between;
  border: none;
}
main #Contact .contactMain form {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 2vh;
  padding: 25px;
  border: var(--main-element-border);
}
main #Contact .contactMain form input, main #Contact .contactMain form textarea, main #Contact .contactMain form button {
  width: 100%;
  padding: 17px 13px;
  margin-bottom: 24px;
  background: none;
  border: var(--main-element-border);
}
main #Contact .contactMain form input::-moz-placeholder, main #Contact .contactMain form textarea::-moz-placeholder {
  color: black;
}
main #Contact .contactMain form input::placeholder, main #Contact .contactMain form textarea::placeholder {
  color: black;
}
main #Contact .contactMain form button {
  cursor: pointer;
  transition: 0.3s ease-in-out;
}
main #Contact .contactMain form button:hover {
  border-color: black;
}
main #Contact .contactMain .contactInfo {
  max-width: 389px;
  width: 100%;
  padding: 14px 14px 18px 14px;
  margin: 2vh;
  display: flex;
  flex-direction: column;
  gap: 5vh;
}
main #Contact .contactMain .contactInfo .sectionHeader__Left {
  width: -moz-max-content;
  width: max-content;
  margin-top: 2.1vh;
}
main #Contact .contactMain .contactInfo .sectionHeader__Left h4 {
  padding: 15px;
  width: 15vh;
}
main #Contact .contactMain .contactInfo .contactInfo__Cards {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  gap: 5vh;
  border: none;
}
main #Contact .contactMain .contactInfo .contactInfo__Cards .contactInfo__Card {
  display: flex;
  border: none !important;
  gap: 2vh;
}
main #Contact .contactMain .contactInfo .contactInfo__Cards .contactInfo__Card .contactInfo__Icon {
  height: 10vh;
}
main #Contact .contactMain .contactInfo .contactInfo__Cards .contactInfo__Card .contactInfo__Icon i {
  width: 9vh;
  padding: 3.5vh 3vh;
  color: white;
}
main #Contact .contactMain .contactInfo .contactInfo__Cards .contactInfo__Card .contactInfo__CardText {
  display: flex;
  flex-direction: column;
  padding: 2vh;
  width: 100%;
}

footer {
  position: relative;
  left: 55vh;
  width: 150vh;
  height: 100%;
  padding: 3.1vh 1vh;
  border: none;
  display: flex;
  justify-content: space-between;
}
footer div {
  border: none;
}
footer a:hover {
  color: white !important;
}

main .ProjectsPage,
main .GalleryPage {
  flex-direction: column;
}
main .ProjectsPage .projectsPageMain__Cards,
main .ProjectsPage .galleryMain,
main .GalleryPage .projectsPageMain__Cards,
main .GalleryPage .galleryMain {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1vh;
  margin: 1vh 2vh;
}
main .ProjectsPage .projectsPageMain__Cards .galleryImage,
main .ProjectsPage .galleryMain .galleryImage,
main .GalleryPage .projectsPageMain__Cards .galleryImage,
main .GalleryPage .galleryMain .galleryImage {
  width: 30vh;
  height: 35vh;
  padding: 1vh;
  margin: 2vh;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card,
main .ProjectsPage .galleryMain .projectsPageMain__Card,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card,
main .GalleryPage .galleryMain .projectsPageMain__Card {
  width: 45vh;
  padding: 1vh;
  margin: 1vh;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card img,
main .ProjectsPage .galleryMain .projectsPageMain__Card img,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card img,
main .GalleryPage .galleryMain .projectsPageMain__Card img {
  width: 40vh;
  height: 40vh;
  padding-left: 2vh;
  border: none;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink {
  display: flex;
  flex-direction: column;
  border: none;
  padding: 0 2vh 3vh;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 98%;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a:hover,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a:hover,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a:hover,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a:hover {
  color: var(--golden-yellow-color) !important;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a:hover i,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a:hover i,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a:hover i,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow {
  display: flex;
  flex-direction: column;
  width: 5vh;
  height: 5vh;
  gap: 1.5vh;
  overflow: hidden;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i {
  text-align: center;
  font-size: 16px;
  transition: 0.2s ease-in-out;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i:nth-child(1),
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i:nth-child(1),
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i:nth-child(1),
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow i:nth-child(1) {
  padding-top: 1vh;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow:hover i,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow:hover i,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow:hover i,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink a .projectsPageMain__CardArrow:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .ProjectsPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink span,
main .ProjectsPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink span,
main .GalleryPage .projectsPageMain__Cards .projectsPageMain__Card .projectsPageMain__CardLink span,
main .GalleryPage .galleryMain .projectsPageMain__Card .projectsPageMain__CardLink span {
  color: var(--light-gray-color);
  font-size: 13px;
}
main .GalleryPage .marqueeEffect li:nth-child(2) {
  margin-left: -41vh !important;
}
main #StayUpToDate {
  flex-direction: column;
}
main #StayUpToDate .stayUpToDateHeader__Left {
  width: 60vh;
}
main #StayUpToDate .stayUpToDateMain {
  display: flex;
  justify-content: space-evenly;
  margin: 0 2vh;
  padding: 2vh 0;
}
main #StayUpToDate .stayUpToDateMain input,
main #StayUpToDate .stayUpToDateMain button {
  width: 48%;
  padding: 12px 10px;
  background: none;
  border: var(--main-element-border);
  transition: 0.3s ease-in-out;
}
main #StayUpToDate .stayUpToDateMain input:hover,
main #StayUpToDate .stayUpToDateMain button:hover {
  color: black;
  border-color: black;
}
main #StayUpToDate .stayUpToDateMain input::-moz-placeholder {
  color: #f9f9f9;
}
main #StayUpToDate .stayUpToDateMain input::placeholder {
  color: #f9f9f9;
}
main #StayUpToDate .stayUpToDateMain button {
  cursor: pointer;
  color: #f9f9f9;
}
main #StayUpToDate .partnersInfo {
  justify-content: space-between;
  width: 100%;
  gap: 5vh;
}
main #StayUpToDate .partnersInfo li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 2vh;
  width: 20vw;
  padding: 2vh;
  border: var(--main-element-border);
}
main .contactMain .contactPageForm input::-moz-placeholder, main .contactMain .contactPageForm textarea::-moz-placeholder {
  color: #f9f9f9 !important;
}
main .contactMain .contactPageForm input::placeholder,
main .contactMain .contactPageForm textarea::placeholder {
  color: #f9f9f9 !important;
}
main .contactMain .contactPageForm button {
  color: #f9f9f9;
}
main .contactMain .contactPageForm button:hover {
  color: black;
}
main .blogPageMain {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  padding: 2vh;
  margin: 1vh 2vh;
}
main .blogPageMain a:hover h4 {
  color: var(--golden-yellow-color) !important;
}
main .blogPageMain a:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}
main .blogPageMain a:hover .blogPageMain__Card {
  border-color: var(--golden-yellow-color);
}
main .blogPageMain a .blogPageMain__Card {
  width: 68vh;
  display: flex;
  flex-direction: column;
  gap: 1vh;
  padding: 2vh;
  transition: 0.3s ease-in-out;
  margin: 6px;
}
main .blogPageMain a .blogPageMain__Card img {
  width: 63.5vh;
  height: 34vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__Header {
  display: flex;
  gap: 2vh;
  border: none;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__Header span {
  border: var(--main-element-border);
  padding: 5px 8px;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding: 2vh 0;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardText {
  display: flex;
  flex-direction: column;
  width: 90%;
  border: none;
  padding: 2vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardText h4 {
  border-bottom: var(--main-element-border);
  padding-bottom: 2vh;
  margin-top: -1vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardText p {
  padding-top: 3vh;
  margin-bottom: -1vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardArrow {
  display: flex;
  flex-direction: column;
  margin-bottom: 6vh !important;
  margin: 2vh;
  overflow: hidden;
  width: 5vh;
  height: 5vh;
  gap: 1.5vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardArrow i {
  text-align: center;
  font-size: 16px;
  transition: 0.1s ease-in-out;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardArrow i:nth-child(1) {
  padding-top: 1vh;
}
main .blogPageMain a .blogPageMain__Card .blogPageMain__CardTextAndArrow .blogPageMain__CardArrow:hover i {
  transform: translateY(-3.7vh);
  color: var(--golden-yellow-color) !important;
}/*# sourceMappingURL=style.css.map */